<template>
	<view>
		<u--form class="truckInfo-con" labelPosition="top" labelWidth="100" :model="truckInfo" ref="uForm">
			<u-form-item label="货车类型" prop="truckInfo.idTruckType" borderBottom @click="showTruckType = true"
				ref="itemTruckType">
				<u--input v-model="truckInfo.truckTypeName" disabled  placeholder="请选择货车类型"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<u-form-item label="车牌号" prop="truckInfo.truckCode" borderBottom ref="itemTruckCode">
				<u--input placeholder="请输入车牌号"  v-model="truckInfo.truckCode" border="none"></u--input>
			</u-form-item>
			<u-form-item label="能源类型" prop="truckInfo.energyType" borderBottom ref="itemEnergyType">
				<u--input placeholder="请输入能源类型" v-model="truckInfo.energyType" border="none"></u--input>
			</u-form-item>
			<u-form-item label="备注" prop="truckInfo.truckMemo" borderBottom ref="itemMemo">
				<u--textarea v-model="truckInfo.truckMemo" placeholder="请输入备注" border="none"></u--textarea>
			</u-form-item>

			<u-button @click="submit" type="primary" size="large" text="提交"></u-button>
		</u--form>
		<u-picker :show="showTruckType" :columns="pickerColumns" closeOnClickOverlay @close="onPickerClose" @cancel="onPickerClose" @confirm="onPickerConfirm"
			keyName="truckTypeName"></u-picker>
	</view>
</template>

<script>
	import request from '@/common/libs/request.js';

	export default {
		mounted() {
			this.initData()
		},
		data() {
			return {
				truckInfo: {
					id: 0,
					idTruckType: 0,
					truckTypeName: '',
					truckCode: '',
					energyType: '',
					truckMemo: ''
				},
				showTruckType: false,
				pickerColumns:[],
				truckTypes: [],
			}
		},
		methods: {
			submit() {
				let _that = this;
				if(!_that.truckInfo.truckCode){
					uni.showToast({
						title: "请输入车牌号",
						icon: "error"
					})
					return
				}
				var trukData = {
					"idTruckType": _that.truckInfo.idTruckType,
					"truckCode":_that.truckInfo.truckCode,
					"energyType": _that.truckInfo.energyType,
					"truckMemo": _that.truckInfo.truckMemo
				}
				var truckInfo = {
					 "truckInfo": JSON.stringify(trukData),
				};
				request.httpPost("/dnyDriver/addTruckInfo", truckInfo, false).then(res => {
					console.log(res);

					if (res.httpCode == 200) {
						uni.reLaunch({
							url: '/pages/index/myTruckList',
						})
					} else {
						uni.showToast({
							title: res.msg,
							icon: "error"
						})
					}
				})

			},
			initData() {
				let _that = this;
				request.httpPost("/dnyDriver/getTruckTypeList", {}).then(res => {
					if (res.httpCode == 200) {
						_that.truckTypes = res.data
						_that.pickerColumns.push(_that.truckTypes)
					} else {
						uni.showToast({
							title: res.msg,
							icon: "error"
						})
					}
				});
			},
			onPickerClose() {
				this.showTruckType = false
			},
			onPickerConfirm(item) {
				console.log(item)
				this.truckInfo.idTruckType = item.value[0].id
				this.truckInfo.truckTypeName = item.value[0].truckTypeName
				this.showTruckType = false
			}
		}
	}
</script>
<style lang="scss" scoped>
	.truckInfo-con {
		margin: 30rpx 30rpx;
	}
</style>
