<template>
  <div class="page">
    <div class="btn_box" style="position: absolute;top: 54px;left: 10px;">
      <el-radio-group v-model="radio1" @input="changeRadio">
        <el-radio-button label="1">窗口考核</el-radio-button>
        <el-radio-button label="2">工作人员考核</el-radio-button>
      </el-radio-group>
      <el-button
        slot="table-head-left2"
        style="margin-left: 10px"
        icon="el-icon-tickets"
        size="mini"
        @click="doExport"
        :disabled="isExport"
        >导出</el-button
      >
    </div>
    <LayoutTable :data="tableData" notAdd notDel :config="tableConfig">
    </LayoutTable>

    <drawer-show ref="drawerform" @ok="getData" />
  </div>
</template>

<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
  name: "WindowWorkmanPerformList",
  components: {
    drawerShow,
  },
  mixins: [table],
  created() {
    // this.getData();
  },
  methods: {
    /** 重写新增方法 */
    toAdd(row) {
      this.$refs.drawerform.add(row);
    },
    /** 重写编辑方法 */
    toEdit(row) {
      console.log(row);
      this.$refs.drawerform.edit(row);
    },
    /** 重写查看方法 */
    toView(row) {
      this.$refs.drawerform.view(row);
    },
    /** 导出Excel */
    doExport() {
      this.isExport = true;
      this.$download(
        "/check/window/workman/perform/exportExcel",
        {
          page: 1,
          size: -1,
        },
        { type: "excel" }
      )
        .then(() => (this.isExport = false))
        .catch((error) => {
          this.isExport = false;
          this.$message.error(error.message);
        });
    },
    // 切换表格
    changeRadio() {
      this.radio1 == 1 ? this.$router.push("/window/perform/list?page=1") : "";
    },
  },
  data() {
    return {
      radio1: 2,
      isExport: false,
      config: {
        isshowTabPane: true,
        search: [
          {
            name: "salaId",
            type: "selectSalaId",
            label: "大厅",
            fuzzy: false,
          },
          {
            name: "deptId",
            type: "selectDeptId",
            label: "部门",
            fuzzy: false,
          },
          {
            name: "checkStatus",
            type: "select",
            label: "核查状态",
            fuzzy: false,
          },
          {
            name: "yearmonth",
            type: "month",
            label: "请选择登记年月",
            fuzzy: false,
          },
          {
            name: "ownerName",
            type: "text",
            width: 200,
            label: "窗口首席代表’姓名搜索",
            fuzzy: false,
          },
        ],
        columns: [
          { type: "selection", width: 60 },
          { type: "index", label: "序号", width: 50 },
          { label: "窗口首席代表", prop: "ownerName" },

          {
            label: "登记年月",
            formatter: (row) => {
              return `${row.year ? row.year : "--"}-${
                row.month
                  ? [1, 2, 3, 4, 5, 6, 7, 8, 9].includes(row.month)
                    ? "0" + row.month
                    : row.month
                  : "--"
              }`;
            },
          },

          { label: "所属大厅", prop: "salaName", formatter: this.formatter },

          {
            label: "所属部门",
            prop: "deptName",
          },

          {
            label: "考核窗口",
            formatter: (row) => {
              return `${row.windowName ? row.windowName : "--"}`;
            },
          },

          { label: "表单名称", prop: "fromName" },

          // { label: "总分分值", prop: "sumScore", formatter: this.formatter },
          {
            label: "提交时间",
            prop: "submitDate",
            width: 110,
            formatter: this.formatterDate,
          },
          {
            label: "核查人",
            formatter: (row) => {
              return `${
                row.leaderCheckPerson
                  ? row.leaderCheckPerson
                  : row.manageCheckPerson
                  ? row.manageCheckPerson
                  : "--"
              }`;
            },
          },
          {
            label: "最新核查时间",
            prop: "manageCheckTime",
            width: 150,
            formatter: this.formatterDate,
          },
          { label: "处理状态", prop: "checkStatus", formatter: this.formatter },

          {
            label: "操作",
            width: 240,
            formatter: (row) => {
              return (
                <table-buttons
                  noAdd
                  noDel
                  noEdit
                  text={"自评核查"}
                  row={row}
                  onEdit={this.toEdit}
                  onView={this.toView}
                  onDel={this.toDel}
                />
              );
            },
          },
        ],
      },
    };
  },
};
</script>
<style lang="less" scoped>
/deep/.el-radio-button__inner {
  border: 1px solid #eee !important;
  height: 28px;
  line-height: 3px;
}
/deep/.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  background: #00b565;
  border: none !important;
  color: #fff !important;
  line-height: 3px;
}
</style>
