<template>
  <div>
    <el-dialog
      v-if="type === 103"
      :model-value="type === 103"
      :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="START_DATE" label="开始时间" width="85" />
          <el-table-column prop="END_DATE" label="结束时间" width="85" />
          <el-table-column prop="TRAINING_OBJECT" label="培训对象" />
          <el-table-column
            show-overflow-tooltip
            prop="TRAINING_MATERIALS"
            label="培训教材"
          />
          <el-table-column prop="TRAINING_METHODS" label="培训方式" />
          <el-table-column prop="ASSESSMENT_METHOD" label="考核方式" />
          <el-table-column prop="CLASS_HOURS" label="学时" width="70" />
          <el-table-column show-overflow-tooltip prop="PLACE" label="地点" />
          <el-table-column prop="TRAINING_TEACHERS" label="培训教师" />
          <el-table-column
            show-overflow-tooltip
            prop="FUND_GUARANTEE"
            label="经费保障"
          />
          <el-table-column
            show-overflow-tooltip
            prop="QUALITY_ASSESSMENT"
            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>
    <eduplan-form
      v-if="data.formVisible"
      v-model:visible="data.formVisible"
      :ARCHIVESEDUPLAN_ID="data.current.ARCHIVESEDUPLAN_ID"
      :type="data.current.ARCHIVESEDUPLAN_ID ? 'edit' : 'add'"
      :year="year"
      @get-data="fnGetList"
    />
  </div>
</template>

<script setup>
import {
  deleteArchivesEduplan,
  getArchivesEduplanList,
} 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 EduplanForm from "./eduplan_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.ARCHIVESEDUPLAN_ID) {
      await ElMessageBox.confirm("确定要删除吗？", { type: "warning" });
      await deleteArchivesEduplan({
        ARCHIVESEDUPLAN_ID: data.current.ARCHIVESEDUPLAN_ID,
      });
    }
    data.current = undefined;
    await fnGetList();
  }
};

const fnGetList = async () => {
  const respData = await getArchivesEduplanList({ 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>
