up

src/layout/index.vue

@@ -198,9 +198,9 @@ const projectContractChange = (val) => {
 
 //菜单被点击
 const MenuBarChange = (item) => {
-    MenuBarKey.value = item.key;
+    MenuBarKey.value = item.code;
     router.push({
-        name: item?.key || '/',
+        name: item?.code,
         //query: {MenuBarKey: key}
     });
 }

src/layout/modules/HelpInfoBar.vue

@@ -27,49 +27,63 @@
             </div>
         </div>
     </el-popover>
-
-    <!--n-modal v-model:show="videoPreviewModal" title="当前页面功能讲解" preset="card" class="w-990">
+    <!--当前页面功能讲解-->
+    <el-dialog v-model="videoPreviewModal" width="62rem" :before-close="videoPreviewModalClose">
         <video class="preview-video" :src="videoUrl" controls="controls" autoplay="autoplay">
             您的浏览器不支持 video
         </video>
-    </n-modal-->
+    </el-dialog>
 </template>
 
 <script setup>
 import {ref,watch,nextTick} from "vue";
-import { useRouter, useRoute } from 'vue-router'
+import {useRouter,useRoute} from 'vue-router'
+import website from '~src/config/index'
 import {useAppStore} from "~src/store/index";
 import ScreenShot from "js-web-screen-shot";
+import {isType,utilsArray,utilsStore} from "vue-utils-plus"
 
 //初始变量
 const router = useRouter()
 const useRoutes = useRoute()
 const useAppState = useAppStore()
+const {getStoreData} = utilsStore(website.key)
+const {getOneObjValue} = utilsArray()
+const {getObjValue} = isType()
+
+//相关变量
+const route = getObjValue(getStoreData('route'))
 const bubbleVal = ref(useAppState.getBubble);
+const videoUrl = ref('')
 const videoPreviewModal = ref(false)
-const videoUrl = ref(useRoutes.meta['videoUrl'] || '')
 const webRtcVal = ref(false)
 const fullScreenVal = ref(true)
 
 //监听
 watch(() => [
     useAppState.getBubble,
-    useRoutes?.meta?.videoUrl,
+    useRoutes.name,
     useAppState.getShotWebRtc,
     useAppState.getFullScreen,
-], ([Bubble,url,webRtc,fullScreen]) => {
+], ([Bubble,routeName,webRtc,fullScreen]) => {
     bubbleVal.value = Bubble
-    videoUrl.value = url || ''
+    getVideoUrl(routeName)
     setScreenShotData(webRtc,fullScreen)
 })
 
 //渲染完成
 nextTick(() => {
+    getVideoUrl(useRoutes?.name)
     const webRtc = useAppState.getShotWebRtc
     const fullScreen = useAppState.getFullScreen
     setScreenShotData(webRtc,fullScreen)
 })
 
+//取视频地址
+const getVideoUrl = (name) => {
+    videoUrl.value = getOneObjValue(route, name, 'videoUrl')
+}
+
 //处理屏幕截图的配置
 const setScreenShotData = (webRtc,fullScreen) => {
     webRtcVal.value = parseInt(webRtc) === 1
@@ -117,6 +131,12 @@ const getAssetsHomeFile = (url) => {
     const modules = import.meta.globEager("../../assets/images/*");
     return modules[path].default;
 }
+
+//关闭视频弹窗
+const videoPreviewModalClose = () => {
+    videoPreviewModal.value = false
+}
+
 </script>
 
 <style lang="scss" scoped>

src/layout/modules/MenuBar.vue

@@ -44,7 +44,7 @@ watch(() => [
 //事件
 const emit = defineEmits(['change'])
 const MenuClick = (item) => {
-    curKey.value = item?.key || '';
+    curKey.value = item?.code || '';
     emit('change', item)
 }
 </script>

src/views/data-fill/components/ListItem.vue

@@ -0,0 +1,619 @@
+<template>
+    <div class="data-fill-list-box">
+        <n-collapse accordion @update:expanded-names="updateExpandedNames">
+            <template v-for="(item,index) in listDatas" :key="item?.pkeyId">
+                <n-collapse-item display-directive="show" :id="`item-${index}-${item?.pkeyId}`" :name="`item-${index}-${item?.pkeyId}`">
+                    <template #header>
+                        <div class="text-lg truncate item-title">{{item.name}}</div>
+                    </template>
+                    <template #header-extra>
+                        <div class="flex items-center hc-extra-text-box">
+                            <n-popover trigger="hover" :disabled="!bubbleVal || !btn_copy_table?.textInfo" v-if="btn_copy_table">
+                                <template #trigger>
+                                    <div class="text-main extra-text-item" @click.stop="copyClick(item,index)">
+                                        <i class="hcicon-a-Frame3"/>
+                                        <span class="ml-1">复制本表</span>
+                                    </div>
+                                </template>
+                                <span>{{btn_copy_table?.textInfo}}</span>
+                            </n-popover>
+                            <n-popover trigger="hover" :disabled="!bubbleVal || !btn_hide_table?.textInfo" v-if="btn_hide_table">
+                                <template #trigger>
+                                    <div class="text-gray-400 ml-8 extra-text-item" @click.stop="hideClick(item,index)">
+                                        <i class="hcicon-a-Frame4"/>
+                                        <span class="ml-1">隐藏本表</span>
+                                    </div>
+                                </template>
+                                <span>{{btn_hide_table?.textInfo}}</span>
+                            </n-popover>
+                            <n-popover trigger="hover" :disabled="!bubbleVal || !btn_pre_table?.textInfo" v-if="btn_pre_table">
+                                <template #trigger>
+                                    <div class="text-gray-400 ml-8 extra-text-item" @click.stop="previewClick(item,index)">
+                                        <i class="hcicon-Frame"/>
+                                        <span class="ml-1">预览</span>
+                                    </div>
+                                </template>
+                                <span>{{btn_pre_table?.textInfo}}</span>
+                            </n-popover>
+                            <n-popover trigger="hover" :disabled="!bubbleVal || !btn_up_table?.textInfo" v-if="btn_up_table">
+                                <template #trigger>
+                                    <div class="text-main ml-8 extra-text-item" @click.stop="uploadClick(item,index)">
+                                        <i class="hcicon-shangchuan"/>
+                                        <span class="ml-1">上传</span>
+                                    </div>
+                                </template>
+                                <span>{{btn_up_table?.textInfo}}</span>
+                            </n-popover>
+                        </div>
+                    </template>
+                    <div class="data-fill-list-item-content">
+                        <div class="data-fill-table-form-box">
+                            <div :id="`table-form-${item?.pkeyId}`"></div>
+                            <div class="hc-no-table-form" v-if="item?.isTableForm === false">
+                                <div class="table-form-no">
+                                    <img :src="notableform" alt=""/>
+                                    <div class="desc">暂无表单数据</div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="data-fill-table-tip-box">
+                            <div class="text-orange tip-title">
+                                <i class="_icon-info-o"/>
+                                <span class="ml-1">提示</span>
+                            </div>
+                            <div class="text-gray-400 tip-item">1、灰色框代表可通过系统识别计算，公式自动引用，可通过公式计算少量数据，(表头数据及简单)，也可只填写白色框数据</div>
+                            <div class="text-gray-400 tip-item">2、系统支持键盘中，shift + tab键向上一个填报框切换，tab向下一个填报框切换。暂不支持上下按键切换输入框</div>
+                            <div class="table-tip-foot">
+                                <div class="tip-left-btn">
+                                    <n-popover trigger="hover" :disabled="!bubbleVal || !btn_impo_table?.textInfo" v-if="btn_impo_table">
+                                        <template #trigger>
+                                            <div class="text-gray-400 dow-text">
+                                                <i class="hcicon-Frame1"/>
+                                                <span class="ml-1">导入列表数据</span>
+                                            </div>
+                                        </template>
+                                        <span>{{btn_impo_table?.textInfo}}</span>
+                                    </n-popover>
+                                    <n-popover trigger="hover" :disabled="!bubbleVal || !btn_down_table?.textInfo" v-if="btn_down_table">
+                                        <template #trigger>
+                                            <div class="text-main dow-text">
+                                                <i class="hcicon-a-Frame11"/>
+                                                <span class="ml-1">下载导入模板</span>
+                                            </div>
+                                        </template>
+                                        <span>{{btn_down_table?.textInfo}}</span>
+                                    </n-popover>
+                                </div>
+                                <div class="tip-right-btn">
+                                    <n-popover trigger="hover" :disabled="!bubbleVal || !btn_save_table?.textInfo" v-if="btn_save_table">
+                                        <template #trigger>
+                                            <n-button type="primary" strong secondary size="large" @click="tableFormSaveClick(item,index)">保存</n-button>
+                                        </template>
+                                        <span>{{btn_save_table?.textInfo}}</span>
+                                    </n-popover>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </n-collapse-item>
+            </template>
+        </n-collapse>
+    </div>
+    <!--鼠标右键菜单-->
+    <n-dropdown placement="bottom" inverted trigger="manual" :x="tableFormMenuX" :y="tableFormMenuY" size="huge" :options="tableFormMenu" :show="tableFormMenuShow" @clickoutside="onClickoutside" @select="handleMenuSelect"/>
+    <!--插入设计值/频率-->
+    <n-modal v-model:show="IDVFModal" class="hc-custom-card" title="插入设计值/频率" preset="card" style="width: 600px;" :segmented="{content: 'soft', footer: 'soft'}">
+        <div class="text-base mb-6 ml-16 pl-1">填写完设计值和频率，系统自动计算实测值</div>
+        <n-form ref="formIDVFRef" :model="formIDVFModel" :rules="formIDVFRules" label-placement="left" label-width="auto" size="large">
+            <n-form-item label="设计值" path="designValue">
+                <n-input v-model:value="formIDVFModel.designValue" placeholder="请输入设计值"/>
+            </n-form-item>
+            <n-form-item label="频率" path="frequency">
+                <n-input v-model:value="formIDVFModel.frequency" placeholder="请输入频率"/>
+            </n-form-item>
+        </n-form>
+        <template #footer>
+            <div class="text-center">
+                <n-button @click="IDVFModal = false">取消</n-button>
+                <n-button type="primary" class="ml-6">确认插入</n-button>
+            </div>
+        </template>
+    </n-modal>
+    <!--插入特殊字符-->
+    <n-modal v-model:show="specialModal" class="hc-custom-card" title="插入特殊字符" preset="card" style="width: 600px;" :segmented="{content: 'soft', footer: 'soft'}">
+        <n-input ref="specialRef" id="specialId" class="font-EUDC mb-6" v-model:value="specialValue" size="large" placeholder="请选择特殊字符代码" clearable autofocus/>
+        <n-grid :x-gap="10" :y-gap="10" :cols="8">
+            <n-grid-item v-for="item in specialCharacters" :key="item">
+                <div class="special-box" @click="specialClick">
+                    <span class="font-EUDC" :title="`字符代码(C):${item !== 'K̅'?item.slice(2,7):'K̅'}`" v-html="item"/>
+                </div>
+            </n-grid-item>
+        </n-grid>
+        <template #footer>
+            <div class="text-center">
+                <n-button @click="specialModal = false">取消</n-button>
+                <n-button type="primary" class="ml-6" @click="specialNodeClick">确认插入</n-button>
+            </div>
+        </template>
+    </n-modal>
+    <!--关联试验数据-->
+    <n-modal v-model:show="CTDModal" class="hc-custom-card" title="关联试验数据" preset="card" style="width: 850px;" :segmented="{content: 'soft', footer: 'soft'}">
+        123456
+        <template #footer>
+            <div class="text-center">
+                <n-button @click="CTDModal = false">取消</n-button>
+                <n-button type="primary" class="ml-6">确认插入</n-button>
+            </div>
+        </template>
+    </n-modal>
+</template>
+
+<script setup>
+import {ref,watch,nextTick} from "vue";
+import {useAppStore} from "~src/store/index";
+import wbsApi from "~api/data-fill/wbs"
+import {ElInput,ElDatePicker} from 'element-plus'
+import {createApp} from "vue/dist/vue.esm-bundler.js";
+import {isString} from "~src/utils/lib/isApp";
+import notableform from '~src/assets/view/notableform.svg';
+
+//初始
+const useAppState = useAppStore()
+const props = defineProps({
+    datas: {
+        type: Array,
+        default: () => ([])
+    },
+    projectId: {
+        type: [String,Number],
+        default: ''
+    },
+    contractId: {
+        type: [String,Number],
+        default: ''
+    },
+    classify: {
+        type: [String,Number],
+        default: ''
+    },
+})
+
+//按钮气泡开关
+const bubbleVal = ref(useAppState.getBubble);
+const projectId = ref(props.projectId)
+const contractId = ref(props.contractId)
+const listDatas = ref(props.datas)
+const classify = ref(props.classify)
+
+//监听
+watch(() => [
+    props.datas,
+    props.projectId,
+    props.contractId,
+    useAppState.getBubble,
+    props.classify,
+], ([datas, pid, cid, Bubble,classifyVal]) => {
+    listDatas.value = datas
+    bubbleVal.value = Bubble
+    projectId.value = pid
+    contractId.value = cid
+    classify.value = classifyVal
+    setFormDataNum(datas)
+})
+
+//获取气泡数据
+const getButtonsVal = (value) => {
+    return useAppState.getButtonsVal(value)
+}
+
+const btn_copy_table = ref(getButtonsVal('wbs_copy_table')) //复制本表
+const btn_hide_table = ref(getButtonsVal('wbs_hide_table')) //隐藏本表
+const btn_pre_table = ref(getButtonsVal('wbs_preview_table')) //预览本表
+const btn_up_table = ref(getButtonsVal('wbs_upload_table')) //上传
+
+const btn_down_table = ref(getButtonsVal('wbs_download_table')) //下载导入模板
+const btn_impo_table = ref(getButtonsVal('wbs_import_table')) //导入列表数据
+const btn_save_table = ref(getButtonsVal('wbs_save_table'))//保存本表
+
+//事件
+const emit = defineEmits(['uploadTap','itemTap','copyTap','hideTap','previewTap','offsetTop'])
+
+nextTick(() => {
+    setFormDataNum(props.datas)
+})
+
+//展开事件
+const updateExpandedNames = (name) => {
+    const keys = name.length > 0 ? name[0]:'';
+    const names = name.length > 0 ? name[0].split('-'): []
+    if (names.length > 0) {
+        getOffsetTop(keys)
+        const index = names[1]
+        const item = listDatas.value[index]
+        if (!item.isTableFormRender) {
+            getExcelHtml(item,index)
+        }
+    } else {
+        emit('offsetTop', {offsetTop: 0, dom: null})
+    }
+}
+
+//获取模板标签数据
+const getExcelHtml = (item,index) => {
+    if (item.pkeyId !== 0) {
+        wbsApi.getExcelHtml({
+            pkeyId: item.pkeyId + ''
+        }).then(({data}) => {
+            const res = isString(data.data)?data.data:''
+            if (res) {
+                item.isTableForm = true
+                HTableForm(res, item, index)
+            } else {
+                item.isTableForm = false
+                window?.$message?.warning('清表内容是空的')
+            }
+        }).catch(() => {
+            item.isTableForm = false
+        })
+    } else {
+        item.isTableForm = false
+        window?.$message?.warning('pkeyId为空')
+    }
+}
+
+//渲染模板标签
+const formData = ref([])
+
+//设置表单对象的数量
+const setFormDataNum = (datas) => {
+    if(datas.length > 0) {
+        datas.forEach(item => {
+            formData.value.push({
+                projectId: projectId.value,
+                contractId: contractId.value
+            })
+        })
+    }
+}
+
+//渲染表格表单
+const HTableForm = (templateData,item,index) => {
+    const app = createApp({
+        data() {
+            return {
+                formData: formData.value[index],
+            }
+        },
+        template: templateData,
+        components: {ElInput,ElDatePicker},
+        methods: {
+            RightClick(a,b,c,d,e,f,event) {
+                event.preventDefault();
+                const key = event?.target?.getAttribute('keyname') || ''
+                onRightClick(event,key,index)
+            },
+            getInformation(a,b,c) {
+
+            },
+        }
+    })
+    app.mount(`#table-form-${item.pkeyId}`)
+    item.isTableFormRender = true
+}
+
+//树的菜单相关变量
+const tableFormMenuShow = ref(false)
+const tableFormItemNode = ref({})
+const tableFormMenuX = ref(0);
+const tableFormMenuY = ref(0);
+
+//树的菜单数据
+const tableFormMenu = ref([
+    {label: '插入设计值/频率', key: "IDVF"},
+    {label: '插入特殊字符', key: "special"},
+    {label: '关联试验数据', key: "CTD"},
+])
+
+//鼠标右键事件
+const onRightClick = (event,key,index) => {
+    //取光标位置
+    let specialDom = document.getElementById(key + "");
+    let startPos = specialDom?.selectionStart, endPos = specialDom?.selectionEnd;
+    //存储临时信息
+    tableFormItemNode.value = {key, index, startPos, endPos}
+    //取坐标
+    nextTick().then(() => {
+        tableFormMenuShow.value = true;
+        tableFormMenuX.value = event.clientX;
+        tableFormMenuY.value = event.clientY;
+    });
+}
+
+//鼠标右键菜单被点击
+const handleMenuSelect = (key) => {
+    //const item = tableFormItemNode.value;
+    tableFormMenuShow.value = false;
+    if (key === 'IDVF') {
+        IDVFModal.value = true
+    } else if (key === 'special') {
+        specialModalShow()
+    } else if (key === 'CTD') {
+        CTDModal.value = true
+    }
+}
+
+const onClickoutside = () => {
+    tableFormItemNode.value = {};
+    tableFormMenuShow.value = false;
+}
+
+//单个保存
+const tableFormSaveClick = (item,index) => {
+    wbsApi.saveExcelBussData({
+        pkeyId: item.pkeyId,
+        classify: classify.value,
+        ...formData.value[index]
+    }).then(({data}) => {
+        if(data.code === 200) {
+            window?.$message?.success('保存成功')
+        } else {
+            window?.$message?.warning(data.msg || '保存失败')
+        }
+    })
+}
+
+//复制本表
+const copyClick = (item,index) => {
+    emit('copyTap', {item,index})
+}
+//隐藏本表
+const hideClick = (item,index) => {
+    emit('hideTap', {item,index})
+}
+//预览
+const previewClick = (item,index) => {
+    emit('previewTap', {item,index})
+}
+//上传被点击
+const uploadClick = (item,index) => {
+    emit('uploadTap', {item,index})
+}
+
+//上传被点击
+const getOffsetTop = (key) => {
+    const dom = document.getElementById(key)
+    emit('offsetTop', dom.offsetTop)
+}
+
+//插入设计值/频率
+const IDVFModal = ref(false)
+const formIDVFRef = ref(null)
+const formIDVFModel = ref({
+    designValue: '', frequency: ''
+})
+const formIDVFRules = {
+    designValue: {
+        required: true,
+        trigger: ["blur", "input"],
+        message: "请输入设计值"
+    },
+    frequency: {
+        required: true,
+        trigger: ["blur", "input"],
+        message: "请输入频率"
+    }
+}
+
+//插入特殊字符
+const specialModal = ref(false)
+const specialCharacters = ref([
+    '&#57344;', "&#57345;", "&#57346;", "&#57347;", '&#8804;', '&#8805;', '&#8451;',
+    '&#9312;', '&#9313;', '&#9314;', '&#9315;', '&#9316;', '&#9317;', '&#9318;', '&#9319;', '&#9320;', '&#9321;', '&#9322;', '&#9323;',
+    '&#9324;', '&#9325;', '&#9326;', '&#9327;', '&#9328;', '&#9329;', '&#9330;', '&#9331;',
+    "&#8544;", "&#8545;", "&#8546;", "&#8547;", "&#8548;", "&#8549;", "&#8550;", "&#8551;", "&#8552;", "&#8553;", "&#8554;", "&#8555;","K̅"
+])
+const specialRef = ref(null)
+const specialValue = ref('')
+const specialModalShow = () => {
+    specialValue.value = ''
+    specialModal.value = true
+    nextTick(() => {
+        specialRef.value?.focus();
+    })
+}
+const specialClick = (event) => {
+    inputInsertValue("specialId", event.target.innerText)
+}
+//输入框插入内容
+const inputInsertValue = (Id,val) => {
+    let specialDom = document.getElementById(Id + "").getElementsByTagName('input')[0];
+    let startPos = specialDom?.selectionStart, endPos = specialDom?.selectionEnd;
+    if (startPos || startPos === 0) {
+        let specialVal = specialValue.value;
+        specialValue.value = specialVal.substring(0, startPos) + val + specialVal.substring(endPos, specialVal.length)
+        specialDom?.focus();
+        //设置光标位置
+        let posVal = startPos + val.length;
+        nextTick(() => {
+            specialDom?.setSelectionRange(posVal,posVal)
+        })
+    } else {
+        specialValue.value += val;
+        specialDom?.focus();
+    }
+}
+
+//插入内容
+const inputPosInsert = (dom,startPos,endPos,special,value) => {
+    let val = value || '', specialVal = special || ''
+    console.log(startPos,endPos)
+    if (startPos || startPos === 0) {
+        val = val.substring(0, startPos) + specialVal + val.substring(endPos, val.length)
+        dom?.focus();
+        //设置光标位置
+        let posVal = startPos + specialVal.length;
+        nextTick(() => {
+            dom?.setSelectionRange(posVal,posVal)
+        })
+    } else {
+        val += specialVal;
+        dom?.focus();
+    }
+    return val
+}
+
+//确认插入
+const specialNodeClick = () => {
+    const item = tableFormItemNode.value;
+    const form = formData.value[item.index]
+    let keyDom = document.getElementById(item.key);
+    const res = inputPosInsert(keyDom,item.startPos,item.endPos,specialValue.value,form[item.key])
+    formData.value[item.index][item.key] = res
+    specialModal.value = false
+}
+
+//关联试验数据
+const CTDModal = ref(false)
+
+</script>
+
+<style lang="scss" scoped>
+.data-fill-list-box {
+    position: relative;
+    .item-title {
+        position: relative;
+        padding-left: 10px;
+        user-select: none;
+    }
+    .hc-extra-text-box .extra-text-item {
+        font-size: 16px;
+        user-select: none;
+    }
+    .data-fill-list-item-content {
+        position: relative;
+        display: flex;
+        .data-fill-table-form-box {
+            position: relative;
+            padding: 24px 20px;
+            height: calc(100vh - 380px);
+            overflow: auto;
+            flex: 1;
+            .hc-no-table-form {
+                position: relative;
+                height: 100%;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                .table-form-no {
+                    position: relative;
+                    img {
+                        width: 350px;
+                    }
+                    .desc {
+                        text-align: center;
+                        font-size: 20px;
+                        color: #aaa;
+                    }
+                }
+            }
+        }
+        .data-fill-table-tip-box {
+            width: 240px;
+            position: relative;
+            border-left: 1px solid #e4e4e4;
+            padding: 20px 15px 80px;
+            .tip-title {
+                font-size: 16px;
+                margin-bottom: 10px;
+            }
+            .tip-item {
+                margin-bottom: 20px;
+            }
+            .table-tip-foot {
+                position: absolute;
+                bottom: 15px;
+                right: 0;
+                left: 0;
+                display: flex;
+                align-items: center;
+                padding: 0 15px;
+                .tip-left-btn {
+                    flex: 1;
+                    .dow-text {
+                        cursor: pointer;
+                    }
+                }
+            }
+        }
+    }
+}
+.special-box {
+    position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    border: 1px solid #eee;
+    border-radius: 3px;
+    height: 60px;
+    cursor: default;
+    user-select: none;
+    transition: color .3s, background-color .3s;
+    &:hover {
+        color: var(--hc-primary);
+        background-color: var(--hc-primary-light-1);
+    }
+    .font-EUDC {
+        font-size: 30px;
+        cursor: default;
+    }
+}
+</style>
+
+<style lang="scss">
+.data-fill-list-box {
+    .n-collapse .n-collapse-item {
+        border: 1px solid #ddd;
+        border-radius: 3px;
+        margin: 0 0 15px;
+        background-color: white;
+        .n-collapse-item__header {
+            padding: 0;
+            transition: color .3s var(--n-bezier), background-color .3s;
+            border-radius: 3px 3px 0 0;
+            .n-collapse-item__header-main {
+                padding: 15px 20px;
+            }
+            .n-collapse-item__header-extra {
+                padding-right: 20px;
+            }
+            &.n-collapse-item__header--active {
+                background-color: #F9F9F9;
+                border-bottom: 1px solid #ddd;
+            }
+        }
+        .n-collapse-item__content-wrapper .n-collapse-item__content-inner {
+            padding-top: 0;
+        }
+    }
+}
+//设置表单样式
+.data-fill-table-form-box {
+    td {
+        padding: 6px;
+        font-family: "EUDC", 宋体, v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
+        .el-input {
+            background-color: #ffffff !important;
+            border-radius: 3px;
+            .el-input__wrapper {
+                background-color: inherit;
+            }
+            .el-input__wrapper.is-focus, .el-input__wrapper:hover {
+                box-shadow: 0 0 0 1.5px var(--el-input-focus-border-color) inset;
+                background-color: #eddac4;
+            }
+            //公式 #dcdcdc
+            //焦点 #eddac4
+        }
+    }
+}
+</style>

src/views/data-fill/components/WbsTree.vue

@@ -29,7 +29,9 @@ import dataFillQuery from '~api/data-fill/query';
 import {utilsArray} from "vue-utils-plus"
 import {NDropdown} from 'naive-ui';
 
+//初始变量
 const { isItem } = utilsArray()
+
 //参数
 const props = defineProps({
     menus: {

src/views/data-fill/components/nodeTree/children.vue

@@ -0,0 +1,275 @@
+<template>
+    <div class="cu-tree-node-children">
+        <div class="cu-tree-node-view is-leaf" v-for="item in nodes" :key="item[format.key]">
+            <div class="cu-tree-node-label">
+                <div class="cu-tree-node-label-text">
+                    <div class="cu-tree-node-label-name" :id="`node-tree-${item.key}`" @click="nodeLabelClick(item)" @dblclick="nodeLabelDblClick(item)" @contextmenu="nodeLabelContextMenu($event,item)">
+                        <template v-if="TreeIsColor">
+                            <el-button hc-btn color="#0081ff" :loading="item.loading" v-if="item?.colorStatus === 2">{{item.label}}</el-button>
+                            <el-button hc-btn color="#f37b1d" :loading="item.loading" v-else-if="item?.colorStatus === 3">{{item.label}}</el-button>
+                            <el-button type="primary" hc-btn :loading="item.loading" v-else-if="item?.colorStatus === 4">{{item.label}}</el-button>
+                            <el-button type="info" hc-btn :loading="item.loading" v-else>{{item.label}}</el-button>
+                        </template>
+                        <template v-if="!TreeIsColor">
+                            <el-button type="info" hc-btn :loading="item.loading">{{item.label}}</el-button>
+                        </template>
+                    </div>
+                    <span class="cu-tree-node-label-btn" :class="[ifExpanded(item)?'expanded':'']" v-if="isExpanded(item)" @click="expandedClick(item)"/>
+                </div>
+            </div>
+            <TreeNodeChildren :data="item.childNodes" :format="format" :menus="menusData" :isMark="menuMark" :parentNodes="item" v-if="ifExpanded(item)" :isColor="TreeIsColor"
+                              @expandClick="ChildrenExpandedClick" @nodeClick="ChildrenNodeLabelClick" @nodeDblClick="ChildrenNodeLabelDblClick" @menuClick="ChildrenCpoverMenuClick"/>
+        </div>
+    </div>
+    <!--菜单-->
+    <n-dropdown placement="bottom" trigger="manual" :x="x" :y="y" size="huge" :options="menusData" :show="showDropdown" @clickoutside="onClickoutside" @select="handleMenuSelect"/>
+</template>
+
+<script setup>
+import {ref,watch,onMounted,nextTick} from "vue";
+import TreeNodeChildren from "./children.vue"
+import {hIconJs} from "~src/plugins/renderele";
+import {isType} from "vue-utils-plus"
+import { NDropdown } from 'naive-ui';
+
+const { isObject, isBoolean } = isType()
+const props = defineProps({
+    data: {
+        type: Array,
+        default: () => ([])
+    },
+    parentNodes: {
+        type: Object,
+        default: () => ({})
+    },
+    format: {
+        type: Object,
+        default: () => ({
+            key: "key",
+            label: "label",
+            children: "children",
+        })
+    },
+    menus: {
+        type: Array,
+        default: () => ([])
+    },
+    isMark: {
+        type: Boolean,
+        default: false
+    },
+    accordion: {
+        type: Boolean,
+        default: false
+    },
+    isColor: {
+        type: Boolean,
+        default: false
+    },
+})
+
+//初始数据
+const datas = ref(props.data)
+const parent = ref(props.parentNodes)
+const menusData = ref(props.menus)
+const menuMark = ref(props.isMark)
+const nodes = ref([])
+const TreeIsColor = ref(props.isColor)
+
+//树的菜单相关变量
+const showDropdown = ref(false)
+const menuRefItem = ref(null)
+const x = ref(0);
+const y = ref(0);
+
+//监听
+watch(() => [
+    props.data,
+    props.parentNodes,
+    props.menus,
+    props.isMark,
+    props.isColor,
+], ([val,Nodes,menus,isMark,isColor]) => {
+    datas.value = val
+    menusData.value = menus
+    menuMark.value = isMark
+    TreeIsColor.value = isColor
+    if (isDataType(Nodes)) {
+        parent.value = Nodes
+        setDatasToNodes()
+    } else {
+        parent.value = {}
+    }
+})
+
+//渲染完成
+onMounted(()=> {
+    if (isDataType(props.parentNodes)) {
+        parent.value = props.parentNodes
+        setDatasToNodes()
+    } else {
+        parent.value = {}
+    }
+})
+
+//检查数据类型
+const isDataType = (data) => {
+    if (isObject(data)) {
+        return Object.keys(data).length !== 0;
+    } else {
+        return false
+    }
+}
+
+//处理为node节点类型的数据
+const setDatasToNodes = () => {
+    let nodesArr = [];
+    const {key,label,children} = props.format
+    const deepData = datas.value
+    for (let i = 0; i < deepData.length; i++) {
+        let childNodes = deepData[i][children] //子级数据
+        let ifChildren = !!(childNodes && childNodes.length > 0);
+        nodesArr.push({
+            childNodes: childNodes, //子节点原始数据
+            childrenNodes: [],      //子节点node封装数据
+            data: deepData[i],      //节点主要数据
+            parentNodes: parent.value,  //父节点数据
+            expanded: ifChildren || deepData[i]['expanded'] || false,  //是否展开
+            isExpand: ifChildren || deepData[i]['isExpand'] || false,   //是否能展开
+            isLeaf: deepData[i]['isLeaf'] || false,     //是否为最后一节
+            loading: deepData[i]['loading'] || false,   //加载状态
+            colorStatus: deepData[i]['colorStatus'] || 1,   //颜色状态
+            key: deepData[i][key],      //节点的key
+            label: deepData[i][label]   //节点显示的名称
+        })
+    }
+    nodes.value = nodesArr //渲染使用
+    parent.value['childrenNodes'] = nodes.value //把当前节点数据，存入父节点的数据里。
+}
+
+const emit = defineEmits(['expandClick','nodeMouseover','nodeMouseout', 'nodeClick', 'nodeDblClick', 'menuClick'])
+
+//下级数据是否存在
+const isChildren = (item) => {
+    return !!(item.childNodes && item.childNodes.length > 0);
+}
+//是否显示展开和隐藏按钮
+const isExpanded = (item) => {
+    let ifChildren = isChildren(item);
+    if (isBoolean(item['expanded'])) {
+        let res = !!(item['expanded'] && ifChildren);
+        item['expanded'] = res;
+        return res;
+    } else {
+        item['expanded'] = false;
+        return false;
+    }
+}
+//处理展开和隐藏的样式
+const ifExpanded = (item) => {
+    let ifChildren = isChildren(item);
+    if (isBoolean(item['isExpand'])) {
+        let res = !!(item['isExpand'] && ifChildren);
+        item['isExpand'] = res;
+        return res;
+    } else {
+        item['isExpand'] = ifChildren;
+        return ifChildren;
+    }
+}
+//展开和隐藏按钮被点击
+const expandedClick = (item) => {
+    emit('expandClick', {
+        node: item,
+        data: item.data
+    })
+}
+const ChildrenExpandedClick = ({node,data}) => {
+    emit('expandClick', {node,data})
+}
+
+
+//鼠标左键单击事件
+const nodeLabelClick = (item) => {
+    emit('nodeClick', {
+        node: item,
+        data: item.data
+    })
+}
+const ChildrenNodeLabelClick = ({node,data}) => {
+    emit('nodeClick', {node,data})
+}
+
+//双击事件
+const nodeLabelDblClick = (item) => {
+    emit('nodeDblClick', {
+        node: item,
+        data: item.data
+    })
+}
+const ChildrenNodeLabelDblClick = ({node,data}) => {
+    emit('nodeDblClick', {node,data})
+}
+
+//鼠标右键事件
+const nodeLabelContextMenu = (e,item) => {
+    const rows = menusData.value || [];
+    if (rows.length > 0) {
+        e.preventDefault();
+        menuRefItem.value = item;
+        if (menuMark.value) {
+            setMenuMarkVal(rows, item)
+        }
+        nextTick().then(() => {
+            showDropdown.value = true;
+            x.value = e.clientX;
+            y.value = e.clientY;
+        });
+    }
+}
+
+//设置菜单标记状态
+const setMenuMarkVal = (rows,item) => {
+    for (let i = 0; i < rows.length; i++) {
+        if (rows[i].key === 'mark' || rows[i].key === 'cancel_mark') {
+            if (item?.data?.isFirst) {
+                menusData.value[i].label = '取消标记为首件';
+                menusData.value[i].key = 'cancel_mark';
+                menusData.value[i].icon = hIconJs({
+                    name: 'grade', fill: true
+                });
+            } else {
+                menusData.value[i].label = '标记为首件';
+                menusData.value[i].key = 'mark';
+                menusData.value[i].icon = hIconJs({name: 'grade'});
+            }
+            break;
+        }
+    }
+}
+
+const onClickoutside = () => {
+    menuRefItem.value = null;
+    showDropdown.value = false;
+}
+
+//鼠标右键菜单被点击
+const handleMenuSelect = (key) => {
+    const item = menuRefItem.value;
+    showDropdown.value = false;
+    emit('menuClick', {
+        key,
+        node: item,
+        data: item.data
+    })
+}
+
+//菜单被点击
+const ChildrenCpoverMenuClick = ({key,node,data}) => {
+    emit('menuClick', {key,node,data})
+}
+</script>
+
+<style lang="scss" scoped>
+@import "style";
+</style>

src/views/data-fill/components/nodeTree/index.vue

@@ -0,0 +1,221 @@
+<template>
+    <div class="cu-tree-node-container" @mousewheel.prevent="treeNodeMousewheel">
+        <div class="cu-tree-node-box horizontal collapsable" :id="'tree-node-' + uuid" @mousedown="treeNodeMouseDown" :style="{zoom: zoomRef + '%'}" v-if="!!nodes.label">
+            <div class="cu-tree-node-view">
+                <div class="cu-tree-node-label">
+                    <div class="cu-tree-node-label-text">
+                        <div class="cu-tree-node-label-name" :id="`node-tree-${nodes.key}`">
+                            <el-button type="primary" hc-btn :loading="nodes.loading">{{nodes.label}}</el-button>
+                        </div>
+                    </div>
+                </div>
+                <TreeNodeChildren :data="nodes.childNodes" :format="format" :menus="menus" :parentNodes="nodes" :isMark="isMark" :isColor="TreeIsColor"
+                                  @expandClick="expandClick" @nodeClick="nodeLabelClick" @nodeDblClick="nodeLabelDblClick" @menuClick="poverMenuClick"/>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import {watch,ref,onMounted} from "vue";
+import TreeNodeChildren from "./children.vue";
+import {isType,utilsRandom} from "vue-utils-plus"
+//初始变量
+const { isObject } = isType()
+const { getRandom } = utilsRandom()
+const props = defineProps({
+    data: {
+        type: Object,
+        default: () => ({})
+    },
+    format: {
+        type: Object,
+        default: () => ({
+            key: "key",
+            label: "label",
+            children: "children",
+        })
+    },
+    autoExpandKeys: {
+        type: Array,
+        default: () => ([])
+    },
+    menus: {
+        type: Array,
+        default: () => ([])
+    },
+    isMark: {
+        type: Boolean,
+        default: false
+    },
+    accordion: {
+        type: Boolean,
+        default: false
+    },
+    isColor: {
+        type: Boolean,
+        default: false
+    },
+})
+
+//初始数据
+const uuid = getRandom()
+const datas = ref(props.data)
+const nodes = ref({})
+const TreeExpandKey = ref(props.autoExpandKeys)
+const TreeIsColor = ref(props.isColor)
+
+//监听
+watch(() => [
+    props.data,
+    props.autoExpandKeys,
+    props.isColor,
+], ([val,expandKeys,isColor]) => {
+    TreeIsColor.value = isColor
+    if (isDataType(val)) {
+        datas.value = val
+        setDatasToNodes()
+    } else {
+        datas.value = {}
+        nodes.value = {}
+    }
+    TreeExpandKey.value = expandKeys
+    if (expandKeys?.length > 0) {
+        setTreeAutoExpandKey()
+    }
+})
+
+//渲染完成
+onMounted(()=> {
+    if (isDataType(props.data)) {
+        datas.value = props.data
+        setDatasToNodes()
+    } else {
+        datas.value = {}
+        nodes.value = {}
+    }
+    if (TreeExpandKey.value?.length > 0) {
+        setTreeAutoExpandKey()
+    }
+})
+
+//检查数据类型
+const isDataType = (data) => {
+    if (isObject(data)) {
+        return Object.keys(data).length !== 0;
+    } else {
+        return false
+    }
+}
+
+//处理为node节点类型的数据
+const setDatasToNodes = () => {
+    const {key,label,children} = props.format
+    const deepData = datas.value
+    let childNodes = deepData[children]
+    nodes.value = {
+        childNodes: childNodes,
+        childrenNodes: [],
+        data: deepData,
+        parentNodes: {},
+        expanded: deepData['expanded'] || false,
+        isExpand: deepData['isExpand'] || false,
+        isLeaf: deepData['isLeaf'] || false,
+        loading: deepData['loading'] || false,
+        key: deepData[key],
+        label: deepData[label]
+    }
+}
+
+//懒加载tree，自动展开上次记忆的节点
+const setTreeAutoExpandKey = () => {
+    const keys = TreeExpandKey.value || []
+    let num = 0, numMax = keys.length;
+    let timer = setInterval(() => {
+        if(num < numMax) {
+            document.getElementById(`node-tree-${keys[num]}`)?.click()
+            num++;
+        } else {
+            clearInterval(timer);
+        }
+    }, 800);
+}
+
+//放大缩小
+const zoomRef = ref(100)
+const treeNodeMousewheel = (event) => {
+    /* 获取当前页面的缩放比 若未设置zoom缩放比，则为默认100%，即1，原图大小 */
+    let zoom = parseInt(zoomRef.value + '') || 100
+    /* event.wheelDelta 获取滚轮滚动值并将滚动值叠加给缩放比zoom wheelDelta统一为±120，其中正数表示为向上滚动，负数表示向下滚动 */
+    zoom += event.wheelDelta / 12
+    /* 最小范围 和 最大范围 的图片缩放尺度 */
+    if (zoom >= 10 && zoom < 200) {
+        zoomRef.value = zoom
+    }
+    return false
+}
+
+const isDown = ref(false)
+const treeNodeMouseDown = (event) => {
+    // 阻止默认事件和冒泡
+    event.preventDefault()
+    event.stopPropagation()
+    //获取相关dom元素
+    let dom = document.getElementById('tree-node-' + uuid)
+    //获取x坐标和y坐标
+    let clientX = event.clientX, clientY = event.clientY;
+
+    //获取左部和顶部的偏移量
+    let offsetLeft = dom.offsetLeft, offsetTop = dom.offsetTop;
+    //开关打开
+    isDown.value = true;
+
+    //设置样式
+    dom.style.cursor = 'move';
+
+    document.onmousemove = (e) => {
+        if (isDown.value === false) {
+            return;
+        }
+        //获取x和y
+        let nx = e.clientX;
+        let ny = e.clientY;
+        //计算移动后的左偏移量和顶部的偏移量
+        let nl = nx - (clientX - offsetLeft);
+        let nt = ny - (clientY - offsetTop);
+
+        dom.style.left = nl + 'px';
+        dom.style.top = nt + 'px';
+    }
+    document.onmouseup = () => {
+        //开关关闭
+        isDown.value = false;
+        dom.style.cursor = 'default';
+        document.onmousemove = null;
+        document.onmouseup = null;
+    }
+}
+
+
+const emit = defineEmits(['expand', 'nodeClick', 'nodeDblClick','menuClick']);
+
+const expandClick = (item) => {
+    emit('expand', item)
+}
+//鼠标左键单击事件
+const nodeLabelClick = (item) => {
+    emit('nodeClick', item)
+}
+//双击事件
+const nodeLabelDblClick = (item) => {
+    emit('nodeDblClick', item)
+}
+//菜单被点击
+const poverMenuClick = (item) => {
+    emit('menuClick', item)
+}
+</script>
+
+<style lang="scss">
+@import "style";
+</style>

src/views/data-fill/components/nodeTree/style.scss

@@ -0,0 +1,210 @@
+.cu-tree-node-container {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    .cu-tree-node-box {
+        display: table;
+        text-align: center;
+        &:before, &:after {
+            content: '';
+            display: table;
+        }
+        &:after {
+            clear: both;
+        }
+        &.horizontal {
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            transform: translate(-50%, -50%);
+        }
+        .cu-tree-node-view, .cu-tree-node-children {
+            position: relative;
+            margin: 0;
+            padding: 0;
+            list-style-type: none;
+            &:before, &:after {
+                transition: all .35s;
+            }
+        }
+        .cu-tree-node-view {
+            padding-top: 40px;
+            display: table-cell;
+            vertical-align: top;
+            &.is-leaf, &.collapsed {
+                padding-left: 10px;
+                padding-right: 10px;
+            }
+            &:before, &:after {
+                content: '';
+                position: absolute;
+                top: 0;
+                left: 0;
+                width: 50%;
+                height: 40px;
+            }
+            &:after {
+                left: 50%;
+                border-left: 1.5px solid #999999;
+            }
+            &:not(:first-child):before,
+            &:not(:last-child):after {
+                border-top: 1.5px solid #999999;
+            }
+            .cu-tree-node-label {
+                position: relative;
+                display: inline-block;
+                z-index: 20;
+                .cu-tree-node-label-text {
+                    position: relative;
+                    text-align: center;
+                    .cu-tree-node-label-name {
+                        white-space: nowrap;
+                        &:before {
+                            content: "";
+                            display: block;
+                            background: inherit;
+                            filter: blur(5px);
+                            position: absolute;
+                            width: 100%;
+                            height: 100%;
+                            top: 0;
+                            left: 0;
+                            z-index: -1;
+                            opacity: var(--ui-Shadow-opacity-lg);
+                            transform-origin: 0 0;
+                            border-radius: inherit;
+                            transform: scale(1);
+                        }
+                        .el-button[hc-btn] {
+                            box-shadow: 4px 4px 8px 0 rgb(54 92 167 / 15%);
+                        }
+                    }
+                }
+            }
+        }
+        .cu-tree-node-label-btn {
+            position: absolute;
+            top: 100%;
+            left: 50%;
+            width: 20px;
+            height: 20px;
+            z-index: 10;
+            background-color: #ffffff;
+            border: 1px solid #999999;
+            border-radius: 50%;
+            box-shadow: 0 0 2px rgba(0, 0, 0, .15);
+            cursor: pointer;
+            transition: all .35s ease;
+            &:hover {
+                background-color: #e7e8e9;
+                transform: scale(1.15);
+            }
+            &:before, &:after {
+                content: '';
+                position: absolute;
+            }
+            &:before {
+                top: 50%;
+                left: 4px;
+                right: 4px;
+                height: 0;
+                border-top: 1px solid #999999;
+            }
+            &:after {
+                top: 4px;
+                left: 50%;
+                bottom: 4px;
+                width: 0;
+                border-left: 1px solid #999999;
+            }
+            &.expanded:after {
+                border: none;
+            }
+        }
+        .cu-tree-node-children {
+            padding-top: 40px;
+            display: table;
+            &:before {
+                content: '';
+                position: absolute;
+                top: 0;
+                left: 50%;
+                width: 0;
+                height: 40px;
+                border-left: 1.5px solid #999999;
+            }
+            &:after {
+                content: '';
+                display: table;
+                clear: both;
+            }
+        }
+        &.horizontal {
+            .cu-tree-node-view {
+                display: table-cell;
+                float: none;
+                padding-top: 0;
+                padding-left: 40px;
+                &.is-leaf {
+                    padding-top: 10px;
+                    padding-bottom: 10px;
+                }
+                &:before, &:after {
+                    width: 40px;
+                    height: 50%;
+                }
+                &:after {
+                    top: 50%;
+                    left: 0;
+                    border-left: 0;
+                }
+                &:only-child:before {
+                    top: 1px;
+                    border-bottom: 1.5px solid #999999;
+                }
+                &:not(:first-child):before,
+                &:not(:last-child):after {
+                    border-top: 0;
+                    border-left: 1.5px solid #999999;
+                }
+                &:not(:only-child):after {
+                    border-top: 1.5px solid #999999;
+                }
+            }
+            .cu-tree-node-label {
+                display: table-cell;
+                vertical-align: middle;
+            }
+            & > .cu-tree-node-view:only-child:before {
+                border-bottom: 0;
+            }
+            .cu-tree-node-children {
+                display: table-cell;
+                padding-top: 0;
+                padding-left: 40px;
+                &:before {
+                    top: 50%;
+                    left: 0;
+                    width: 40px;
+                    height: 0;
+                    border-left: 0;
+                    border-top: 1.5px solid #999999;
+                }
+                &:after {
+                    display: none;
+                }
+                & > .cu-tree-node-view {
+                    display: block;
+                }
+            }
+            .cu-tree-node-label-btn {
+                top: 50%;
+                left: 100%;
+                margin-top: -10.1px;
+                margin-left: 10px;
+            }
+        }
+    }
+}

src/views/data-fill/wbs.vue

@@ -68,13 +68,14 @@
 import {ref,watch,nextTick,onMounted} from "vue";
 import {useRoute} from 'vue-router'
 import router from '~src/router/index';
+import website from '~src/config/index'
 import {useAppStore} from "~src/store/index";
 import {hIconJs} from "~src/plugins/renderele";
 import HcTabs from "~com/plugins/naive/HcTabs.vue"
 import HcTree from "~com/plugins/element/HcTree.vue"
 import BtnTab from "~com/btnTab/index.vue"
 import ListItem from "~com/data-fill/ListItem.vue"
-import NodeTree from "~com/data-fill/nodeTree/index.vue"
+import NodeTree from "./components/nodeTree/index.vue"
 import DragModal from "~com/dragModal/index.vue"
 import ImgPreview from "~com/imgPreview/index.vue"
 import HcReportModal from "~com/reportModal/index.vue"
@@ -84,12 +85,16 @@ import wbsApi from "~api/data-fill/wbs"
 import {deepClone} from "~src/utils/lib/util";
 import {getTokenHeader} from '~src/api/request/header';
 import {isArray,isObjNull} from "~src/utils/lib/isApp";
-import {setStore,getStore} from "~src/utils/lib/storage";
+//import {setStore,getStore} from "~src/utils/lib/storage";
+import {utilsStore} from "vue-utils-plus"
 import Draggable from "vuedraggable";
 
-//变量
+//初始变量
 const useRoutes = useRoute()
 const useAppState = useAppStore()
+const {getStoreData, setStoreData} = utilsStore(website.key)
+
+//全局变量
 const projectId = ref(useAppState.getProjectId);
 const contractId = ref(useAppState.getContractId);
 const projectInfo = ref(useAppState.getProjectInfo);
@@ -99,11 +104,10 @@ const bubbleVal = ref(useAppState.getBubble);
 
 //路由参数
 const routerQuery = useRoutes?.query;
-const MenuBarKey = routerQuery?.MenuBarKey || '';
 const typeName = routerQuery?.type || 'map'
 
 //自动展开缓存
-const TreeAutoExpandKeys = ref(getStore({name: 'wbsTreeExpandKeys'}) || [])
+const TreeAutoExpandKeys = ref(getStoreData('wbsTreeExpandKeys') || [])
 
 //监听
 watch(() => [
@@ -122,6 +126,7 @@ watch(() => [
     isCollapse.value = Collapse
     setContractType(UserContractInfo?.contractType)
 })
+
 //获取气泡数据
 const getButtonsVal = (value) => {
     return useAppState.getButtonsVal(value)
@@ -240,10 +245,12 @@ const treeParams = ref({contractId: contractId.value})
 const wbsElTreeClick = ({node, data, keys}) => {
     nodeItemInfo.value = node
     nodeDataInfo.value = data
-    setStore({name: 'wbsTreeExpandKeys', content: keys})
+    console.log(keys)
+    setStoreData('wbsTreeExpandKeys',keys)
     searchNodeAllTable()
 }
 
+
 //导图结构数据
 const NodeTreeRef = ref(null)
 const NodeTreeFormat = ref({key: "primaryKeyId", label: "title", children: "children"})