<template>
  <MOSTY.PageTree :pageTitle="'职业健康体检列表'" :searchType="'03'" @getDeptId="getdeptId">
    <template #serach>
      <el-divider />
      <MOSTY.Search :searchArr="searchArr" @submit="onSearch" />
    </template>
    <template #table>
      <el-divider />
      <section class="button">
        <el-button @click="addInfo"><el-icon size="small">
            <Plus />
          </el-icon>新增</el-button>
      </section>
      <section class="sectiontabs">
        <MOSTY.Table :table-columns="data.tableColumn" :tableData="data.tableData" :tableloading="tableloading"
          :isSelect="false" :isSort="true" @SortChange="SortChange" actionsW="280">
          <template #type="{ row }">
            <dict-tag v-if="row.type" :options="D_BZ_ZYJKTJLB" :value="row.type" :tag="false" />
            <span v-else>无</span>
          </template>
          <!-- 操作 -->
          <template #actions="{ row }">
            <span class="operedit" @click="editInfo(row)">
              <el-icon>
                <EditPen />
              </el-icon>修改</span>
            <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
              @confirm="del(row)">
              <template #reference>
                <span class="operdel" style="color: yellowgreen" size="small">
                  <el-icon>
                    <Delete />
                  </el-icon>删除</span>
              </template>
            </el-popconfirm>
            <span class="operesee" @click="seeInfo(row)">
              <el-icon>
                <View />
              </el-icon>查看</span>
          </template>
        </MOSTY.Table>
      </section>
      <div class="fenye">
        <MOSTY.Pages :pageConfiger="data.pageConfiger" @changeNo="changeNo" @changeSize="changeSize">
        </MOSTY.Pages>
      </div>
    </template>
  </MOSTY.PageTree>
  <div v-if="showtjjl" class="dialog-box">
    <Addzyjktj :title="pagtitle" :saveBtn='saveBtnshow' @closedial='closetjjl' :rowid="rowid"
      :zdlist='{ D_TB_ZYJK_WHYS, D_BZ_TSZYLX, D_BZ_JCZYWHYS, D_BZ_ZYJKTJLB, D_BZ_SF }' />
  </div>
</template>

<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { getItem } from "@/utils/storage";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { ElMessage } from "element-plus";
import { reactive, onMounted, ref, getCurrentInstance } from "vue";
import Addzyjktj from "./Addzyjktj.vue";
const { proxy } = getCurrentInstance();
const { D_BZ_ZYJKTJLB, D_BZ_JCZYWHYS, D_BZ_TSZYLX, D_TB_ZYJK_WHYS, D_BZ_SF } = proxy.$dict(
  "D_BZ_ZYJKTJLB", "D_BZ_JCZYWHYS", "D_BZ_TSZYLX", "D_TB_ZYJK_WHYS", "D_BZ_SF");
const rowid = ref(null)
const addshow = ref(false)
const emit = defineEmits("changePage");
const showtjjl = ref(false);
const saveBtnshow = ref(false);
const pagtitle = ref('')

const searchArr = reactive([
  {
    showType: "input",
    prop: "title",
    width: '250px',
    placeholder: "请输入体检名称"
  }
]);
const data = reactive({
  searchObj: {},
  tableData: [],
  tableColumn: [
    {
      title: "体检名称",
      prop: "title"
    },
    {
      title: "体检类型",
      prop: "type",
      slot: true
    },
    {
      title: "发起单位名称",
      prop: "ssdwmc"
    },

    {
      title: "体检时间",
      prop: "addtime",
    },
    {
      title: "操作",
      prop: "actions",
      slot: true
    }
  ],
  pageConfiger: {
    pageSize: 20,
    pageCurrent: 1,
    total: 0
  }
});
//分页
const changeNo = (val) => {
  listQuery.pageCurrent = val;
  data.pageConfiger.pageCurrent = val;
  getTableData();
};
const changeSize = (val) => {
  listQuery.pageSize = val;
  data.pageConfiger.pageSize = val;
  getTableData();
};
// 查询数据
const onSearch = (obj) => {
  listQuery.title = obj.title;
  listQuery.pageCurrent = 1;
  data.pageConfiger.pageCurrent = 1;
  getTableData();
};
const listQuery = reactive({
  pageCurrent: 1,
  pageSize: 20,
});
//获取部门数据
const getdeptId = (val) => {
  listQuery.ssdwid = val.id;
  listQuery.pageCurrent = 1;
  data.pageConfiger.pageCurrent = 1;
  getTableData();
  if (getItem("deptId").ssbmid == val.id) {
    addshow.value = true
  } else {
    addshow.value = false
  }
};

const tableloading = ref(false);
function getTableData() {
  tableloading.value = true;
  getApi(
    listQuery,
    `/mosty-jcgl/health/getPageList`
  ).then((res) => {
    if (res.records) {
      data.tableData = res.records;
      tableloading.value = false;
      data.pageConfiger.total = res.total;
    } else {
      data.tableData = [];
      tableloading.value = false;
    }
  }).catch(err => {
    tableloading.value = false;
  }).finally(() => {
    tableloading.value = false;
  });
}
//新增
const addInfo = (row) => {
  tableloading.value = false;
  rowid.value = null
  saveBtnshow.value = true
  pagtitle.value = '职业健康体检新增'
  showtjjl.value = true
};
//修改
const editInfo = (row) => {
  rowid.value = row.id
  saveBtnshow.value = true
  pagtitle.value = '职业健康体检修改'
  showtjjl.value = true
};
//查看
const seeInfo = (row) => {
  rowid.value = row.id
  saveBtnshow.value = false
  pagtitle.value = '职业健康体检详情'
  showtjjl.value = true
};
//删除
const del = (row) => {
  postApi({}, `/mosty-jcgl/health/del/${row.id}`).then(res => {
    ElMessage.success("删除成功");
    getTableData()
  })
}
function closetjjl() {
  rowid.value = null
  saveBtnshow.value = false
  showtjjl.value = false
  getTableData()
}

onMounted(() => {

});
</script>

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

.button {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 12px;
}
</style>