<template>
  <MOSTY.PageTree :pageTitle="'岗位达标统计表'" :searchType="'03'" @getDeptId="getdeptId">
    <template #titleright>
      <div>
        截止昨日：{{ yesterday }}
      </div>
    </template>
    <template #serach>
      <el-divider />
      <MOSTY.Search :searchArr="searchArr" @submit="onSearch" />
    </template>
    <template #table>
      <section :style="{ height: totalHeight }">
        <MOSTY.Table :tableData="data.tableData" :table-columns="data.tableColumn" :tableConfiger="data.tableConfiger"
          @chooseData="chooseData">
          <!--操作-->
          <template #actions="{ row }">
            <span class="operesee" @click="showInfo(row)"> <el-icon>
                <Compass />
              </el-icon> 详情</span>
          </template>
        </MOSTY.Table>
      </section>
      <div class="fenye">
        <MOSTY.Pages :pageConfiger="data.pageConfiger" @changeNo="changeNo" @changeSize="changeSize" />
      </div>
    </template>
  </MOSTY.PageTree>
</template>

<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { filterYear } from "@/utils/auth.js";
import { postApi } from "@/api/tobAcco_api.js";
import { reactive, onMounted, ref } from "vue";
const emit = defineEmits("changePage", "getobj");
const totalHeight = ref()
const searchArr = reactive([
  {
    showType: "select",
    prop: "year",
    options: filterYear(7),
    placeholder: "请选择年度"
  }
])
// 昨天
let yesterday = ref('')
// 查询条件
const listQuery = reactive({
  year: new Date().getFullYear() + '年'
});
// 初始化
onMounted(() => {
  // 获取前一天的日期
  totalHeight.value = `calc(100vh - 330px)`
  getYeasterDay()
});
// 表格参数
const data = reactive({
  searchObj: {},
  tableData: [],
  tableColumn: [
    {
      title: "单位",
      prop: "depName"
    },
    {
      title: "参与考核人数",
      prop: "joinPersonNum"
    },
    {
      title: "已达标人数",
      prop: "dbNum"
    },
    {
      title: "可达标人数",
      prop: "kdbNum"
    },
    {
      title: "不达标人数",
      prop: "bdbNum"
    },
    {
      title: "达标率",
      prop: "dbl"
    },
    {
      title: "操作",
      prop: "actions",
      slot: true
    }
  ],
  tableConfiger: {
    showIndex: false,
    loading: false
  }
});
// 查询数据
const onSearch = (obj) => {
  listQuery.year = obj.year;
  getTableData();
};
//获取部门数据
const getdeptId = (val) => {
  listQuery.orgcode = val.id;
  getTableData();
};
const tableloading = ref(false);
function getTableData() {
  tableloading.value = true;
  postApi(listQuery, `/mosty-jcgl/gwdb/listGwkh`).then(
    (res) => {
      if (res) {
        data.tableData = res;
        tableloading.value = false;
      } else {
        data.tableData = [];
        tableloading.value = false;
      }
    }
  ).finally(() => {
    tableloading.value = false;
  });
}
//查看
const showInfo = (row) => {
  let obj = {
    title: "综合部详情",
    saveBtnShow: false,
    orgcode: row.depCode,
    year: listQuery.year
  };
  emit("changePage", "AddOrEdite", obj);
};
// 获取昨天日期
const getYeasterDay = () => {
  let date = new Date();
  let y = date.getFullYear();
  let m = date.getMonth() + 1;
  let d = date.getDate() - 1;
  if (d == "0") {
    m = m - 1;
    var temp = new Date(y, m, d);
    d = temp.getDate();
  }
  let Yesterday = [y, m, d];
  Yesterday = Yesterday.join("-");
  yesterday.value = Yesterday;
}
</script>

<style lang="scss" scoped></style>