Browse Source

购物车

zhaoxiaohai 2 years ago
parent
commit
20b6ad7f80

+ 20 - 0
packageA/shopping/float/index.js

@@ -0,0 +1,20 @@
+const _Http = getApp().globalData.http;
+Component({
+  data: {
+    num: 0,
+  },
+  methods: {
+    /* 去购物车 */
+    toShopping() {
+      wx.navigateTo({
+        url: '/packageA/shopping/index',
+      })
+    },
+    /* 设置数量 */
+    setNum(num) {
+      this.setData({
+        num
+      })
+    }
+  }
+})

+ 4 - 0
packageA/shopping/float/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

+ 13 - 0
packageA/shopping/float/index.scss

@@ -0,0 +1,13 @@
+.corner-mark {
+	position: absolute;
+	display: inline-block;
+	height: 28rpx;
+	font-size: 20rpx;
+	color: #FFFFFF;
+	background-color: red;
+	padding: 0 10rpx;
+	border-radius: 14rpx;
+	top: -45rpx;
+	left: 0rpx;
+	z-index: 9999;
+}

+ 6 - 0
packageA/shopping/float/index.wxml

@@ -0,0 +1,6 @@
+<Yl_FloatingButton useSlot bindtap="toShopping">
+	<view>
+		<text class="corner-mark" wx:if="{{num>0}}">{{num}}</text>
+		<image style="width: 160rpx; height: 160rpx; transform: translate(-50%,-50%);" src='/static/image/shopping.png' data-title="新建线索" />
+	</view>
+</Yl_FloatingButton>

+ 147 - 14
packageA/shopping/index.js

@@ -1,16 +1,149 @@
+const _Http = getApp().globalData.http;
+let downCount = {};
 Page({
-  data: {
-    isAll: true,
-  },
-  onLoad(options) {
-
-  },
-  changeAll() {
-    this.setData({
-      isAll: !this.data.isAll
-    })
-  },
-  onReady() {
-
-  },
+    data: {
+        loading: true,
+        list: [],
+        results: [], //选中结果
+        sa_brandid: null, //当前选中品牌id
+        sum: 0, //价格合
+        yfsum: 0, //运费合
+    },
+    onLoad(options) {
+        this.getList()
+    },
+    /* 提交 */
+    submit() {
+        console.log("提交订单")
+    },
+    /* 获取列表 */
+    getList() {
+        _Http.basic({
+            "id": 20220924095302,
+            "content": {
+                nocache: true,
+                "pageNumber": 1,
+                "pageSize": getApp().globalData.num + 5,
+                "where": {
+                    "condition": ""
+                }
+            }
+        }).then(res => {
+            console.log('购物车列表', res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.msg,
+                icon: "none"
+            })
+            this.setData({
+                list: res.data,
+                loading: false
+            });
+            if (wx.getStorageSync('shopping')) {
+                this.setData({
+                    ...wx.getStorageSync('shopping')
+                })
+                this.computeSum();
+            }
+        })
+    },
+    /* 切换选中项 */
+    changeResults(e, my = false) {
+        const {
+            item
+        } = my ? e : e.currentTarget.dataset;
+        let results = this.data.results,
+            sa_brandid = this.data.sa_brandid;
+        if (sa_brandid && sa_brandid != item.sa_brandid) return;
+        if (results.length == 0) {
+            results.push(item.sa_shoppingcartid);
+            sa_brandid = item.sa_brandid;
+        } else {
+            let index = results.findIndex(v => v == item.sa_shoppingcartid)
+            if (index == -1) {
+                results.push(item.sa_shoppingcartid);
+            } else {
+                results.splice(index, 1);
+                if (results.length == 0) sa_brandid = null;
+            }
+        };
+        this.setData({
+            results,
+            sa_brandid
+        })
+        this.computeSum();
+    },
+    /* 计算总价 */
+    computeSum() {
+        let results = this.data.results,
+            sum = 0,
+            yfsum = 0,
+            deteleList = [];
+        if (results.length) results.forEach((v, i) => {
+            let item = this.data.list.find(va => va.sa_shoppingcartid == v);
+            if (item) {
+                sum += (item.qty * item.gradeprice).toFixed(2) - 0;
+            } else {
+                deteleList.push(i)
+            }
+        });
+        if (deteleList.length) deteleList.forEach(v => {
+            results.splice(v, 1);
+        });
+        wx.setStorageSync('shopping', {
+            results,
+            sa_brandid: this.data.sa_brandid
+        })
+        this.setData({
+            sum,
+            yfsum,
+            results
+        })
+    },
+    /* 删除产品 */
+    deteleItem(e) {
+        const {
+            item
+        } = e.currentTarget.dataset;
+        _Http.basic({
+            "id": 20220924095202,
+            "content": {
+                "sa_shoppingcartids": [item.sa_shoppingcartid]
+            }
+        }).then(res => {
+            if (res.msg != '成功') return wx.showToast({
+                title: res.msg,
+                icon: "none"
+            });
+            this.setData({
+                list: this.data.list.filter(v => v.sa_shoppingcartid != item.sa_shoppingcartid)
+            })
+            if (this.data.results.some(v => v == item.sa_shoppingcartid)) this.changeResults({
+                item
+            }, true);
+        })
+    },
+    /* 步进器调整 */
+    stepperChange(e) {
+        const {
+            index
+        } = e.currentTarget.dataset;
+        let item = this.data.list[index];
+        item.qty = e.detail;
+        this.setData({
+            [`list[${index}]`]: item
+        })
+        this.computeSum();
+        clearTimeout(downCount['count' + index])
+        downCount['count' + index] = setTimeout(() => {
+            _Http.basic({
+                "id": 20220924104302,
+                "content": {
+                    "sa_shoppingcartid": item.sa_shoppingcartid,
+                    "qty": item.qty
+                },
+            }, false).then(res => {
+                console.log("修改数量", res)
+            })
+        }, 2000)
+    },
 })

+ 4 - 3
packageA/shopping/index.json

@@ -1,5 +1,6 @@
 {
-  "usingComponents": {
-    "van-checkbox": "@vant/weapp/checkbox/index"
-  }
+    "usingComponents": {
+        "van-checkbox": "@vant/weapp/checkbox/index",
+        "van-stepper": "@vant/weapp/stepper/index"
+    }
 }

+ 146 - 44
packageA/shopping/index.scss

@@ -1,46 +1,148 @@
+@import "./index.skeleton.wxss";
+
+.item-box {
+    position: relative;
+    width: 100vw;
+    background-color: #fff;
+    margin-bottom: 20rpx;
+    padding-bottom: 20rpx;
+    box-sizing: border-box;
+
+    .top {
+        display: flex;
+        padding: 20rpx 30rpx 10rpx;
+        box-sizing: border-box;
+
+
+        .image {
+            width: 128rpx;
+            height: 128rpx;
+            border-radius: 16rpx;
+            overflow: hidden;
+            margin-right: 20rpx;
+            flex-shrink: 0;
+        }
+
+        .content {
+            flex: 1;
+
+            .title {
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                height: 40rpx;
+
+                .line-1 {
+                    display: block;
+                    width: 500rpx;
+                    font-size: 28rpx;
+                    font-family: PingFang SC-Semibold, PingFang SC;
+                    font-weight: 600;
+                    color: #333333;
+                }
+
+                .iconfont {
+                    position: absolute;
+                    width: 60rpx;
+                    height: 60rpx;
+                    line-height: 60rpx;
+                    right: 0;
+                    flex-shrink: 0;
+                }
+            }
+
+            .exp {
+                height: 34rpx;
+                line-height: 34rpx;
+                font-size: 24rpx;
+                font-family: PingFang SC-Regular, PingFang SC;
+                color: #999999;
+                margin-top: 8rpx;
+            }
+
+        }
+
+    }
+
+    .bottom {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: 58rpx;
+        padding: 0 30rpx;
+        box-sizing: border-box;
+        margin-top: 12rpx;
+
+        .check {
+            display: flex;
+            align-items: center;
+            height: 100%;
+            width: 150rpx;
+
+            .label-class {
+                font-size: 24rpx;
+                font-family: PingFang SC-Regular, PingFang SC;
+                color: #999999;
+                margin-left: -6rpx;
+            }
+        }
+
+        .input-class {
+            width: 120rpx;
+        }
+    }
+}
+
 .footer {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	position: fixed;
-	bottom: 0;
-	width: 100vw;
-	min-height: 243rpx;
-	background-color: #fff;
-	box-shadow: rgba(0, 0, 0, 0.15) 0px 5rpx 15rpx 0px;
-
-	.view {
-		display: flex;
-		height: 82rpx;
-		width: 690rpx;
-		margin: 20rpx 0 10rpx;
-
-		.left {
-			width: 150rpx;
-			height: 60rpx;
-			font-size: 24rpx;
-			font-family: PingFang SC-Regular, PingFang SC;
-			color: #333333;
-
-			.check {
-				margin-left: -10rpx !important;
-			}
-		}
-
-		.right {
-			flex: 1;
-			background-color: blue;
-		}
-	}
-
-	.but {
-		width: 690rpx;
-		height: 90rpx;
-		background: #3874F6;
-		border-radius: 16rpx;
-		font-size: 28rpx;
-		font-weight: 600;
-		color: #FFFFFF;
-		margin-top: 10rpx;
-	}
+    width: 100vw;
+    min-height: 130rpx;
+    position: fixed;
+    bottom: 0;
+    display: flex;
+    justify-content: space-between;
+    padding: 0 30rpx;
+    box-sizing: border-box;
+    background-color: #fff;
+    box-shadow: rgba(0, 0, 0, 0.15) 0px 5rpx 15rpx 0px;
+
+    .left {
+        flex: 1;
+        color: #333333;
+
+        .sum {
+            height: 40rpx;
+            line-height: 40rpx;
+            font-size: 28rpx;
+            font-family: PingFang SC-Medium, PingFang SC;
+            font-weight: 500;
+            margin-top: 14rpx;
+
+            text {
+                color: #FF3B30;
+            }
+        }
+
+        .transport {
+            height: 34rpx;
+            line-height: 34rpx;
+            font-size: 24rpx;
+            font-family: PingFang SC-Regular, PingFang SC;
+            margin-top: 8rpx;
+
+            text {
+                color: #FF3B30;
+            }
+        }
+    }
+
+    .but {
+        width: 230rpx;
+        height: 90rpx;
+        background: #3874F6;
+        border-radius: 16rpx;
+        font-size: 28rpx;
+        font-weight: 600;
+        color: #FFFFFF;
+        margin-top: 10rpx;
+    }
 }

+ 160 - 0
packageA/shopping/index.skeleton.wxml

@@ -0,0 +1,160 @@
+<!--
+此文件为开发者工具生成,生成时间: 2022/12/27上午10:10:10
+使用方法:
+在 E:\云链项目\e-wechat\packageA\shopping\index.wxml 引入模板
+
+```
+<import src="index.skeleton.wxml"/>
+<template is="skeleton" wx:if="{{loading}}" />
+```
+
+在 E:\云链项目\e-wechat\packageA\shopping\index.wxss 中引入样式
+```
+@import "./index.skeleton.wxss";
+```
+
+更多详细信息可以参考文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
+-->
+<template name="skeleton">
+  <view class="sk-container">
+    <view class="item-box">
+      <navigator class="top">
+        <view class="image">
+          <view is="miniprogram_npm/@vant/weapp/image/index">
+            <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+              <image class="van-image__img image-index--van-image__img sk-image" mode="aspectFill" lazy-load="true"></image>
+            </view>
+          </view>
+        </view>
+        <view class="content">
+          <view class="title">
+            <text class="line-1 sk-transparent sk-text-14-2857-29 sk-text">测试新增</text>
+            <text class="iconfont icon-guanlian-shanchu sk-pseudo sk-pseudo-circle" data-item="[object Object]"></text>
+          </view>
+          <view class="exp sk-transparent sk-text-14-7059-638 sk-text">编号:150</view>
+          <view class="exp sk-transparent sk-text-14-7059-603 sk-text">规格:450*560*850</view>
+          <view class="exp sk-transparent sk-text-14-7059-166 sk-text">型号:S</view>
+          <view class="exp sk-transparent sk-text-14-7059-252 sk-text">品牌:班尼戈</view>
+          <view class="exp sk-transparent">
+            <text style="font-size: 12px;font-weight: 600;color: #FF3B30;" class="sk-transparent sk-text-14-7059-876 sk-text">¥10</text>/
+            <text style="font-size: 10px;" class="sk-transparent sk-text-20-5882-958 sk-text">¥10</text>
+          </view>
+        </view>
+      </navigator>
+      <view class="bottom">
+        <view class="check" data-item="[object Object]">
+          <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+            <view class="van-checkbox checkbox-index--van-checkbox ">
+              <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:12px">
+                  <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                </view>
+              </view>
+              <view class="label-class van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right sk-transparent sk-text-20-0000-847 sk-text">
+                选中
+              </view>
+            </view>
+          </view>
+        </view>
+        <view is="miniprogram_npm/@vant/weapp/stepper/index" data-index="0">
+          <view class="van-stepper stepper-index--van-stepper ">
+            <view class="van-stepper__minus stepper-index--van-stepper__minus sk-pseudo sk-pseudo-circle" data-type="minus" hover-class="van-stepper__minus--hover" hover-stay-time="70" style="true"></view>
+            <view class="input-class van-stepper__input stepper-index--van-stepper__input sk-image" style="true" type="digit" value="6"></view>
+            <view class="van-stepper__plus stepper-index--van-stepper__plus sk-pseudo sk-pseudo-circle" data-type="plus" hover-class="van-stepper__plus--hover" hover-stay-time="70" style="true"></view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="item-box">
+      <navigator class="top">
+        <view class="image">
+          <view is="miniprogram_npm/@vant/weapp/image/index">
+            <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+              <image class="van-image__img image-index--van-image__img sk-image" mode="aspectFill" lazy-load="true"></image>
+            </view>
+          </view>
+        </view>
+        <view class="content">
+          <view class="title">
+            <text class="line-1 sk-transparent sk-text-14-2857-82 sk-text">暖通复合管</text>
+            <text class="iconfont icon-guanlian-shanchu sk-pseudo sk-pseudo-circle" data-item="[object Object]"></text>
+          </view>
+          <view class="exp sk-transparent sk-text-14-7059-418 sk-text">编号:NBNTO-28571530003</view>
+          <view class="exp sk-transparent sk-text-14-7059-634 sk-text">规格:22 * 1.5</view>
+          <view class="exp sk-transparent sk-text-14-7059-308 sk-text">型号:DN20</view>
+          <view class="exp sk-transparent sk-text-14-7059-314 sk-text">品牌:班尼戈</view>
+          <view class="exp sk-transparent">
+            <text style="font-size: 12px;font-weight: 600;color: #FF3B30;" class="sk-transparent sk-text-14-7059-281 sk-text">¥0</text>/
+            <text style="font-size: 10px;" class="sk-transparent sk-text-20-5882-460 sk-text">¥0</text>
+          </view>
+        </view>
+      </navigator>
+      <view class="bottom">
+        <view class="check" data-item="[object Object]">
+          <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+            <view class="van-checkbox checkbox-index--van-checkbox ">
+              <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:12px">
+                  <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                </view>
+              </view>
+              <view class="label-class van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right sk-transparent sk-text-20-0000-174 sk-text">
+                选中
+              </view>
+            </view>
+          </view>
+        </view>
+        <view is="miniprogram_npm/@vant/weapp/stepper/index" data-index="1">
+          <view class="van-stepper stepper-index--van-stepper ">
+            <view class="van-stepper__minus stepper-index--van-stepper__minus sk-pseudo sk-pseudo-circle" data-type="minus" hover-class="van-stepper__minus--hover" hover-stay-time="70" style="true"></view>
+            <view class="input-class van-stepper__input stepper-index--van-stepper__input sk-image" style="true" type="digit" value="5"></view>
+            <view class="van-stepper__plus stepper-index--van-stepper__plus sk-pseudo sk-pseudo-circle" data-type="plus" hover-class="van-stepper__plus--hover" hover-stay-time="70" style="true"></view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="item-box">
+      <navigator class="top">
+        <view class="image">
+          <view is="miniprogram_npm/@vant/weapp/image/index">
+            <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+              <image class="van-image__img image-index--van-image__img sk-image" mode="aspectFill" lazy-load="true"></image>
+            </view>
+          </view>
+        </view>
+        <view class="content">
+          <view class="title">
+            <text class="line-1 sk-transparent sk-text-14-2857-437 sk-text">暖通复合管</text>
+            <text class="iconfont icon-guanlian-shanchu sk-pseudo sk-pseudo-circle" data-item="[object Object]"></text>
+          </view>
+          <view class="exp sk-transparent sk-text-14-7059-392 sk-text">编号:NBNTO-28571530003</view>
+          <view class="exp sk-transparent sk-text-14-7059-944 sk-text">规格:22 * 1.5</view>
+          <view class="exp sk-transparent sk-text-14-7059-388 sk-text">型号:DN20</view>
+          <view class="exp sk-transparent sk-text-14-7059-677 sk-text">品牌:班尼戈</view>
+          <view class="exp sk-transparent">
+            <text style="font-size: 12px;font-weight: 600;color: #FF3B30;" class="sk-transparent sk-text-14-7059-876 sk-text">¥0</text>/
+            <text style="font-size: 10px;" class="sk-transparent sk-text-20-5882-740 sk-text">¥0</text>
+          </view>
+        </view>
+      </navigator>
+    </view>
+    <view class="footer">
+      <view class="left">
+        <view class="sum sk-transparent">
+          商品合计:
+          <text class="sk-transparent sk-text-15-0000-373 sk-text">¥43534534</text>
+        </view>
+        <view class="transport sk-transparent">
+          运费(预估):
+          <text class="sk-transparent sk-text-14-7059-783 sk-text">¥324</text>
+        </view>
+      </view>
+      <view is="miniprogram_npm/@vant/weapp/button/index">
+        <button app-parameter="true" business-id="true" class="but van-button button-index--van-button van-button--default button-index--van-button--default van-button--normal button-index--van-button--normal sk-button sk-pseudo sk-pseudo-circle" data-detail="null"
+          form-type="true" hover-class="van-button--active hover-class" lang="true" open-type="true" send-message-img="true" send-message-path="true" send-message-title="true" session-from="true" style="true">
+          <view class="van-button__text button-index--van-button__text sk-transparent sk-text-15-0000-582 sk-text" style="background-position-x: 50%;">生成订单</view>
+        </button>
+      </view>
+    </view>
+  </view>
+</template>

+ 215 - 0
packageA/shopping/index.skeleton.wxss

@@ -0,0 +1,215 @@
+/*
+此文件为开发者工具生成,生成时间: 2022/12/27上午10:10:10
+
+在 E:\云链项目\e-wechat\packageA\shopping\index.wxss 中引入样式
+```
+@import "./index.skeleton.wxss";
+```
+
+更多详细信息可以参考文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
+*/
+.sk-transparent {
+    color: transparent !important;
+  }
+.sk-text-14-2857-29 {
+    background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
+    background-size: 100% 39.2000rpx;
+    position: relative !important;
+  }
+.sk-text {
+    background-origin: content-box !important;
+    background-clip: content-box !important;
+    background-color: transparent !important;
+    color: transparent !important;
+    background-repeat: repeat-y !important;
+  }
+.sk-text-14-7059-638 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-603 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-166 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-252 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-876 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-5882-958 {
+    background-image: linear-gradient(transparent 20.5882%, #EEEEEE 0%, #EEEEEE 79.4118%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-0000-847 {
+    background-image: linear-gradient(transparent 20.0000%, #EEEEEE 0%, #EEEEEE 80.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-2857-82 {
+    background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
+    background-size: 100% 39.2000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-418 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-634 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-308 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-314 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-281 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-5882-460 {
+    background-image: linear-gradient(transparent 20.5882%, #EEEEEE 0%, #EEEEEE 79.4118%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-0000-174 {
+    background-image: linear-gradient(transparent 20.0000%, #EEEEEE 0%, #EEEEEE 80.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-2857-596 {
+    background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
+    background-size: 100% 39.2000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-810 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-884 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-55 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-259 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-195 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-5882-508 {
+    background-image: linear-gradient(transparent 20.5882%, #EEEEEE 0%, #EEEEEE 79.4118%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-0000-229 {
+    background-image: linear-gradient(transparent 20.0000%, #EEEEEE 0%, #EEEEEE 80.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-2857-437 {
+    background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
+    background-size: 100% 39.2000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-392 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-944 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-388 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-677 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-20-5882-740 {
+    background-image: linear-gradient(transparent 20.5882%, #EEEEEE 0%, #EEEEEE 79.4118%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-373 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-783 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-582 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-button {
+    color: #EFEFEF !important;
+    background: #EFEFEF !important;
+    border: none !important;
+    box-shadow: none !important;
+  }
+.sk-image {
+    background: #EFEFEF !important;
+  }
+.sk-pseudo::before, .sk-pseudo::after {
+      background: #EFEFEF !important;
+      background-image: none !important;
+      color: transparent !important;
+      border-color: transparent !important;
+    }
+.sk-pseudo-rect::before, .sk-pseudo-rect::after {
+      border-radius: 0 !important;
+    }
+.sk-pseudo-circle::before, .sk-pseudo-circle::after {
+      border-radius: 50% !important;
+    }
+.sk-container {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    background-color: transparent;
+  }

+ 51 - 13
packageA/shopping/index.wxml

@@ -1,18 +1,56 @@
-<!--packageA/shopping/index.wxml-->
-<text>packageA/shopping/index.wxml</text>
-
+<import src="index.skeleton.wxml" />
+<template is="skeleton" wx:if="{{loading}}" />
 
+<navigator url="#" wx:for="{{list}}" wx:key="item.itemid" class="item-box" bindtap="changeResults" data-item="{{item}}">
+    <view class="top">
+        <view class="image">
+            <van-image width="100%" height="100%" fit="cover" src="{{item.attinfos[0].subfiles[0].url}}" use-loading-slot use-error-slot lazy-load>
+                <van-loading slot="loading" type="spinner" size="20" vertical />
+                <text slot="error">加载失败</text>
+            </van-image>
+        </view>
+        <view class="content">
+            <view class="title">
+                <text class="line-1">{{item.itemname}}</text>
+                <text class="iconfont icon-guanlian-shanchu" catchtap="deteleItem" data-item="{{item}}" />
+            </view>
+            <view class="exp">编号:{{item.itemno}}</view>
+            <view class="exp">规格:{{item.spec}}</view>
+            <view class="exp">型号:{{item.model}}</view>
+            <view class="exp">品牌:{{item.brandname}}</view>
+            <view class="exp"><text style="font-size: 24rpx;font-weight: 600;color: #FF3B30;">¥{{item.gradeprice}}</text>/<text style="font-size: 20rpx;">¥{{item.oldprice}}</text></view>
+        </view>
+    </view>
+    <view class="bottom">
+        <view class="check">
+            <van-checkbox shape='square' disabled="{{sa_brandid && sa_brandid!=item.sa_brandid}}" icon-size='24rpx' label-class='label-class' value="{{ decide.checked(item.sa_shoppingcartid,results) }}" bind:change="onChange">
+                选中
+            </van-checkbox>
+        </view>
+        <van-stepper value="{{ item.qty }}" input-class='input-class' data-index="{{index}}" bind:change="stepperChange" />
+    </view>
+</navigator>
 
 <!-- 底部 -->
-<view style="height: 150rpx;" />
+<view style="height: 130rpx;" />
 <view class="footer">
-	<view class="view">
-		<view class="left" bindtap="changeAll">
-			<van-checkbox value="{{ isAll }}" label-class='check' shape='square' icon-size='28rpx' checked-color="var(--assist)">{{isAll?'取消全选':'全选'}}</van-checkbox>
-		</view>
-		<view class="right">
+    <view class="left">
+        <view class="sum">
+            商品合计:<text>¥{{sum}}</text>
+        </view>
+        <view class="transport">
+            运费(预估):<text>¥{{yfsum}}</text>
+        </view>
+    </view>
+    <van-button custom-class='but' disabled='{{!results.length}}' bind:click="submit">生成订单</van-button>
+</view>
 
-		</view>
-	</view>
-	<van-button custom-class='but' bindtap="storage">生成订单</van-button>
-</view>
+<wxs module="decide">
+    module.exports = {
+        checked: function (id, list) {
+            return list.some(function (v) {
+                return v == id
+            });
+        }
+    }
+</wxs>