cb-biz-ui 1.7.4 → 1.7.6

package/components/cb-shopping-cart/cb-shopping-cart.vue

@@ -1,93 +1,70 @@
 <template>
-  <view>
-    <scroll-view
-      scroll-y
-      :style="{ height: height }"
-      :show-scrollbar="false"
-      :enhanced="true"
-    >
-      <view class="shopping-cart" v-if="list.length">
-        <ui-checkbox-group
-          @change="buyChange"
-          :formFieldStyle="{
-            padding: 0
-          }"
-          formFieldPadding="0"
-          formFieldBackground="#f5f5f5"
-        >
-          <view
-            class="ui-cart-cell ui-mtop"
-            v-for="item in list"
-            :key="item.id"
+  <view style="height: 100%">
+    <view class="shopping-cart" v-if="list.length">
+      <ui-checkbox-group
+        @change="buyChange"
+        :formFieldStyle="{
+          padding: 0
+        }"
+        formFieldPadding="0"
+        formFieldBackground="#f5f5f5"
+      >
+        <view class="ui-cart-cell ui-mtop" v-for="item in list" :key="item.id">
+          <ui-slide-view
+            :threshold="20"
+            :right-options="actions"
+            @click="(index) => slideOptions(index, item)"
           >
-            <ui-slide-view
-              :threshold="20"
-              :right-options="actions"
-              @click="(index) => slideOptions(index, item)"
-            >
-              <view class="ui-goods-item">
-                <ui-label width="50rpx" min-height="100%" class="ui-checkbox">
-                  <ui-checkbox
-                    :trigger-group="false"
-                    borderColor="#6D7278"
-                    :color="primaryColor"
-                    :scaleRatio="0.8"
-                    :value="item.id"
-                    :checked="item.selected"
-                    :disabled="
-                      item.skuInfo.inventoryCapacity === 0 ||
-                      item.skuInfo.saleStatus !== 10
-                    "
-                  ></ui-checkbox>
-                </ui-label>
-
-                <view class="goods-card_box bottom-1px-border">
-                  <goods-card
-                    imgWidth="239rpx"
-                    imgHeight="239rpx"
-                    image-placeholder="https://shop-cdn.cbyzx.com/shop23n05y18abcd/img/50fbba9d9b4e4184b9ab7e2fbb43c645.png"
-                    :textFontSize="props.goodTextStyles"
-                    :goodsCount="item.count"
-                    :add-btn-bg-color="primaryColor"
-                    :bezier="false"
-                    @countChange="(val) => countChange(val, item)"
-                    @handleClick="(goodsInfo) => goDetails(goodsInfo, item)"
-                    :entity="item.skuInfo"
-                  />
-                </view>
+            <view class="ui-goods-item">
+              <ui-label width="50rpx" min-height="100%" class="ui-checkbox">
+                <ui-checkbox
+                  :trigger-group="false"
+                  borderColor="#6D7278"
+                  :color="primaryColor"
+                  :scaleRatio="0.8"
+                  :value="item.id"
+                  :checked="item.selected"
+                  :disabled="
+                    item.skuInfo.inventoryCapacity === 0 ||
+                    item.skuInfo.saleStatus !== 10
+                  "
+                ></ui-checkbox>
+              </ui-label>
+
+              <view class="goods-card_box bottom-1px-border">
+                <goods-card
+                  imgWidth="239rpx"
+                  imgHeight="239rpx"
+                  image-placeholder="https://shop-cdn.cbyzx.com/shop23n05y18abcd/img/50fbba9d9b4e4184b9ab7e2fbb43c645.png"
+                  :textFontSize="props.goodTextStyles"
+                  :goodsCount="item.count"
+                  :add-btn-bg-color="primaryColor"
+                  :bezier="false"
+                  @countChange="(val) => countChange(val, item)"
+                  @handleClick="(goodsInfo) => goDetails(goodsInfo, item)"
+                  :entity="item.skuInfo"
+                />
               </view>
-            </ui-slide-view>
-          </view>
-        </ui-checkbox-group>
-      </view>
-      <view v-else>
-        <ui-no-data :fixed="false" marginTop="250" :imgUrl="nullDataUrl">
-          <text class="tui-color__black">购物车暂无商品~</text>
-        </ui-no-data>
-      </view>
-    </scroll-view>
+            </view>
+          </ui-slide-view>
+        </view>
+      </ui-checkbox-group>
+    </view>
+    <view v-else>
+      <ui-no-data :fixed="false" marginTop="250" :imgUrl="nullDataUrl">
+        <text class="tui-color__black">购物车暂无商品~</text>
+      </ui-no-data>
+    </view>
     <!--tabbar-->
-    <shopping-cart-tabbar
-      :selectCount="selectCount"
-      :is-all="isAll"
-      :loading="payLoading"
-      :priceData="props.priceData"
-      :primaryColor="primaryColor"
-      @buyPlay="buyPlay"
-      @checkAll="checkAll"
-    />
   </view>
 </template>
 <script setup lang="ts">
-import { computed } from 'vue';
 import { onReady } from '@dcloudio/uni-app';
 import GoodsCard from '../cb-goods-card/cb-goods-card.vue';
-import ShoppingCartTabbar from '../cb-shopping-cart-tabbar/cb-shopping-cart-tabbar.vue';
 import type {
   changeValueType,
   cartItemListType,
-  skuInfoType,
-  priceDataType
+  skuInfoType
 } from '../interface/types';
 
 const emit = defineEmits<{
@@ -103,7 +80,6 @@ interface IProps {
   height: string;
   list: cartItemListType[];
   nullDataUrl: string;
-  priceData: priceDataType;
   goodTextStyles: {
     title: string;
     tag: string;
@@ -119,14 +95,6 @@ interface IProps {
 const props = withDefaults(defineProps<IProps>(), {
   height: '100%',
   list: [],
-  priceData: {
-    discountTotal: 0,
-    discountTotalShow: '0.00',
-    marketPriceTotal: 0,
-    marketPriceTotalShow: '0.00',
-    platformPriceTotal: 0,
-    platformPriceTotalShow: '0.00'
-  },
   goodTextStyles: {
     title: '27rpx',
     tag: '18rpx',
@@ -147,19 +115,6 @@ const actions = [
   }
 ];
 
-const isAll = computed(() => {
-  const availableList =
-    props?.list?.filter(
-      (v) => v.skuInfo.existInventory && v.skuInfo.saleStatus === 10
-    ) || [];
-  const selected = availableList.filter((v) => v.selected);
-  return selected.length === availableList.length && availableList.length !== 0;
-});
-
-const selectCount = computed(() => {
-  return props.list.filter((v) => v.selected).length;
-});
-
 const countChange = (val: changeValueType, item: cartItemListType) => {
   emit('countChange', val, item);
   setTimeout(() => {
@@ -172,7 +127,7 @@ const goDetails = (goodsInfo: skuInfoType, item: cartItemListType) => {
 };
 
 const calcHandle = () => {
-  const itemList = props.list.filter((v) => v.selected);
+  const itemList = props?.list?.filter((v) => v.selected) || [];
   emit('calcHandle', itemList);
 };
 
@@ -183,13 +138,6 @@ const slideOptions = (val: { index: number }, data: cartItemListType) => {
   }, 0);
 };
 
-const buyPlay = () => {
-  emit(
-    'buyPlay',
-    props.list.filter((v) => v.selected)
-  );
-};
-
 const buyChange = (e) => {
   emit('checkGoods', e.detail.value);
   setTimeout(() => {
@@ -197,16 +145,6 @@ const buyChange = (e) => {
   }, 0);
 };
 
-const checkAll = (e) => {
-  const availableList = props.list.filter(
-    (v) => v.skuInfo.existInventory && v.skuInfo.saleStatus === 10
-  );
-  emit('checkGoods', isAll.value ? [] : availableList.map((v) => v.id));
-  setTimeout(() => {
-    calcHandle();
-  }, 0);
-};
-
 onReady(() => {});
 
 // watch(

package/components/cb-shopping-cart-tabbar/cb-shopping-cart-tabbar.vue

@@ -11,14 +11,12 @@
         ></ui-checkbox>
       </ui-label>
       <view class="ui-total-price">
-        <view class="top"
-          ><text class="buy-num">已选购</text>
+        <view class="top">
+          <text class="buy-num">已选购</text>
           <text class="buy-count">{{ selectCount }}件</text>
           <text class="reduction-tip">优惠后合计</text>
-          <text class="ui-bold"
-            >￥{{ priceData.platformPriceTotalShow }}</text
-          ></view
-        >
+          <text class="ui-bold">￥{{ priceData.platformPriceTotalShow }}</text>
+        </view>
         <text class="reduction">共减¥{{ priceData.discountTotalShow }}</text>
       </view>
     </view>
@@ -29,28 +27,27 @@
       padding="27rpx 70rpx"
       :background="primaryColor"
       :loading="loading"
-      @click="btnPay"
-      >去结算</ui-form-button
+      @click="buyPlayMethod"
     >
+      去结算
+    </ui-form-button>
   </view>
 </template>
 <script setup lang="ts">
-import type { priceDataType } from '../interface/types';
-
+import { computed } from 'vue';
+import type { priceDataType, cartItemListType } from '../interface/types';
 interface IProps {
-  selectCount: number;
-  isAll: boolean;
+  list: cartItemListType[];
   priceData: priceDataType;
   loading: boolean;
   primaryColor: string;
 }
 const emit = defineEmits<{
-  (e: 'buyPlay'): void;
-  (e: 'checkAll'): void;
+  (e: 'buyPlay', item: cartItemListType[]): void;
+  (e: 'checkGoods', value: number[]): void;
+  (e: 'calcHandle', itemList: cartItemListType[]): void;
 }>();
 const props = withDefaults(defineProps<IProps>(), {
-  selectCount: 0,
-  isAll: false,
   priceData: {
     discountTotal: 0,
     discountTotalShow: '0.00',
@@ -61,12 +58,38 @@ const props = withDefaults(defineProps<IProps>(), {
   },
   primaryColor: '#6D7278'
 });
-const btnPay = () => {
-  emit('buyPlay');
+const isAll = computed(() => {
+  const availableList =
+    props?.list?.filter(
+      (v) => v.skuInfo.existInventory && v.skuInfo.saleStatus === 10
+    ) || [];
+  const selected = availableList.filter((v) => v.selected);
+  return selected.length === availableList.length && availableList.length !== 0;
+});
+
+const selectCount = computed(() => {
+  return props?.list?.filter((v) => v.selected).length || 0;
+});
+
+const buyPlayMethod = () => {
+  emit(
+    'buyPlay',
+    props.list.filter((v) => v.selected)
+  );
 };
 
 const checkAll = (e) => {
-  emit('checkAll');
+  const availableList = props.list.filter(
+    (v) => v.skuInfo.existInventory && v.skuInfo.saleStatus === 10
+  );
+  emit('checkGoods', isAll.value ? [] : availableList.map((v) => v.id));
+  setTimeout(() => {
+    calcHandle();
+  }, 0);
+};
+const calcHandle = () => {
+  const itemList = props.list.filter((v) => v.selected);
+  emit('calcHandle', itemList);
 };
 </script>
 <style scoped lang="scss">
@@ -83,7 +106,6 @@ const checkAll = (e) => {
   padding: 0 29rpx;
   box-sizing: border-box;
   font-size: 24rpx;
-  z-index: 9999;
   &::before {
     content: ' ';
     width: 100%;

package/libs/css/shopping-cart.scss

@@ -49,3 +49,4 @@
   }
 
 }
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cb-biz-ui",
-  "version": "1.7.4",
+  "version": "1.7.6",
   "description": "cb-biz-ui",
   "main": "index.js",
   "keywords": [