smart-tourism/smart-ui-app/pages/shop/manage.vue

<template>
	<view class="page">
		<view class="btg" v-if="item.auditFlag == 0" style="margin: 0px 0px 12px 0px;background-color: #f0f9eb;color: #67c23a;">后台审核中..... 审核通过后才能展示出来</view>
		<view class="btg" v-if="item.orders" style="margin: 0px 0px 12px 0px;background-color: #f0f9eb;color: #67c23a;" @click="navigate('/pages/order/sale')">
			<text>你有{{ item.orders }}条待处理订单,请尽快处理</text>
			<text class="icon">&#xe62d;</text>
		</view>
		<view class="btg" v-if="item.auditFlag == 2" style="margin: 0px 0px 12px 0px;" @click="navigate('/pages/shop/apply?item=' + JSON.stringify(item))">
			<text>审核不通过： {{ item.msg }}</text>
			<text class="icon">&#xe62d;</text>
		</view>
		<view class="hotel_item">
			<u-grid :col="3" class="cd">
				<u-grid-item @click="navigate('/pages/shop/apply?item=' + JSON.stringify(item))">
					<u-badge :is-dot="true" :offset="[25, 40]" v-if="item.auditFlag == 2"></u-badge>
					<view class="icon" style="background-color: #F44336">&#xe610;</view>
					<view class="grid-text">店铺信息</view>
				</u-grid-item>
				<u-grid-item @click="navigate('/pages/shop/detail?shopId=' + item.shopId)">
					<view class="icon" style="background-color: #67c23a">&#xec86;</view>
					<view class="grid-text">店铺预览</view>
				</u-grid-item>
				<u-grid-item @click="navigate('/pages/shop/up?item=' + JSON.stringify(item))">
					<view class="icon" style="background-color: #607D8B">&#xebb3;</view>
					<view class="grid-text">上报数据</view>
				</u-grid-item>
			</u-grid>
			<view v-if="item.shopType == 2">
				<view style="margin: 20px 0px 20px 0px;"><u-divider>酒店预订</u-divider></view>
				<u-grid :col="3" class="cd">
					<u-grid-item @click="navigate('/pages/shop/hotel/room?shopId=' + item.shopId)">
						<view class="icon" style="background-color: #FF9800">&#xe736;</view>
						<view class="grid-text">房间管理</view>
					</u-grid-item>
					<u-grid-item @click="navigate('/pages/order/sale')">
						<u-badge :count="item.orders" :offset="[20, 30]" v-if="item.auditFlag == 1"></u-badge>
						<view class="icon" style="background-color: #9E9E9E">&#xe705;</view>
						<view class="grid-text">预订订单</view>
					</u-grid-item>
				</u-grid>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			ip: this.$http.urls.ip,
			item: {},
			shopId: '' //店铺id
		};
	},
	onLoad(e) {
		this.shopId = e.shopId;
		this.getData();
	},
	methods: {
		//获取数据
		getData() {
			this.$http.request({
				url: this.$http.urls.shopManage,
				data: { shopId: this.shopId },
				success: res => {
					this.item = res.data.data.shop;
					//待处理订单
					if (res.data.data.orders) {
						this.item.orders = res.data.data.orders.length;
					}
					this.item.imgs = []; //轮播图
					this.item.showPictures = this.item.showPictures.split(',');
					this.item.pic = this.item.pic.split(',');
					this.item.showPictures.forEach(item => {
						this.item.imgs.push({ image: this.ip + item });
					});
				}
			});
		},
		navigate(url) {
			if (url.indexOf('/apply') == -1 && this.item.auditFlag != 1) {
				uni.showModal({ content: '审核通过后才能操作', showCancel: false });
				return;
			}
			uni.navigateTo({ url: url });
		}
	}
};
</script>
<style lang="scss">
.page {
	padding: 12px;
}
.cd {
	margin-top: 10px;
	text-align: center;
	.icon {
		font-size: 30px;
		padding: 5px 8px;
		background-color: red;
		color: white;
		margin-bottom: 5px;
		border-radius: 5px;
	}
}
</style>