<template>
	<view class="u-page">
		<view class="u-demo-block">
			<text class="u-demo-block__title">新增设备</text>
			<view class="">
				<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
				<u--form labelPosition="left" ref="form">
					<u-form-item label="名称" prop="" borderBottom ref="item1">
						<u--input v-model="form.deviceName" border="none" placeholder="设备名称"></u--input>
					</u-form-item>
					<u-form-item label="编号" prop="" borderBottom ref="item1" @click="openUseNo()">
						<u--input  v-model="form.useNoName" disabledColor="#ffffff" placeholder="请选择编号" border="none" :disabled="true">
						</u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
				</u--form>
				<view>
					<u-picker keyName="useNoName" :show="show" :columns="columns" @confirm="confirm" @cancel="cancel"
						confirmColor="#53a591">
					</u-picker>
				</view>
				<view style="margin: 30px;">
					<u-button color="#26a495" text="提交" @click="submitAdd()"></u-button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				data: [],
				columns: [
					[]
				],
				form: {
					deviceName:'',
					useNoName :'',
					deviceUseNo:''
				}
			}
		},
		onLoad() {
			this.getList()
		},
		methods: {
			openUseNo() {
				this.show = true
			},
			confirm(e) {
				console.log('confirm', e)
				this.form.useNoName = e.value[0].useNoName;
				this.form.deviceUseNo = e.value[0].useNoId;
				this.show = false
			},
			cancel() {
				uni.showTabBar({
					animation: true
				})
				this.show = false
			},
			async getList() {
				const {
					data: res
				} = await this.$httpRequest({
					url: '/api/control/useNoList',
					method: 'get',
				});
				if (res.code === 200) {
					var data = res.data
					for (var i = 0; i < data.length; i++) {
						this.columns[0].push(data[i])
					}
				} else {

				}
			},
			async submitAdd() {
				const {
					data: res
				} = await this.$httpRequest({
					url: '/api/control/add',
					method: 'post',
					data: this.form
				});
				if (res.code === 200) {
					this.form = {}
					uni.showLoading({
						icon: 'ok',
						duration: 2500,
						title: "保存成功",
					});
					this.$goto('index')
				} else {
			
				}
			},
		},
	}
</script>

<style lang="scss">

</style>
