yl-gzh/pages/accounting/accounting.vue

<template>
	<view class="mainBox">
		<view class="uni-padding-wrap uni-common-mt" style="margin: 10px;">
			<uni-segmented-control :current="current" :values="items" style-type="button" active-color="#007aff"
				@clickItem="onClickItem" />
		</view>
		<view v-if="current===0">
			<uni-card>
				<uni-forms ref="baseForm" label-position="left">
					<uni-forms-item label="姓名">
						<uni-easyinput v-model="form.lrXm" placeholder="请输入姓名" @input="fiflterData" />
					</uni-forms-item>
					<uni-forms-item label="用餐时间">
						<uni-datetime-picker type="date" :clear-icon="false" v-model="form.ychz" @change="getList()" />
					</uni-forms-item>
				</uni-forms>
				<view class="flexStyle">
					<view class="boxStyle">消费人次：{{this.total}}次</view>
					<view class="boxStyle">消费金额：{{this.allPrice}}元</view>
					<view class="boxStyle">优惠次数：{{this.btcs}}次</view>
					<view class="boxStyle">优惠金额：{{this.allYhje}}元</view>
				</view>
				<!-- <button type="primary" class="buttonStyle" @click="search()">搜索</button> -->
			</uni-card>
			<uni-card style="height: 60vh;overflow-y: auto;">
				<uni-card  v-for="(item,index) in tableData" :key="index" :title="item.xm" :isFull="true" :sub-title="item.lrCydh" :extra="item.jylx"
					style="margin-top: 10px;margin-bottom: 20px;"
					:thumbnail="config.baseUrl+item.zpurl">
					<view class="flexStyle">
						<view class="boxStyle">用餐金额：{{item.ycje}}元</view>
						<view class="boxStyle">优惠金额：{{item.yhje}}元</view>
						<view class="boxStyle2">优惠类型：{{item.ssqhMc}}</view>
						<view class="boxStyle2">用餐时间：{{item.ycsj}}</view>
					</view>
				</uni-card>
			</uni-card>
		</view>
		<view v-if="current===1">
				<uni-card>
			<uni-forms ref="baseForm" label-position="top">
				<uni-forms-item label="用餐时间">
					<uni-datetime-picker type="daterange" :clear-icon="false" v-model="ychz" @change="getList2()" />
				</uni-forms-item>
			</uni-forms>
			<!-- <button type="primary" class="buttonStyle" @click="search()">搜索</button> -->
			</uni-card>
			<uni-card style="height: 70vh;overflow-y: auto;">
			<uni-card  v-for="(item,index) in tableData2"  :key="index"   :title="item.label" :isFull="true" :extra="item.value1+'人用餐'"
				style="margin-top: 10px;margin-bottom: 20px;">
				<!-- <view class="flexStyle"> -->
					<!-- <view>用餐人次：28186次</view> -->
					<view>用餐金额：{{item.value2}}元</view>
					<view>优惠金额：{{item.value3}}元</view>
					<view >实际消费金额：{{item.value4}}元</view>
				<!-- </view> -->
			</uni-card>
			</uni-card>
		</view>
	</view>
</template>

<script>
	import {
		getUser
	} from '@/common/auth.js'
	import {
		ycListByLnst,getstatisticaldata
	} from '@/api/kh.js'
	import {
		decryptRowData_ECB
	} from '@/common/sm4.js'

	export default {
		components: {},
		data() {
			return {
				items: ['用餐对账', '用餐信息统计'],
				current: 0,
				status: 'more',
				isShow: false,
				ychz:[],
				form:{
					stbm: '',
					lrXm: '',
					ychz: '',
				},
				queryParams:{
					 dictType: 'ST014',
					 para1: null,
				     para2: null,
					 para3:'1' ,
					 para4:'',
				},
				tableData: [],
				oldtableData: [],
				tableData2:[],
				total: 0,
				allPrice:0,
				allYhje:0,
				btcs:0,
			}
		},
		onLoad: function(options) {
			this.userInfo = getUser()
			this.form.stbm = this.userInfo.stbm;
			this.queryParams.para4=this.userInfo.stbm;
			this.form.ychz = this.getCurrentDate();
			this.getCurrentDate2();
			this.getList()
			this.getList2()
		},

		methods: {
			onClickItem(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
				}
			},
			getCurrentDate2(){
				 const dateMat = new Date();
				    const yearA = dateMat.getFullYear();
				    const monthA = dateMat.getMonth() + 1 > 9 ? dateMat.getMonth() + 1 : '0' + (dateMat.getMonth() + 1);
				    const dayA = dateMat.getDate() > 9 ? dateMat.getDate() : '0' + dateMat.getDate();
				    let year = dateMat.getFullYear();
				    let month = dateMat.getMonth(); // 月份从0开始，即0代表1月，1代表2月，依此类推
				    let day = dateMat.getDate();
				
				    // 如果是1月，设置年份为去年，月份为11（12-1）
				    if (month === 0) {
				      year -= 1;
				      month = 11;
				    } else {
				      month -= 1; // 否则，月份减1
				    }
				
				    // 计算上个月的日期，如果当前是月末，取上个月的最后一天
				    if (day === new Date(year, month + 1, 0).getDate()) {
				      day = new Date(year, month, 0).getDate(); // 获取上个月的最后一天
				    }
				
				    // 格式化日期
				    const monthStr = month + 1 > 9 ? month + 1 : '0' + (month + 1);
				    const dayStr = day > 9 ? day : '0' + day;
				    this.queryParams.para1 = year +'-'+ monthStr +'-'+ dayStr;
				    this.queryParams.para2 = yearA + '-'+monthA + '-'+dayA;
					this.ychz=[this.queryParams.para1,this.queryParams.para2]
			},
			getCurrentDate() {
				const date = new Date();
				const dateMap = {
					year: date.getFullYear(),
					month: date.getMonth() + 1,
					day: date.getDate(),
				};
				const month = dateMap.month >= 10 ? dateMap.month : "0" + dateMap.month;
				const day = dateMap.day >= 10 ? dateMap.day : "0" + dateMap.day;
				return dateMap.year.toString() + '-' + month.toString() + '-' + day.toString();
			},
			search() {
				this.dataList = []
				this.getList()
			},
			fiflterData(event){
				if(event)
				{
					this.tableData=[];
					this.oldtableData.map(item=> {
						if(item.xm.indexOf(event)!==-1){
							this.tableData.push(item)
						}
					})
				}else
				{
					this.tableData=JSON.parse(JSON.stringify(this.oldtableData))
				}	
			},
			getList() {
				this.total=0;
				this.btcs=0;
				this.allPrice=0;
				this.allYhje=0;
				this.form.lrXm='';
				uni.showLoading({
					title: '加载中...',
					mask: true,
				})
				ycListByLnst({
					...this.form,
					ychz: this.form.ychz.replace(new RegExp('-', 'g'), '')
				}).then(res => {
					uni.hideLoading();
				if (res.code == 200) {
				let list = decryptRowData_ECB(res.rows, ["xm","lrCydh"], [1,4])
				this.tableData=list.map(item=>{
					this.allPrice+=Number(item.ycje);
					this.allYhje+=Number(item.yhje);
					if(item.btlx!=='2200000'){ this.btcs++; }
					
					return {...item,ycsj:this.special(item.ycsj)}
				});
				 this.oldtableData=JSON.parse(JSON.stringify(this.tableData))
				 this.total = res.total;
				}
				})
			},
			special(data){
				  let time="";
				  if(data&&data.length>=14)
				  {
				    time=data.slice(0,data.length-10)+'-'+data.slice(-10,-8)+'-'+data.slice(-8,-6)
				    time+=" "+data.slice(-6,-4)+':'+data.slice(-4,-2)+':'+data.slice(-2)
				  }
				  return time;
			},
			getList2(){
				uni.showLoading({
					title: '加载中...',
					mask: true,
				})
				getstatisticaldata({
					...this.queryParams,
					para1: this.ychz[0].replace(new RegExp('-', 'g'), ''),
					para2: this.ychz[1].replace(new RegExp('-', 'g'), ''),
				}).then(res => {
					uni.hideLoading();
				if (res.code == 200) {
					this.tableData2=res.data[1].rowList.map(item=>{
						return{label:item[0],value1:item[1],value2:item[2],value3:item[3],value4:item[4]}
					})
				}
				})
			}
		},
		watch: {},
	}
</script>

<style lang="scss" scoped>
	.mainBox {
		height: 100vh;
		width: 100%;
		overflow: hidden;
	}

	.uni-forms-item {
		margin-bottom: 12px;
	}

	.buttonStyle {
		height: 40px;
		line-height: 40px;
	}

	.flexStyle {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;

		.boxStyle {
			margin-bottom: 8px;
			width: 50%;
		}
		.boxStyle2 {
			margin-bottom: 8px;
			width: 100%;
		}
	}

	.item-right {
		width: 60px;
		display: flex;
		flex-direction: column;
		background-position: left;
		background-size: 58px 58px;
		background-repeat: no-repeat;
		position: relative;
		font-size: 14px;

		.item-img {
			position: absolute;
			right: -5px;
			bottom: -10px;
			height: 40px;
			width: 40px;
		}
	}
</style>