yxk_h5_master/pages/main/main.vue

397 lines
11 KiB
Vue
Raw Permalink Normal View History

2025-08-28 15:21:09 +08:00
<template>
<view class="uni-container" style="height: 100%; overflow: auto">
<view class="news_area">
<view class="news_icon"></view>
<view class="news_line">
<view class="marquee_list" :class="{ anim: animate }">
<view
class="news_text"
v-for="(item, index) in marqueeList"
:key="index"
@click="linkToNews(item)"
>
{{ item.title }}
</view>
</view>
</view>
<view class="red"></view>
<view class="iconfont icon-you news_more_icon"></view>
</view>
<view style="padding-bottom: 15px">
<!-- <view class="items_area" v-for="(menuItem, index) in menus" :key="index">
<view class="items_name">{{menuItem.text}}</view>
<view class="items_container">
<uni-grid :column="4" :show-border="false" :square="false" :highlight="false" >
<uni-grid-item v-for="(item, indey) in (menuItem.children||[])" :key="indey" @click="linkTo(item)">
<image :src="config.imgURL+'/'+item.iconUrl" class="items_icon" mode="aspectFill" />
<text class="items_text">{{ item.text }}</text>
</uni-grid-item>
</uni-grid>
</view>
</view> -->
<view class="items_area" v-for="(menuItem, index) in menus" :key="index">
<view class="items_name">{{ menuItem.text }}</view>
<view class="items_container">
<!-- <view class="items_out" v-for="(item, indey) in (menuItem.children||[])" :key="Math.random()" @click="linkTo(item.routePath)"> -->
<view
class="items_out"
v-for="(item, indey) in menuItem.children || []"
:key="indey"
@click="linkTo(index, indey)"
>
<!-- :src="'../../static/' + item.iconUrl" -->
<image
class="items_icon"
:src="'../../static/' + item.iconUrl"
@load="onoff = '1'"
></image>
<!-- 角标 -->
<view class="grid-dot">
<uni-badge :text="item.dealNum" type="error" />
</view>
<!-- <img :src="'../../static/'+item.iconUrl" alt=""> -->
<!-- <image class="items_icon" :src="config.imgURL+item.iconUrl +'?t='+ new Date().getTime()"></image> -->
<view class="items_text">{{ item.text }}</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { config } from "../../request/js/config.js";
var time = "";
var t = "";
import uniGrid from "@/components/uni-grid/uni-grid.vue";
import uniGridItem from "@/components/uni-grid-item/uni-grid-item.vue";
export default {
components: {
uniGrid,
uniGridItem,
},
data() {
return {
config: config,
menus: [],
animate: false,
marqueeList: [],
};
},
//这里为什么不用onload,因为我发现,只有第一次调用了,后面没有调用。
onShow() {
var _this = this;
console.log(config);
var userInfo = uni.getStorageSync("userInfo");
//针对自动登陆的用户进行判断判断当前用户的tokne是否过期如果过期就
const automatic_logon = uni.getStorageSync("automatic_logon");
const loginInfo = uni.getStorageSync("admin_info");
if (automatic_logon && loginInfo) {
this.$http
.request({
url: "/apis/user/checkToken",
params: {
token: userInfo.token,
username: loginInfo.username,
password: loginInfo.password,
},
})
.then((res) => {
if (res.statusCode == "200") {
if (res.data.isLate == "true") {
//表示过期
uni.setStorage({
key: "userInfo",
data: res.data.userInfo,
success: function () {
//保存成功后,调用菜单接口和新闻金额口。
// _this.getNews();
_this.getMenu();
},
});
} else {
// this.getNews();
this.getMenu();
}
}
})
.catch((err) => {
//任何异常都跳转到登陆界面。
uni.showModal({
content: "您未登录,需要登录后才能继续",
showCancel: false,
success: (res) => {
if (res.confirm) {
uni.navigateTo({
url: "../login/login",
});
}
},
});
});
} else if (!userInfo) {
uni.showModal({
content: "您未登录,需要登录后才能继续",
showCancel: false,
success: (res) => {
if (res.confirm) {
uni.navigateTo({
url: "../login/login",
});
}
},
});
} else {
//没有自动登陆,但是已经登陆的用户,正常。
// this.getNews();
this.getMenu();
}
},
methods: {
getNews() {
//ajax 获取当前的新闻列表
this.$http
.request({
url: "/apis/news/list",
method: "GET",
params: {
pageno: 1,
pagesize: 6,
},
})
.then((res) => {
if (res) {
if (!res.data.data.datas || res.data.data.datas.length == 0) {
//没有数据
this.marqueeList = [];
return;
}
if (res.data.code == 0) {
this.marqueeList = res.data.data.datas;
//开始轮播滚动
clearInterval(time);
time = setInterval(this.scroll, 2000);
}
}
});
},
getMenu() {
//调用ajax 获取当前目录的菜单。
this.$http
.request({
url: "/apis/sys/getMenus",
params: {
terminal: 1,
},
})
.then((res) => {
console.log(res);
if (res.data && res.data.menus) {
this.menus = res.data.menus;
}
})
.catch((err) => {
uni.showModal({
content: "您未登录,需要登录后才能继续",
showCancel: false,
success: (res) => {
if (res.confirm) {
uni.navigateTo({
url: "../login/login",
});
}
},
});
});
},
scroll() {
this.animate = true;
clearTimeout(t);
t = setTimeout(() => {
this.marqueeList.push(this.marqueeList[0]);
this.marqueeList.shift();
this.animate = false;
}, 500);
},
//点击跳转到相应页面
linkTo(index, indey) {
let urlLink = "/" + this.menus[index].children[indey].routePath;
// //所有任务需要特殊处理因为是toolbar 里面的页签
// if(item.routePath == 'pages/task/task'){
// var url = item.routePath.split('/');
// this.switchTo('../'+url[1]+'/'+url[2]);
// }else{
//这边的url 这样处理好像也不太好。
let item_routePath = this.menus[index].children[indey].routePath;
var url = item_routePath.split("/");
console.log(url, "urlLink");
if (
JSON.stringify(url) ==
JSON.stringify(["pages", "startWorking", "startWorking"])
) {
var filterRes = {};
this.$http
.request({
url: "apis/mes/dispatch/getOneStartWorking",
params: filterRes,
})
.then((res) => {
if (res.data.data) {
uni.navigateTo({
url: urlLink,
// url: '/pages/'+url[1]+'/'+url[2]
});
} else {
uni.showToast({
title: "不存在在制工单",
duration: 2000,
icon: "none",
});
return;
}
});
} else {
console.log(urlLink, "-----");
uni.navigateTo({
// url: item.routePath
url: urlLink,
});
}
// }
},
linkToNews(item) {
//"../schedule/news"
uni.navigateTo({
url: "/pages/schedule/newsDetail?id=" + item.id,
});
},
},
};
</script>
<style scoped>
.grid-dot {
position: absolute;
top: 0px;
right: 15px;
}
.content {
/* padding-bottom: var(--window-bottom); */
margin-bottom: 20upx;
margin-top: var(--status-bar-height);
}
.news_area {
position: relative;
width: 90%;
margin: auto;
background-color: #fff;
padding: 30upx 10upx;
box-sizing: border-box;
margin-top: 20upx;
height: 150upx;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
}
.news_icon {
position: absolute;
width: 60upx;
height: 60upx;
left: 20upx;
margin: auto;
top: 0;
bottom: 0;
background-image: url(../../static/img/xw@3x.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
border-radius: 60upx;
}
.news_line {
position: absolute;
left: 100upx;
right: 90upx;
height: 90upx;
overflow: hidden;
}
.news_text {
font-size: 28upx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.red {
position: absolute;
width: 12upx;
height: 12upx;
border-radius: 12upx;
background-color: red;
margin: auto;
top: 0;
bottom: 0;
right: 60upx;
}
.news_more_icon {
position: absolute;
right: 20upx;
margin: auto;
top: 0;
bottom: 0;
height: 32upx;
font-size: 32upx;
}
.items_area {
position: relative;
width: 95%;
margin: auto;
}
.items_name {
font-size: 32upx;
line-height: 90upx;
}
.items_container {
position: relative;
width: 100%;
background-color: #fff;
border-radius: 6upx;
padding: 22upx 0px;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
display: block;
overflow: hidden;
}
.items_out {
float: left;
position: relative;
width: 25%;
box-sizing: border-box;
overflow: hidden;
margin: 18upx 0px;
}
.items_icon {
width: 60upx;
height: 60upx;
margin: auto;
display: block;
}
.items_text {
width: 100%;
text-align: center;
font-size: 28upx;
line-height: 40upx;
color: #444;
text-overflow: ellipsis;
white-space: nowrap;
}
.marquee_list {
width: 100%;
transition: top 0.5s;
}
.anim {
transition: all 0.5s;
margin-top: -40upx; //高度等于行高
}
</style>