门店部门管理

2021-09-07 16:58:17 +08:00
parent f472df0cfa
commit 4f33cdbceb
9 changed files with 1988 additions and 20 deletions
--- a/pages/shop/lists.vue
+++ b/pages/shop/lists.vue
@@ -0,0 +1,112 @@
+<template>
+	<view class="lists">
+		<block v-if="lists.length > 0">
+			<view class="lists-item" v-for="(item, index) in lists" :key="index" @click="$Router.push({name: 'shopCreate', params: { id: item.store_id }})">
+				<view class="header">
+					<image class="logo" :src="item.cover" mode="aspectFill"></image>
+					<view class="title">{{item.name}}</view>
+					<view class="time"><text>营业时间{{item.start_time}} 至 {{item.end_time}}</text></view>
+					<view class="icons">
+						<uni-icons type="arrowright" color="#999" size="18"></uni-icons>
+					</view>
+				</view>
+				<view class="address">店铺地址：{{item.address}}</view>
+			</view>
+		</block>
+		<block v-else>
+			<view class="list-null">
+				<image class="icon" src="@/static/icons/approve-icon.png" mode="widthFix"></image>
+				<view class="sub-title">暂未创建店铺/部门</view>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	import { shops } from '@/apis/interfaces/shop'
+	export default {
+		data() {
+			return {
+				lists: []
+			};
+		},
+		onShow(){
+			shops().then(res => {
+				console.log(res)
+				this.lists = res.data
+			})
+		},
+		onNavigationBarButtonTap() {
+			this.$Router.push({ name: 'shopCreate' })
+		}
+	}
+</script>
+
+<style lang="scss">
+	// 空提示
+	.list-null{
+		width: 100vw;
+		height: 100vh;
+		padding-bottom: 20vh;
+		box-sizing: border-box;
+		background: white;
+		text-align: center;
+		@extend .vertical;
+		.sub-title{
+			color: $text-gray;
+			font-size: $title-size-m;
+		}
+		.icon{
+			width: 288rpx;
+		}
+	}
+	// 列表
+	.lists-item{
+		background: white;
+		margin: $margin;
+		border-radius: $radius/2;
+		padding: $padding;
+		.header{
+			position: relative;
+			padding-left: 128rpx;
+			padding-right: 100rpx;
+			min-height: 108rpx;
+			padding-bottom: $padding - 10;
+			.logo{
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 108rpx;
+				height: 108rpx;
+				border-radius: 50%;
+			}
+			.title{
+				line-height: 60rpx;
+				font-size: $title-size;
+				font-weight: bold;
+			}
+			.time{
+				line-height: 40rpx;
+				font-size: $title-size-sm;
+				text{
+					background-color: $border-color-lg;
+					color: $text-gray;
+					padding: 0 $padding/2;
+				}
+			}
+			.icons{
+				position: absolute;
+				right: 0;
+				top: 0;
+				line-height: 108rpx;
+			}
+		}
+		.address{
+			border-top: solid 1rpx $border-color;
+			padding-top: $padding - 10;
+			font-size: $title-size-m;
+			color: $text-gray;
+			left: 50rpx;
+		}
+	}
+</style>