@atomicservice/ascf-base 1.0.16 → 1.0.17

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_ShoppingCart/component/c_shoppingcart.css

@@ -0,0 +1,267 @@
+.shopping-container {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 100rpx;
+  padding-top: 10rpx;
+}
+
+.img-action {
+  width: 15rpx;
+  height: 32rpx;
+  resize-mode: contain;
+}
+
+.shoppingcart-title-area {
+  background-color: #f2f2f2;
+  height: 100rpx;
+  width: 750rpx;
+  padding-left: 33rpx;
+}
+
+.page-head {
+  height: 84rpx;
+  align-items: center;
+}
+
+.page-head image {
+  width: 21rpx;
+  height: 26rpx;
+  resize-mode: contain;
+  margin-left: 33rpx;
+  margin-right: 12rpx;
+}
+
+.good-address {
+  font-size: 31.3rpx;
+  color: #1a1a1a;
+  width: 497rpx;
+  margin-right: 39rpx;
+}
+
+.goods-edit {
+  font-size: 31.3rpx;
+  color: #24a846;
+  margin-right: 39rpx;
+}
+
+.page-content {
+  display: flex;
+  align-items: center;
+  height: 169rpx;
+  margin-top: 32rpx;
+}
+.count-number {
+  display: flex;
+  position: absolute;
+  right: 32rpx;
+}
+.total-wrap {
+  display: flex;
+  align-items: center;
+  position: absolute;
+  right: 260rpx;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.page-right {
+  display: flex;
+  height: 169rpx;
+  border-bottom-width: 1rpx;
+  border-bottom-color: #f2f2f2;
+}
+
+.page-content .check {
+  width: 60rpx;
+  height: 60rpx;
+  border-radius: 5.86rpx;
+  margin-left: 28rpx;
+  margin-right: 26rpx;
+}
+
+.page-content .pic {
+  width: 134rpx;
+  height: 142rpx;
+  border-radius: 5.86rpx;
+  margin-right: 33rpx;
+}
+
+.goods-detail {
+  display: flex;
+  flex-direction: column;
+}
+
+.goods-weigth {
+  color: #1a1a1a;
+  opacity: 0.3;
+  font-size: 20.8rpx;
+  margin-top: 8rpx;
+}
+
+.goods-name {
+  font-size: 31.3rpx;
+  color: #1a1a1a;
+}
+
+.good-discount {
+  color: #ff742e;
+  font-size: 31.3rpx;
+  width: 100rpx;
+  margin-right: 16rpx;
+}
+
+.good-price {
+  color: #1a1a1a;
+  opacity: 0.3;
+  font-size: 20.8rpx;
+  width: 80rpx;
+  text-decoration: line-through;
+}
+
+.edit-minus {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 48rpx;
+  border: 1rpx solid #cccccc;
+  height: 50rpx;
+  border-bottom-left-radius: 5.86rpx;
+  border-top-left-radius: 5.86rpx;
+}
+
+.edit-count {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 48rpx;
+  border-top-color: rgba(0, 0, 0, 0.2);
+  border-top-width: 1rpx;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  border-bottom-width: 1rpx;
+  height: 50rpx;
+}
+
+.edit-text {
+  color: #1a1a1a;
+  font-size: 22rpx;
+  text-align: center;
+}
+
+.edit-add {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 48rpx;
+  border: 1rpx solid #cccccc;
+  height: 50rpx;
+  border-top-right-radius: 5.86rpx;
+  border-bottom-right-radius: 5.86rpx;
+}
+
+.page-total {
+  display: flex;
+  justify-content: space-between;
+  height: 100rpx;
+  position: fixed;
+  width: 100%;
+  bottom: 100rpx;
+  background-color: #ffffff;
+}
+
+.page-total image {
+  height: 50rpx;
+  width: 50rpx;
+  margin-left: 28rpx;
+  margin-right: 16rpx;
+}
+
+.all {
+  font-size: 27.1rpx;
+  color: #1a1a1a;
+}
+
+.all-img {
+  border-radius: 5.86rpx;
+  width: 50rpx;
+  height: 50rpx;
+}
+
+.total {
+  font-size: 31.3rpx;
+  color: #1a1a1a;
+  margin-right: 8rpx;
+}
+
+.total-price {
+  font-size: 31.3rpx;
+  color: #ff742e;
+  margin-right: 34rpx;
+}
+
+.pay {
+  width: 267rpx;
+  height: 100rpx;
+  font-size: 31.3rpx;
+  color: #ffffff;
+  background-color: #fe9f05;
+  text-align: center;
+  line-height: 100rpx;
+}
+
+.cannot-pay {
+  width: 267rpx;
+  height: 100rpx;
+  font-size: 31.3rpx;
+  color: #ffffff;
+  background-color: #dcdcdc;
+  text-align: center;
+  line-height: 100rpx;
+}
+
+.delete {
+  width: 267rpx;
+  height: 100rpx;
+  font-size: 31.3rpx;
+  color: #ffffff;
+  background-color: #fa2a2d;
+  text-align: center;
+  line-height: 100rpx;
+}
+
+.cannot-delete {
+  width: 267rpx;
+  height: 100rpx;
+  font-size: 31.3rpx;
+  color: #ffffff;
+  background-color: #dcdcdc;
+  text-align: center;
+  line-height: 100rpx;
+}
+
+.all-choice {
+  display: flex;
+  align-items: center;
+}
+
+.item {
+  display: flex;
+}
+
+.not-box{
+  text-align: center;
+  padding-top: 200rpx;
+}
+
+.shopping{
+  width: 200rpx;
+  height: 200rpx;
+}
+
+.selected-number{
+  margin-left: 12rpx;
+  font-size: 24rpx;
+}
+
+.goods-collecting{
+  font-size: 31.3rpx;
+  color: red;
+}

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_ShoppingCart/component/c_shoppingcart.hxml

@@ -0,0 +1,70 @@
+<!-- template里只能有一个根节点 -->
+<view class="shopping-container" key="{{keyvalue}}">
+  <view has:if="{{datas.list.length>0}}">
+    <!-- 位置 -->
+    <view class="page-head">
+      <image src="../img/gps.png"></image>
+      <text class="good-address" bind:tap="jumpToAddress">{{address}}</text>
+      <text bind:tap="change_state" class="goods-edit">{{change_state_tile}}</text>
+      <text bind:tap="change_collecting" class="goods-collecting" has:if="{{change_state_tile==='完成'}}">收藏</text>
+    </view>
+    <!-- 商品列表 -->
+    <block has:for="{{datas.list}}" has:key="item">
+      <view class="page-content">
+        <image class="check" bind:tap="change" data-index="{{index}}" style="width: 50rpx;height:50rpx;" src="{{item.choosed ?datas.checked:datas.unChecked}}"></image>
+        <view class="page-right">
+          <image class="pic" style="width:134rpx;height:150rpx;" src="{{item.goods_pic}}"></image>
+          <view class="goods-detail">
+            <text class="goods-name">{{item.goods_name}}</text>
+            <text class="goods-weigth">{{item.goods_numbers}}</text>
+            <view class="item">
+              <view>
+                <text class="good-discount">¥{{item.goods_discount}}</text>
+                <text class="good-price">¥{{item.goods_price}}</text>
+              </view>
+              <view class="count-number">
+                <view class="edit-minus" bind:tap="number_minute" data-index="{{index}}">-</view>
+                <view class="edit-count">
+                  <input class="edit-text" type="number" value="{{item.number}}" bindblur="setCount" data-index="{{index}}"></input>
+                </view>
+                <view class="edit-add" bind:tap="number_add" data-index="{{index}}">+</view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </block>
+    <!-- 底部固定全选结算条目 -->
+    <view has:if="{{showpay}}">
+      <view has:if="{{no_edit}}" class="page-total">
+        <view class="all-choice">
+          <image class="all-img" bind:tap="allChange" src="{{all_choosed ?datas.checked:datas.unChecked}}"></image>
+          <text class="all">全选</text>
+          <text class="selected-number">已选{{selected_number}}件</text>
+        </view>
+        <view class="total-wrap">
+          <text class="total">合计:</text>
+          <text class="total-price">¥{{total_price}}</text>
+        </view>
+        <view has:if="{{isCanGoPay}}" class="pay" bind:tap="check">去结算({{selected_number}})件</view>
+        <view has:else class="cannot-pay">去结算</view>
+      </view>
+      <view has:if="{{!no_edit}}" class="page-total">
+        <view class="all-choice">
+          <image class="all-img" bind:tap="allChange" src="{{all_choosed ?datas.checked:datas.unChecked}}"></image>
+          <text class="all">全选</text>
+          <text class="selected-number">已选{{selected_number}}件</text>
+        </view>
+        <view has:if="{{isCanGoPay}}" class="delete" bind:tap="delete">删除</view>
+        <view has:else="" class="cannot-delete">删除</view>
+      </view>
+    </view>
+  </view>
+  <view has:else="" class="not-box">
+    <image src="../img/shopping.png" class="shopping"></image>
+    <view>购物车是空的</view>
+    <view>
+      <button bind:tap="gotoHome">去逛逛</button>
+    </view>
+  </view>
+</view>

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_ShoppingCart/component/c_shoppingcart.js

@@ -0,0 +1,317 @@
+const app = getApp()
+Component({
+  properties: {
+    address: '', // 地址信息
+    datas: '', // 购物车商品信息
+    showpay: '', // 是否显示确认支付栏
+    shoppingcartnumbers: '', //购物车数量
+    total_price: 0,
+    selected_number: 0
+  },
+  data: {
+    isCanGoPay: true,
+    total_price: 0,
+    no_edit: true,
+    change_state_tile: '商品编辑',
+    all_choosed: true,
+    selected_number: 0,
+    keyvalue: 0
+  },
+  methods: {
+    change: function (e) {
+      let index = e.currentTarget.dataset.index;
+      let datas = this.data.datas;
+      let list = datas.list;
+      list[index].choosed = !list[index].choosed;
+      datas.list = list;
+
+      // 判断是否全选
+      let result = true;
+      for (let i = 0; i < list.length; i++) {
+        if (list[i].choosed == false) {
+          result = false;
+          break;
+        }
+      }
+      this.setData({
+        datas,
+        all_choosed: result,
+      });
+      this.updateTotalPrice();
+    },
+    number_minute: function (e) {
+      let index = e.currentTarget.dataset.index;
+      let datas = this.data.datas;
+      let list = datas.list;
+      if (list[index].number > 1) {
+        list[index].number--;
+        datas.list = list;
+        this.setData({
+          datas,
+        });
+        this.updateTotalPrice();
+      }
+    },
+    number_add: function (e) {
+      let index = e.currentTarget.dataset.index;
+      let datas = this.data.datas;
+      let list = datas.list;
+      list[index].number++;
+      datas.list = list;
+      this.setData({
+        datas,
+      });
+      this.updateTotalPrice();
+    },
+    setCount(e) {
+      let index = e.currentTarget.dataset.index;
+      const value = Number(e.detail.value);
+      let datas = this.data.datas;
+      let list = datas.list;
+      if (value < 0 || value % 1 != 0) {
+        list[index].number = 0;
+        datas.list = list;
+        this.setData({
+          datas: datas,
+          keyvalue: Date.now()
+        });
+        has.showModal({
+          title: '提示',
+          content: '请输入有效数字',
+          showCancel: false
+        });
+        return
+      }
+      list[index].number = value;
+      datas.list = list;
+      this.setData({
+        datas: datas,
+        keyvalue: Date.now()
+      });
+      this.updateTotalPrice();
+    },
+    updateTotalPrice: function () {
+      let isCanGoPay = true;
+      let total_price = 0;
+      let shoppingcartnumbers = 0;
+      let count = 0;
+      let selected_number = 0;
+      this.data.datas.list.forEach((element) => {
+        if (element.choosed) {
+          total_price += element.number * element.goods_discount;
+          shoppingcartnumbers++;
+          selected_number++;
+        }
+        if (element.number > 0) {
+          count = count + element.number;
+        }
+      });
+      has.setTabBarBadge({
+        index: 1,
+        text: count + '',
+      });
+      if (count === 0) {
+        has.removeTabBarBadge({
+          index: 1,
+        });
+      }
+      if (shoppingcartnumbers == 0) isCanGoPay = false;
+      this.setData({
+        total_price: total_price.toFixed(2),
+        selected_number: selected_number,
+        shoppingcartnumbers,
+        isCanGoPay,
+      });
+      let arr = [];
+      this.data.datas.list.map((item, index) => {
+        arr.push({
+          goods_pic: item.goods_pic,
+          goods_name: item.goods_name,
+          goods_numbers: item.goods_numbers,
+          goods_discount: item.goods_discount,
+          goods_price: item.goods_price,
+          choosed: item.choosed,
+          count: item.number
+        })
+      })
+    },
+    allChange: function () {
+      let all_choosed = this.data.all_choosed;
+      let datas = this.data.datas;
+      let list = this.data.datas.list;
+      all_choosed = !all_choosed;
+      if (all_choosed) {
+        list.forEach((element) => {
+          element.choosed = true;
+        });
+        this.updateTotalPrice();
+      } else {
+        list.forEach((element) => {
+          element.choosed = false;
+        });
+        this.updateTotalPrice();
+      }
+      datas.list = list;
+      this.setData({
+        all_choosed,
+        datas,
+      });
+    },
+    change_state: function () {
+      let no_edit = this.data.no_edit;
+      let change_state_tile;
+      if (no_edit) {
+        no_edit = false;
+        change_state_tile = '完成';
+      } else {
+        no_edit = true;
+        change_state_tile = '商品编辑';
+      }
+      this.setData({
+        no_edit,
+        change_state_tile,
+      });
+    },
+    //结算跳转
+    check: function () {
+      has.navigateTo({
+        url: '/pages/Page_Orders/index',
+      });
+    },
+    jumpToAddress() {
+      //TODO 请跳转到页面选择页面，并设置收货地址。在返回页面时刷新收货地址显示。
+      has.navigateTo({
+        url: '/pages/Page_Address/index',
+      });
+    },
+    //删除
+    delete() {
+      let datas = this.data.datas;
+      let arr = [];
+      datas.list.map((item, index) => {
+        if (item.choosed === false) {
+          arr.push(item)
+        }
+      })
+      datas.list = arr;
+      this.setData({
+        datas,
+        all_choosed: false,
+      });
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          app.globalData.verticaltablist[index].products[index2].count = 0;
+        })
+      })
+      app.globalData.verticaltablist.map((item, index) => {
+        item.products.map((item2, index2) => {
+          arr.map((item3, index3) => {
+            if (item3.goods_name === item2.goods_name) {
+              app.globalData.verticaltablist[index].products[index2].count = item3.number;
+            }
+          })
+        })
+      })
+
+      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,
+        });
+      }
+    },
+
+    //去逛逛
+    gotoHome() {
+      has.switchTab({
+        url: '/pages/Page_MainTab/Page_Home/index',
+      });
+    },
+    //点击收藏
+    change_collecting() {
+      let arr = [];
+      let brr = app.globalData.collectingList;
+      this.data.datas.list.forEach((element) => {
+        if (element.choosed) {
+          arr.push(element);
+        }
+      });
+      if (!brr || brr.length === 0) {
+        app.globalData.collectingList = arr;
+        has.showModal({
+          title: '提示',
+          content: '收藏成功!',
+          showCancel: false
+        });
+      } else {
+        const result = arr.every(item1 =>
+          brr.some(item2 => item1.goods_name === item2.goods_name)
+        );
+        if (result) {
+          has.showModal({
+            title: '重复收藏',
+            content: '收藏失败!',
+            showCancel: false
+          });
+        } else {
+          const array3 = this.getUnion(arr, brr);
+          app.globalData.collectingList = array3;
+          has.showModal({
+            title: '存在重复收藏',
+            content: '收藏成功!',
+            showCancel: false
+          });
+        }
+      }
+    },
+    areObjectsEqual(obj1, obj2) {
+      const keys1 = Object.keys(obj1);
+      const keys2 = Object.keys(obj2);
+
+      if (keys1.length !== keys2.length) {
+        return false;
+      }
+
+      for (const key of keys1) {
+        if (obj1[key] !== obj2[key]) {
+          return false;
+        }
+      }
+
+      return true;
+    },
+    getUnion(array1, array2) {
+      const array3 = [];
+
+      // 将 array1 的所有元素添加到 array3
+      array1.forEach(item => {
+        if (!array3.some(existingItem => this.areObjectsEqual(existingItem, item))) {
+          array3.push(item);
+        }
+      });
+
+      // 将 array2 的所有元素添加到 array3
+      array2.forEach(item => {
+        if (!array3.some(existingItem => this.areObjectsEqual(existingItem, item))) {
+          array3.push(item);
+        }
+      });
+
+      return array3;
+    }
+  },
+});

package/dist/templates/ascfTakeaway/pages/Page_MainTab/Page_ShoppingCart/component/c_shoppingcart.json

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

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

@@ -0,0 +1,2 @@
+
+

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

@@ -0,0 +1,2 @@
+<shoppingcarts address="{{address}}" showpay="{{showpay}}" no_edit="true" datas="{{datas_shoppingcart}}" total_price="{{total_price}}" selected_number="{{selected_number}}" key="{{key}}">
+</shoppingcarts>