QianNiaoShop/pages/enterprise/index.vue

<template>
	<view class="enterprise">
		<view class="enterprise-title">我管理的店铺</view>
		<view class="e-ul">
			<view v-for="(item, index) in enterprise_list" :key="index" class="e-li clearfix" @click="goShop(item)">
				<view class="float_left"><image :src="item.logo" mode="aspectFill"></image></view>
				<view class="float_left en-info">
					<view class="en-name">{{ item.enterpriseName }}</view>
					<view class="en-time">有效期: {{ $u.timeFormat(item.expireTime) }}</view>
				</view>
				<view class="status-r">
					<u-tag v-if="item.expireStatus" text="已打烊" size="mini" mode="plain" type="info" />
					<u-tag v-else text="营业中" size="mini" mode="plain" type="success" />
					<text class="custom-icon custom-icon-jinru"></text>
				</view>
			</view>
			<u-loadmore status="nomore" />
		</view>
		<view class="submit-btn" @click="logout"><view class="btn-min">切换登录账号</view></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			enterprise_list: []
		};
	},
	onLoad() {
		this.getAllEnterprise();
	},
	methods: {
		// 获取企业列表
		getAllEnterprise() {
			this.$u.api.getAllEnterprise().then(res => {
				this.enterprise_list = res.data;
			});
		},
		// 切换登录账号（退出登录）
		logout() {
			uni.clearStorageSync();
			this.$store.commit('commit_hasLogin', false);
			this.goPage('/pages/login/index', 'reLaunch');
		},
		// 进入企业
		async goShop(row) {
			this.$store.commit('commit_enToken', row.token);
			this.$store.commit('commit_enterprise', row);
			await this.getAclList(row.roleType);
			await this.getStaffByToken(row.roleType);
			this.goPage('/pages/index/index','switchTab')
		},
		// 获取登录权限
		async getAclList(roleType){
			await this.$u.api.getAclList(roleType).then(res=>{
				this.$store.commit('commit_access', res.data);
			})
		},
		async getStaffByToken(roleType){
			await this.$u.api.getStaffByToken(roleType).then(res=>{
				this.$store.commit('commit_userInfo', res.data);
			})
		}
	}
};
</script>

<style lang="scss" scoped>
.enterprise {
	padding-bottom: 140rpx;
	.enterprise-title {
		font-size: 24rpx;
		font-weight: 600;
		line-height: 80rpx;
		padding: 0 25rpx;
	}
	.e-ul {
		.e-li {
			width: 700rpx;
			margin: 0 auto 20rpx;
			background-color: #ffffff;
			border-radius: 10rpx;
			padding: 20rpx;
			position: relative;
			image {
				width: 100rpx;
				height: 100rpx;
				border-radius: 100%;
				margin-right: 20rpx;
			}
			.en-info {
				.en-name {
					padding-top: 10rpx;
					font-weight: 700;
				}
				.en-time {
					padding-top: 10rpx;
					font-size: 22rpx;
					color: #999999;
				}
			}
			.status-r {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: 20rpx;
				.custom-icon {
					vertical-align: middle;
					margin-left: 10rpx;
					color: #333333;
					font-size: 28rpx;
				}
			}
		}
	}
}
</style>