<template>
	<view class="content">
		
		<view class="mt20">
			
			<view class="re-card-p32">
				<view class="flex-sb">
					<view class="re-from-label">写在前面</view>
				</view>
				<view class="re-card-context">
					感谢您在替班平台发布订单！如果您在订单环节中有什么疑问可以通过<span>小程序我的>联系客服</span>快捷联系/留言平台服务人员，我们将7*24为您服务
				</view>
			</view>
			
			<view class="re-card-p32">
				<view class="re-from-line" @click="show=true">
					<view class="re-from-label">施工设备</view>
					<view class="b-relative">
						<input v-model="form.carId" disabled="true" maxlength="8" class="re-from-input" placeholder="请选择施工设备" />
						<image class="re-from-icon" src="/static/icons/icon06.png"></image>
					</view>
				</view> 
				<view class="re-from-line">
					<view class="re-from-label">计划数量</view>
					<view class="b-relative">
						<input v-model="form.mi" type="number" maxlength="8" class="re-from-input" placeholder="请填写计划数量" />
						<image class="re-from-icon" src="/static/icons/icon07.png"></image>
					</view>
				</view> 
				<view class="re-card-context" style="margin-top: -20rpx;">
					<span>*注意：</span>
					保障金将按照所选车辆(车段)、计划数量按照
					（计算方式：<span>n*单价（泵车填写的计划数量是方量，搅拌车填写的计划数量是指趟数）向上取整，最低支付1000元</span>）
					进行收取
				</view>
				<view class="h32"></view>
				<view class="re-from-line">
					<view class="re-from-label">合同属性</view>
					<view class="b-relative">
						<radio-group @change="changeType">
							<radio class="re-radio re-width2" value="1" :checked="+form.type===1">合同单</radio>
							<radio class="re-radio re-width2" value="2" :checked="+form.type===2">现金单</radio>
						</radio-group>
					</view>
				</view> 
				<view class="re-from-line" @click="openSelect">
					<view class="re-from-label">到场地点</view>
					<view class="b-relative">
						<input class="re-from-input" v-model="form.address" disabled="true" 
							   placeholder="选择施工到场地点" />
						<image class="re-from-icon" src="/static/icons/icon05.png"/>
					</view>
				</view> 
				<select-time @selected="changeInTime"></select-time>
				<view class="re-from-line">
					<view class="re-from-label">到场时间</view>
					<view class="b-relative">
						<select-time @selected="changeInTime">
							<input v-model="form.inTime" disabled="true" class="re-from-input" placeholder="选择施工进场时间" />
						</select-time>
						<!-- <picker mode="date" start="2024-03-01" @change="changeInTime">
							<input v-model="form.inTime" disabled="true" class="re-from-input" placeholder="选择施工进场时间" />
						</picker> -->
						<image class="re-from-icon" src="/static/icons/icon08.png"></image>
					</view>
				</view>
				
			</view>
			
			<view class="re-card-p32">
				<view class="re-from-label">您可以在这里进行补充说明（选填）</view>
				<textarea v-model="form.remark" class="re-card-textarea inpit" placeholder="请在此处留言或者备注其他特殊情况司机接单前可以看到订单留言">
				</textarea>
			</view>
			
			<view class="re-end-pand">
				<button @click="submit">提交审核</button>
			</view>
		
		</view>
		
		<select-car :show="show" @success="addCar" @close="show=false"></select-car>
		
	</view>
</template>

<script>
	import SelectCar from '/components/select-car.vue'
	import SelectTime from '/components/select-datetime.vue'
	
	export default {
		components: {
			SelectCar
			, SelectTime
		},
		data() {
			return {
				show: false,
				form: {
					type: "1",
					carId:  "",
					mi: "",
					inTime: "",
					remark: "",
					address: "",
					addressSimple: "",
					latitude: "",
					longitude: "",
					carNo: "",
					carMi: "",
					carImage: ""
				},
				addr: {
					name:"",
					address: "",
					latitude: "",
					longitude: ""
				}
			}
		},
		onLoad() {
			
		},
		methods: {
			
			openSelect(){
				uni.chooseLocation({
					success:(res)=> {
						console.log(res);
						this.addr.name = res.name
						this.addr.address = res.address
						this.addr.latitude = res.latitude
						this.addr.longitude = res.longitude
						this.form.address = res.address
						this.form.addressSimple = res.name
						this.form.latitude = res.latitude
						this.form.longitude = res.longitude
					}
				})
			},
			changeType(event){
				this.form.type = event.detail.value
			},
			changeInTime(event){
				console.log(event);
				this.form.inTime = event
			},
			addCar(car){
				console.log(car);
				this.form.carId = car.id;
				this.form.carImage = car.carimage;
				this.form.carMi = car.mi;
				this.form.carNo = car.carno || "湘A·--";
			},
			
			submit(){
				if(!this.form.mi){
					uni.showToast({ icon: "none", title: "请填写计划数量" })
					return
				}
				if(!this.form.carId){
					uni.showToast({ icon: "none", title: "请选择施工设备" })
					return
				}
				if(!this.form.type){
					uni.showToast({ icon: "none", title: "请勾选合同属性" })
					return
				}
				if(!this.form.address){
					uni.showToast({ icon: "none", title: "请选择施工到场地点" })
					return
				}
				if(!this.form.inTime){
					uni.showToast({ icon: "none", title: "请选择施工到场时间" })
					return
				}
				this.doSubmit()
			},
			doSubmit(){
				uni.showLoading({})
				this.form.id = this.$utils.generateUUID()
				this.form.status = -1
				this.form.orderNo = "QJR" + new Date().getTime()
				this.form.area = uni.getStorageSync("area")
				this.form.enter_id = uni.getStorageSync("enter_id")
				this.$httpPost("/api/order/push", this.form, (res) => {
					console.log('[/order/push]', res);
					if(res.data || res.data == 1){
						setTimeout(()=>{
							uni.hideLoading({})
							uni.showToast({ icon: "none", title: "数据已提交" })
							this.doPrice()
						}, 1500)
					} 
				})
			},
			doPrice(){
				this.$httpGet("/api/mi/byName", {mi: this.form.carMi}, (res) => {
					if(res.data && res.data.price){
						let price = Math.ceil(this.form.mi*res.data.price*100)
						if(price<100000) price = 100000;
						console.log("计价结果", price);
						this.doPay(price)
					} else {
						this.doPay(Math.ceil(this.form.mi*2))
					}
				})
			},
			doPay(price){
				if (!uni.getStorageSync("openid")){
					uni.showToast({ icon: "none", title: "拉起支付失败OPENID丢失" })
					return
				}
				if (!this.form.orderNo){
					this.form.orderNo = "qjr" + Date.now()
				}
				let data = {
					openId: uni.getStorageSync("openid"),
					outTradeNo: this.form.orderNo,
					body: "bzj",
					totalFee: price,
					timestamp: ""
				}
				const ecsdoasdasdasdasdasdasdasdid = this.form.id
				this.$httpGet("/wxpay/unifyOrderV3", data, (res) => {
					console.log(res);
					let resquest = {
						provider: 'wxpay',
						success: (res)=>{
							console.log(res);
							this.$httpGet("/api/order/payed", {id: ecsdoasdasdasdasdasdasdasdid}, (res) => {
								uni.showToast({ icon: "none", title: '支付成功' })
								setTimeout(() => {
									uni.switchTab({
										url:"/pages/index/order"
									})
								}, 1000)
							})
						},
						fail:(err)=>{
							console.log(err);
							uni.showToast({ icon:"none", title: '支付失败,请重试' })
						},
					}
					let a = Object.assign(resquest, res)
					a.package = a.packageValue
					console.log(a)
					uni.requestPayment(a)
				})
			}
		
		
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5;
	}
	
	/deep/ uni-radio .uni-radio-input{
		background-color: #F40000 !important;
		border-color: #F40000 !important;
	}
	
	/deep/ uni-radio .uni-radio-input:empty{
		background-color: #ffffff !important;
		border-color: #888888 !important;
	}
</style>
