<template>
  <div>
    <el-dialog
      v-if="type === 102"
      :model-value="type === 102"
      :title="title"
      :before-close="fnClose"
    >
      <el-space wrap>
        <el-button type="primary" @click="fnAdd">新增</el-button>
        <el-button type="danger" @click="fnDelete"> 删除 </el-button>
        <el-button type="primary" v-print="'#printContent'">打印</el-button>
      </el-space>
      <div id="printContent">
        <div style="text-align: center">
          <el-text size="large">{{ year }}年度本单位师资管理台账</el-text>
        </div>
        <div>
          <el-text size="small">单位名称:{{ CORP_NAME }}</el-text>
        </div>
        <layout-table
          :data="data.dataList"
          :show-pagination="false"
          highlight-current-row
          @row-click="fnCurrentChange"
          @row-dblclick="fnAddOrUpdate"
        >
          <el-table-column label="序号" width="45">
            <template v-slot="{ $index }">
              {{ serialNumber({ currentPage: 1, pageSize: 99999 }, $index) }}
            </template>
          </el-table-column>
          <el-table-column prop="NAME" label="姓名" />
          <el-table-column prop="PHONE" label="电话" />
          <el-table-column prop="WORK_YEAR" label="从事本专业工作年限">
            <template v-slot="{ row }">
              {{ row.WORK_YEAR ? row.WORK_YEAR + "年" : "" }}
            </template>
          </el-table-column>
          <el-table-column prop="OCCUPATION" label="专/兼职" />
          <el-table-column
            show-overflow-tooltip
            prop="CARD_ID"
            label="证书编号"
          />
          <el-table-column prop="ASSESSMENT_DEPT" label="考核部门" />
          <el-table-column prop="ASSESSMENT_DATE" label="考核日期" />
          <el-table-column prop="ASSESSMENT_RESULT" label="考核结果" />
          <el-table-column show-overflow-tooltip prop="DESCR" label="备注" />
        </layout-table>
        <el-row>
          <el-col :span="6">档案管理人员:</el-col>
          <el-col :span="6"></el-col>
          <el-col :span="6"></el-col>
          <el-col :span="6">更新日期:</el-col>
        </el-row>
      </div>
      <template #footer>
        <el-button @click="fnClose">关闭</el-button>
      </template>
    </el-dialog>
    <teacher-form
      v-if="data.formVisible"
      v-model:visible="data.formVisible"
      :ARCHIVESTEACHER_ID="data.current.ARCHIVESTEACHER_ID"
      :type="data.current.ARCHIVESTEACHER_ID ? 'edit' : 'add'"
      :year="year"
      @get-data="fnGetList"
    />
  </div>
</template>

<script setup>
import {
  deleteArchivesTeacher,
  getArchivesTeacherList,
} from "@/request/archives.js";
import { reactive } from "vue";
import { useVModels } from "@vueuse/core";
import { useUserStore } from "@/pinia/user.js";
import LayoutTable from "@/components/table/index.vue";
import { serialNumber } from "@/assets/js/utils.js";
import TeacherForm from "./teacher_form.vue";
import { ElMessageBox } from "element-plus";

const userStore = useUserStore();
const CORP_NAME = userStore.getUserInfo.CORP_NAME;

const props = defineProps({
  title: {
    type: String,
    required: false,
    default: "",
  },
  year: {
    type: String,
    required: false,
    default: "",
  },
  type: {
    type: Number,
    required: true,
  },
  studyTaskId: {
    type: String,
    required: false,
    default: "",
  },
});
const { title, year, type } = useVModels(props);

const data = reactive({
  dataList: [],
  current: undefined,
  formVisible: false,
});

const emits = defineEmits(["update:visible"]);

const fnClose = () => {
  emits("update:current", undefined);
};

const fnCurrentChange = (row) => {
  data.current = row;
};

const fnAdd = () => {
  data.dataList.push({});
};

const fnDelete = async () => {
  if (data.current) {
    if (data.current.ARCHIVESTEACHER_ID) {
      await ElMessageBox.confirm("确定要删除吗？", { type: "warning" });
      await deleteArchivesTeacher({
        ARCHIVESTEACHER_ID: data.current.ARCHIVESTEACHER_ID,
      });
    }
    data.current = undefined;
    await fnGetList();
  }
};

const fnGetList = async () => {
  const respData = await getArchivesTeacherList({ YEAR: year.value });
  if (respData && respData.varList) {
    data.dataList = respData.varList;
  }
};
await fnGetList();

const fnAddOrUpdate = (row) => {
  data.current = row;
  if (row) {
    data.formVisible = true;
  }
};
</script>

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