pet_server/pages/index/index.vue

<template>
	<view class="content">
		<uHeader ref="toRefresh" :userinfo="userinfo" />
		<!-- 卡片 -->
		<view class="card">
			<view class="title">
				待办事项
			</view>
			<view class="row">
				<view class="col"  @click="goToReFund(1)">
					<view class="item-title">
						待结算(笔)
					</view>
					<view class="item-num">
						{{data.settle}}
					</view>
				</view>
				<view class="col"  @click="goToReFund(2)">
					<view class="item-title">
						待处理的反馈建议(条)
					</view>
					<view class="item-num">
						{{data.feedback}}
					</view>
				</view>
			</view>
			<view class="row">
				<view class="col" @click="goToReFund(3)">
					<view class="item-title">
						待处理的退款(笔)
					</view>
					<view class="item-num">
						{{data.refund}}
					</view>
				</view>
				<view class="col"  @click="goToReFund(4)">
					<view class="item-title">
						售后管理(条)
					</view>
					<view class="item-num">
						{{data.service}}
					</view>
				</view>
			</view>
		</view>

		<view class="card">
			<view class="title">
				资金流水
			</view>
			<view class="row">
				<view class="col" @click="goToTurnOver(1)">
					<view class="item-title">
						今日营业额(元)
					</view>
					<view class="item-num">
						{{data.today_turnover}}
					</view>
				</view>
				<view class="col" @click="goToTurnOver(2)">
					<view class="item-title">
						今日结算金额(元)
					</view>
					<view class="item-num">
						{{data.today_settled}}
					</view>
				</view>
			</view>
			<view class="row">
				<view class="col" @click="goToTurnOver(3)">
					<view class="item-title">
						今日盈利明细(元)
					</view>
					<view class="item-num">
						{{data.today_profit}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uHeader from '../../components/u-header.vue'
	export default {
		components: {
			uHeader
		},
		data() {
			return {
				userinfo: {},
				// 表格数据
				data: {},
			}
		},
		onShow() {
			this.getDo()
		},
		methods: {
			// 获取代办事项信息
			getDo() {
				this.request("/admin_order/do", {}, "GET").then(res => {
					console.log(res)
					if (res.code === 1) {
						this.data = res.data
					}
				})
			},
			// 点击前往营业额
			goToTurnOver(type) {
				if(type === 3){
					uni.navigateTo({
						url:"/pages/turnover/info"
					})
				}
				uni.navigateTo({
					url: "/pages/turnover/turnover?type=" + type
				})
			},
			// 前往退款
			goToReFund(type) {
				uni.navigateTo({
					url: "/pages/refund/refund?type=" + type
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		z-index: 99;
		background-color: #F8F8F8;
		min-height: 100vh;
		padding-top: 180rpx;

		.card {
			width: 90%;
			border-radius: 20rpx;
			padding: 20rpx;
			background-color: #FFFFFF;
			margin-bottom: 60rpx;

			.title {
				font-size: 15px;
				font-family: PingFang SC;
				font-weight: 500;
				line-height: 21px;
				color: #000000;
				text-align: center;
			}

			.row {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				margin-top: 40rpx;

				.col {
					width: 50%;

					.item-title {
						font-size: 13px;
						font-family: PingFang SC;
						font-weight: 400;
						line-height: 20px;
						color: #707070;
					}

					.item-num {
						font-size: 20px;
						font-family: PingFang SC;
						font-weight: 600;
						line-height: 28px;
						color: #111111;
					}
				}
			}
		}
	}
</style>