admin/src/views/project/list/wbs-tree.vue

<template>
    <hc-drawer v-model="isShow" is-close to-id="hc-project-list">
        <div class="hc-project-wbs-tree flex">
            <div class="header hc-flex">
                <div class="name flex-1">
                    {{ typeLable }} - {{ projectInfo.projectName }}
                </div>
                <div class="hc-flex">
                    <el-dropdown trigger="click">
                        <el-button hc-btn type="success">
                            <span>数据同步</span>
                            <hc-icon name="arrow-down-s" />
                        </el-button>
                        <template #dropdown>
                            <el-dropdown-menu>
                                <template
                                    v-for="item in dataSyncMenu"
                                    :key="item.key"
                                >
                                    <el-dropdown-item
                                        @click="dataSyncMenuClick(item)"
                                        >{{ item.name }}</el-dropdown-item
                                    >
                                </template>
                            </el-dropdown-menu>
                        </template>
                    </el-dropdown>
                    <el-button
                        v-if="isFormSet"
                        class="ml-3"
                        hc-btn
                        type="primary"
                        @click="setIsFormSetValue"
                        >表单设置</el-button
                    >
                    <el-button
                        v-else
                        class="ml-3"
                        hc-btn
                        type="primary"
                        @click="setIsFormSetValue"
                        >元素设置</el-button
                    >
                    <el-button hc-btn type="danger" @click="nodeParamClick"
                        >节点参数</el-button
                    >
                    <el-button hc-btn color="#626aef" @click="toIndependent"
                        >独立表单库</el-button
                    >
                    <el-button hc-btn type="warning" @click="archiveClick"
                        >归档文件时间</el-button
                    >
                </div>
            </div>
            <div class="body">
                <hc-body split padding="8px">
                    <template #left>
                        <hc-card
                            v-loading="isTreeLoading"
                            title="工程节点信息"
                            scrollbar
                            class="is-tree"
                        >
                            <template #search>
                                <hc-search-input
                                    v-model="searchTree.queryValue"
                                    @search="searchTreeClick"
                                >
                                    <template #prepend>
                                        <el-select
                                            v-model="searchTree.type"
                                            placeholder="类型"
                                            style="width: 75px"
                                        >
                                            <el-option label="节点" value="1" />
                                            <el-option label="表名" value="2" />
                                        </el-select>
                                    </template>
                                </hc-search-input>
                            </template>
                            <hc-data-tree
                                v-if="isSearchTree"
                                :h-props="treeProps"
                                :datas="treeLoadData"
                                tree-key="id"
                                :auto-expand-keys="treeExpandKeys"
                                :menus="treeMenus"
                                @menu-tap="treeMenuClick"
                                @node-tap="treeNodeClick"
                            />
                            <hc-lazy-tree
                                v-else
                                :h-props="treeProps"
                                tree-key="id"
                                :auto-expand-keys="treeExpandKeys"
                                :menus="treeMenus"
                                @load="treeLoadNode"
                                @menu-tap="treeMenuClick"
                                @node-tap="treeNodeClick"
                            />
                        </hc-card>
                    </template>
                    <template v-if="isFormSet">
                        <div class="body-top">
                            <hc-card title="节点信息">
                                <hc-table
                                    :is-index="false"
                                    :column="nodeTableColumn"
                                    :datas="nodeTableData"
                                >
                                    <template #nodeType="{ row }">{{
                                        getDictionaryName(
                                            nodeTypelist,
                                            row.nodeType,
                                            true
                                        )
                                    }}</template>
                                </hc-table>
                            </hc-card>
                        </div>
                        <div class="body-content">
                            <hc-card title="当前项目信息表">
                                <template #extra>
                                    <el-button
                                        hc-btn
                                        type="primary"
                                        :disabled="infoTableData.length <= 0"
                                        @click="editRowClick(row)"
                                        >编辑</el-button
                                    >
                                    <el-button
                                        @click="sortClick"
                                        hc-btn
                                        type="success"
                                        :disabled="infoTableData.length <= 0"
                                        >排序</el-button
                                    >
                                </template>
                                <hc-table
                                    v-loading="infoTableLoading"
                                    :is-index="false"
                                    :column="infoTableColumn"
                                    :datas="infoTableData"
                                >
                                    <template #tableType="{ row }">{{
                                        getDictionaryName(
                                            tableTypelist,
                                            row.tableType,
                                            true
                                        )
                                    }}</template>
                                    <template #tableOwner="{ row }">{{
                                        getDictionaryName(
                                            ownerTypeList,
                                            row.tableOwner,
                                            true
                                        )
                                    }}</template>
                                    <template #action="{ row }">
                                        <el-link
                                            type="primary"
                                            @click="previewClick(row)"
                                            >预览</el-link
                                        >
                                        <el-link
                                            @click="hideClick(row)"
                                            v-if="row.status === 1"
                                            type="warning"
                                            >隐藏表单</el-link
                                        >
                                        <el-link
                                            @click="hideClick(row)"
                                            v-if="row.status === 0"
                                            type="success"
                                            >取消隐藏</el-link
                                        >
                                        <el-link
                                            type="primary"
                                            @click="handleEdit(row)"
                                            >编辑</el-link
                                        >
                                        <el-link
                                            v-del-com:[delInfoTableRow]="row"
                                            type="danger"
                                            >删除</el-link
                                        >
                                    </template>
                                </hc-table>
                            </hc-card>
                        </div>
                    </template>
                    <template v-else>
                        <hc-card>
                            <hc-table
                                v-loading="infoTableLoading"
                                :is-index="false"
                                :column="infoTableColumn1"
                                :datas="infoTableData"
                            >
                                <template #tableType="{ row }">{{
                                    getDictionaryName(
                                        tableTypelist,
                                        row.tableType,
                                        true
                                    )
                                }}</template>
                                <template #isLinkTable="{ row }">{{
                                    row.isLinkTable === 2 ? "是" : "否"
                                }}</template>
                                <template #tableOwner="{ row }">{{
                                    getDictionaryName(
                                        ownerTypeList,
                                        row.tableOwner,
                                        true
                                    )
                                }}</template>
                                <template #action="{ row }">
                                    <el-link
                                        type="success"
                                        @click="associationList(row)"
                                        >关联清表</el-link
                                    >
                                    <el-link
                                        v-loading="editElementLoading"
                                        type="primary"
                                        :disabled="
                                            row.excelId === -1 ||
                                            isNullES(row.excelId)
                                        "
                                        @click="editElement(row)"
                                        >编辑元素</el-link
                                    >
                                    <el-link
                                        v-loading="adjustExcelLoading"
                                        type="warning"
                                        :disabled="
                                            row.excelId === -1 ||
                                            isNullES(row.excelId)
                                        "
                                        @click="adjustExcelClick(row)"
                                        >调整表单</el-link
                                    >
                                    <el-link
                                        type="primary"
                                        @click="elementFormulasClick(row)"
                                        >编辑元素公式</el-link
                                    >
                                    <el-link
                                        type="warning"
                                        @click="syncTable(row)"
                                        v-loading="syncTableLoading"
                                        >表单同步</el-link
                                    >
                                    <el-link
                                        v-if="
                                            treeItem.nodeType === 1000 ||
                                            treeItem.nodeType === 1001
                                        "
                                        type="primary"
                                        @click="linkNodeClick(row)"
                                        >关联节点</el-link
                                    >
                                    <el-link
                                        v-del-com:[delInfoTableRow]="row"
                                        type="danger"
                                        >删除表单</el-link
                                    >
                                </template>
                            </hc-table>
                        </hc-card>
                    </template>
                </hc-body>
            </div>
        </div>
        <!-- 编辑节点 -->
        <TreeNodeEditDialog
            v-model="isTreeNodeEditShow"
            :node="treeInfo"
            :type="Number(isType)"
            :wid="wbsId"
            :pid="projectInfo.id"
            :tree-props="treeProps"
            :node-type="nodeTypelist"
            :major-type="majorDataTypeList"
            @close="treeNodeEditClose"
            @change="treeNodeEditChange"
        />
        <!-- 节点排序 -->
        <hc-new-dialog
            v-model="nodeSortModalShow"
            is-table
            widths="1100px"
            title="调整排序"
            @save="nodeSortModalSave"
        >
            <hc-table
                ui="hc-table-row-drop"
                :column="nodeSortTableColumn"
                :datas="nodeSortTableData"
                :loading="nodeSortNodeLoading"
                is-row-drop
                quick-sort
                :index-style="{ width: 80 }"
                @row-drop="nodeSortTableRowDrop"
                @row-sort="nodeSortTableRowDrop"
            >
                <template #action="{ row, index }">
                    <span
                        class="text-xl"
                        :class="index === 0 ? 'text-gray' : 'text-link'"
                        @click="upNodeSortClick(row, index)"
                    >
                        <hc-icon name="arrow-up" fill />
                    </span>
                    <span
                        class="ml-2 text-xl"
                        :class="
                            index === nodeSortTableData.length - 1
                                ? 'text-gray'
                                : 'text-link'
                        "
                        @click="downNodeSortClick(row, index)"
                    >
                        <hc-icon name="arrow-down" fill />
                    </span>
                </template>
            </hc-table>
        </hc-new-dialog>
        <!-- 关联清表 -->
        <HcAssociationList
            v-model="isAssociationShow"
            :info="associationInfo"
            @change="getInfoTableData"
        />
        <!-- 编辑元素 -->
        <HcEditElement
            v-model="isEditElementShow"
            :info="editElementInfo"
            :data="editElementData"
            @to-page="editElementToPage"
        />
        <!-- 调整表单 -->
        <HcAdjustExcel v-model="isAdjustExcelShow" :info="adjustExcelInfo" />
        <!-- 编辑元素公式 -->
        <hc-dialog
            v-model="elementFormulasShow"
            is-table
            widths="600px"
            :title="elementFormulasName"
            :footer="false"
            @close="elementFormulasClose"
        >
            <template #search>
                <hc-search-input
                    v-model="formulaInput"
                    @search="searchFormulaClick"
                />
            </template>
            <hc-table
                v-loading="formulaTableLoading"
                :is-index="false"
                :is-current-row="false"
                :column="formulaTableColumn"
                :datas="formulaTableData"
            >
                <template #action="{ row }">
                    <el-link
                        :type="row.globalFormula === 1 ? 'warning' : 'primary'"
                        @click="toFormulaGlobal(row)"
                        >全局公式</el-link
                    >
                    <el-link
                        v-show="row.hasPartFormula"
                        :type="row.isSaveFormula === 1 ? 'warning' : 'primary'"
                        @click="toFormulaNodes(row)"
                        >节点公式</el-link
                    >
                </template>
            </hc-table>
        </hc-dialog>
        <!-- 编辑公式 -->
        <HcEditFormula
            v-model="isEditFormulaShow"
            :data="editFormulaData"
            @finish="editFormulaFinish"
        />
        <!-- 节点参数设置 -->
        <nodeParamDialog
            v-model="nodeParamShow"
            @close="nodeParamClose"
            :nodeId="treeItem.id"
            :nodeInfo="treeItem"
            :porjectId="projectInfo.id"
            :scopeType="10"
        >
        </nodeParamDialog>
        <!-- 独立表单库 -->
        <independentPage
            @close="independentClose"
            v-model="independentShow"
            :wbsType="isType"
            :projectId="projectInfo.id"
            :wbsId="wbsId"
        ></independentPage>
        <!-- 归档文件时间 -->
        <archiveTime v-model="isArchiveShow"></archiveTime>

        <!-- 编辑元素表信息 -->
        <editElePage
            v-model="editEleShow"
            @close="editClose"
            :tableTypelist="tableTypelist"
            :ownerTypeList="ownerTypeList"
            :tab="infoTableData"
        ></editElePage>
        <!-- 表单调整排序 -->
        <tableSort
            v-model="tableSortShow"
            @close="tableSortShowClose"
            :tab="infoTableData"
        >
        </tableSort>
        <!-- 预览 -->
        <previewPage v-model="previewShow" :info="previewInfo"></previewPage>

        <!-- 创建新的元素表 -->
        <createNewExcel
            v-model="isCreateShow"
            @close="createClose"
            :node="treeItem"
            :wid="wbsId"
            :tableTypelist="tableTypelist"
            :ownerTypeList="ownerTypeList"
            :title="modalTitle"
            :initTableName="initTableName"
            :initTableId="initTableId"
            :tableId="tableId"
            :eKey="eKey"
            :type="0"
        ></createNewExcel>

        <!-- 分配WBS -->
        <allocateWbs
            v-model="isAllocateShow"
            :wbsType="isType"
            :projectId="projectInfo.id"
            :data="allocateWbsInfo"
            :type="1"
        ></allocateWbs>
    </hc-drawer>
</template>

<script setup>
import { nextTick, onDeactivated, ref, watch } from "vue";
import { useAppStore } from "~src/store";
import { HcFirmMsg, getStore, setStore } from "hc-vue3-ui";
import { deepClone, getArrValue, getObjValue, isNullES } from "js-fast-way";
import { getDictionaryData, reloadPage } from "~uti/tools";
import TreeNodeEditDialog from "./tree-node-edit.vue";
import HcAdjustExcel from "./adjust-excel.vue";
import HcAssociationList from "./association-list.vue";
import HcEditElement from "./edit-element.vue";
import HcEditFormula from "./edit-formula.vue";
import excelApi from "~api/exctab/exceltab";
import wbsTreeApi from "~api/wbs/tree";
import mainApi from "~api/wbs/private";
import nodeParamDialog from "../../desk/wbs/node-param-dialog.vue";
import independentPage from "./independent/index.vue";
import archiveTime from "./archiveTime.vue";
import editElePage from "../../desk/wbs/edit-ele.vue";
import tableSort from "../../desk/wbs/table-sort.vue";
import previewPage from "./previewPage.vue";
import createNewExcel from "../../desk/wbs/create-new-excel.vue";
import allocateWbs from "../list/independent/allocateWbs.vue";

const props = defineProps({
    type: {
        type: [String, Number],
        default: "1",
    },
    info: {
        type: Object,
        default: () => ({}),
    },
});

//事件
const emit = defineEmits(["change", "close"]);

//双向绑定
// eslint-disable-next-line no-undef
const isShow = defineModel("modelValue", {
    default: false,
});

const store = useAppStore();

//监听数据
const isType = ref(props.type);
const projectInfo = ref(props.info);
watch(
    () => [props.type, props.info],
    ([type, info]) => {
        isType.value = type;
        projectInfo.value = info;
    },
    { deep: true }
);

//监听显示
watch(isShow, (val) => {
    if (val) {
        getProjectData();
    } else {
        //projectInfo.value = {}
        //isType.value = ''
        emit("close");
    }
});

//获取项目信息
const typeLable = ref("");
const wbsId = ref("");
const getProjectData = () => {
    const type = isType.value ?? 1;
    const wbsArr = [
        "WBS树管理",
        "实验划分",
        "计量管理",
        "日志树管理",
        "征拆划分",
    ];
    typeLable.value = wbsArr[Number(type) - 1];
    const wbsIds = [
        "referenceWbsTemplateId",
        "referenceWbsTemplateIdTrial",
        "referenceWbsTemplateIdMeter",
        "referenceLogWbsTemplateId",
        "referenceWbsTemplateIdLar",
    ];
    wbsId.value = projectInfo.value[wbsIds[Number(type) - 1]];
    console.log("info: ", projectInfo.value);
    getNodeTypelist(Number(type) - 1);
    getTableTypelist(Number(type) - 1);
    getDataTypelist();
    getOwnerTypelist();
    getMajorDataTypeList();
};

//获取节点类型
const nodeTypelist = ref([]);
const getNodeTypelist = async (type) => {
    //计量管理，征拆划分，实验划分，WBS树管理，日志树管理
    const types = [
        "wbs_node_type",
        "trial_node_type",
        "meter_node_type",
        "wbs_node_type",
        "lar_node_type",
    ];
    const data = await getDictionaryData(types[type]);
    nodeTypelist.value = getArrValue(data);
};

//获取表单类型
const tableTypelist = ref([]);
const getTableTypelist = async (type) => {
    //计量管理，征拆划分，实验划分，WBS树管理，日志树管理
    const types = [
        "table_type",
        "trial_table_type",
        "table_type",
        "table_type",
        "table_type",
    ];
    const data = await getDictionaryData(types[type]);
    tableTypelist.value = getArrValue(data);
};

//获取数据类型
const dataTypeList = ref([]);
const getDataTypelist = async () => {
    const data = await getDictionaryData("data_type");
    dataTypeList.value = getArrValue(data);
};

//获取业主类型
const ownerTypeList = ref([]);
const getOwnerTypelist = async () => {
    const data = await getDictionaryData("owner_type");
    ownerTypeList.value = getArrValue(data);
};

//获取类型字典
const majorDataTypeList = ref([]);
const getMajorDataTypeList = async () => {
    const data = await getDictionaryData("major_data_type");
    majorDataTypeList.value = getArrValue(data);
};

//获取字典里的数据
const getDictionaryName = (arr, id, name) => {
    if (isNullES(id)) return name ? "" : {};
    const item = arr.find((item) => item.value === Number(id));
    return name ? item?.label : getObjValue(item);
};

//树节点搜索
const isSearchTree = ref(false);
const isTreeLoading = ref(false);
const searchTree = ref({ queryValue: "", type: "1" });
const searchTreeClick = () => {
    const { queryValue } = searchTree.value;
    isSearchTree.value = !isNullES(queryValue);
    getTreeLoadData();
};

//获取搜索树的数据
const treeLoadData = ref([]);
const getTreeLoadData = async () => {
    isTreeLoading.value = true;
    const { data } = await wbsTreeApi.getQueryValueByType({
        ...searchTree.value,
        wbsId: wbsId.value,
        projectId: projectInfo.value.id,
    });
    treeLoadData.value = getArrValue(data);
    isTreeLoading.value = false;
};

//树属性
const treeExpandKeys = ref(getStore("project-wbs-tree-expand-keys") || []);
const treeProps = {
    children: "children",
    label: "title",
    isLeaf: ({ hasChildren, isExistForm, majorDataType, nodeType }) => {
        let tag = false;
        if (!hasChildren) {
            tag = true;
        }
        if (isExistForm === 1) {
            tag = true;
        }
        if (nodeType >= 6 && nodeType <= 13) {
            tag = true;
        }
        //中间交工。开工报告、质量评定）
        if (majorDataType >= 1 && majorDataType <= 3) {
            tag = true;
        }
        return tag;
    },
};

//树的右键菜单
const treeMenus = [
    { icon: "draft", label: "编辑节点", key: "edit" },
    { icon: "refresh", label: "同步新增元素表单", key: "sync1" },
    { icon: "loop-left", label: "同步元素表单排序到合同段", key: "sync3" },
    { icon: "loop-right", label: "同步节点基础信息及表单URL", key: "sync2" },
    { icon: "arrow-up-down", label: "调整排序", key: "rank" },
    { icon: "delete-bin", label: "删除节点", key: "del" },
];
//菜单被点击
const treeMenuItem = ref({});
const treeMenuClick = async ({ key, node, data }) => {
    if (key === "edit") {
        //编辑节点
        data.parentName = node?.parent?.data?.title ?? ""; //获取父节点名称
        treeItem.value = data;
        await getTreeDetail();
        await nextTick();
        isTreeNodeEditShow.value = true;
    } else if (key === "sync1") {
        const { primaryKeyId, pKeyId } = data;
        const pid = primaryKeyId ? primaryKeyId : pKeyId;
        if (isNullES(pid)) {
            window.$message.warning("参数异常，请稍后重试");
            return;
        }
        //同步新增元素表单
        HcFirmMsg(
            {
                text: `是否同步节点【${data.title}】？`,
                loadingText: "数据同步中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.syncNodeTable(pid);
                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("同步成功");
                getInfoTableData();
            }
        );
    } else if (key === "sync3") {
        const { id } = projectInfo.value;
        if (isNullES(id)) {
            window.$message.warning("参数异常，请稍后重试");
            return;
        }
        //同步元素表单排序到合同段
        HcFirmMsg(
            {
                text: "同步元素表单排序到合同段？",
                loadingText: "数据同步中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.syncContractTabSort(id);
                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("同步成功");
                getInfoTableData();
            }
        );
    } else if (key === "sync2") {
        const { primaryKeyId, pKeyId } = data;
        const pid = primaryKeyId ? primaryKeyId : pKeyId;
        if (isNullES(pid)) {
            window.$message.warning("参数异常，请稍后重试");
            return;
        }
        //同步节点基础信息及表单URL
        HcFirmMsg(
            {
                text: `是否同步节点【${data.title}】到合同段？`,
                loadingText: "数据同步中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.syncNodeinfo(pid);
                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("同步成功");
                getInfoTableData();
            }
        );
    } else if (key === "rank") {
        const { parentId } = data;
        const { id } = projectInfo.value;
        if (isNullES(id) || isNullES(wbsId.value)) {
            window.$message.warning("参数异常，请稍后重试");
            return;
        }
        //调整排序
        nodeSortModalShow.value = true;
        nodeSortNodeLoading.value = true;
        const { data: apiData } = await wbsTreeApi.findWbsTreePrivateSameLevel({
            parentId: parentId,
            projectId: id,
            wbsId: wbsId.value,
        });
        nodeSortNodeLoading.value = false;
        nodeSortTableData.value = getArrValue(apiData);
    } else if (key === "del") {
        if (node.level <= 1) {
            window.$message.warning("当前节点无法删除");
            return;
        }
        const { primaryKeyId, pKeyId } = data;
        const pid = primaryKeyId ? primaryKeyId : pKeyId;
        if (isNullES(pid)) {
            window.$message.warning("参数异常，请稍后重试");
            return;
        }
        //删除节点
        HcFirmMsg(
            {
                text: `此操作将删除节点【${data.title}】，是否继续？`,
                loadingText: "删除节点中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.del(pid);
                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("删除成功");
                reloadPage();
            }
        );
    }
};

//节点排序
const nodeSortModalShow = ref(false);
const nodeSortTableColumn = ref([
    { key: "tableName", name: "节点名称" },
    { key: "action", name: "排序", width: 90 },
]);
const nodeSortTableData = ref([]);
const nodeSortNodeLoading = ref(false);

//拖动完成
const nodeSortTableRowDrop = (rows) => {
    nodeSortTableData.value = []; // 先清空，否则排序会异常
    nextTick(() => {
        nodeSortTableData.value = rows;
    });
};

//向上
const upNodeSortClick = (row, index) => {
    const data = nodeSortTableData.value || [];
    if (index !== 0) {
        const tmp = data.splice(index - 1, 1);
        nodeSortTableData.value.splice(index, 0, tmp[0]);
    } else {
        window?.$message?.warning("已经处于置顶，无法上移");
    }
};

//向下
const downNodeSortClick = (row, index) => {
    const indexs = index + 1;
    const data = nodeSortTableData.value;
    if (indexs !== data.length) {
        const tmp = data.splice(indexs, 1);
        nodeSortTableData.value.splice(index, 0, tmp[0]);
    } else {
        window?.$message?.warning("已经处于置底，无法下移");
    }
};

//节点排序完成
const nodeSortModalSave = async () => {
    const arr = deepClone(nodeSortTableData.value);
    if (arr.length <= 0) {
        window.$message.warning("数据异常，请稍后重试");
        nodeSortModalShow.value = false;
        return;
    }
    //处理顺序
    for (let i = 0; i < arr.length; i++) {
        arr[i].sort = i + 1;
    }
    //发起请求
    const { isRes } = await wbsTreeApi.wbsTreePrivateSort(arr);
    if (!isRes) return;
    window.$message.success("排序完成");
    nodeSortModalShow.value = false;
    reloadPage();
};

//编辑节点
const isTreeNodeEditShow = ref(false);
//编辑节点被关闭
const treeNodeEditClose = () => {
    isTreeNodeEditShow.value = false;
    treeMenuItem.value = {};
};
//编辑节点被修改
const treeNodeEditChange = () => {
    isTreeNodeEditShow.value = false;
    treeMenuItem.value = {};
    console.log("编辑节点被修改");
};

//懒加载树
const treeLoadNode = async ({ item, level }, resolve) => {
    let pid = level !== 0 ? item.id : 0;
    const { data } = await mainApi.getLazytree({
        wbsId: wbsId.value,
        parentId: pid,
        tenantId: store.tenantId,
        projectId: projectInfo.value.id,
        wbsType: isType.value,
    });
    resolve(getArrValue(data));
};

//节点信息
const nodeTableColumn = ref([
    { key: "nodeName", name: "当前节点", align: "center" },
    { key: "nodeType", name: "节点类型", align: "center" },
    { key: "parentName", name: "上级节点", align: "center" },
]);
const nodeTableData = ref([]);

//节点被点击
const treeItem = ref({});
const nodePid = ref("");
const treeNodeClick = ({ node, data, keys }) => {
    nodePid.value = data.primaryKeyId ? data.primaryKeyId : data.pKeyId;
    //获取父节点名称
    let parentName = "";
    if (node?.parent?.data) {
        parentName = node.parent.data.title ?? "";
    }
    data.parentName = parentName;
    //设置相关数据
    treeItem.value = getObjValue(data);
    setStore("project-wbs-tree-expand-keys", keys);
    treeExpandKeys.value = getArrValue(keys);

    //获取节点详情
    getTreeDetail();
    getInfoTableData();
};

//获取节点详情
const treeInfo = ref({});
const getTreeDetail = async () => {
    const { id, parentName } = treeItem.value;
    const { data } = await mainApi.detail({
        id,
        wbsId: wbsId.value,
        projectId: projectInfo.value.id,
    });
    const res = getObjValue(data);
    res.parentName = parentName;
    treeInfo.value = res;
    nodeTableData.value = [res];
};

//当前项目信息表
const infoTableLoading = ref(false);
const infoTableColumn = ref([
    { key: "tableName", name: "表单名称" },
    { key: "elementTotal", name: "字段总量", align: "center", width: 80 },
    { key: "fillRate", name: "填报率", align: "center", width: 80 },
    { key: "tableType", name: "表单类型", align: "center", width: 100 },
    { key: "tableOwner", name: "所属方", align: "center", width: 100 },
    { key: "action", name: "操作", align: "center", width: 160 },
]);
const infoTableData = ref([]);
const getInfoTableData = async () => {
    const { id } = treeItem.value;
    infoTableLoading.value = true;
    const { data } = await mainApi.findNodeTableByCondition({
        parentId: id,
        wbsId: wbsId.value,
        projectId: projectInfo.value.id,
    });
    infoTableData.value = getArrValue(data);
    infoTableLoading.value = false;
};

//当前项目信息表删除
const delInfoTableRow = async ({ item }, resolve) => {
    const { isRes } = await mainApi.removeTableByCondition({
        id: item.id,
        wbsId: wbsId.value,
        projectId: projectInfo.value.id,
    });
    resolve(); //关闭弹窗
    if (!isRes) return;
    window.$message.success("删除成功");
    getInfoTableData().then();
};

//表单设置
const isFormSet = ref(true);
const infoTableColumn1 = ref([
    { key: "tableName", name: "表单名称" },
    { key: "tableType", name: "表单类型", align: "center", width: 80 },
    { key: "fillRate", name: "填报率", align: "center", width: 80 },
    { key: "isLinkTable", name: "关联清表", align: "center", width: 80 },
    { key: "tableOwner", name: "所属方", align: "center", width: 100 },
    {
        key: "action",
        name: "操作",
        width: 490,
        align: "center",
        fixed: "right",
    },
]);
const setIsFormSetValue = () => {
    isFormSet.value = !isFormSet.value;
    if (isFormSet.value) {
        getTreeDetail();
    }
    getInfoTableData();
};

//数据同步按钮菜单
const dataSyncMenu = [
    { key: "jdSync", name: "节点参数同步", load: false },
    { key: "dqSync", name: "电签同步", load: false },
    { key: "gsSync", name: "公式同步", load: false },
];
const dataSyncMenuClick = (item) => {
    let pid = treeItem.value.primaryKeyId
        ? treeItem.value.primaryKeyId
        : treeItem.value.pKeyId;
    const { key } = item;
    if (key === "jdSync") {
        //是否同步节点参数
        HcFirmMsg(
            {
                text: "是否同步节点参数？",
                loadingText: "数据同步中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.syncNodeParam({
                    projectId: projectInfo.value.id,
                    pKeyId: pid,
                });
                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("同步成功");
            }
        );
    } else if (key === "dqSync") {
        //是否同步电签
        HcFirmMsg(
            {
                text: "是否同步电签？",
                loadingText: "数据同步中...",
            },
            async (resolve) => {
                const { isRes } = await mainApi.syncProjecteVisa({
                    projectId: projectInfo.value.id,
                    pKeyId: pid,
                });

                resolve(); //关闭弹窗
                if (!isRes) return;
                window.$message.success("同步成功");
            }
        );
    } else if (key === "gsSync") {
        window.$message.success("暂无接口");
    }
};

// 关联清表
const isAssociationShow = ref(false);
const associationInfo = ref({});
const associationList = async (item) => {
    associationInfo.value = item;
    await nextTick();
    isAssociationShow.value = true;
};

//编辑元素
const isEditElementShow = ref(false);
const editElementInfo = ref({});
const editElementData = ref({});
const editElementLoading = ref(false);
const editElement = async (row) => {
    editElementLoading.value = true;
    const { code, data } = await excelApi.getExcelHtml({ pkeyId: row.pkeyId });
    if (code !== 200 || isNullES(data)) {
        editElementLoading.value = false;
        window?.$message.warning("表单异常，请联系管理员");
        return;
    }
    editElementLoading.value = false;
    editElementInfo.value = row;
    editElementData.value = {
        pid: projectInfo.value.id,
        wbsid: wbsId.value,
        nodeid: treeItem.value.id,
    };
    await nextTick();
    isEditElementShow.value = true;
};

//调整表单
const isAdjustExcelShow = ref(false);
const adjustExcelLoading = ref(false);
const adjustExcelInfo = ref({});
const adjustExcelClick = async (row) => {
    const { pkeyId, excelId } = row;
    if (isNullES(pkeyId) || isNullES(excelId)) {
        window?.$message.warning("表单值异常，请联系管理员");
        return;
    }
    adjustExcelLoading.value = true;
    const { code, data } = await excelApi.getExcelHtml({ pkeyId });
    if (code !== 200 || isNullES(data)) {
        adjustExcelLoading.value = false;
        window?.$message.warning("表单异常，请联系管理员");
        return;
    }
    adjustExcelInfo.value = deepClone(row);
    adjustExcelLoading.value = false;
    isAdjustExcelShow.value = true;
};

//编辑元素里的跳转页面
const editElementToPage = async (name) => {
    const row = deepClone(editElementInfo.value);
    //表单调整
    if (name === "adjustment") {
        adjustExcelInfo.value = deepClone(row);
        await nextTick();
        isAdjustExcelShow.value = true;
    }
    //公式配置
    if (name === "formula") {
        console.log("还没做");
    }
};

//编辑元素公式
const elementFormulasName = ref("");
const elementFormulasObj = ref({});
const elementFormulasShow = ref(false);
const elementFormulasClick = async (row) => {
    elementFormulasObj.value = row;
    elementFormulasName.value = row.tableName + " 元素公式";
    elementFormulasShow.value = true;
    formulaTableLoading.value = true;
    const { data } = await wbsTreeApi.selectFormElements({
        id: row.pkeyId,
        type: 0,
    });
    const arr = getArrValue(data);
    formulaTableData.value = arr;
    formulaTableList.value = deepClone(arr);
    formulaTableLoading.value = false;
};

//元素公式列表
const formulaTableLoading = ref(false);
const formulaTableColumn = [
    { key: "eName", name: "字段信息" },
    { key: "action", name: "操作", width: 160, align: "center" },
];
const formulaTableData = ref([]);
const formulaTableList = ref([]);

// 搜索元素公式
const formulaInput = ref("");
const searchFormulaClick = () => {
    const arr = formulaTableList.value;
    formulaTableData.value = arr.filter(({ eName }) => {
        return eName.indexOf(formulaInput.value) > -1;
    });
};

//编辑元素公式关闭
const elementFormulasClose = () => {
    elementFormulasShow.value = false;
    formulaTableLoading.value = false;
    elementFormulasName.value = "";
    formulaTableData.value = [];
    formulaTableList.value = [];
};

//编辑公式
const isEditFormulaShow = ref(false);
const editFormulaData = ref({});

//全局公式，10
const toFormulaGlobal = async (row) => {
    elementFormulasClose();
    const formulasObj = elementFormulasObj.value;
    formulasObj.hasPartFormula = row.hasPartFormula;
    editFormulaData.value = {
        node: formulasObj,
        pid: projectInfo.value.id,
        wbsId: wbsId.value,
        nodeId: treeItem.value.id,
        eleId: row.id,
        eleType: false,
        tableType: true,
        globalType: 10,
    };
    await nextTick();
    isEditFormulaShow.value = true;
};

//节点公式，20
const toFormulaNodes = async (row) => {
    elementFormulasClose();
    editFormulaData.value = {
        node: treeItem.value,
        pid: projectInfo.value.id,
        wbsId: wbsId.value,
        nodeId: treeItem.value.id,
        eleId: row.id,
        tableType: false,
        globalType: 20,
    };
    await nextTick();
    isEditFormulaShow.value = true;
};

//公式操作完成
const editFormulaFinish = () => {
    isEditFormulaShow.value = false;
    editFormulaData.value = {};
};

//离开了当前页面
onDeactivated(() => {
    isAdjustExcelShow.value = false;
});

//节点参数
const nodeParamShow = ref(false);
const nodeParamClose = () => {
    nodeParamShow.value = false;
};
const nodeParamClick = () => {
    const { id } = treeItem.value;
    if (!id) {
        window?.$message.warning("请先选择节点");
        return;
    }
    nodeParamShow.value = true;
};
//独立表单库
const independentShow = ref(false);
const independentClose = () => {
    independentShow.value = false;
};
const toIndependent = () => {
    independentShow.value = true;
};
//归档文件时间
const isArchiveShow = ref(false);
const archiveClick = () => {
    isArchiveShow.value = true;
};
//编辑元素表单
const editEleShow = ref(false);
const editClose = () => {
    editEleShow.value = false;
};
const editRowClick = (row) => {
    editEleShow.value = true;
};

// 元素表排序
const tableSortShow = ref(false);
const sortClick = () => {
    tableSortShow.value = true;
};
const tableSortShowClose = () => {
    tableSortShow.value = false;
    getInfoTableData();
};
//预览
const previewShow = ref(false);
const previewInfo = ref({});
const previewClick = (row) => {
    previewShow.value = true;
    previewInfo.value = row;
};

//创建新的元素表
const isCreateShow = ref(false);
const modalTitle = ref("创建新的元素表");
const createClose = () => {
    isCreateShow.value = false;
    getInfoTableData();
};
const initTableName = ref("");
const initTableId = ref("");
const eKey = ref("");
const tableId = ref("");
const handleEdit = (row) => {
    isCreateShow.value = true;
    modalTitle.value = row.tableName + "元素编辑";
    tableId.value = row.pkeyId;
    initTableName.value = row.initTableName;
    initTableId.value = row.initTableId;
    eKey.value = row.ekey;
};
//隐藏表单
const hideClick = async (row) => {
    //隐藏按钮
    const { code, error } = await wbsTreeApi.updateStatus({
        pKeyId: row.pkeyId,
    });
    if (!error && code === 200) {
        if (row.status == 0) {
            row.status = 1;
        } else {
            row.status = 0;
        }
    }
};
//表单同步
const syncTableLoading = ref(false);
const syncTable = async (row) => {
    syncTableLoading.value = true;
    const { code, error } = await wbsTreeApi.syncCurrentFormInProject({
        pKeyId: row.pkeyId,
    });
    syncTableLoading.value = false;
    if (!error && code === 200) {
        window?.$message.success("操作成功");
    }
};
//关联节点
const isAllocateShow = ref(false);
const allocateWbsInfo = ref({});
const linkNodeClick = (row) => {
    allocateWbsInfo.value = row;
    isAllocateShow.value = true;
};
</script>

<style scoped lang="scss">
.hc-project-wbs-tree {
    position: relative;
    background: #ececec;
    border-radius: 4px;
    height: 100%;
    flex-direction: column;
    overflow: hidden;
    .header {
        color: white;
        background: #54565a;
        padding: 10px 14px;
        flex-shrink: 0;
        .name {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
    .body {
        flex: 1;
        flex-basis: auto;
        position: relative;
    }
}
</style>

<style lang="scss">
.hc-project-wbs-tree .body {
    .el-card.hc-card-box {
        --el-card-padding: 12px;
        --el-card-border-radius: 5px;
    }
    .hc-page-split-content {
        position: relative;
        .body-top {
            position: relative;
            height: 119.5px;
        }
        .body-content {
            position: relative;
            margin-top: 10px;
            height: calc(100% - 129.5px);
        }
    }
}
</style>