RedDragonfly/pages/bazaar/bodyOfBottle/bodyOfBottle.vue

<template>
	<view class="bodyOfBottle">
		<view class="top">
			<view class="input">
				<input type="text" v-model="code" placeholder="请输入瓶身码 例: 201806021234567" @input="input">
			</view>
			<view class="input">
				<input type="text" v-model="production" @input="input">
			</view>
			<view class="btn">
				<button type="default" :disabled="disabled">搜索</button>
			</view>
		</view>
		<view class="bom">
			<view class="list" v-for="(v,i) in list" :key="i" @click="production = v">
				{{v}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				code: '',
				production: '',
				disabled: true,
				list: ['1号生产线', '2号生产线', '3号生产线', '9号生产线', '6号生产线', '4号生产线 (20L)', '8号生产线', '5号生产线', '10号生产线', '一号车间中2号生产线', '一号车间中3号生产线', '7号生产线', '4号生产线 (10L)', ]
			};
		},
		onLoad() {
			
		},
		methods:{
			input(){
				if (this.code && this.production){
					this.disabled = false
				}else{
					this.disabled = true
				}
			}
		}
	}
</script>

<style lang="scss">
.bodyOfBottle{
	.top{
		padding: 10rpx 30rpx 0;
		.input{
			height: 80rpx;
			border-bottom: 1rpx solid #dfdfdf;
			input{
				height: 100%;
			}
		}
		.btn{
			padding: 0 30rpx;
			margin-top: 30rpx;
		}
	}
	.bom{
		padding: 30rpx 20rpx 0;
		.list{
			padding: 20rpx 0;
			border-bottom: 1rpx solid #e7e7e7;
			&:last-child{
				border-bottom: 0;
			}
		}
	}
}
</style>