销售

ghsApp/src/admin/statistics/sale.vue

@@ -0,0 +1,283 @@
+<template>
+	<view class="ex-page">
+		<view class="top-bar">
+			<DorpdownSelect class="bar"
+				:menuObj="menuTimeObj"
+				:selectItemId.sync="selectTimeId"
+				:typeTime="true"
+				:typeSelect="1" top="0px"
+				@selectSussess="selectSussess" />
+			<DorpdownSelect class="bar"
+				:menuObj.sync="menuObj"
+				:selectItemId.sync="shopId"
+				top="0"
+				@selectSussess="selectShopSussess" />
+		</view>
+		<scroll-view scroll-y scroll-with-animation class="main-view">
+			<view class="space-view ex-table">
+				<block>
+					<t-table :headerBackgroundColor="'#F0F2F6'">
+						<t-tr header>
+							<t-th>类型</t-th>
+							<t-th>金额</t-th>
+							<t-th>操作</t-th>
+						</t-tr>
+
+						<t-tr v-for="(item, index) in profit.income" :key="index">
+							<t-td><view>{{item.name}}</view></t-td>
+							<t-td><view>{{item.amount}}</view></t-td>
+							<t-td><view></view></t-td>
+						</t-tr>
+
+						<t-tr v-for="(item, index) in profit.expend" :key="index">
+							<t-td><view>{{item.name}}</view></t-td>
+							<t-td v-if="item.amount==0"><view>0</view></t-td>
+							<t-td v-else><view>-{{item.amount}}</view></t-td>
+							<t-td><view></view></t-td>
+						</t-tr>
+
+						<t-tr>
+							<t-td align="center"><view style="font-weight:bold;color:black;">合计：{{profit.balance||0}}</view></t-td>
+						</t-tr>
+
+					</t-table>
+				</block>
+			</view>
+		</scroll-view>
+		<!--		时间段选择-->
+		<rangeDatePick
+			:show="isShow"
+			start="2000-01-01"
+			end="2200-12-01"
+			:value="customizationTime"
+			@change="timeChange"
+			@cancel="timeCancel"
+			themeColor="#4C83D6" fields="day"></rangeDatePick>
+      <!-- <kd-entrance></kd-entrance> -->
+	</view>
+</template>
+<script>
+const Month = (new Date().getMonth()+1)<10?'0'+(new Date().getMonth()+1):new Date().getMonth()+1
+const time = `${new Date().getFullYear()}-${Month}-${new Date().getDate()}`;
+import AppWrapperEmpty from "@/components/app-wrapper-empty";
+import SelectList from "@/components/plugin/selectList";
+import { getStatProfit } from "@/api/statistics/index";
+import { list,selectShop } from "@/mixins";
+import DorpdownSelect from "@/components/module/dorpdownSelect";
+import rangeDatePick from '@/components/pyh-rdtpicker/pyh-rdtpicker.vue';
+import {mapActions, mapGetters} from "vuex";
+export default {
+	components: { SelectList, AppWrapperEmpty,DorpdownSelect,rangeDatePick },
+	mixins: [list,selectShop],
+	computed: {		...mapGetters(["getDictionariesInfo","getLoginInfo"])	},
+	data() {
+		return {
+			isShow:false,
+			customizationTime:'',
+			menuTimeObj:'',//时间分类-类型
+			menuShopObj:'',//门店分类-类型
+			selectTimeId:'',//选择时间id
+			shopId:'',//选择分店id
+			itemId:'',
+			selectListData: [
+				{
+					title: "时间",
+					key: "time",
+					default: "1",
+					data: [
+						{
+							name: "下午",
+							value: "1"
+						}
+					]
+				},
+				{
+					title: "全部",
+					key: "shopId",
+					default: "01",
+					data: [
+						{
+							name: "瑞景店",
+							value: "01"
+						},
+						{
+							name: "加州店",
+							value: "02"
+						}
+					]
+				}
+			],
+			nowTime: "",
+			showTimeDropdown: false,
+			nowShop: "",
+			showShopDropdown: false,
+			columns: [
+				{
+					name: "姓名",
+					dataIndex: "name",
+					color: "info"
+				},
+				{
+					name: "开单额",
+					dataIndex: "amount",
+					color: "info",
+					width: 120,
+					align: "center"
+				},
+				{
+					name: "开单数",
+					dataIndex: "num",
+					color: "info",
+					align: "center"
+				}
+			],
+			dataList: [],
+			params:{
+				itemId: '',
+				searchTime:'',
+				startTime: "",
+				endTime: "",
+				shopId: "",
+			},
+			profit:[],
+		};
+	},
+	onPullDownRefresh() {
+		this.resetList();
+		this._list().then(res => {
+			uni.stopPullDownRefresh();
+		});
+	},
+	onLoad(e) {
+		this.itemId = e.id;
+		this.params.itemId = e.id;
+		let dateDefaultOption = [];
+		let list = this.getDictionariesInfo.dateDefaultOption;
+		for (let i=0;i<list.length;i++){
+			dateDefaultOption.push({name:list[i].name,id:list[i].value})
+		}
+		this.menuTimeObj = {title:'时间',titleChild:'时间',list: dateDefaultOption};
+		this.shopId = this.getLoginInfo.shopId;
+	},
+	methods: {
+		...mapActions(['setUserShopAll']),
+		// 选择分店
+		selectShopSussess(val){
+			this.params.shopId = val.selectItem.id;
+			this.init();
+		},
+		//选择时间
+		selectSussess(val) {
+			this.params.selectTime = this.selectTimeId;
+			if(val.select=='自定义'){
+				this.selectTime();
+			}else{
+				this.init();
+			}
+		},
+		//选择时间-自定义时间
+		selectTime(){
+			this.customizationTime = [time,time],
+				this.isShow = true;
+		},
+		//选择自定义时间确定
+		timeChange(e){
+			this.isShow = false;
+			this.params.startTime = e[0]
+			this.params.endTime = e[1]
+			this.init();
+		},
+		//选择自定义时间取消
+		timeCancel(e){this.isShow = false;},
+		async init() {
+			this._list();
+		},
+		_list() {
+			let that = this
+			getStatProfit(this.params).then(res => {
+				that.profit = res.data
+			});
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.ex-page {
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	.top-bar {
+		position: absolute;
+		left: 0;
+		display: flex;
+		width: 100%;
+		// box-shadow: 0 5upx 5upx 5upx rgba($color: #000000, $alpha: 0.2);
+		z-index: 20;
+		.bar{
+			width: 50%;
+			height: 100%;
+			text-align: center;
+			&:nth-child(1){
+				border-right: 1px solid #eeeeec;
+			}
+		}
+	}
+	.main-view {
+		margin-top: 80upx;
+		flex: 1;
+		background-color: #f9fbfc;
+		.space-view {
+			background-color: #fff;
+		}
+		.ex-info {
+			padding: 30upx;
+			.info-cell {
+				display: flex;
+				align-items: center;
+				font-size: 28upx;
+				&:not(:first-child) {
+					margin-top: 20upx;
+				}
+				.cell-label {
+					width: 110upx;
+					color: #666666;
+				}
+				.cell-value {
+					margin-left: 40upx;
+					color: #333;
+					&.warning {
+						color: #ffaf1d;
+					}
+					&.success {
+						color: #27c325;
+					}
+				}
+			}
+		}
+		.ex-table {
+			/deep/.icon-info {
+				color: #333333;
+			}
+		}
+	}
+	.bar-view {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 30upx;
+		width: 100%;
+		height: 100upx;
+
+		box-shadow: 0px -1px 6px 0px rgba(4, 0, 0, 0.06);
+		.info-view {
+			font-size: 26upx;
+		}
+		.btn-view {
+			display: flex;
+			.admin-button-com {
+				margin: 0 10upx;
+			}
+		}
+	}
+}
+</style>