|
|
@@ -1,108 +1,211 @@
|
|
|
<template>
|
|
|
<view>
|
|
|
<view class="shoppingCart copy-data">
|
|
|
- <view class="borRadius14 cartBox">
|
|
|
- <view
|
|
|
- v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"
|
|
|
- class="pad20"
|
|
|
- >
|
|
|
+ <view class="borRadius14">
|
|
|
<view
|
|
|
- v-if="
|
|
|
+ v-if="
|
|
|
(cartList.valid.length === 0 && cartList.invalid.length === 0) ||
|
|
|
cartList.valid.length > 0
|
|
|
"
|
|
|
- class="nav acea-row row-between-wrapper"
|
|
|
+ class="nav acea-row row-between-wrapper"
|
|
|
>
|
|
|
<view
|
|
|
- >购物车数量
|
|
|
+ >购物车数量
|
|
|
<!-- <text class="num font-color">{{ cartCount }}</text></view> -->
|
|
|
<text class="num font-color">{{ orderGoodsCount }}</text></view>
|
|
|
<view
|
|
|
- v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"
|
|
|
- class="administrate acea-row row-center-wrapper"
|
|
|
- @click="manage"
|
|
|
- >{{ footerswitch ? "管理" : "取消" }}
|
|
|
+ v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"
|
|
|
+ class="administrate acea-row row-center-wrapper"
|
|
|
+ @click="manage"
|
|
|
+ >{{ footerswitch ? "管理" : "取消" }}
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="list">
|
|
|
- <up-checkbox-group
|
|
|
- @change="checkboxChange"
|
|
|
- shape="circle"
|
|
|
- v-model="shopCheckbox"
|
|
|
- >
|
|
|
- <block v-for="(item, index) in cartList.valid" :key="index">
|
|
|
- <view class="item acea-row row-between-wrapper">
|
|
|
- <up-checkbox
|
|
|
- activeColor="#E93323"
|
|
|
- :name="item.id"
|
|
|
- :disabled="!item.attrStatus && footerswitch"
|
|
|
- :checked="item.checked"
|
|
|
- :customStyle="{ marginRight: '10px' }"
|
|
|
- ></up-checkbox>
|
|
|
-
|
|
|
- <navigator
|
|
|
- :render-link="false"
|
|
|
- :url="'/pages/goods_details/index?id=' + item.productId"
|
|
|
- hover-class="none"
|
|
|
- class="picTxt row-between-wrapper"
|
|
|
+ </view>
|
|
|
+ <view class="borRadius14 cartBox">
|
|
|
+ <view
|
|
|
+ v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"
|
|
|
+ class="pad20"
|
|
|
+ >
|
|
|
+ <!-- 按商家分组的商品列表 -->
|
|
|
+ <view class="merchant-groups">
|
|
|
+ <block v-for="(merchant, merchantIndex) in groupedCartList" :key="merchantIndex">
|
|
|
+ <view class="merchant-group">
|
|
|
+ <!-- 商家头部 -->
|
|
|
+ <view class="merchant-header acea-row row-between-wrapper">
|
|
|
+ <view class="merchant-info acea-row row-middle">
|
|
|
+ <image class="merchant-logo" :src="merchant.logo" mode="aspectFill"></image>
|
|
|
+ <text class="merchant-name">{{ merchant.name }}</text>
|
|
|
+ <uni-icons type="right" size="14" color="#333333"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 商家下的商品列表 -->
|
|
|
+ <view class="list">
|
|
|
+ <up-checkbox-group
|
|
|
+ @change="checkboxChange"
|
|
|
+ shape="circle"
|
|
|
+ v-model="shopCheckbox"
|
|
|
>
|
|
|
- <view class="pictrue">
|
|
|
- <image :src="item.image"></image>
|
|
|
- </view>
|
|
|
- <view class="item-info">
|
|
|
- <view class="text">
|
|
|
- <view
|
|
|
- class="line1"
|
|
|
- :class="item.attrStatus ? '' : 'reColor'"
|
|
|
- >{{ item.storeName }}
|
|
|
- </view>
|
|
|
- <view class="attribute-box infor line1">
|
|
|
- <view class="attribute-suk" v-show="item.suk">属性:{{ item.suk }}</view>
|
|
|
- <view v-show="!item.attrStatus" class="invalid-count">数量:{{ item.cartNum }}</view>
|
|
|
- </view>
|
|
|
- <view class="labor-costs line1" v-if="item.attrStatus"
|
|
|
- >工费:{{ item.price }}/克</view
|
|
|
+ <block v-for="(item, index) in merchant.products" :key="index">
|
|
|
+ <view class="item acea-row row-between-wrapper">
|
|
|
+ <up-checkbox
|
|
|
+ activeColor="#F8C008"
|
|
|
+ :name="item.id"
|
|
|
+ :disabled="!item.attrStatus && footerswitch"
|
|
|
+ :checked="item.checked"
|
|
|
+ :customStyle="{ marginRight: '10px' }"
|
|
|
+ ></up-checkbox>
|
|
|
+
|
|
|
+ <navigator
|
|
|
+ :render-link="false"
|
|
|
+ :url="'/pages/goods_details/index?id=' + item.productId"
|
|
|
+ hover-class="none"
|
|
|
+ class="picTxt row-between-wrapper"
|
|
|
>
|
|
|
- <view class="money" v-if="item.attrStatus"
|
|
|
- >¥{{ item.storePrice }}</view
|
|
|
- >
|
|
|
- <!-- <view class='money' v-if="item.attrStatus">¥{{item.truePrice}}</view> -->
|
|
|
- <view
|
|
|
- class="reElection acea-row row-between-wrapper"
|
|
|
- v-else
|
|
|
- >
|
|
|
- <view class="title">请重新选择商品规格</view>
|
|
|
- <view
|
|
|
- class="reBnt cart-color acea-row row-center-wrapper"
|
|
|
- @click.stop="reElection(item)"
|
|
|
- >重选
|
|
|
+ <view class="pictrue">
|
|
|
+ <image :src="item.image"></image>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view
|
|
|
- class="carnum acea-row row-center-wrapper"
|
|
|
- v-if="item.attrStatus"
|
|
|
- >
|
|
|
- <view
|
|
|
- class="reduce"
|
|
|
- :class="item.numSub ? 'on' : ''"
|
|
|
- @click.stop="subCart(index)"
|
|
|
- >-</view
|
|
|
- >
|
|
|
- <view class="num">{{ item.cartNum }}</view>
|
|
|
- <view
|
|
|
- class="plus"
|
|
|
- :class="item.numAdd ? 'on' : ''"
|
|
|
- @click.stop="addCart(index)"
|
|
|
- >+</view
|
|
|
- >
|
|
|
+ <view class="item-info">
|
|
|
+ <view class="text">
|
|
|
+ <view
|
|
|
+ class="line1"
|
|
|
+ :class="item.attrStatus ? '' : 'reColor'"
|
|
|
+ >
|
|
|
+ <view class="storeName">
|
|
|
+ {{ item.storeName }}
|
|
|
+ </view>
|
|
|
+ <view
|
|
|
+ class="carnum acea-row row-center-wrapper"
|
|
|
+ v-if="item.attrStatus"
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ class="reduce"
|
|
|
+ :class="item.numSub ? 'on' : ''"
|
|
|
+ @click.stop="subCart(index)"
|
|
|
+ >-</view
|
|
|
+ >
|
|
|
+ <view class="num">{{ item.cartNum }}</view>
|
|
|
+ <view
|
|
|
+ class="plus"
|
|
|
+ :class="item.numAdd ? 'on' : ''"
|
|
|
+ @click.stop="addCart(index)"
|
|
|
+ >+</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="attribute-box infor line1">
|
|
|
+ <view class="attribute-suk" v-show="item.suk">属性:{{ item.suk }}</view>
|
|
|
+ <view v-show="!item.attrStatus" class="invalid-count">数量:{{ item.cartNum }}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="money" v-if="item.attrStatus"
|
|
|
+ >¥{{ item.storePrice }}</view
|
|
|
+ >
|
|
|
+ <view class="labor-costs line1" v-if="item.attrStatus"
|
|
|
+ >工费:{{ item.price }}/克</view
|
|
|
+ >
|
|
|
+ <!-- <view class='money' v-if="item.attrStatus">¥{{item.truePrice}}</view> -->
|
|
|
+ <view
|
|
|
+ class="reElection acea-row row-between-wrapper"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <view class="title">请重新选择商品规格</view>
|
|
|
+ <view
|
|
|
+ class="reBnt cart-color acea-row row-center-wrapper"
|
|
|
+ @click.stop="reElection(item)"
|
|
|
+ >重选
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </navigator>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </navigator>
|
|
|
+ </block>
|
|
|
+ </up-checkbox-group>
|
|
|
</view>
|
|
|
- </block>
|
|
|
- </up-checkbox-group>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
</view>
|
|
|
+<!-- <view class="list">-->
|
|
|
+<!-- <up-checkbox-group-->
|
|
|
+<!-- @change="checkboxChange"-->
|
|
|
+<!-- shape="circle"-->
|
|
|
+<!-- v-model="shopCheckbox"-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <block v-for="(item, index) in cartList.valid" :key="index">-->
|
|
|
+<!-- <view class="item acea-row row-between-wrapper">-->
|
|
|
+<!-- <up-checkbox-->
|
|
|
+<!-- activeColor="#F8C008"-->
|
|
|
+<!-- :name="item.id"-->
|
|
|
+<!-- :disabled="!item.attrStatus && footerswitch"-->
|
|
|
+<!-- :checked="item.checked"-->
|
|
|
+<!-- :customStyle="{ marginRight: '10px' }"-->
|
|
|
+<!-- ></up-checkbox>-->
|
|
|
+
|
|
|
+<!-- <navigator-->
|
|
|
+<!-- :render-link="false"-->
|
|
|
+<!-- :url="'/pages/goods_details/index?id=' + item.productId"-->
|
|
|
+<!-- hover-class="none"-->
|
|
|
+<!-- class="picTxt row-between-wrapper"-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <view class="pictrue">-->
|
|
|
+<!-- <image :src="item.image"></image>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- <view class="item-info">-->
|
|
|
+<!-- <view class="text">-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="line1"-->
|
|
|
+<!-- :class="item.attrStatus ? '' : 'reColor'"-->
|
|
|
+<!-- >{{ item.storeName }}-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- <view class="attribute-box infor line1">-->
|
|
|
+<!-- <view class="attribute-suk" v-show="item.suk">属性:{{ item.suk }}</view>-->
|
|
|
+<!-- <view v-show="!item.attrStatus" class="invalid-count">数量:{{ item.cartNum }}</view>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- <view class="labor-costs line1" v-if="item.attrStatus"-->
|
|
|
+<!-- >工费:{{ item.price }}/克</view-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <view class="money" v-if="item.attrStatus"-->
|
|
|
+<!-- >¥{{ item.storePrice }}</view-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <!– <view class='money' v-if="item.attrStatus">¥{{item.truePrice}}</view> –>-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="reElection acea-row row-between-wrapper"-->
|
|
|
+<!-- v-else-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <view class="title">请重新选择商品规格</view>-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="reBnt cart-color acea-row row-center-wrapper"-->
|
|
|
+<!-- @click.stop="reElection(item)"-->
|
|
|
+<!-- >重选-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="carnum acea-row row-center-wrapper"-->
|
|
|
+<!-- v-if="item.attrStatus"-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="reduce"-->
|
|
|
+<!-- :class="item.numSub ? 'on' : ''"-->
|
|
|
+<!-- @click.stop="subCart(index)"-->
|
|
|
+<!-- >-</view-->
|
|
|
+<!-- >-->
|
|
|
+<!-- <view class="num">{{ item.cartNum }}</view>-->
|
|
|
+<!-- <view-->
|
|
|
+<!-- class="plus"-->
|
|
|
+<!-- :class="item.numAdd ? 'on' : ''"-->
|
|
|
+<!-- @click.stop="addCart(index)"-->
|
|
|
+<!-- >+</view-->
|
|
|
+<!-- >-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </navigator>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </block>-->
|
|
|
+<!-- </up-checkbox-group>-->
|
|
|
+<!-- </view>-->
|
|
|
<!-- cartList.valid.length===0 && cartList.invalid.length > 0 -->
|
|
|
<view
|
|
|
v-if="cartList.invalid.length > 0"
|
|
|
@@ -190,17 +293,18 @@
|
|
|
<up-checkbox-group shape="circle" @change="checkboxAllChange">
|
|
|
<!-- <checkbox value="all" :checked="!!isAllSelect" /> -->
|
|
|
<up-checkbox
|
|
|
- activeColor="#E93323"
|
|
|
+ activeColor="#F8C008"
|
|
|
:checked="!!isAllSelect"
|
|
|
></up-checkbox>
|
|
|
<text class="checkAll">全选({{ selectValue.length }})</text>
|
|
|
</up-checkbox-group>
|
|
|
</view>
|
|
|
<view class="money acea-row row-middle" v-if="footerswitch == true">
|
|
|
+ <text style="font-size: 24rpx;color: #333;">合计:</text>
|
|
|
<text class="font-color">¥{{ selectCountPrice }}</text>
|
|
|
<form @submit="subOrder" report-submit="true">
|
|
|
<button class="placeOrder bg-color" formType="submit">
|
|
|
- 立即下单
|
|
|
+ 结算
|
|
|
</button>
|
|
|
</form>
|
|
|
</view>
|
|
|
@@ -238,7 +342,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { ref, reactive, computed } from "vue";
|
|
|
+import { ref, reactive, computed,watch } from "vue";
|
|
|
import { onLoad, onShow, onReachBottom } from "@dcloudio/uni-app";
|
|
|
import { useAppStore } from "@/stores/app.js";
|
|
|
import {
|
|
|
@@ -347,10 +451,71 @@ onReachBottom(() => {
|
|
|
}
|
|
|
});
|
|
|
|
|
|
+// 计算属性:按商家分组购物车商品
|
|
|
+const groupedCartList = computed(() => {
|
|
|
+ const groups = {};
|
|
|
+
|
|
|
+ cartList.valid.forEach(item => {
|
|
|
+ const merchant = item.sbMerchant;
|
|
|
+ if (merchant && merchant.id) {
|
|
|
+ const merchantId = merchant.id;
|
|
|
+
|
|
|
+ if (!groups[merchantId]) {
|
|
|
+ groups[merchantId] = {
|
|
|
+ id: merchantId,
|
|
|
+ name: merchant.merchantName || '未知商家',
|
|
|
+ logo: merchant.merchantLogo || '/static/images/default-store.png',
|
|
|
+ products: []
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+ groups[merchantId].products.push(item);
|
|
|
+ } else {
|
|
|
+ // 如果没有商家信息,放到默认分组
|
|
|
+ const defaultId = 'default';
|
|
|
+ if (!groups[defaultId]) {
|
|
|
+ groups[defaultId] = {
|
|
|
+ id: defaultId,
|
|
|
+ name: '其他商家',
|
|
|
+ logo: '/static/images/default-store.png',
|
|
|
+ products: []
|
|
|
+ };
|
|
|
+ }
|
|
|
+ groups[defaultId].products.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ return Object.values(groups);
|
|
|
+});
|
|
|
+
|
|
|
const orderGoodsCount = computed(() => {
|
|
|
// console.log('fsdfsdfsd', cartList, cartList)
|
|
|
return cartList.valid.length + cartList.invalid.length;
|
|
|
});
|
|
|
+// 监听购物车数据变化,重新计算选中状态
|
|
|
+watch(() => cartList.valid, (newVal) => {
|
|
|
+ calculateSelectStatus();
|
|
|
+}, { deep: true });
|
|
|
+
|
|
|
+// 重新计算选中状态
|
|
|
+function calculateSelectStatus() {
|
|
|
+ const validList = cartList.valid;
|
|
|
+ const selectValueArr = selectValue.value;
|
|
|
+ let checkedCount = 0;
|
|
|
+ let totalValidCount = 0;
|
|
|
+
|
|
|
+ validList.forEach(item => {
|
|
|
+ if (item.attrStatus) {
|
|
|
+ totalValidCount++;
|
|
|
+ if (selectValueArr.includes(item.id)) {
|
|
|
+ checkedCount++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ isAllSelect.value = totalValidCount > 0 && checkedCount === totalValidCount;
|
|
|
+ switchSelect();
|
|
|
+}
|
|
|
|
|
|
const closeProductPopup = () => {
|
|
|
showProductPopup.value = false;
|
|
|
@@ -628,62 +793,62 @@ function checkboxAllChange(value) {
|
|
|
function setAllSelectValue(status) {
|
|
|
const valid = cartList.valid;
|
|
|
let selectValueArr = [];
|
|
|
- if (valid.length > 0) {
|
|
|
- let newValid = valid.map((item) => {
|
|
|
- if (status) {
|
|
|
- if (footerswitch.value) {
|
|
|
- if (item.attrStatus) {
|
|
|
- item.checked = true;
|
|
|
- selectValueArr.push(item.id);
|
|
|
- } else {
|
|
|
- item.checked = false;
|
|
|
- }
|
|
|
- } else {
|
|
|
+
|
|
|
+ valid.forEach(item => {
|
|
|
+ if (status) {
|
|
|
+ if (footerswitch.value) {
|
|
|
+ if (item.attrStatus) {
|
|
|
item.checked = true;
|
|
|
selectValueArr.push(item.id);
|
|
|
+ } else {
|
|
|
+ item.checked = false;
|
|
|
}
|
|
|
- isAllSelect.value = true;
|
|
|
} else {
|
|
|
- item.checked = false;
|
|
|
- isAllSelect.value = false;
|
|
|
+ item.checked = true;
|
|
|
+ selectValueArr.push(item.id);
|
|
|
}
|
|
|
- return item;
|
|
|
- });
|
|
|
- cartList.valid = newValid;
|
|
|
- selectValue.value = selectValueArr;
|
|
|
- switchSelect();
|
|
|
- }
|
|
|
+ } else {
|
|
|
+ item.checked = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ cartList.valid = [...valid];
|
|
|
+ selectValue.value = selectValueArr;
|
|
|
+ isAllSelect.value = status === 1;
|
|
|
+ switchSelect();
|
|
|
}
|
|
|
|
|
|
function checkboxChange(value) {
|
|
|
const valid = cartList.valid;
|
|
|
- let arr1 = [];
|
|
|
- let arr2 = [];
|
|
|
- let arr3 = [];
|
|
|
- let newValid = valid.map((item) => {
|
|
|
- if (inArray(item.id, value)) {
|
|
|
+ let checkedItems = [];
|
|
|
+ let uncheckedItems = [];
|
|
|
+ let invalidItems = [];
|
|
|
+
|
|
|
+ valid.forEach(item => {
|
|
|
+ if (value.includes(item.id)) {
|
|
|
if (footerswitch.value) {
|
|
|
if (item.attrStatus) {
|
|
|
item.checked = true;
|
|
|
- arr1.push(item);
|
|
|
+ checkedItems.push(item);
|
|
|
} else {
|
|
|
item.checked = false;
|
|
|
}
|
|
|
} else {
|
|
|
item.checked = true;
|
|
|
- arr1.push(item);
|
|
|
+ checkedItems.push(item);
|
|
|
}
|
|
|
} else {
|
|
|
item.checked = false;
|
|
|
- arr2.push(item);
|
|
|
+ uncheckedItems.push(item);
|
|
|
}
|
|
|
- return item;
|
|
|
});
|
|
|
+
|
|
|
if (footerswitch.value) {
|
|
|
- arr3 = arr2.filter((item) => !item.attrStatus);
|
|
|
+ invalidItems = uncheckedItems.filter(item => !item.attrStatus);
|
|
|
}
|
|
|
- cartList.valid = newValid;
|
|
|
- isAllSelect.value = newValid.length === arr1.length + arr3.length;
|
|
|
+
|
|
|
+ cartList.valid = [...valid];
|
|
|
+ isAllSelect.value = valid.length === checkedItems.length + invalidItems.length;
|
|
|
selectValue.value = value;
|
|
|
switchSelect();
|
|
|
}
|
|
|
@@ -1054,7 +1219,12 @@ function unsetCart() {
|
|
|
width: 396rpx;
|
|
|
font-size: 28rpx;
|
|
|
color: #282828;
|
|
|
-
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ .storeName{
|
|
|
+ width: 70%;
|
|
|
+ }
|
|
|
.reColor {
|
|
|
color: #999;
|
|
|
}
|
|
|
@@ -1213,7 +1383,7 @@ function unsetCart() {
|
|
|
.footer {
|
|
|
z-index: 9;
|
|
|
width: 100%;
|
|
|
- height: 100rpx;
|
|
|
+ height: 132rpx;
|
|
|
background-color: #fff;
|
|
|
position: fixed;
|
|
|
padding: 0 24rpx;
|
|
|
@@ -1221,9 +1391,11 @@ function unsetCart() {
|
|
|
border-top: 1rpx solid #eee;
|
|
|
bottom: 0;
|
|
|
|
|
|
+
|
|
|
.checkAll {
|
|
|
font-size: 28rpx;
|
|
|
- color: #282828;
|
|
|
+ line-height: 56rpx;
|
|
|
+ color: #333333;
|
|
|
margin-left: 14rpx;
|
|
|
}
|
|
|
.money {
|
|
|
@@ -1233,13 +1405,13 @@ function unsetCart() {
|
|
|
}
|
|
|
}
|
|
|
.placeOrder {
|
|
|
- color: #fff;
|
|
|
- font-size: 30rpx;
|
|
|
- width: 226rpx;
|
|
|
- height: 70rpx;
|
|
|
- border-radius: 50rpx;
|
|
|
+ color: #333;
|
|
|
+ font-size: 32rpx;
|
|
|
+ width: 192rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
text-align: center;
|
|
|
- line-height: 70rpx;
|
|
|
+ line-height: 88rpx;
|
|
|
margin-left: 22rpx;
|
|
|
}
|
|
|
.button {
|
|
|
@@ -1272,10 +1444,62 @@ function unsetCart() {
|
|
|
.uni-p-b-96 {
|
|
|
height: 96rpx;
|
|
|
}
|
|
|
-// .my_nav {
|
|
|
-// top: calc(44px + 88rpx + 50rpx) !important;
|
|
|
-// }
|
|
|
-// .my_nav_top {
|
|
|
-// margin-top: calc(44px + 88rpx + 30rpx + 105rpx) !important;
|
|
|
-// }
|
|
|
+.merchant-groups {
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.merchant-group {
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .merchant-header {
|
|
|
+ padding: 24rpx;
|
|
|
+
|
|
|
+ .merchant-info {
|
|
|
+ .merchant-logo {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .merchant-name {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .merchant-action {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #999;
|
|
|
+ font-size: 24rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ margin-right: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .merchant-products {
|
|
|
+ padding: 0 24rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 调整商品项样式以适应分组布局
|
|
|
+.item {
|
|
|
+ padding: 24rpx 0;
|
|
|
+ border-bottom: 1rpx solid #f5f5f5;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 其他原有样式保持不变
|
|
|
+.cartBox {
|
|
|
+ margin-top: 20rpx;
|
|
|
+}
|
|
|
</style>
|