短信验证

src/views/modules/sys/user-add-or-update.vue

@@ -103,6 +103,25 @@
           <el-radio :label="1">{{ $t('user.status1') }}</el-radio>
         </el-radio-group>
       </el-form-item>
+      <el-form-item prop="verifyFlag"
+                    label="短信验证登陆"
+                    size="mini">
+        <el-radio-group v-model="dataForm.verifyFlag" @change="verifyFlagChange">
+          <el-radio :label="'0'">停用</el-radio>
+          <el-radio :label="'1'">本人验证</el-radio>
+          <el-radio :label="'2'">领导验证</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="登录验证手机" v-if="dataForm.verifyFlag !== '0'"
+                    prop="verifyMobile">
+        <el-autocomplete
+            class="inline-input"
+            v-model="dataForm.verifyMobile"
+            :fetch-suggestions="querySearch"
+            placeholder="请输入内容"
+            @select="handleSelect"
+        ></el-autocomplete>
+      </el-form-item>
     </el-form>
     <template slot="footer">
       <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
@@ -136,8 +155,11 @@ export default {
         mobile: '',
         roleIdList: [],
         status: 1,
+        verifyFlag: '0',
+        verifyMobile: '',
         userTagKey: ''
       },
+      verifyMobileList: [],
       userTagDictList: []
     }
   },
@@ -272,12 +294,36 @@ export default {
       this.dataForm.deptName = data.name
       this.deptListVisible = false
     },
+    handleSelect (item) {
+      console.log(item)
+    },
+    verifyFlagChange (e) {
+      if (e === '2') {
+        this.$http.get(`/sys/user/getLeaderPhone/${this.dataForm.deptId}`).then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg)
+          }
+          this.verifyMobileList = res.data
+        }).catch(() => { })
+      } else {
+        this.verifyMobileList = []
+        this.dataForm.verifyMobile = this.dataForm.mobile
+      }
+    },
+    querySearch (queryString, cb) {
+      let results = this.verifyMobileList
+      // 调用 callback 返回建议列表的数据
+      cb(results)
+    },
     // 表单提交
     dataFormSubmitHandle: debounce(function () {
       this.$refs['dataForm'].validate((valid) => {
         if (!valid) {
           return false
         }
+        if (this.dataForm.verifyFlag === '0') {
+          this.dataForm.verifyMobile = ''
+        }
         this.$http[!this.dataForm.id ? 'post' : 'put']('/sys/user', {
           ...this.dataForm,
           roleIdList: [