<template>
  <el-dialog
    v-dialogDrag
    :title="emplyeeTitle"
    :visible="dialogFormVisible"
    @close="cancelForm"
    :close-on-click-modal="false"
    class="el-dialog-single"
  >
    <el-form
      label-width="90px"
      :model="formList"
      :rules="rules"
      ref="ruleForm"
    >
    <el-row>
      <el-col>
        <div class="ExportEmployeeDiv">
          <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
          <div style="margin: 10px 0;"></div>
          <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
            <el-checkbox v-for="(city,index) in cities" :label="city.key" :key="index">{{city.name}}</el-checkbox>
          </el-checkbox-group>
        </div>  
      </el-col>
    </el-row>
      
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm()">导 出</el-button>
      <el-button @click="cancelForm()">取 消</el-button>
    </div>
  </el-dialog>
</template>
<script>
import selectTree from "@/components/SelectTree";
import { getExportEmployeeColumnsApi,exportExcelEmployeeApi} from "@/api/staffApi.js"
import config from "@/utils/config";
 var cityOptions = [];
export default {
  props: ["showdialogExport", "getTreeDepartlist"],
  watch: {
    showdialogExport() {
      this.dialogFormVisible = this.showdialogExport;
      this.path=""
      this.disabled=true
      this.resultShow=false
      this.formList.downloadUrl=""
    },
  },
  components: {
    selectTree //注册组件
  },
  data() {
    return {     
      title: "",
      dialogFormVisible: this.showdialogExport,
      OperType: 0, //0 新增  1修改
      formList: {},
      rules: {
        // name: [{required: true, message: "请输入部门名称", trigger: "blur" }],        
      },
      path:"",//文件上传后生成的路径
      disabled:true,
      resultShow:false,
      emplyeeTitle:`导出${$SuperviseStr.employee}`,
      homeTemplateBoradType:localStorage.getItem('homeTemplateBoradType')||'',
      checkAll: false,
      checkedCities: [],
      cities: cityOptions,
      isIndeterminate: true,
      institutionalCode:localStorage.getItem('institutionalCode')||'',//机构类型
    };
  },
  methods: {  
    getTableRow(data, type) {       
      let newRowData = JSON.parse(JSON.stringify(data)); //拷贝一份存储对象
      this.formList = newRowData; //拷贝一份存储对象引用不同地址
      this.OperType = type;
      console.log(this.formList)
      this.checkAll=false
      this.checkedCities=[]
      this.isIndeterminate=false    
      if (this.OperType == 0) {
        // this.title = "导出";       
        this.getExportColumns()
      } else {
        // this.title = "导出";        
      }
    },  
    getExportColumns(){
      cityOptions=[]//重置数据
      let obj2={domainId:this.$route.query.domainId}//获取url域domainId 
       getExportEmployeeColumnsApi(obj2).then(response=>{
           if(response.data){
             console.log(response.data)
             if(this.homeTemplateBoradType=='rtpayTemplate'){
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='证件核验状态,实名认证状态,是否有保安资格证,保安资格证号,是否投保' //rt环境不需要这几个列显示
                  return str.indexOf(item.name)==-1 //返回同上面str不一样的字段
                })
                this.cities=arr
             }else if(localStorage.getItem('appidSupervise')&&JSON.parse(localStorage.getItem('appidSupervise')).appId=='__d1qEDy3wYq8VF5KvUoE'){//监控端--机构用户管理
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='证件核验状态,实名认证状态,是否签订合同,是否有保安资格证,保安资格证号,是否投保' //监控端环境不需要这几个列显示
                  return str.indexOf(item.name)==-1 //返回同上面str不一样的字段
                })
                this.cities=arr
             }else if(this.institutionalCode=='0601'){
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='实名认证状态,认证失败原因,转正日期,是否签订合同,是否有保安资格证,保安资格证号,是否有等级证,等级证等级,等级证编号,是否投保,员工状态,试用期,原定转正日期' //0601不需要这几个列显示
                  return str.indexOf(item.name)==-1 //返回同上面str不一样的字段
                })
                this.cities=arr
              }else if(this.institutionalCode&&this.institutionalCode.startsWith('04')){
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='实名认证状态,认证失败原因,转正日期,是否签订合同,是否有保安资格证,保安资格证号,是否有等级证,等级证等级,等级证编号,是否投保,员工状态,试用期,原定转正日期' //0601不需要这几个列显示
                  return str.indexOf(item.name)==-1 //返回同上面str不一样的字段
                })
                this.cities=arr
              }else if(this.institutionalCode&&this.institutionalCode.startsWith('07')){
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='实名认证状态,认证失败原因,转正日期,是否签订合同,是否有保安资格证,保安资格证号,是否有等级证,等级证等级,等级证编号,是否投保,员工状态,试用期,原定转正日期' //0601不需要这几个列显示
                  return str.indexOf(item.name)==-1 //返回同上面str不一样的字段
                })
                this.cities=arr
              }else if((this.institutionalCode&&this.institutionalCode.endsWith('07'))||(this.institutionalCode&&this.institutionalCode.endsWith('08'))||(this.institutionalCode&&this.institutionalCode.endsWith('09'))){
                let arr=response.data
                arr=arr.filter(item=>{
                  let str='姓名,手机号码,证件类型,证件号码,年龄,所属部门,职业类型,性别,出生日期,民族,文化程度,政治面貌,户籍类型,身高,籍贯,兵役情况,婚姻状况,身份证有效期,身份证住址' //0601不需要这几个列显示
                  return str.indexOf(item.name)>-1 //返回同上面str一样的字段
                })
                this.cities=arr
              }else{
               this.cities=response.data
             }
             this.cities.forEach(item=>{
               cityOptions.push(item.key)
             })
             console.log(cityOptions)
           }
       })
    },
    handleCheckAllChange(val) {//全选判断
      console.log(val)
      this.checkedCities = val ? cityOptions : [];
      this.isIndeterminate = false;  
      console.log(cityOptions)
      this.$set(this.formList,'columns',cityOptions)
    },
    handleCheckedCitiesChange(value) {//单个复选判断
      console.log(value)
      this.$set(this.formList,'columns',value)
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.cities.length;
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
    },      
    submitForm() {  
      console.log(this.formList.columns)
      if(!this.formList.columns||this.formList.columns.length==0){
         this.$message({type:'warning',message:'请选择要导出的字段'})
         return
      } 
      let obj2={domainId:this.$route.query.domainId}    
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
            exportExcelEmployeeApi(this.formList,obj2).then((response) => {
                const content = response;
                const blob = new Blob([content]);
                let domainName=localStorage.getItem('domainName')||''
                const fileName = `在职${$SuperviseStr.employee}_${domainName}.xls`;
                if ("download" in document.createElement("a")) {
                  // 非IE下载
                  const elink = document.createElement("a");
                  elink.download = fileName;
                  elink.style.display = "none";
                  elink.href = URL.createObjectURL(blob);
                  document.body.appendChild(elink);
                  elink.click();
                  URL.revokeObjectURL(elink.href); // 释放URL 对象
                  document.body.removeChild(elink);
                } else {
                  // IE10+下载
                  navigator.msSaveBlob(blob, fileName);
                }
            });
          
        } else {
          return false;
        }
      });
    },
    cancelForm() {
      //取消关闭
      this.$emit("update:showdialogExport", false);
      if(this.path){//上传文件成功
       this.$emit("refurlist", {}); //确定后发送$emit绑定父数据
      }
      this.$nextTick(function () {
        this.$refs.ruleForm.resetFields(); //重置输入框提示
      });
    },
  },
};
</script>
<style lang="scss">
.ExportEmployeeDiv{
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   text-align: left;
}
</style>