hookehuyr

菜单相关页面接口联调

1 /* 1 /*
2 * @Date: 2024-09-26 13:36:06 2 * @Date: 2024-09-26 13:36:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-23 13:03:28 4 + * @LastEditTime: 2024-10-23 13:47:59
5 * @FilePath: /hager/src/api/hager.js 5 * @FilePath: /hager/src/api/hager.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
...@@ -11,8 +11,12 @@ const Api = { ...@@ -11,8 +11,12 @@ const Api = {
11 HONOR: '/srv/?a=cate&type=honor', 11 HONOR: '/srv/?a=cate&type=honor',
12 NEWS: '/srv/?a=cate&type=news', 12 NEWS: '/srv/?a=cate&type=news',
13 NEWS_DETAIL: '/srv/?a=detail&type=news', 13 NEWS_DETAIL: '/srv/?a=detail&type=news',
14 + HOME: '/srv/?a=home',
15 + PRODUCT_CATE: '/srv/?a=cate&type=product',
14 }; 16 };
15 17
16 export const honorAPI = (params) => fn(fetch.get(Api.HONOR, params)); 18 export const honorAPI = (params) => fn(fetch.get(Api.HONOR, params));
17 export const newsAPI = (params) => fn(fetch.get(Api.NEWS, params)); 19 export const newsAPI = (params) => fn(fetch.get(Api.NEWS, params));
18 export const getNewsDetailAPI = (params) => fn(fetch.get(Api.NEWS_DETAIL, params)); 20 export const getNewsDetailAPI = (params) => fn(fetch.get(Api.NEWS_DETAIL, params));
21 +export const getHomeAPI = (params) => fn(fetch.get(Api.HOME, params));
22 +export const getProductCateAPI = (params) => fn(fetch.get(Api.PRODUCT_CATE, params));
......
This diff is collapsed. Click to expand it.
1 <!-- 1 <!--
2 * @Date: 2024-10-10 10:37:16 2 * @Date: 2024-10-10 10:37:16
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-21 13:37:46 4 + * @LastEditTime: 2024-10-23 14:28:22
5 * @FilePath: /hager/src/components/hagerMenu.vue 5 * @FilePath: /hager/src/components/hagerMenu.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -27,8 +27,8 @@ ...@@ -27,8 +27,8 @@
27 :class="['menu-label', activeMenu === item.id ? 'active' : '']" 27 :class="['menu-label', activeMenu === item.id ? 'active' : '']"
28 > 28 >
29 <div> 29 <div>
30 - <i class="el-icon-s-cooperation"></i> 30 + <el-image style="width: auto; height: 1rem" :src="item.cover" fit="fit"></el-image>
31 - {{ item.label }} 31 + {{ item.category_name }}
32 </div> 32 </div>
33 <div> 33 <div>
34 <i 34 <i
...@@ -42,9 +42,9 @@ ...@@ -42,9 +42,9 @@
42 42
43 <!-- 二级菜单 --> 43 <!-- 二级菜单 -->
44 <div v-if="isActive(item.id)" class="submenu"> 44 <div v-if="isActive(item.id)" class="submenu">
45 - <div v-for="subItem in item.subItems" :key="subItem.id" class="submenu-item"> 45 + <div v-for="subItem in item.children" :key="subItem.id" class="submenu-item">
46 <div class="submenu-label"> 46 <div class="submenu-label">
47 - <div @click="goToSub(subItem.id)">{{ subItem.label }}</div> 47 + <div @click="goToSub(subItem.id)">{{ subItem.category_name }}</div>
48 <div @click="toggleSubMenu(subItem.id)"> 48 <div @click="toggleSubMenu(subItem.id)">
49 <i 49 <i
50 v-if="isSubActive(subItem.id)" 50 v-if="isSubActive(subItem.id)"
...@@ -59,11 +59,11 @@ ...@@ -59,11 +59,11 @@
59 <div v-if="isSubActive(subItem.id)" class="third-menu"> 59 <div v-if="isSubActive(subItem.id)" class="third-menu">
60 <div 60 <div
61 @click="goToThird(thirdItem.id)" 61 @click="goToThird(thirdItem.id)"
62 - v-for="thirdItem in subItem.subItems" 62 + v-for="thirdItem in subItem.list"
63 :key="thirdItem.id" 63 :key="thirdItem.id"
64 class="third-item" 64 class="third-item"
65 > 65 >
66 - {{ thirdItem.label }} 66 + {{ thirdItem.product_name }}
67 </div> 67 </div>
68 </div> 68 </div>
69 </div> 69 </div>
...@@ -96,72 +96,14 @@ import mixin from "common/mixin"; ...@@ -96,72 +96,14 @@ import mixin from "common/mixin";
96 96
97 export default { 97 export default {
98 mixins: [mixin.init], 98 mixins: [mixin.init],
99 + props: {
100 + menuData: {
101 + type: Array,
102 + default: () => []
103 + }
104 + },
99 data() { 105 data() {
100 return { 106 return {
101 - menuData: [
102 - {
103 - id: 1,
104 - label: "配电产品",
105 - subItems: [
106 - {
107 - id: 11,
108 - label: "空气断路器1",
109 - subItems: [
110 - { id: 111, label: "HW系列空气断路器" },
111 - { id: 112, label: "HW+系列空气断路器" },
112 - { id: 113, label: "HW系列空气断路器" },
113 - { id: 114, label: "HW+系列空气断路器" },
114 - { id: 115, label: "HW系列空气断路器" },
115 - { id: 116, label: "HW+系列空气断路器" },
116 - { id: 117, label: "HW系列空气断路器" },
117 - { id: 118, label: "HW+系列空气断路器" },
118 - { id: 119, label: "HW系列空气断路器" },
119 - { id: 1121, label: "HW+系列空气断路器" },
120 - { id: 1117, label: "HW系列空气断路器" },
121 - { id: 1127, label: "HW+系列空气断路器" },
122 - { id: 1137, label: "HW系列空气断路器" },
123 - { id: 1147, label: "HW+系列空气断路器" },
124 - { id: 1157, label: "HW系列空气断路器" },
125 - { id: 1167, label: "HW+系列空气断路器" },
126 - { id: 7117, label: "HW系列空气断路器" },
127 - { id: 7118, label: "HW+系列空气断路器" },
128 - { id: 7119, label: "HW系列空气断路器" },
129 - { id: 71121, label: "HW+系列空气断路器" },
130 - ],
131 - },
132 - {
133 - id: 12,
134 - label: "空气断路器2",
135 - subItems: [
136 - { id: 111, label: "HW系列空气断路器" },
137 - { id: 112, label: "HW+系列空气断路器" },
138 - { id: 113, label: "HW系列空气断路器" },
139 - { id: 114, label: "HW+系列空气断路器" },
140 - { id: 115, label: "HW系列空气断路器" },
141 - { id: 116, label: "HW+系列空气断路器" },
142 - { id: 117, label: "HW系列空气断路器" },
143 - { id: 118, label: "HW+系列空气断路器" },
144 - { id: 119, label: "HW系列空气断路器" },
145 - { id: 1121, label: "HW+系列空气断路器" },
146 - ],
147 - },
148 - ],
149 - },
150 - {
151 - id: 2,
152 - label: "成套产品",
153 - subItems: [
154 - {
155 - id: 21,
156 - label: "塑壳断路器",
157 - subItems: [
158 - { id: 211, label: "自动转换开关" },
159 - { id: 212, label: "接触器及热过载继电器" },
160 - ],
161 - },
162 - ],
163 - },
164 - ],
165 isToggle: false, 107 isToggle: false,
166 activeMenu: null, // 当前展开的一级菜单ID 108 activeMenu: null, // 当前展开的一级菜单ID
167 activeSubMenu: null, // 当前展开的二级菜单ID 109 activeSubMenu: null, // 当前展开的二级菜单ID
......