front-end/ghsApp/src/admin/home/workbench.vue

<template>
<view>
  <block v-if="loginStyle  == 0">
	<!-- #ifdef MP-WEIXIN -->
    <view style="width:100vw;height:400upx;display:flex;align-items:center;justify-content:center;position:relative;">
      <view style="position:absolute;top:60upx;font-size:35upx;">
        <text style="color:#333333;margin-left:8upx;font-weight:bold;">花店买花点这里</text>
      </view>
      <button class="admin-button-com big blue" style="width:260upx;" @click="buyItem()">去买花</button>
    </view>
	<!-- #endif -->
    <view style="width:100vw;height:400upx;display:flex;align-items:center;justify-content:center;position:relative;">
	<!-- #ifdef MP-WEIXIN -->
      <view style="position:absolute;top:60upx;font-size:35upx;">
        <text style="color:#333333;margin-left:8upx;font-weight:bold;">批发店点这里登录</text>
      </view>
	<!-- #endif -->
    <button class="admin-button-com big blue" style="width:260upx;" @click="pageTo({url:'/admin/home/login'})">去登录</button>

	<text style="color:green;position:absolute;top:300upx;font-size:32upx;" @click="pageTo({url:'/admin/book/index'})">查看教学视频</text>

    </view>
  </block>
  <block v-else>

	<view class="app-main app-content">

<template v-if="(loginInfo.staff && loginInfo.staff.super && loginInfo.staff.super == 1) || (loginInfo.staff && loginInfo.staff.lookStat && loginInfo.staff.lookStat ==1)">

		<div class="user-wrap">
			<div class="user-top">
				<div class="app-size-28">今日概况</div>
				<text v-if="!$util.isEmpty(errorPirceList)" @click="showErrorPriceFn" 
				style="float:right;color:yellow;font-weight:bold;font-size:30upx;">价格异常，点击查看</text>
			</div>
			<div class="income-amount" @click="pageTo({url:'/admin/stat/kdIncome'})">
				<div>收入</div>
				<div class="price">{{ $util.numberFormat(data.todayData.income) }}</div>
			</div>
			<div class="user-bottom">
				<navigator class="info-list" url="/admin/custom/visit">
					<div class="info-list-name">访客</div>
					<div class="info-list-value">
						{{ $util.numberFormat(data.todayData.visitCustom) || 0 }}
					</div>
				</navigator>
				<navigator url="/admin/home/order" open-type="switchTab" class="info-list">
					<div class="info-list-name">订单</div>
					<div class="info-list-value">
						{{ $util.numberFormat(data.todayData.order) || 0 }}
					</div>
				</navigator>
				<navigator url="/admin/stat/wastage" class="info-list">
					<div class="info-list-name">损耗</div>
					<div class="info-list-value">
						{{ $util.numberFormat(data.todayData.wastage) || 0 }}
					</div>
				</navigator>
			</div>
		</div>
		<div class="module-com order-wrap" @click="pageTo({url:'/admin/stat/kdIncome'})">
			<div class="total-blo">
				<div class="total-list2"> 
					<div class="app-color-3">系统收款</div>
					<div class="list-num">
						<view>{{countStat.systemCount||0}}</view>
						<view>{{countStat.systemIncome?parseFloat(countStat.systemIncome):0}}</view>
					</div>
				</div>
				<div class="total-list2"> 
					<div class="app-color-3">线下微信</div>
					<div class="list-num">
						<view>{{countStat.kfWxCount||0}}</view>
						<view>{{countStat.kfWxIncome?parseFloat(countStat.kfWxIncome):0}}</view>
					</div> 
				</div>
				<div class="total-list2"> 
					<div class="app-color-3">现金</div>
					<div class="list-num">
						<view>{{countStat.cashCount||0}}</view>
						<view>{{countStat.cashIncome?parseFloat(countStat.cashIncome):0}}</view>
					</div> 
				</div>
				<div class="total-list2"> 
					<div class="app-color-3">欠款</div>
					<div class="list-num">
						<view>{{countStat.debtCount||0}}</view>
						<view>{{countStat.debtIncome?parseFloat(countStat.debtIncome):0}}</view>
					</div> 
				</div>
			</div>
		</div>

</template>

		<!-- 消息 -->
		<div class="module-com news-wrap">
			<div class="news-list" v-for="(item, index) in data.notice" :key="index" @click="pageToFn(item)" >
				<div class="news-left">
					<i class="iconfont iconxiaoxi2"></i>
					<span>{{ item.title }}</span>
				</div>
				<div class="news-right">
					<span>{{item.action}}</span>
					<i class="iconfont iconxiangyou"></i>
				</div>
			</div>
		</div>

		<view class="module-com">

			<!-- 个人和花店开单 -->
			<view class="tabs-head_bx">
				<image @click="skKd()" :src="isScanEnv ? skSrc3 : skSrc" mode="widthFix"></image>
				<image @click="customKd()" :src="isScanEnv ? pfSrc3 : pfSrc" mode="widthFix" ></image>				
			</view>
			
			<!-- 小按钮 -->
			<view class="tabs-wrap">
				<view class="tabs-list" v-for="(item, index) in tabsData" :key="index">
					<view @click="goPage(item)">
						<view class="tabs-img">
							<image :src="`${constant.imgUrl}/${item.img}`" alt mode="widthFix" ></image>
						</view>
						<view class="tabs-name">{{ item.name }}</view>
					</view>
				</view>
			</view>

		</view>

		<template v-if="(loginInfo.staff && loginInfo.staff.super && loginInfo.staff.super == 1) || (loginInfo.staff && loginInfo.staff.lookStat && loginInfo.staff.lookStat ==1)">
			<div class="module-com total-wrap">
				<div class="total-tit">总览</div>
				<div class="total-blo">
					<div class="total-list" v-for="(item, index) in overview" :key="index" @click="pageTo(item)">
						<div class="list-num">{{ $util.numberFormat(item.value) }}</div>
						<div class="app-color-3">{{ item.name }}</div>
					</div>
				</div>
			</div>
		</template>

	</view>
  </block>

	<uni-popup ref="errorPriceRef" background-color="#fff" type="center" :animation="false">
		<view style="padding-top:20upx;font-size:30upx;padding-bottom:20upx;">
			<view style="margin-bottom:10upx;" v-for="(errItem, errIndex) in errorPirceList" :key="errIndex">
				<text v-if="errItem.name">{{errItem.name}}</text>
				<text v-if="errItem.a" style="margin-left:18upx;">A级：¥{{errItem.a?parseFloat(errItem.a):0}}</text>
				<text v-if="errItem.b" style="margin-left:18upx;">B级：¥{{errItem.b?parseFloat(errItem.b):0}}</text>
				<text v-if="errItem.c" style="margin-left:18upx;">C级：¥{{errItem.c?parseFloat(errItem.c):0}}</text>
			</view>
			<view style="text-align:center;margin-top:20upx;">
				<button @click="closeErrorPriceFn" class="admin-button-com middle blue">知道了</button>
			</view>
		</view>
	</uni-popup>

</view>
</template>

<script>
import { mapGetters,mapActions } from "vuex";
import { getShopInfo } from "@/utils/auth";
import { consoleIndex } from "@/api/workbench";
import { closeBook } from "@/api/book";
import productMins from "@/mixins/product";
import { allProduct } from '@/api/product'
import {currentShop} from "@/api/shop";
import { getStat,getStrokeCount } from '@/api/console'
import autoUpdateMixins from "@/mixins/autoUpdate";
import { getWeixinId } from "@/api/invite/index";
import { getErrorPrice } from "@/api/item"
export default {
	name: "admin-workbench",
	components: { },
	mixins: [productMins,autoUpdateMixins],
	data() {
		return {
			getappIdList: {},
			skCustomId:0,
			data: {
				admin: {},
				asset: {},
				notice: {},
				todayData: { income:0.00, order:0, custom:0, expend:0.00 }
			},
			tabsData: [
				{ name: "商城", img: 'ghs/home/shop.png', url: "/admin/home/mall" },
				{ name: "改价", img: 'ghs/home/gj.png', url: "/admin/changePrice/list" },
				{ name: "花材", img: 'ghs/home/hcgl.png', url: "/admin/item/list" },
				{ name: "采购", img: 'ghs/home/icon_caigou.png', url: "/pagesPurchase/order" },
				{ name: "供货商", img: 'ghs/home/icon_ghs.png', url: "/pagesPurchase/supplier" },
				{ name: "损耗", img: 'ghs/home/kcyjs.png', url: "/admin/breakage/list" },
				{ name: "调拨入库", img: 'ghs/home/dbrk.png', url: "/pagesStorehouse/allot/allotPut" },
				{ name: "调拨出库", img: 'ghs/home/dbck.png', url: "/pagesStorehouse/allot/allotEx" },
				{name : "结账记录", img : "ghs/home/kcyjs.png", url : "/admin/clear/customList"},
				{name : "支出", img : "ghs/home/kcyjs.png", url : "/admin/expend/list"},
				{name : "盘点", img : "/ghs/home/pandian.png", url : "/pagesStorehouse/inventory/list"},
				{name : "库存预警", img : "/ghs/home/kcyjs.png", url : "/admin/item/list?warning=1"},
			],
			skSrc: `${this.$constant.imgUrl}/ghs/home/kj.png`,
			pfSrc: `${this.$constant.imgUrl}/ghs/home/pf.jpg`,
			skSrc3: `${this.$constant.imgUrl}/ghs/home/sk33.jpg`,
			pfSrc3: `${this.$constant.imgUrl}/ghs/home/pf3.jpg`,
			isScanEnv:false,
			isMini:0,
			todayDebt:0,
			totalDebt:0,
			countStat:{systemIncome:0,systemCount:0,debtCount:0,debtIncome:0,kfWxCount:0,kfWxIncome:0},
			overview:[],
			//登录状态 0未登录 1登录
			loginStyle :0,
			errorPirceList:[]
		};
	},
	onShareAppMessage(res) {
		if (res.target.id === "shareStore") {
			return { title: "商城分享", desc: "", imgUrl: "", path: `/admin/billing/customerPlace?shopId=${this.loginInfo.shopId}` }
		} else if (res.target.id === "sharePay") {
			return { title: "分享收款", desc: "", imgUrl: "", path: "pagesShare/pay" }
		}
	},
	computed: {
		...mapGetters({ loginInfo: "getLoginInfo" }),
		...mapGetters({ myShopInfo: "getMyShopInfo" }),
	},
	watch: {
		loginInfo(newVal) {
			if(!this.$util.isEmpty(newVal.admin) && newVal.admin.currentGhsShopId > 0){
				this.loginStyle = 1				
			}
		}
	},
	onLoad(option) {
		if(this.$util.isScanEnv()){
			this.isScanEnv = true
		}
	},
	onPullDownRefresh() {
		this.init();
		uni.stopPullDownRefresh();
	},
	onShow() {
		this.showShopName()
		if(!this.$util.isEmpty(this.loginInfo.admin) && this.loginInfo.admin.currentGhsShopId > 0){
			this.loginStyle  = 1
		}
	},
	methods: {
		...mapActions(['setUserShopAll']),
		showShopName(){
			currentShop().then(res => {
				if(res.code == 1){
					let sjName = res.data.merchantName ? res.data.merchantName : ''
					let shopName = res.data.shopName ? res.data.shopName : ''
					let title = shopName == '首店' ? sjName : sjName+' '+shopName
					 uni.setNavigationBarTitle({ title: title })
				}
			})
		},
		closeErrorPriceFn(){
			this.$refs.errorPriceRef.close()
		},
		showErrorPriceFn(){
			this.$refs.errorPriceRef.open('top')
		},
		goLjh(){
			let that = this
			// #ifdef MP-WEIXIN
			uni.navigateToMiniProgram({
				//姜枫-2021.04.13
				appId: that.getappIdList.hd.miniAppId,
				path: 'admin/ljh/info',
				//develop 开发版 trial 体验版 release 正式版
				envVersion: process.env.NODE_ENV === 'development' ? 'develop' : 'release',
				extraData: {},
				success (res) {
				}
			})
			// #endif
			// #ifdef APP-PLUS
			that.$msg("请用微信打开")
			// #endif
		},
		buyItem() {
			let that = this
			// #ifdef MP-WEIXIN
			uni.navigateToMiniProgram({
				//姜枫-2021.04.13
				appId: that.getappIdList.hd.miniAppId,
				path: 'admin/home/workbench',
				//develop 开发版 trial 体验版 release 正式版
				envVersion: process.env.NODE_ENV === 'development' ? 'develop' : 'release',
				extraData: {},
				success (res) {
				}
			})
			// #endif
			// #ifdef APP-PLUS
				that.$msg("请用微信打开")
			// #endif
		},
		closeBook(){
			let that = this
			that.$util.confirmModal({title:"确定关闭？",content:'关闭后可以在底部菜单【我的】，找到【使用教程】重新打开'},() => {
				closeBook().then((res) => {
					//有多处相似地方，请全项目搜索about_store_clear
					// #ifdef MP-WEIXIN
					that.$store.commit("setLoginInfo", {})
					that.$util.pageTo({url: "/admin/home/workbench",type: 3})
					// #endif
					// #ifdef APP-PLUS
					this.$store.commit("setLoginInfo", {})
					this.$store.commit("setDictionariesInfo", {})
					this.$store.commit("setMyShopInfo", {})
					plus.runtime.restart()
					// #endif
				})
			})
		},
		customKd(){
			this.pageTo({ url: '/admin/custom/selectCustom',query: {style:1}})
		},
		skKd(){
			let that = this
			let currentId = 0;
			if(this.skCustomId > 0){
				currentId = this.skCustomId
			}
			if(!this.$util.isEmpty(this.loginInfo.skCustomId) && this.loginInfo.skCustomId > 0){
				currentId = this.loginInfo.skCustomId
			}
			if(currentId > 0){
				if(this.$util.isScanEnv()){
					this.$util.pageTo({url: "/admin/billing/affirm",query: {customId: currentId}})
				}else{
					this.$util.pageTo({url: "/admin/billing/index",query: {customId: currentId}})
				}
			}else{
				that.$util.confirmModal({content:'请设置快捷开单的门店',okText:'好的',cancelText:'取消'},() => {
					that.$util.pageTo({url: '/admin/shop/sk'})	
				})
			}
		},
		init() {
			this.setIndex()

			let that = this

			getStrokeCount().then(res=>{
				if(res.code == 1){
					this.countStat = res.data
				}
			})

			getStat().then(res=>{
				if(res.code == 1){
					that.todayDebt = res.data.todayDebt ? parseFloat(res.data.todayDebt) : 0
					that.totalDebt = res.data.totalDebt ? parseFloat(res.data.totalDebt) : 0
					that.overview = res.data.overview
				}
			})

			this.showShopName()

			getWeixinId().then(res => {
				this.getappIdList = res.data
			})

			//是否有C级价格比B级和A级贵的情况
			getErrorPrice().then(res=>{
				let that = this
				if(res.code == 1){
					that.errorPirceList = res.data.list
				}
			})

		},
		setIndex(){
			// #ifdef MP-WEIXIN
			this.isMini = 1
			// #endif
			consoleIndex({isMini:this.isMini}).then(res => {
				this.data = res.data;
				const { menu } = res.data;
				this.tabsData = menu
			})
		},
		goPage (item) {
			this.$util.pageTo(item)
		},
		pageToFn(item) {
			this.$util.pageTo({url: item.page})
		},
		pageToNewOrderList(item) {
			this.$util.pageTo({url: "newOrderList?type="+item,type:1})
		}
	}
};
</script>

<style lang="scss" scoped>
.app-content {
	padding-bottom: 10upx;
}
.module-com {
	margin-bottom: 20upx;
	background-color: #fff;
}
// 用户信息
.user-wrap {
	padding: 20upx 30upx 34upx 30upx;
	color: #fff;
	text-align: center;
	background-image: url("../../static/images/admin/bg.png");
	background-size: 100% 380upx;
	background-repeat: no-repeat;
	.user-top {
		@include disFlex(center, space-between);
		.open-bt_bx {
			display: flex;
			align-items: center;
			line-height: 1upx;
			& > button {
				padding:0;
				line-height: auto;
				background-color: transparent;
				border: 1upx solid #ffffff;
				border-radius: 22upx;
				padding: 10upx 17upx!important;
				font-size: 24upx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #ffffff;
				& > .iconfont {
					font-size: 25upx;
					padding-right: 10upx;
          margin-top: -3upx;
				}
			}
		}
	}
	.income-amount {
		margin-top: 36upx;
		margin-bottom: 37upx;
		.price {
			font-size: 50upx;
			font-weight: bold;
			margin-top: 4upx;
		}
	}
	.user-bottom {
		@include disFlex(center, space-around);
		.info-list-name {
			color: #bfd4ff;
		}
		.info-list-value {
			font-size: 36upx;
			font-weight: bold;
			margin-top: 4upx;
		}
	}
}
// 消息
.news-wrap {
	.news-list {
		@include disFlex(center, space-between);
		padding: 25upx 24upx 25upx 30upx;
		border-bottom: 1upx solid $borderColor;
		font-size: 26upx;
		color: $fontColor2;
		&:active {
			background-color: $backColor;
		}
		& > div {
			@include disFlex(center, flex-start);
		}
		.news-left {
			font-size:30upx;
			.iconfont {
				color: $mainColor;
				margin-right: 10upx;
				font-size:29upx;
			}
		}
		.news-right {
			font-size:30upx;
			color: $mainColor;
			transform: scale(0.9);
			@include disFlex(flex-end, flex-start);
			.iconfont {
				font-size: 32upx;
				margin-left: 10upx;
			}
		}
	}
}
// 总览
.total-wrap,
.order-wrap {
	.total-tit {
		padding: 18upx 0 18upx 20upx;
		border-bottom: 1upx solid $borderColor;
		font-weight: 600;
		font-size: 24upx;
		color: #333333;
	}
	.total-blo {
		@include disFlex(center, space-between);
		flex-wrap: wrap;
		padding: 20upx 0 0;
		.total-list {
			width: 33%;
			text-align: center;
			margin: 20upx 0upx;
			border-right: 1upx solid $borderColor;
			.list-num {
				margin-bottom: 8upx;
				font-size: 36upx;
				font-weight: bold;
			}
		}
		.total-list:nth-child(3n) {
			border-right: none;
		}
		.total-list:nth-child(n + 4) {
			padding-bottom: 0;
		}

		.total-list2 {
			width: 24%;
			text-align: center;
			margin: 20upx 0upx;
			border-right: 1upx solid $borderColor;
			.list-num {
				margin-top:10upx;
				margin-bottom:8upx;
				font-size:26upx;
				font-weight:normal;
			}
		}
		.total-list2:nth-child(4n) {
			border-right: none;
		}
		.total-list2:nth-child(n + 4) {
			padding-bottom: 0;
		}

	}
}
.tabs-head_bx {
	display: flex;
	align-items: center;
	padding: 20upx 15upx 10upx 15upx;
}
// tabs
.tabs-wrap {
	padding: 20upx 10upx;
	@include disFlex(center, flex-start);
	flex-wrap: wrap;
	.tabs-list {
		width: 25%;
		margin-top: 50upx;
		text-align: center;
		.tabs-img {
			width: 100upx;
			height: 100upx;
			margin: 0 auto;
			img {
				height: 100%;
			}
		}
		.tabs-name {
			color: #444444;
			margin-top: 10upx;
		}
		&:nth-child(-n + 4) {
			margin-top: 0;
		}
	}
}
// 遮罩层
.renew-wrap {
	text-align: center;
	.renew-wrap-text {
		margin-top: 30upx;
		margin-bottom: 60upx;
		font-size: 34upx;
	}
}
</style>