<template>
|
<uni-base-page :footer="false">
|
<view slot="page">
|
<!-- 新增权限提示 -->
|
<view v-if="!userMenu || userMenu.length === 0" class="no-permission">
|
您当前没有权限
|
</view>
|
|
<view v-else>
|
<view class="example-body">
|
<uni-grid :column="col" :showBorder="false">
|
<uni-grid-item v-for="(item, index) in userMenu" :index="index" :key="index" class="grid-item">
|
<view class="grid-item-box" hover-class="none" @click="handleMenuItem(item)">
|
<image class="imgMenu" src="/static/img/imgMenu/WARBAAHtml.png"></image>
|
<text class="text" style="text-align: center;padding:5px 0px 5px 0px">{{ item.pagE_VIEW }}</text>
|
</view>
|
</uni-grid-item>
|
</uni-grid>
|
</view>
|
</view>
|
</view>
|
</uni-base-page>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
loginInfo: this.$loginInfo,
|
color: this.$defaultColor,
|
userMenu: this.$userMenu,
|
imgUrls: [
|
"../../static/img/SN-GG.png",
|
"../../static/img/SN-GG1.png"
|
],
|
col: 2, //菜单列数
|
};
|
},
|
methods: {
|
getMenu(isShowMask) {
|
if (isShowMask) uni.showLoading({
|
mask: true,
|
title: "加载中..."
|
});
|
this.$getUserMenu({
|
type: 'sys',
|
programId: this.loginInfo.sysNumber,
|
success: (res) => {
|
this.userMenu = res;
|
uni.stopPullDownRefresh();
|
console.log(this.userMenu);
|
},
|
fail: (err) => {
|
|
},
|
complete() {
|
if (isShowMask) uni.hideLoading();
|
}
|
});
|
},
|
getIsMsg() {
|
this.$post({
|
url: "/MessageCenter/IsShow",
|
data: {
|
createBy: this.$loginInfo.account,
|
isShow: 1,
|
},
|
}).then(res => {
|
if (res.data.tbBillList > 0) {
|
this.msg = "您有新的异常待处理/您有新的异常待处理";
|
//展示图标
|
uni.showTabBarRedDot({
|
index: 1
|
});
|
} else {
|
this.msg = "宁波广深科技有限公司";
|
//展示图标
|
uni.hideTabBarRedDot({
|
index: 1
|
});
|
}
|
})
|
},
|
onPullDownRefresh() {
|
// if (this.loginInfo.hasLogin)
|
//this.getMenu(true);
|
},
|
handleMenuItem(item) {
|
// 判断是否为外部链接（假设item.path包含外部链接）
|
if (item.path.startsWith('http')) {
|
// 跳转外部网站
|
this.openExternalLink(item.path);
|
} else {
|
// 正常内部跳转
|
uni.navigateTo({
|
url: `../${item.path}`
|
});
|
}
|
},
|
openExternalLink(url) {
|
// #ifdef H5
|
window.open(url, '_blank'); // H5使用新标签页打开
|
// #endif
|
|
// #ifdef APP-PLUS
|
plus.runtime.openURL(url); // App使用系统浏览器打开
|
// #endif
|
|
// #ifdef MP-WEIXIN
|
// 小程序需使用web-view组件，跳转到承载页
|
uni.navigateTo({
|
url: `/pages/webview/webview?url=${encodeURIComponent(url)}`
|
});
|
// #endif
|
}
|
},
|
onLoad() {
|
if (!this.loginInfo.hasLogin) {
|
uni.showModal({
|
title: '未登录',
|
content: '您未登录，需要登录后才能查看',
|
/**
|
* 如果需要强制登录，不显示取消按钮
|
*/
|
showCancel: !this.loginInfo.forcedLogin,
|
success: (res) => {
|
if (res.confirm) {
|
/**
|
* 如果需要强制登录，使用reLaunch方式
|
*/
|
if (this.loginInfo.forcedLogin) {
|
uni.reLaunch({
|
url: 'login'
|
});
|
} else {
|
uni.navigateTo({
|
url: 'login'
|
});
|
}
|
}
|
}
|
});
|
} else {
|
this.getMenu(true);
|
}
|
|
|
},
|
onShow() {
|
//this.getIsMsg();
|
},
|
}
|
</script>
|
|
<style>
|
.text {
|
/* color: #ffffff; */
|
/* font-size: 15px; */
|
font-weight: 900;
|
}
|
|
.example-body {
|
flex-direction: row;
|
flex-wrap: wrap;
|
justify-content: center;
|
padding: 0;
|
font-size: 14px;
|
/* background-color: #ffffff; */
|
}
|
.grid-item {
|
display: flex;
|
flex-wrap: wrap;
|
height: 100% !important;
|
display: flex;
|
flex-direction: column;
|
align-items: stretch; /* 保证垂直拉伸以适应内容 */
|
}
|
.grid-item-box {
|
flex: 1;
|
/* position: relative;*/
|
/* #ifndef APP-NVUE */
|
display: flex;
|
/* #endif */
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
padding: 5px;
|
}
|
|
.imgMenu {
|
width: 100rpx;
|
height: 100rpx;
|
}
|
|
image,
|
swiper,
|
.img-view {
|
width: 100%;
|
height: 350rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.example-body {
|
flex-direction: row;
|
justify-content: flex-start;
|
}
|
|
/* 电脑端样式 */
|
@media (min-width: 768px) {
|
.example-body {
|
max-width: 50%; /* 宽度变为一半 */
|
margin: 0 auto; /* 水平居中 */
|
}
|
|
.grid-item-box {
|
padding: 15px; /* 增加内边距 */
|
}
|
|
.imgMenu {
|
width: 120rpx; /* 适当增大图标 */
|
height: 120rpx;
|
}
|
}
|
|
.no-permission {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
color: red;
|
font-size: 24px;
|
font-weight: bold;
|
}
|
</style>
|
