junzitang/pagesT/store/components/AuditApplay.vue

<template>
	<view :class="['qn-page-' + theme]">
		<view v-if="merchantInfo.id">
			<view class="tip-view">
				<view v-if="merchantInfo.auditStatus === 1" class="ibonfont ibonshenhezhong"></view>
				<view style="font-size: 160rpx;" v-if="merchantInfo.auditStatus === 2" class="ibonfont ibonshenhechenggong"></view>
				<view v-if="merchantInfo.auditStatus === 3" class="ibonfont ibonshenheshibai"></view>
				<view v-if="merchantInfo.auditStatus === 1">谢谢您的支持，请等待主商城审核</view>
				<view v-if="merchantInfo.auditStatus === 2">入驻成功</view>
				<view v-if="merchantInfo.auditStatus === 3">拒绝原因：{{ merchantInfo.auditFailReason }}</view>
				<view>申请时间：{{ $u.timeFormat(merchantInfo.createTime, 'yyyy-mm-dd hh:MM:ss') }}</view>
			</view>
			<view class="info-view">
				<view class="info-item clearfix" v-for="(item, index) in apply_term" :key="index">
					<!-- 参数字段label -->
					<view class="float_left info-label">{{ item.name }}</view>
					<!-- 参数Value -->
					<!-- type===1, 系统自带字段 -->
					<block v-if="item.type === 1">
						<!--  
						 data_type=1 单行文本
						 data_type=2 多行文本
						 data_type=3 地区
						 data_type=4 图片
		                -->
						<view class="float_right info-val" v-if="item.data_type === 4">
							<image style="margin-top: 20rpx;" class="info-val-img" :src="merchantInfo[item.prop]" mode="aspectFilt"></image>
						</view>
						<view class="float_right info-val" v-else-if="item.data_type === 3">
							{{ merchantInfo.area.provinceName }}-{{ merchantInfo.area.cityName }}-{{ merchantInfo.area.districtName }}
						</view>
						<view class="float_right info-val" v-else>{{ merchantInfo[item.prop] }}</view>
					</block>
					<block v-else>
						<view class="float_right info-val" v-if="item.data_type !== 4">{{ merchantInfo.info[index - form_length].value }}</view>
						<view class="float_right info-val" v-else>
							<image style="margin-top: 20rpx;" class="info-val-img" :src="merchantInfo.info[index - form_length].value" mode="aspectFilt"></image>
						</view>
					</block>
				</view>
			</view>
			<view class="btn-bottom">
				<view class="btn-li primary-btn-pain" @click="goPage('/pages/index/index', 'switchTab')">回到首页</view>
				<view
					class="btn-li primary-btn"
					v-if="merchantInfo.auditStatus === 2"
					@click="goPage('/pagesT/store/StoreHome?id=' + merchantInfo.id + '&shopName=' + merchantInfo.name)"
				>
					进入商户主页
				</view>
				<view class="btn-li primary-btn" v-else @click="cancelApply">{{ merchantInfo.auditStatus === 1 ? '取消申请' : '重新申请' }}</view>
			</view>
		</view>
		<view v-else style="margin-top: 200rpx;">
			<u-empty text="该商家未开通商户入驻" mode="list"></u-empty>
		</view>
	</view>
	
</template>

<script>
export default {
	props: {
		merchantInfo: {
			type: Object,
			default: () => {
				return {};
			}
		}
	},
	data() {
		return {
			apply_term: {},
			apply_set: {},
			form_length: 1
		};
	},
	created() {
		this.MerchantGetSeting();
	},
	methods: {
		cancelApply() {
			// 取消申请
			if (this.merchantInfo.auditStatus === 1) {
				this.$u.api.delApply(this.merchantInfo.id).then(res => {
					this.$api.msg('已取消');
					this.$emit('cancelApply');
				});
			} else {
				// 重新申请
				this.$emit('cancelApply');
			}
		},
		// 获取设置(小程序)
		MerchantGetSeting() {
			this.$u.api.MerchantGetSeting().then(res => {
				this.apply_set = res.data;
				if (this.apply_set.applyProp) {
					// 获取没有禁用的字段
					this.apply_term = this.apply_set.applyProp.filter(item => item.is_enable);
					// 获取系统自带字段的length
					this.form_length = this.apply_term.filter(item => item.type === 1).length;
				}
			});
		}
	}
};
</script>
<style>
page {
	background-color: #ffffff;
}
</style>
<style scoped lang="scss">
.tip-view {
	font-size: 24rpx;
	color: #999999;
	text-align: center;
	.ibonfont{
		font-size: 130rpx;
		margin: 20rpx 0 40rpx;
	}
}
.info-view {
	padding-top: 20rpx;
	.info-item {
		padding: 0 24rpx;
		line-height: 80rpx;
		border-bottom: 1px solid #f4f4f4;
		color: #666666;
		.info-val {
			font-size: 26rpx;
			color: #333333;
			.info-val-img {
				width: 120rpx;
				height: 120rpx;
				border-radius: 4rpx;
			}
		}
	}
}
.btn-bottom {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 20rpx;
	display: flex;
	background-color: #ffffff;
	border-top: 1px solid #f4f4f4;
	.btn-li {
		flex: 2;
		line-height: 70rpx;
		text-align: center;
		border-radius: 8rpx;
		&:first-child {
			border: 1px solid #f53c28;
			margin-right: 10rpx;
		}
		&:last-child {
			color: #ffffff;
			margin-left: 10px;
		}
	}
}
</style>