<template>
  <section class="eltab3">
    <MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData" :tableloading="tableloading"
      :tableHeight="'100%'" :isSelect="false" style="width: 100%;" :isSort="false" :actionsW="350">
      <template #sign="{ row }">
        <p style=" width: 12px; height: 12px;border-radius: 50%;margin: 0 auto"
          :style="{ 'background-color': row?.sign ? '#33CC00' : '#FC5F76' }"></p>
      </template>
      <template #sex="{ row }">
        <dict-tag v-if="row.sex" :options="props.dict.D_BZ_XB" :value="row.sex" :tag="false" />
        <span v-else>无</span>
      </template>
      <template #carstyle="{ row }">
        <dict-tag v-if="row.carstyle" :options="props.dict.D_TB_DRIVELEVEL" :value="row.carstyle" :tag="false" />
        <span v-else>无</span>
      </template>
      <template #thebidtype="{ row }">
        {{ row.thebidtype == "1" ? "上岗证" : "准驾证" }}
      </template>
      <template #actions="{ row }">
        <span v-if="row.type == '01'" class="operate" style="color: rgb(230, 38, 48) important"
          @click="handleSee(row, 'see')">待审核</span>
        <!--临近到期时间的一个月过期->立即审验  -->
        <span class="operate" v-if="row.dqstate == '等待审验' && row.state == '6' && row.tbdwid == getItem('deptId').ssdwid"
          style="color: red !important" @click="handleCkxx(row)">立即审验</span>
        <span class="operedit" @click="handleSee(row, 'see')"><el-icon>
            <EditPen />
          </el-icon>查看审核状态</span>
        <span class="operesee" @click="handleedit(row)"><el-icon>
            <View />
          </el-icon>查看信息</span>
        <span v-if="row.refuse && props.showklc" class="operedown" @click="handleCkxx(row)"><el-icon>
            <RefreshLeft />
          </el-icon>重新提交</span>
        <!-- <el-popconfirm v-if="(row.state == '7' || row.state == '6') && props.showklc" confirm-button-text="是"
          cancel-button-text="否" icon-color="red" title="确定要删除吗?" @confirm="handledel(row, 'see')">
          <template #reference>
            <span class="operdel"><el-icon>
                <Delete />
              </el-icon>删除</span>
          </template>
</el-popconfirm> -->
        <el-popconfirm v-if="(row.state == '7') && props.showklc" confirm-button-text="是" cancel-button-text="否"
          icon-color="red" title="确定要删除吗?" @confirm="handledel(row, 'see')">
          <template #reference>
            <span class="operdel"><el-icon>
                <Delete />
              </el-icon>删除</span>
          </template>
        </el-popconfirm>
      </template>
    </MOSTY.Table>
    <div class="fenye">
      <Pages :pageConfiger="pageData.pageConfiger" @changeNo="handleCurrentChange" @changeSize="handleSizeChange">
      </Pages>
    </div>
  </section>
</template>

<script setup>
import { postApi } from "@/api/tobAcco_api.js";
import { singleObjectCheck } from "@/utils/tools.js"
import { onMounted, ref, reactive, defineProps, defineEmits, watch, defineExpose, getCurrentInstance } from "vue";
import { exportXlsx } from "@/excel/Export2Excel.js";
import Pages from '@/components/aboutTable/Pages/index.vue'
import { getItem } from "@/utils/storage";
import * as MOSTY from "@/components/MyComponents/index";
const { proxy } = getCurrentInstance()
const tableloading = ref(false);
const showzxtj = ref(false)
const props = defineProps({
  dict: {
    type: Object,
    default: { D_BZ_XB: [], D_BZ_AQRYWHCD: [], D_TB_DRIVELEVEL: [] }
  },
  params: Object,//查询参数
  showklc: {
    type: Boolean,
    default: false
  }
})
// 上岗证
let workLicense = ["drivername", "sex", "driverhistory", "carstyle", "thebidtype", "fristpoststime",
  "nextpoststime"]
// 准驾证
let drivingPermit = ["thebidtype", "drivername", "sex", "brithday", "age", "jobpart", "education",
  "driverhistory", "drivernumber", "carstyle", "thejob", "usestate", "fristpoststime", "lastpoststime",
  "zzmm", "sfzz", "isqualified", "probationgk"]
const emits = defineEmits([""])
// 分页
const listQuery = ref({
  pageCurrent: 1,
  pageSize: 20,
  time: 2
});
const pageData = reactive({
  tableColumns: [
    {
      title: "标记",
      prop: "sign",
      sortable: false,
      slot: true
    },
    {
      title: "姓名",
      prop: "drivername"
    },
    {
      title: "性别",
      prop: "sex",
      slot: true
    },
    {
          title: "驾驶证申领日期",
          prop: "driverGetTime"
        },
    {
      title: "准驾车型",
      prop: "carstyle",
      slot: true
    },
    {
      title: "证件类型",
      prop: "thebidtype",
      slot: true
    },
    {
      title: "上岗证初次领证时间",
      prop: "fristpoststime"
    },
    {
      title: "到期时间",
      prop: "nextpoststime"
    },
    {
      title: "当前状态",
      prop: "dqstate"
    },
    {
      title: "操作",
      prop: "actions",
      slot: true
    }
  ],
  pageConfiger: {
    pageSize: 20,
    pageCurrent: 1,
    total: 0
  },
  tableData: []
})
watch(() => props.params, val => {
  if (val) {
    listQuery.value.pageCurrent = 1
    listQuery.value = { ...listQuery.value, ...val }
    getListData()
  }
})
onMounted(() => {
  if (props.params && props.params.orgcode) {
    listQuery.value.orgcode = props.params.orgcode
    getListData()
  }
})
//审核状态
const handleSee = (row) => {
  emits("clickBut", { id: row.id, type: "audit" })
}
//查看
const handleedit = (row) => {
  emits("clickBut", { id: row.id, type: "detail" })
}
//重新提交
const handleCkxx = (row) => {
  emits("clickBut", { id: row.id, type: "anewSubmit" })
}
//删除
const handledel = (row) => {
  emits("clickBut", { id: row.id, type: "delete" })
  getListData()
}
// 导出表格
const export2Excel = () => {
  let title = {
    drivername: "姓名",
    sex: "性别",
    deptname: "单位/部门",
    driverhistory: "驾驶工龄(年)",
    categorys: "证件类型",
    drivernumber: "证件号码",
    carstyle: "准驾车型",
    lastpoststime: "上次领证时间",
    datedue: "到期时间",
    dqstate: "当前状态"

  };
  listQuery.value.pageCurrent = 1
  listQuery.value.pageSize = 10000
  postApi(listQuery.value, "/mosty-jcgl/driverposts/queryDriverpostsList").then((res) => {
    if (res.records) {
      let data = res.records;
      if (data.length > 0) {
        for (let i = 0; i < data.length; i++) {
          data[i].sex = data[i].sex ? proxy.$getDictVal(data[i].sex, { value: props.dict.D_BZ_XB }) : '无';
          data[i].carstyle = data[i].carstyle ? proxy.$getDictVal(data[i].carstyle, { value: props.dict.D_TB_DRIVELEVEL }) : '无';
          data[i].categorys = data[i].thebidtype == '1' ? '上岗证' : '准驾证';
          filterTable(data[i])
        }
        let tablename = "上岗证审验列表.xlsx";
        exportXlsx(title, data, '上岗证审验列表', tablename);
      } else {
        proxy.$message.warning('暂无数据');
      }
    }
  });
};
//列表
const getListData = () => {
  tableloading.value = true;
  postApi(listQuery.value, `/mosty-jcgl/driverposts/queryDriverpostsList`).then(
    async (res) => {
      let table_Data = []
      if (res.records) {
        tableloading.value = false;
        for (let i = 0; i < res.records.length; i++) {
          if (res.records[i].thebidtype === '1') {
            table_Data.push(await singleObjectCheck(res.records[i], workLicense))
            continue
          }
          // table_Data.push(await singleObjectCheck(res.records[i], drivingPermit))
        }
        pageData.tableData = table_Data;
        pageData.tableData.forEach(item => {
          filterTable(item)
        })
        pageData.pageConfiger.total = res.total
      } else {
        tableData.value = [];
        tableloading.value = false;
      }
    }
  );
}
//数据筛选
const filterTable = (item) => {
  let datedue = new Date(item.nextpoststime);
  let now = new Date();
  datedue.setMonth(datedue.getMonth() - 1);

  // if (now >= datedue) {
  //   item.dqstate = '等待审验'
  // }
  if (item.tokzstate == '2') {
    item.dqstate = '省/市-安全处(科)负责人审批不通过'
    showzxtj.value = true
  } else if (item.tokzstate == '1') {
    item.dqstate = '完成'
    showzxtj.value = false
  } else if (item.carcontrollerstate == '2') {
    item.dqstate = '省/市-安全管理员审批不通过'
    showzxtj.value = true
  } else if (item.carcontrollerstate == '1') {
    item.dqstate = '省/市-安全处(科)负责人审批中'
    showzxtj.value = false
  } else if (item.unitspheadspsate == '2') {
    item.dqstate = '省/市-车管部门负责人审批不通过'
    showzxtj.value = true
  } else if (item.unitspheadspsate == '1') {
    item.dqstate = '省/市-安全管理员审批中'
    showzxtj.value = false
  } else if (item.fgldstate == '2') {
    item.dqstate = '市车管员审批不通过'
    showzxtj.value = true
  } else if (item.fgldstate == '1') {
    item.dqstate = '省/市-车管部门负责人审批中'
    showzxtj.value = false
  } else if (item.unitsecurityspstate == '2') {
    item.dqstate = '物流-车管部门负责人审批不通过'
    showzxtj.value = true
  } else if (item.unitsecurityspstate == '1') {
    item.dqstate = '市车管员审批中'
    showzxtj.value = false
  } else if (item.unitpartspstate == '2') {
    item.dqstate = '县-车管部门负责人审批不通过'
    showzxtj.value = true
  } else if (item.unitpartspstate == '1') {
    item.dqstate = '物流-车管部门负责人审批中'
    showzxtj.value = false
  } else {
    item.dqstate = '县-车管部门负责人审批中'
    showzxtj.value = false
  }

  if (now >= datedue) {
    if (!item.refuse) item.dqstate = '等待审验'
  }
}
//分页
const handleSizeChange = (currentSize) => {
  listQuery.value.pageSize = currentSize;
  pageData.pageConfiger.pageSize = currentSize;
  getListData();
};
const handleCurrentChange = (currentPage) => {
  listQuery.value.pageCurrent = currentPage;
  pageData.pageConfiger.pageCurrent = currentPage;
  getListData();
};

defineExpose({
  export2Excel
})
</script>

<style lang="scss" scoped>
.eltab3 {
  height: calc(100vh - 430px);
}
</style>
