新增客户弹窗

pages/admin/Hetong/components/addKh.vue

@@ -1,26 +1,52 @@
 <template>
   <uni-popup ref="popupRef" type="bottom" background-color="#fff" :is-mask-click="false" :mask-click="false">
-    <view class="ht-qm-popup">
-      <view class="phone-navBar-box">
-        <view @click="goback2" class="nav-bar-icon"></view>
-        <text>添加客户</text>
-      </view>
-
+    <view class="admin-kehu-info">
+    	<view class="icon-title-navBar-box">
+    		<view @click="goUpPage" class="nav-bar-icon"></view>
+    		<text class="nav-bar-title">新增家政客户</text>
+    	</view>
+    	<view>
+    		<view class="form-label-input">
+    			<view class="phone-form-label"><text class="form-label-require">*</text>姓名</view>
+    			<uni-easyinput v-model="formData.realName"
+    				placeholder="请输入姓名" />
+    		</view>
+    		
+    		<view class="form-label-input">
+    			<view class="phone-form-label"><text class="form-label-require">*</text>手机号</view>
+    			<uni-easyinput type="number" v-model="formData.userName"
+    				placeholder="请输入手机号" maxlength="11" />
+    		</view>
+    		<view class="form-label-input">
+    			<view class="phone-form-label">
+    				<text class="form-label-require"></text>
+    				<text v-if="formData.idtype ==1">身份证号</text>
+    				<text v-if="formData.idtype ==2">护照号</text>
+    				<icon @click="idCardChange" class="change-icon">切换</icon>
+    			</view>
+    			<uni-easyinput :disabled="!statusFlag && status=='edit'" @blur="idCardBlur" v-model="formData.idcard"
+    				placeholder="请输入身份证号或护照号" maxlength="18" />
+    		</view>
+    		<view class="form-label-input flex-start-row">
+    			<view class="phone-form-label"><text class="form-label-require"></text>具体地址</view>
+    			<textarea v-model="jingli" maxlength="-1" placeholder="请填写具体地址" class="form-textarea-box" />
+    		</view>
+    	</view>
+    	<button type="default" class="phone-green-btn info-btn" @click="saveBtn">保存</button>
     </view>
   </uni-popup>
 </template>
 
 <script setup>
-import {
-  ref,
-  reactive,
-  nextTick
-} from "vue";
-import {
-  onLoad
-} from "@dcloudio/uni-app";
-import * as httpApi from "@/api/sanfang.js"
-import searchDialog from "./search.vue";
+import {ref,reactive,nextTick} from "vue";
+import {onLoad} from "@dcloudio/uni-app";
+import * as khApi from "@/api/kehu.js"
+const formData = reactive({
+	realName: '',
+	userName: '',
+	idcard: '',
+	idtype: '1',
+})
 
 function goback2() {
   popupRef.value.close();
@@ -34,6 +60,44 @@ function handleShow() {
   popupRef.value.open();
 }
 
+// 保存
+function saveBtn(){
+	htAdd();
+}
+
+// 新增
+function htAdd(){
+	let arr = [];
+	if (!formData.realName) {
+		arr.push('姓名');
+	}
+	if (!formData.userName) {
+		arr.push('电话');
+	}
+	if (!formData.realName || !formData.userName) {
+		uni.showToast({
+			icon: 'none',
+			title: `请完善${arr.join('、')}信息！`
+		})
+		return;
+	}
+	
+	const opt = {
+		realName: formData.realName,
+		userName: formData.userName,
+		idtype: formData.idtype,
+		idcard: formData.idcard,
+	}
+	khApi.getKehuAdd(opt).then(res => {
+		if (res.data) {
+			uni.showToast({
+				title: '新增成功'
+			})
+			goUpPage();
+		}
+	})
+}
+
 defineExpose({
   handleShow
 })