Преглед изворни кода

1.更换登陆页面背景图
2.修改点击头像下拉显示内容
3.修改代理人管理,新增\编辑等接口

lihongxiao пре 3 година
родитељ
комит
750ac912da

BIN
src/assets/image/bgImg1.jpeg


BIN
src/assets/image/bgImg2.jpeg


BIN
src/assets/image/bgImg3.jpg


BIN
src/assets/image/bgImg4.jpeg


BIN
src/assets/image/bgImg5.jpg


+ 24 - 1
src/http/moudules/user.js

@@ -219,7 +219,22 @@ export const saveOrUpdate = (data) => {
       data
   })
 }
-// 后线人员回显接口
+// 保存用户信息接口详细信息
+export const saveUserInfo = (data) => {
+  return axios({
+      url: '/user/saveUserInfo',
+      method: 'post',
+      data
+  })
+}
+// 详情回显接口详细信息
+export const findUserInfoDetail = (params) => {
+  return axios({
+      url: '/user/findUserInfo/'+params,
+      method: 'get',
+  })
+}
+// 详情回显接口
 export const getUserDatail = (params) => {
   return axios({
       url: '/user/'+params,
@@ -257,3 +272,11 @@ export const selectfindByreferrerId= (params) => {
       params
   })
 }
+// 编辑保存用户信息
+export const updateUserInfo = (userId,data) => {
+  return axios({
+      url: '/user/updateUserInfo/'+userId,
+      method: 'post',
+      data
+  })
+}

+ 80 - 0
src/utils/validate.js

@@ -30,3 +30,83 @@ export function isURL (s) {
   return /^http[s]?:\/\/.*/.test(s)
 }
 
+export function validateSfz(rule, value, callback) {
+  if (!value) {
+    return callback(new Error('身份证号码不能为空'));
+  }
+  function validataCredentials(num) {
+    var msg, boo; //  msg身份证验证友情提示,boo返回值
+    var num = num.toUpperCase(); // 身份证为末尾可能是X
+    //   身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,
+    //   最后一位是校验位,可能为数字或字符X。
+    const arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
+    const arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
+    var nTemp = 0,
+      i;
+    if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(num))) {
+      //  输入的身份证号长度不对,或者号码不符合规定;
+      return [boo = false, msg = "身份证号码不符合规定"];
+    }
+    //   校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
+    //   下面分别分析出生日期和校验位
+    var len, re;
+    len = num.length;
+    if (len == 15) {
+      re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
+      var arrSplit = num.match(re);
+      //   检查生日日期是否正确
+      var dtmBirth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
+      var bGoodDay;
+      bGoodDay = (dtmBirth.getYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
+      if (!bGoodDay) {
+        //   输入的身份证号里出生日期不对!
+        return [boo = false, msg = "输入的身份证号里出生日期不对!"];
+
+      } else {
+        //   将15位身份证转成18位
+        //   校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。   
+        num = num.substr(0, 6) + '19' + num.substr(6, num.length - 6);
+        for (i = 0; i < 17; i++) {
+          nTemp += num.substr(i, 1) * arrInt[i];
+        }
+        num += arrCh[nTemp % 11];
+        return [boo = true, msg = num];
+      }
+    }
+    if (len == 18) {
+      re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
+      var arrSplit = num.match(re);
+      //  检查生日日期是否正确
+      var dtmBirth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
+      var bGoodDay;
+      bGoodDay = (dtmBirth.getFullYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
+      if (!bGoodDay) {
+        //  输入的身份证号里出生日期不对! 
+
+        return [boo = false, msg = " 输入的身份证号里出生日期不对"];
+      } else {
+        //  检验18位身份证的校验码是否正确。
+        //  校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
+        var valnum;
+        for (i = 0; i < 17; i++) {
+          nTemp += num.substr(i, 1) * arrInt[i];
+        }
+        valnum = arrCh[nTemp % 11];
+        if (valnum != num.substr(17, 1)) {
+          //  18位身份证的校验码不正确!
+          return [boo = false, msg = "身份证的校验码不正确!"];
+        }
+        return [boo = true, msg = "验证成功"]
+      }
+    }
+    return [boo = false, msg = "身份证的长度不正确!"];
+  }
+  setTimeout(() => {
+    var res = validataCredentials(value);
+    if (!res[0]) {
+      callback(new Error(res[1]));
+    } else {
+      callback();
+    }
+  }, 200);
+};

+ 11 - 7
src/views/Core/PersonalPanel.vue

@@ -37,31 +37,35 @@
         <span class="relation-item">watches</span>
         <span class="relation-item">friends</span>
     </div> -->
-    <div class="main-operation">
+    <!-- <div class="main-operation">
       <span class="main-operation-item">
         <el-button size="small" icon="fa fa-male"> 个人中心</el-button>
       </span>
       <span class="main-operation-item">
         <el-button size="small" icon="fa fa-key" @click="showPsdDialog"> 修改密码</el-button>
       </span>
-    </div>
+    </div> -->
     <div class="other-operation">
-      <div class="other-operation-item">
+      <!-- <div class="other-operation-item">
         <li class="fa fa-eraser"></li>
         清除缓存
-      </div>
+      </div> -->
       <div class="other-operation-item" @click="recruiting">
         <li class="fa fa-user"></li>
         闪电增员
       </div>
-      <div class="other-operation-item">
+      <!-- <div class="other-operation-item">
         <li class="fa fa-bell"></li>
         访问次数
+      </div> -->
+      <div class="other-operation-item"  @click="showPsdDialog">
+        <li class="fa fa-key"></li>
+        修改密码
       </div>
-      <div class="other-operation-item" @click="showBackupDialog">
+      <!-- <div class="other-operation-item" @click="showBackupDialog">
         <li class="fa fa-undo"></li>
         {{ $t("common.backupRestore") }}
-      </div>
+      </div> -->
     </div>
     <div class="personal-footer" @click="logout">
       <li class="fa fa-sign-out"></li>

+ 42 - 18
src/views/HeadBar/HeadBar.vue

@@ -20,7 +20,7 @@
         </el-menu>
       </span>
       <!-- 收缩栏 -->
-      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="selectNavBar"
+      <el-menu :default-active="menuIndex" class="el-menu-demo" mode="horizontal" @select="selectNavBar"
         :background-color="themeColor" active-text-color="#ffd04b" text-color="#fff">
         <el-submenu style="float:right;" class="right-item" v-if="Object.keys(rightNavItems).length === 0 ? false : true"
           index="10">
@@ -61,7 +61,7 @@
         </el-menu-item>
         <el-menu-item index="5" v-popover:popover-personal>
           <!-- 用户信息 -->
-          <span class="user-info"><img :src="avatar" />{{ userData.name }}</span>
+          <span class="user-info"><img :src="avatar" />{{ userData.name||'' }}</span>
           <el-popover ref="popover-personal" placement="bottom-end" trigger="click" :visible-arrow="false">
             <personal-panel :user="userData"></personal-panel>
           </el-popover>
@@ -100,14 +100,14 @@ export default {
       leftTree: state => state.menu.leftTree,
     }),
     leftNavItems: function () {
-      if (this.sum > 0) {
+      if (this.screenWidth<=1650 && this.sum > 0) {
         return this.navTree.slice(0, '-' + this.sum);
       } else {
         return this.navTree;
       }
     },
     rightNavItems: function () {
-      if (this.sum > 0) {
+      if (this.screenWidth<=1650 && this.sum > 0) {
         return this.navTree.slice('-' + this.sum);
       } else {
         return {}
@@ -136,20 +136,39 @@ export default {
           this.userData=response.data
       })
     }
-    if (this.leftNavItems.length > 8) {
-      if (this.screenWidth < this.datawidth) {
-        this.sum = Math.ceil((this.datawidth - this.screenWidth) / 60)
-        // 为了避免频繁触发resize函数导致页面卡顿,使用定时器
-        if (!this.timer) {
-          // 一旦监听到的screenWidth值改变,就将其重新赋给data里的screenWidth
-          // this.screenWidth = newValue;
-          this.timer = true;
-          setTimeout(() => {
-            this.timer = false;
-          }, 400);
-        }
-      }
+    if(this.screenWidth<=1260){
+      this.sum = Math.ceil((this.datawidth - this.screenWidth) / 100)
+    }
+    else{
+      this.sum = Math.ceil((this.datawidth - this.screenWidth) / 140)
+    }
+    if (!this.timer) {
+      // 一旦监听到的screenWidth值改变,就将其重新赋给data里的screenWidth
+      // this.screenWidth = newValue;
+      this.timer = true;
+      setTimeout(() => {
+        this.timer = false;
+      }, 400);
     }
+    // if (this.leftNavItems.length > 8) {
+    //   if (this.screenWidth < this.datawidth) {
+    //     // if(this.screenWidth<=1260){
+    //     //   this.sum = Math.ceil((this.datawidth - this.screenWidth) / 100)
+    //     // }
+    //     // else{
+    //     //   this.sum = Math.ceil((this.datawidth - this.screenWidth) / 140)
+    //     // }
+    //     // 为了避免频繁触发resize函数导致页面卡顿,使用定时器
+    //     if (!this.timer) {
+    //       // 一旦监听到的screenWidth值改变,就将其重新赋给data里的screenWidth
+    //       // this.screenWidth = newValue;
+    //       this.timer = true;
+    //       setTimeout(() => {
+    //         this.timer = false;
+    //       }, 400);
+    //     }
+    //   }
+    // }
 
   },
   watch: {
@@ -159,7 +178,12 @@ export default {
       }
     },
     screenWidth(newValue) {
-        this.sum = Math.ceil((this.datawidth - newValue) / 60)
+      if(newValue<=1260){
+        this.sum = Math.ceil((this.datawidth - newValue) / 100)
+      }
+      else{
+        this.sum = Math.ceil((this.datawidth - newValue) / 140)
+      }
         // 为了避免频繁触发resize函数导致页面卡顿,使用定时器
         if (!this.timer) {
           // 一旦监听到的screenWidth值改变,就将其重新赋给data里的screenWidth

+ 7 - 1
src/views/Login.vue

@@ -161,7 +161,12 @@ export default {
           Cookies.set('user', userInfo.account) // 放置token到Cookie
           this.getDictItems()
           this.$api.user.getLoginUser().then((response) => {
+            if(response.code==200){
               localStorage.setItem('user_data', JSON.stringify(response.data)) 
+            }
+            else{
+              this.$message.error(response.msg)
+            }
           })
           this.$api.role.findAll().then((res) => {
             localStorage.setItem('find_all', JSON.stringify(res.data)) 
@@ -273,8 +278,9 @@ export default {
 
 #Login {
   width: 100%;
+  
   height: 100%;
-  background-image: url(../assets/image/bgImg.png) !important;
+  background-image: url(../assets/image/bgImg5.jpg) !important;
   background-size: 100% 100%;
   background-repeat: no-repeat;
   background-position: 100% 100%;

+ 403 - 312
src/views/PeopleManage/Agent/AgentManage.vue

@@ -5,203 +5,195 @@
         <!-- 左侧树Start -->
         <SplitArea :size="leftSplitWidth" :minSize="240">
           <div>
-            <div >
+            <div>
               <!-- <el-checkbox v-model="containsSubDeptChecked"
                 >包含下级机构</el-checkbox
               > -->
 
-              <kt-button
-                style="
+              <kt-button style="
                   background-color: #ffc000;
                   border: #ffc000;
-                "
-                icon="fa fa-plus"
-                label="添加人员"
-                type="primary"
-                perms="sys:agent:add"
-                @click="handleAddButton"
-              />
+                " icon="fa fa-plus" label="添加人员" type="primary" perms="sys:agent:add" @click="handleAddButton" />
             </div>
             <el-divider></el-divider>
             <!-- 左侧树形结构 -->
-            <el-tree
-              :data="ztreeNodes"
-              :props="{ children: 'children', label: 'name' }"
-              node-key="id"
-              :default-expanded-keys="['9']"
-              @node-click="onZTreeClick"
-            ></el-tree>
+            <el-tree :data="ztreeNodes" :props="{ children: 'children', label: 'name' }" node-key="id"
+              :default-expanded-keys="['9']" @node-click="onZTreeClick"></el-tree>
           </div>
         </SplitArea>
         <!-- 左侧树End -->
 
         <!-- 右侧列表页面Start -->
         <SplitArea :size="rightSplitWidth">
-          <templateTable
-            :formList="formList"
-            :searchData.sync="queryFrom"
-            :tableConfig="tableConfig"
-            :btnGroup="btnGroup"
-            :data="pageResult"
-            @getList="findPage"
-            @handleSearchList="handleSearchList"
-            :pagination="pageData"
-          >
-            <div style="display:inline-block;"  slot="upload" >
-                <el-upload
-                  class="upload"
-                  ref="upload"
-                  :show-file-list="false" 
-                  :limit="1"
-                  action="#"
-                  :http-request="carfrontChange"
-                  :multiple="false"
-                >
-                  <el-button type="primary" size="small" @click="$refs.upload.clearFiles()">导入新用户</el-button>
-                </el-upload>
-              </div>
+          <templateTable :formList="formList" :searchData.sync="queryFrom" :tableConfig="tableConfig" :btnGroup="btnGroup"
+            :data="pageResult" @getList="findPage" @handleSearchList="handleSearchList" :pagination="pageData">
+            <div style="display:inline-block;" slot="upload">
+              <el-upload class="upload" ref="upload" :show-file-list="false" :limit="1" action="#"
+                :http-request="carfrontChange" :multiple="false">
+                <el-button type="primary" size="small" @click="$refs.upload.clearFiles()">导入新用户</el-button>
+              </el-upload>
+            </div>
           </templateTable>
         </SplitArea>
         <!-- 右侧列表页面End -->
       </Split>
     </el-main>
 
-<!-- 新新增修改界面 -->
+    <!-- 新新增修改界面 -->
 
-<el-dialog
-      :title="dialogTitle"
-      width="60%"
-      :visible.sync="dialogVisible"
-      :close-on-click-modal="false"
-      :before-close="handleDialogBefore"
-      @close="closeDialog"
-      v-dialogDrag
-    >
-      <el-form
-        :model="formData"
-        :rules="formDataRules"
-        ref="formData"
-        :inline="true"
-        @keyup.enter.native="submitForm('提交审核')"
-        label-width="130px"
-        size="small"
-      >
-        <el-row>
-          <el-col :span="8" >
-          <el-form-item label="机构名称" prop="deptId">
-            <el-cascader
-            style="width:200px"
-              :options="option"
-              v-model="formData.deptId"
-              clearable
-              :show-all-levels="false"
-              :props="{
-                value: 'id',
-                label: 'name',
-                checkStrictly: true,
-              }"
-              @change="handleChange"
-            >
-            </el-cascader>
-          </el-form-item></el-col>
-          <el-col :span="8">
-            <el-form-item label="员工工号" prop="id">
-            <el-input v-model="formData.id" disabled></el-input>
-          </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="手机号" prop="mobile">
-            <el-input v-model="formData.mobile"></el-input>
-          </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="邮箱" prop="email">
-              <el-input v-model="formData.email"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="名称" prop="name">
-              <el-input v-model="formData.name"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="密码" prop="password">
-              <el-input  style="width:200px" v-model="formData.password" autocomplete="new-password"  show-password></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="性别" prop="sex">
-              <el-select
-                    style="width:200px"
-                    v-model="formData.sex"
-                    placeholder="请选择"
-                  >
+    <el-dialog :title="dialogTitle" width="60%" :visible.sync="dialogVisible" :close-on-click-modal="false"
+      :before-close="handleDialogBefore" @close="closeDialog" v-dialogDrag>
+      <el-tabs v-model="activeName">
+        <el-tab-pane label="基本信息" name="1">
+          <el-form :model="formData" :rules="formDataRules" ref="formData" :inline="true" @keyup.enter.native="nextStep()"
+            label-width="130px" size="small">
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="机构名称" prop="deptId">
+                  <el-cascader style="width:200px" :options="ztreeNodes" v-model="formData.deptId" clearable
+                    :show-all-levels="false" :props="{
+                      value: 'id',
+                      label: 'name',
+                      checkStrictly: true,
+                    }" @change="handleChange">
+                  </el-cascader>
+                </el-form-item></el-col>
+              <el-col :span="8">
+                <el-form-item label="员工工号" prop="id">
+                  <el-input v-model="formData.id" disabled></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="手机号" prop="mobile">
+                  <el-input v-model="formData.mobile"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="邮箱" prop="email">
+                  <el-input v-model="formData.email"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="名称" prop="name">
+                  <el-input v-model="formData.name"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="密码" prop="password">
+                  <el-input style="width:200px" v-model="formData.password" autocomplete="new-password"
+                    show-password></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="性别" prop="sex">
+                  <el-select style="width:200px" v-model="formData.sex" placeholder="请选择">
                     <el-option v-for="val in sexoptions" :label="val.label" :value="val.value" :key="val.id"></el-option>
                   </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="状态" prop="status">
-              <el-select
-              style="width:200px"
-                v-model="formData.status"
-                placeholder="请选择"
-              >
-              <el-option v-for="val in user_statusoptions" :label="val.label" :value="val.value" :key="val.id"></el-option>
-            </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="角色" prop="roleId">
-            <el-select
-                style="width:200px"
-                v-model="formData.roleId"
-                placeholder="请选择"
-                disabled
-              >
-              <el-option v-for="val in roles" :label="val.name" :value="val.id+''" :key="val.id"></el-option>
-            </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="推荐人" prop="referrerId">
-              <el-select
-              style="width:200px"
-                v-model="formData.referrerId"
-                placeholder="请选择"
-              >
-              <el-option v-for="val in recommenderOptions" :label="val.name" :value="val.id" :key="val.id"></el-option>
-            </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>  
-      <span slot="footer" class="dialog-footer" >
-        <el-button
-          size="small"
-          type="primary"
-          style="background-color: #ffc000; border: 1px solid #ffc000"
-          @click="closeDialog"
-          >取消</el-button
-        >
-        <el-button
-          size="small"
-          type="primary"
-          @click="submitForm"
-          >提交</el-button
-        >
-      </span>
-      </el-dialog>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="状态" prop="status">
+                  <el-select style="width:200px" v-model="formData.status" placeholder="请选择">
+                    <el-option v-for="val in user_statusoptions" :label="val.label" :value="val.value"
+                      :key="val.id"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="角色" prop="roleId">
+                  <el-select style="width:200px" v-model="formData.roleId" placeholder="请选择" disabled>
+                    <el-option v-for="val in roles" :label="val.name" :value="val.id + ''" :key="val.id"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="推荐人" prop="referrerId">
+                  <el-select style="width:200px" v-model="formData.referrerId" placeholder="请选择">
+                    <el-option v-for="val in recommenderOptions" :label="val.name" :value="val.id"
+                      :key="val.id"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+          <div style="text-align: right;">
+            <el-button size="small" type="primary" @click="nextStep">下一步</el-button>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="详细信息" name="2">
+          <el-form :model="formDataDetail" :rules="formDataRulesDetail" ref="formDataDetail" :inline="true"
+            @keyup.enter.native="submitForml('提交审核')" label-width="130px" size="small">
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="开户账号" prop="accountno">
+                  <el-input v-model="formDataDetail.accountno"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="居住地址" prop="address">
+                  <el-input v-model="formDataDetail.address"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="开户行" prop="bankName">
+                  <el-input v-model="formDataDetail.bankName"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="出生日期" prop="birthday">
+                  <el-date-picker style="width:200px" v-model="formDataDetail.birthday" type="date" placeholder="选择日期">
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="身份证号" prop="identity">
+                  <el-input v-model="formDataDetail.identity" :maxlength="18"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="户籍" prop="koseki">
+                  <el-input v-model="formDataDetail.koseki"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="婚姻状况" prop="maritalStatus">
+                  <el-select v-model="formDataDetail.maritalStatus" placeholder="请选择婚姻状况" style="width:200px">
+                    <el-option label="未婚" value="未婚"></el-option>
+                    <el-option label="已婚" value="已婚"></el-option>
+                    <el-option label="离异" value="离异"></el-option>
+                    <el-option label="再婚" value="再婚"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="民族" prop="nations">
+                  <el-select style="width:200px" v-model="formDataDetail.nations" placeholder="请选择民族">
+                    <el-option :label="national" :value="national" v-for="national in nationalList"
+                      :key="national"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+          <div style="text-align: right;">
+            <el-button size="small" type="primary" style="background-color: #ffc000; border: 1px solid #ffc000"
+              @click="closeDialog">取消</el-button>
+            <el-button size="small" type="primary" @click="activeName = '1'">上一步</el-button>
+            <el-button size="small" type="primary" @click="submitForm">提交</el-button>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+
+    </el-dialog>
 
   </div>
 </template>
 
 <script>
-import Cookies from "js-cookie";
 import KtButton from "@/views/Core/KtButton"; // 按钮权限组件
 import tree from "@/components/ztree.vue"; // 机构树组件
 import templateTable from '../../../components/TemplateTable/index.vue'
-
+import { validateSfz } from "../../../utils/validate.js";
 export default {
   components: {
     KtButton,
@@ -210,7 +202,67 @@ export default {
   },
   data() {
     return {
-      formList:[
+      activeName: '1',
+      //56个民族
+      nationalList: [
+        "汉族",
+        "壮族",
+        "满族",
+        "回族",
+        "苗族",
+        "维吾尔族",
+        "土家族",
+        "彝族",
+        "蒙古族",
+        "藏族",
+        "布依族",
+        "侗族",
+        "瑶族",
+        "朝鲜族",
+        "白族",
+        "哈尼族",
+        "哈萨克族",
+        "黎族",
+        "傣族",
+        "畲族",
+        "傈僳族",
+        "仡佬族",
+        "东乡族",
+        "高山族",
+        "拉祜族",
+        "水族",
+        "佤族",
+        "纳西族",
+        "羌族",
+        "土族",
+        "仫佬族",
+        "锡伯族",
+        "柯尔克孜族",
+        "达斡尔族",
+        "景颇族",
+        "毛南族",
+        "撒拉族",
+        "布朗族",
+        "塔吉克族",
+        "阿昌族",
+        "普米族",
+        "鄂温克族",
+        "怒族",
+        "京族",
+        "基诺族",
+        "德昂族",
+        "保安族",
+        "俄罗斯族",
+        "裕固族",
+        "乌兹别克族",
+        "门巴族",
+        "鄂伦春族",
+        "独龙族",
+        "塔塔尔族",
+        "赫哲族",
+        "珞巴族",
+      ],
+      formList: [
         {
           label: "工号",
           prop: "userId",
@@ -230,63 +282,78 @@ export default {
           label: "状态",
           prop: "status",
           type: "select",
-          options: JSON.parse(localStorage.getItem('user_statusoptions')) 
+          options: JSON.parse(localStorage.getItem('user_statusoptions'))
         },
       ],
-      btnGroup:[{
-        name:'upload',
-        slot:true
+      btnGroup: [{
+        name: 'upload',
+        slot: true
       },],
-      tableConfig:{
+      tableConfig: {
         columns: [
-        // 数据列
-        { prop: "deptId", label: "部门编码",type:'text' },
-        {
-          prop: "pdeptName",
-          label: "机构名称",type:'text',
-        },
+          // 数据列
+          { prop: "deptId", label: "部门编码", type: 'text' },
+          {
+            prop: "pdeptName",
+            label: "机构名称", type: 'text',
+          },
 
-        { prop: "deptName", label: "部门名称",type:'text', },
-      
-        { prop: "userId", label: "工号",type:'text', },
-        { prop: "name", label: "姓名",type:'text', },
-        {
-          prop: "sex",
-          label: "性别",type:'text',
-        },
-        { prop: "mobile", label: "联系电话",type:'text', },
+          { prop: "deptName", label: "部门名称", type: 'text', },
+
+          { prop: "userId", label: "工号", type: 'text', },
+          { prop: "name", label: "姓名", type: 'text', },
           {
-          prop: "roleId",
-          label: "角色",type:'text',
-        },
-        {
-          prop: "status",
-          label: "状态",type:'text',
-        },],
-        loading:true,
-        isPaginationShow:true,
-        isShowIndex:true,
-        optBtns:[
+            prop: "sex",
+            label: "性别", type: 'text',
+          },
+          { prop: "mobile", label: "联系电话", type: 'text', },
+          {
+            prop: "roleId",
+            label: "角色", type: 'text',
+          },
+          {
+            prop: "status",
+            label: "状态", type: 'text',
+          },],
+        loading: true,
+        isPaginationShow: true,
+        isShowIndex: true,
+        optBtns: [
           {
-            type:'primary',
-            label:'编辑',
-            icon:"fa fa-edit",
-            click:(row, index) => {return this.handleTableEdit(row)},
+            type: 'primary',
+            label: '编辑',
+            icon: "fa fa-edit",
+            click: (row, index) => { return this.handleTableEdit(row) },
           }
         ]
       },
-      recommenderOptions:[],
-      pageData:{
+      recommenderOptions: [],
+      pageData: {
         pageNum: 1,
         pageSize: 10,
         totalSize: 0
       },
-      deptId:JSON.parse(localStorage.getItem('user_data')).deptId ,
-      formData:{
-        roleId:'20'
+      deptId: JSON.parse(localStorage.getItem('user_data')).deptId,
+      formData: {
+        roleId: '20'
+      },
+      formDataDetail: {},
+      formDataRulesDetail: {
+        // accountno: [{ required: true, message: "请填写开户账号", trigger: "blur" }],
+        // address: [{ required: true, message: "请填写居住地址", trigger: "blur" }],
+        // bankName: [{ required: true, message: "请填写开户行", trigger: "blur" }],
+        // birthday: [{ required: true, message: "请填写出生日期", trigger: "blur" }],
+        // identity:
+        // [{ required: true, message: "请填写身份证号" },
+        // { validator: validateSfz }], 
+
+        // koseki: [{ required: true, message: "请填写户籍", trigger: "blur" }],
+        // maritalStatus: [{ required: true, message: "请选择婚姻状况", trigger: "change" }],
+        // nations: [{ required: true, message: "请选择民族", trigger: "change" }],
       },
-      formDataRules:{
-        deptId:[{ required: true, message: "请选择机构", trigger: "change" }],
+      basicInformation: {},
+      formDataRules: {
+        deptId: [{ required: true, message: "请选择机构", trigger: "change" }],
         mobile: [
           { required: true, message: "请输入手机号", trigger: "blur" },
           { min: 11, max: 11, message: "请输入11位手机号码", trigger: "blur" },
@@ -301,7 +368,7 @@ export default {
         // password: [{ required: true, message: "请填写密码", trigger: "blur" }],
         status: [{ required: true, message: "请选择状态", trigger: "change" }],
         // roleId: [{ required: true, message: "请填写角色", trigger: "blur" }],
-        },
+      },
       filterObject: {},
       peopleid: "",
       peopledeptid: "",
@@ -333,9 +400,9 @@ export default {
       dialogVisible: false, // 新增编辑界面是否显示
       departmentList: [], // 选中公司的所有部门的集合
       deptInfo: {}, //选中机构的基本信息
-      sexoptions: JSON.parse(localStorage.getItem('sexOptions')) ,
-      user_statusoptions: JSON.parse(localStorage.getItem('user_statusoptions')) ,
-      roles: JSON.parse(localStorage.getItem('find_all')) ,
+      sexoptions: JSON.parse(localStorage.getItem('sexOptions')),
+      user_statusoptions: JSON.parse(localStorage.getItem('user_statusoptions')),
+      roles: JSON.parse(localStorage.getItem('find_all')),
       option: [], //机构列表
     };
   },
@@ -348,7 +415,6 @@ export default {
     // this.getDictItems("user_status");
     this.findLeftTreeData(); // 获取机构树的数据
     this.findPage()
-
   },
   mounted() {
     //用像素初始化左边的split的宽度
@@ -365,7 +431,7 @@ export default {
     },
   },
   methods: {
-      // excel导入
+    // excel导入
     carfrontChange(file) {
       const params = new FormData(); // 声明formData数据类型
       params.append("file", file.file);
@@ -386,10 +452,10 @@ export default {
     queryStaffInfo() {
       this.findPage();
     },
-    sexFormatter(row){
+    sexFormatter(row) {
       // return this.sexoptions[row.sex]
       // return row.sex+'1'
-// console.log(val,1)
+      // console.log(val,1)
     },
     changeTreeWidth(widthVal) {
       // 初始化树的宽度
@@ -398,7 +464,7 @@ export default {
       );
       this.rightSplitWidth = 100 - this.leftSplitWidth;
     },
-    findLeftTreeData: function () {
+    findLeftTreeData() {
       this.$api.dept.findDeptTree().then((res) => {
         this.ztreeNodes = res.data;
       });
@@ -407,7 +473,7 @@ export default {
       // 点击事件
       this.currentTreeNode = evt;
       this.deptId = this.currentTreeNode.id;
-      this.pageData.pageNum =1;
+      this.pageData.pageNum = 1;
       this.findPage();
       // this.formData.deptId = [];
       // this.platform(treeId);
@@ -421,66 +487,63 @@ export default {
     },
     //联级选择器触发事件
     handleChange(val) {
-      if (val&&val.length !== 0) {
+      if (val && val.length !== 0) {
         this.formData.deptId = val.at(-1);
-        this.formData.referrerId=''
-        this.$api.user.selectfindByreferrerId({deptId:this.formData.deptId }).then((res) => {
-          this.recommenderOptions=res.data
+        this.formData.referrerId = ''
+        this.$api.user.selectfindByreferrerId({ deptId: this.formData.deptId }).then((res) => {
+          this.recommenderOptions = res.data
         });
       }
-     
+
     },
     // 右侧列表的方法Start
     findPage(data) {
       this.tableConfig.loading = true;
       this.$api.user
         // .findPage({dto,pageNum:this.pageData.pageNum,pageSize:this.pageData.pageSize})
-        .findPage({...this.pageData,dto:{...data,roleId:'20',deptId:this.deptId} })
+        .findPage({ ...this.pageData, dto: { ...data, roleId: '20', deptId: this.deptId } })
         .then((res) => {
-          if(res.code==200&& res.data.content.length>0){
-              res.data.content.forEach(val=>{
-              if(val.sex&& val.sex!==''&& val.sex!==null){
-                val.sex=this.sexoptions.find(ele=>ele.value==val.sex).label
+          if (res.code == 200 && res.data.content.length > 0) {
+            res.data.content.forEach(val => {
+              if (val.sex && val.sex !== '' && val.sex !== null) {
+                val.sex = this.sexoptions.find(ele => ele.value == val.sex).label
               }
-              if(val.status&& val.status!==''&& val.status!==null){
-                val.status=this.user_statusoptions.find(ele=>ele.value==val.status).label
+              if (val.status && val.status !== '' && val.status !== null) {
+                val.status = this.user_statusoptions.find(ele => ele.value == val.status).label
               }
-              if(val.roleId&& val.roleId!==''&& val.roleId!==null){
-                val.roleId=this.roles.find(ele=>ele.id==val.roleId).name
+              if (val.roleId && val.roleId !== '' && val.roleId !== null) {
+                val.roleId = this.roles.find(ele => ele.id == val.roleId).name
               }
             })
           }
           this.tableConfig.loading = false;
           this.pageResult = res.data.content;
-          this.pageData.pageNum=res.data.pageNum;
-          this.pageData.pageSize=res.data.pageSize;
-          this.pageData.totalSize=res.data.totalSize;
+          this.pageData.pageNum = res.data.pageNum;
+          this.pageData.pageSize = res.data.pageSize;
+          this.pageData.totalSize = res.data.totalSize;
         })
-       
+
     },
-    handleSearchList(data){
+    handleSearchList(data) {
       this.findPage(data)
     },
-    handleTableEdit(params) {
-      this.$api.user.getUserDatail(params.userId).then((result) => {
-        if(result.code==200){
-          this.$api.dept.findDeptTree().then((res) => {
-            this.option = res.data;
-          });
-          this.$api.user.selectfindByreferrerId({deptId:result.data.deptId }).then((res) => {
-          this.recommenderOptions=res.data
+    async handleTableEdit(params) {
+      this.activeName = '1'
+      let res = await this.$api.user.getUserDatail(params.userId)
+      if (res.code == 200) {
+        this.$api.user.selectfindByreferrerId({ deptId: res.data.deptId }).then((res) => {
+          this.recommenderOptions = res.data
         });
-            result.data.status+=''
-          this.formData=result.data
-          this.formData.password=''
-          this.dialogTitle = "编辑代理人";
-          this.dialogVisible = true;
-        }
-        else{
-          this.$message.error(result.msg);
-        }
-      })
-     
+        res.data.sysUser.status += ''
+        this.formData = res.data.sysUser
+        this.formDataDetail = res.data.sysUserInfo?res.data.sysUserInfo:{}
+        this.formData.password = ''
+        this.dialogTitle = "编辑代理人";
+        this.dialogVisible = true;
+      }
+      else {
+        this.$message.error(res.msg);
+      }
     },
     // 删除单个人员
     handleTableDeleteFlag(data) {
@@ -494,30 +557,30 @@ export default {
               });
               this.findPage();
             }
-            else{
+            else {
               this.$message.error(res.msg);
-        }
+            }
           });
         })
-        .catch(() => {});
+        .catch(() => { });
     },
     //添加人员
     handleAddButton() {
       //级联渲染部门列表
-      this.$api.dept.findDeptTree().then((res) => {
-        this.option = res.data;
-      });
-      this.$api.user.selectfindByreferrerId({deptId:this.deptId}).then((res) => {
-        this.recommenderOptions=res.data
+      this.$api.user.selectfindByreferrerId({ deptId: this.deptId }).then((res) => {
+        this.recommenderOptions = res.data
       });
       if (this.currentTreeNode == null) {
         this.$message.info("请选择所属公司或部门");
         return;
       }
-      this.formData={
-        roleId:'20',
-        deptId:this.deptId
+      this.formData = {
+        roleId: '20',
+        status: '',
+        deptId: this.deptId
       }
+      this.formDataDetail = {}
+      this.activeName = '1'
       this.dialogTitle = "新增代理人";
       this.dialogVisible = true;
     },
@@ -539,62 +602,90 @@ export default {
         .then((_) => {
           done();
         })
-        .catch((_) => {});
+        .catch((_) => { });
     },
     closeDialog() {
       // 清空数据
       this.deptInfo = {};
-      // this.$refs["formData"].resetFields();
-      // for (let key in this.formData) {
-      //   this.formData[key] = "";
-      // }
-      // this.formData={
-      //   roleId:'20',
-      //   id:'',
-      //   mobile:'',
-      //   email:'',
-      //   name:'',
-      //   password:'',
-      //   sex:'',
-      //   status:''
-      // }
       this.dialogVisible = false;
     },
     // 提交
     submitForm() {
-      this.$refs.formData.validate((valid) => {
+      this.$refs.formDataDetail.validate((valid) => {
         if (valid) {
-          this.$confirm("确认提交审核吗?", "提示", {})
+          this.$confirm("确认提交吗?", "提示", {})
             .then(() => {
-              // this.formData.deptIdCom= this.formData.deptId 
-              // this.formData.deptId =  this.formData.deptId.at(-1);
-              if(this.formData.referrerId){
-                this.formData.referrerName =this.recommenderOptions.find(val=>this.formData.referrerId==val.id).name
+              // if(!this.basicInformation.id && this.dialogTitle =="新增代理人"){
+              //   this.$message({
+              //     message: '请先填写基本信息!!!',
+              //     type: 'warning'
+              //   });
+              //   return false
+              // }
+              if (this.dialogTitle == '新增代理人') {
+                this.$api.user.saveUserInfo({ sysUser: this.formData, sysUserInfo: this.formDataDetail }).then((res) => {
+                  if (res.code == 200) {
+                    this.$message({
+                      message: "保存成功",
+                      type: "success",
+                    });
+                    this.dialogVisible = false;
+                    this.$refs["formData"].resetFields();
+                    this.$refs["formDataDetail"].resetFields();
+                    this.findPage();
+                  } else {
+                    this.$message({
+                      message: `保存失败,请重新添加,(${res.msg})`,
+                      type: "error",
+                    });
+                  }
+                });
               }
-              this.$api.user.saveOrUpdate(this.formData).then((res) => {
-                if (res.code == 200) {  
-                  this.$message({
-                    message: "操作成功",
-                    type: "success", 
-                  });
-                  this.dialogVisible = false;
-                  this.$refs["formData"].resetFields();
-                  this.findPage();
-                } else {
-                  this.$message({
-                    message: `操作失败,请重新添加,(${res.msg})`,
-                    type: "error",
-                  });
-                }
-              });
+              else{
+                this.$api.user.updateUserInfo(this.formData.id,{ sysUser: this.formData, sysUserInfo: this.formDataDetail }).then((res) => {
+                  if (res.code == 200) {
+                    this.$message({
+                      message: "编辑成功",
+                      type: "success",
+                    });
+                    this.dialogVisible = false;
+                    this.$refs["formData"].resetFields();
+                    this.$refs["formDataDetail"].resetFields();
+                    this.findPage();
+                  } else {
+                    this.$message({
+                      message: `编辑失败,请重新添加,(${res.msg})`,
+                      type: "error",
+                    });
+                  }
+                });
+              }
+
             })
-         
-        } 
-        else{
-            this.$message({
-              type: "info",
-              message: "已取消提交",
-            });
+        }
+      });
+    },
+    // 下一步
+    nextStep() {
+      this.$refs.formData.validate((valid) => {
+        if (valid) {
+          this.activeName = '2'
+          // this.formData.deptIdCom= this.formData.deptId 
+          // this.formData.deptId =  this.formData.deptId.at(-1);
+          // if (this.formData.referrerId) {
+          //   this.formData.referrerName = this.recommenderOptions.find(val => this.formData.referrerId == val.id).name
+          // }
+          // this.$api.user.saveOrUpdate(this.formData).then((res) => {
+          //   if (res.code == 200) {
+          //   this.activeName='2'
+          //   this.basicInformation=res.data
+          //   } else {
+          //     this.$message({
+          //       message: `操作失败,请重新添加,(${res.msg})`,
+          //       type: "error",
+          //     });
+          //   }
+          // });
         }
       });
     },
@@ -614,10 +705,10 @@ export default {
 
 .queryFrom .el-form-item {
   margin-bottom: 0px;
+
 }
 
 .queryFrom .queryButton .el-form-item__content {
   margin-left: 0px !important;
 }
-
 </style>