for_client/src/views/data-fill/collapse-form/test-copy.vue

<template>
    <div>
        <el-alert v-if="CopyModalType === '1'" :closable="false" title="复跨节点复制: 把当前表格已形成的数据复制到其他工程部位的相同表格里面" type="warning" />
        <el-alert v-else :closable="false" title="本节点复制:在当前节点内复制本表及数据" type="warning" />
        <div v-if="CopyModalType === '1'" class="copy-node-many-box">
            <div class="copy-node-many-tree">
                <el-scrollbar>
                    <HcLazyTree
                        ref="copywbstree" is-type
                        :auto-expand-keys="treeautokeys"
                        @load="treeLoadNode"
                        @node-loading="ElTreeNodeLoading"
                        @node-tap="wbsElTreeClick"
                    />
                <!-- WbsTree
                    :treeKey="wbstreeKey"
                    :classifyType="classify"
                    :contractId="contractId"
                    :projectId="projectId"
                    @nodeLoading="ElTreeNodeLoading"
                    @nodeTap="wbsElTreeClick"
                    ref="copywbstree"
                    :autoExpandKeys="treeautokeys"
                / -->
                </el-scrollbar>
            </div>
            <div class="copy-node-many-table">
                <el-scrollbar v-loading="tableLoading">
                    <el-table :data="copyModalTable" border>
                        <el-table-column label="表格名称" prop="fullName" />
                        <el-table-column align="center" label="操作" prop="action" width="120">
                            <template #default="{ row }">
                                <el-checkbox v-model="row.isCheck" size="large" @change="copyModalTableCheck(row)" />
                            </template>
                        </el-table-column>
                    </el-table>
                </el-scrollbar>
            </div>
        </div>
    </div>
</template>

<script setup>
import { nextTick, onMounted, ref, watch } from 'vue'
import { getArrValue, getObjValue, setPosInsert } from 'js-fast-way'
import queryApi from '~api/data-fill/query'
import wbsApi from '~api/data-fill/wbs'

const props = defineProps({
    projectId: [String, Number],
    contractId: [String, Number],
    classify:[String, Number],
    tree_AutoExpandKeys:[Array],
    treenodeDataInfo:[Object], //外层选中的树
    copyItems:[Object], //复制本表的数据
    CopyModalType:[String, Number],
})
//参数变量
const projectId = ref(props.projectId)
const contractId = ref(props.contractId)
const classify = ref(props.classify)
const tree_AutoExpandKeys = ref(props.tree_AutoExpandKeys)
const treenodeDataInfo = ref(props.treenodeDataInfo)
const copyItems = ref(props.copyItems)
const CopyModalType = ref(props.CopyModalType)
const copyModalTable = ref([])
const tableLoading = ref(false)
const treeLoading = ref(false)
const copywbstree = ref(null)
//监听
watch(() => [
    props.projectId,
    props.contractId,
    props.CopyModalType,

], ([pid, cid, CopyModaltype]) => {
    projectId.value = pid
    contractId.value = cid

    CopyModalType.value = CopyModaltype
})
//树加载完成
const ElTreeNodeLoading = () => {
    treeLoading.value = false
    console.log(tree_AutoExpandKeys.value, 'tree_AutoExpandKeys')
}
const wbstreeKey = ref(Math.random())
const nodeItemInfo = ref({})
const nodeDataInfo = ref({})

//懒加载的数据
const treeLoadNode = async ({ node, item, level }, resolve) => {
    let contractIdRelation = '', parentId = '', primaryKeyId = ''
    if (level !== 0) {
        const nodeData = getObjValue(item)
        contractIdRelation = nodeData?.contractIdRelation || ''
        parentId = contractIdRelation ? nodeData?.primaryKeyId : nodeData?.id
        primaryKeyId = nodeData?.id || ''
    }
    //获取数据
    const { data } = await queryApi.queryWbsTreeData({
        contractId: contractId.value || '',
        contractIdRelation,
        primaryKeyId,
        parentId,
        classifyType: classify.value,
        dataTime:new Date(),
    })
    resolve(getArrValue(data))
}


//树被点击
const wbsElTreeClick = ({ node, data, keys }) => {
    nodeItemInfo.value = node
    nodeDataInfo.value = data
    searchTabledata()
}
const searchTabledata = async () => {
    copyModalTable.value = []
    const info = nodeDataInfo.value
    tableLoading.value = true
    const { error, code, data } = await wbsApi.searchNodeAllTable({
        projectId: projectId.value,
        contractId: contractId.value,
        primaryKeyId: info['primaryKeyId'],
        type: classify.value,
    })
    //处理数据
    tableLoading.value = false
    if (!error && code === 200) {
        copyModalTable.value = getArrValue(data)
    } else {
        copyModalTable.value = []
    }
}
//勾选复制本表
const copyModalTableCheck = async (item) => {
    console.log('复制本表', item)
}
const treeautokeys = ref([])
</script>

<style>
.mtop5{
    margin-top: 5px;
}
</style>