<template>
	<view class="page">
		<navBar title="定制我家的无主灯" :back="true" color="black" background="white" />
		<image class="topImg" :src="picUrl + '/static/other/noMain_img4.png'" mode=""></image>

		<view class="cen">
			<image class="water" src="/static/index/water.png" mode=""></image>
			<image class="halfC" src="/static/index/halfCircle_275.png" mode=""></image>
			定制我家的无主灯
		</view>

		<view class="parmasBox">
			<view class="con">
				<view class="top">
					<view class="item">
						<view class="name">
							户型
						</view>
						<view class="des">
							{{selHx.value}}
						</view>
					</view>
					<view class="item">
						<view class="name">
							空间
						</view>
						<view class="des">
							{{selKj.value}}
						</view>
					</view>
					<view class="item">
						<view class="name">
							品牌
						</view>
						<view class="des">
							{{selPp.value}}
						</view>
					</view>
					<view class="item">
						<view class="name">
							系列
						</view>
						<view class="des">
							{{selXl.value}}
						</view>
					</view>
					<view class="item">
						<view class="name">
							版本
						</view>
						<view class="des">
							{{selBb.value}}
						</view>
					</view>
				</view>
			</view>
		</view>


		<image @click="back" src="/static/index/backBtnImg.png" mode="" class="rule_img"></image>
		<view class="bot">
			<!-- <view class="left" @click="showPreviewConfig=true"> -->
			<view class="left" @click="">
				<view class="price">
					￥{{totalPrice.toFixed(2)}}
				</view>
				<image v-if="!showPreviewConfig" src="/static/index/arrDown.png" mode=""
					@click="showPreviewConfig=true"></image>
				<image v-else src="/static/index/arrUp.png" mode="" @click="showPreviewConfig=false"></image>
			</view>
			<view class="right" @click="showFixInfo=true">
				确认配置
			</view>
		</view>


		<u-popup :show="showFixInfo" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">

				</view>
				<view class="cen">
					信息填写
				</view>
				<view class="close" @click="showFixInfo=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="label">
						收货人
					</view>
					<u--input clearable placeholder="请输入收货人" border="surround" v-model="name"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						电话
					</view>
					<u--input clearable placeholder="请输入电话" border="surround" v-model="phone"
						@change="change"></u--input>
				</view>
				<view class="item" style="margin-bottom: 24rpx;height: auto;">
					<view class="label">
						收货地址
					</view>
					<u--textarea v-model="addr" placeholder="请输入收货地址"></u--textarea>
				</view>

				<view class="item" style="margin-bottom: 24rpx;">
					<view class="label">
						备注
					</view>
					<u--input clearable placeholder="请输入备注" border="surround" v-model="remark"
						@change="change"></u--input>
				</view>
				<u-button text="确认下单" color="#333" @click="postOrder"></u-button>
			</view>
		</u-popup>


		<!-- <u-popup :show="showPreviewConfig" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">
				</view>
				<view class="cen">
					清单
				</view>
				<view class="close" @click="showPreviewConfig=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="top">
						<view class="name">
							户型
						</view>
						<view class="info">
							一室两厅
						</view>
					</view>
				</view>
				<view class="item">
					<view class="top">
						<view class="name">
							空间
						</view>
						<view class="info">
							全屋
						</view>
					</view>
				</view>
				<view class="item">
					<view class="top">
						<view class="name">
							品牌
						</view>
						<view class="info">
							XXX品牌
						</view>
					</view>
				</view>
				<view class="item">
					<view class="top">
						<view class="name">
							系列
						</view>
						<view class="info">
							3系
						</view>
					</view>
				</view>
				<view class="item">
					<view class="top">
						<view class="name">
							版本
						</view>
						<view class="info">
							标准版
						</view>
					</view>
				</view>
			</view>
		</u-popup> -->

	</view>
</template>

<script>
	import {
		postOrderReq,
	} from '@/api/test/index.js'
	export default {
		components: {

		},
		data() {
			return {
				picUrl: this.$picUrl,

				showFixInfo: false,

				showPreviewConfig: false,

				selHx: null,
				selKj: null,
				selPp: null,
				selXl: null,
				selBb: null,

				totalPrice: 0,

				name: '',
				phone: '',
				addr: '',
				remark: '',

				orderId: ''
			}
		},
		onLoad(options) {

			this.selHx = getApp().selHx
			this.selKj = getApp().selKj
			this.selPp = getApp().selPp
			this.selXl = getApp().selXl
			this.selBb = getApp().selBb

			this.totalPrice = getApp().totalPrice
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			async postOrder() {
				console.log('无主灯下单参数', {
					address: this.addr,
					phone: this.phone,
					name: this.name,
					remark: this.remark,
					config_id: this.selHx.id + ',' + this.selKj.id + ',' + this.selPp.id + ',' + this.selXl
						.id + ',' + this.selBb.id,
					type: 1
					// lamp_id: '2,4,6'
				});
				let res = await postOrderReq({
					address: this.addr,
					phone: this.phone,
					name: this.name,
					remark: this.remark,
					config_id: this.selHx.id + ',' + this.selKj.id + ',' + this.selPp.id + ',' + this.selXl
						.id + ',' + this.selBb.id,
					type: 1
					// lamp_id: '2,4,6'
				})
				if (res.code == 0) {
					console.log('提交订单返回值: ', res);
					this.$toast('提交成功')

					this.orderId = res.data.orderId
					this.showFixInfo = false
				} else {
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>