sc

src/views/Basic/User/UserForm.vue

@@ -5,7 +5,7 @@
       v-loading="formLoading"
       :model="formData"
       :rules="formRules"
-      label-width="80px"
+      label-width="100px"
     >
       <el-row :gutter="20">
         <el-col :span="12">
@@ -102,6 +102,23 @@
           </el-form-item>
         </el-col>
       </el-row>
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="0">
+          <el-form-item label="钉钉手机号">
+            <el-input
+              v-model="formData.ddPhone"
+              placeholder="请输入钉钉手机号"
+              clearable
+              @blur="getDDId"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="钉钉Id" prop="dingUserId">
+            <el-input v-model="formData.dingUserId" disabled />
+          </el-form-item>
+        </el-col>
+      </el-row>
       <el-row :gutter="20">
         <el-col :span="24">
           <el-form-item label="备注">
@@ -132,7 +149,7 @@ const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
-const formData = ref({
+const formData = ref<any>({
   nickname: '',
   deptId: '',
   mobile: '',
@@ -239,4 +256,16 @@ const resetForm = () => {
   }
   formRef.value?.resetFields()
 }
+
+async function getDDId() {
+  try {
+    if (!formData.value.ddPhone) {
+      formData.value.dingUserId = undefined
+      return
+    }
+    const data = await UserApi.getDDIdByPhone({ mobile: formData.value.ddPhone })
+    formData.value.dingUserId = data
+  } finally {
+  }
+}
 </script>