增加应用中心子页面

This commit is contained in:
2025-05-30 11:21:05 +08:00
parent bb84b49ddc
commit c936732066
3 changed files with 141 additions and 21 deletions

View File

@@ -1,19 +1,78 @@
<template>
<view>
<view class="u-p-30 bg-gray min-page">
<view class=" border-r-16 bg-fff u-p-30 " >
<view class="u-m-t-32">
<up-grid :border="false" col="2">
<up-grid-item @click="toPage(listItem,listIndex)" v-for="(listItem,listIndex) in computedMenus"
:key="listIndex">
<image style="width: 120rpx;height: 120rpx;" :src="listItem.miniIcon" mode="scaleToFill" />
<text class="u-m-t-16 color-333 u-font-28 u-p-b-32">{{listItem.title}}</text>
</up-grid-item>
</up-grid>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
}
<script setup>
import {
computed
} from 'vue';
import go from '@/commons/utils/go.js';
import {
useMenusStore
} from '@/store/menus.js';
const menusStore = useMenusStore()
async function init() {
const res = await menusStore.getMenus()
}
init()
function toPage(item, index) {
console.log(item);
uni.navigateTo({
url: '/' + item.miniPath.replace(/^\/+|\/+$/g, ''),
fail(err) {
uni.showToast({
icon: 'none',
title: '无该页面路径或无权限访问该页面'
})
}
})
}
const navList = [{
title: '存酒',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '点歌',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '广告',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '叫号',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
];
const computedMenus = computed(() => {
const arr= menusStore.adminPages.filter(v=>{
return navList.find(navItem=>navItem.title==v.title)
})
console.log(arr);
return arr
})
</script>
<style lang="scss">
</style>
</style>

View File

@@ -1,19 +1,78 @@
<template>
<view>
<view class="u-p-30 bg-gray min-page">
<view class=" border-r-16 bg-fff u-p-30 ">
<view class="u-m-t-32">
<up-grid :border="false" col="2">
<up-grid-item @click="toPage(listItem,listIndex)" v-for="(listItem,listIndex) in computedMenus"
:key="listIndex">
<image style="width: 120rpx;height: 120rpx;" :src="listItem.miniIcon" mode="scaleToFill" />
<text class="u-m-t-16 color-333 u-font-28 u-p-b-32">{{listItem.title}}</text>
</up-grid-item>
</up-grid>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
}
<script setup>
import {
computed
} from 'vue';
import go from '@/commons/utils/go.js';
import {
useMenusStore
} from '@/store/menus.js';
const menusStore = useMenusStore()
async function init() {
const res = await menusStore.getMenus()
}
init()
function toPage(item, index) {
console.log(item);
uni.navigateTo({
url: '/' + item.miniPath.replace(/^\/+|\/+$/g, ''),
fail(err) {
uni.showToast({
icon: 'none',
title: '无该页面路径或无权限访问该页面'
})
}
})
}
const navList = [{
title: '优惠券',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '霸王餐',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '邀请裂变',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
{
title: '积分锁客',
icon: '/static/indexImg/icon-order.svg',
pageUrl: 'PAGES_ORDER_INDEX'
},
];
const computedMenus = computed(() => {
const arr = menusStore.adminPages.filter(v => {
return navList.find(navItem => navItem.title == v.title)
})
console.log(arr);
return arr
})
</script>
<style lang="scss">
</style>
</style>

View File

@@ -43,7 +43,8 @@ export const useMenusStore = defineStore('menus', {
return {
originMenus: [],
menuList: [],
allPages: allPages
allPages: allPages,//小程序全部页面
adminPages:[]//后台返回的全部页面
};
},
actions: {
@@ -51,6 +52,7 @@ export const useMenusStore = defineStore('menus', {
const data = await menusApi.getMenus()
this.originMenus = data;
const arr = flattenNestedChildren(data).filter(v => v.miniPath)
this.adminPages=arr;
this.menuList = this.allPages.filter(v => {
const findItem = arr.find(item => item.miniPath == v.pageId || item.miniPath
.replace(/^\/+|\/+$/g, '') == v.allPath)