<template>
	<view>
		<view style="margin-top: 60rpx;">
			<u-form :model="form" ref="uForm" :rules="rules">
				<view class="store">
					<u-form-item label="商品名称" :leftIconStyle="{color: '#2E4F1C', fontSize: '40rpx'}" label-width="180">
						<u-input input-align='right' disabled=true
							 v-model="form.goodsName"></u-input>
					</u-form-item>
				</view>
				<view class="store">
					<u-form-item label="商品原价" :leftIconStyle="{color: '#2E4F1C', fontSize: '40rpx'}" label-width="180">
						<u-input input-align='right' disabled=true
							v-model="form.goodsRatePrice"></u-input>
					</u-form-item>
				</view>
				<!-- <view class="store">
					<u-form-item label="商品优惠价" :leftIconStyle="{color: '#2E4F1C', fontSize: '40rpx'}" label-width="180">
						<u-input input-align='right'
							v-model="form.concessionalRate"></u-input>
					</u-form-item>
				</view> -->
				<view class="store">
					<u-form-item label="优惠" :leftIconStyle="{color: '#2E4F1C', fontSize: '40rpx'}" label-width="180">
						<u-input input-align='right' disabled=true
							v-model="form.goodsPrice"></u-input>
					</u-form-item>
				</view>
			</u-form>
			<view class="store">
				<view class="font-color3 font-twenty distance">
					商品简介
				</view>
				<textarea style="height: 200rpx;" disabled=true v-model="form.goodsContent"/>
			</view>
			<view class="store">
				<view class="font-color3 font-twenty distance">
					商品头图
				</view>
				<view style="padding-bottom:40rpx; display: flex;">
					<image :src="image(form.goodsPic)" class="img"></image>
				</view>
			</view>
			<view class="store" v-if="!flag">
				<view class="font-color3 font-twenty distance">
					审核意见
				</view>
				<textarea v-model="form.remark" disabled=true />
			</view>
			<view class="btn-display" v-if="flag">
				<button type="default" class="button btn-color1" @click="show('通过')">通过</button>
				<button type="default" class="button btn-color2" @click="show('不通过')">不通过</button>
			</view>
		</view>
		<ming-pop ref="statement" direction="below" :is_mask="true" :width="100" height="42%" :maskFun="true">
			<pop @close="close()" @noPass='handle' ref="pop"></pop>
		</ming-pop>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import server from "@/api/index";
	import http from '@/common/http.js'
	export default {
		data() {
			return {
				form:{
					goodsName: '商品名称', //商品名称
					goodsRatePrice: '商品原价', //商品原价
					concessionalRate: '商品优惠价', //商品优惠价
					concessional: '优惠', //优惠
					goodsContent: '商品简介', //商品简介
					pic:[]
				},
				width: '240rpx',
				height: '135rpx',
				action: '',
				id: null,
				flag: true,
				userInfo: {},
				type: null
			}
		},
		onLoad(e) {
			this.id = e.id;
			if(e.flag){
				this.flag = false
			}else{
				this.flag = true
			}
			this.getListFn();
			this.userInfo = uni.getStorageSync('userInfo');
		},
		methods:{
			image(e) {
				return http.webUrl + e
			},
			handle(data){
				if(this.type === '不通过'){
					this.handleNoPass(data)
				}else if(this.type === '通过'){
					this.handlePass(data)
				}
			},
			handlePass(data){
				let _this = this;
				uni.showModal({
					title: '提示',
					content: '确定通过审核吗?',
					success: function (res) {
						if (res.confirm) {
							server.getUodateGoods({
								goodsId: _this.id,
								goodsStatus: '2',
								goodsReviewer: _this.userInfo.userId,
								reviewerName: _this.userInfo.nickName,
								remark: data,
							}).then(res =>{
								_this.$refs.uToast.show({
									title: '通过审核成功!',
									type: 'default',
								})
								setTimeout(function()  {
									uni.navigateBack({
									    delta: 1
									});
								}, 2000);
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			handleNoPass(data){
				let _this = this;
				server.getUodateGoods({
					goodsId: _this.id,
					goodsStatus: '3',
					remark: data,
					goodsReviewer: _this.userInfo.userId,
					reviewerName: _this.userInfo.nickName}).then(res =>{
					_this.$refs.uToast.show({
						title: '操作成功!',
						type: 'default',
					})
					setTimeout(function()  {
						uni.navigateBack({
						    delta: 1
						});
					}, 2000);
				})
			},
			getListFn(){
				server.getGoodsInfonew(this.id).then(res =>{
					if(res){
						this.form = res
					}
				})
			},
			show(type) {
				this.type = type;
				this.$refs.statement.show(type);
				this.$refs.pop.show(type);
			},
			close() {
				this.$refs.statement.close();
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F8F8F8;
	}

	.store {
		width: 690rpx;
		background: rgba(46, 79, 28, 0.13);
		border-radius: 16rpx;
		margin: 20rpx auto;
		padding: 0 35rpx;
		.img{
			width: 200rpx;
			height: 135rpx;
			margin-right: 10rpx;
		}
	}

	.distance {
		padding: 20rpx 0rpx;
	}

	.btn-display {
		display: flex;
		justify-content: space-between;
		margin-top: 60rpx;

		.button {
			width: 330rpx;
			border-radius: 48rpx;
			color: #ffffff;
		}

		.btn-color1 {
			background: #2E4F1C
		}

		.btn-color2 {
			background: #CC1019
		}
	}
</style>
