.

src/main/pc-space/src/components/CouponInfo.vue

@@ -10,7 +10,7 @@
                     <img class="img" src="../assets/icon_youhuiquan_01@3x.png" alt="" />
                     <div class="coupon-top">
                         <div class="text1">{{ item.name }}</div>
-                        <div class="text2" v-if="!item.limited">仅限规定商品可用</div>
+                        <div class="text2" v-if="item.limited">仅限规定商品可用</div>
                     </div>
                 </div>
                 <div class="box1">
@@ -37,7 +37,7 @@
                     <img class="img" src="../assets/icon_youhuiquan_01@3x (2).png" alt="" />
                     <div class="coupon-top">
                         <div class="text1">{{ item.name }}</div>
-                        <div class="text2" v-if="!item.limited">仅限规定商品可用</div>
+                        <div class="text2" v-if="item.limited">仅限规定商品可用</div>
                     </div>
                 </div>
                 <div class="box1">
@@ -46,7 +46,7 @@
                             <span class="text3 name1"
                                 >兑换券编码<span class="text4"> {{ item.id }}</span></span
                             >
-                            <div class="text6">已使用</div>
+                            <div class="text6">{{ checkTime(item) ? '已使用' : '已过期' }}</div>
                         </div>
 
                         <div class="top1">
@@ -63,8 +63,9 @@
 
 <script>
 import { mapState } from 'vuex';
+import coupon from '../mixins/coupon';
 export default {
-    name: 'couponList',
+    mixins: [coupon],
     data() {
         return {
             list: [],
@@ -88,7 +89,7 @@ export default {
                     '/userCoupon/all',
                     {
                         query: {
-                            // userId: this.userInfo.id
+                            userId: this.userInfo.id
                             // used: false
                         }
                     },
@@ -98,10 +99,10 @@ export default {
                 )
                 .then(res => {
                     this.list = res.content.filter(item => {
-                        return !item.used;
+                        return !item.used && this.checkTime(item);
                     });
                     this.list2 = res.content.filter(item => {
-                        return item.used;
+                        return item.used || !this.checkTime(item);
                     });
                     if (this.list.length === 0) {
                         this.empty = true;

src/main/pc-space/src/mixins/lists.js

@@ -0,0 +1,41 @@
+export default {
+    data() {
+        return {
+            empty: false,
+            loading: false,
+            finished: false,
+            page: 0
+        };
+    },
+    methods: {
+        getData(isFirst = false) {
+            console.log('调动了');
+            if (isFirst) {
+                this.page = 0;
+                this.lists = [];
+                this.$root.$el.scrollTop = 0;
+            }
+
+            this.loading = true;
+            this.finished = false;
+            this.empty = false;
+            let data = { page: this.page, size: 20, sort: 'createdAt,desc' };
+            if (this.beforeData) {
+                data = {
+                    ...data,
+                    ...this.beforeData()
+                };
+            }
+
+            this.$http.post(this.url, data, { body: 'json' }).then(res => {
+                this.lists = [...this.list, ...res.content];
+                this.empty = res.empty;
+                this.loading = false;
+                this.finished = res.last;
+                if (!this.finished) {
+                    this.page = this.page + 1;
+                }
+            });
+        }
+    }
+};

src/main/pc-space/src/views/My.vue

@@ -136,7 +136,7 @@ export default {
                     search: this.search,
                     query: {
                         userId: this.$store.state.userInfo.id,
-                        // status: 'TRANSFERRED'
+                        // status: 'TRANSFERRED',
                         consignment: true
                     }
                 };
@@ -145,7 +145,13 @@ export default {
                     search: this.search,
                     query: {
                         userId: this.$store.state.userInfo.id
-                        // status: 'NORMAL,TRADING,GIFTING'
+                    }
+                };
+            } else if (this.select === '2') {
+                return {
+                    query: {
+                        userId: this.$store.state.userInfo.id
+                        // status: 'creator'
                     }
                 };
             }

src/main/pc-space/src/views/Submit.vue

@@ -3,25 +3,25 @@
         <el-dialog center title="支付订单" :visible.sync="show" width="680px" :before-close="handleClose">
             <div class="border"></div>
             <div class="page" v-loading="loading">
-                <div v-if="list2">
-                    <div class="title1">选择兑换券</div>
-                    <div class="coupon" @click="choose(list2)">
+                <div v-if="list[0]">
+                    <div class="title1">兑换券</div>
+                    <div class="coupon" @click="choose(list[0])">
                         <div class="box">
                             <img class="img" src="../assets/icon_youhuiquan_01@3x.png" alt="" />
                             <div class="coupon-top">
-                                <div class="text1">{{ list2.name }}</div>
-                                <div class="text2" v-if="!list2.limited">仅限规定商品可用</div>
+                                <div class="text1">{{ list[0].name }}</div>
+                                <div class="text2" v-if="list[0].limited">仅限规定商品可用</div>
                             </div>
                         </div>
                         <div class="box1">
                             <div>
                                 <span class="text3"
-                                    >兑换券编码<span class="text4"> {{ list2.id }}</span></span
+                                    >兑换券编码<span class="text4"> {{ list[0].id }}</span></span
                                 >
-                                <div class="text5">有效期至:{{ list2.expiration }}</div>
+                                <div class="text5">有效期至:{{ list[0].expiration }}</div>
                             </div>
                             <img
-                                v-if="chooseId === list2.id"
+                                v-if="chooseId === list[0].id"
                                 class="icon"
                                 src="../assets/icon_gouxuan_pre.png"
                                 alt=""
@@ -29,8 +29,8 @@
                             <img v-else class="icon" src="../assets/icon_gouxuan_huise.png" alt="" />
                         </div>
                     </div>
-                    <div class="all" @click="all">查看更多</div>
                 </div>
+                <div v-if="listAll.length !== 0" class="all" @click="all">查看更多</div>
                 <div class="border"></div>
                 <div class="info">
                     <div class="price">
@@ -89,14 +89,15 @@
             </span>
         </el-dialog>
         <el-dialog center title="兑换券" :visible.sync="show2" width="680px">
-            <div class="page">
-                <div v-for="(item, index) in list3" :key="index" @click="IdFn(item)">
-                    <div class="coupon" @click="choose">
+            <div class="border"></div>
+            <div style="padding: 30px 0 20px 0" class="page">
+                <div v-for="(item, index) in listAll" :key="index" @click="IdFn(item)">
+                    <div class="coupon" @click="choose(item)">
                         <div class="box">
                             <img class="img" src="../assets/icon_youhuiquan_01@3x.png" alt="" />
                             <div class="coupon-top">
                                 <div class="text1">{{ item.name }}</div>
-                                <div class="text2" v-if="!item.limited">仅限规定商品可用</div>
+                                <div class="text2" v-if="item.limited">仅限规定商品可用</div>
                             </div>
                         </div>
                         <div class="box1">
@@ -107,21 +108,23 @@
                                 <div class="text5">有效期至:{{ item.expiration }}</div>
                             </div>
                         </div>
-                        <el-empty v-if="empty" description="暂无兑换券哦~" />
                     </div>
                 </div>
             </div>
+            <!-- <el-empty v-if="empty" description="暂无兑换券哦~" /> -->
         </el-dialog>
     </div>
 </template>
 
 <script>
 import vueQrcode from '@chenfengyuan/vue-qrcode';
+import coupon from '../mixins/coupon';
 import resolveUrl from 'resolve-url';
 // import pageableTable from '../mixins/pageableTable';
 import { mapState } from 'vuex';
 import { add } from 'mathjs';
 export default {
+    mixins: [coupon],
     props: {
         statusAll: {
             type: Object
@@ -142,8 +145,8 @@ export default {
             seconds: 0,
             allTime: 5 * 60 - 1,
             closeTime: '',
-            list2: [],
-            list3: [],
+            list: [],
+            listAll: [],
             payList: [
                 {
                     icon: require('../assets/weixin.png'),
@@ -251,8 +254,7 @@ export default {
                     '/userCoupon/all',
                     {
                         query: {
-                            userId: this.userInfo.id,
-                            used: false
+                            userId: this.userInfo.id
                         }
                     },
                     {
@@ -260,23 +262,27 @@ export default {
                     }
                 )
                 .then(res => {
-                    this.list2 = res.content[0];
-                    this.list3 = res.content;
+                    this.list = res.content.filter(item => {
+                        return !item.used && this.checkTime(item) && this.checkUse(item, this.$route.query.id);
+                    });
+                    this.listAll = res.content.filter(item => {
+                        return !item.used && this.checkTime(item) && this.checkUse(item, this.$route.query.id);
+                    });
+                    console.log(this.listAll);
                 });
         },
         IdFn(e) {
-            this.list2 = e;
+            this.list[0] = e;
             this.show2 = false;
         },
         all() {
             this.show2 = true;
+            // if (this.listAll.length === 0) {
+            //     this.empty = true;
+            // }
         },
-        // CoupFn(){
-
-        // },
         choose(info) {
             console.log(info);
-
             this.chooseId = info.id;
             this.$store.commit('setCouponInfo', info);
         },
@@ -293,7 +299,6 @@ export default {
                     console.log(res);
                     if (res.status === 'FINISH') {
                         clearInterval(this.payTimeout);
-                        // this.status = res.status;
                         this.show = false;
                         setTimeout(() => {
                             this.init2();
@@ -322,7 +327,6 @@ export default {
             this.$http
                 .post(url)
                 .then(res => {
-                    // console.log(res)
                     if (this.money) {
                         // 没有代金券
                         this.initTime(res.id, res.createdAt);
@@ -401,10 +405,15 @@ export default {
 }
 .border {
     height: 1px;
-
     background: #f2f3f5;
     border-radius: 1px;
 }
+/deep/ .el-empty {
+    width: 100px;
+    height: 100px;
+    margin: 0 auto;
+    padding: 50px 0 100px 0px;
+}
 .title1 {
     font-size: 16px;
     font-weight: 400;