LSM_OIL_SITE/packageChart/operation-analysis/operation-analysis.vue

<template>
	<view class="page-content my-bg">
		<cu-custom class="main-topbar bg-main-oil" bgColor="bg-main-oil" :isBack="true">
			<block slot="content">经营分析</block>
			<block slot="backText" class="back-text">返回</block>
		</cu-custom>

		<view class="main-money bg-main-oil">
			<view class="padding-xs flex align-center">
				<view class="flex-sub text-center padding-top-lg">
					<view class="txet-xxs">
						<text class="text-white">昨日交易金额(元)</text>
					</view>
					<view class=" text-sl padding padding-top-xs"><text class="text-white">￥{{basicData.totalMoney|numberFilter}}</text></view>
				</view>
			</view>
		</view>

		<view class="bg-main-oil bg-main-color  main-money">

		</view>
		<view class="bg-white radius  margin-left margin-right to-top">
			<view class=" flex ">
				<view class="padding text-center flex-sub" @tap="routerTo('/packageOrders/pages/orderList/dailyOrder/dailyOrder')">
					<text>交易笔数</text>
					<view class="padding-sm">
						<text class="oil-main-color">{{basicData.totalCount}}</text>
					</view>
					<!-- 	<button class="cu-btn bg-main-oil  text-white text-sm ">
						查看明细
					</button> -->
				</view>
				<view class="padding text-center flex-sub">
					<text>顾客数</text>
					<view class="padding-sm">
						<text class="oil-main-color">{{basicData.customerCount}}</text>
					</view>
					<!-- <button class="cu-btn bg-main-oil  text-white text-sm ">
						查看明细
					</button> -->
				</view>
			</view>
		</view>
		<view class="margin">
			<view class="cu-list menu-avatar radius">
				<view class="cu-item" @tap="routerTo('/packageChart/operation-analysis/analysis/daily')">
					<view class="cu-avatar  lg" :style="'background-image: url('+mainURL+'rb.png)'">
					</view>
					<view class="content ">
						<text>经营分析——日报</text>
					</view>
					<view class="action">
						<button class="cu-btn padding-left-xs padding-right-xs bg-white">
							<text class="cuIcon-right"></text>
						</button>
					</view>

				</view>
				<view class="cu-item" @tap="routerTo('/packageChart/operation-analysis/analysis/monthly')">
					<view class="cu-avatar  lg" :style="'background-image: url('+mainURL+'yb.png)'">
					</view>
					<view class="content">
						<text> 经营分析——月报</text>
					</view>
					<view class="action ">
						<button class="cu-btn padding-left-xs padding-right-xs bg-white" @tap="routerTo('path')">
							<text class="cuIcon-right"></text>
						</button>
					</view>

				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import staffApi from '@/packageStaff/api/staff.js'
	import cloudSiteApi from '@/api/cloud-site.js'
	import oliSiteApi from '@/api/oli-site.js'
	export default {
		data() {

			return {
				mainURL: this.global.mainURL,
				basicData: {
					totalAccount: 0,
					totalAmout: 0,
					totalCount: 0
				},
				scanUrl: '',
				userMenu: uni.getStorageSync('userMenu'),
				loginUser: uni.getStorageSync('loginUser'),
				title: 'Hello',
				cuIconList: [],
				channelId:uni.getStorageSync('channelId')
			};
		},

		onShow() {
			this.getYesterday()
		},
		onPullDownRefresh() {
			this.getYesterday()
		},
		filters: {
			numberFilter(value) {
				if (value) {
					value = value - 1 + 1
					return value.toFixed(2)
				} else {
					return '0.00'
				}

			}
		},
		methods: {
			getSiteInfo() {
				cloudSiteApi.getSiteDetail().then(res => {
					if (res.code === 20000) {
						this.site = res.data.site
						this.oilList = res.data.oil
						uni.setStorage({
							key: 'oilSite',
							data: res.data.site
						})
					}
				})
			},
			getYesterday() {
				oliSiteApi.getYesterdayOrderInfo(this.channelId).then(res => {
					uni.stopPullDownRefresh()
					if (res.code === 20000) {
						this.basicData = res.data.info
					}
				})
			},
			scanQr() {
				var that = this
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						uni.setStorageSync('qrCode', res.result)
						uni.navigateTo({
							url: that.scanUrl,
							fail: (err) => {
								console.log(err)
							},
							success: (res) => {
								console.log('chengg', res)
							}
						})
					}
				})
			},
			// 方便开发
			// scanQr() {
			// 	uni.setStorageSync('qrCode', 'XM&1299257961238990848')
			// 	uni.navigateTo({
			// 		url: '/pages/stationDetail/stationDetail',
			// 		fail: (err) => {
			// 			console.log(err)
			// 		},
			// 		success: (res) => {
			// 			console.log('chengg', res)
			// 		}
			// 	})

			// },
			routerTo(url, name) {

				uni.navigateTo({
					url: url
				})
			}
		}
	};
</script>

<style scoped>
	.bottom-bar {
		position: relative;
		padding-top: 50px;
		margin-bottom: 0;
		margin-top: 0;
	}

	.bottom-bar-fixed {
		position: fixed;
		bottom: 0;
		padding-top: 70rpx;
		width: 100%;
	}

	.main-money {
		position: relative;
		z-index: 1;
	}

	.van-tag {
		display: inline-block;
		padding: 0.3rem 0.4rem;
		position: absolute;
		right: 1px;
		font-size: 12px;
		top: 25%;
		background-color: #b9ffca;
		border-radius: 10rem 0 0 10rem;
		border-color: transparent;
	}

	.bg-main-color {
		min-height: 160rpx;
	}

	.to-top {
		position: relative;
		top: -140rpx;
		z-index: 1;
	}

	.cu-list {
		position: relative;
		top: -140rpx;
		z-index: 1;
	}

	.cu-list.grid>.cu-item [class*=cuIcon] {
		font-size: 75rpx;
	}

	.cu-avatar {
		background-color: transparent;
	}
</style>