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,152 @@
+<template>
+  <view class="pkg-product-list">
+    <view class="top-box">
+      <view class="search-box flex jc-between ai-center">
+        <input type="text" v-model="keyword" placeholder="搜索商品" placeholder-style="color:#949494" @confirm="search">
+        <image class="icon" :src="webUrl+'/20220903142935869059.png'" mode="scaleToFill" @click="fetchList"></image>
+      </view>
+    </view>
+
+    <view class="list" v-if="sharpList.length">
+      <custom-waterfalls-flow :value="sharpList" imageKey="image" @imageClick="imageClick">
+        <view class="item" v-for="(item,index) in sharpList" :key="index" slot="slot{{index}}"
+              @click="goGoods(item.id)">
+          <template v-if="item.storeName">
+            <view class="info">
+              <view class="more-t">{{ item.storeName }}</view>
+              <text class="one-t">￥{{ item.price }}</text>
+            </view>
+          </template>
+          <template v-else>
+            <swiper autoplay circular>
+              <swiper-item v-for="swipe in item.imgs" :key="swipe">
+                <image class="swiper-img" :src="swipe.pic" mode="scaleToFill" @click="goGoods(swipe.productId)"/>
+              </swiper-item>
+            </swiper>
+          </template>
+        </view>
+      </custom-waterfalls-flow>
+    </view>
+
+    <view class="v4-nodata" v-else>
+      <image src="@/static/images/img_nodata.png" mode="scaleToFill"/>
+      <view class="text">暂无数据</view>
+    </view>
+  </view>
+</template>
+
+<script>
+import {getSharpList, sharpBannar} from "@/api/goods";
+
+export default {
+  name: "sharpList",
+  data() {
+    return {
+      webUrl: this.$VUE_APP_RESOURCES_URL,
+      keyword: "",
+      bannarList: [],
+      sharpList: []
+    }
+  },
+  onLoad() {
+    this.fetchList();
+  },
+  methods: {
+    goGoods(id) {
+      uni.navigateTo({
+        url: "/pages/shop/GoodsCon/index?id=" + id
+      })
+    },
+
+    imageClick(item) {
+      this.goGoods(item.id);
+    },
+
+    fetchList() {
+      let that = this;
+      let temp = [];
+      sharpBannar().then(({data}) => {
+        temp.push({
+          hide: true,
+          image: data.banner[0].pic,
+          imgs: data.banner,
+          listStyle: {
+            'width': 330 + "rpx",
+            'height': 440 + "rpx"
+          }
+        })
+
+        getSharpList(that.keyword).then(({data}) => {
+          data.map(item => {
+            temp.push(item)
+          })
+          that.$nextTick(() => {
+            that.sharpList = temp;
+          })
+        });
+      });
+
+    },
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import "@/assets/css/product.less";
+
+.top-box {
+  padding: 16rpx 32rpx;
+  background: #fff;
+}
+
+.list {
+  box-sizing: border-box;
+  padding: 25rpx 32rpx;
+
+  swiper {
+    height: 440rpx !important;
+  }
+
+  .swiper-img {
+    width: 332rpx;
+    height: 440rpx;
+  }
+
+  .item {
+    width: 332rpx;
+    box-sizing: border-box;
+    margin: 0 22rpx 25rpx 0;
+    border-radius: 12rpx;
+    background: #fff;
+    overflow: hidden;
+
+    .cover {
+      width: 332rpx;
+      height: 332rpx;
+    }
+
+    .info {
+      box-sizing: border-box;
+      padding: 8rpx 10rpx 0;
+
+      .more-t {
+        color: #333;
+        line-height: 40rpx;
+        font-size: 28rpx;
+        font-weight: bold;
+      }
+
+      .one-t {
+        margin-top: 4rpx;
+        color: #DA0000;
+        line-height: 36rpx;
+        font-size: 32rpx;
+      }
+    }
+  }
+
+  .item:nth-child(2n) {
+    margin-right: 0;
+  }
+}
+</style>