Feat(搜索):增加删除历史搜索记录

pages/shop/GoodSearch/index.vue

@@ -15,7 +15,17 @@
       </view>
     </view>
     <view v-if="historyKey.length" class="page-content">
-      <view class="title">历史搜索</view>
+      <view
+        class="title"
+      >
+        历史搜索
+        <u-icon
+          name="trash-fill"
+          color="#aaa"
+          size="20"
+          @click="deleteHistoryHandle"
+        />
+      </view>
       <view class="list acea-row limit-box">
         <view
           v-for="item of historyKey"
@@ -59,10 +69,10 @@ export default {
     }
   },
   mounted: function () {
-    this.getData();
+    this.getData()
   },
   onShow() {
-    this.getHistory();
+    this.getHistory()
   },
   methods: {
     submit() {
@@ -92,9 +102,25 @@ export default {
       }
       this.historyKey.unshift({id: this.$global.generateMixed(10), word })
       uni.setStorageSync('historyKey', JSON.stringify(this.historyKey))
+    },
+    deleteHistoryHandle() {
+      const _this = this
+      uni.showModal({
+        title: '确认删除最近的搜索记录吗?',
+        content: '',
+        showCancel: true,
+        cancelText: '取消',
+        confirmText: '确认',
+        success: (result) => {
+          if (result.confirm) {
+            _this.historyKey = []
+            uni.setStorageSync('historyKey', JSON.stringify([]))
+          }
+        }
+      })
     }
   }
-};
+}
 </script>
 
 <style lang="less">
@@ -139,6 +165,8 @@ export default {
     padding: 0 32rpx;
 
     .title {
+      display: flex;
+      justify-content: space-between;
       margin: 22rpx 0 24rpx;
       color: #333;
       font-size: 28rpx;