<template>
	<view>
		<view class="cmain animated fadeInDown">
			<view class="form_group">
				<view class="lable re">贸易区域</view>
				<picker @click="selectArea()" :disabled="true">
					<input placeholder="请选择" v-model="item.tradeAreaName" :disabled="true" />
					<view class="icon more">&#xe8f2;</view>
				</picker>
			</view>
			<view class="form_group">
				<view class="lable re">商品名称</view>
				<picker @click="selectGoods()" :disabled="true">
					<input placeholder="请选择" v-model="item.goodsName" :disabled="true" />
					<view class="icon more">&#xe8f2;</view>
				</picker>
			</view>
			<view class="form_group">
				<view class="lable re">商品价格</view>
				<input type="number" placeholder="请输入" v-model="item.price" />
				<view class="ops" v-if="flag === '编辑商品'">{{ item.goodsUnits }}</view>
				<view class="ops" v-else>{{ item.unit }}</view>
			</view>
			<view class="form_group">
				<view class="lable re">商品数量</view>
				<input type="number" placeholder="请输入" v-model="item.stock" />
			</view>
			<view class="form_group">
				<view class="lable re">净重</view>
				<input placeholder="请输入" v-model="item.netWeight" />
				<view class="ops" v-if="flag === '编辑商品'">{{ item.goodsUnits }}</view>
				<view class="ops" v-else>{{ item.unit }}</view>
			</view>
			<view class="form_group">
				<view class="lable re">毛重</view>
				<input placeholder="请输入" v-model="item.grossWeight" />
				<view class="ops" v-if="flag === '编辑商品'">{{ item.goodsUnits }}</view>
				<view class="ops" v-else>{{ item.unit }}</view>
			</view>
		</view>
		<view class="mfooter">
			<view class="flex">
				<view class="f">
					<button class="save btn" @click="save(0)">下架</button>
				</view>
				<view class="f">
					<button class="btn" @click="save(1)">一键发售</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			flag: '新增商品',
			item: {}
		};
	},
	onLoad(e) {
		if (e.id) {
			this.flag = '编辑商品';
			this.http.request({
				url: '/level-one-server/app/TbGoodsTransit/getById?id=' + e.id,
				success: res => {
					this.item = res.data.data;
					uni.setNavigationBarTitle({ title: this.item.goodsStatus == 1 ? '编辑商品(在售)' : '编辑商品(下架)' });
				}
			});
		}
		//选择互市回显
		uni.$on('area', res => {
			this.item.tradeAreaName = res.name;
			this.item.tradeAreaId = res.id;
			this.$forceUpdate();
		});
		//选择商品回显
		uni.$on('selects', res => {
			this.item.goodsName = res.name;
			this.item.unit = res.unit;
			if (this.flag == '新增商品') {
				this.item.id = res.id;
			}
			this.$forceUpdate();
		});
	},
	methods: {
		//选择互市区
		selectArea() {
			uni.navigateTo({ url: '/pages/market/one/merchant/goods/area' });
		},
		//选择商品
		selectGoods() {
			if (this.item.tradeAreaId) {
				uni.navigateTo({ url: '/pages/market/one/merchant/goods/selects?tradeAreaId=' + this.item.tradeAreaId + '&tradeAreaName=' + this.item.tradeAreaName });
			} else {
				uni.showModal({ content: '请先选择互市区', showCancel: false });
				return;
			}
		},
		save(goodsStatus) {
			let rule = [
				{ name: 'tradeAreaName', checkType: 'notnull', errorMsg: '请选择互市区' },
				{ name: 'goodsName', checkType: 'notnull', errorMsg: '请选择商品' },
				{ name: 'price', checkType: 'notnull', errorMsg: '请输入商品价格' },
				{ name: 'stock', checkType: 'notnull', errorMsg: '请输入商品数量' },
				{ name: 'netWeight', checkType: 'notnull', errorMsg: '请输入净重' },
				{ name: 'grossWeight', checkType: 'notnull', errorMsg: '请输入毛重' }
			];
			if (!this.verify.check(this.item, rule)) {
				uni.showModal({ content: this.verify.error, showCancel: false });
				return false;
			}
			let action = this.flag == '新增商品' ? 'add' : 'update';
			this.item.goodsStatus = goodsStatus;
			delete this.item.createTime;
			delete this.item.createBy;
			delete this.item.createName;
			this.http.request({
				url: '/level-one-server/app/TbGoodsTransit/' + action,
				method: 'POST',
				data: this.item,
				success: res => {
					uni.showToast({ title: '操作成功' });
					setTimeout(() => {
						uni.$emit('goodsHandle');
						uni.navigateBack();
					}, 1000);
				}
			});
		}
	}
};
</script>

<style lang="scss">
.btn {
	width: 100%;
	border-radius: 5px;
}
</style>
