create-weapp-vite 2.0.30 → 2.0.32

package/templates/wevu-retail/src/pages/goods/search/index.vue

@@ -0,0 +1,196 @@
+<script lang="ts">
+import {
+  getSearchHistory,
+  getSearchPopular,
+} from '../../../services/good/fetchSearchHistory';
+
+Page({
+  data: {
+    historyWords: [],
+    popularWords: [],
+    searchValue: '',
+    dialog: {
+      title: '确认删除当前历史记录',
+      showCancelButton: true,
+      message: '',
+    },
+    dialogShow: false,
+  },
+
+  deleteType: 0,
+  deleteIndex: '',
+
+  onShow() {
+    this.queryHistory();
+    this.queryPopular();
+  },
+
+  async queryHistory() {
+    try {
+      const data = await getSearchHistory();
+      const code = 'Success';
+      if (String(code).toUpperCase() === 'SUCCESS') {
+        const { historyWords = [] } = data;
+        this.setData({
+          historyWords,
+        });
+      }
+    } catch (error) {
+      console.error(error);
+    }
+  },
+
+  async queryPopular() {
+    try {
+      const data = await getSearchPopular();
+      const code = 'Success';
+      if (String(code).toUpperCase() === 'SUCCESS') {
+        const { popularWords = [] } = data;
+        this.setData({
+          popularWords,
+        });
+      }
+    } catch (error) {
+      console.error(error);
+    }
+  },
+
+  confirm() {
+    const { historyWords } = this.data;
+    const { deleteType, deleteIndex } = this;
+    historyWords.splice(deleteIndex, 1);
+    if (deleteType === 0) {
+      this.setData({
+        historyWords,
+        dialogShow: false,
+      });
+    } else {
+      this.setData({ historyWords: [], dialogShow: false });
+    }
+  },
+
+  close() {
+    this.setData({ dialogShow: false });
+  },
+
+  handleClearHistory() {
+    const { dialog } = this.data;
+    this.deleteType = 1;
+    this.setData({
+      dialog: {
+        ...dialog,
+        message: '确认删除所有历史记录',
+      },
+      dialogShow: true,
+    });
+  },
+
+  deleteCurr(e) {
+    const { index } = e.currentTarget.dataset;
+    const { dialog } = this.data;
+    this.deleteIndex = index;
+    this.setData({
+      dialog: {
+        ...dialog,
+        message: '确认删除当前历史记录',
+        deleteType: 0,
+      },
+      dialogShow: true,
+    });
+  },
+
+  handleHistoryTap(e) {
+    const { historyWords } = this.data;
+    const { dataset } = e.currentTarget;
+    const _searchValue = historyWords[dataset.index || 0] || '';
+    if (_searchValue) {
+      wx.navigateTo({
+        url: `/pages/goods/result/index?searchValue=${_searchValue}`,
+      });
+    }
+  },
+
+  handleSubmit(e) {
+    const { value } = e.detail.value;
+    if (value.length === 0) return;
+    wx.navigateTo({
+      url: `/pages/goods/result/index?searchValue=${value}`,
+    });
+  },
+});
+</script>
+
+<template>
+<view class="search-page [box-sizing:border-box] [width:100vw] [height:100vh] [padding:0_30rpx] [&_.t-class__input-container]:[height:64rpx] [&_.t-class__input-container]:[border-radius:32rpx] [&_.t-search__input]:[font-size:28rpx] [&_.t-search__input]:[color:#333] [&_.search-wrap]:[margin-top:44rpx] [&_.history-wrap]:[margin-bottom:20px] [&_.search-header]:[display:flex] [&_.search-header]:[flex-flow:row_nowrap] [&_.search-header]:[justify-content:space-between] [&_.search-header]:[align-items:center] [&_.search-title]:[font-size:30rpx] [&_.search-title]:[font-family:PingFangSC-Semibold,_PingFang_SC] [&_.search-title]:[font-weight:600] [&_.search-title]:[color:rgba(51,_51,_51,_1)] [&_.search-title]:[line-height:42rpx] [&_.search-clear]:[font-size:24rpx] [&_.search-clear]:[font-family:PingFang_SC] [&_.search-clear]:[line-height:32rpx] [&_.search-clear]:[color:#999999] [&_.search-clear]:[font-weight:normal] [&_.search-content]:[overflow:hidden] [&_.search-content]:[display:flex] [&_.search-content]:[flex-flow:row_wrap] [&_.search-content]:[justify-content:flex-start] [&_.search-content]:[align-items:flex-start] [&_.search-content]:[margin-top:24rpx] [&_.search-item]:[color:#333333] [&_.search-item]:[font-size:24rpx] [&_.search-item]:[line-height:32rpx] [&_.search-item]:[font-weight:normal] [&_.search-item]:[margin-right:24rpx] [&_.search-item]:[margin-bottom:24rpx] [&_.search-item]:[background:#f5f5f5] [&_.search-item]:[border-radius:38rpx] [&_.search-item]:[padding:12rpx_24rpx] [&_.hover-history-item]:[position:relative] [&_.hover-history-item]:[top:3rpx] [&_.hover-history-item]:[left:3rpx] [&_.hover-history-item]:[box-shadow:0px_0px_8px_rgba(0,_0,_0,_0.1)_inset]">
+  <t-search
+    t-class-input-container="t-class__input-container"
+    t-class-input="t-search__input"
+    value="{{searchValue}}"
+    leftIcon=""
+    placeholder="iPhone12pro"
+    bind:submit="handleSubmit"
+    focus
+  >
+    <t-icon slot="left-icon" prefix="wr" name="search" size="40rpx" color="#bbb" />
+  </t-search>
+  <view class="search-wrap">
+    <view class="history-wrap">
+      <view class="search-header">
+        <text class="search-title">历史搜索</text>
+        <text class="search-clear" bind:tap="handleClearHistory">清除</text>
+      </view>
+      <view class="search-content">
+        <view
+          class="search-item"
+          hover-class="hover-history-item"
+          wx:for="{{historyWords}}"
+          bind:tap="handleHistoryTap"
+          bindlongpress="deleteCurr"
+          data-index="{{index}}"
+          wx:key="*this"
+        >
+          {{item}}
+        </view>
+      </view>
+    </view>
+    <view class="popular-wrap">
+      <view class="search-header">
+        <text class="search-title">热门搜索</text>
+      </view>
+      <view class="search-content">
+        <view
+          class="search-item"
+          hover-class="hover-history-item"
+          wx:for="{{popularWords}}"
+          bind:tap="handleHistoryTap"
+          data-index="{{index}}"
+          wx:key="*this"
+        >
+          {{item}}
+        </view>
+      </view>
+    </view>
+  </view>
+  <t-dialog
+    visible="{{dialogShow}}"
+    content="{{dialog.message}}"
+    bindconfirm="confirm"
+    bind:close="close"
+    confirm-btn="确定"
+    cancel-btn="{{dialog.showCancelButton ? '取消' : null}}"
+    t-class-confirm="dialog__button-confirm"
+    t-class-cancel="dialog__button-cancel"
+  />
+</view>
+</template>
+
+<json>
+{
+  "navigationBarTitleText": "搜索",
+  "usingComponents": {
+    "t-search": "tdesign-miniprogram/search/search",
+    "t-icon": "tdesign-miniprogram/icon/icon",
+    "t-dialog": "tdesign-miniprogram/dialog/dialog"
+  }
+}
+</json>

package/templates/wevu-retail/src/pages/home/home.vue

@@ -0,0 +1,215 @@
+<script lang="ts">
+import { fetchHome } from '../../services/home/home';
+import { fetchGoodsList } from '../../services/good/fetchGoods';
+import Toast from 'tdesign-miniprogram/toast/index';
+
+Page({
+  data: {
+    imgSrcs: [],
+    tabList: [],
+    goodsList: [],
+    goodsListLoadStatus: 0,
+    pageLoading: false,
+    current: 1,
+    autoplay: true,
+    duration: '500',
+    interval: 5000,
+    navigation: { type: 'dots' },
+    swiperImageProps: { mode: 'scaleToFill' },
+  },
+
+  goodListPagination: {
+    index: 0,
+    num: 20,
+  },
+
+  privateData: {
+    tabIndex: 0,
+  },
+
+  onShow() {
+    this.getTabBar().init();
+  },
+
+  onLoad() {
+    this.init();
+  },
+
+  onReachBottom() {
+    if (this.data.goodsListLoadStatus === 0) {
+      this.loadGoodsList();
+    }
+  },
+
+  onPullDownRefresh() {
+    this.init();
+  },
+
+  init() {
+    this.loadHomePage();
+  },
+
+  loadHomePage() {
+    wx.stopPullDownRefresh();
+
+    this.setData({
+      pageLoading: true,
+    });
+    fetchHome().then(({ swiper, tabList }) => {
+      this.setData({
+        tabList,
+        imgSrcs: swiper,
+        pageLoading: false,
+      });
+      this.loadGoodsList(true);
+    });
+  },
+
+  tabChangeHandle(e) {
+    this.privateData.tabIndex = e.detail;
+    this.loadGoodsList(true);
+  },
+
+  onReTry() {
+    this.loadGoodsList();
+  },
+
+  async loadGoodsList(fresh = false) {
+    if (fresh) {
+      wx.pageScrollTo({
+        scrollTop: 0,
+      });
+    }
+
+    this.setData({ goodsListLoadStatus: 1 });
+
+    const pageSize = this.goodListPagination.num;
+    let pageIndex = this.privateData.tabIndex * pageSize + this.goodListPagination.index + 1;
+    if (fresh) {
+      pageIndex = 0;
+    }
+
+    try {
+      const nextList = await fetchGoodsList(pageIndex, pageSize);
+      this.setData({
+        goodsList: fresh ? nextList : this.data.goodsList.concat(nextList),
+        goodsListLoadStatus: 0,
+      });
+
+      this.goodListPagination.index = pageIndex;
+      this.goodListPagination.num = pageSize;
+    } catch (err) {
+      this.setData({ goodsListLoadStatus: 3 });
+    }
+  },
+
+  goodListClickHandle(e) {
+    const { index } = e.detail;
+    const { spuId } = this.data.goodsList[index];
+    wx.navigateTo({
+      url: `/pages/goods/details/index?spuId=${spuId}`,
+    });
+  },
+
+  goodListAddCartHandle() {
+    Toast({
+      context: this,
+      selector: '#t-toast',
+      message: '点击加入购物车',
+    });
+  },
+
+  navToSearchPage() {
+    wx.navigateTo({ url: '/pages/goods/search/index' });
+  },
+
+  navToActivityDetail({ detail }) {
+    const { index: promotionID = 0 } = detail || {};
+    wx.navigateTo({
+      url: `/pages/promotion/promotion-detail/index?promotion_id=${promotionID}`,
+    });
+  },
+});
+</script>
+
+<template>
+<view style="text-align: center; color: #b9b9b9" wx:if="{{pageLoading}}">
+  <t-loading theme="circular" size="40rpx" text="加载中..." inherit-color />
+</view>
+<view class="home-page-header [background:linear-gradient(#fff,_#f5f5f5)] [display:block] [padding:0_24rpx] [&_.t-search__input-container]:[border-radius:32rpx] [&_.t-search__input-container]:[height:64rpx] [&_.t-search__input]:[font-size:28rpx] [&_.t-search__input]:[color:rgb(116,_116,_116)] [&_.swiper-wrap]:[margin-top:20rpx] [&_.t-image__swiper]:[width:100%] [&_.t-image__swiper]:[height:300rpx] [&_.t-image__swiper]:[border-radius:10rpx]">
+  <view class="search" bind:tap="navToSearchPage">
+    <t-search
+      t-class-input="t-search__input"
+      t-class-input-container="t-search__input-container"
+      placeholder="iphone 13 火热发售中"
+      leftIcon=""
+      disabled
+    >
+      <t-icon slot="left-icon" prefix="wr" name="search" size="40rpx" color="#bbb" />
+    </t-search>
+  </view>
+  <view class="swiper-wrap">
+    <t-swiper
+      wx:if="{{imgSrcs.length > 0}}"
+      current="{{current}}"
+      autoplay="{{autoplay}}"
+      duration="{{duration}}"
+      interval="{{interval}}"
+      navigation="{{navigation}}"
+      imageProps="{{swiperImageProps}}"
+      list="{{imgSrcs}}"
+      bind:click="navToActivityDetail"
+    />
+  </view>
+</view>
+<view class="home-page-container [background:#f5f5f5] [display:block] [padding:0_24rpx] [&_.t-tabs]:[background:#f5f5f5] [&_.t-tabs_.t-tabs-nav]:[background-color:transparent] [&_.t-tabs_.t-tabs-nav]:[line-height:80rpx] [&_.t-tabs_.t-tabs-nav]:[font-size:28rpx] [&_.t-tabs_.t-tabs-nav]:[color:#333] [&_.t-tabs_.t-tabs-scroll]:[border:none] [&_.tab_.order-nav_.order-nav-item_.scroll-width]:[min-width:165rpx] [&_.tab_.order-nav-item_.active]:[color:#fa550f] [&_.tab_.bottom-line]:[border-radius:4rpx] [&_.tab_.order-nav-item_.active_.bottom-line]:[background-color:#fa550f] [&_.tabs-external__item]:[font-size:28rpx] [&_.tabs-external__active]:[color:#333333] [&_.tabs-external__active]:[font-size:32rpx] [&_.tabs-external__track]:[height:6rpx] [&_.tabs-external__track]:[border-radius:4rpx] [&_.tabs-external__track]:[width:48rpx] [&_.goods-list-container]:[background:#f5f5f5] [&_.goods-list-container]:[margin-top:16rpx]">
+  <view class="home-page-tabs [--td-tab-nav-bg-color:transparent] [--td-tab-border-color:transparent] [--td-tab-item-color:#666] [--td-tab-track-color:red]">
+    <t-tabs
+      t-class="t-tabs [&_.t-tabs--top_.t-tabs__scroll]:[border-bottom:none] [&_.t-tabs--top_.t-tabs__item]:[height:86rpx] [&_.t-tabs--bottom_.t-tabs__item]:[height:86rpx]"
+      t-class-active="tabs-external__active"
+      t-class-item="tabs-external__item"
+      defaultValue="{{0}}"
+      space-evenly="{{false}}"
+      bind:change="tabChangeHandle"
+    >
+      <t-tab-panel
+        wx:for="{{tabList}}"
+        wx:for-index="index"
+        wx:key="index"
+        label="{{item.text}}"
+        value="{{item.key}}"
+      />
+    </t-tabs>
+  </view>
+
+  <goods-list
+    wr-class="goods-list-container"
+    goodsList="{{goodsList}}"
+    bind:click="goodListClickHandle"
+    bind:addcart="goodListAddCartHandle"
+  />
+  <load-more list-is-empty="{{!goodsList.length}}" status="{{goodsListLoadStatus}}" bind:retry="onReTry" />
+  <t-toast id="t-toast" />
+</view>
+</template>
+
+<json>
+{
+  "navigationBarTitleText": "首页",
+  "onReachBottomDistance": 10,
+  "backgroundTextStyle": "light",
+  "enablePullDownRefresh": true,
+  "usingComponents": {
+    "t-search": "tdesign-miniprogram/search/search",
+    "t-loading": "tdesign-miniprogram/loading/loading",
+    "t-swiper": "tdesign-miniprogram/swiper/swiper",
+    "t-swiper-nav": "tdesign-miniprogram/swiper-nav/swiper-nav",
+    "t-image": "/components/webp-image/index",
+    "t-icon": "tdesign-miniprogram/icon/icon",
+    "t-toast": "tdesign-miniprogram/toast/toast",
+    "t-tabs": "tdesign-miniprogram/tabs/tabs",
+    "t-tab-panel": "tdesign-miniprogram/tab-panel/tab-panel",
+    "goods-list": "/components/goods-list/index",
+    "load-more": "/components/load-more/index"
+  }
+}</json>

package/templates/wevu-retail/src/pages/home/readme

@@ -0,0 +1,8 @@
+首页功能设定
+1. loading入场
+2. 下拉刷新
+3. 搜索栏
+4. 分类切换
+5. 商品列表
+6. 规格弹层
+7. 加载更多

package/templates/wevu-retail/src/pages/order/after-service-detail/api.ts

@@ -0,0 +1,34 @@
+import { resp } from '../after-service-list/api';
+import dayjs from 'dayjs';
+import { mockIp, mockReqId } from '../../../utils/mock';
+
+export const formatTime = (date, template) => dayjs(date).format(template);
+
+export function getRightsDetail({ rightsNo }) {
+  const _resq = {
+    data: {},
+    code: 'Success',
+    msg: null,
+    requestId: mockReqId(),
+    clientIp: mockIp(),
+    rt: 79,
+    success: true,
+  };
+  _resq.data =
+    resp.data.dataList.filter((item) => item.rights.rightsNo === rightsNo) ||
+    {};
+  return Promise.resolve(_resq);
+}
+
+export function cancelRights() {
+  const _resq = {
+    data: {},
+    code: 'Success',
+    msg: null,
+    requestId: mockReqId(),
+    clientIp: mockIp(),
+    rt: 79,
+    success: true,
+  };
+  return Promise.resolve(_resq);
+}