<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="addInfo">
          <el-icon>
            <Plus />
          </el-icon>
          <span>新增</span>
        </el-button>
      </div>
    </template>
    <template #table>
      <section class="eltab9">
        <MOSTY.Table :tableData="data.tableData" :table-columns="data.tableColumn" :tableloading="tableloading"
          style="width: 100%;">
          <template #level="{ row }">
            <dict-tag :options="D_BZ_LWJB" :value="row.level" :tag="false" />
          </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="handledelete(row)">
              <template #reference>
                <span class="operdel" size="small">
                  <el-icon>
                    <Delete />
                  </el-icon>删除</span>
              </template>
            </el-popconfirm>
            <span class="operesee" @click="seeInfo(row)">
              <el-icon>
                <Compass />
              </el-icon>查看</span>
          </template>
        </MOSTY.Table>
      </section>
      <div class="fenye">
        <MOSTY.Pages :pageConfiger="pageConfiger" @changeSize="handleSizeChange" @changeNo="handleCurrentChange">
        </MOSTY.Pages>
      </div>
    </template>
  </MOSTY.PageTree>
</template>

<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { getApi, deleteApi, putApi, postApi } from "@/api/tobAcco_api.js";
import { filterYear } from "@/utils/auth.js";
import { ElMessage } from "element-plus";
import { reactive, onMounted, ref, getCurrentInstance } from "vue";
// 树的展开与折叠
const emit = defineEmits("changePage");
const searchArr = reactive([
  {
    showType: "select",
    prop: "year",
    width: '250px',
    options: filterYear(7),
    placeholder: '请选择年度'
  },
]);
let pageConfiger = reactive({
  pageSize: 10,
  pageCurrent: 1,
  total: 0
})
const data = reactive({
  searchObj: {},
  tableData: [],
  tableColumn: [
    {
      title: "所属单位",
      prop: "xtCityName",
    },
    {
      title: "年度",
      prop: "year",
    },
    {
      title: "开始时间",
      prop: "starttime",
    },
    {
      title: "结束时间",
      prop: "endtime",
    }, {
      title: "操作",
      prop: 'actions',
      slot: true
    }
  ],
  tableConfiger: {
    showIndex: false,
    loading: false,
    height: '73vh',
    rowHeight: 66
  },
  pageConfiger: {
    pageSize: 10,
    pageCurrent: 1,
    total: 0
  },
});
//分页
const handleCurrentChange = (val) => {
  listQuery.pageCurrent = val;
  getTableData();
};
const handleSizeChange = (val) => {
  listQuery.pageSize = val;
  getTableData();
};
// 查询数据
const onSearch = (val) => {
  listQuery.year = val.year;
  getTableData();
};
const listQuery = reactive({
  pageCurrent: 1,
  pageSize: 20,
  orgid: '',
  year: ''
});
//选中的数据

const tableloading = ref(false);
function getTableData() {
  tableloading.value = true;
  postApi(listQuery, `/mosty-jcgl/standardization/listPageStandardizatio`).then((res) => {
    if (res.records) {
      data.tableData = res.records;
      tableloading.value = false;
      pageConfiger.total = res.total;
    } else {
      data.tableData = [];
      tableloading.value = false;
    }
  }).finally(() => {
    tableloading.value = false;
  });
}
//新增
const addInfo = () => {
  let arr = {
    title: "标准化自评新增",
    saveBtnShow: true,
    wbjlShow: false,
    jcrzShow: false
  };
  emit("changePage", "AddOrEdite", arr);
};
//修改
const editInfo = (row) => {
  let arr = {
    title: "标准化自评修改",
    saveBtnShow: true,
    wbjlShow: true,
    jcrzShow: false,
    id: row.id ? row.id : null
  };
  emit("changePage", "AddOrEdite", arr);
};
//查看
const seeInfo = (row) => {
  let arr = {
    title: "标准化自评详情",
    saveBtnShow: false,
    wbjlShow: true,
    jcrzShow: true,
    id: row.id ? row.id : null
  };
  emit("changePage", "AddOrEdite", arr);
};

//删除
const handledelete = (row) => {
  getApi({}, "/mosty-jcgl/standardization/deleteTbStandardizationDtoById/" + row.id).then(
    (res) => {
      ElMessage.success("删除成功");
      getTableData();
    }
  );
};
const getDeptId = (val)=>{
  listQuery.orgid = val.orgcode
  getTableData()
}
onMounted(() => {
  // getTableData() // getDeptId时加载
});
</script>

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