merge

dsk-operate-ui/src/views/projectCostLedger/detail/components/FeedSummary/index.vue

@@ -2,7 +2,7 @@
   <div class="feed-summary-container">
     <div class="feed-summary-inner">
       <div class="left-side-menu">
-        <project-side-menu :menuTree="menuTreeList"></project-side-menu>
+        <project-side-menu :menuTree="menuTreeList" :unique-opened="false" :default-active="defaultActive"></project-side-menu>
       </div>
     </div>
   </div>
@@ -16,6 +16,7 @@ export default {
   },
   data() {
     return {
+      defaultActive: "",
       menuTreeList: [
         {
           nodeName: "房建类成本科目",

dsk-operate-ui/src/views/projectCostLedger/detail/components/ProjectSideMenu/ProjectMenuItem.vue

 <template>
   <div class="project-menu-item-container">
+    <template>
+      <!-- 有下级菜单 -->
+      <template v-if="checkHasChidren">
+        <el-submenu :index="menuItem.nodeValue" ref="projectSubMenuItem" class="project-sub-menu-item">
+          <template slot="title">
+            <i class="el-icon-location"></i>
+            <span>111</span>
+          </template>
+        </el-submenu>
+      </template>
+      <template v-else>
 
+      </template>
+    </template>
   </div>
 </template>
 <script>
 export default {
-   name : "projectMenuItem",
+  name: "projectMenuItem",
+  props: {
+    menuItem: {
+      type: Object,
+      required: true,
+      default: () => ({})
+    }
+  },
   data() {
     return {
 
-      }
+    };
   },
   //可访问data属性
-   created(){
+  created() {
 
   },
   //计算集
-   computed:{
-
+  computed: {
+    checkHasChidren() {
+      return !!(this.menuItem && this.menuItem?.children && this.menuItem.children.length);
+    }
   },
   //方法集
-   methods:{
+  methods: {
 
   },
 }
 </script>
 <style lang="scss" scoped>
 .project-menu-item-container {
-  
 }
 </style>

dsk-operate-ui/src/views/projectCostLedger/detail/components/ProjectSideMenu/index.vue

 <template>
   <div class="project-side-menu-container">
-    <el-menu mode="vertical" class="project-side-menu-instance">
+    <el-menu mode="vertical" class="project-side-menu-instance" :unique-opened="uniqueOpened" :default-active="defaultActive" @select="menuSelect"
+      @open="subMenuOpen" @close="subMenuClose">
       <template v-for="(item,index) of tempMenuTree">
         <project-menu-item :menuItem="item" :key="item.nodeValue"></project-menu-item>
       </template>
@@ -31,6 +32,16 @@ export default {
         icon: "icon",
         suffixIcon: "suffixIcon"
       })
+    },
+    // 只保持打开一个菜单
+    uniqueOpened: {
+      type: Boolean,
+      default: false
+    },
+    // 默认打开的菜单
+    defaultActive: {
+      type: String,
+      default: ""
     }
   },
   watch: {
@@ -69,6 +80,16 @@ export default {
   },
   //方法集
   methods: {
+    // 事件订阅
+    subMenuOpen(menuPath) {
+      this.$emit("open", menuPath);
+    },
+    subMenuClose(menuPath) {
+      this.$emit("close", menuPath);
+    },
+    menuSelect(menuPath) {
+      this.$emit("select", menuPath);
+    },
     // 初始化树形结构
     initMenuTree(array = []) {
       if (array?.length) {
@@ -162,7 +183,8 @@ export default {
     overflow: auto;
 
     /* 重置一级二级菜单 高度行高 */
-    /* .el-submenu__title {
+    .project-sub-menu-item {
+      & > .el-submenu__title {
         height: 32px;
         line-height: 32px;
 
@@ -174,7 +196,8 @@ export default {
             rgba(0, 129, 255, 0) 100%
           );
         }
-    } */
+      }
+    }
   }
 }
 </style>