From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目

---
 src/components/DiyEditor/components/mobile/SearchBar/index.vue |   75 +++++++++++++++++++++++++++++++++++++
 1 files changed, 75 insertions(+), 0 deletions(-)

diff --git a/src/components/DiyEditor/components/mobile/SearchBar/index.vue b/src/components/DiyEditor/components/mobile/SearchBar/index.vue
new file mode 100644
index 0000000..9de261a
--- /dev/null
+++ b/src/components/DiyEditor/components/mobile/SearchBar/index.vue
@@ -0,0 +1,75 @@
+<template>
+  <div
+    class="search-bar"
+    :style="{
+      color: property.textColor
+    }"
+  >
+    <!-- 鎼滅储妗� -->
+    <div
+      class="inner"
+      :style="{
+        height: `${property.height}px`,
+        background: property.backgroundColor,
+        borderRadius: `${property.borderRadius}px`
+      }"
+    >
+      <div
+        class="placeholder"
+        :style="{
+          justifyContent: property.placeholderPosition
+        }"
+      >
+        <Icon icon="ep:search" />
+        <span>{{ property.placeholder || '鎼滅储鍟嗗搧' }}</span>
+      </div>
+      <div class="right">
+        <!-- 鎼滅储鐑瘝 -->
+        <span v-for="(keyword, index) in property.hotKeywords" :key="index">{{ keyword }}</span>
+        <!-- 鎵竴鎵� -->
+        <Icon icon="ant-design:scan-outlined" v-show="property.showScan" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { SearchProperty } from './config'
+/** 鎼滅储妗� */
+defineOptions({ name: 'SearchBar' })
+defineProps<{ property: SearchProperty }>()
+</script>
+
+<style scoped lang="scss">
+.search-bar {
+  /* 鎼滅储妗� */
+  .inner {
+    position: relative;
+    display: flex;
+    min-height: 28px;
+    font-size: 14px;
+    align-items: center;
+
+    .placeholder {
+      display: flex;
+      width: 100%;
+      padding: 0 8px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      word-break: break-all;
+      white-space: nowrap;
+      align-items: center;
+      gap: 2px;
+    }
+
+    .right {
+      position: absolute;
+      right: 8px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+    }
+  }
+}
+</style>

--
Gitblit v1.8.0