第一次提交

2023-08-04 13:04:21 +08:00
commit 7a73b38bd5
764 changed files with 166417 additions and 0 deletions
--- a/package/shops/detail/components/shop-banner.vue
+++ b/package/shops/detail/components/shop-banner.vue
@@ -0,0 +1,177 @@
+<template>
+	<view>
+		<block v-if="shop.shopName">
+			<!-- 搜索框 -->
+			<view class="shop-banner" v-if="shop.backgroundUrl" :style="'background-image: url('+ shop.backgroundUrl +');background-size: 100%;'">
+				<view class="shop-logo">
+					<u-avatar :src="shop.logoUrl" :size="120" mode="square" :show-level="true"></u-avatar>
+				</view>
+				<view class="shop-info">
+					<view class="title">{{shop.shopName}}
+					<u-icon name="star-fill" color="#fd8008" v-if="shop.follow" @click="onFollow(shop.shopId)"></u-icon>
+					<u-icon name="star" v-else @click="onFollow(shop.shopId)"></u-icon>
+					</view>
+					<!-- <view class="about">联系电话：{{ shop.phone }}</view> -->
+					<view class="address">地址：{{ shop.fullAddress }}</view>
+				</view>
+			</view>
+			<view class="shop-banner" v-else>
+				<view class="shop-logo">
+					<u-avatar :src="shop.logoUrl" :size="120" mode="square" :show-level="true"></u-avatar>
+				</view>
+				<view class="shop-info">
+					<view class="title">{{shop.shopName}} 关注</view>
+					<!-- <view class="about">联系电话：{{ shop.phone }}</view> -->
+					<view class="address">地址：{{ shop.fullAddress }}</view>
+				</view>
+			</view>
+			<view class="diy-search">
+				<view class="inner">
+					<view class="search-input">
+						<text class="search-icon iconfont icon-search"></text>
+						<input v-model="searchValue" class="input" @confirm="onSearch" focus="true" placeholder="请输入关键词"
+							type="text"></input>
+					</view>
+				</view>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			tips: {
+				type: String,
+				default: '搜索商品'
+			},
+			shop: {
+				type: Object,
+				default: () => {}
+			}
+		},
+		data() {
+			return {
+				searchValue: ''
+			}
+		},
+
+		methods: {
+			onClick() {
+				this.$emit('event')
+			},
+			onFollow(shopId){
+				this.$emit('onFollow',shopId)
+			},
+			/**
+			 * 搜索提交
+			 */
+			onSearch() {
+				const {
+					searchValue
+				} = this
+				if (searchValue) {
+					this.$emit('event', searchValue)
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.shop-banner {
+		background-color: #2C71C7;
+		height: 200rpx;
+		position: fixed;
+		top: var(--window-top);
+		left: var(--window-left);
+		right: var(--window-right);
+		z-index: 9;
+		display: flex;
+		align-items: center;
+
+		.shop-logo {
+			height: 100%;
+			display: flex;
+			align-items: center;
+			padding-left: 24rpx;
+		}
+
+		.shop-logo image {
+			width: 140rpx;
+			height: 140rpx;
+			background-color: #FFFFFF;
+		}
+
+		.shop-info {
+			width: 100%;
+			margin-left: 20rpx;
+			height: 140rpx;
+			z-index: 10;
+			color: #FFFFFF;
+
+			.title {
+				font-size: 38rpx;
+				font-weight: bold;
+				padding-bottom: 10rpx;
+			}
+		}
+	}
+	.diy-search {
+		width: 750rpx;
+		background: #e2f2fb;
+		padding: 20rpx 40rpx;
+		font-size: 26rpx;
+		position: fixed;
+		z-index: 10;
+		top: 200rpx;
+		left: var(--window-left);
+		right: var(--window-right);
+		.inner {
+			width: 360rpx;
+			height: 60rpx;
+			background: #fff;
+			border-radius: 100rpx;
+			overflow: hidden;
+		
+			&.radius {
+				border-radius: 10rpx;
+			}
+		
+			&.round {
+				border-radius: 60rpx;
+			}
+		}
+		
+		.search-input {
+			height: 60rpx;
+			color: #999;
+			padding: 0 20rpx;
+			display: flex;
+			align-items: center;
+		
+			.search-icon {
+				margin-right: 8rpx;
+			}
+		}
+		
+		
+		.flow-delivery {
+			background-color: #2C71C7;
+			padding: 10rpx 26rpx;
+			color: #FFFFFF;
+			display: flex;
+			justify-content: space-between;
+		}
+		
+		.col-title {
+			color: #FFFFFF;
+		}
+		
+		.my-order {
+			border: 1px solid #fff;
+			border-radius: 20rpx;
+			padding: 0rpx 20rpx;
+		}
+	}
+</style>