<template>
	<view class="">
		<view class="ciycle">
			<view id="IntegralStatisticsBottom" :style="{height:domNeedHeight == 0? 420 + 'px' : domNeedHeight + 'px'}">
				<view class="optionsDetail">
					<!-- 父元素列表 -->
					<cc-nodata title="暂无数据" v-if="noDataScrollStatus"
						:style="{width:100+'%',height:domNeedHeight == 0? 420 + 'px' : domNeedHeight + 'px'}"></cc-nodata>
					<view v-if="!noDataScrollStatus" v-for="(item,index) in commissionDetail" :key="item.ordersId"
						class="optionsDetailImport">
						<view class="storedIntegralTop">
							<view class="storedIntegralTopOfRight">
								<view class="">订单收益</view>
								<view class="">{{parentData.artificerMoneyTotal}}元</view>
							</view>
						</view>

						<view class="storedIntegralMiddle">
							<view class="">服务时间:{{parentData.serveTime}}</view>
							<view class="storedIntegralMiddleofRight">下单时间:{{parentData.payTime}}</view>
						</view>

						<view class="viewOrdersInfo">
							<view class="storedIntegralBottom">订单号: {{parentData.ordersNo}}</view>
						</view>

						<!-- 订单收益明细 -->
						<view class="ordersDetailMain">

							<!-- 项目明细 -->
							<view class="projectDetail">
								<view class="detailTitle">项目明细</view>
								<view class="detailMain">
									<view class="">服务时间</view>
									<view class="">{{item.serveTime}}</view>
								</view>
								<view class="">
									<view class="detailMain">
										<view class="">{{item.entryName}}</view>
										<view class="">￥{{item.price}}</view>
									</view>
								</view>
								<!-- 服务有加钟服务时 -->
								<view v-if="item.children" class="">
									<view class="detailMain" v-for="(item1,index) in item.children" :key="index">
										<view class="">{{item1.entryName}}</view>
										<view class="">￥{{item1.price}}</view>
									</view>
								</view>
								<view class="detailMain">
									<view class="">优惠券金额</view>
									<view class="couponMoney">-￥{{item.couponMoney}}</view>
								</view>
								<view class="detailMain">
									<view class="">项目金额</view>
									<view class="">￥{{item.allPrice}}</view>
								</view>
								<view class="detailMain">
									<view class="">提成比例</view>
									<view class="">{{item.artificerRate ? item.artificerRate * 100 : 0 }}%</view>
								</view>
								<!-- 分割线 -->
								<view class="detailsLines"></view>
								<view class="detailMain warningFontXM">
									<view class="">项目收益</view>
									<view class="">￥{{item.actualProjectBenefits}}</view>
								</view>
							</view>

							<!-- 扣费明细 -->
							<view class="chargingDetail">
								<view class="detailTitle secondDetailTitle">扣费明细</view>
								<view class="detailMain">
									<view class="">渠道扣费</view>
									<view class="">￥{{item.channelDeduction}}</view>
								</view>
								<view class="detailMain">
									<view class="">储值扣费</view>
									<view class="">￥{{item.valueStorageDeduction}}</view>
								</view>
								<!-- 分割线 -->
								<view class="detailsLines">
								</view>
								<view class="detailMain warningFontKF">
									<view class="">合计扣费</view>
									<view class="">￥{{item.totalDeduction}}</view>
								</view>
							</view>

							<!-- 收益明细 -->
							<view class="Detail">
								<view class="detailTitle secondDetailTitle">收益明细</view>
								<view class="detailMain">
									<view class="">项目收益</view>
									<view class="">￥{{item.actualProjectBenefits}}</view>
								</view>
								<view class="detailMain">
									<view class="">车费金额</view>
									<view class="">￥{{item.artificerTaxiMoney}}</view>
								</view>
								<view class="detailMain">
									<view class="">扣款金额</view>
									<view class="">￥{{item.totalDeduction}}</view>
								</view>
								<!-- 分割线 -->
								<view class="detailsLines">
								</view>
								<view class="detailMain warningFontXM">
									<view class="">收益金额</view>
									<view class="">￥{{item.totalRevenue}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import navBar from "@/components/navBar/navBar.vue";
	export default {
		components: {
			navBar
		},
		onLoad(options) {
			this.options = options;
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.on('parentData', (data) => {
				console.log(data);
				this.parentData = data;
			})
			this.getCommissionDetailDataList({
				orderId: options?.ordersId,
			});
		},
		onReady() {
			this.selfAdaptionChangeElemtHeight();
		},
		//下拉刷新
		onPullDownRefresh() {
			uni.showToast({
				title: "请返回重新进入此页面刷新数据",
				icon: "none",
				duration: 2000,
				success() {
					uni.stopPullDownRefresh();
				},
			})
		},
		data() {
			return {
				backgroundcolor: "linear-gradient(to bottom, #294856, #1a615b)",
				domNeedHeight: 0, //元素的所需高度
				noDataScrollStatus: false,
				parentData: [],
				options: null,
				title: "订单收益明细",
				commissionDetail: [{
					id: 1,
					"name": "欧式奢华spa",
					"parentId": 0,
					"money": 498,
					"date1": "1213123",
					"车费": "123",
					"优惠价": "123",
					"提成比例": "123",
					children: [{
							"name": "欧式奢华spa2",
							"id": 1,
							"parentId": 1,
							"money": 4983,
							"date1": "1213123"
						},
						{
							"name": "古韵spa3",
							"id": 2,
							"parentId": 1,
							"money": 4948,
							"date1": "1213123"
						},
						{
							"name": "古韵spa3",
							"id": 3,
							"parentId": 1,
							"money": 4948,
							"date1": "1213123"
						}
					]
				}],
			}
		},
		methods: {
			//自适应改变列表高度
			selfAdaptionChangeElemtHeight() {
				let _this = this;
				try {
					uni.getSystemInfo({
						success: res => {
							if (res && res.windowHeight) {
								let query = uni.createSelectorQuery().in(this);
								query
									.select(".optionsDetail")
									.boundingClientRect((data) => {
										_this.domNeedHeight = res.windowHeight - data.top;
									})
									.exec();
							}
						}
					});
				} catch (e) {
					//TODO handle the exception
				}
			},
			//获取订单明细(列表)
			getCommissionDetailDataList(params, isScroll) {
				let {
					orderId
				} = params;
				this.$Request.postXZX("/app/dividedIntoDetails/splitDetails", params).then((
					res) => {
					// return
					//日期在返回数据userMoneyDetailsList.records的外面,需要单独赋值
					if (res && res.data && res.data.length > 0) {
						//有数据时
						this.commissionDetail = res.data;
						// res.data.forEach((item) => {
						// 	if (typeof(item) == "number" && item.indexOf(".") == -1 && item > 0) {
						// 		item = item + "00";
						// 	}
						// })
						this.noDataScrollStatus = false;
					} else {
						//无数据时
						this.noDataScrollStatus = true;
					}
				})
			},
		},
	}
</script>

<style>
	@import "./index.css";
</style>