You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

720 lines
17 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="zhuye">
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
<LoadingPage :loading="loading"></LoadingPage>
<!-- //导航栏 -->
<!-- <u-navbar bgColor="#ffffff" :placeholder="true" titleStyle="font-weight:600" title="首页" :autoBack="true">
</u-navbar> -->
<view v-show="!loading">
<view class="swiper">
<!-- <u-swiper height="346rpx" width="100%" radius="5" :list="list1" indicator></u-swiper> -->
<image src="../static/images/zhuye/bg.png" alt=""></image>
<view class="welcome">下午好,{{ name }}</view>
</view>
<view class="box">
<!-- 常用服务菜单模块 -->
<view class="grid-body" style="margin-top: 30rpx;">
<u-grid col="4" @click="changeGrid">
<u-grid-item v-for="(item, index) in indexQuanXian" :key="index" :name="item.path">
<view class="grid-item-box1">
<image :src="`${item.pic}`" style="width: 70rpx; height: 70rpx;" />
<text style=" font-size: 26rpx;font-family: Noto Sans S Chinese;font-weight: 400;color: #212121;margin-top: 10rpx;">{{ item.menuName }}</text>
</view>
</u-grid-item>
</u-grid>
</view>
</view>
<view class="box">
<view class="notice-body" style="margin-top: 15rpx;" @click="goToPage(3)">
<view class="notice"><image src="../static/images/zhuye/notice.png" alt=""></image></view>
<u-notice-bar color="#212121" bgColor="#FFFFFFF" icon=" " :text="gonggao"></u-notice-bar>
<u-icon name="arrow-right" color="#2979ff" size="20"></u-icon>
</view>
</view>
<view class="new box">
<view class="newleft" @click="goToPage(1)">
<view>厂区应急车辆</view>
<view style="margin-top: 18rpx;">共 {{ cardata.carNum }} 辆</view>
</view>
<view class="newright" @click="goToPage(2)">
<view>值班电话</view>
<view style="margin-top: 18rpx;">{{ phoCall }}</view>
</view>
</view>
<swiper v-if="showYj >= 0 && !list1.length == '0'" style="height: 210rpx;" class="new box" :autoplay="true" :interval="3000" :circular="true">
<swiper-item v-for="(item, index) in list1" :key="index" @click="goToPage(4, item)">
<view style="background-color: #fff;width: 100%;">
<!-- 头部 -->
<view class="sortHead">
<image src="../static/images/Yjplan/sort.png" style="width: 36rpx;height: 36rpx;margin-right: 22rpx;"></image>
<span class="sortTitle">{{ index + 1 }}.{{ item.houseName }}</span>
</view>
<!-- 卡片 -->
<view class="sortCard">
<view class="zonghe" v-if="!item.kcnum == '0'">
<view class="title">库存预警(个)</view>
<view class="count">{{ item.kcnum }}</view>
</view>
<view class="zhuanxiang" v-if="!item.gqNum == '0'">
<view class="title">到期时间预警(个)</view>
<view class="count">{{ item.gqNum }}</view>
</view>
</view>
</view>
</swiper-item>
</swiper>
<view class="new box">
<view style="background-color: #fff;width: 100%;">
<!-- 头部 -->
<view class="sortHead">
<image src="../static/images/Yjplan/sort.png" style="width: 36rpx;height: 36rpx;margin-right: 22rpx;"></image>
<span class="sortTitle">最近一次演练计划</span>
</view>
<!-- 卡片 -->
<view class="sortCard">
<view>
<view class="unfinishlist">
<view class="content" style="border-left: 13rpx #FFD777 solid;margin-left: 4rpx; ">
<view class="name">{{ backlog.drillName }}</view>
<view class="address" style="display: flex;align-items: center;">
<image src="../static/images/drill/adress.png" style="width: 24rpx;height: 24rpx;margin-right: 5rpx;" />
{{ backlog.drillAddress }}
</view>
</view>
<view class="content">
<view class="name" style="color: #df4d63;font-weight: 600;">{{ backlog.text4 }}</view>
<view class="address" style="display: flex;align-items: center;">{{ backlog.drillDate }}</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="box">
<view class="boxGood">
<view class="title">
<view class="titlebg">
<image src="../static/images/zhuye/goodsTitle.png" alt="">
</view>
<view class="address">
采气管理一区
<u-icon name="list" color="#2979ff" size="20"></u-icon>
</view>
</view>
<view class="goods">
<u-tabs :list="list1" @change="clicktabs" :current="tabIndex" :scrollable="false" lineWidth="30"
gutter="25" :activeStyle="{
color: '#303133',
fontWeight: 'bold',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#606266',
transform: 'scale(1)'
}" itemStyle=" height: 70rpx;width:200rpx"
style="background-color: #fff;white-space: nowrap !important;"></u-tabs>
<swiper :current="tabIndex" @change="tabChange" style="height: 500rpx;">
<swiper-item>
<scroll-view scroll-y="true" enableBackToTop="true" @scrolltolower="loadMore()"
style="height: 500rpx;">
<view></view>
<view class="goodsContent" v-for="(index,item) in 4">
<view class="goodsPic">
<image src="../static/images/zhuye/cap.png" alt="">
</view>
<view class="goodsNew">
<view class="name">安全帽</view>
<view class="type">
物资类型:个体防护
</view>
<view class="count">
<view class="basicCount">
<image src="../static/images/zhuye/basic.png" alt="">
标准数量224
</view>
<view class="currentCount">
<image src="../static/images/zhuye/current.png" alt="">
当前数量:200
</view>
</view>
<view class="status">
待补充
</view>
</view>
</view>
</scroll-view>
</swiper-item>
<swiper-item>
<scroll-view scroll-y="true" style="height: 1000rpx;" enableBackToTop="true"
@scrolltolower="loadMore()">
222</scroll-view>
</swiper-item>
<swiper-item>
<scroll-view scroll-y="true" style="height: 1000rpx;" enableBackToTop="true"
@scrolltolower="loadMore()">
33</scroll-view>
</swiper-item>
</swiper>
</view>
</view>
</view> -->
<!-- app更新模块 -->
<!-- <update @showF="ShowON" :show="$store.state.updateApp.isTrue" :versionNum="$store.state.updateApp.newVesion"
:downloadUrl="$store.state.updateApp.url" :versionContent="$store.state.updateApp.MiaoShu"></update> -->
</view>
<Tabbar :value="'首页'"></Tabbar>
</view>
</template>
<script>
import { backlog } from '@/api/indexpage/YJDrill/index.js';
//权限控制
import auth from '@/plugins/auth.js';
//车辆预警
import { getUserProfile, listCountByAll, listNotice, getConfigKey, getLessNum } from '@/api/indexpage/user.js';
import { appMenuShowInfo, sendList } from '@/api/menu.js';
// import { getFzTask, getNoReadMessage } from '@/api/indexpage/mine.js';
import Tabbar from '@/components/tabbar/tabbar.vue';
import update from '@/components/update/update.vue';
import { dateFormat } from '@/minix/timeCommon.js';
export default {
name: 'index',
components: {
Tabbar,
update
},
data() {
return {
backlog: [
],
showYj: '',
text1: '',
gonggao: '欢迎使用应急资源管理App',
daubanData: 0,
tabIndex: 0,
news: 0,
loading: false,
fullHeight: '', //轮播图自适应高
// showOverPop: this.$store.state.overlaypop.showOverPop, //暂且先改为flase,等联合后台后再来显示
name: this.$store.state.user.name,
isTF: this.$store.state.updateApp.isTrue,
current: 0,
renwuList: null,
//取到菜单权限
indexQuanXian: [],
// list1: ["全部", "个体防护", "应急救援设备", "消防设备设施"],
list1: [],
cardata: {},
phoCall: '',
quanxianzhifu: true,
activityNum: 0, //非常规作业数量
name: this.$store.state.user.name
};
},
onLoad() {
this.text1 = getApp().globalData.config.appInfo.version;
//隐常自带tabber
uni.hideTabBar();
this.news = this.$store.state.mine.xiaoxi;
this.getquanxian();
//权限按钮
this.quanxianzhifu = auth.hasPermi('specialwork:workActivity:add');
//获取消息条数
this.$store.dispatch('getNewsListOne');
this.getYanLian();
this.getYj();
this.getCar();
this.getGongGao();
this.getConfigKeyData();
},
methods: {
getYanLian() {
backlog().then(res => {
this.backlog = res[0];
if(this.backlog==null){
}
});
},
getYj() {
getLessNum().then(res => {
this.list1 = res.data;
});
},
goToPage(bs, item) {
if (bs === 1) {
//仓库库存
this.$tab.navigateTo(`/pages/indexpage/Yjcar/Yjcar`);
} else if (bs === 2) {
this.$tab.navigateTo(`/pages/makePhoneCall/makePhoneCall`);
} else if (bs === 3) {
//D:/公司代码/公司代码20230829/华北石油局/
this.$tab.navigateTo(`/pages/GongGao/GongGao`);
} else if (bs === 4) {
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzYvJing/wzYvJing?ckId=${item.houseId}&ckName=${item.houseName}`);
}
},
getGongGao() {
listNotice().then(res => {
this.gonggao = res.rows
.map(item => {
return item.noticeContent;
})
.join(' ');
});
},
getCar() {
listCountByAll().then(res => {
this.cardata = res.data;
});
},
getConfigKeyData() {
getConfigKey('emergency_phone').then(res => {
this.phoCall = res.msg;
});
},
// tabs点击切换
clicktabs(e) {
this.switchTab(e.index);
},
// 轮播图切换
tabChange(e) {
let index = e.target.current || e.detail.current; // 获取到当前移动到第几个
this.switchTab(index);
},
//优化---当index相同时不执行代码
switchTab(index) {
if (this.tabIndex == index) {
return;
} else {
this.tabIndex = index;
}
},
ShowON(e) {
this.show = e;
//通知vuex改变变量
this.$store.commit('setisFalse');
},
showOverPop() {
//通知vuex改变变量
this.$store.commit('setshowOverPop', false);
},
getquanxian() {
this.$store.state.user.saveMenu.map(item => {
if (item.menuName === '首页') {
//过滤不显示的按钮
item.children.map(item1 => {
if (item1.status === '0') {
if (item.path === '/pages/indexpage/YJgoods/YJgoods') {
this.showYj = 2;
}
this.indexQuanXian.push(item1);
}
});
}
});
},
changeGrid(path) {
// console.log(path);
// this.$modal.showToast('模块建设中~');
this.$tab.navigateTo(path);
}
}
};
</script>
<style lang="scss" scoped>
.u-nav-slot {
width: 100vw;
padding: 0 30rpx;
display: flex;
justify-content: space-between;
align-items: center;
.city {
display: flex;
align-items: center;
font-size: 38rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #333333;
}
.weather {
display: flex;
font-size: 30rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #333333;
}
}
page {
background-color: #f6f7fb;
box-sizing: border-box !important;
// background: linear-gradient(0deg, #E1E5FD, #F6F7FB) !important;
}
.sortHead {
background-color: #fff;
display: flex;
font-weight: 600;
align-items: center;
padding: 12rpx 20rpx;
.sortTitle {
font-family: Noto Sans S Chinese;
font-size: 32rpx;
color: #333333;
line-height: 40rpx;
}
}
.sortCard {
padding: 0 10rpx;
padding-bottom: 10rpx;
display: flex;
justify-content: space-between;
// flex-wrap: wrap;
margin-bottom: 10rpx;
width: 100%;
.unfinishlist {
width: 672rpx;
height: 120rpx;
margin-top: 10rpx;
background: #ffffff;
box-shadow: 0rpx 6rpx 8rpx 0rpx rgba(190, 207, 228, 0.4);
display: flex;
justify-content: space-between;
padding: 0rpx 4rpx;
// align-items: flex-start;
.content {
display: flex;
flex-direction: column;
justify-content: space-evenly;
// margin-left: 20rpx;
.name {
font-weight: 400;
font-size: 30rpx;
color: #333333;
margin-left: 10rpx;
}
.address {
font-family: Noto Sans S Chinese;
font-weight: normal;
font-size: 24rpx;
color: #999999;
margin-left: 10rpx;
}
}
}
.zonghe {
width: 320rpx;
height: 140rpx;
background: url('../static/images/Yjplan/zonghe.png') no-repeat;
background-size: 100% 100%;
// margin-right: 19rpx;
}
.zhuanxiang {
width: 320rpx;
height: 140rpx;
background: url('../static/images/Yjplan/qita.png') no-repeat;
background-size: 100% 100%;
}
.title {
font-family: Noto Sans S Chinese;
font-size: 30rpx;
color: #4d4d4d;
line-height: 40rpx;
padding: 18rpx 30rpx;
}
.count {
font-family: DINPro;
font-weight: 500;
font-size: 40rpx;
color: #353535;
line-height: 40rpx;
padding: 0 40rpx;
}
}
.box1 .u-badge--not-dot {
padding: 5px 8px;
}
.zhuye {
width: 100%;
.swiper {
height: 427rpx;
width: 100vw;
position: relative;
.welcome {
position: absolute;
bottom: 50rpx;
right: 60rpx;
font-size: 40rpx;
font-family: PangMenZhengDao;
font-weight: 400;
color: #fff;
text-shadow: 2px 0px 6px rgba(62, 62, 62, 0.2);
}
image {
width: 100%;
height: 100%;
}
}
.box {
padding: 0 34rpx;
position: relative;
top: -50rpx;
// z-index: 999;
}
.notice-body {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10rpx;
.notice {
width: 55rpx;
height: 53rpx;
image {
width: 100%;
height: 100%;
}
}
}
// 菜单模块
.grid-body,
.notice-body {
width: 100%;
// height: 450rpx;
background-color: #fff;
border-radius: 20rpx;
color: #212121;
font-size: 26rpx;
font-weight: Regular;
.text {
font-size: 28rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #666666;
}
// 常用服务
.serve {
display: flex;
padding: 20rpx;
align-items: center;
border-bottom: 1rpx #eeeeee solid;
}
.grid-item-box1 {
height: 160rpx !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
}
// 车辆
.new {
// padding: 0 34rpx;
display: flex;
justify-content: space-between;
align-items: center;
// width: 100%;
border-radius: 20rpx;
margin: 20rpx 0;
.newleft {
width: 334rpx;
height: 148rpx;
background-image: url('../static/images/zhuye/car.png');
background-size: 100%;
margin-right: 15rpx;
font-size: 28rpx;
font-family: Alibaba PuHuiTi;
font-weight: 600;
color: #3d6aa6;
padding: 0 26rpx;
display: flex;
flex-direction: column;
justify-content: center;
}
.newright {
width: 334rpx;
height: 148rpx;
background-image: url('../static/images/zhuye/phone.png');
background-size: 100%;
font-size: 28rpx;
font-family: Alibaba PuHuiTi;
font-weight: 600;
color: #1e7555;
padding: 0 26rpx;
display: flex;
flex-direction: column;
justify-content: center;
}
}
.boxGood {
background-color: #fff;
border-radius: 20rpx;
// height: 1000rpx;
.title {
display: flex;
justify-content: space-between;
width: 100%;
.titlebg {
width: 305rpx;
height: 71rpx;
image {
width: 100%;
height: 100%;
}
}
.address {
display: flex;
justify-content: center;
align-items: center;
margin-right: 20rpx;
}
}
}
// 物资
.goodsContent {
height: 200rpx;
width: 100%;
padding: 30rpx 20rpx;
display: flex;
align-items: center;
justify-content: space-evenly;
border-bottom: 1px solid #eeeeee;
.goodsPic {
width: 180rpx;
height: 180rpx;
image {
width: 100%;
height: 100%;
}
}
.goodsNew {
display: flex;
flex-direction: column;
justify-content: space-evenly;
// align-items: center;
}
.name {
// width: 87rpx;
height: 29rpx;
font-size: 30rpx;
font-family: Noto Sans S Chinese;
font-weight: 600;
color: #333333;
}
.type {
margin: 15rpx 0 10rpx 0;
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: normal;
color: #999999;
}
.count {
display: flex;
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: normal;
color: #999999;
}
.basicCount {
font-size: 22rpx;
font-family: Noto Sans S Chinese;
font-weight: normal;
color: #0098df;
width: 212rpx;
// height: 40rpx;
background: #e8f8ff;
border: 1px solid #0098df;
border-radius: 4rpx;
margin-right: 10rpx;
padding: 10rpx;
display: flex;
align-items: center;
image {
height: 22rpx;
width: 20rpx;
}
}
.currentCount {
font-size: 22rpx;
font-family: Noto Sans S Chinese;
font-weight: normal;
color: #ffa132;
width: 210rpx;
// height: 40rpx;
background: #fff9f1;
border: 1px solid #ffa132;
border-radius: 4rpx;
padding: 10rpx;
display: flex;
align-items: center;
image {
height: 22rpx;
width: 20rpx;
}
}
.status {
font-size: 28rpx;
font-family: Noto Sans S Chinese;
font-weight: 500;
color: #ffa132;
// margin: 10rpx 0;
}
}
}
</style>