Przeglądaj źródła

节点划分树添加搜索框

duy 2 tygodni temu
rodzic
commit
9c5184099a

+ 8 - 0
src/api/modules/data-fill/wbs.js

@@ -595,4 +595,12 @@ export default {
             data: form,
         })
     },
+    //搜索
+    async getQueryValueByType(form) {
+        return HcApi({
+            url: '/api/blade-manager/wbsTree/getQueryValueByType',
+            method: 'get',
+            params: form,
+        })
+    },
 }

+ 97 - 6
src/views/data-fill/components/divisionDialog.vue

@@ -1,6 +1,30 @@
 <!-- 节点划分 -->
 <template>
-    <hc-new-dialog v-model="linkModal" is-table title="节点划分" widths="1200px" @close="closeModal">
+    <hc-new-dialog v-model="linkModal" is-table widths="1200px" @close="closeModal">
+        <template #header>
+            <div class="flex justify-between">
+                <div class="text-lg">节点划分</div>
+                <div class="w-100 flex">
+                    <el-input
+                        v-model="searchTreeVal"
+                        clearable
+                        block
+                        placeholder="请输入名称关键词检索"
+                        @keyup="searchTreeKeyUp"
+                        @clear="searchTreeClick"
+                    >
+                        <template #suffix>
+                            <HcIcon
+                                name="search-2"
+                                ui="text-xl iscusor"
+                                @click="searchTreeClick"
+                            />
+                        </template>
+                    </el-input>
+                    <el-button type="primary" class="ml-2" @click="searchTreeClick">搜索</el-button>
+                </div>
+            </div>
+        </template>
         <div class="link-data-box">
             <div class="link-data-left">
                 <div class="relative h-full flex">
@@ -8,13 +32,14 @@
                         <hc-body scrollbar padding="0px">
                             <HcLazyTree
                                 ref="leftTree"
-                                tree-key="id"
+                             
                                 show-checkbox 
                                 is-type
                                 check-strictly
                                 :h-props="leftTreeProps"
                                 :is-color="false"
                                 :accordion="false"
+                                :auto-expand-keys="treeAutoExpandKeys"
                                 @check="leftTreeNodeCheckChange"
                                 @load="treeLoadNode"
                                 @node-loading="treeNodeLoading"
@@ -28,9 +53,10 @@
             </div>
             <div class="link-data-right">
                 <div class="relative h-full flex">
-                    <div v-loading="treeLoading" class="hc_tree_card_border relative w-full">
+                    <div v-loading="treeLoadingData" class="hc_tree_card_border relative w-full">
                         <hc-body scrollbar padding="0px">
                             <HcLazyTree
+                                v-if="!isSearchTree"
                                 ref="rightTree"
                                 v-model:loading="isLoading"
                                 tree-key="id"
@@ -60,6 +86,15 @@
                                     </div>
                                 </template>
                             </HcLazyTree>
+                            <HcDataTree
+                                v-if="isSearchTree"
+                                :datas="searchTreeData"
+                                is-counts
+                                is-type
+                                :auto-expand-keys="treeAutoExpandKeys"
+                                default-expand-all
+                                @node-tap="wbsElTreeClick"
+                            />
                         </hc-body>
                     </div>
                 </div>
@@ -104,7 +139,7 @@ const props = defineProps({
   
     classifyType:{
         type: String,
-        default: 1,
+        default: '1',
     },
     treeItemInfo:{
         type: Object,
@@ -114,6 +149,10 @@ const props = defineProps({
         type: Object,
         default: () => ({}),
     },
+    autoExpandKeys: {
+        type: Array,
+        default: () => [],
+    },
 })
 //事件
 const emit = defineEmits(['close', 'save'])
@@ -124,7 +163,7 @@ const projectId = ref(useAppState.getProjectId)
 const treeItemInfo = ref(props.treeItemInfo)
 const classifyType = ref(props.classifyType)
 const firstTree = ref(props.firstTree)
-
+const treeAutoExpandKeys = ref(props.autoExpandKeys)
 const linkModal = defineModel('modelValue', {
     default: false,
 })
@@ -185,11 +224,16 @@ props.linkModal,
 props.classifyType,
 props.treeItemInfo,
 props.firstTree,
-], ([link, type, treeItemIn, first]) => {
+props.autoExpandKeys,
+], ([link, type, treeItemIn, first, keys]) => {
     linkModal.value = link
     classifyType.value = type
     treeItemInfo.value = treeItemIn
     firstTree.value = first
+    treeAutoExpandKeys.value = keys
+    console.log(keys, 'keys')
+    
+
 }, { immediate: true })
 
 //选中的节点
@@ -351,6 +395,53 @@ const rightObj = ref(null)
 const rightElTreeClick = ({ data }) => {
     rightObj.value = data   
 }
+//搜索右边的节点树
+const searchTreeVal = ref('')
+
+
+const searchTreeData = ref([])
+const isSearchTree = ref(false)
+
+//回车
+const treeLoadingData = ref(false)
+const getSearchTreeData = async () => {
+    treeLoadingData.value = true
+    const { error, code, data } = await wbsApi.getQueryValueByType({
+        contractId: contractId.value,
+        queryValue: searchTreeVal.value,
+        projectId:projectId.value,
+        type:1,
+        wbsId:firstTree.value?.wbsId,
+    })
+    //判断状态
+    if (!error && code === 200) {
+        let treedata = getArrValue(data)
+        searchTreeData.value = treedata
+        treeLoadingData.value = false
+
+    } else {
+        treeLoadingData.value = false
+
+        searchTreeData.value = []
+    }
+
+}
+const searchTreeKeyUp = (e) => {
+    if (e.key === 'Enter') {
+        searchTreeClick()
+    }
+}
+
+const searchTreeClick = async () => {
+    if (searchTreeVal.value) {
+      
+        isSearchTree.value = true
+        //treeLoading.value = true
+        getSearchTreeData().then()
+    } else {
+        isSearchTree.value = false
+    }
+}
 </script>
 
 <style lang='scss' scoped>

+ 1 - 0
src/views/data-fill/division.vue

@@ -1121,6 +1121,7 @@
             :classify-type="classifyType"
             :tree-item-info="treeItemInfo"
             :first-tree="firstTree"
+            :auto-expand-keys="treeAutoExpandKeys"
             @save="divisionSaveClick"
         />
         <!-- 节点命名配置 -->