512

src/components/AllorderInfo.vue

@@ -6,7 +6,7 @@
                     <img src="/native/tabbar/icon_kapai_shangjia_da.png" alt="" />
                     <p>光之城卡牌</p>
                 </div>
-                <!-- <div class="box-tit-seller">{{ this.name }}</div> -->
+                <div class="box-tit-seller">{{ this.name }}</div>
             </div>
             <div class="box-con-Cards" v-for="(item, index) in orderList" :key="index.id" @click="allorder">
                 <img :src="item.images" alt="" />
@@ -32,13 +32,37 @@
                 <div v-if="this.status == 'CREATED'" @click="cancel" class="box-but">取消订单</div>
                 <div v-if="this.status == 'CREATED'" class="box-but2">立即支付</div>
                 <div v-if="this.status == 'PAYED'" @click="Apply" class="box-but">申请退款</div>
-                <div v-if="this.status == 'PAYED'" class="box-but3">提醒发货</div>
-                <div v-if="this.status == 'SEND'" class="box-but">查看物流</div>
+                <div v-if="this.status == 'PAYED'" @click="remind" class="box-but3">提醒发货</div>
+                <div v-if="this.status == 'SEND'" @click="logistics" class="box-but">查看物流</div>
                 <div v-if="this.status == 'SEND'" class="box-but2">立即支付</div>
                 <div v-if="this.status == 'COMPETED'" class="box-but">申请售后</div>
-                <div v-if="this.status == 'COMPETED'" class="box-but3">提醒发货</div>
+                <div v-if="this.status == 'COMPETED'" @click="remind" class="box-but3">提醒发货</div>
+                <div v-if="this.status == 'CANCELED'" @click="deletes" class="box-but">删除订单</div>
+                <div v-if="this.status == 'CANCELED'" @click="again" class="box-but3">重新购买</div>
             </div>
         </div>
+        <van-popup :show="show" custom-style="background:transparent;border-radius: 12px 12px 0 0;" use-slot>
+            <div class="popup-con">
+                <div class="popup-top">快递详情</div>
+                <div>
+                    <span>物流快递：{{ this.logisTics.expName }}</span>
+                </div>
+                <div>
+                    <span>物流单号：{{ this.logisTics.number }}</span>
+                    <span class="dialog-cv" @click="logisticCopy">复制</span>
+                </div>
+            </div>
+            <van-steps :steps="stepsList" direction="vertical">
+                <div>{{ stepsList.text }}</div>
+                <div>{{ stepsList.desc }}</div>
+            </van-steps>
+            <img
+                @click="logisticShow"
+                style="height:40px;width:40px;margin-left:150px;margin-top:30px"
+                src="../static/imgs/icon_tanchuang_close@3x.png"
+                alt=""
+            />
+        </van-popup>
     </div>
 </template>
 <script>
@@ -53,33 +77,72 @@ export default {
     },
     data() {
         return {
-            orderList: []
+            show: false,
+            stepsList: [],
+            logisTics: []
         };
     },
+    computed: {
+        orderList() {
+            return this.all.orderBoxDTOS || [];
+        },
+        status() {
+            return this.all.status || '';
+        },
+        id() {
+            return this.all.orderInfoId || 0;
+        },
+        caseId() {
+            return this.all.caseId || 0;
+        },
+        name() {
+            if (this.all.status === 'CREATED') {
+                return '待支付';
+            }
+            if (this.status === 'CANCELED') {
+                return '已取消';
+            }
+            if (this.status === 'PAYED') {
+                return '待发货';
+            }
+            if (this.status === 'COMPETED') {
+                return '已完成';
+            }
+            if (this.status === 'SEND') {
+                return '待收货';
+            }
+            return '';
+        }
+    },
     methods: {
-        allFn() {
-            this.orderList = this.all.orderBoxDTOS;
-            this.status = this.all.status;
-            this.id = this.all.orderInfoId;
-            // if (this.all.status === 'CREATED') {
-            //     this.name = '待支付';
-            // }
-            // if (this.status === 'CANCELED') {
-            //     this.name = '已取消';
-            // }
-            // if (this.status === 'PAYED') {
-            //     this.name = '待发货';
-            // }
-            // if (this.status === 'COMPETED') {
-            //     this.name = '已完成';
-            // }
-            // if (this.status === 'SEND') {
-            //     this.name = '待收货';
-            // }
+        logisticShow() {
+            this.show = false;
+        },
+        logistics() {
+            // 查看物流
+            this.$http.get('/orderInfo/checkLogistic', { orderInfoId: this.id }).then(res => {
+                this.logisTics = res.logistic.result;
+                let steps = [];
+                res.logistic.result.list.forEach(item => {
+                    let newStep = {
+                        desc: item.status,
+                        text: item.time
+                    };
+                    steps.push(newStep);
+                });
+                this.stepsList = steps;
+            });
+            this.show = true;
+        },
+        refreash() {
+            this.$emit('refreash');
         },
         allorder() {
             this.navigateTo('/pages/orderdetails?id=' + this.id);
         },
+        again() {
+            this.navigateTo('/pages/details?id=' + this.caseId);
+        },
         cancel() {
             wx.showModal({
                 title: '提示',
@@ -92,32 +155,108 @@ export default {
                                 icon: 'none',
                                 title: '订单已取消'
                             });
-                            this.status = 'CANCELED';
+                            this.refreash();
+                        });
+                    }
+                }
+            });
+        },
+        deletes() {
+            wx.showModal({
+                title: '提示',
+                content: '确定删除订单？',
+                success: res => {
+                    if (res.confirm) {
+                        this.$http.post('orderInfo/delete', { orderInfoId: this.id }).then(res => {
+                            wx.hideLoading();
+                            wx.showToast({
+                                icon: 'none',
+                                title: '订单已删除'
+                            });
+                            this.refreash();
                         });
-                        console.log('=====');
-                        this.allFn();
                     }
                 }
             });
         },
         Apply() {
-            this.$http.post('orderInfo/refund', { orderInfoId: this.id, remark: '' }).then(res => {
-                console.log(res);
+            wx.showModal({
+                title: '提示',
+                content: '确定申请退款？',
+                success: res => {
+                    if (res.confirm) {
+                        this.$http.post('orderInfo/refund', { orderInfoId: this.id, remark: '' }).then(res => {
+                            wx.hideLoading();
+                            wx.showToast({
+                                icon: 'none',
+                                title: '退款成功'
+                            });
+                            this.refreash();
+                        });
+                    }
+                }
+            });
+        },
+        remind() {
+            this.$http.post('orderInfo/remindMy', { orderInfoId: this.id, remark: '' }).then(res => {
+                wx.hideLoading();
+                wx.showToast({
+                    icon: 'none',
+                    title: '提醒成功'
+                });
             });
         }
-    },
-    created() {
-        this.allFn();
     }
 };
 </script>
 
 <style lang="less" scoped>
+/deep/ .van-step__circle-container {
+    height: 0;
+}
+/deep/ .van-steps {
+    height: 307px;
+    width: 336px;
+    overflow: auto !important;
+    border-radius: 0 0 12px 12px;
+}
 .box-con {
     background: #ffffff;
     border-radius: 12px;
     margin: 8px 16px;
     padding-bottom: 5px;
+    .popup-con {
+        padding: 12px 0 20px 9px;
+        background: #ffffff;
+        .popup-top {
+            height: 22px;
+            font-size: 16px;
+            font-weight: bold;
+            color: #000000;
+            line-height: 22px;
+            text-align: center;
+            padding: 50px 0 15px 0;
+        }
+        span {
+            height: 20px;
+            font-size: 14px;
+            font-weight: 400;
+            color: #1a1a1a;
+            line-height: 20px;
+        }
+        .dialog-cv {
+            width: 40px;
+            height: 20px;
+            border-radius: 2px;
+            border: 1px solid #c8c9cc;
+            font-size: 12px;
+            font-weight: 400;
+            color: #c8c9cc;
+            line-height: 20px;
+            text-align: center;
+            margin-left: 8px;
+        }
+    }
     .box-con2 {
         margin: 16px 16px;
         .box-tit {

src/pages/allorder.vue

@@ -18,7 +18,7 @@
             </div>
         </div>
         <div v-for="(item, index) in allList" :key="index + 2">
-            <allorder-info :all="item"></allorder-info>
+            <allorder-info :all="item" @refreash="allFn"></allorder-info>
         </div>
         <van-empty v-if="empty" image="/native/imgs/kong_png_xiaoxiliebiao.png" description="暂无卡包信息哦～">
         </van-empty>
@@ -51,6 +51,7 @@ export default {
             let userId = this.$store.state.userInfo.id;
             this.$http
                 .get('/orderInfo/showMyOrderInfos', {
+                    // orderInfoId: id,
                     orderStatus: this.allStatus(this.active),
                     userId
                 })
@@ -72,9 +73,14 @@ export default {
 <style lang="less" scoped>
 .container {
     background: #f5f7fa;
+    padding-top: 30px;
+    padding: 60px 0 13px 0;
     .box-tab {
         background: #ffffff;
         .flex();
+        position: fixed;
+        top: 0;
+        width: 100%;
         padding-left: 16px;
         .tab-item {
             font-size: 14px;

src/pages/chooseAddress.vue

@@ -92,9 +92,6 @@ export default {
 </script>
 <style lang="less" scoped>
 .container {
-    // background: #f5f7fa;
-    // padding-top: 8px;
-    // padding-bottom: 100px;
     .box {
         padding: 8px 20px;
         .box-con {

src/pages/details.vue

@@ -7,6 +7,9 @@
 <template>
     <div class="container">
         <swiper style="height:335px;" :autoplay="true" :indicator-dots="true">
+            <swiper-item>
+                <img src="../static/imgs/icon_lunbotu@3x..png" alt="" />
+            </swiper-item>
             <swiper-item>
                 <img src="../static/imgs/1.jpeg" alt="" />
             </swiper-item>
@@ -40,7 +43,7 @@
         <div class="box-con2">
             <div class="box-con2-shop">
                 <div class="box-con2-tit">
-                    <img src="../native/tabbar/mine_on.png" alt="" />
+                    <img src="../static/imgs/icon_dianpu@3x..png" alt="" />
                     <div class="logo-shop">
                         <p>光之城官方卡牌店铺</p>
                         <span>浙江 杭州</span>
@@ -51,16 +54,16 @@
         </div>
         <h3>拼箱详情</h3>
         <div class="box-details">
-            1盒6包 1包5张 种类：全80种，UR8种，SR10种，R8种，N44种
-            其中1种有HR版本，UR卡有UTR版本，UR卡和SR卡有SER版本和PSER版本
-            本卡包是1105初回生产限定版的盒内特典包（1盒1包） UR卡8种盒SR卡10种都与1105收录相同，而PSER卡1种是旧卡复刻
+            1盒6包 1包5张 种类：全80种，UR8种，SR10种，R8种，N44种<br />
+            其中1种有HR版本，UR卡有UTR版本，UR卡和SR卡有SER版本和PSER版本<br />
+            本卡包是1105初回生产限定版的盒内特典包（1盒1包） UR卡8种盒SR卡10种都与1105收录相同，而PSER卡1种是旧卡复刻<br />
         </div>
         <img class="container-img" src="../static/imgs/3.jpeg" alt="" />
         <h3>拼箱规则</h3>
         <div class="box-details">
-            1.拼箱是一种类似拼团的玩法，用户选号后支付，当箱中的全部号码都被购买完毕，才算拼箱成功。如果在有限时间内拼箱没有成团，系统会把钱退回给买家
-            2.带有“直播开箱”的拼箱商品，是指当拼箱成团后，店家会实时直播开箱，原箱开封，把所有卡包拆开确认卡片内容，买家可以在小程序上观看直播
-            3.拼箱商品支付成功后不支持退款退货，请谨慎、理智购买
+            1.拼箱是一种类似拼团的玩法，用户选号后支付，当箱中的全部号码都被购买完毕，才算拼箱成功。如果在有限时间内拼箱没有成团，系统会把钱退回给买家<br />
+            2.带有“直播开箱”的拼箱商品，是指当拼箱成团后，店家会实时直播开箱，原箱开封，把所有卡包拆开确认卡片内容，买家可以在小程序上观看直播<br />
+            3.拼箱商品支付成功后不支持退款退货，请谨慎、理智购买<br />
         </div>
         <div class="box-footer">
             <card-case
@@ -135,10 +138,6 @@ export default {
         // 确认订单
         purchase() {
             if (this.chooseIds.length === 0) {
-                // wx.showToast({
-                //     icon: 'none',
-                //     title: '请选择卡包'
-                // });
                 this.$refs.cardCase.init('buy');
                 return;
             }

src/pages/mine.vue

@@ -45,7 +45,7 @@
             <van-grid-item text="我卖出的">
                 <img class="gird-icon" src="/native/svgs/info_icon_maichu.svg" slot="icon" alt="" />
             </van-grid-item>
-            <van-grid-item text="我买到的">
+            <van-grid-item text="我买到的" @click="navigateTo('/pages/allorder')">
                 <img class="gird-icon" src="/native/svgs/info_icon_maidao.svg" slot="icon" alt="" />
             </van-grid-item>
         </van-grid>

src/pages/orderdetails.vue

@@ -12,7 +12,13 @@
             <h3>{{ this.status.name }}!</h3>
         </div>
         <div class="box-adderss">
-            <div v-if="this.status.orderStatus !== 'CREATED' && this.status.orderStatus !== 'PAYED'">
+            <div
+                v-if="
+                    this.status.orderStatus !== 'CREATED' &&
+                        this.status.orderStatus !== 'PAYED' &&
+                        this.status.orderStatus !== 'CANCELED'
+                "
+            >
                 <div class="box-adderss-con" @click="logistics">
                     <img src="../static/imgs/dingdan_icon_wuliu@3x.png" alt="" />
                     <div class="box-con-top">
@@ -132,6 +138,7 @@
                 <div
                     v-if="this.status.orderStatus === 'COMPETED'"
                     class="box-btn-left"
+                    @click="deletes"
                     :style="{ backgroundImage: `url(/native/imgs/btn_02@3x.png)` }"
                 >
                     删除订单
@@ -155,6 +162,7 @@
                 <div
                     v-if="this.status.orderStatus === 'SEND'"
                     class="box-btn-right"
+                    @click="comfrim"
                     :style="{ backgroundImage: `url(/native/imgs/btn_01@3x.png)` }"
                 >
                     确认收货
@@ -171,6 +179,7 @@
                 <div
                     v-if="this.status.orderStatus === 'PAYED'"
                     class="box-btn-right"
+                    @click="comfrim"
                     :style="{ backgroundImage: `url(/native/imgs/btn_01@3x.png)` }"
                 >
                     确认收货
@@ -186,6 +195,7 @@
                 </div>
                 <div
                     v-if="this.status.orderStatus === 'CREATED'"
+                    @click="pay"
                     class="box-btn-right"
                     :style="{ backgroundImage: `url(/native/imgs/btn_01@3x.png)` }"
                 >
@@ -195,28 +205,24 @@
                 <div
                     v-if="this.status.orderStatus === 'CANCELED'"
                     class="box-btn-left2"
-                    @click="cancel"
+                    @click="deletes"
                     :style="{ backgroundImage: `url(/native/imgs/btn_03@3x.png)` }"
                 >
-                    取消订单
+                    删除订单
                 </div>
                 <div
                     v-if="this.status.orderStatus === 'CANCELED'"
                     class="box-btn-right"
+                    @click="again"
                     :style="{ backgroundImage: `url(/native/imgs/btn_01@3x.png)` }"
                 >
-                    立即支付
+                    重新购买
                 </div>
             </div>
         </div>
-        <van-dialog
-            custom-style="height:450px;overflow-y: auto;"
-            use-slot
-            title="快递详情"
-            :show="show"
-            :showConfirmButton="false"
-        >
-            <div class="dialog-con">
+        <van-popup :show="show" custom-style="background:transparent;border-radius: 12px 12px 0 0;" use-slot>
+            <div class="popup-con">
+                <div class="popup-top">快递详情</div>
                 <div>
                     <span>物流快递：{{ this.logisTics.expName }}</span>
                 </div>
@@ -224,13 +230,18 @@
                     <span>物流单号：{{ this.logisTics.number }}</span>
                     <span class="dialog-cv" @click="logisticCopy">复制</span>
                 </div>
-                <div class="dialog-border"></div>
             </div>
             <van-steps :steps="stepsList" direction="vertical">
                 <div>{{ stepsList.text }}</div>
                 <div>{{ stepsList.desc }}</div>
             </van-steps>
-        </van-dialog>
+            <img
+                @click="logisticShow"
+                style="height:40px;width:40px;margin-left:150px;margin-top:30px"
+                src="../static/imgs/icon_tanchuang_close@3x.png"
+                alt=""
+            />
+        </van-popup>
     </div>
 </template>
 
@@ -251,15 +262,17 @@ export default {
             status: [],
             logisTics: [],
             stepsList: [],
-            stepsShow: []
+            stepsShow: [],
+            caseId: ''
         };
     },
     methods: {
-        logistics() {
-            this.show = true;
+        logisticShow() {
+            this.show = false;
         },
         getFn() {
             this.$http.get('/orderInfo/get/' + this.$mp.query.id).then(res => {
+                this.caseId = res.caseId;
                 this.status = res;
                 this.addressList = res.address;
                 this.total = res.total;
@@ -304,6 +317,78 @@ export default {
                 this.stepsShow = res.logistic.result.list[0];
             });
         },
+        again() {
+            this.navigateTo('/pages/details?id=' + this.caseId);
+        },
+        logistics() {
+            // 查看物流
+            this.$http.get('/orderInfo/checkLogistic', { orderInfoId: this.$mp.query.id }).then(res => {
+                this.logisTics = res.logistic.result;
+                let steps = [];
+                res.logistic.result.list.forEach(item => {
+                    let newStep = {
+                        desc: item.status,
+                        text: item.time
+                    };
+                    steps.push(newStep);
+                });
+                this.stepsList = steps;
+            });
+            this.show = true;
+        },
+        comfrim() {
+            wx.showModal({
+                title: '提示',
+                content: '确定收货？',
+                success: res => {
+                    if (res.confirm) {
+                        this.$http.post('/orderInfo/finish', { orderInfoId: this.$mp.query.id }).then(res => {
+                            wx.hideLoading();
+                            wx.showToast({
+                                icon: 'none',
+                                title: '收货成功'
+                            });
+                            this.getFn();
+                        });
+                    }
+                }
+            });
+        },
+        pay() {
+            wx.showLoading({
+                title: '加载中'
+            });
+            this.$http
+                .post('/orderInfo/pay', { orderInfoId: this.$mp.query.id, transactionId: '111' })
+                .then(res => {
+                    console.log(res);
+                    wx.requestPayment({
+                        // ...res,
+                        // success: () => {
+                        //     wx.hideLoading();
+                        //     wx.showToast({
+                        //         title: '支付成功'
+                        //     });
+                        //     // this.$set(this.orderInfo, 'status', 'PAID');
+                        // },
+                        // fail: e => {
+                        //     console.log(e);
+                        //     wx.hideLoading();
+                        //     wx.showToast({
+                        //         icon: 'none',
+                        //         title: '支付失败'
+                        //     });
+                        // }
+                    });
+                })
+                .catch(e => {
+                    wx.hideLoading();
+                    wx.showToast({
+                        title: e.error,
+                        icon: 'none'
+                    });
+                });
+        },
         cancel() {
             wx.showModal({
                 title: '提示',
@@ -316,7 +401,25 @@ export default {
                                 icon: 'none',
                                 title: '订单已取消'
                             });
-                            this.status.orderStatus = 'CANCELED';
+                            this.getFn();
+                        });
+                    }
+                }
+            });
+        },
+        deletes() {
+            wx.showModal({
+                title: '提示',
+                content: '确定删除订单？',
+                success: res => {
+                    if (res.confirm) {
+                        this.$http.post('orderInfo/delete', { orderInfoId: this.$mp.query.id }).then(res => {
+                            wx.hideLoading();
+                            wx.showToast({
+                                icon: 'none',
+                                title: '订单已删除'
+                            });
+                            this.navigateTo('/pages/details?id=' + this.caseId);
                         });
                     }
                 }
@@ -361,10 +464,20 @@ export default {
     /deep/ .van-step__circle-container {
         height: 0;
     }
+    /deep/ .van-steps {
+        height: 307px;
+        width: 336px;
+        overflow: auto !important;
+        border-radius: 0 0 12px 12px;
+    }
     padding-bottom: 140px;
+    padding: 102px 0 140px 0;
     .box-top {
         height: 102px;
         background: #ff6c00;
+        position: fixed;
+        width: 100%;
+        top: 0;
         p {
             height: 34px;
             font-size: 24px;
@@ -663,8 +776,18 @@ export default {
             }
         }
     }
-    .dialog-con {
-        margin: 12px 0 0 9px;
+    .popup-con {
+        padding: 12px 0 20px 9px;
+        background: #ffffff;
+        .popup-top {
+            height: 22px;
+            font-size: 16px;
+            font-weight: bold;
+            color: #000000;
+            line-height: 22px;
+            text-align: center;
+            padding: 50px 0 15px 0;
+        }
         span {
             height: 20px;
             font-size: 14px;
@@ -684,12 +807,6 @@ export default {
             text-align: center;
             margin-left: 8px;
         }
-        .dialog-border {
-            width: 315px;
-            height: 1px;
-            background: #f2f4f5;
-            margin: 10px 0 15px 0;
-        }
     }
     .steps-con {
         display: flex;