<template>
	<view>
		<scroll-view :scroll-y="true" :style="'height:'+height*0.83+'px'">
			<view class="order">
				<u-card>
					<view slot="head" class="head">
						<view class="title">{{serviceName}}</view>
						<view class="sub-title">{{subTitle}}</view>
					</view>
					<view slot="body">
						<view class="item">
							<u-icon size="36" name='grid'></u-icon>
							<text class="label">共计<text class="num">{{num}}</text>套商品</text>
						</view>
						<view class="item">
							<u-icon size="36" name='map'></u-icon>
							<text class="label">{{orderDetails.Maindata[0].FCustomerName}}</text>
						</view>
						<view class="item">
							<text
								class="label">{{orderDetails.Maindata[0].FPROVINCE + orderDetails.Maindata[0].FCITY + orderDetails.Maindata[0].FCOUNTY + orderDetails.Maindata[0].FAdress}}</text>
						</view>
						<view class="item">
							<u-icon size="36" name='clock'></u-icon>
							<text class="label">{{orderDetails.Maindata[0].FHopeServiceTime}}</text>
						</view>
						<view class="item">
							<u-icon size="36" name='rmb-circle'></u-icon>
							<text class="label">付款方式：{{payWay}}</text>
						</view>
					</view>
				</u-card>
				<!-- 商品信息 -->
				<u-card>
					<view slot="head" class="head">
						<view class="title">商品信息</view>
						<view class="sub-title"></view>
					</view>
					<view slot="body">
						<view v-for="(item,index) in orderDetails.SPdata" :key="index">
							<view class="item">
								<u-icon :label="'商品名称：'+item.CPGG"></u-icon>
							</view>
							<view class="item">
								<u-icon :label="'商品规格：'+item.CPMC"></u-icon>
							</view>
							<view class="item">
								<u-icon :label="'商品数量：'+item.FGOODSQTY"></u-icon>
							</view>
							<view class="item">
								<u-icon :label="'商品备注：'+item.FTOOLS"></u-icon>
							</view>
							<view class="item">
								<u-image mode="heightFix" width="250" height="250" :src="picUrl[index]"></u-image>
							</view>
						</view>
					</view>
				</u-card>
				<!-- 备注 -->
				<u-card>
					<view slot="head" class="head">
						<view class="title">备注</view>
						<view class="sub-title"></view>
					</view>
					<view slot="body">
						<view class="remarks">
							<text>{{orderDetails.Maindata[0].FCustomerNote}}</text>
						</view>
					</view>
				</u-card>
				<!-- 订单信息 -->
				<u-card>
					<view slot="head" class="head">
						<view class="title">订单信息</view>
						<view class="sub-title"></view>
					</view>
					<view slot="body">
						<view class="item">
							<u-icon :label="'订单编号：'+orderDetails.Maindata[0].FBILLNO"></u-icon>
						</view>
						<view class="item">
							<u-icon :label="'订单时间：'+orderDetails.Maindata[0].FDatetime"></u-icon>
						</view>
						<view class="item" v-show="orderDetails.Maindata[0].FPayWay == '3'">
							<u-icon :label="'现场应收费用：'+orderDetails.Maindata[0].FSHAmount"></u-icon>
						</view>
						<view class="item" v-show="orderDetails.Maindata[0].FPayWay == '3'">
							<u-icon :label="'现场实收费用：'+orderDetails.Maindata[0].FSHAmount"></u-icon>
						</view>
						<view class="item"
							v-if="orderDetails.Maindata[0].caption !== '待报价' && orderDetails.Maindata[0].FPayWay == '2'">
							<u-icon :label="'应付费用：'+orderDetails.Maindata[0].FSFYAMOUNT"></u-icon>
						</view>
						<view class="item"
							v-if="orderDetails.Maindata[0].caption !== '待报价' && orderDetails.Maindata[0].FPayWay == '2'">
							<u-icon :label="'实付费用：'+orderDetails.Maindata[0].FSFSAMOUNT"></u-icon>
						</view>
						<view class="item"
							v-if="orderDetails.Maindata[0].caption !== '待报价' && orderDetails.Maindata[0].caption !== '待预约'">
							<u-icon :label="'预约时间：'+orderDetails.Maindata[0].FAPPOINTMENTDATE"></u-icon>
						</view>
						<view class="item"
							v-if="orderDetails.Maindata[0].caption !== '待报价' && orderDetails.Maindata[0].caption !== '待预约'">
							<u-icon :label="'预约地址：'+orderDetails.Maindata[0].FAPPOINTMENTADRESS"></u-icon>
						</view>
					</view>
				</u-card>
				<!-- 订单报价 -->
				<u-card v-if="orderDetails.Maindata[0].HasQuoted == 0 && orderDetails.Maindata[0].caption == '待报价'">
					<view slot="head" class="head">
						<view class="title">订单报价</view>
						<view class="sub-title">报价后不可修改价格</view>
					</view>
					<view slot="body">
						<u-empty src="/static/images/detail/pay.png" text="等待师傅报价"></u-empty>
					</view>
				</u-card>
				<!-- 我的报价 -->
				<!-- <u-card v-if="subTitle == '待雇佣'">
					<view slot="head" class="head">
						<view class="title">我的报价</view>
						<view class="sub-title"></view>
					</view>
					<view slot="body">
						<text></text>
					</view>
				</u-card> -->
			</view>

			<!-- <view class="btn">
				<u-button @click="BaoJia">立即报价</u-button>
				<u-button @click="YuYue">登记预约时间</u-button>
				<u-button @click="WanGong">完工结算上报</u-button>
				<u-button @click="YanShou">待业主验收</u-button>
			</view> -->
			<view class="tips">
				<rich-text>{{tips}}</rich-text>
			</view>
			<!-- 状态:{{orderDetails.Maindata[0].caption}} -->
		</scroll-view>



		<view class="btn-group">
			<view
				v-if="(orderDetails.Maindata[0].caption == '待报价' && orderDetails.Maindata[0].HasQuoted == 0) || (orderDetails.Maindata[0].caption == '待预约') || (orderDetails.Maindata[0].caption == '待服务') || (orderDetails.Maindata[0].caption == '待验收')">
				<view class="btn" :style="'width:'+width*0.3+'px'">
					<u-button open-type="contact" :hair-line="false">联系客服</u-button>
				</view>
				<view class="btn" :style="'width:'+width*0.7+'px'">
					<u-button :hair-line="false" hover-class="none" :custom-style="btnStyle" @click="bottomBtn">
						{{btnText}}
					</u-button>
				</view>
			</view>
			<view v-else>
				<view class="btn" :style="'width:'+width+'px'">
					<u-button open-type="contact" :hair-line="false" :custom-style="btnStyle">联系客服</u-button>
				</view>
			</view>
		</view>
		<!-- 预约成功 & 预约失败 -->
		<u-action-sheet :list="YuYueStateList" v-model="showYuYueStateList" @click="YuYueStateSelect"></u-action-sheet>
		<!-- 预约日期 -->
		<u-calendar v-model="showYuYueDateList" :min-date="minDate" max-date="2099-01-01" mode="date"
			@change="YuYueDateConfirm"></u-calendar>
		<!-- 预约时间 -->
		<u-select v-model="showYuYueTimeList" :list="YuYueTimeList" @confirm="YuYueTimeConfirm"
			mode="mutil-column-auto"></u-select>
		<!-- 预约成功弹窗 -->
		<u-modal v-model="yyShow" :show-title="showT" :mask-close-able="true" :show-confirm-button="false">
			<view>
				<view class="Myuyue">
					<u-icon label="你已被商家雇佣" name="/static/images/ok.png" size="100rpx" label-size="30rpx"
						label-color="#f0f5ff" label-pos="bottom" class="yyLabel">

					</u-icon>
					<text class="yyText">请尽快联系业主预约安装时间，并在订单中登记</text>
					<text class="yyText">预约时间，否则可能取消该订单接单资格</text>

				</view>
			</view>
			<text class="yyText2">完成服务后，请上传完工照片，平台会在72小时内自动结算雇佣金至您账户钱包佣金。</text>
			<view class="yybotton">
				<view class="yybotton2">
					<u-button @click="callPhone" :custom-style="customStyle" :hair-line="false">联系业主</u-button>
				</view>
			</view>
		</u-modal>

		<u-modal v-model="showModal" :show-title="false" :show-cancel-button="true" :async-close="true"
			@confirm="modalConfirm" ref="uModal" confirm-color="#7c59fc">
			<view v-show="orderDetails.Maindata[0].caption == '待报价'">
				<u-form label-width="150" label-align="center" ref="Pform" :model="form">
					<u-form-item label="期望费用" prop="BaoJiaValue" :required="true">
						<u-input placeholder="请输入您的报价" type="digit" v-model="form.BaoJiaValue"></u-input>
					</u-form-item>
					<u-form-item label="推荐价格">
						<text>{{recommendedPrice}}</text>
					</u-form-item>
				</u-form>
			</view>
			<view v-show="orderDetails.Maindata[0].caption == '待验收'">
				<u-form label-width="190" label-align="center" ref="Cform" :model="form">
					<u-form-item label="完工验证码" prop="WanGongCode" :required="true">
						<u-input placeholder="请输入完工验证码" type="number" v-model="form.WanGongCode"></u-input>
					</u-form-item>
				</u-form>
			</view>
		</u-modal>

		<u-popup v-model="showPopup" mode="bottom" z-index="100">
			<view v-show="orderDetails.Maindata[0].caption == '待预约'">
				<u-form label-width="190" label-align="center" ref="Yform" :model="form">
					<u-form-item label="预约结果" prop="YuYueStateLabel" :required="true">
						<u-input placeholder="请选择预约结果" v-model="form.YuYueStateLabel" type="select"
							@click="showYuYueStateList = true" />
					</u-form-item>
					<view v-if="YuYueState == '1'">
						<u-form-item label="预约日期" prop="YuYueDate" :required="true">
							<u-input placeholder="请选择您和业主预约到日期" v-model="form.YuYueDate" type="select"
								@click="showYuYueDateList = true" />
						</u-form-item>
						<u-form-item label="预约时间" prop="YuYueTime" :required="true">
							<u-input placeholder="请选择您和业主预约到时间" v-model="form.YuYueTime" type="select"
								@click="showYuYueTimeList = true" />
						</u-form-item>
						<u-form-item label="预约地址" prop="YuYueAddress" :required="true">
							<u-input placeholder="请输入预约地址" v-model="form.YuYueAddress" :disabled="true" />
						</u-form-item>
					</view>
					<u-button hover-class="none" :custom-style="btnStyle" @click="YuYueConfirm">确定</u-button>
				</u-form>
			</view>
			<view style="text-align: center;" v-show="orderDetails.Maindata[0].caption == '待服务'">
				<view style="color: #000000;font-size: 22px;font-weight: 1000;">
					<text>上传完工图片结算</text>
				</view>
				<view style="color: #909399;">
					<text>图片大小不能超过5MB,最多上传9张</text>
				</view>
				<u-form label-width="150" label-align="center" ref="Iform" :model="form">
					<u-form-item label="上传图片" prop="ufile" :required="true">
						<u-upload :header="header" ref="uUpload" :action="action" max-count="9" v-model="form.ufile" @on-success="uploadSuccess1">
						</u-upload>
					</u-form-item>
				</u-form>
				<u-button hover-class="none" :custom-style="btnStyle" @click="WanGongConfirm">确定</u-button>
			</view>
		</u-popup>


	</view>
</template>

<script>
	import {
		postOffer,
		getUrl,
		getOrderDetails,
		doneOrder,
		sendAppointment,
		donePic
	} from '../../api/apis.js'
	import {
		loading,
		hidden,
		toast
	} from '../../tips/myTips.js'
	import {
		apiBaseUrl
	} from '../../api/request.js'
	export default {
		onLoad(obj) {
			this.init(obj)
			uni.$u.mpShare.title = '页面分享';
		},
		onReady() {
			this.$refs.Pform.setRules(this.pRule);
			this.$refs.Cform.setRules(this.cRule);
			this.$refs.Yform.setRules(this.yRule);
			this.$refs.Iform.setRules(this.iRule);
		},
		data() {
			return {
				tips: '报价默认包含所有附加费用（远程费，打孔费玻璃胶等辅料费）。接单后不得额外收费，接单完工订单越多，平台派发越多。',
				btnStyle: {
					background: "#7D5AFC",
					color: '#FFFFFF'
				},
				width: '',
				height: '',
				FID: '',
				//预约成功弹窗控制数据
				yyShow: false,
				showT: false,
				customStyle: {
					// 注意驼峰命名，并且值必须用引号包括，因为这是对象
					backgroundColor: '#7D5AFC',
					color: '#fcfcfc'
				},
				//订单详情数据
				orderDetails: '',
				//服务类目()
				serviceName: '',
				//付款方式
				payWay: '',
				//商品图片路径
				picUrl: [],
				//底部按钮文本
				btnText: '',
				//预约数据
				YuYueState: '',
				showModal: false,
				showPopup: false,
				form: {
					//报价数据
					BaoJiaValue: '',
					//预约数据
					YuYueStateLabel: '',
					YuYueDate: '',
					YuYueTime: '',
					YuYueAddress: '',
					//完工数据
					WanGongCode: '',
					//完工图片上传
					ufile: 0
				},
				showYuYueStateList: false,
				showYuYueDateList: false,
				showYuYueTimeList: false,
				YuYueStateList: [{
						text: '预约失败',
						value: '0'
					},
					{
						text: '预约成功',
						value: '1'
					}
				],
				//
				pRule: {
					BaoJiaValue: [{
						required: true,
						min: 1,
						message: '请输入您的报价',
						trigger: ['change', 'blur'],
					}]
				},
				cRule: {
					WanGongCode: [{
						required: true,
						min: 1,
						type: 'number',
						message: '请输入完工验证码',
						trigger: ['change', 'blur'],
					}]
				},
				yRule: {
					YuYueStateLabel: [{
						required: true,
						min: 1,
						message: '请选择预约结果',
						trigger: ['change', 'blur'],
					}],
					YuYueDate: [{
						required: true,
						message: '请选择预约日期',
						min: 1,
						trigger: ['change', 'blur'],
					}],
					YuYueTime: [{
						required: true,
						message: '请选择预约时间',
						min: 1,
						trigger: ['change', 'blur'],
					}],
					YuYueAddress: [{
						required: true,
						message: '请选择预约地点',
						min: 1,
						trigger: ['change', 'blur'],
					}],

				},
				iRule: {
					ufile: [{
						required: true,
						validator: (rule, value, callback) => {
							return this.form.ufile>0
						},
						message: '请上传完工照片',
						trigger: ['change', 'blur'],
					}]
				},
				YuYueTimeList: [{
						value: '0',
						label: '上午',
						children: [{
								value: '08:00',
								label: '08:00'
							},
							{
								value: '08:30',
								label: '08:30'
							},
							{
								value: '09:00',
								label: '09:00'
							},
							{
								value: '09:30',
								label: '09:30'
							},
							{
								value: '10:00',
								label: '10:00'
							},
							{
								value: '10:30',
								label: '10:30'
							},
							{
								value: '11:00',
								label: '11:00'
							},
						]
					},
					{
						value: '1',
						label: '中午',
						children: [{
								value: '11:00',
								label: '11:00'
							},
							{
								value: '11:30',
								label: '11:30'
							},
							{
								value: '12:00',
								label: '12:00'
							},
							{
								value: '12:30',
								label: '12:30'
							},
							{
								value: '13:00',
								label: '13:00'
							},
							{
								value: '13:30',
								label: '13:30'
							},
							{
								value: '14:00',
								label: '14:00'
							}
						]
					},
					{
						value: '2',
						label: '下午',
						children: [{
								value: '14:00',
								label: '14:00'
							},
							{
								value: '14:30',
								label: '14:30'
							},
							{
								value: '15:00',
								label: '15:00'
							},
							{
								value: '15:30',
								label: '15:30'
							},
							{
								value: '16:00',
								label: '16:00'
							},
							{
								value: '16:30',
								label: '16:30'
							},
							{
								value: '17:00',
								label: '17:00'
							},
							{
								value: '17:30',
								label: '17:30'
							},
							{
								value: '18:00',
								label: '18:00'
							}
						]
					},
					{
						value: '3',
						label: '晚上',
						children: [{
								value: '18:00',
								label: '18:00'
							},
							{
								value: '18:30',
								label: '18:30'
							},
							{
								value: '19:00',
								label: '19:00'
							},
							{
								value: '19:30',
								label: '19:30'
							},
							{
								value: '20:00',
								label: '20:00'
							},
							{
								value: '20:30',
								label: '20:30'
							},
							{
								value: '21:00',
								label: '21:00'
							}
						]
					}
				],

				//完工数据
				action: '',
				header: {
					test: '11'
				},

				//重新加载需要
				obj: ''
			}
		},
		components: {

		},
		methods: {
			init(obj) {
				this.obj = obj
				this.width = this.$store.state.sysInfo.windowWidth
				this.height = this.$store.state.sysInfo.screenHeight
				this.action = apiBaseUrl + '/api/UploadAttachments'
				this.FID = parseInt(obj.FID)
				let that = this
				loading()
				getOrderDetails(this.FID).then((res) => {
					hidden()
					if (res.data.code == 0) {
						console.log("查询订单详情信息成功:", res.data.result)
						that.orderDetails = res.data.result
						that.form.YuYueAddress = that.orderDetails.Maindata[0].FPROVINCE + that.orderDetails
							.Maindata[0]
							.FCITY + that.orderDetails.Maindata[0].FCOUNTY + that.orderDetails.Maindata[0].FAdress
						if (that.orderDetails.Maindata[0].caption == '待预约') {
							this.yyShow = true
						}
					} else {
						toast(res.data.message)
						console.log("查询订单详情信息失败:", res)
					}

				})
			},

			BaoJia() {
				this.showModal = true
			},
			YanShou() {
				this.showModal = true
			},
			WanGong() {
				this.showPopup = true
			},
			YuYue() {
				this.showPopup = true
			},

			//选择预约状态
			YuYueStateSelect(index) {
				this.YuYueState = this.YuYueStateList[index].value

			},
			//预约日期选择
			YuYueDateConfirm(e) {
				this.form.YuYueDate = e.result
			},
			//预约时间选择
			YuYueTimeConfirm(e) {
				this.form.YuYueTime = e[1].value
			},
			//提交预约信息
			YuYueConfirm() {
				let that = this
				this.$refs.Yform.validate(valid => {
					if (valid) {
						console.log('验证通过');
						switch (that.YuYueState) {
							case '0':
								let paramsFalse = {
									IsDeleteEntry: false,
									Model: {
										FID: '',
										FStatus: 'DGY',
										FAppointmentTimeEntity: [{
											FAppointmentWorkerID: {
												FNUMBER: that.$store.state.userInfo.Number
											},
											FAppointmentResult: '0',
											FAppointmentNote: '' //失败原因
										}]
									}
								}
								paramsFalse.Model.FID = that.FID
								paramsFalse.Model.FAppointmentTimeEntity[0].FAppointmentNote = that.orderDetails
									.Maindata[0]
									.FCustomerNote
								console.log("预约失败参数:", paramsFalse)
								that.loading()
								sendAppointment(paramsFalse).then((res) => {
									that.hidden()
									console.log("预约失败返回信息:", res.data)
									if (res.data.code == 0) {
										that.showPopup = false
										that.init(that.obj)
									} else {
										toast(res.data.message)
									}
								})
								break
							case '1':
								console.log("1")
								let paramsTrue = {
									IsDeleteEntry: false,
									Model: {
										FID: '',
										FStatus: 'DFW',
										FAppointmentTimeEntity: [{
											FAppointmentWorkerID: {
												FNUMBER: that.$store.state.userInfo.Number
											},
											FAppointmentResult: '1',
											FAppointmentDate: '', //时间 YYYY-MM-DD MM:SS
											FAppointmentAdress: '', //地址
											FAppointmentNote: '' //备注
										}]
									}
								}
								console.log("2")
								paramsTrue.Model.FID = that.FID
								paramsTrue.Model.FAppointmentTimeEntity[0].FAppointmentDate = that.form.YuYueDate +
									' ' + that.form.YuYueTime
								paramsTrue.Model.FAppointmentTimeEntity[0].FAppointmentAdress = that.form
									.YuYueAddress
								paramsTrue.Model.FAppointmentTimeEntity[0].FAppointmentNote = that.orderDetails
									.Maindata[0].FCustomerNote
								console.log("预约成功参数:", paramsTrue)
								console.log("复制参数:", JSON.stringify(paramsTrue))
								loading()
								sendAppointment(paramsTrue).then((res) => {
									hidden()
									console.log("预约成功返回信息:", res.data)
									if (res.data.code == 0) {
										that.showPopup = false
										that.init(that.obj)
									} else {
										toast(res.data.message)
									}
								})
								break
						}
					} else {
						console.log('验证失败');
					}
				});

			},
			//完工图片提交
			WanGongConfirm() {
				let that = this

				let files = []
				files = that.$refs.uUpload.lists.filter(val => {				
					return val.progress == 100
				})
				let params = {
					Model: {
						FID: '',
						FStatus: 'DYS',
						FFinishImagesEntity: []
					}
				}
				for (let i in files) {
					let obj = {
						FFinishImage: ''
					}
					obj.FFinishImage = files[i].response.result.fileid
					params.Model.FFinishImagesEntity.push(obj)
				}
				params.Model.FID = that.FID
				console.log("完工图片参数:", params)
				console.log(that.form.ufile)
				this.$refs.Iform.validate(valid => {
					if (valid) {
						console.log('验证通过');
						loading()
						donePic(params).then((res) => {
							hidden()
							console.log("完工图片上传返回信息:", res)
							if (res.data.code == 0) {
								that.showPopup = false
								that.init(that.obj)
							} else {
								toast(res.data.message)
							}
						})
					} else {
						console.log('验证失败');
					}
				});

			},
			//图片上传成功，计数加一
			uploadSuccess1(data, index, lists){
			if(data.code == 100){
				
				}else{
					this.form.ufile = lists.length
					console.log(this.form.ufile)
				}
			},

			//报价信息提交(待报价) || 验收信息提交(完工验证码,待验收)
			modalConfirm() {
				let that = this
				if (this.orderDetails.Maindata[0].caption == '待报价') {
					console.log("报价")
					this.$refs.Pform.validate(valid => {
						if (valid) {
							console.log('验证通过');
							let params = {
								FID: '',
								Amount: ''
							}
							params.FID = that.orderDetails.Maindata[0].FID
							params.Amount = that.form.BaoJiaValue
							postOffer(params).then((res) => {
								console.log('报价请求返回信息:', res)
								if (res.data.code == 0) {
									that.$refs.uModal.clearLoading()
									that.showModal = false
									that.init(that.obj)
								} else {
									that.$refs.uModal.clearLoading()
									toast(res.data.message)
								}
							})
						} else {
							console.log('验证失败');
							that.$refs.uModal.clearLoading()
						}
					});
				}
				if (this.orderDetails.Maindata[0].caption == '待验收') {
					console.log("验收")
					this.$refs.Cform.validate(valid => {
						if (valid) {
							console.log('验证通过');
							let params = {
								FID: '',
								FinishCode: ''
							}
							params.FID = that.orderDetails.Maindata[0].FID
							params.FinishCode = that.form.WanGongCode
							console.log("完工验证码参数:", params)
							doneOrder(params).then((res) => {
								console.log("完工验证码返回结果:", res)
								if (res.data.code == 0) {
									that.$refs.uModal.clearLoading()
									that.showModal = false
									that.init(that.obj)
								} else {
									that.$refs.uModal.clearLoading()
									toast(res.data.message)
								}
							})
						} else {
							console.log('验证失败');
							that.$refs.uModal.clearLoading()
						}
					});

				}
			},

			bottomBtn() {
				switch (this.orderDetails.Maindata[0].caption) {
					case '待报价':
						this.showModal = true
						break
					case '待验收':
						this.showModal = true
						break
					case '待预约':
						this.showPopup = true
						break
					case '待服务':
						this.showPopup = true
						break
				}
			},

			callPhone() {
				let that = this
				wx.makePhoneCall({
					phoneNumber: this.orderDetails.Maindata[0].FCustomerPhone
				})
			}

		},
		computed: {
			minDate: function() {
				let result = ''
				let timestamp = Date.parse(new Date());
				let date = new Date(timestamp);
				let Y = date.getFullYear();
				let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
				let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
				result = Y + '-' + M + '-' + D
				return result
			},
			recommendedPrice: function() {
				let result = ''
				try {
					let main = this.orderDetails.Maindata[0]
					let JYJG = main.JYJG
					let InfoRate = main.FINFORATE
					console.log("师傅信息费:", main.FINFORATE)
					console.log("建议价格:", main.JYJG)
					result = JYJG - (JYJG * InfoRate)
					console.log("最终建议价格:", result)
					return result
				} catch {

				}
			},
			subTitle: function() {
				let result = ''
				if (this.orderDetails) {
					if (this.orderDetails.Maindata[0].caption == '待报价' && this.orderDetails.Maindata[0].BJcount > 0) {
						result = '待雇佣'
					} else {
						result = this.orderDetails.Maindata[0].caption
					}
				}
				return result
			},
			num: function() {
				let result = 0
				if (this.orderDetails) {
					for (let i in this.orderDetails.SPdata) {
						result += this.orderDetails.SPdata[i].FGOODSQTY
					}
				}
				return result
			}
		},
		watch: {
			YuYueState(val, oldval) {
				switch (val) {
					case '0':
						this.form.YuYueStateLabel = '预约失败'
						break
					case '1':
						this.form.YuYueStateLabel = '预约成功'
						break
				}
			},
			orderDetails(val, oldval) {
				let that = this
				//设置服务类目(订单详情第一张card的标题:多个服务类目合并)
				//请求商品图片链接
				let myServiceName = ''
				for (let i in val.SPdata) {
					myServiceName = myServiceName + val.SPdata[i].CPGG + ' '
					loading()
					getUrl(val.SPdata[i].FGOODSIMAGE).then((res) => {
						hidden()
						console.log("商品图片请求结果:", res)
						if (res.data.code == 0) {
							that.picUrl.splice(i, 0, res.data.result[0].fileurl)
							console.log(that.picUrl)
						} else {
							toast(res.data.message)
						}
					})
				}
				this.serviceName = myServiceName
				//设置付款方式
				switch (val.Maindata[0].FPayWay) {
					case '1':
						this.payWay = '下单支付'
						break
					case '2':
						this.payWay = '验收完成支付'
						break
					case '3':
						this.payWay = '业主现场支付'
						break
				}
				//根据订单状态设置底部按钮文本
				switch (val.Maindata[0].caption) {
					case '待报价':
						this.btnText = '立即报价'
						break
					case '待预约':
						this.btnText = '登记预约时间'
						break
					case '待服务':
						this.btnText = '完工结算上报'
						break
					case '待验收':
						this.btnText = '待业主验收'
						break
				}
			}
		}
	}
</script>

<style>
	.item {
		margin: 10px 0;
	}

	.num {
		margin: 0 1px;
		font-size: 16px;
		color: #7C59FC;
	}

	.label {
		margin-left: 5px;
	}

	.tag {
		margin-bottom: 5% 0;
	}

	.tips {
		padding: 5% 2%;
		color: #909399;
	}

	.remarks {
		color: #ff9900;
	}

	.btn-group {
		position: fixed;
		bottom: 0;
	}

	.btn {
		display: inline-block;
	}

	.Myuyue {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 30rpx;
		background-color: #7c59fc;
	}

	.yyText {
		font-size: 25rpx;
		color: #ffffff;
		display: block;
		/* margin-top: 50rpx;
		padding-bottom: 30rpx; */
	}

	.yyText2 {
		display: block;
		font-size: 25rpx;
		color: #b9b9b9;
		padding-left: 40rpx;
		padding-right: 40rpx;
	}

	.yyLabel {
		margin-bottom: 30rpx;
	}

	.yybotton {
		display: block;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.yybotton2 {
		margin-top: 30rpx;
		margin-bottom: 30rpx;
		width: 300rpx;
	}

	.head {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.title {
		color: #000000;
		font-size: 16px;
		width: 75%;
	}

	.sub-title {
		color: #ff9900;
	}
</style>
