手机号码，身份证号码验证

<template>
  <div>
    <!-- admin  于huaxia运营一个页面 -->
    <a-tabs v-model="tabsSwitch" @change="callback">
      <a-tab-pane key="1" tab="机构">
        <div class="filter-box">
          <div>
            <p>
              <a-input placeholder="公司名称" v-model="mechanism.name" allow-clear />
            </p>
            <!-- <p>
              <a-input placeholder="企业统一编码" v-model="mechanism.code" />
            </p> -->
            <p v-if='userInfo.adminType != 2'>
              <a-input placeholder="机构码" v-model="mechanism.enterprisePer" allow-clear />
            </p>
            <p>
              <a-input placeholder="注册人手机号" v-model="mechanism.tell" allow-clear />
            </p>
            <p>
              <a-input placeholder="企业法人" v-model="mechanism.legalPerson" allow-clear />
            </p>
          </div>
          <div>
            <a-button :loading='loading1' @click="onSearch(1)" class='antBtn1'>
              搜索
            </a-button>
            <a-button class="antBtn2" @click="Onempty(1)">重置</a-button>
            <!-- <span class='span1' @click='$router.push("/CourseManagementAdd")'>+新建</span> -->
          </div>
        </div>
        <a-table :columns="columns1" @change="onPage1" :loading="loading1" :scroll="{x:1250}"
          :data-source="mechanismData" :locale="{emptyText: '暂无数据'}" :pagination="{
            total:mechanism.total,
            current:mechanism.pageNumber,
            defaultPageSize:mechanism.pageSize,
            showSizeChanger: true,
          showTotal: function(total, range){
            return `共${total}条`}} ">
          <!-- 审核状态 -->
          <template slot="status" slot-scope="text">
            <span class="statusbgc"><i
                :class='{"icolor1":text=="未审核","icolor2":text=="已审核","icolor3":text=="已拒绝"}'></i>{{text}}</span>
          </template>
          <!-- 注册时间 -->
          <template slot="createTime" slot-scope="createTime">
            {{$moment(createTime).format("yyyy-MM-DD")}}
          </template>
          <!-- 手机号 -->
          <template slot="registerTell" slot-scope="item">{{$fun.FunDesensitization(item)}}</template>
          <!-- 身份证号 -->
          <template slot="certificateNumber" slot-scope="item">{{$fun.FunDesensitization(item, 10)}}</template>
          <!-- 操作 -->
          <template slot="operation" slot-scope="text,record">
            <div class="btn_router_link">
              <router-link to @click.native="details(record.id,1)">详情
              </router-link>
              <template v-if='record.status == "未审核"'>
                <span>｜</span>
                <router-link to @click.native="$message.info('暂未开通')">审核
                </router-link>
              </template>
              <span>|</span>
              <router-link to @click.native="onRemarks(record)">备注
              </router-link>
            </div>
          </template>
        </a-table>
      </a-tab-pane>
      <a-tab-pane key="2" tab="家长" force-render>
        <div class="filter-box">
          <div>
            <p>
              <a-input placeholder="用户名" v-model="parent.name" allow-clear />
            </p>
            <p>
              <a-input placeholder="姓名" v-model="parent.realName" allow-clear />
            </p>
            <p>
              <a-input placeholder="手机号" v-model="parent.tell" allow-clear />
            </p>
            <p>
              <a-input placeholder="证件号" v-model="parent.code" allow-clear />
            </p>
          </div>
          <div>
            <a-button :loading='loading2' @click="onSearch(2)" class='antBtn1'>
              搜索
            </a-button>
            <!-- <span class="span1" @click="onSearch(2)">搜索</span> -->
            <a-button class="antBtn2" @click="Onempty(2)">重置</a-button>
          </div>
        </div>
        <a-table :columns="columns2" @change="onPage2" :loading="loading2" :scroll="{x:900}" :data-source="parentData"
          :locale="{emptyText: '暂无数据'}" :pagination="{
            total:parent.total,
            current:parent.pageNumber,
            defaultPageSize:parent.pageSize,
            showSizeChanger: true,
          showTotal: function(total, range){
            return `共${total}条`}} ">
          <template slot="status" slot-scope="text">
            <span class="money">{{text}}</span>
          </template>
          <!-- 注册时间 -->
          <template slot="createTime" slot-scope="createTime">
            {{$moment(createTime).format("yyyy-MM-DD")}}
          </template>
          <!-- 手机号 -->
          <template slot="tellPhone" slot-scope="item">{{$fun.FunDesensitization(item)}}</template>
          <!-- 身份证号 -->
          <template slot="certificateNumber" slot-scope="item">{{$fun.FunDesensitization(item, 10)}}</template>
          <template slot="operation" slot-scope="text,record">
            <div class="btn_router_link">
              <router-link to @click.native="detailsParent(record.id)">详情
              </router-link>
              <span>|</span>
              <router-link to @click.native="onUpdate(record)">编辑
              </router-link>
              <span>|</span>
              <router-link to @click.native="onRemarks(record)">备注
              </router-link>
            </div>
          </template>
        </a-table>
      </a-tab-pane>
      <a-tab-pane key="3" tab="从业人员">
        <div class="filter-box">
          <div>
            <p>
              <a-input placeholder="用户名" v-model="employees.name" />
            </p>
            <p>
              <a-input placeholder="手机号" v-model="employees.tell" />
            </p>
            <p>
              <a-input placeholder="证件号" v-model="employees.code" />
            </p>
          </div>
          <div>
            <a-button :loading='loading3' @click="onSearch(3)" class='antBtn1'>
              搜索
            </a-button>
            <!-- <span class="span1" @click="onSearch(3)">搜索</span> -->
            <a-button class="antBtn2" @click="Onempty(3)">重置</a-button>
          </div>
        </div>
        <a-table :columns="columns3" @change="onPage3" :loading="loading3" :scroll="{x:1250}"
          :data-source="employeesData" :locale="{emptyText: '暂无数据'}" :pagination="{
            total:employees.total,
            current:employees.pageNumber,
            defaultPageSize:employees.pageSize,
            showSizeChanger: true,
          showTotal: function(total, range){
            return `共${total}条`}} ">
          <template slot="status" slot-scope="text">
            <span class="money">{{text}}</span>
          </template>
          <!-- 注册时间 -->
          <template slot="createTime" slot-scope="createTime">
            {{$moment(createTime).format("yyyy-MM-DD")}}
          </template>
          <!-- 手机号 -->
          <template slot="tellPhone" slot-scope="item">{{$fun.FunDesensitization(item)}}</template>
          <!-- 身份证号 -->
          <template slot="certificateNumber" slot-scope="item">{{$fun.FunDesensitization(item, 10)}}</template>
          <template slot="operation" slot-scope="text,record">
            <div class="btn_router_link">
              <router-link to @click.native="detailsParent(record.id)">详情
              </router-link>
              <span>|</span>
              <router-link to @click.native="onUpdate(record)">编辑
              </router-link>
              <span>|</span>
              <router-link to @click.native="onRemarks(record)">备注
              </router-link>
            </div>
          </template>
        </a-table>
      </a-tab-pane>
      <a-tab-pane key="4" tab="普通用户">
        <div class="filter-box">
          <div>
            <p>
              <a-input placeholder="用户名" v-model="ordinaryUsers.userName" allow-clear />
            </p>
            <p>
              <a-input placeholder="手机号" v-model="ordinaryUsers.tellPhone" allow-clear />
            </p>
          </div>
          <div>
            <a-button :loading='loading1' @click="onSearch(4)" class='antBtn1'>
              搜索
            </a-button>
            <a-button class="antBtn2" @click="Onempty(4)">重置</a-button>
            <!-- <span class='span1' @click='$router.push("/CourseManagementAdd")'>+新建</span> -->
          </div>
        </div>
        <a-table :columns="columns4" @change="onPage4" :loading="loading4" :scroll="{x:1250}"
          :data-source="ordinaryUsers.data" :locale="{emptyText: '暂无数据'}" :pagination="{
            total:ordinaryUsers.total,
            current:ordinaryUsers.pageNumber,
            defaultPageSize:ordinaryUsers.pageSize,
            showSizeChanger: true,
          showTotal: function(total, range){
            return `共${total}条`}} ">
          <!-- 注册时间 -->
          <template slot="index" slot-scope="item,row,i">
            {{(ordinaryUsers.pageNumber -1) * ordinaryUsers.pageSize + i + 1}}
          </template>
          <!-- 手机号 -->
          <template slot="tellPhone" slot-scope="item">{{$fun.FunDesensitization(item)}}</template>
          <!-- 身份证号 -->
          <template slot="certificateNumber" slot-scope="item">{{$fun.FunDesensitization(item, 10)}}</template>
          <template slot="createTime" slot-scope="createTime">
            {{$moment(createTime).format("yyyy-MM-DD")}}
          </template>
        </a-table>
      </a-tab-pane>
    </a-tabs>
    <!-- 备注弹框 -->
    <a-modal title="备注" width='600px' centered :visible="remarksObj.visible" :confirm-loading="remarksObj.loading"
      @ok="remarksOk"
      @cancel="remarksObj.visible = false;remarksObj.loading = false;remarksObj.row =  { id: null, remark: '' };">
      <div style='display:flex;justifyContent:center;margin:20px 0' class="remarks">
        <span style=' vertical-align: top;'>备注：</span>
        <a-textarea :rows="4" v-model="remarksObj.row.remark" style='width:300px' :maxLength='300' />
      </div>
    </a-modal>
    <!-- 编辑弹框 -->
    <a-modal title="编辑" width='600px' centered :visible="update" :confirm-loading="remarksObj.loading" @ok="updateOk"
      @cancel="update = false;remarksObj.loading = false;remarksObj.modify =  { id: null, certificateNumber: '',tellPhone: '' };">
      <div style='display:flex;justifyContent:center;margin:20px 0;align-items:center' class="remarks">
        <span>手机号：</span>
        <a-input placeholder="请输入手机号" v-model="remarksObj.modify.tellPhone" size='large' style="width:400px"
          :maxLength='400'></a-input>
      </div>
      <div style='display:flex;justifyContent:center;margin:20px 0' class="remarks">
        <span>证件号：</span>
        <a-input placeholder="请输入证件号" v-model="remarksObj.modify.certificateNumber" size='large' style="width:400px"
          :maxLength='400'></a-input>

      </div>
    </a-modal>
  </div>
</template>

<script>
  const columns2 = [{
      title: "序号",
      width: "80px",
      dataIndex: "index"
    },
    {
      title: "用户名",
      width: "130px",
      dataIndex: "name"
    },
    {
      title: "姓名",
      width: "130px",
      dataIndex: "realName"
    },
    {
      title: "手机号",
      width: "140px",
      dataIndex: "tellPhone",
      scopedSlots: {
        customRender: "tellPhone"
      }
    },
    // {
    //   title: "邮箱",
    //   dataIndex: "email"
    // },
    {
      title: "注册时间",
      width: "120px",
      dataIndex: "createTime",
      scopedSlots: {
        customRender: "createTime"
      }
    },
    {
      title: "证件号",
      width: "200px",
      dataIndex: "certificateNumber",
      scopedSlots: {
        customRender: "certificateNumber"
      }
    },
    {
      title: "性别",
      width: "60px",
      dataIndex: "sex"
    },
    // {
    //   title: "孩子生日",
    //   dataIndex: "birthdayTime"
    // },
    {
      title: "操作",
      width: "120px",
      scopedSlots: {
        customRender: "operation"
      }
    }
  ];
  const columns3 = [{
      title: "序号",
      width: "80px",
      dataIndex: "index"
    },
    {
      title: "用户名",
      width: "130px",
      dataIndex: "name"
    },
    {
      title: "手机号",
      width: "130px",
      dataIndex: "tellPhone",
      scopedSlots: {
        customRender: "tellPhone"
      }
    },
    {
      title: "邮箱",
      dataIndex: "email"
    },
    {
      title: "真实姓名",
      width: "100px",
      dataIndex: "realName"
    },
    {
      title: "注册时间",
      dataIndex: "createTime",
      width: "130px",
      scopedSlots: {
        customRender: "createTime"
      }
    },
    {
      title: "证件号",
      width: "200px",
      dataIndex: "certificateNumber",
      scopedSlots: {
        customRender: "certificateNumber"
      }
    },
    {
      title: "所在地",
      dataIndex: "address"
    },
    {
      title: "操作",
      width: "150px",
      scopedSlots: {
        customRender: "operation"
      }
    }
  ];
  const columns4 = [{
      title: "序号",
      width: "80px",
      dataIndex: "index",
      scopedSlots: {
        customRender: "index"
      }
    },
    {
      title: "用户名",
      width: "160px",
      dataIndex: "userName"
    },
    {
      title: "手机号",
      width: "160px",
      dataIndex: "tellPhone",
      scopedSlots: {
        customRender: "tellPhone"
      }
    },
    {
      title: "注册时间",
      dataIndex: "registerTime"
    }
  ];
  export default {
    // 可用组件的哈希表
    components: {},
    // 接收传值
    props: {},
    // 数据对象
    data() {
      return {
        userInfo: JSON.parse(sessionStorage.getItem('HXuserInfo')),
        visible: false, //详情页
        update: false, //编辑
        tabsSwitch: "1", //tabs
        columns1: [],
        columns2,
        columns3,
        columns4,
        titleName: '', //弹框页面名称
        mechanismData: [],
        key: 1, //面板切换
        ordinaryUsers: {
          pageNumber: 1,
          pageSize: 10,
          total: 0,
          tellPhone: "",
          userName: '',
          data: []
        },
        mechanism: {
          //机构
          legalPerson: '',
          pageNumber: 1,
          pageSize: 10,
          total: 0,
          name: "",
          code: "",
          enterprisePer: "",
          tell: "",
          registerName: ""
        },
        institutionInfo: { //机构字段回显
          id: '', //机构id
          name: '', //公司名称
          code: '', //企业编码
          legalPerson: '', //法人
          certificateNumber: '', //法人证件号
          registerName: '', //注册人姓名
          userName: '', //用户名
          registerTell: '', //注册人手机号
          registerCertificate: '', //注册人证件号
          registerAddress: '', //注册地址
          businessAddress: '', //办公地址
          businessPhoto: '', //营业执照
          practitionerPhoto: '' //从业执照
        },
        parentData: [],
        parent: {
          // 家长
          pageNumber: 1,
          pageSize: 10,
          total: 0,
          name: "",
          realName: '',
          code: "",
          tell: ""
        },
        employeesData: [],
        employees: {
          //从业者
          pageNumber: 1,
          pageSize: 10,
          total: 0,
          name: "",
          code: "",
          tell: ""
        },
        loading1: false,
        loading2: false,
        loading3: false,
        butFlag1: false, //子页面按钮是否显示 机构
        loading4: false,
        visibleParent: false, //家长
        visiblePract: false, //从业者类表是否显示
        remarksObj: {
          visible: false,
          row: {
            id: '',
            remark: ''
          },
          modify: {
            id: '',
            certificateNumber: '',
            tellPhone: '',
          },
          content: "",
          loading: false,
        }
      };
    },
    // 事件处理器
    methods: {
      // 搜索
      onSearch(type) {
        //需要给页数回归到第一页
        if (type == 1) {
          this.mechanism.pageNumber = 1;
          this.initInstitutionCount();
        } else if (type == 4) {
          this.ordinaryUsers.pageNumber = 1
          this.ordinaryUsersCount()
        } else {
          this.parent.pageNumber = 1;
          this.employees.pageNumber = 1;
          this.initPractitionerCount(type - 1);
        }
      },
      // 重置
      Onempty(type) {
        if (type == 1) {
          //需要给页数回归到第一页
          this.mechanism.pageNumber = 1;
          this.mechanism.name = '';
          this.mechanism.tell = '';
          this.mechanism.enterprisePer = '';
          this.mechanism.legalPerson = '';
          this.mechanism.registerName = '';

          this.initInstitutionCount();
        } else if (type == 2) {
          this.parent.pageNumber = 1;
          this.parent.name = '';
          this.parent.realName = '';
          this.parent.code = '';
          this.parent.tell = '';
          this.initPractitionerCount(type - 1);
        } else if (type == 3) {
          this.employees.pageNumber = 1;
          this.employees.name = '';
          this.employees.code = '';
          this.employees.tell = '';
          this.initPractitionerCount(type - 1);
        } else {
          this.ordinaryUsers.pageNumber = 1;
          this.ordinaryUsers.tellPhone = '';
          this.ordinaryUsers.userName = '';
          this.ordinaryUsersCount()
        }
      },
      ordinaryUsersCount() {
        this.$ajax({
          url: 'member/operate/generalUser/count',
          method: "get",
          params: {
            userName: this.ordinaryUsers.userName,
            tellPhone: this.ordinaryUsers.tellPhone,
          }
        }).then(res => {
          if (res.code == 1 && res.data > 0) {
            this.ordinaryUsers.total = res.data
            this.ordinaryUsersList()
          } else {
            this.ordinaryUsers.total = 0
            this.ordinaryUsers.data = []
          }
        })
      },
      ordinaryUsersList() {
        this.$ajax({
          url: 'member/operate/generalUser/list',
          method: "get",
          params: {
            userName: this.ordinaryUsers.userName,
            tellPhone: this.ordinaryUsers.tellPhone,
            pageNumber: this.ordinaryUsers.pageNumber,
            pageSize: this.ordinaryUsers.pageSize,
          }
        }).then(res => {
          this.ordinaryUsers.data = res.data
        })
      },
      onRemarks(row) {
        this.remarksObj.visible = true
        this.$ajax({
          url: 'member/remark',
          params: {
            roleId: row.id,
            roleType: Number(this.tabsSwitch) + 1, //1.员工，2.机构，3.家长，4.从业者，5.游客
          }
        }).then(res => {
          if (res.code == 1) {
            this.remarksObj.row.id = res.data.id
            this.remarksObj.row.remark = res.data.remark
          } else {
            this.$message.warning(res.msg)
            this.remarksObj.visible = false
          }
        })
      },
      remarksOk() {
        if (!this.remarksObj.row.remark || !this.remarksObj.row.remark.trim()) return this.$message.warning('请输入备注')
        this.remarksObj.loading = true
        this.$ajax({
          url: 'member/remark/update',
          params: {
            id: this.remarksObj.row.id,
            remark: this.remarksObj.row.remark
          }
        }).then(res => {
          if (res.code == 1) {
            this.remarksObj.visible = false
            this.$message.success('操作成功')
            this.remarksObj.loading = false;
            this.remarksObj.row = {
              id: null,
              remark: ''
            };
          } else {
            this.$message.warning(res.msg)
          }
        }).catch(err => {
          this.$message.warning(res.msg)
          this.remarksObj.visible = false
        })
      },
      onUpdate(row) {
        this.update = true,
        this.remarksObj.modify.id = row.id
      },
      updateOk() {
        if (!this.remarksObj.modify.certificateNumber && !this.remarksObj.modify.tellPhone) return this.$message.warning('至少修改一项！')
        if (this.remarksObj.modify.tellPhone) {
          if (!(/^1[\d]{10}$/.test(this.remarksObj.modify.tellPhone))) {
            this.$message.warn('请输入正确的手机号格式！')
            return false;
          }
        }
        if (this.remarksObj.modify.certificateNumber) {
          let result = this.isIdCard(this.remarksObj.modify.certificateNumber)
          if (!result) return;
        }
        this.update = true
        this.$ajax({
          url: '/member/manage/staff/updateTellPhoneAndCertificateNumber',
          method: "post",
          params: {
            id: this.remarksObj.modify.id,
            certificateNumber: this.remarksObj.modify.certificateNumber?this.remarksObj.modify.certificateNumber:null,
            tellPhone: this.remarksObj.modify.tellPhone?this.remarksObj.modify.tellPhone:null
          }
        }).then(res => {
          if (res.code == 1) {
            this.update = false
            this.$message.success('操作成功')
            this.remarksObj.loading = false;
            this.remarksObj.modify = {
              id: null,
              certificateNumber: '',
              tellPhone: '',
            };
          } else {
            this.$message.warning(res.msg)
          }
        }).catch(err => {
          this.$message.warning(res.msg)
          this.update = false
        })
      },
      isIdCard(idCard) {
        // 15位和18位身份证号码的正则表达式
        let regIdCard =
          /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
        // 如果通过该验证，说明身份证格式正确，但准确性还需计算
        if (regIdCard.test(idCard)) {
          if (idCard.length == 18) {
            let idCardWi = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2); // 将前17位加权因子保存在数组里
            let idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2); // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
            let idCardWiSum = 0; // 用来保存前17位各自乖以加权因子后的总和
            for (let i = 0; i < 17; i++) {
              idCardWiSum += idCard.substring(i, i + 1) * idCardWi[i];
            }
            let idCardMod = idCardWiSum % 11; // 计算出校验码所在数组的位置
            let idCardLast = idCard.substring(17); // 得到最后一位身份证号码
            // 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
            if (idCardMod == 2) {
              if (idCardLast == "X" || idCardLast == "x") {
                //alert("恭喜通过验证啦！");
                return true;
              } else {
                //alert("身份证号码错误！");
                this.$message.warn('身份证号码错误！')
                return false;
              }
            } else {
              // 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
              if (idCardLast == idCardY[idCardMod]) {
                //alert("恭喜通过验证啦！");
                return true;
              } else {
                //alert("身份证号码错误！");
                this.$message.warn('身份证号码错误！')
                return false;
              }
            }
          } else {
            return true;
          }
        } else {
          this.$message.warn('身份证格式不正确')
          return false;
        }
      },
      // 分页查询
      onPage1(pagination) {
        this.mechanism.pageNumber = pagination.current;
        this.mechanism.pageSize = pagination.pageSize;
        //再次调用机构信息
        this.initInstitutionCount();
      },
      // 分页查询
      onPage2(pagination) {
        this.parent.pageNumber = pagination.current;
        this.parent.pageSize = pagination.pageSize;
        this.initPractitionerCount(1);
      },
      // 分页查询
      onPage3(pagination) {
        this.employees.pageNumber = pagination.current;
        this.employees.pageSize = pagination.pageSize;
        this.initPractitionerCount(2);
      },
      onPage4(pagination) {
        this.ordinaryUsers.pageNumber = pagination.current;
        this.ordinaryUsers.pageSize = pagination.pageSize;
        this.ordinaryUsersList();
      },
      // 机构详情
      details(id, type) {
        this.$router.push({
          path: this.userInfo.adminType == 2 ? "/Administration/RoleManagementMechanism" :
            "/RoleManagementMechanism",
          query: {
            roleId: id
          }
        })
      },
      //家长详情
      detailsParent(id) {
        this.$router.push({
          path: this.userInfo.adminType == 2 ? "/Administration/RoleManagementParent" : "/RoleManagementParent",
          query: {
            roleId: id,
            tabsSwitch: this.tabsSwitch
          }
        })

      },
      //表格添加触发事件  当前key赋值给属性key
      callback(key) {
        this.key = key;
        //培训机构请求
        if (key == 1) {
          this.initInstitutionCount();
          //家长/从业者请求
        } else if (key == 4) {
          this.ordinaryUsersCount()
        } else {
          this.initPractitionerCount(key - 1);
        }
      },
      //机构信息加载
      initInstitution() {
        //机构数据
        this.$ajax({
          method: "post",
          url: "/member/queryInstitutionAll",
          params: {
            name: this.mechanism.name,
            legalPerson: this.mechanism.legalPerson,
            // code: this.mechanism.code,
            // userName:this.mechanism.registerName,
            institutionCode: this.mechanism.enterprisePer,
            registerTell: this.mechanism.tell,
            page: this.mechanism.pageNumber,
            limit: this.mechanism.pageSize
          }
        }).then(res => {
          if (res.code === 1) {
            res.data.forEach((item, index) => {
              item.index =
                (this.mechanism.pageNumber - 1) * this.mechanism.pageSize + (index + 1);
              item.key = item.id;
            });
            this.mechanismData = res.data;
          }
          this.loading1 = false;
        }).catch(error => {
          if (error) {
            this.loading1 = false
            this.mechanismData = []
          }
        });
      },
      //机构分页信息
      initInstitutionCount() {
        this.loading1 = true;
        this.$ajax({
          method: "post",
          url: "/member/queryInstitutionCount",
          params: {
            name: this.mechanism.name,
            // code: this.mechanism.code,
            userName: this.mechanism.registerName,
            institutionCode: this.mechanism.enterprisePer,
            registerTell: this.mechanism.tell
          }
        }).then(res => {
          this.mechanism.total = res.data;
          if (res.code === 1) {
            this.initInstitution();
          } else {
            this.mechanismData = []
            this.loading1 = false;
          }
        }).catch(error => {
          if (error) {
            this.loading1 = false
            this.mechanismData = []
          }
        });
      },
      //家长从业者
      initPractitioner(params) {
        //家长从业者数据加载
        this.$ajax({
          method: "post",
          url: "/member/queryPractitionerAll",
          params: params
        }).then(res => {
          if (res.code === 1) {
            res.data.forEach((item, index) => {
              if (params.type == 1) {
                item.index =
                  (this.parent.pageNumber - 1) * this.parent.pageSize +
                  (index + 1);
                item.key = item.id;
              } else {
                item.index =
                  (this.employees.pageNumber - 1) * this.employees.pageSize +
                  (index + 1);
                item.key = item.id;
              }
            });
            if (params.type == 1) {
              this.parentData = res.data;
              this.loading2 = false
            } else {
              this.employeesData = res.data;
              this.loading3 = false
            }
          }
        }).catch(error => {
          if (error) {
            if (params.type == 1) {
              this.parentData = [];
              this.loading2 = false
            } else {
              this.employeesData = [];
              this.loading3 = false
            }
          }
        });
      },
      initPractitionerCount(type) {
        var params = {};
        if (type == 1) {
          params.name = this.parent.name;
          params.userName = this.parent.realName
          params.certificateNumber = this.parent.code;
          params.tellPhone = this.parent.tell;
          params.type = type;
          params.page = this.parent.pageNumber;
          params.limit = this.parent.pageSize;
          this.loading2 = true
        } else {
          params.name = this.employees.name;
          params.certificateNumber = this.employees.code;
          params.tellPhone = this.employees.tell;
          params.type = type;
          params.page = this.employees.pageNumber;
          params.limit = this.employees.pageSize;
          this.loading3 = true
        }
        //家长从业者数据个数
        this.$ajax({
          method: "post",
          url: "/member/queryPractitionerCount",
          params: params
        }).then(res => {
          //不管是否有数据给个数赋值
          if (res.code == 1) {

          } else {

          }
          if (res.code === 1) {
            if (type == 1) {
              this.parent.total = res.data;
            } else {
              this.employees.total = res.data;
            }
            this.initPractitioner(params)
          } else {
            this.employees.total = 0;
            this.parent.total = 0;
            if (type == 1) {
              this.loading2 = false
              this.parentData = []
            } else {
              this.loading3 = false
              this.employeesData = []
            }
          }
        }).catch(error => {
          if (error) {
            if (params.type == 1) {
              this.parentData = [];
              this.loading2 = false
            } else {
              this.employeesData = [];
              this.loading3 = false
            }
          }
        });
      },
      getTableInfo() {
        if (this.userInfo.adminType == 2) {
          this.columns1 = [{
              title: "序号",
              width: "80px",
              dataIndex: "index"
            },
            {
              title: "公司名称",
              width: "160px",
              dataIndex: "name"
            },
            {
              title: "企业法人",
              width: "100px",
              dataIndex: "legalPerson"
            },
            {
              title: "企业法人证件号",
              width: "160px",
              ellipsis: "true",
              dataIndex: "certificateNumber"
            },
            {
              title: "注册人手机号",
              width: "140px",
              dataIndex: "registerTell",
              scopedSlots: {
                customRender: "registerTell"
              }
            },
            {
              title: "机构码",
              width: "160px",
              ellipsis: "true",
              dataIndex: "institutionCode"
            },
            {
              title: "审核状态",
              dataIndex: "auditStatus",
              width: "100px",
              scopedSlots: {
                customRender: "status"
              }
            },
            {
              title: "操作",
              width: "130px",
              scopedSlots: {
                customRender: "operation"
              }
            }
          ];
        } else {
          this.columns1 = [{
              title: "序号",
              width: "80px",
              dataIndex: "index"
            },
            {
              title: "公司名称",
              width: "160px",
              dataIndex: "name"
            },
            {
              title: "用户名",
              ellipsis: "true",
              dataIndex: "registerName"
            },
            {
              title: "机构码",
              width: "160px",
              ellipsis: "true",
              dataIndex: "institutionCode"
            },
            {
              title: "企业法人",
              width: "100px",
              dataIndex: "legalPerson"
            },
            {
              title: "企业法人证件号",
              width: "160px",
              ellipsis: "true",
              dataIndex: "certificateNumber"
            },
            {
              title: "注册人手机号",
              width: "140px",
              dataIndex: "registerTell",
              scopedSlots: {
                customRender: "registerTell"
              }
            },
            {
              title: "注册时间",
              dataIndex: "createTime",
              scopedSlots: {
                customRender: "createTime"
              }
            },
            {
              title: "审核状态",
              dataIndex: "auditStatus",
              width: "100px",
              scopedSlots: {
                customRender: "status"
              }
            },
            {
              title: "操作",
              width: "130px",
              scopedSlots: {
                customRender: "operation"
              }
            }
          ];
        }
      }
    },
    // 生命周期-实例创建完成后调用
    created() {
      //初始化默认加载机构信息
      this.tabsSwitch = this.$route.query.tabsSwitch ? this.$route.query.tabsSwitch.toString() : '1'
      this.getTableInfo()
      if (this.tabsSwitch == '1') {
        this.initInstitutionCount();
      } else {
        this.initPractitionerCount(this.$route.query.tabsSwitch - 1)
      }
    },
    // 生命周期-实例挂载后调用
    mounted() {},
    // 生命周期-实例销毁离开后调用
    destroyed() {},
    // 计算属性监听
    computed: {},
    // 自定义的侦听器
    watch: {
      key() {
        this.parent.name = '';
        this.parent.code = '';
        this.parent.tell = '';
        this.parent.realName = '';
        this.mechanism.name = '';
        this.mechanism.tell = '';
        this.mechanism.enterprisePer = '';
        this.mechanism.registerName = '';
        this.employees.name = '';
        this.employees.code = '';
        this.employees.tell = '';
      }
    }
  };

</script>

<style lang="less" scoped>
  .statusbgc {
    i {
      display: inline-block;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      margin-right: 5px;
      vertical-align: middle;
    }

    .icolor1 {
      background-color: #00af63;
    }

    .icolor2 {
      background-color: @theme;
    }

    .icolor3 {
      background-color: #de1e1e;
    }
  }

  .mechanismModal {
    width: 100%;
    display: flex;
    justify-content: space-between;

    >div {
      width: 50%;

      .imgModal {
        display: flex;
        justify-content: space-between;

        span:first-child {
          width: 80px;
        }

        span:last-child {
          padding-top: 14px;
          width: calc(100% - 80px);
        }

        img {
          width: 120px;
        }
      }

      >p {
        font-size: 14px;
        line-height: 1;
        margin-bottom: 24px;

        span {
          color: #999;
        }
      }
    }
  }

  .parentModal {
    padding-left: 20px;

    >p {
      font-size: 14px;
      line-height: 1;
      margin-bottom: 24px;

      span {
        color: #999;
      }
    }
  }

  /deep/.ant-modal-footer,
  /deep/ .ant-modal-header {
    text-align: center;
    border: 0;
  }

</style>