<template>
	<view style="background-color: #f7f8faff;">


		<view style="display: flex;justify-content: space-evenly; margin: 64rpx 0; ">
			<!-- <u-tabs :list="list1" @change="click"></u-tabs> -->
			<view class="" style=" opacity: 0.4000000059604645;
 color: #000000e6;
 font-size: 32rpx;
 font-weight: 600;" :class="active == 1 ? 'activeB' : ''" @click="click(1)">
				发布求租
			</view>
			<view class="" style=" opacity: 0.4000000059604645;
 color: #000000e6;
 font-size: 32rpx;
 font-weight: 600;" :class="active == 2 ? 'activeB' : ''" @click="click(2)">
				发布求购
			</view>
		</view>
		<view class="box">
			<view class="" style="padding: 32rpx;position: relative;">
				<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm">
					<u-form-item label="设备信息" labelWidth="200rpx" prop="userInfo.name" borderBottom ref="item1"
						@click="goChoose">
						<u--input v-model="model1.userInfo.name" disabled disabledColor="#ffffff" placeholder="请选择设备"
							border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
						<view class="posBox" style="top:32rpx; left:32rpx">
							<image src="../../static/Group 193@2x.png" style="width: 40rpx;height: 24rpx;" mode=""></image>
						</view>
					</u-form-item>
					<u-form-item label="设备品牌" labelWidth="200rpx" prop="userInfo.brand_name" borderBottom
						@click="goLogo" ref="item1">
						<u--input v-model="model1.userInfo.brand_name" disabled disabledColor="#ffffff"
							placeholder="请选择" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="设备型号" labelWidth="200rpx" prop="userInfo.xh_name" borderBottom @click="goNum"
						ref="item1">
						<u--input v-model="model1.userInfo.xh_name" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="所在地区" labelWidth="200rpx" prop="userInfo.region" borderBottom ref="item1"
						@click="goMap">
						<u--input v-model="model1.userInfo.region" disabled disabledColor="#ffffff" placeholder="请选择"
							border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
						<view class="posBox" style=" left:32rpx" :style="active == 2 ? 'top:58%' : 'top:49.5%;'">
							<image src="../../static/Group 193@2x.png" style="width: 40rpx;height: 24rpx;" mode=""></image>
						</view>
					</u-form-item>
					<u-form-item v-if="nav == '发布求租'" label="租赁时间" labelWidth="200rpx" prop="userInfo.day" borderBottom
						ref="item1">
						<view class="flexb" style="width: 100%;">
							<u--input v-model="model1.userInfo.day" border="none" ></u--input>
							<text>{{model1.userInfo.day_unit || '天'}}</text>
						</view>
						<view class="posBox" style="top:64.5%; left:32rpx">
							<image src="../../static/Group 193@2x.png" style="width: 40rpx;height: 24rpx;" mode=""></image>
						</view>
					</u-form-item>
					<u-form-item label="设备预算" labelWidth="200rpx" prop="userInfo.price"    borderBottom
						ref="item1">
						<view class="flexb" style="width: 100%;">
							<u--input v-model="model1.userInfo.price" border="none" placeholder="0" ></u--input>
							<text>{{model1.userInfo.price_unit || '万元'}}</text>
						</view>
					</u-form-item>

				</u--form>
				<!-- <u-datetime-picker :show="showTime" v-model="model1.userInfo.day" mode="date"></u-datetime-picker> -->
			</view>
		</view>
		<view class="bom">
			<u-button text="确认发布" style="color: white;" color="linear-gradient(to right, #46BAEC,#2F67D3)"
				@click="submit"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showTime: false,
				active: 1,
				list1: [{
					name: '发布求租',
				}, {
					name: '发布求购',
				}, ],
				model1: {
					userInfo: {
						brand_name: '',
						name: '',
						xh_name: '',
						region: '',
						price: '',
						day: '',
						lat: '',
						lng: ''
					},
				},
				actions: [{
						name: '男',
					},
					{
						name: '女',
					},
					{
						name: '保密',
					},
				],
				rules: {
					'userInfo.name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'userInfo.sex': {
						type: 'string',
						max: 1,
						required: true,
						message: '请选择男或女',
						trigger: ['blur', 'change']
					},
				},
				nav: "",
			}
		},
		onLoad(option) {
			console.log(option);
			if (option && option.val) {
				if (option.val === "4") {
					console.log(option.val);
					this.active = 2
					this.nav = '发布求购'
				} else {
					this.active = 1
					this.nav = '发布求租'
				}
			}
			let token = uni.getStorageSync('token')
			if (token) {
				let info = JSON.parse(option && option.info)
				this.model1.userInfo = info
				this.model1.userInfo.name = info.brand.name
			} else {
				uni.showToast({
					title: '请登陆后重试',
					icon: 'none'
				})
			
				setTimeout(() => {
					uni.redirectTo({
						url: '/pages/index/login'
					})
				}, 2000)
			}
			

		},
		onShow() {
			let pagearr = getCurrentPages(); //获取应用页面栈
			let currentPage = pagearr[pagearr.length - 1]; //获取当前页面信息
			console.log('option:', currentPage) //获取页面传递的信息
			
			
			this.model1.userInfo.category_id = currentPage.$vm.category_id || currentPage.$vm.model1.userInfo.category.id
			this.model1.userInfo.name = currentPage.$vm.name  || currentPage.$vm.model1.userInfo.category.name
			this.model1.userInfo.brand_id = currentPage.$vm.brand_id  || currentPage.$vm.model1.userInfo.brand.id
			this.model1.userInfo.brand_name = currentPage.$vm.brand_name  || currentPage.$vm.model1.userInfo.brand.id
			this.model1.userInfo.xinghao_id = currentPage.$vm.xh_id  || currentPage.$vm.model1.userInfo.xinghao.id
			this.model1.userInfo.xh_name = currentPage.$vm.xh_name  || currentPage.$vm.model1.userInfo.xinghao.name
			
			console.log(this.model1.userInfo);
		},
		methods: {
			goMap() {
				let that = this
				uni.chooseLocation({
					success: function(res) {
						console.log('位置名称:' + res.name);
						console.log('详细地址:' + res.address);
						console.log('纬度:' + res.latitude);
						console.log('经度:' + res.longitude);
						console.log(that.model1);
						that.model1.userInfo.region = res.address
						that.model1.userInfo.lat = res.latitude
						that.model1.userInfo.lng = res.longitude
					}
				});

			},
			submit() {
				if(this.model1.userInfo.price && this.model1.userInfo.price==0){
					uni.showToast({
						title:'设备预算需大于0',
						icon:'none'
					})
				}else{
					let p = {
						category_id: this.model1.userInfo.category_id,
						brand_id: this.model1.userInfo.brand_id,
						xinghao_id: this.model1.userInfo.xinghao_id,
						day: this.model1.userInfo.day,
						price: this.model1.userInfo.price,
						region: this.model1.userInfo.region.slice(6,9),
						province: this.model1.userInfo.region.slice(0, 3),
						city: this.model1.userInfo.region.slice(3, 6),
						address: this.model1.userInfo.region
					}
					uni.$u.http.post(this.nav == '发布求购' ? '/api/equip/add_equip_buy' : '/api/equip/add_equip_zu', p).then(
						res => {
					
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
							let pagearr = getCurrentPages(); //获取应用页面栈
							let currentPage = pagearr[pagearr.length - 1]; //获取当前页面信息
							console.log('option:', currentPage) //获取页面传递的信息
							currentPage.$vm.category_id = ''
							currentPage.$vm.name = ''
							currentPage.$vm.brand_id = ''
							currentPage.$vm.brand_name = ''
							currentPage.$vm.xh_id = ''
							currentPage.$vm.xh_name = ''
							if (res.code == 1) {
								setTimeout(() => {
									uni.navigateBack({
										delta: 1
									})
								}, 1500)
					
							}
					
						}).catch(err => {
						uni.showToast({
							title: err.msg,
							icon: 'none'
						})
					}).finally(() => {
						uni.reLaunch({
							url: 'pages/index/buy'
						})
					})
				}
				
			},
			click(item) {
				this.active = item
				if (item == 2) {
					this.nav = '发布求购'
				} else {
					this.nav = '发布求租'
				}
				this.model1.userInfo = {
					brand_name: '',
					name: '',
					xh_name: '',
					region: '',
					price: '',
					day: '',
					province: '',
					city: '',
					address: ''
				}
			},
			goChoose() {
				uni.navigateTo({
					url: '/pages/subPages/more?val=2'
				})
			},
			goLogo() {
				uni.navigateTo({
					url: '/pages/sellAndBuy/logo?category_id=' + this.model1.userInfo.category_id
				})
			},
			goNum() {
				uni.navigateTo({
					url: `/pages/sellAndBuy/chooseNum?category_id=${this.model1.userInfo.category_id}&brand_id=${this.model1.userInfo.brand_id}`
				})
			}
		}
	}
</script>

<style scoped>
	.box {
		border-radius: 16rpx;
		background: #ffffffff;
		/* margin-bottom: 32rpx; */
		margin: 24rpx;
	}
.posBox{
	width: 40rpx;
	height: 24rpx;
	position: absolute;
}
	.bom {
		margin-bottom: 16rpx;
		position: fixed;
		bottom: 40rpx;
		width: 92%;
		margin-left: 4%;
	}

	.activeB {
		color: #000000e6 !important;
		opacity: 1 !important;
		font-size: 44rpx !important;
		font-weight: 600 !important;
		padding-bottom: 15rpx;
		border-bottom: 1px solid #3375D8;
	}
	.flexb{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
</style>