<template>
  <div class="manage-container">
    <div class="manage-wrap">
      <search-form @search="handleSearch" />

      <div class="manage-header">
        <div class="header-left"></div>
        <div class="header-right"></div>
      </div>
      <div class="manage-content" v-loading="loading">
        <common-table
          :autoHeight="true"
          :maxRows="10"
          :data="tableData"
          :columns="tableColumns"
          :total="total"
          :current-page="currentPage"
          :page-size="pageSize"
          :index="true"
          :indexLabel="'序号'"
          title=""
          :border="true"
          @size-change="handleSizeChange"
          @current-page-change="handleCurrentPageChange"
        >
          <template #operations="{ row, index }">
            <el-button
              link
              type="primary"
              size="small"
              @click="fillDecision(row)"
              >编辑</el-button
            >
            <!-- 已立项 -->
            <el-button
              link
              type="primary"
              size="small"
              v-if="row.projectLzType === '5'"
              @click="fillDecision(row)"
              >决策填报</el-button
            >

            <!-- 立项审批中 -->
            <el-button
              link
              type="primary"
              size="small"
              v-else
              :loading="row.loading"
              @click="viewDecision(row)"
              >{{ "审批" }}</el-button
            >
            <el-button
              link
              type="warning"
              size="small"
              v-if="isAdmin"
              @click="buluProject(row)"
              >补录</el-button
            >
          </template>
        </common-table>
      </div>
    </div>
  </div>
</template>

<script setup>
import { reactive, ref, onMounted, computed, getCurrentInstance } from "vue";
import { useRouter } from "vue-router";
import { ElMessage, ElMessageBox } from "element-plus";
import { useUserStore } from "@/stores/user.js";
import CommonTable from "@/components/common/commonTable.vue";
import SearchForm from "@/components/common/SearchForm.vue";

const handleSearch = (formData) => {
  currentPage.value = 1;
  getProjectData(formData);
};
const router = useRouter();
const { proxy } = getCurrentInstance();
// 是否是审核角色
const userStore = useUserStore();
const isAdmin = userStore?.isAdmin;
const userInfo =
  userStore.userInfo ||
  (sessionStorage.getItem("userInfo") &&
    JSON.parse(sessionStorage.getItem("userInfo"))) ||
  {};

let tableData = ref([]);
let tableColumns = ref([
  {
    prop: "projectName",
    label: "项目名称",
    showOverflowTooltip: true,
  },
  {
    prop: "projectCode",
    label: "项目编号",
    showOverflowTooltip: true,
  },
  {
    prop: "projectLzType",
    label: "状态",
    width: 120,
    align: "center",
    formatter: (data) => {
      const type = data.projectLzType;
      if (type === "1") return "待立项";
      if (type === "2" || type === "3" || type === "4") return "立项审批中";
      if (type === "5") return "已立项";
      if (type === "7") return "决策填报中";
      if (type === "8") return "决策审批中";
      if (type === "9") return "已决策";
      return "待立项";
    },
  },
  {
    prop: "operations",
    label: "操作",
    width: 220,
    slot: "operations",
    fixed: "right",
    align: "left",
  },
]);

let loading = ref(false);
let total = ref(0);
let currentPage = ref(1);
let pageSize = ref(10);
// 获取列表数据
const getProjectData = (params = {}) => {
  loading.value = true;
  proxy.$post({
    url: "/api/project/listProject",
    data: {
      page: currentPage.value,
      pagesize: pageSize.value,
      attributes: [],
      menuType: "xmlx",
      ...params,
    },
    callback: (data) => {
      tableData.value = data.rows;
      total.value = data.count;
      loading.value = false;
    },
  });
};
onMounted(() => {
  getProjectData();
});
// 分页
const handleSizeChange = (size) => {
  pageSize.value = size;
  currentPage.value = 1;
  getProjectData();
};
const handleCurrentPageChange = (page) => {
  currentPage.value = page;
  getProjectData();
};
const viewDecision = (item) => {
  router.push({
    name: "addProject",
    query: {
      projectId: item.id,
      isPreview: true,
    },
  });
};
const fillDecision = (item) => {
  router.push({
    name: "addProject",
    query: {
      projectId: item.id,
    },
  });
};
const buluProject = (item) => {
  router.push({
    name: "addProject",
    query: {
      projectId: item.id,
      isBulu: true,
    },
  });
};
</script>

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