吃个甘蔗嚼一年 3 лет назад
Родитель
Сommit
29a9f0f43c

+ 37
- 0
src/components/SearchBar/index.jsx Просмотреть файл

@@ -0,0 +1,37 @@
1
+import Taro, { View } from "@tarojs/components"
2
+export default (props) => {
3
+
4
+  const { value, onChange } = props
5
+
6
+
7
+
8
+  const search = (e) => {
9
+    console.log(e);
10
+
11
+    return new Promise((resolve, reject) => {
12
+      console.log(resolve, reject);
13
+      resolve([{ text: '搜索结果', e: 1 }, { text: '搜索结果2', e: 2 }])
14
+
15
+    })
16
+  }
17
+  const handeInput = (e) => {
18
+    const val = e.detail.value
19
+    onChange(val)
20
+    console.log("🚀 ~ file: shopKeeper.jsx ~ line 57 ~ handeInput ~ value", val)
21
+
22
+
23
+  }
24
+
25
+
26
+  return (
27
+    <View className='search'>
28
+      <mp-searchbar
29
+        placeholder='搜索订单(输入客户手机号码)'
30
+        search={search}
31
+        onInput={(e) => handeInput(e)}
32
+        value={value}
33
+      >
34
+      </mp-searchbar>
35
+    </View>
36
+  )
37
+}

+ 41
- 0
src/components/SearchBar/style.less Просмотреть файл

@@ -0,0 +1,41 @@
1
+
2
+.search{
3
+  margin: 35px 0;
4
+  .weui-search-bar{
5
+    padding: 0px;
6
+    border-radius: 45px;
7
+    background: #F8F8F8;
8
+
9
+    .weui-search-bar__label{
10
+      background: #F8F8F8;
11
+    }
12
+    .weui-search-bar__form{
13
+      border-radius: 45px;
14
+      background: #F8F8F8;
15
+      
16
+
17
+    }
18
+
19
+    .weui-search-bar__label{
20
+      border-radius: 45px;
21
+      background: #F8F8F8;
22
+
23
+
24
+    }
25
+    .weui-search-bar__input{
26
+      text-align: center;
27
+      background: #F8F8F8;
28
+
29
+    }
30
+  
31
+    .weui-search-bar__cancel-btn{
32
+      position: relative;
33
+      left: -10px;
34
+      font-size: 31px;
35
+      padding-left: 5px;
36
+      background: #F8F8F8;
37
+
38
+
39
+    }
40
+  }
41
+}

+ 7
- 18
src/shop/components/ShopKeeper/shopKeeper.jsx Просмотреть файл

@@ -5,6 +5,7 @@ import Picker from '@/components/Picker'
5 5
 import Popup from '@/components/Popup'
6 6
 import ShopUsed from '@/components/ShopUsed' //已核销
7 7
 import ShopUnused from '@/components/ShopUnused' //未核销
8
+import SearchBar from '@/components/SearchBar'
8 9
 import eyes from '@/assets/icons/shopKeeper/小眼睛.png'
9 10
 import ceyes from '@/assets/icons/shopKeeper/小眼睛-闭上.png'
10 11
 import iconsearch from '@/assets/icons/housemantj/search.png'
@@ -42,23 +43,15 @@ export default (props) => {
42 43
   }
43 44
 
44 45
 
45
-  //搜索
46
-  const search = (value) => {
47
-    console.log(value);
48 46
 
49
-    return new Promise((resolve, reject) => {
50
-      console.log(resolve, reject);
51
-      resolve([{ text: '搜索结果', value: 1 }, { text: '搜索结果2', value: 2 }])
52 47
 
53
-    })
54
-  }
55
-  const handeInput = (e) => {
56
-    const value = e.detail.value
57
-    console.log("🚀 ~ file: shopKeeper.jsx ~ line 57 ~ handeInput ~ value", value)
58 48
 
59 49
 
60
-  }
50
+  const handleChange = (e) => {
51
+    console.log("🚀 ~ file: shopKeeper.jsx ~ line 67 ~ handleChange ~ e", e)
52
+
61 53
 
54
+  }
62 55
 
63 56
 
64 57
   useEffect(() => {
@@ -120,12 +113,8 @@ export default (props) => {
120 113
             </view>
121 114
           </view>
122 115
           <view className='search'>
123
-            <mp-searchbar
124
-              placeholder='搜索订单(输入客户手机号码)'
125
-              search={search}
126
-              onInput={(e) => handeInput(e)}
127
-            >
128
-            </mp-searchbar>
116
+
117
+            <SearchBar onChange={e => handleChange()} />
129 118
           </view>
130 119
           <view className='index-tabs'>
131 120
             <mp-tabs