From 991114848a8d97acd8a3c9b9ce6fcf8125f4d4e0 Mon Sep 17 00:00:00 2001
From: liuye <liuye@sinoecare.com>
Date: Thu, 17 Oct 2024 14:55:21 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../wuxi/AppOrderList/AppOrderList.vue        | 323 ++++++++++++++++++
 src/project/wuxi/AppOrderList/Detail.vue      | 197 +++++++++++
 .../wuxi/AppRedemptionPoints/myOrderList.vue  |  26 +-
 3 files changed, 543 insertions(+), 3 deletions(-)
 create mode 100644 src/project/wuxi/AppOrderList/AppOrderList.vue
 create mode 100644 src/project/wuxi/AppOrderList/Detail.vue

diff --git a/src/project/wuxi/AppOrderList/AppOrderList.vue b/src/project/wuxi/AppOrderList/AppOrderList.vue
new file mode 100644
index 0000000..0ca53c8
--- /dev/null
+++ b/src/project/wuxi/AppOrderList/AppOrderList.vue
@@ -0,0 +1,323 @@
+<template>
+  <div class="AppOrderList">
+    <div class="fixed-top">
+      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="90" font-size="28" bg-color="#fff" inactive-color="#8891A1" 
+        active-color="#1D2229 " :bar-style="barStyle" @change="changeTab" ></u-tabs>
+    </div>
+    <div class="list-content" v-if="list.length">
+      <div class="item" v-for="(item, index) in list" :key="index">
+        <div class="time-flex">
+          <p>{{item.createTime.substring(0, 16)}}</p>
+          <div :class="`status`+item.status">{{ $dict.getLabel('integralSGOStatus', item.status) }}</div>
+        </div>
+        <div class="flex">
+          <img :src="item.goodsPicUrl" alt="">
+          <div class="type" :class="`type`+item.goodsTypeText">{{ $dict.getLabel('integralSGTypeText', item.goodsTypeText) }}</div>
+          <div class="flex-right">
+            <p>{{item.goodsTitle}}</p>
+            <div class="num-flex">
+              <h3>{{item.usedIntegral}}积分<span v-if="item.goodsType == 2">+{{item.payMoney}}元</span></h3>
+              <div>x {{item.quantity}}</div>
+            </div>
+          </div>
+        </div>
+        <!-- <p class="tips" v-if="item.goodsType == 2"><span>兑换成功后，点击「去购买」前往京东低价购买</span></p>
+         <p class="tips" v-else>积分兑换商品，可到固定的兑换点进行「核销兑换」</p>
+        <p class="remark" v-if="item.remarks">备注：{{item.remarks}}</p> -->
+        <p class="remark">兑换人：{{item.remarks}}</p>
+        <p class="remark">兑换时间：{{item.remarks}}</p>
+        <div class="flex-btn" v-if="item.goodsType == 2 && item.status != 2">
+          <p></p>
+          <div class="btn confirm" @click="toDetail(item)">订单核销</div>
+        </div>
+        <!-- <div class="flex-btn" v-if="item.goodsType != 2">
+          <p>核销码:<span>{{item.verificationCode}}</span></p>
+          <div class="btn" v-if="item.status == 0" @click="cancel(item)">取消订单</div>
+        </div> -->
+      </div>
+    </div>
+    <AiEmpty v-else></AiEmpty>
+  </div>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: 'AppOrderList',
+  appName: '订单管理',
+  data() {
+    return {
+      tabList: [{name: '全部'}, {name: '待核销'}, {name: '已完成'}],
+      currentTabs: 0,
+      barStyle: {
+        'width': '20px',
+        'height': '3px',
+        'border-radius': '2px',
+        'bottom': '3px',
+        'background': '#2D7DFF'
+      },
+      list: [],
+      current: 1
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  onLoad() {
+    this.$dict.load(['integralSGOStatus', 'integralSGTypeText']).then(() => {
+      this.getList()
+    })
+    uni.$on('updateList', () => {
+      this.getListInit()
+    })
+  },
+  methods: {
+    changeTab(index) {
+      this.currentTabs = index
+      this.getListInit()
+    },
+    getListInit() {
+      this.current = 1
+      this.getList()
+    },
+    getList() {
+      this.$instance.post(`/app/appintegralsupermarketorder/listForXCX2G`, null, {
+        params: {
+          current: this.current,
+          status: this.currentTabs == 0 ? '' : this.currentTabs - 1,
+          // createUserId: this.user.id
+        }
+      }).then(res => {
+        if (res.code === 0) {
+          res.data.records.map((item) => {
+            item.goodsTypeText = item.goodsType == 0 ? 0 : 1
+          })
+          this.list = this.current == 1 ? res.data.records : [...this.list, ...res.data.records]
+        }
+      })
+    },
+    openJd(item) {
+      if(item.goodsType == 1) {
+        uni.navigateTo({url: `./jdH5?goodsJdUrl=${item.goodsJdUrl}`})
+      }else {
+        uni.navigateToMiniProgram({
+          appId: item.goodsJdAppid,
+          path: item.goodsJdUrl
+        })
+      }
+    },
+    cancel(item) {
+      uni.showModal({
+        title: '确认取消此订单？',
+        content: '取消订单后，积分将退回至积分余额',
+        confirmColor: "#2D7DFF",
+        cancelColor: "#2D7DFF",
+        cancelText: "我在想想",
+        confirmText: "确认取消", 
+        success: (res) => {
+          if (res.confirm) {
+            this.cancelOrder(item)
+          }
+        }
+      });
+    },
+    cancelOrder(item) {
+      this.$instance.post(`/app/appintegralsupermarketorder/cancelForXCX?id=${item.id}`).then(res => {
+        if (res.code === 0) {
+          this.getListInit()
+          uni.$emit('updateGoodsList')
+        }
+      })
+    },
+    toDetail(row) {
+      uni.navigateTo({url: `./Detail?id=${row.id}`})
+    }
+  },
+  onReachBottom() {
+    this.current = this.current + 1
+    this.getList()
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppOrderList {
+  min-height: 100%;
+  .fixed-top {
+    background-color: #fff;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 2;
+  }
+  .list-content {
+    padding: 112px 24px 24px;
+    background-color: #F3F6F9;
+    .item {
+      width: 100%;
+      background: #FFF;
+      border-radius: 16px;
+      margin-bottom: 32px;
+      .time-flex {
+        padding: 0 32px;
+        line-height: 64px;
+        font-family: PingFangSC-Regular;
+        font-size: 24px;
+        color: #666;
+        display: flex;
+        justify-content: space-between;
+        border-bottom: 1px solid #ddd;
+        div {
+          color: #2D7DFF;
+        }
+        .status2 {
+          color: #999;
+        }
+      }
+      .flex {
+        padding: 32px 32px 0;
+        display: flex;
+        position: relative;
+        margin-bottom: 20px;
+        img {
+          width: 166px;
+          height: 166px;
+          border-radius: 16px;
+          margin-right: 20px;
+        }
+        .type {
+          position: absolute;
+          left: 32px;
+          bottom: 0;
+          border-bottom-left-radius: 16px;
+          border-bottom-right-radius: 16px;
+          width: 166px;
+          text-align: center;
+          line-height: 34px;
+          font-family: PingFangSC-Regular;
+          font-size: 18px;
+          color: #FFF;
+          p {
+            scale: 0.9;
+          }
+        }
+        .type2 {
+          background-color: #E64E39;
+        }
+        .type1 {
+          background-color: #E64E39;
+        }
+        .type0 {
+          background-color: #FF6900;
+        }
+        .flex-right {
+          width: calc(100% - 186px);
+          p {
+            word-break: break-all;
+            font-family: PingFangSC-Regular;
+            font-size: 26px;
+            color: #222;
+            line-height: 34px;
+            text-overflow: -o-ellipsis-lastline;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: -webkit-box;
+            -webkit-line-clamp: 2;
+            line-clamp: 2;					
+            -webkit-box-orient: vertical;
+            margin-bottom: 50px;
+          }
+          .num-flex {
+            display: flex;
+            h3 {
+              width: calc(100% - 100px);
+              font-family: PingFangSC-SNaNpxibold;
+              font-weight: 600;
+              font-size: 34px;
+              color: #FF6900;
+              line-height: 48px;
+              span {
+                display: inline-block;
+                font-size: 34px;
+                color: #4181FF;
+                margin-left: 8px;
+              }
+            }
+            div {
+              width: 100px;
+              text-align: right;
+              font-family: PingFangSC-SNaNpxibold;
+              font-weight: 600;
+              font-size: 24px;
+              color: #222;
+              line-height: 48px;
+            }
+          }
+          
+        }
+      }
+      .tips {
+        display: inline-block;
+        padding: 12px;
+        line-height: 36px;
+        background: #F5FCF5;
+        border-radius: 16px;
+        font-family: PingFangSC-Regular;
+        font-size: 24px;
+        color: #3BBC37;
+        margin: 0 32px 16px 32px;
+        span {
+          display: inline-block;
+          scale: 0.9;
+        }
+      }
+      .remark {
+        font-family: PingFangSC-Regular;
+        font-size: 24px;
+        color: #666;
+        line-height: 34px;
+        word-break: break-all;
+        padding: 0 32px 24px 32px;
+      }
+      .flex-btn {
+        padding: 0 32px 32px;
+        display: flex;
+        justify-content: space-between;
+        p {
+          height: 56px;
+          line-height: 56px;
+          font-family: PingFangSC-Regular;
+          font-size: 24px;
+          color: #666;
+          span {
+            display: inline-block;
+            font-family: PingFangSC-SNaNpxibold;
+            font-weight: 600;
+            font-size: 28px;
+            color: #2D7DFF;
+            margin-left: 8px;
+          }
+        }
+        .btn {
+          width: 136px;
+          text-align: center;
+          line-height: 54px;
+          border: 1px solid #CCC;
+          border-radius: 44px;
+          font-family: PingFangSC-Regular;
+          font-size: 22px;
+          color: #666;
+        }
+        .confirm {
+          border: 1px solid #2D7DFF;
+          background-color: #2D7DFF;
+          color: #fff;
+        }
+      }
+    }
+  }
+
+  
+}
+</style>
diff --git a/src/project/wuxi/AppOrderList/Detail.vue b/src/project/wuxi/AppOrderList/Detail.vue
new file mode 100644
index 0000000..e2f2877
--- /dev/null
+++ b/src/project/wuxi/AppOrderList/Detail.vue
@@ -0,0 +1,197 @@
+<template>
+  <div class="Detail">
+    <div class="header-middle">
+      <div class="card solid">
+        <span class="card-left">兑换人</span>
+        <span class="card-right">{{info.examineUserName}}</span>
+      </div>
+      <div class="card solid">
+        <span class="card-left">商品名称</span>
+        <span class="card-right">{{info.goodsTitle}}</span>
+      </div>
+      <div class="card solid">
+        <span class="card-left">数量</span>
+        <span class="card-right">{{info.quantity}}</span>
+      </div>
+      <div class="card solid">
+        <span class="card-left">兑换所需积分</span>
+        <span class="card-right">{{info.usedIntegral}}</span>
+      </div>
+      <div class="cards">
+        <span class="card-left" style="color:#999">图片</span>
+      </div>
+      <img :src="info.goodsPicUrl" alt="" :key="i" @click="previewImage(info.goodsPicUrl)"/>
+    </div>
+    <div class="footer-btn" v-if="info.status == 0">
+      <div class="btn" @click="confirmShow=true">确认核销</div>
+    </div>
+    <u-modal v-model="confirmShow" content="您确认要确认核销该条订单吗？" :show-cancel-button="true" :mask-close-able="true"
+      :show-title="false" @confirm="confirm"></u-modal>
+  </div>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: 'Detail',
+  appName: '核销订单',
+  data() {
+    return {
+      confirmShow: false,
+      info: {},
+      id: ''
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  onLoad(option) {
+    this.id = option.id
+    if (decodeURIComponent(option.scene) != 'undefined') {
+      this.id = decodeURIComponent(option.scene)
+    }
+    this.getDetail()
+  },
+  methods: {
+    getDetail() {
+      this.$instance.post(`/app/appintegralsupermarketorder/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code === 0) {
+          this.info = res.data
+        }
+      })
+    },
+    previewImage(img) {
+      var images = [{'url': this.info.goodsPicUrl}]
+      uni.previewImage({
+        urls: images.map(v => v.url),
+        current: img
+      })
+    },
+    confirm() {
+      this.$instance.post(`/app/appintegralsupermarketorder/examineXCX?id=${this.id}&verificationCode=${this.info.verificationCode}`).then(res => {
+        if (res.code === 0) {
+          this.getDetail()
+          this.$u.toast('核销成功')
+          setTimeout(() => {
+            uni.$emit('updateList')
+          }, 500)
+        }
+      })
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+uni-page-body {
+  height: 100%;
+  padding-top: 26px;
+}
+
+.Detail {
+  height: 100%;
+
+  .header-middle {
+    padding: 0 32px 180px 32px;
+    background: #fff;
+
+    .titles {
+      padding: 32px 0;
+      line-height: 1.4;
+      word-break: break-all;
+      font-size: 40px;
+      font-weight: 600;
+    }
+
+    .status {
+      display: inline-block;
+      margin-bottom: 14px;
+      padding: 4px 8px;
+      font-size: 26px;
+      color: #fff;
+      border-radius: 8px;
+    }
+
+    .status0 {
+      background: #ff883c;
+    }
+    .status1 {
+      background: #2EA222;
+    }
+
+    .status2 {
+      background: #F46;
+    }
+    .status3 {
+      background: #ff4466;
+    }
+
+    .card {
+      display: flex;
+      justify-content: space-between;
+      padding: 34px 0;
+
+      .card-left {
+        width: 46%;
+        font-size: 32px;
+        color: #999999;
+      }
+
+      .card-right {
+        font-size: 32px;
+        word-break: break-all;
+        padding-right: 16px;
+
+        .u-icon {
+          margin-left: 8px;
+        }
+      }
+    }
+    .solid {
+      border-bottom: 1px solid #ddd;
+    }
+
+    // .card:last-child {
+    //   border-bottom: none;
+    // }
+
+    .cards {
+      padding: 34px 0;
+    }
+
+    img {
+      width: 220px;
+      height: 220px;
+      margin: 0 8px 8px 0;
+    }
+
+    img:nth-of-type(3n) {
+      margin-right: 0;
+    }
+  }
+
+  .footer-btn {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    padding: 16px 32px 52px 16px;
+    box-sizing: border-box;
+    background-color: #fff;
+    .btn {
+      width: 100%;
+      text-align: center;
+      height: 96px;
+      line-height: 94px;
+      background-color: #2183FF;
+      border-radius: 8px;
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 32px;
+      color: #fff;
+      margin-bottom: 16px;
+    }
+  }
+}
+</style>
diff --git a/src/project/wuxi/AppRedemptionPoints/myOrderList.vue b/src/project/wuxi/AppRedemptionPoints/myOrderList.vue
index 0c7329d..4f20284 100644
--- a/src/project/wuxi/AppRedemptionPoints/myOrderList.vue
+++ b/src/project/wuxi/AppRedemptionPoints/myOrderList.vue
@@ -29,12 +29,17 @@
           <div class="btn confirm" @click="openJd(item)">去购买</div>
         </div>
         <div class="flex-btn" v-if="item.goodsType != 2">
-          <p>核销码:<span>{{item.verificationCode}}</span></p>
+          <p>核销码:<span>{{item.verificationCode}}</span><span class="qr-code" @click="viewImg(item)" v-if="item.maQrcode">二维码</span></p>
           <div class="btn" v-if="item.status == 0" @click="cancel(item)">取消订单</div>
         </div>
       </div>
     </div>
     <AiEmpty v-else></AiEmpty>
+    <u-popup v-model="showImg" mode="center">
+			<div class="img-box">
+        <img :src="imgUrl" alt="">
+      </div>
+		</u-popup>
   </div>
 </template>
 
@@ -56,7 +61,9 @@ export default {
         'background': '#2D7DFF'
       },
       list: [],
-      current: 1
+      current: 1,
+      showImg: false,
+      imgUrl: ''
     }
   },
   computed: {
@@ -125,6 +132,10 @@ export default {
         }
       })
     },
+    viewImg(row) {
+      this.imgUrl = row.maQrcode
+      this.showImg = true 
+    }
   },
   onReachBottom() {
     this.current = this.current + 1
@@ -290,6 +301,9 @@ export default {
             color: #2D7DFF;
             margin-left: 8px;
           }
+          .qr-code {
+            margin-left: 32px;
+          }
         }
         .btn {
           width: 136px;
@@ -309,7 +323,13 @@ export default {
       }
     }
   }
-
+  .img-box {
+    padding: 32px;
+    img {
+      width: 300px;
+      height: 300px;
+    }
+  }
   
 }
 </style>