@atomicservice/ascf-base 1.0.15 → 1.0.17

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/component/c_takeaway_vtab.css

@@ -0,0 +1,199 @@
+.bottom-action {
+  padding: 0 33px 0 33px;
+  justify-content: space-between;
+  position: fixed;
+  bottom: 100px;
+  width: 100%;
+  background-color: #ffffff;
+}
+
+.bottom-action text {
+  font-size: 31.3px;
+}
+
+.pay {
+  width: 267px;
+  height: 100px;
+  font-size: 31.3px;
+  color: #ffffff;
+  background-color: #fe9f05;
+  text-align: center;
+}
+
+.home-container {
+  flex-direction: column;
+}
+
+.home-top {
+  height: 850px;
+  flex-direction: column;
+}
+
+.banner {
+  height: 480rpx;
+  width: 100%;
+  margin: 16rpx 0;
+}
+
+.banner-swipe {
+  width: 100%;
+  height: 100%;
+  indicator-selected-color: rgba(255, 255, 255, 1);
+  indicator-color: rgba(255, 255, 255, 0.5);
+  indicator-size: 12.5px;
+}
+
+.banner-image {
+  width: 718rpx;
+  border-radius: 17px;
+  margin: 0 16rpx;
+}
+
+.verticaltab-content {
+  display: flex;
+  width: 172rpx;
+  height: 100%;
+  flex-direction: column;
+  background-color: #f2f2f2;
+  align-items: center;
+}
+
+.vtab-right {
+  height: 100%;
+  padding-left: 10rpx;
+}
+
+.verticaltab-wrap {
+  display: flex;
+}
+
+.verticaltab-box {
+  height: 95rpx;
+  width: 172rpx;
+  text-align: center;
+  display: flex;
+  align-items: center;
+}
+
+.choose-background-color {
+  background-color: #ffffff;
+}
+
+.verticaltab-text {
+  color: #1a1a1a;
+  flex: 1;
+  font-size: 28rpx;
+  text-align: center;
+}
+
+.seperate {
+  background-color: #ffffff;
+  height: 1px;
+}
+
+.choose-color {
+  color: #38d260;
+}
+
+.fruit-list {
+  width: 578px;
+}
+
+.page-content {
+  align-items: center;
+  height: 169rpx;
+  width: 578rpx;
+  border-bottom-width: 1px;
+  border-color: #f2f2f2;
+  margin-bottom: 33rpx;
+  display: flex;
+}
+
+.img-action {
+  width: 15rpx;
+  height: 32rpx;
+  resize-mode: contain;
+}
+
+.img-product {
+  width: 134rpx;
+  height: 134rpx;
+  border-radius: 8.3rpx;
+  margin: 0rpx 12rpx 0rpx 12rpx;
+}
+
+.goods-name {
+  font-size: 32rpx;
+  color: #1a1a1a;
+  display: block;
+}
+
+.goods-weight {
+  color: #1a1a1a;
+  opacity: 0.3;
+  font-size: 22rpx;
+  margin-top: 8rpx;
+}
+
+.bottom {
+  display: flex;
+  width: 378rpx;
+  align-items: center;
+  margin-top: 19rpx;
+  margin-right: 33rpx;
+  justify-content: space-between;
+}
+
+.count-number {
+  display: flex;
+}
+
+.goods-discount {
+  color: #ff742e;
+  font-size: 31.3rpx;
+  margin-right: 16rpx;
+}
+
+.goods-origin {
+  color: #1a1a1a;
+  opacity: 0.3;
+  font-size: 20.8rpx;
+  text-decoration: line-through;
+  margin-top: 5rpx;
+}
+
+.edit {
+  line-height: 50rpx;
+  text-align: center;
+  width: 48rpx;
+  height: 50rpx;
+}
+
+.edit-num {
+  text-align: center;
+  border-top-color: #979797;
+  border-top-width: 1px;
+  border-bottom-color: #979797;
+  border-bottom-width: 1px;
+}
+
+.good-number {
+  font-size: 22rpx;
+  color: #1a1a1a;
+}
+
+.minus {
+  border-top-left-radius: 6rpx;
+  border-bottom-left-radius: 6rpx;
+  border: 1px solid #979797;
+}
+
+.add {
+  border-top-right-radius: 5.9rpx;
+  border-bottom-right-radius: 5.9rpx;
+  border: 1px solid #979797;
+}
+
+.goods-wrap{
+  padding-left: 10rpx;
+}

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/component/c_takeaway_vtab.hxml

@@ -0,0 +1,45 @@
+<view class="home-container">
+  <view class="banner">
+    <swiper autoplay="true" class="banner-swipe">
+      <swiper-item has:for="{{list}}" has:key="item">
+        <image class="banner-image" src="{{item.uri}}" bind:tap="goodsDetail"></image>
+      </swiper-item>
+    </swiper>
+  </view>
+  <view class="verticaltab-wrap">
+    <view class="verticaltab-content">
+      <view has:for="{{vtablist}}" has:key="item" class="verticaltab-box {{item.select?'choose-background-color':''}}">
+        <text bind:tap="jumpTo" data-item="{{item}}"
+          class="verticaltab-text {{item.select?'choose-color':''}}">{{item.title}}</text>
+      </view>
+    </view>
+    <view class="vtab-right" key="{{keyvalue}}">
+      <view has:for="{{goods}}" has:key="item">
+        <view class="page-content">
+          <image class="img-product" src="{{item.goods_pic}}" bind:tap="goodsDetail" data-index="{{index}}"></image>
+          <view style="flex-direction: column" class="goods-wrap">
+            <text class="goods-name" bind:tap="goodsDetail" data-index="{{index}}">{{item.goods_name}}</text>
+            <text class="goods-weight" bind:tap="goodsDetail" data-index="{{index}}">{{item.goods_numbers}}</text>
+            <view class="bottom">
+              <view class="goods-price" bind:tap="goodsDetail" data-index="{{index}}">
+                <text class="goods-discount">¥{{item.goods_discount}}</text>
+                <text class="goods-origin">¥{{item.goods_price}}</text>
+              </view>
+              <view class="count-number">
+                <view class="edit minus" catch:tap="number_minute" data-index="{{index}}">
+                  -
+                </view>
+                <view class="edit edit-num">
+                  <input class="edit-text" type="number" value="{{item.count}}" bindblur="setCount" data-index="{{index}}"></input>
+                </view>
+                <view class="edit add" catch:tap="number_add" data-index="{{index}}">
+                  +
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</view>

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/component/c_takeaway_vtab.js

@@ -0,0 +1,198 @@
+const app = getApp()
+Component({
+  properties: {
+    list: '',
+    vtablist: '',
+  },
+  data: {
+    goods: [],
+    currentIndex: 0,
+    index: 0,
+    keyvalue:0
+  },
+  attached() {
+    this.getGoods();
+  },
+  methods: {
+    jumpTo: function (e) {
+      let vtablist = this.data.vtablist;
+      let index = 0;
+      for (let i in vtablist) {
+        vtablist[i].select = false;
+        app.globalData.verticaltablist[i].select = false;
+        if (vtablist[i].title === e.currentTarget.dataset.item.title) {
+          index = i;
+        }
+      }
+      // 左侧选中
+      vtablist[index].select = true;
+      app.globalData.verticaltablist[index].select = true;
+      this.setData({
+        vtablist: vtablist,
+        index,
+      });
+      app.globalData.index = index;
+      this.getGoods();
+    },
+    getGoods: function () {
+      let vtablist = this.data.vtablist;
+      this.setData({
+        index: app.globalData.index
+      })
+      this.setData({
+        goods: vtablist[this.data.index].products,
+      });
+      let arr = [];
+      let count = 0;
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          if (item2.count > 0) {
+            arr.push(item2);
+            count = count + item2.count;
+          }
+        })
+      })
+      has.setTabBarBadge({
+        index: 1,
+        text: count + '',
+      });
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+    },
+    //点击配送地址，跳转到地址选择页面
+    select: function () {
+      has.navigateTo({
+        url: '/pages/Page_Address/index',
+      });
+    },
+    // 点击 进入结算订单页面
+    goToPay() {
+      has.navigateTo({
+        url: '/pages/Page_Orders/index',
+      });
+    },
+    //商品详情
+    goodsDetail(e) {
+      let index = e.currentTarget.dataset.index;
+      has.setStorageSync('goodsDetail', this.data.goods[index]);
+      has.navigateTo({
+        url: '/pages/Page_GoodsDetail/index',
+      });
+    },
+    //商品数量减
+    number_minute: function (e) {
+      let index = e.currentTarget.dataset.index;
+      let goods = this.data.goods;
+      if (goods[index].count > 0) {
+        goods[index].count--;
+        app.globalData.verticaltablist[this.data.index].products[index].count--;
+      }
+      this.setData({
+        goods,
+      });
+      let arr = [];
+      let count = 0;
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          if (item2.count > 0) {
+            arr.push(item2);
+            count = count + item2.count;
+          }
+        })
+      })
+      if (count > 0) {
+        has.setTabBarBadge({
+          index: 1,
+          text: count + '',
+        });
+      }
+
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+    },
+    //商品数量加
+    number_add: function (e) {
+      let index = e.currentTarget.dataset.index;
+      let goods = this.data.goods;
+      goods[index].count++;
+      app.globalData.verticaltablist[this.data.index].products[index].count++;
+      this.setData({
+        goods,
+      });
+      let arr = [];
+      let count = 0;
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          if (item2.count > 0) {
+            arr.push(item2);
+            count = count + item2.count;
+          }
+        })
+      })
+      if (count > 0) {
+        has.setTabBarBadge({
+          index: 1,
+          text: count + '',
+        });
+      }
+
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+    },
+    setCount(e) {
+      let index = e.currentTarget.dataset.index;
+      const value = Number(e.detail.value);
+      let goods = this.data.goods;
+      if (value < 0 || value % 1 != 0) {
+        goods[index].count = 0;
+        this.setData({
+          goods: goods,
+          keyvalue:Date.now()
+        });
+        has.showModal({
+          title: '提示',
+          content: '请输入有效数字',
+          showCancel: false
+        });
+        return
+      }
+      goods[index].count = value;
+      this.setData({
+          goods: goods,
+          keyvalue:Date.now()
+        });
+      app.globalData.verticaltablist[this.data.index].products[index].count = goods[index].count;
+      let arr = [];
+      let count = 0;
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          if (item2.count > 0) {
+            arr.push(item2);
+            count = count + item2.count;
+          }
+        })
+      })
+      if (count > 0) {
+        has.setTabBarBadge({
+          index: 1,
+          text: count + '',
+        });
+      }
+
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+    },
+  },
+});

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/component/c_takeaway_vtab.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/data.js

@@ -0,0 +1,125 @@
+const GOOD1 = {
+  goods_pic: './TO_DELETE/grape.png',
+  goods_name: '招牌 黑藤巨峰',
+  goods_numbers: '一份/约500g',
+  goods_discount: 40.8,
+  goods_price: 58.8,
+  choosed: true,
+  count: 4,
+};
+
+const GOOD2 = {
+  goods_pic: './TO_DELETE/watermelon.png',
+  goods_name: '[默认切块] B级麒麟瓜',
+  goods_numbers: '半个/1600-3000g',
+  goods_discount: 40.8,
+  goods_price: 58.8,
+  choosed: true,
+  count: 0,
+};
+
+const GOOD3 = {
+  goods_pic: './TO_DELETE/pear.png',
+  goods_name: '招牌 冰糖翠冠梨 （大）',
+  goods_numbers: '半个/1600-3000g',
+  goods_discount: 40.8,
+  goods_price: 58.8,
+  choosed: true,
+  count: 1,
+};
+
+const GOOD4 = {
+  goods_pic: './TO_DELETE/prune.png',
+  goods_name: '招牌 法兰西西梅',
+  goods_numbers: '半个/1600-3000g',
+  goods_discount: 40.8,
+  goods_price: 58.8,
+  choosed: true,
+  count: 1,
+};
+const GOOD5 = {
+  goods_pic: './TO_DELETE/mango.png',
+  goods_name: '招牌 海南大芒果',
+  goods_numbers: '半个/1600-3000g',
+  goods_discount: 40.8,
+  goods_price: 58.8,
+  choosed: true,
+  count: 1,
+};
+
+const data = {
+  address: '天安云谷',
+  indicator: true,
+  sliderValue: 1000,
+  isLoop: true,
+  //banner图片资源
+  banner: [
+    {
+      uri: './TO_DELETE/banner.jpg',
+    },
+    {
+      uri: './TO_DELETE/banner.jpg',
+    },
+    {
+      uri: './TO_DELETE/banner.jpg',
+    },
+  ],
+  verticaltablist: [
+    {
+      title: '今日推荐',
+      select: true,
+      id: 'rec',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: '所有果品',
+      select: false,
+      id: 'all',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: '招牌果品',
+      select: false,
+      id: 'sig',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: '葡提浆果',
+      select: false,
+      id: 'ber',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: '当季时令',
+      select: false,
+      id: 'sea',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: '西瓜蜜瓜',
+      select: false,
+      id: 'mel',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4, GOOD5],
+    },
+    {
+      title: 'NFC果汁',
+      select: false,
+      id: 'jui',
+      products: [GOOD1, GOOD2, GOOD3, GOOD4],
+    },
+    {
+      title: '果篮礼盒',
+      select: false,
+      id: 'gif',
+      products: [GOOD1, GOOD2, GOOD3],
+    },
+    {
+      title: '果篮礼盒s',
+      select: false,
+      id: 'gif',
+      products: [GOOD1, GOOD2],
+    },
+  ],
+};
+
+export { data };

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/index.css

@@ -0,0 +1,4 @@
+.item-container {
+  justify-content: center;
+  flex-direction: column;
+}

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/index.hxml

@@ -0,0 +1,5 @@
+<!-- template里只能有一个根节点 -->
+<!-- 商家首页信息,当选中主tab的“首页”栏时显示 -->
+<view class="item-container">
+	<vtab list="{{banner}}" vtablist="{{verticaltablist}}" key="{{key}}"></vtab>
+</view>

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/index.js

@@ -0,0 +1,56 @@
+const app = getApp()
+Page({
+  data: {
+    banner: [
+      {
+        uri: './TO_DELETE/banner.jpg',
+      },
+      {
+        uri: './TO_DELETE/banner.jpg',
+      },
+      {
+        uri: './TO_DELETE/banner.jpg',
+      },
+    ],
+    verticaltablist: [],
+    key: 0
+  },
+  onLoad() {
+    setTimeout(() => {
+      this.setData({
+        key: Date.now()
+      })
+    }, 100)
+
+  },
+  onShow() {
+      let count = 0;
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          if (item2.count > 0) {
+            count = count + item2.count;
+          }
+        })
+      })
+      if (count > 0) {
+        has.setTabBarBadge({
+          index: 1,
+          text: count + '',
+        });
+      }
+
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+    this.setData({
+      verticaltablist: app.globalData.verticaltablist
+    })
+    setTimeout(() => {
+      this.setData({
+        key: Date.now()
+      })
+    }, 100)
+  },
+});

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_Home/index.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "vtab": "./component/c_takeaway_vtab"
+  },
+  "navigationBarTitleText": "外卖"
+}