From f2d1b5615b05c002ec63db4df7164c9ed3ecc4a3 Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期二, 26 八月 2025 16:42:21 +0800
Subject: [PATCH] 1、优化产品结构树以及设备结构树、列表右键菜单重复右键后出现window菜单问题 2、优化产品结构树节点删除后的loading展示时机 3、优化产品以及设备结构树权限配置获取列表时的loading展示时机

---
 src/views/dnc/base/modules/ProductStructure/ProductStructureTreeContextMenu.vue |  324 ++++++++++++++++++++++++++----------------------------
 1 files changed, 156 insertions(+), 168 deletions(-)

diff --git a/src/views/dnc/base/modules/ProductStructure/ProductStructureTreeContextMenu.vue b/src/views/dnc/base/modules/ProductStructure/ProductStructureTreeContextMenu.vue
index 283f48b..a38332e 100644
--- a/src/views/dnc/base/modules/ProductStructure/ProductStructureTreeContextMenu.vue
+++ b/src/views/dnc/base/modules/ProductStructure/ProductStructureTreeContextMenu.vue
@@ -1,183 +1,171 @@
 <template>
-  <a-dropdown :trigger="['contextmenu']">
-    <span v-if="treeParams.label.indexOf(treeParams.searchValue) > -1">{{
-        treeParams.label.substr(0, treeParams.label.indexOf(treeParams.searchValue))
-      }}<span
-        class="replaceSearch">{{
-          treeParams.searchValue
-        }}</span>{{
-        treeParams.label.substr(treeParams.label.indexOf(treeParams.searchValue) + treeParams.searchValue.length)
-      }}</span>
-    <span v-else>{{ treeParams.label }}</span>
-    <template #overlay>
-      <a-menu @click="({ key: menuKey }) => onContextMenuClick(treeParams.treeKey, menuKey)"
-              @contextmenu="event=>event.preventDefault()">
-        <a-menu-item v-for="item in defaultContextMenuList[getCurrentMenuLevel]" :key="item.code" v-has="item.code">
-          <a-icon :type="item.icon"/>
-          {{ item.label }}
-        </a-menu-item>
-      </a-menu>
+  <a-menu :style="menuStyle" @click="menuItemClick" v-if="menuVisible" mode="vertical" @contextmenu="menuContextMenu">
+    <template v-for="menuItem in defaultContextMenuList[getCurrentMenuLevel]">
+      <a-menu-item :key="menuItem.code" v-has="menuItem.code">
+        <a-icon :type="menuItem.icon"/>
+        {{ menuItem.label }}
+      </a-menu-item>
     </template>
-  </a-dropdown>
+  </a-menu>
 </template>
 
 <script>
-export default {
-  name: 'ProductStructureTreeContextMenu',
-  components: {},
-  props: {
-    treeParams: {
-      type: Object
-    }
-  },
-  data() {
-    return {
-      defaultContextMenuList: {
-        //浜у搧
-        product: [
-          { label: '娣诲姞浜у搧', code: 'product_add', icon: 'plus', isCommonMethod: false },
-          { label: '娣诲姞閮ㄤ欢', code: 'product_add_child', icon: 'plus', isCommonMethod: false },
-          { label: '缂栬緫浜у搧淇℃伅', code: 'product_edit', icon: 'edit', isCommonMethod: false },
-          // {  label: '瀵煎嚭鏂囨。', code: 'product_export', icon: 'export', isCommonMethod: true },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'product_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'product_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'product_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '鍒犻櫎', code: 'product_delete', icon: 'delete', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
-        ],
-        //閮ㄤ欢
-        component: [
-          { label: '娣诲姞瀛愰儴浠�', code: 'component_add', icon: 'plus', isCommonMethod: false },
-          { label: '娣诲姞闆朵欢', code: 'component_add_child', icon: 'plus', isCommonMethod: false },
-          { label: '鍒涘缓宸ュ簭', code: 'component_add_relative', icon: 'plus', isCommonMethod: false },
-          { label: '缂栬緫閮ㄤ欢淇℃伅', code: 'component_edit', icon: 'edit', isCommonMethod: false },
-          // {  label: '瀵煎嚭鏂囨。', code: 'component_export', icon: 'export', isCommonMethod: true },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'component_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'component_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'component_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '寮曠敤閮ㄤ欢',code: 'component_borrow',icon: 'plus',isCommonMethod: false},
-          { label: '鍒犻櫎', code: 'component_delete', icon: 'delete', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
-        ],
-        //闆朵欢
-        part: [
-          { label: '娣诲姞闆朵欢', code: 'parts_add', icon: 'plus', isCommonMethod: false },
-          { label: '鍒涘缓宸ヨ壓瑙勭▼鐗堟湰', code: 'parts_add_relative', icon: 'plus', isCommonMethod: false },
-          // { label: '鍒涘缓宸ュ簭', code: 'parts_add_relative', icon: 'plus', isCommonMethod: false },
-          { label: '缂栬緫闆朵欢淇℃伅', code: 'parts_edit', icon: 'edit', isCommonMethod: false },
-          // {  label: '瀵煎嚭鏂囨。', code: 'parts_export', icon: 'export', isCommonMethod: true },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'parts_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'parts_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'parts_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '鍒犻櫎', code: 'parts_delete', icon: 'delete', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
-        ],
-        //宸ヨ壓瑙勭▼鐗堟湰
-        processSpecVersion: [
-          { label: '鍒涘缓宸ヨ壓瑙勭▼鐗堟湰', code: 'version_add', icon: 'plus', isCommonMethod: false },
-          { label: '鍒涘缓宸ュ簭', code: 'version_add_child', icon: 'plus', isCommonMethod: false },
-          { label: '缂栬緫宸ヨ壓瑙勭▼鐗堟湰淇℃伅', code: 'version_edit', icon: 'edit', isCommonMethod: false },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'version_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'version_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'version_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '鍒犻櫎', code: 'version_delete', icon: 'delete', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
-        ],
-        //宸ュ簭
-        process: [
-          { label: '鍒涘缓宸ュ簭', code: 'process_add', icon: 'plus', isCommonMethod: false },
-          { label: '鍒涘缓宸ユ', code: 'process_add_child', icon: 'plus', isCommonMethod: false },
-          { label: '娣诲姞璁惧绫�', code: 'process_add_type', icon: 'plus', isCommonMethod: true },
-          { label: '缂栬緫宸ュ簭淇℃伅', code: 'process_edit', icon: 'edit', isCommonMethod: false },
-          { label: '鍒犻櫎', code: 'process_delete', icon: 'delete', isCommonMethod: true },
-          // {  label: '瀵煎嚭NC绋嬪簭', code: 'process_export', icon: 'export', isCommonMethod: true },
-          { label: '瀵煎叆NC绋嬪簭', code: 'process_nc_import', icon: 'import', isCommonMethod: true },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'process_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'process_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'process_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true },
-          { label: '鍙戦�乶c绋嬪簭鑷充笁缁村伐鑹�', code: 'process_send_nc_to_plm', icon: 'import', isCommonMethod: true }
-        ],
-        //宸ユ
-        processStep: [
-          { label: '鍒涘缓宸ユ', code: 'processStep_add', icon: 'plus', isCommonMethod: false },
-          { label: '缂栬緫宸ユ淇℃伅', code: 'processStep_edit', icon: 'edit', isCommonMethod: false },
-          { label: '娣诲姞璁惧绫�', code: 'processStep_add_type', icon: 'plus', isCommonMethod: true },
-          { label: '鍒犻櫎', code: 'processStep_delete', icon: 'delete', isCommonMethod: true },
-          // {  label: '瀵煎嚭NC绋嬪簭', code: 'processStep_export', icon: 'import', isCommonMethod: true },
-          { label: '瀵煎叆NC绋嬪簭', code: 'processStep_nc_import', icon: 'import', isCommonMethod: true },
-          { label: '瀵煎叆鍏朵粬鏂囨。', code: 'processStep_other_import', icon: 'import', isCommonMethod: true },
-          { label: '妫�绱㈢數瀛愭牱鏉�', code: 'processStep_search', icon: 'search', isCommonMethod: true },
-          { label: '妫�绱C鏂囦欢', code: 'processStep_search_nc', icon: 'search', isCommonMethod: true },
-          { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true },
-          { label: '鍙戦�乶c绋嬪簭鑷充笁缁村伐鑹�', code: 'processStep_send_nc_to_plm', icon: 'import', isCommonMethod: true }
-        ]
-      }
-    }
-  },
-  computed: {
-    getCurrentMenuLevel() {
-      switch (+this.treeParams.type) {
-        case 1:
-          return 'product'
-        case 2:
-          return 'component'
-        case 3:
-          return 'part'
-        case 4:
-          return 'processSpecVersion'
-        case 5:
-          return 'process'
-        case 6:
-          return 'processStep'
+  export default {
+    name: 'ProductStructureTreeContextMenu',
+    components: {},
+    props: {
+      treeParams: {
+        type: Object
       }
     },
-    // getCurrentDocClassCode() {
-    //   switch (+this.treeParams.type) {
-    //     case 1:
-    //       return 'OTHER'
-    //     case 2:
-    //       return 'OTHER'
-    //     case 3:
-    //       return 'OTHER'
-    //     case 4:
-    //       return 'OTHER'
-    //     case 5:
-    //       return 'NC'
-    //     case 6:
-    //       return 'NC'
-    //   }
-    // }
-  },
-  methods: {
-    onContextMenuClick(treeKey, menuKey) {
-      const level = this.getCurrentMenuLevel
-      console.log('level---------------------', level)
-      const treeNodeInfo = Object.assign({}, this.treeParams)
-      console.log('treeNodeInfo******************', treeNodeInfo)
-      const menuKeyArray = menuKey.split('_')
-      const isCommonMethod = this.defaultContextMenuList[level].find(item => item.code === menuKey).isCommonMethod
-      // product_add => handleAdd 瑙﹀彂瀵瑰簲缁勪欢浜嬩欢
-      let methodName
-      // 鍒ゆ柇鏄惁涓哄叕鍏辨柟娉曪紝濡傛灉涓哄叕鍏辨柟娉曞垯鎴彇涓撴湁灞炴�roduct/component/part/process绛夊瓧娈�
-      if (isCommonMethod) {
-        methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).slice(1).join('')
-      } else {
-        methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).join('')
+    data() {
+      return {
+        menuVisible: false,
+        menuStyle: {
+          position: 'fixed',
+          top: 0,
+          left: 0,
+          border: '1px solid #eee',
+          boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
+          zIndex: 999
+        },
+        defaultContextMenuList: {
+          //浜у搧
+          product: [
+            { label: '娣诲姞浜у搧', code: 'product_add', icon: 'plus', isCommonMethod: false },
+            { label: '娣诲姞閮ㄤ欢', code: 'product_add_child', icon: 'plus', isCommonMethod: false },
+            { label: '缂栬緫浜у搧淇℃伅', code: 'product_edit', icon: 'edit', isCommonMethod: false },
+            // {  label: '瀵煎嚭鏂囨。', code: 'product_export', icon: 'export', isCommonMethod: true },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'product_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'product_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'product_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '鍒犻櫎', code: 'product_delete', icon: 'delete', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
+          ],
+          //閮ㄤ欢
+          component: [
+            { label: '娣诲姞瀛愰儴浠�', code: 'component_add', icon: 'plus', isCommonMethod: false },
+            { label: '娣诲姞闆朵欢', code: 'component_add_child', icon: 'plus', isCommonMethod: false },
+            { label: '鍒涘缓宸ュ簭', code: 'component_add_relative', icon: 'plus', isCommonMethod: false },
+            { label: '缂栬緫閮ㄤ欢淇℃伅', code: 'component_edit', icon: 'edit', isCommonMethod: false },
+            // {  label: '瀵煎嚭鏂囨。', code: 'component_export', icon: 'export', isCommonMethod: true },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'component_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'component_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'component_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '寮曠敤閮ㄤ欢', code: 'component_borrow', icon: 'plus', isCommonMethod: false },
+            { label: '鍒犻櫎', code: 'component_delete', icon: 'delete', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
+          ],
+          //闆朵欢
+          part: [
+            { label: '娣诲姞闆朵欢', code: 'parts_add', icon: 'plus', isCommonMethod: false },
+            { label: '鍒涘缓宸ヨ壓瑙勭▼鐗堟湰', code: 'parts_add_relative', icon: 'plus', isCommonMethod: false },
+            // { label: '鍒涘缓宸ュ簭', code: 'parts_add_relative', icon: 'plus', isCommonMethod: false },
+            { label: '缂栬緫闆朵欢淇℃伅', code: 'parts_edit', icon: 'edit', isCommonMethod: false },
+            // {  label: '瀵煎嚭鏂囨。', code: 'parts_export', icon: 'export', isCommonMethod: true },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'parts_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'parts_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'parts_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '鍒犻櫎', code: 'parts_delete', icon: 'delete', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
+          ],
+          //宸ヨ壓瑙勭▼鐗堟湰
+          processSpecVersion: [
+            { label: '鍒涘缓宸ヨ壓瑙勭▼鐗堟湰', code: 'version_add', icon: 'plus', isCommonMethod: false },
+            { label: '鍒涘缓宸ュ簭', code: 'version_add_child', icon: 'plus', isCommonMethod: false },
+            { label: '缂栬緫宸ヨ壓瑙勭▼鐗堟湰淇℃伅', code: 'version_edit', icon: 'edit', isCommonMethod: false },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'version_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'version_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'version_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '鍒犻櫎', code: 'version_delete', icon: 'delete', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true }
+          ],
+          //宸ュ簭
+          process: [
+            { label: '鍒涘缓宸ュ簭', code: 'process_add', icon: 'plus', isCommonMethod: false },
+            { label: '鍒涘缓宸ユ', code: 'process_add_child', icon: 'plus', isCommonMethod: false },
+            { label: '娣诲姞璁惧绫�', code: 'process_add_type', icon: 'plus', isCommonMethod: true },
+            { label: '缂栬緫宸ュ簭淇℃伅', code: 'process_edit', icon: 'edit', isCommonMethod: false },
+            { label: '鍒犻櫎', code: 'process_delete', icon: 'delete', isCommonMethod: true },
+            // {  label: '瀵煎嚭NC绋嬪簭', code: 'process_export', icon: 'export', isCommonMethod: true },
+            { label: '瀵煎叆NC绋嬪簭', code: 'process_nc_import', icon: 'import', isCommonMethod: true },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'process_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'process_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'process_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true },
+            { label: '鍙戦�乶c绋嬪簭鑷充笁缁村伐鑹�', code: 'process_send_nc_to_plm', icon: 'import', isCommonMethod: true }
+          ],
+          //宸ユ
+          processStep: [
+            { label: '鍒涘缓宸ユ', code: 'processStep_add', icon: 'plus', isCommonMethod: false },
+            { label: '缂栬緫宸ユ淇℃伅', code: 'processStep_edit', icon: 'edit', isCommonMethod: false },
+            { label: '娣诲姞璁惧绫�', code: 'processStep_add_type', icon: 'plus', isCommonMethod: true },
+            { label: '鍒犻櫎', code: 'processStep_delete', icon: 'delete', isCommonMethod: true },
+            // {  label: '瀵煎嚭NC绋嬪簭', code: 'processStep_export', icon: 'import', isCommonMethod: true },
+            { label: '瀵煎叆NC绋嬪簭', code: 'processStep_nc_import', icon: 'import', isCommonMethod: true },
+            { label: '瀵煎叆鍏朵粬鏂囨。', code: 'processStep_other_import', icon: 'import', isCommonMethod: true },
+            { label: '妫�绱㈢數瀛愭牱鏉�', code: 'processStep_search', icon: 'search', isCommonMethod: true },
+            { label: '妫�绱C鏂囦欢', code: 'processStep_search_nc', icon: 'search', isCommonMethod: true },
+            { label: '鏉冮檺閰嶇疆', code: 'public_assign_permission', icon: 'idcard', isCommonMethod: true },
+            { label: '鍙戦�乶c绋嬪簭鑷充笁缁村伐鑹�', code: 'processStep_send_nc_to_plm', icon: 'import', isCommonMethod: true }
+          ]
+        }
       }
-      console.log('methodName', methodName)
-      const modalTitle = this.defaultContextMenuList[level].find(item => item.code === menuKey).label
-      this.$bus.$emit('treeMenuItemMethodTrigger', { methodName, modalTitle, treeNodeInfo })
+    },
+    computed: {
+      getCurrentMenuLevel() {
+        switch (+this.treeParams.type) {
+          case 1:
+            return 'product'
+          case 2:
+            return 'component'
+          case 3:
+            return 'part'
+          case 4:
+            return 'processSpecVersion'
+          case 5:
+            return 'process'
+          case 6:
+            return 'processStep'
+        }
+      }
+    },
+    methods: {
+      menuItemClick({ key }) {
+        const menuKey = key
+        const level = this.getCurrentMenuLevel
+        const treeNodeInfo = Object.assign({ treeKey: this.treeParams.key }, this.treeParams)
+        console.log('treeNodeInfo', treeNodeInfo)
+        const menuKeyArray = menuKey.split('_')
+        const isCommonMethod = this.defaultContextMenuList[level].find(item => item.code === menuKey).isCommonMethod
+        // product_add => handleAdd 瑙﹀彂瀵瑰簲缁勪欢浜嬩欢
+        let methodName
+        // 鍒ゆ柇鏄惁涓哄叕鍏辨柟娉曪紝濡傛灉涓哄叕鍏辨柟娉曞垯鎴彇涓撴湁灞炴�roduct/component/part/process绛夊瓧娈�
+        if (isCommonMethod) {
+          methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).slice(1).join('')
+        } else {
+          methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).join('')
+        }
+        const modalTitle = this.defaultContextMenuList[level].find(item => item.code === menuKey).label
+        this.$bus.$emit('treeMenuItemMethodTrigger', { methodName, modalTitle, treeNodeInfo })
+      },
+
+      /**
+       * 閬垮厤鍗曟閲嶅鍙抽敭鍚庡叧闂彍鍗曟垨鎵撳紑window鑿滃崟
+       * @param event 浜嬩欢瀵硅薄
+       */
+      menuContextMenu(event) {
+        event.preventDefault()
+        event.stopPropagation()
+      }
     }
   }
-}
 </script>
 
 <style scoped>
-.replaceSearch {
-  color: #40a9ff;
-  font-weight: bold;
-  background-color: rgb(204, 204, 204);
-}
+  /deep/ .ant-menu-item {
+    height: 32px;
+    line-height: 32px;
+  }
 
 </style>
\ No newline at end of file

--
Gitblit v1.9.3