58

src/components/CardCase.vue

@@ -30,9 +30,9 @@
                 </div>
             </div>
 
-            <div class="bottom">
-                <span>已选{{ chooseIds.length }}包，共{{ money }}元，邮费10元</span>
-                <van-button type="primary">确认购买</van-button>
+            <div class="van-btn">
+                <span class="van-cat">已选{{ chooseIds.length }}包，共{{ money }}元，邮费10元</span>
+                <div class="van-buy" type="primary">确认购买</div>
             </div>
         </div>
     </van-popup>
@@ -83,417 +83,8 @@ export default {
     },
     data() {
         return {
-            show: true,
-            list: [
-                [
-                    {
-                        id: 236,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:47'
-                    },
-                    {
-                        id: 237,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:47'
-                    },
-                    {
-                        id: 238,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    },
-                    {
-                        id: 239,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    },
-                    {
-                        id: 240,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    },
-                    {
-                        id: 241,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '4组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    }
-                ],
-                [
-                    {
-                        id: 230,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:46'
-                    },
-                    {
-                        id: 231,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:46'
-                    },
-                    {
-                        id: 232,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:46'
-                    },
-                    {
-                        id: 233,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:47'
-                    },
-                    {
-                        id: 234,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:47'
-                    },
-                    {
-                        id: 235,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '3组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:47'
-                    }
-                ],
-                [
-                    {
-                        id: 224,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:45'
-                    },
-                    {
-                        id: 225,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:45'
-                    },
-                    {
-                        id: 226,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:45'
-                    },
-                    {
-                        id: 227,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:45'
-                    },
-                    {
-                        id: 228,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:46'
-                    },
-                    {
-                        id: 229,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '2组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:46'
-                    }
-                ],
-                [
-                    {
-                        id: 218,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:43'
-                    },
-                    {
-                        id: 219,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:44'
-                    },
-                    {
-                        id: 220,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:44'
-                    },
-                    {
-                        id: 221,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:44'
-                    },
-                    {
-                        id: 222,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:44'
-                    },
-                    {
-                        id: 223,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '1组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:45'
-                    }
-                ],
-                [
-                    {
-                        id: 248,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 249,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 250,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 251,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:50'
-                    },
-                    {
-                        id: 252,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:50'
-                    },
-                    {
-                        id: 253,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '6组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:50'
-                    }
-                ],
-                [
-                    {
-                        id: 242,
-                        del: false,
-                        boxCode: '1号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    },
-                    {
-                        id: 243,
-                        del: false,
-                        boxCode: '2号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:48'
-                    },
-                    {
-                        id: 244,
-                        del: false,
-                        boxCode: '3号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 245,
-                        del: false,
-                        boxCode: '4号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 246,
-                        del: false,
-                        boxCode: '5号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    },
-                    {
-                        id: 247,
-                        del: false,
-                        boxCode: '6号',
-                        groupCode: '5组',
-                        cardCaseId: 217,
-                        boxPrice: 320,
-                        caseStatus: 'WAIT',
-                        money: 320,
-                        createdAt: '2021-05-07 16:07:49'
-                    }
-                ]
-            ]
+            show: false,
+            list: []
         };
     },
     mounted() {
@@ -526,6 +117,32 @@ export default {
 
     padding: 0 20px 0;
     .flex-col();
+    .van-btn {
+        display: flex;
+        .van-cat {
+            width: 237px;
+            height: 48px;
+            background: #ff6c00;
+            opacity: 0.7;
+            border-radius: 12px 0px 0px 12px;
+            font-size: 13px;
+            font-weight: 500;
+            color: #ffffff;
+            text-align: center;
+            line-height: 48px;
+        }
+        .van-buy {
+            width: 98px;
+            height: 48px;
+            background: #ff6c00;
+            border-radius: 0px 12px 12px 0px;
+            font-size: 16px;
+            font-weight: 400;
+            color: #ffffff;
+            text-align: center;
+            line-height: 48px;
+        }
+    }
 }
 
 .content {
@@ -576,7 +193,22 @@ export default {
 }
 
 .card {
-    background-color: @bg;
+    width: 335px;
+    height: 100px;
+    background: #f5f7fa;
+    border-radius: 8px;
+    margin: 10px 0;
+    .card-title {
+        height: 24px;
+        font-size: 14px;
+        font-weight: 400;
+        color: #939599;
+        line-height: 24px;
+        padding: 12px 0 6px 16px;
+    }
+    .card-list {
+        margin-left: 16px;
+    }
     .card-list {
         .flex();
 

src/pages/details.vue

@@ -67,24 +67,6 @@
                 <div>{{ selman ? selman : '请选择卡包' }}</div>
                 <div>></div>
             </div>
-            <van-action-sheet :show="show" title="选择卡包">
-                <!-- <view>选择卡包</view> -->
-                <div class="van-box" @click="alls(item)" v-for="(item, index) in list" :key="index">
-                    <p class="van-box-p">卡包 {{ item[0].boxCode }}</p>
-                    <div class="van-con">
-                        <!-- <div class="van-con-div">{{ item.cardCaseId }}</div>
-                        <div class="van-con-div">{{ item.groupCode }}</div>
-                        <div class="van-con-div">{{ item.cardCaseId }}</div>
-                        <div class="van-con-div">{{ item.cardCaseId }}</div>
-                        <div class="van-con-div">{{ item.cardCaseId }}</div>
-                        <div class="van-con-div">{{ item.cardCaseId }}</div> -->
-                    </div>
-                </div>
-                <div class="van-btn">
-                    <div class="van-cat">已选3包，共970元，邮费10元</div>
-                    <div class="van-buy" @click="buy">确认购买</div>
-                </div>
-            </van-action-sheet>
             <div class="box-footer-con">
                 <div class="box-footer-left">
                     <div>
@@ -401,63 +383,6 @@ export default {
                 margin-left: 46px;
             }
         }
-        .van-box {
-            width: 335px;
-            height: 100px;
-            background: #f5f7fa;
-            border-radius: 8px;
-            margin: 0 20px 12px 20px;
-            .van-box-p {
-                height: 24px;
-                font-size: 14px;
-                font-weight: 400;
-                color: #939599;
-                line-height: 36px;
-                padding-left: 9px;
-            }
-            .van-con {
-                display: flex;
-                .van-con-div {
-                    width: 42px;
-                    height: 42px;
-                    background: #ffffff;
-                    border-radius: 8px;
-                    font-size: 16px;
-                    font-weight: 500;
-                    color: #000000;
-                    text-align: center;
-                    line-height: 42px;
-                    margin: 0 10px;
-                }
-            }
-        }
-        .van-btn {
-            display: flex;
-            margin: 0 20px;
-            .van-cat {
-                width: 237px;
-                height: 48px;
-                background: #ff6c00;
-                opacity: 0.7;
-                border-radius: 12px 0px 0px 12px;
-                font-size: 13px;
-                font-weight: 500;
-                color: #ffffff;
-                text-align: center;
-                line-height: 48px;
-            }
-            .van-buy {
-                width: 98px;
-                height: 48px;
-                background: #ff6c00;
-                border-radius: 0px 12px 12px 0px;
-                font-size: 16px;
-                font-weight: 400;
-                color: #ffffff;
-                text-align: center;
-                line-height: 48px;
-            }
-        }
     }
 }
 </style>