Merge branch 'anhui-mall-ui-test' of http://192.168.30.2:3000/bonus/bonus-ui into anhui-mall-ui-test

src/layout/components/Navbar.vue

@@ -47,7 +47,7 @@
             />
           </div>
 
-          <div class="right-menu-item hover-effect bar-item">
+          <div class="right-menu-item hover-effect bar-item" @click="goCollection">
             <span class="bar-text">收藏</span>
           </div>
 
@@ -325,7 +325,48 @@
         </div>
       </div>
     </div>
+    <!-- 收藏菜单 -->
+    <el-drawer :withHeader="false" size="20%" :show-close="false" :visible.sync="drawerShow" :direction="rtl" class="custom-drawer">
+      <div class="myCollect-box">
+        <div class="myCollect-box-title">
+          <div style="font-size: 20px;color: #333943;font-weight: 600;">我的收藏</div>
+          <div style="color: #666;cursor: pointer;font-size: 16px;" v-if="!isEdit" @click="isEdit=true">编辑</div>
+          <div style="color: #33c2ac;cursor: pointer;font-size: 16px;font-weight: 600;" v-if="isEdit" @click="isEdit=false">确定</div>
+        </div>
+        <div class="myCollect-box-zhineng">
+          <div class="myCollect-box-zhineng-title">职能菜单</div>
+          <div style="width: 100%;overflow-y: auto;max-height: 340px;">
+            <div v-for="(item,index) in zhinengList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover==index }" @mouseover="isHover=index" @mouseleave="isHover = -1">
+              <div style="display: flex;align-items: center;" @click="gotoPage(item)"><img src="../../assets/images/catchIcon.png" style="width: 16px;height: 16px;margin-right: 5px;" alt=""> <span>{{ item.name }}</span> </div>
+              <div style="color: #33c2ac;" v-show="isEdit==true">取消</div>
+            </div>
+            <div style="width: 100%;display: flex;align-items: center;justify-content: center;" v-if="zhinengList.length==0">
+              <div>
+                <img src="../../assets/images/noData.png" style="width: 170px;height: 170px;" alt="">
+                <div style="width: 100%;text-align: center;font-size: 18px;color: #999;">暂无数据</div>
+              </div> 
+            </div>
+          </div>
+        </div>
+        <div class="myCollect-box-zhineng">
+          <div class="myCollect-box-zhineng-title">项目菜单</div>
+          <div style="width: 100%;overflow-y: auto;max-height: 340px;">
+            <div v-for="(item,index) in xiangmuList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover2==index }" @mouseover="isHover2=index" @mouseleave="isHover2 = -1">
+              <div style="display: flex;align-items: center;"><img src="../../assets/images/catchIcon.png" style="width: 16px;height: 16px;margin-right: 5px;" alt=""> <span>{{ item.name }}</span> </div>
+              <div style="color: #33c2ac;" v-show="isEdit==true">取消</div>
+            </div>
+            <div style="width: 100%;display: flex;align-items: center;justify-content: center;" v-if="xiangmuList.length==0">
+              <div>
+                <img src="../../assets/images/noData.png" style="width: 170px;height: 170px;" alt="">
+                <div style="width: 100%;text-align: center;font-size: 18px;color: #999;">暂无数据</div>
+              </div> 
+            </div>
+          </div>
+        </div>
 
+      </div> 
+    </el-drawer>
+    
     <el-dialog
       :visible.sync="contactDialogVisible"
       width="400px"
@@ -358,6 +399,7 @@
 import { mapGetters } from 'vuex'
 import Search from '@/components/HeaderSearch'
 import { getUserProfile } from '@/api/system/user'
+import { color } from 'echarts';
 
 export default {
   components: { Search },
@@ -410,8 +452,14 @@ export default {
           desc: '您有5条待办事项未处理，预计截止时间2026-01-30',
         },
       ],
-      contactDialogVisible: false, // 控制联系我们弹窗显示
+      contactDialogVisible: false,  // 控制联系我们弹窗显示
       contactPhone: '田经理15212781264，刘经理19855530627', // 联系电话
+      drawerShow:false,
+      isEdit:false,
+      isHover:-1,
+      isHover2:-1,
+      zhinengList:[{name:"入库申请",url:'/all/stockManagement/entryApply'},{name:"出库申请",url:'/all/business/outbound/addApply'}],
+      xiangmuList:[],
     }
   },
   computed: {
@@ -448,6 +496,15 @@ export default {
     goTodo() {
       // this.$router.push({ path: '/todo' }) // 替换为实际的待办页路由
     },
+    goCollection(){
+      this.isEdit=false
+      this.drawerShow=true
+    },
+    gotoPage(item){
+      this.drawerShow=false
+      this.isEdit=false
+      this.$router.push({ path: item.url })
+    },
     goMessageDetail(item) {
       this.$refs.messagePopover.doClose() // 关闭消息弹窗
       // this.$router.push({ path: '/message/detail', query: { id: item.id } }); // 跳消息详情
@@ -576,6 +633,47 @@ export default {
   },
 }
 </script>
+<style lang="scss" scoped>
+.custom-drawer{
+  ::v-deep.el-drawer.rtl{
+    border-top-left-radius: 10px;
+    border-bottom-left-radius: 10px;
+  } 
+}
+.myCollect-box{
+  width: 100%;height: 100%;background: #FAFAFA;overflow-y: auto;
+}
+.myCollect-box-title{
+  width: 100%;height: 66px;display: flex;align-items: center;padding:0 20px;justify-content: space-between;background: #FFF;margin-bottom: 10px;
+}
+.myCollect-box-zhineng{
+    padding: 16px;
+    margin-bottom: 10px;
+    background-color: #fff; 
+}
+.myCollect-box-zhineng-title{
+    font-size: 18px;
+    color: #333;
+    font-weight: 600;
+    text-align: left;
+    margin-bottom: 10px;
+}
+.myCollect-box-zhineng-item{
+  padding: 8px 5px;
+  cursor: pointer;
+  display: flex;
+  border-radius: 5px;
+  justify-content: space-between;
+  color: #000;
+  font-size: 12px;
+}
+.itemActive{
+  background-color: #e8f8f6;
+  color: #33c2ac;
+}
+
+</style>
+
 
 <style lang="scss" scoped>
 .navbar {