调整ui

2025-12-25 08:26:09 +08:00
parent ab5c01bf5c
commit 964e4f9c33
72 changed files with 2474 additions and 1065 deletions
--- a/components/searchBar/SearchBar.vue
+++ b/components/searchBar/SearchBar.vue
@@ -0,0 +1,99 @@
+<template>
+  <view class="search-bar" :style="{ backgroundColor: backgroundColor,border:border}">
+    <view v-if="showChoseCity" class="location-chose" @click="$emit('chooseCity')" :style="{fontSize:fontSize,color:fontColor}">
+      {{ city || '选择' }}
+      <u-icon name="arrow-down-fill" class="choseIcon" size="15" :color="fontColor" :style="{marginLeft:'2rpx'}" />
+    </view>
+    <view class="search-input" @click="$emit('search')">
+	  <u-icon  v-if="searchIconShowLeft" name="search" size="40" :color="fontColor" class="search-icon-left" />
+      <text class="placeholder" :style="{fontSize:fontSize,color:fontColor}">{{ placeholder }}</text>
+      <u-icon v-if="!searchIconShowLeft" name="search" size="40" :color="fontColor" class="search-icon-right" />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'SearchBar',
+  props: {
+    city: {
+      type: String,
+      default: '宜昌市'
+    },
+	showChoseCity: {
+	  type: Boolean,
+	  default: false
+	},
+	fontSize: {
+	  type: String,
+	  default: '30rpx'
+	},
+	searchIconShowLeft: {
+	  type: Boolean,
+	  default: true
+	},
+	fontColor:{
+		type: String,
+		default: '#FFFFFF'
+	},
+	backgroundColor: { 
+		type: String, 
+		default: 'rgba(255,255,255,0.6)' ,
+		},
+		border: {
+			type: String, 
+			default: 'border: 1px solid #FFFFFF' ,
+			},
+    placeholder: {
+      type: String,
+      default: '搜索小区/城市/门店'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.choseIcon {
+	margin-left: 5rpx;
+}
+.search-bar {
+  margin-top: 10rpx;
+  display: flex;
+  align-items: center;
+  padding: 6rpx 16rpx;
+  border-radius: 10rpx;
+  width: 100%;
+  
+}
+
+.location-chose {
+	font-family: Noto Sans S Chinese;
+	font-weight: 400;
+  display: flex;
+  align-items: center;
+  width: 25%;
+}
+
+.search-input {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  position: relative;
+  height: 83.5rpx;
+  padding: 25rpx 30rpx;
+}
+
+.placeholder {
+  font-family: Noto Sans S Chinese;
+  font-weight: 400;
+  flex: 1;
+}
+
+.search-icon-right {
+  
+}
+
+.search-icon-left {
+  margin-right: 5%;
+}
+</style>