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

<template>
    <hc-drawer v-model="isShow" is-close to-id="hc-project-list" @close="dialogClose">
        <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 color="#626aef" hc-btn @click="toIndependent">独立表单库</el-button>
                    <el-button hc-btn type="warning" @click="archiveClick">归档文件时间</el-button>
                </div>
            </div>
            <div class="body">
                <hc-body padding="8px" split :options="splitOptions">
                    <template #left>
                        <hc-card v-loading="isTreeLoading" class="is-tree" scrollbar title="工程节点信息">
                            <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>
                            <div v-if="isShowTree">
                                <hc-data-tree
                                    v-if="isSearchTree" :auto-expand-keys="treeExpandKeys" :datas="treeLoadData" :h-props="treeProps"
                                    :menus="treeMenus" tree-key="id" @menu-tap="treeMenuClick" @node-tap="treeNodeClick"
                                />
                                <hc-lazy-tree
                                    v-else :auto-expand-keys="treeExpandKeys" :h-props="treeProps" :menus="treeMenus"
                                    tree-key="id" @load="treeLoadNode" @menu-tap="treeMenuClick" @node-tap="treeNodeClick"
                                />
                            </div>
                        </hc-card>
                    </template>
                    <template v-if="isFormSet">
                        <div class="body-top">
                            <hc-card title="节点信息">
                                <hc-table :column="nodeTableColumn" :datas="nodeTableData" :is-index="false">
                                    <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 :disabled="infoTableData.length <= 0" hc-btn type="primary" @click="editRowClick(row)">编辑</el-button>
                                    <el-button :disabled="infoTableData.length <= 0" hc-btn type="success" @click="sortClick">排序</el-button>
                                </template>
                                <hc-table v-loading="infoTableLoading" :column="infoTableColumn" :datas="infoTableData" :is-index="false">
                                    <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 v-if="row.status === 1" type="warning" @click="hideClick(row)">隐藏表单</el-link>
                                        <el-link v-if="row.status === 0" type="success" @click="hideClick(row)">取消隐藏</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" :column="infoTableColumn1" :datas="infoTableData" :is-index="false">
                                <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="row.editElementLoading" :disabled="row.excelId === -1 || isNullES(row.excelId) " type="primary" class="link-class" @click="editElement(row)">编辑元素</el-link>
                                    <el-link v-loading="row.adjustExcelLoading" :disabled="row.excelId === -1 || isNullES(row.excelId)" type="warning" class="link-class" @click="adjustExcelClick(row)">调整表单</el-link>
                                    <el-link type="primary" @click="elementFormulasClick(row)">编辑元素公式</el-link>
                                    <el-link v-loading="row.syncTableLoading" type="warning" @click="syncTable(row)">表单同步</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" :major-type="majorDataTypeList" :node="treeInfo"
            :node-type="nodeTypelist" :pid="projectInfo.id" :tree-props="treeProps" :type="Number(isType)"
            :wid="wbsId" @change="treeNodeEditChange" @close="treeNodeEditClose"
        />
        <!-- 节点排序 -->
        <hc-new-dialog v-model="nodeSortModalShow" is-table title="调整排序" widths="1100px" @save="nodeSortModalSave">
            <hc-table
                :column="nodeSortTableColumn" :datas="nodeSortTableData" :index-style="{ width: 80 }"
                :loading="nodeSortNodeLoading" is-row-drop quick-sort ui="hc-table-row-drop"
                @row-drop="nodeSortTableRowDrop" @row-sort="nodeSortTableRowDrop"
            >
                <template #action="{ row, index }">
                    <span :class="index === 0 ? 'text-gray' : 'text-link'" class="text-xl" @click="upNodeSortClick(row, index)">
                        <hc-icon fill name="arrow-up" />
                    </span>
                    <span :class=" index === nodeSortTableData.length - 1 ? 'text-gray' : 'text-link' " class="ml-2 text-xl" @click="downNodeSortClick(row, index)">
                        <hc-icon fill name="arrow-down" />
                    </span>
                </template>
            </hc-table>
        </hc-new-dialog>
        <!-- 关联清表 -->
        <HcAssociationList v-model="isAssociationShow" :info="associationInfo" @change="getInfoTableData" />
        <!-- 编辑元素 -->
        <HcEditElement v-model="isEditElementShow" :data="editElementData" :info="editElementInfo" @to-page="editElementToPage" />
        <!-- 调整表单 -->
        <HcAdjustExcel v-model="isAdjustExcelShow" :info="adjustExcelInfo" />
        <!-- 编辑元素公式 -->
        <hc-dialog v-model="elementFormulasShow" :footer="false" :title="elementFormulasName" is-table widths="600px" @close="elementFormulasClose">
            <template #search>
                <hc-search-input v-model="formulaInput" @search="searchFormulaClick" />
            </template>
            <hc-table v-loading="formulaTableLoading" :column="formulaTableColumn" :datas="formulaTableData" :is-current-row="false" :is-index="false">
                <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" :node-id="treeItem.id" :node-info="treeItem" :project-id="projectInfo.id" :scope-type="10" @close="nodeParamClose" />
        <!-- 独立表单库 -->
        <independentPage v-model="independentShow" :project-id="projectInfo.id" :wbs-id="wbsId" :wbs-type="isType" @close="independentClose" />
        <!-- 归档文件时间 -->
        <archiveTime v-model="isArchiveShow" />

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

        <!-- 创建新的元素表 -->
        <createNewExcel
            v-model="isCreateShow" :e-key="eKey" :init-table-id="initTableId" :init-table-name="initTableName"
            :node="treeItem" :owner-type-list="ownerTypeList" :table-id="tableId" :table-typelist="tableTypelist"
            :title="modalTitle" :type="0" :wid="wbsId" :is-add="isAddType" @close="createClose"
        />

        <!-- 分配WBS -->
        <allocateWbs v-model="isAllocateShow" :data="allocateWbsInfo" :project-id="projectInfo.id" :type="1" :wbs-type="isType" />
    </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 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'

//接口
import excelApi from '~api/exctab/exceltab'
import wbsTreeApi from '~api/wbs/tree'
import mainApi from '~api/wbs/private'

//参数
const props = defineProps({
    type: {
        type: [String, Number],
        default: '1',
    },
    info: {
        type: Object,
        default: () => ({}),
    },
})
//事件
const emit = defineEmits(['change', 'close'])
//页面分割
const splitOptions = { sizes: [25, 75], snapOffset: 0, minSize: [300, 300] }
//双向绑定
// 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 dialogClose = () => {
    infoTableData.value = []
    nodeTableData.value = []
    isShow.value = false
    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 isShowTree = ref(true)
const refreshTree = () => {
    isShowTree.value = false
    setTimeout(() => {
        isShowTree.value = true
    }, 1000)
}
//树节点搜索
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()
    refreshTree()
}

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

//懒加载树
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: '操作',
       
        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) => {
    row.editElementLoading = true
    const { code, data } = await excelApi.getExcelHtml({ pkeyId: row.pkeyId })
    if (code !== 200 || isNullES(data)) {
        editElementLoading.value = false
        window?.$message.warning('表单异常，请联系管理员')
        return
    }
    row.editElementLoading = 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 adjustExcelInfo = ref({})
const adjustExcelClick = async (row) => {
    const { pkeyId, excelId } = row
    if (isNullES(pkeyId) || isNullES(excelId)) {
        window?.$message.warning('表单值异常，请联系管理员')
        return
    }
    row.adjustExcelLoading = true
    const { code, data } = await excelApi.getExcelHtml({ pkeyId })
    if (code !== 200 || isNullES(data)) {
        row.adjustExcelLoading = false
        window?.$message.warning('表单异常，请联系管理员')
        return
    }
    adjustExcelInfo.value = deepClone(row)
    row.adjustExcelLoading = false
    await nextTick()
    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()
    const formulasObj = elementFormulasObj.value
    const title = `${formulasObj.tableName ? formulasObj.tableName + ' 元素公式（元素库）' : '元素公式（元素库）'}`
    editFormulaData.value = {
        node: treeItem.value,
        pid: projectInfo.value.id,
        wbsId: wbsId.value,
        nodeId: treeItem.value.id,
        eleId: row.id,
        tableType: false,
        globalType: 20,
        cardTitle: title,
    }
    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 = async () => {
    const { id } = treeItem.value
    if (!id) {
        window?.$message.warning('请先选择节点')
        return
    }
    await nextTick()
    nodeParamShow.value = true
}
//独立表单库
const independentShow = ref(false)
const independentClose = () => {
    independentShow.value = false
}
const toIndependent = () => {
    independentShow.value = true
}
//归档文件时间
const isArchiveShow = ref(false)
const archiveClick = async () => {
    await nextTick()
    isArchiveShow.value = true
}
//编辑元素表单
const editEleShow = ref(false)
const editClose = () => {
    editEleShow.value = false
}
const editRowClick = async (row) => {
    await nextTick()
    editEleShow.value = true
}

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

//创建新的元素表
const isCreateShow = ref(false)
const modalTitle = ref('创建新的元素表')
const isAddType = ref(true)
const createClose = async () => {

    isCreateShow.value = false
    getInfoTableData()
}
const initTableName = ref('')
const initTableId = ref('')
const eKey = ref('')
const tableId = ref('')
const handleEdit = async (row) => {
    await nextTick()
    isCreateShow.value = true
    isAddType.value = false
    modalTitle.value = row.tableName + '元素编辑'
    isAddType.value = false
    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 syncTable = async (row) => {
    row.syncTableLoading = true
    const { code, error } = await wbsTreeApi.syncCurrentFormInProject({
        pKeyId: row.pkeyId,
    })
    row.syncTableLoading = false
    if (!error && code === 200) {
        window?.$message.success('操作成功')
    }
}
//关联节点
const isAllocateShow = ref(false)
const allocateWbsInfo = ref({})
const linkNodeClick = async (row) => {
    allocateWbsInfo.value = row
    await nextTick()
    isAllocateShow.value = true
}
</script>

<style lang="scss" scoped>
.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: 129.5px;
        }
        .body-content {
            position: relative;
            margin-top: 10px;
            height: calc(100% - 129.5px);
        }
    }
}
</style>