Init project

2023-09-20 21:49:33 +08:00
parent 85a5989c96
commit c9ceac9f37
710 changed files with 125705 additions and 0 deletions
@@ -0,0 +1,131 @@
+<template>
+  <view class="good-search">
+    <view class="header">
+      <view class="search-box flex jc-between ai-center">
+        <input v-model="search" type="text" placeholder="搜索商品" placeholder-style="color:#999"/>
+        <view class="btn flex-0 flex jc-center ai-center" @click="submit">
+          <text class="iconfont icon-sousuo2"></text>
+          <text>搜索</text>
+        </view>
+      </view>
+    </view>
+
+    <view class="page-content" v-if="keywords.length">
+      <view class="title">热门搜索</view>
+      <view class="list acea-row">
+        <view
+            class="item"
+            v-for="keywordsKey of keywords"
+            :key="keywordsKey"
+            @click="toSearch(keywordsKey)"
+        >{{ keywordsKey }}
+        </view>
+      </view>
+    </view>
+    <view class="line"></view>
+  </view>
+</template>
+
+<script>
+import {getSearchKeyword} from "@/api/store";
+import {trim} from "@/utils";
+
+export default {
+  name: "GoodSearch",
+  props: {},
+  data: function () {
+    return {
+      webUrl: this.$VUE_APP_RESOURCES_URL,
+      keywords: [],
+      search: ""
+    };
+  },
+  mounted: function () {
+    this.getData();
+  },
+  methods: {
+    submit() {
+      const search = trim(this.search) || "";
+      if (!search) return;
+      this.toSearch(search);
+    },
+    toSearch(s) {
+      this.$yrouter.push({path: "/pages/shop/GoodsList/index", query: {s}});
+    },
+    getData() {
+      getSearchKeyword().then(res => {
+        this.keywords = res.data;
+      });
+    }
+  }
+};
+</script>
+
+<style lang="less">
+page {
+  min-height: 100vh;
+  background: #fff !important;
+}
+
+.good-search {
+
+  .header {
+    padding: 40rpx 32rpx 32rpx;
+    background: #F9F9F9;
+
+    .search-box {
+      width: 686rpx;
+      height: 72rpx;
+      box-sizing: border-box;
+      padding: 0 8rpx 0 32rpx;
+      border-radius: 36rpx;
+      background: #fff;
+      font-size: 24rpx;
+      input{
+        width: 100%;
+      }
+
+      .btn {
+        width: 128rpx;
+        height: 54rpx;
+        background: #FD574B;
+        border-radius: 28rpx;
+        color: #fff;
+        font-weight: bold;
+
+        .icon-sousuo2 {
+          margin-right: 4rpx;
+          font-size: 28rpx;
+        }
+      }
+    }
+  }
+
+  .page-content {
+    padding: 0 32rpx;
+
+    .title {
+      margin: 22rpx 0 24rpx;
+      color: #333;
+      font-size: 28rpx;
+      line-height: 40rpx;
+      font-weight: bold;
+      letter-spacing: 4px;
+    }
+
+    .list {
+      .item {
+        height: 48rpx;
+        box-sizing: border-box;
+        margin-right: 24rpx;
+        padding: 0 24rpx;
+        border-radius: 28rpx;
+        background: #F1F0EE;
+        color: #666;
+        font-size: 24rpx;
+        line-height: 48rpx;
+      }
+    }
+  }
+}
+</style>