fix: add mock data to tcb shop

miniprogram/tcb-shop/app.json

@@ -56,11 +56,11 @@
       }
     ]
   },
-  "requiredPrivateInfos": [
-    "chooseAddress"
-  ],
+  "requiredPrivateInfos": ["chooseAddress"],
   "lazyCodeLoading": "requiredComponents",
-  "usingComponents": {},
+  "usingComponents": {
+    "cloud-template-guide": "/components/cloud-template-guide/index"
+  },
   "window": {
     "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#fff",
@@ -73,4 +73,4 @@
       "desc": "你的位置信息将用于小程序位置接口的效果展示"
     }
   }
-}
+}

miniprogram/tcb-shop/components/cloud-template-guide/index.js

@@ -0,0 +1,41 @@
+import { cloudbaseTemplateConfig } from '../../config/index';
+
+Component({
+  properties: {
+    show: {
+      type: Boolean,
+      value: cloudbaseTemplateConfig.useMock,
+    },
+    title: {
+      type: String,
+      value: '替换为真实数据',
+    },
+    text: {
+      type: String,
+      value: '当前为体验数据，切换为真实数据请复制下方链接并在浏览器中打开，通过指引帮您快速替换',
+    },
+    url: {
+      type: String,
+      value:
+        'https://tcb.cloud.tencent.com/cloud-admin?_jump_source=wxide_tcb_shop#/cloud-template/detail?tplId=tpl-1sm7qkwQcbBUpZ&appName=electronic-business',
+    },
+  },
+
+  data: {
+    dialogShow: false,
+  },
+
+  methods: {
+    open() {
+      this.setData({ dialogShow: true });
+    },
+    close() {
+      this.setData({ dialogShow: false });
+    },
+    copy() {
+      wx.setClipboardData({
+        data: this.data.url,
+      });
+    },
+  },
+});

miniprogram/tcb-shop/components/cloud-template-checker/index.json → miniprogram/tcb-shop/components/cloud-template-guide/index.json

@@ -3,6 +3,7 @@
   "styleIsolation": "shared",
   "usingComponents": {
     "t-button": "tdesign-miniprogram/button/button",
-    "t-icon": "tdesign-miniprogram/icon/icon"
+    "t-icon": "tdesign-miniprogram/icon/icon",
+    "t-dialog": "tdesign-miniprogram/dialog/dialog"
   }
-}
+}

miniprogram/tcb-shop/components/cloud-template-guide/index.wxml

@@ -0,0 +1,18 @@
+<view wx:if="{{show}}" class="cloud-template-guide">
+  <view class="left">
+    <t-icon color="#0052D9" name="info-circle-filled" size="40rpx" />
+    当前为体验数据，可替换为真实数据
+  </view>
+  <view class="right" bind:tap="open">去替换＞</view>
+</view>
+<t-dialog visible="{{dialogShow}}">
+  <view slot="content" class="cloud-template-guide-dialog">
+    <view class="title">{{title}}</view>
+    <view class="text">{{text}}</view>
+    <view class="url">{{url}}</view>
+    <view class="btns">
+      <t-button class="copy" bind:tap="copy" theme="primary">复制地址</t-button>
+      <t-button class="close" bind:tap="close" theme="outline">暂不打开</t-button>
+    </view>
+  </view>
+</t-dialog>

miniprogram/tcb-shop/components/cloud-template-guide/index.wxss

@@ -0,0 +1,57 @@
+.cloud-template-guide {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background-color: #f2f3ff;
+  margin: 20rpx;
+  padding: 20rpx;
+  border-radius: 10rpx;
+  font-size: small;
+}
+
+.cloud-template-guide .left {
+  gap: 10rpx;
+  display: flex;
+  align-items: center;
+}
+
+.cloud-template-guide .right {
+  align-items: center;
+  color: #0052d9;
+}
+
+.cloud-template-guide-dialog {
+  display: flex;
+  flex-direction: column;
+  gap: 30rpx;
+}
+
+.cloud-template-guide-dialog .title {
+  font-size: large;
+  text-align: center;
+}
+
+.cloud-template-guide-dialog .btns {
+  display: flex;
+  justify-content: space-between;
+  gap: 30rpx;
+}
+
+.cloud-template-guide-dialog .close {
+  color: #0052d9;
+  border-color: #0052d9;
+  border: solid 1rpx #0052d9;
+}
+
+.cloud-template-guide-dialog .text {
+  color: rgba(0, 0, 0, 0.5);
+  font-size: small;
+}
+
+.cloud-template-guide-dialog .btns button {
+  flex: 1;
+}
+
+.cloud-template-guide-dialog .url {
+  word-break: break-all;
+}

miniprogram/tcb-shop/config/index.js

@@ -1,6 +1,12 @@
+/** TDesign 使用 */
 export const config = {
   /** 是否使用mock代替api返回 */
   useMock: true,
 };
 
+/** 云开发使用 */
+export const cloudbaseTemplateConfig = {
+  useMock: true,
+};
+
 export const cdnBase = 'https://we-retail-static-1300977798.cos.ap-guangzhou.myqcloud.com/retail-mp';

miniprogram/tcb-shop/pages/cart/index.wxml

@@ -1,3 +1,4 @@
+<cloud-template-guide />
 <!-- 分层购物车 -->
 <block wx:if="{{cartItems.length !== 0}}">
   <cart-group cartItems="{{cartItems}}" bindselectgoods="onGoodsSelect" bindselectstore="onStoreSelect" bindchangequantity="onQuantityChange" bindgocollect="goCollect" bindgoodsclick="goGoodsDetail" bindclearinvalidgoods="clearInvalidGoods" binddelete="onGoodsDelete" />

miniprogram/tcb-shop/pages/goods/category/index.wxml

@@ -1,3 +1,4 @@
+<cloud-template-guide />
 <view class="wrap">
   <goods-category level="{{2}}" custom-class="goods-category-class" category="{{cates}}" bind:changeCategory="onChange" />
   <t-toast id="t-toast" />

miniprogram/tcb-shop/pages/home/home.js

@@ -16,18 +16,7 @@ Page({
     duration: '500',
     interval: 5000,
     navigation: { type: 'dots' },
-    swiperImageProps: { mode: 'scaleToFill' },
-    cloudCheckerShow: false
-  },
-
-  async onCloudCheck() {
-    try {
-      await getHomeSwiper();
-      this.setData({ cloudCheckerShow: false })
-    } catch (e) {
-      console.log(e);
-      this.setData({ cloudCheckerShow: true })
-    }
+    swiperImageProps: { mode: 'scaleToFill' }
   },
 
   goodListPagination: {

miniprogram/tcb-shop/pages/home/home.json

@@ -14,7 +14,6 @@
     "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",
-    "cloud-template-checker": "/components/cloud-template-checker/index"
+    "load-more": "/components/load-more/index"
   }
 }

miniprogram/tcb-shop/pages/home/home.wxml

@@ -1,20 +1,19 @@
-<cloud-template-checker bindcheck="onCloudCheck" show="{{cloudCheckerShow}}" text="原因可能是模板未完成初始化，请参考 README.md 或打开下方使用文档。" url="https://tcb.cloud.tencent.com/cloud-admin?_jump_source=wxide_tcb_shop#/cloud-template/detail?tplId=tpl-1sm7qkwQcbBUpZ&appName=electronic-business">
-  <view style="text-align: center; color: #b9b9b9" wx:if="{{pageLoading}}">
-    <t-loading theme="circular" size="40rpx" text="加载中..." inherit-color />
+<cloud-template-guide />
+<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">
+  <view class="search" bind:tap="navToSearchPage">
+    <t-search t-class-input="t-search__input" t-class-input-container="t-search__input-container" leftIcon="" disabled>
+      <t-icon slot="left-icon" prefix="wr" name="search" size="40rpx" color="#bbb" />
+    </t-search>
   </view>
-  <view class="home-page-header">
-    <view class="search" bind:tap="navToSearchPage">
-      <t-search t-class-input="t-search__input" t-class-input-container="t-search__input-container" 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}}" />
-    </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}}" />
   </view>
-  <view class="home-page-container">
-    <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>
-</cloud-template-checker>
+</view>
+<view class="home-page-container">
+  <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>

miniprogram/tcb-shop/pages/usercenter/index.wxml

@@ -1,6 +1,7 @@
 <t-user-center-card userInfo="{{userInfo}}" isPhoneHide="{{true}}" name-class="custom-name-class" phone-class="custom-phone-class" avatar-class="customer-avatar-class" currAuthStep="{{currAuthStep}}" bind:gotoUserEditPage="gotoUserEditPage" />
 <view class="content-wrapper">
   <view class="order-group-wrapper">
+    <cloud-template-guide />
     <t-order-group orderTagInfos="{{orderTagInfos}}" bind:onClickTop="jumpAllOrder" bind:onClickItem="jumpNav" />
   </view>
   <view wx:for="{{menuData}}" wx:key="item" class="cell-box">

miniprogram/tcb-shop/services/cart/cart.js

@@ -1,6 +1,7 @@
 import { model, getAll } from '../../services/_utils/model';
 import { config } from '../../config/index';
 import { DATA_MODEL_KEY } from '../../config/model';
+import { cloudbaseTemplateConfig } from '../../config/index';
 
 const CATE_ITEM_MODEL_KEY = DATA_MODEL_KEY.CART_ITEM;
 
@@ -39,6 +40,10 @@ export async function getCartItem({ id }) {
 }
 
 export async function fetchCartItems() {
+  if (cloudbaseTemplateConfig.useMock) {
+    return [];
+  }
+
   return getAll({
     name: CATE_ITEM_MODEL_KEY,
     select: {

miniprogram/tcb-shop/services/cate/cate.js

@@ -3,6 +3,8 @@ import { model, getAll } from '../_utils/model';
 import { getCloudImageTempUrl } from '../../utils/cloudImageHandler';
 import { SPU_SELLING_STATUS } from '../../utils/spuStatus';
 import { DATA_MODEL_KEY } from '../../config/model';
+import { cloudbaseTemplateConfig } from '../../config/index';
+import { CATEGORY } from '../cloudbaseMock/index';
 
 const CATE_MODEL_KEY = DATA_MODEL_KEY.CATE;
 
@@ -36,6 +38,9 @@ export async function getAllSpuOfCate(cateId) {
 }
 
 export async function getCates() {
+  if (cloudbaseTemplateConfig.useMock) {
+    return CATEGORY;
+  }
   const cateSelect = {
     _id: true,
     name: true,
@@ -55,6 +60,5 @@ export async function getCates() {
   const childCates = allCates.flatMap((c) => c.child_cate);
   const res = await getCloudImageTempUrl(childCates.map((x) => x.image));
   res.forEach((image, index) => (childCates[index].image = image));
-
   return allCates;
 }