<template>
  <MOSTY.PageTree :pageTitle="'综合检查模板'" :searchType="'03'" @getDeptId="getdeptId">
    <template #serach>
      <el-divider />
      <MOSTY.Search :searchArr="searchArr" @submit="onSearch" />
      <el-divider />
      <div class="btnBox">
        <el-button type="primary" @click="addzhmb">
          <el-icon>
            <CirclePlus />
          </el-icon>
          <span>新增</span>
        </el-button>
      </div>

    </template>
    <template #table>
      <section class="eltab9">
        <MOSTY.Table :table-columns="tableColumns" :tableData="tableData" :tableloading="tableloading" :isSelect="true"
          :isSort="true" :actionsW="300">
          <template #actions="scope">
            <span class="operesee" @click="handleManage(scope.row)">
              <el-icon>
                <Compass />
              </el-icon>检查内容配置
            </span>
            <span class="operesee" @click="handleEdit(scope.row)">
              <el-icon>
                <Compass />
              </el-icon>修改
            </span>
            <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
              @confirm="deleteData(scope.row)">
              <template #reference>
                <span class="operdel" size="small">
                  <el-icon>
                    <Delete />
                  </el-icon>
                  删除</span>
              </template>
            </el-popconfirm>
          </template>
        </MOSTY.Table>
      </section>
      <div class="fenye">
        <MOSTY.Pages :pageConfiger="listQuery" @changeNo="handleCurrentChange" @changeSize="handleSizeChange" />
      </div>
    </template>
  </MOSTY.PageTree>
  <div v-if="comprehensiveShow" class="dialog-box">
    <Configuration @close="close" :formValue="formValue" />
  </div>
  <AddZhjcmb :innerShow="innerShow" @confirm="closmb" :formValue="formValue" :title="title" />
</template>

<script setup>
// 引入
import AddZhjcmb from "@/views/fxgk/rwpz/components/AddZhjcmb.vue"
import { onMounted, reactive, ref } from "vue";
import Configuration from "./components/configuration.vue";
import { ElMessage } from "element-plus";
import { postApi, getApi } from "@/api/tobAcco_api.js";
import * as MOSTY from "@/components/MyComponents/index";
const tableData = ref([]);
const comprehensiveShow = ref(false);
const innerShow = ref(false)
const formValue = ref()
const searchArr = reactive([
  {
    showType: "input",
    prop: "tname",
    width: '250px',
    placeholder: '请输入模板名称'
  }
])
const tableColumns = reactive([
  {
    title: "模板名称",
    prop: "tname",
  },
  {
    title: "配置人",
    prop: "xtZhgxr",
  },
  {
    title: "配置数量",
    prop: "jccount",
  },
  {
    title: "配置时间",
    prop: "xtZhgxsj",
  },
  {
    title: "操作",
    prop: "actions",
    slot: true,
  },
]);
// 分页
const listQuery = ref({
  pageCurrent: 1,
  pageSize: 10,
  total: 0,
  tname: "",
  depcode: ""
});
const title = ref("新增综合检查模板");

// 初始化
onMounted(() => {

  // getMbData();
});
//获取树值
const getdeptId = (val) => {
  listQuery.value.depcode = val.id
  listQuery.value.pageCurrent = 1;
  getMbData();
}
// 分页
const handleSizeChange = (val) => {
  listQuery.value.pageSize = val;
  getMbData();
};
// 分页码
const handleCurrentChange = (cur) => {
  listQuery.value.pageCurrent = cur;
  getMbData();
};
// 关闭页面
const close = () => {
  comprehensiveShow.value = false;
  getMbData()
};
// 查询
const onSearch = (obj) => {
  listQuery.value.tname = obj.tname;
  listQuery.value.pageCurrent = 1;
  getMbData();
};
// 获取排查清单列表数据
const getMbData = () => {
  getApi(listQuery.value, "/mosty-jcgl/zhjcmb/getListPc").then((res) => {
    tableData.value = res.records
    listQuery.value.total = res.total
  });
};
//删除
const deleteData = (row) => {
  postApi({}, `/mosty-jcgl/zhjcmb/del/${row.id}`).then(res => {
    ElMessage.success("删除成功");
    getMbData();
  })
}
// 管理
const handleManage = (row) => {
  formValue.value = row
  comprehensiveShow.value = true;
};
//新增
function addzhmb() {
  title.value = "新增综合检查模板";
  formValue.value = {}
  innerShow.value = true
}
// 修改
const handleEdit = (row) => {
  title.value = "修改综合检查模板";
  formValue.value = {...row}
  innerShow.value = true

};
function closmb() {
  title.value = "";
  formValue.value = {}
  innerShow.value = false
  getMbData();
}


</script>

<style lang="scss" scoped>
.btnBox {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 12px;
}
</style>
