<template>
    <div class="dialog" v-if="dialogForm">
        <div class="head_box">
            <span class="title">{{ title }}</span>
            <div>
                <el-button type="primary" size="small" :loading="loading" @click="submit" v-show="!disabledFoem">保存</el-button>
                <el-button size="small" @click="close">关闭</el-button>
            </div>
        </div>
        <el-form ref="elform" :model="listQuery" :rules="rules" :inline="true" :disabled="disabledFoem" label-position="top">
            <el-form-item prop="xm" label="姓名">
                <el-input v-model="listQuery.xm" placeholder="请填写姓名"></el-input>
            </el-form-item>
            <el-form-item prop="sfzh" label="身份证号">
                <el-input v-model="listQuery.sfzh" placeholder="请填写身份证号"></el-input>
            </el-form-item>
            <el-form-item prop="xb" label="性别">
               <el-select readonly v-model="listQuery.xb">
                   <el-option v-for="item in props.dic.D_BZ_XB" :key="item.value" :label="item.label" :value="item.value"></el-option>
               </el-select>
            </el-form-item>
            <el-form-item prop="lxdh" label="联系电话">
                <el-input v-model="listQuery.lxdh" placeholder="请填写联系电话"></el-input>
            </el-form-item>
            <el-form-item prop="csrq" label="出生日期">
                <el-input readonly v-model="listQuery.csrq" placeholder="请填写出生日期"></el-input>
            </el-form-item>
            <el-form-item prop="jg" label="籍贯">
                <el-input v-model="listQuery.jg" placeholder="请填写籍贯"></el-input>
            </el-form-item>
            <el-form-item prop="xxdz" label="现住址" style="width:100%;">
                <el-input v-model="listQuery.xxdz" placeholder="请填写现住址"></el-input>
            </el-form-item>
            <el-form-item prop="bz" label="备注" style="width:100%;">
                <el-input v-model="listQuery.bz" placeholder="请填写备注"></el-input>
            </el-form-item>
        </el-form>
    </div>
</template>

<script setup>
import { qcckGet, qcckPost ,qcckPut} from "@/api/qcckApi.js";
import * as rule from "@/utils/rules.js";
import { IdCard } from "@/utils/validate.js";
import { ref,defineExpose, reactive,defineProps,getCurrentInstance ,defineEmits} from 'vue';
const props = defineProps({
    dic:{ type:Object, default:{} }
})
const emits = defineEmits(['updateDate'])
const { proxy } = getCurrentInstance();
const validateIdentity = () => {
  return (rule, value, callback) => {
    if (!value) {
      return callback(new Error('身份证号不能为空'));
    } else if (!/(^\d{15}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
      callback(new Error("输入的身份证长度或格式错误"));
    }
    //身份证城市
    var aCity = {
      11: "北京",
      12: "天津",
      13: "河北",
      14: "山西",
      15: "内蒙古",
      21: "辽宁",
      22: "吉林",
      23: "黑龙江",
      31: "上海",
      32: "江苏",
      33: "浙江",
      34: "安徽",
      35: "福建",
      36: "江西",
      37: "山东",
      41: "河南",
      42: "湖北",
      43: "湖南",
      44: "广东",
      45: "广西",
      46: "海南",
      50: "重庆",
      51: "四川",
      52: "贵州",
      53: "云南",
      54: "西藏",
      61: "陕西",
      62: "甘肃",
      63: "青海",
      64: "宁夏",
      65: "新疆",
      71: "台湾",
      81: "香港",
      82: "澳门",
      91: "国外"
    };
    if (!aCity[parseInt(value?.substr(0, 2))]) {
      callback(new Error("身份证地区非法"));
    }
    // 出生日期验证
    var sBirthday = ( value.substr(6, 4) + "-" + Number(value.substr(10, 2)) + "-" + Number(value.substr(12, 2))).replace(/-/g, "-"),
    d = new Date(sBirthday);
    let yyyy = d.getFullYear();
    let mm = d.getMonth() + 1;
    let dd = d.getDate();
    if (sBirthday !== yyyy + "-" + mm + "-" + dd) {
      listQuery.value.csrq= "";
      callback(new Error("身份证上的出生日期非法"));
    } else {
      let month = mm < 10 ? "0" + mm : mm;
      listQuery.value.csrq= yyyy + "-" + month + "-" + dd;
    }
    // 身份证号码校验
    var sum = 0,
      weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2],
      codes = "10X98765432";
    for (var i = 0; i < value.length - 1; i++) {
      sum += value[i] * weights[i];
    }
    var last = codes[sum % 11]; //计算出来的最后一位身份证号码
    if (value[value.length - 1] !== last) {
      listQuery.value.xb = ''
      callback(new Error("输入的身份证号非法"));
    } else {
      listQuery.value.csrq= IdCard(listQuery.value.sfzh,1)
      if (parseInt(value.substr(16, 1)) % 2 === 1) {
        listQuery.value.xb = "1";
      } else {
        listQuery.value.xb = "2";
      }
    }
    callback();
  };
};
const title = ref('新增从业人员管理');
const disabledFoem = ref(false) //表单禁用
const dialogForm = ref(false) //弹窗
const listQuery = ref({ sfzh:''}) //表单
const loading = ref(false)
const elform = ref()
const rules = reactive({
    sfzh: [
    { required: true, message: "请输入身份证",  trigger: "blur" },
    { trigger: "change", validator: validateIdentity()}
  ],
    xm: [{ required: true, message: "请输入姓名", trigger: "blur"}],
    ...rule.phoneRule({ validator: false }, "lxdh"), // 是否必填 是否进行校验
})


// 初始化数据
const init = (type,id)=> {
    dialogForm.value = true
    disabledFoem.value = type == 'detail' ? true :false
    if(id){
        title.value = type == 'edit'?'修改从业人员管理':'从业人员管理详情'
        getDataById(id) //根据id查询详情
    }else{
        title.value = '新增从业人员管理'
    }
}
// 根据id查询详情
const getDataById = (id)=>{
  qcckGet({},'/mosty-jcgl/tbJcglXfCyry/'+id).then(res=>{
    listQuery.value = JSON.parse(JSON.stringify(res))
  })
}
// 提交
const submit = ()=>{
    elform.value.validate((valid) => {
    if (!valid) return false;
    loading.value = true;
    if(title.value == '新增从业人员管理'){
      qcckPost(listQuery.value,'/mosty-jcgl/tbJcglXfCyry').then(res=>{
        proxy.$message({type: "success", message: "新增成功"});
        close()
        emits('updateDate')
        loading.value = false;
      }).catch(()=>{ loading.value = false; })
    }else{
      qcckPut(listQuery.value,'/mosty-jcgl/tbJcglXfCyry').then(res=>{
        proxy.$message({type: "success", message: "编辑成功"});
        close()
        loading.value = false;
        emits('updateDate')
      }).catch(()=>{ loading.value = false; })
    }
  });
}
// 关闭
const close = ()=>{
  listQuery.value = { sfzh :''}
  dialogForm.value = false
}
defineExpose({init});
</script>

<style lang='scss' scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";

</style>