detection-business/pages/index/synthesis.vue

<!-- 首页 -->
<template>
	<view class="content">
		<!-- 检测进行中 今日成交金额  今日订单数量 底部为总 -->
		<view class="c-top">
			<view style="width: 100%; height: 44px;"></view>
			<view class="top-ail">
				<!-- 新增 -->
				<view class="top-two">
					<view class="dix">
						<view class="touxiang">
							<image :src="baseImageUrl+user.partnerLogo" mode=""></image>
						</view>
						<view class="t-title">{{user.partnerName}} 欢迎您</view>
					</view>
					<view class="dix">
						<text class="baizi" v-if="user.isWorking == 1">营业中</text>
						<text class="baizi" v-if="user.isWorking == 0">休息中</text>
						<switch :checked="isWorking" @change="getying()" color="#3CBC6F" style="transform:scale(0.7)" />
					</view>
				</view>
				<view class="threebox">
					<!-- @click="gostatistics()" -->
					<view class="t-box">
						<view class="xbai">合规合格</view>
						<view class="dbai">{{threenum.hgNum}}</view>

					</view>
					<view class="t-box">
						<view class="xbai">当日订单</view>
						<view class="dbai">{{threenum.todayOrderNum}}</view>

					</view>
					<view class="t-box">
						<view class="xbai">双燃料合格</view>
						<view class="dbai">{{threenum.srlNum}}</view>

					</view>
				</view>

				<view class="gangbox">
					<view class="ang-box1" @click="goindex()">
						<view class="bs-di">
							<text>信息管理</text>
							<uni-icons type="arrow-right" color="#6FA1CD" size="20"></uni-icons>
						</view>
						<view class="xzi">
							<!-- 	<text style="color: #6FA1CD;">检测站的信息管理</text> -->
							<text>检测站的信息管理</text>
						</view>
						<view class="icon-img">
							<image src="../../static/detection/xxgl.png" mode=""></image>
						</view>
					</view>
					<view class="ang-box2" @click="gostatistics()">
						<view class="bs-di">
							<text>业务管理</text>
							<uni-icons type="arrow-right" color="#CCAC63" size="20"></uni-icons>
						</view>
						<view class="xzi">
							<!-- <text style="color: #CCAC63;">检测站的业务统计</text> -->
							<text>检测站的业务统计</text>

						</view>
						<view class="icon-img">
							<image src="../../static/detection/ywgl.png" mode=""></image>
						</view>
					</view>
					<view class="ang-box3" @click="goxiaoxi()">
						<view class="bs-di">
							<text>监管通知</text>
							<uni-icons type="arrow-right" color="#775FAE" size="20"></uni-icons>
						</view>
						<view class="xzi">
							<!-- 	<text style="color: #775FAE;">查看监管机构下达的通知</text> -->
							<text>查看监管机构下达的通知</text>
						</view>
						<view class="icon-img">
							<image src="../../static/detection/jgtz.png" mode=""></image>
						</view>
					</view>
					<view class="ang-box4" @click="goshowMenu()">
						<view class="bs-di">
							<text>内部管理</text>
							<uni-icons type="arrow-right" color="#99D685" size="20"></uni-icons>
						</view>
						<view class="xzi">
							<!-- <text style="color: #FFFFFF	;">详细的操作手册</text> -->
							<text>方便 简单 快捷</text>
						</view>
						<view class="icon-img">
							<image src="../../static/detection/gsjj.png" mode=""></image>
						</view>
					</view>
					<!-- <view class="ang-box">
					<text>公司简介</text>
				</view> -->
				</view>
				<view class="gangbox">
					<view class="san-box2" @click="gorwm()">
						<view class="cnm-icon">
							<image src="../../static/detection/dddhex.png" mode=""></image>
						</view>
						<text>订单核销</text>
					</view>
					<view class="san-box" @click="reservations()">
						<view class="j-icon" v-if="appAndPick.appointNum != 0">
							<text>{{appAndPick.appointNum }}</text>
						</view>
						<!-- 	<view >
						<view class="jbBox">
							 <u-badge :type="type" max="99" :value="value"></u-badge>
						</view>
					</view> -->
						<view class="cnm-icon">
							<image src="../../static/detection/gsjj.png" mode=""></image>
						</view>
						<text>预约记录</text>
					</view>

					<view class="san-box3" @click="gohomecar()">
						<view class="j-icon" v-if="appAndPick.pickNum != 0">
							<text>{{appAndPick.pickNum }}</text>
						</view>
						<view class="cnm-icon">
							<image src="../../static/detection/smqc.png" mode=""></image>
						</view>
						<text>上门取车</text>
					</view>
				</view>
				<view class="dqtime">
					<text>今天是{{dateStr || ''}} {{week || ''}} {{time||''}}</text>
				</view>

			</view>

		</view>
		<u-modal :show="show" :title="titlemodeal" confirmText="确定" @confirm="confirms">
			<scroll-view scroll-y style="height: 400px;">
				<view v-for="(item,index) in warnMsg " :key="index" style="margin-bottom: 10px;">
					<view style="font-weight: bold;">{{item.title || '系统维护中'}}: </view>
					<view style="font-size: 16px; color: #606266;">{{item.content || ''}}</view>
				</view>
			</scroll-view>
		</u-modal>
		<!-- 底部 -->
		<view style="width: 100%; height: 50px;"></view>
		<tabBar :msg="msg "></tabBar>
	</view>
</template>

<script>
	import request from '../../utils/request';
	import tabBar from '../../components/tabBar/tabBar.vue'
	import config from '@/config'
	export default {
		data() {
			return {
				msg: '1',
				warnMsg: [],
				chuan: '',
				titlemodeal: '通知',
				show: false,
				isWorking: false,
				user: {},
				baseUrl: '',
				animate: false,
				partnerId: '',
				threenum: {},
				showScroll: true,
				scrollDuration: 3000, // 滚动间隔时间，单位为毫秒
				items: [],
				ping: [],
				dateStr: '',
				week: '',
				is_mandatory: false,
				url: 'http://159.75.168.143:88/apk/lanan.apk',
				title: '版本升级',
				contents: '新版本上线了，根据您自己的选择是否升级',
				appAndPick: {
					appointNum: 0,
					pickNum: 0
				},
				baseImageUrl:this.$baseImageUrl

			}
		},
		onLoad() {
			this.baseUrl = this.$baseUrl
			let times = new Date()
			this.timeday = this.timeWeekFormat(times)

		},
		onShow() {
			this.getAppointAndPickNum()
			this.getindex()
			this.getwarnMsglist()
			this.getbottom()

		},
		components: {
			tabBar,
		},
		methods: {
			goshowMenu() {
				uni.navigateTo({
					url: '/pages/manage/manage'
				})

			},

			timeWeekFormat(times) {
				//定义一个日期对象;
				var dateTime = new Date(times);
				//获得系统年份;
				var year = dateTime.getFullYear();
				//获得系统月份;
				var month = dateTime.getMonth() + 1;
				//获得系统当月分天数;
				var day = dateTime.getDate();
				//获得系统小时;
				var hours = dateTime.getHours();
				//获得系统分钟;
				var minutes = dateTime.getMinutes();
				//获得系统秒数;
				var second = dateTime.getSeconds();
				//获得系统星期几;
				var dayCycle = dateTime.getDay();
				//使用数组更改日期样式;
				var dayCycleArray = ["日", "一", "二", "三", "四", "五", "六"];
				for (var i = 0; i < 7; i++) {
					if (dayCycle == i) {
						//将dayCycleArray的数赋值到系统星期几里面中去;
						dayCycle = dayCycleArray[i];
					}
				}
				month < 10 ? month = '0' + month : month;
				day < 10 ? day = '0' + day : day;
				hours < 10 ? hours = '0' + hours : hours;
				minutes < 10 ? minutes = '0' + minutes : minutes;
				second < 10 ? second = '0' + second : second;
				//打印完整的系统日期;
				this.dateStr = year + '-' + month + '-' + day + ' ';
				this.week = '星期' + dayCycle
				this.time = hours + ':' + minutes
				// return dateStr;
			},


			// 底部消息
			async getbottom() {
				let data = {
					partnerId: uni.getStorageSync('partnerId')
				}
				let res = await request({
					url: '/appInspection/news/newMsgNum',
					method: 'get',
					params: data
				})
				if (res.code == 200) {
					this.chuan = res.data
				}
			},
			async getAppointAndPickNum() {
				let res = await request({
					url: '/partnerOwn/partner/getAppointAndPickNum',
					method: 'get'
				})
				if (res.code == 200) {
					this.appAndPick = res.data
				}
			},
			async getwarnMsglist() {
				let res = await request({
					url: '/warnMsg/warnMsg/list',
					method: 'get',

				})
				if (res.code == 200) {
					this.warnMsg = res.data
					if (this.warnMsg && this.warnMsg.length > 0) {
						this.show = true
					}
				}
			},
			//初始化获取
			async getindex() {
				// 首页信息
				let res = await request({
					url: '/partnerOwn/partner/shopInfo',
					method: 'get',
				})
				this.user = res.data
				this.partnerId = res.data.partnerId
				uni.setStorageSync('partnerId', res.data.partnerId)
				if (res.data.isWorking == "0") {

					this.isWorking = false
				}
				if (res.data.isWorking == "1") {
					this.isWorking = true
				}
				// 中间统计
				let reszj = await request({
					url: '/partnerOwn/partner/statisticsInfo?partnerId=' + this.partnerId,
					method: 'get',
				})
				let nums = {
					orderAmount: reszj.data.orderAmount / 100,
					orderNum: reszj.data.orderNum,
					todayOrderAmount: reszj.data.todayOrderAmount / 100,
					todayOrderNum: reszj.data.todayOrderNum,
					workedNum: reszj.data.workedNum,
					workingNum: reszj.data.workingNum,
					srlNum: reszj.data.srlNum,
					hgNum: reszj.data.hgNum,

				}
				this.threenum = nums


				// 下方订单信息
				// let resxf = await request({
				// 	url:'/partnerOwn/partner/orderInfo?partnerId='+this.partnerId,
				// 	method: 'get',
				// })
				// this.items = resxf.data
				// 热销产品
				let resrx = await request({
					url: '/partnerOwn/partner/hotGoodsList?partnerId=' + this.partnerId,
					method: 'get',
				})
				this.ping = resrx.data
				// this.getswitch()
			},
			goindex() {
				uni.navigateTo({
					url: '/pages/index/index'
				})
			},
			reservations() {
				uni.navigateTo({
					url: "/pages/order/reservationlist",

				})
			},
			gostatistics() {
				uni.navigateTo({
					url: '/pages/statistics/statistics'
				})
			},
			goxiaoxi() {
				uni.navigateTo({
					url: '/pages/xiaoxi/xiaoxi'
				})
			},
			gorwm() {
				uni.navigateTo({
					url: '/pages/my/rwm'
				})
			},
			confirms() {
				this.show = false
			},
			gohomecar() {
				uni.navigateTo({
					url: '/pages/index/homecar'
				})
			},
			getswitch() {
				if (this.user.isWorking == "0") {
					this.isWorking = false
				}
				if (this.user.isWorking == "1") {
					this.isWorking = true
				}
			},
			async getying() {

				let data = {
					partnerId: this.partnerId
				}
				let res = await request({
					url: '/partnerOwn/partner/startOrEnd',
					method: 'post',
					params: data
				})
				this.getindex()
			},

			startScrolling() {
				this.showScroll = true;
				setInterval(() => {
					this.scrollItems();
				}, this.scrollDuration);
			},
			scrollItems() {
				this.items.push(this.items.shift());
			}
		}
	}
</script>

<style scoped lang="scss">
	.jbBox {
		width: 100px;
		height: 100px;
		background-color: #909193;
		border-radius: 15px;
	}

	.content {
		box-sizing: border-box;
		width: 100%;
		height: calc(100vh);
		// background-color: #F4F4F4;
		background-color: cornflowerblue;
		// background: url('http://www.nuoyunr.com/lananRsc/jcbjt.png') center no-repeat;
		background: url('../../static/detection/mybj.png') no-repeat;
		background-size: 100% 100%;
		position: relative;
	}

	.c-top {
		width: 100%;
		height: 283px;

	}

	.cnm-icon {
		width: 20px;
		height: 20px;
		margin-right: 5px;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.top-ail {
		width: 100%;
		box-sizing: border-box;
		padding: 20px;
	}

	.dix {
		display: flex;
		align-items: center;
	}

	.top-two {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.xzi {
		font-size: 12px;
		// margin-top: 10px;

	}

	.icon-img {
		margin-top: 10px;
		margin-left: 80px;
		width: 50px;
		height: 50px;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.touxiang {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		overflow: hidden;
		background-color: whitesmoke;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.t-title {
		font-size: 18px;
		font-weight: bold;
		color: #FFFFFF;
		margin-left: 5px;
	}

	.gangbox {
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-top: 10px;

	}

	.ang-box {
		width: 49%;
		box-sizing: border-box;
		padding: 15px;
		background-color: white;
		height: 100px;
		// display: flex;
		// align-items: center;
		// justify-content: center;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}

	.ang-box1 {
		width: 49%;
		box-sizing: border-box;
		padding: 15px;
		background-color: #d0e5ff;
		height: 130px;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}

	.ang-box2 {
		width: 49%;
		box-sizing: border-box;
		padding: 15px;
		background-color: #fdfcd4;
		height: 130px;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}

	.ang-box3 {
		width: 49%;
		box-sizing: border-box;
		padding: 15px;
		background-color: #ede6ff;
		height: 130px;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}

	.ang-box4 {
		width: 49%;
		box-sizing: border-box;
		padding: 15px;
		background-color: #c9f9af;
		height: 130px;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}

	.san-box {
		width: 30%;
		box-sizing: border-box;
		padding: 5px 0px;
		background-color: #eaf9e4;
		height: 60px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
		font-size: 12;
		position: relative;

	}

	.san-box3 {
		width: 30%;
		box-sizing: border-box;
		padding: 5px 0px;
		background-color: #ffeee6;
		height: 60px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
		position: relative;
	}

	.j-icon {
		position: absolute;
		width: 15px;
		height: 15px;
		display: flex;
		align-items: center;
		background: red;
		border-radius: 50%;
		justify-content: center;
		color: white;
		top: -5px;
		right: -5px;
		z-index: 999;
		font-size: 12px;

	}

	.san-box2 {
		width: 30%;
		box-sizing: border-box;
		padding: 5px 0px;
		background-color: #ffeeef;
		height: 60px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		margin-top: 10px;
		font-weight: bold;
	}



	.dqtime {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		margin-top: 15px;
		font-weight: bold;
		position: fixed;
		bottom: 55px;
		right: 10px;
	}

	.baizi {
		font-size: 14px;
		font-weight: 400;
		color: #FFFFFF;
	}

	.threebox {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 30px;
	}

	.t-box {
		width: 33%;
		text-align: center;
	}

	.xbai {
		font-size: 15px;
		font-weight: 400;
		color: #FFFFFF;
		margin-bottom: 5px;
	}

	.xxbai {
		font-size: 13px;
		font-weight: 400;
		color: #FFFFFF;
		margin-bottom: 15px;

	}

	.dbai {
		font-size: 25px;
		font-weight: 600;
		color: #FFFFFF;
		margin-bottom: 5px;
	}

	.t-bottom {
		width: 100%;
		z-index: 999;
		background: #FFFFFF;
		border-radius: 8px;
		box-sizing: border-box;
		padding: 15px;
		background-color: white;
		margin-top: 8px;

	}

	.x-title {
		font-size: 16px;
		font-weight: 600;
		color: #333333;
	}

	.jgbox {
		width: 42px;
		height: 42px;
		background: #EFF2FC;
		border-radius: 50%;

		margin-bottom: 5px;
		overflow: hidden;

		image {
			width: 100%;
			height: 100%;

		}
	}

	.bs-di {
		width: 100%;
		display: flex;
		align-items: center;
		font-size: 22px;
		justify-content: space-between;
	}

	.f-box {
		width: 25%;
		margin-bottom: 10px;
		text-align: center;
	}

	.fourbox {
		width: 100%;
		display: flex;
		// justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		margin-top: 20px;
	}

	.h-text {
		font-size: 13px;
		font-weight: 400;
		color: #333333;
	}

	.bai-box {
		width: 100%;
		// height: 121px;
		background: #FFFFFF;
		border-radius: 8px;
		margin: 0 auto;

		box-sizing: border-box;
		padding: 15px;
	}

	.hui-box {
		width: 100%;
		background: #E7E8FD;
		border-radius: 8px;
		margin: 0 auto;
		box-sizing: border-box;
		padding: 1px;
		margin-top: 15px;
		margin-bottom: 15px;
		margin-top: 160px;
	}

	.hui-top {
		box-sizing: border-box;
		padding: 15px;
	}

	.l-bai {
		width: 100%;
		height: 220px;
		box-sizing: border-box;
		padding: 15px;
		background: #FFFFFF;
		border-radius: 5px;
		white-space: nowrap;
		overflow: hidden;
	}

	.l-box {
		margin-top: 5px;
		width: 100%;
		border-bottom: 1px solid #EEEEEE;
	}

	.l-text {
		font-size: 15px;
		font-weight: 400;
		color: #333333;
		margin-bottom: 10px;
	}

	.time {
		font-size: 14px;
		font-weight: 400;
		color: #999999;
		margin-bottom: 10px;
	}

	.mubu {
		background-color: #F4F4F4;
		box-sizing: border-box;
		padding: 15px;
		z-index: -9;
	}

	.bottom-box {
		width: 100%;
		background-color: white;
		border-radius: 8px;
		margin: 0 auto;
		box-sizing: border-box;
		padding: 15px;

	}

	.x-top {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 14px;
		font-weight: 400;
		color: #666666;
		margin: 15px auto;
	}

	.x-cont {
		margin: 10px auto;
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.dix-zuo {
		width: 50%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.dix-you {
		width: 50%;
		display: flex;
		align-items: center;
		justify-content: space-between;

		.zuo {
			width: 50%;
			text-align: center;
		}

		.you {
			width: 50%;
			text-align: center;
		}
	}

	.jzuo {
		width: 50%;
		font-size: 15px;
		font-weight: 400;
		color: #333333;
		text-align: center;
	}

	.ju {
		width: 50%;
		text-align: left;
		font-size: 15px;
		font-weight: 400;
		color: #FF571A;
	}

	.paim {
		width: 15%;
		text-align: center;
	}

	.paim-you {
		width: 80%;
	}

	.v-icon {
		width: 30px;
		height: 30px;

		image {
			width: 100%;
			height: 100%;
		}
	}
</style>