From 91ec018f8f18e34d94a037b015879f873fb5a8cd Mon Sep 17 00:00:00 2001
From: xiayt <x1027869635@gmail.com>
Date: Tue, 10 May 2022 15:43:43 +0800
Subject: [PATCH] feat:新版功能基本搭建，等设计稿

---
 src/main.js                            |   4 ++++
 src/router/index.js                    |  21 ++++++++++++++++++++-
 src/views/Home/Home.vue                |   8 ++++----
 src/views/Home/component/HomeOrder.vue |  61 +++++++++++++++++++++++++++++++++----------------------------
 src/views/Service/ServiceOrderXST.vue  | 267 +--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 src/views/Yanxue/YanxueDetail.vue      |  25 +++++++++++++++++++++++++
 src/views/Yanxue/YanxuePage.vue        |  38 ++++++++++++++++++++++++++++++++++++++
 7 files changed, 125 insertions(+), 299 deletions(-)
 create mode 100644 src/views/Yanxue/YanxueDetail.vue
 create mode 100644 src/views/Yanxue/YanxuePage.vue

diff --git a/src/main.js b/src/main.js
index 92bdfd8..f93a004 100644
--- a/src/main.js
+++ b/src/main.js
@@ -7,6 +7,10 @@ import store from './store'
 import Moment from 'moment'
 Vue.prototype.Moment = Moment;
 
+// Vue.prototype.yanxueUrl = 'https://yanxue.myjxt.com';
+
+// import yxAxios from '@/https/yxAxios'
+// Vue.prototype.yxAxios = yxAxios;
 
 import { mgop } from '@aligov/jssdk-mgop';
 Vue.prototype.mgop = mgop;
diff --git a/src/router/index.js b/src/router/index.js
index 4e2944d..ca7c0ae 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -33,6 +33,9 @@ import schoolFollow from '@/views/Travel/schoolFollow.vue' //已关注学校列�
 import schoolAttestation from '@/views/Travel/schoolAttestation.vue' //已认证学校列表
 import classAttestation from '@/views/Travel/classAttestation.vue' //已集团权限年级班级列表
 
+import YanxuePage from '@/views/Yanxue/YanxuePage.vue' //研学
+import YanxueDetail from '@/views/Yanxue/YanxueDetail.vue' //研学
+
 Vue.use(VueRouter)
 const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace];
 VueRouter.prototype.push = function push(to) {
@@ -119,7 +122,7 @@ const routes = [{
         name: 'ServiceOrderXST',
         component: ServiceOrderXST,
         meta: {
-            title: '我的订单'
+            title: '我的评价'
         }
     },
     {
@@ -250,6 +253,22 @@ const routes = [{
             title: '集团认领'
         }
     },
+    {
+        path: '/YanxuePage',
+        name: 'YanxuePage',
+        component: YanxuePage,
+        meta: {
+            title: '研学'
+        }
+    },
+    {
+        path: '/YanxueDetail',
+        name: 'YanxueDetail',
+        component: YanxueDetail,
+        meta: {
+            title: '研学'
+        }
+    },
 
 ]
 const router = new VueRouter({
diff --git a/src/views/Home/Home.vue b/src/views/Home/Home.vue
index ee6acdf..0510f9d 100644
--- a/src/views/Home/Home.vue
+++ b/src/views/Home/Home.vue
@@ -20,10 +20,10 @@
     </div>
     <HomeOrder></HomeOrder>
     <div class="function">
-      <div class="item" @click="handleMyCard">
+      <div class="item" @click="handleYanxue">
         <div class="left">
           <van-icon class="icon" name="discount" />
-          <span>我的优惠券</span>
+          <span>研学</span>
         </div>
         <van-icon name="arrow" />
       </div>
@@ -107,9 +107,9 @@ export default {
     },
   },
   methods: {
-    // 研学码
+    
     handleYanxue() {
-      this.$router.push({ name: 'YanxueCode' })
+      this.$router.push({ name: 'YanxuePage' })
     },
     // 我的订单
     handleOrder() {
diff --git a/src/views/Home/component/HomeOrder.vue b/src/views/Home/component/HomeOrder.vue
index 63dca04..2abc576 100644
--- a/src/views/Home/component/HomeOrder.vue
+++ b/src/views/Home/component/HomeOrder.vue
@@ -1,50 +1,52 @@
 <template>
   <div class="home_order">
     <div class="top">
-      <p>我的订单</p>
+      <p>我的评价</p>
     </div>
     <div class="icon_box">
       <!-- <div @click="handleCustom">
         <img src="@/assets/home/icon_kq1.png" alt="">
         <p>定制研学</p>
       </div> -->
-      <div @click="handleServiceOrder(0)">
+      <!-- <div @click="handleServiceOrder(0)">
         <img src="@/assets/home/icon_kq2.png" alt="">
         <p>待付款</p>
       </div>
       <div @click="handleServiceOrder(1)">
         <img src="@/assets/home/icon_kq3.png" alt="">
         <p>待使用</p>
-      </div>
-      <div @click="handleServiceOrder(2)">
-        <img src="@/assets/home/icon_kq4.png" alt="">
+      </div> -->
+      <div @click="handleServiceOrder(0)">
+        <img src="@/assets/home/icon_kq4.png" alt="" />
         <p>待评价</p>
       </div>
-      <div @click="handleServiceOrder(3)">
-        <img src="@/assets/home/icon_kq5.png" alt="">
+      <div @click="handleServiceOrder(1)">
+        <img src="@/assets/home/icon_kq5.png" alt="" />
         <p>已评价</p>
       </div>
-
+      <div></div>
+      <div></div>
+      <div></div>
     </div>
   </div>
 </template>
 <script>
 export default {
-  props:{
-    parent:{
-      type:String,
-      default:''
-    }
+  props: {
+    parent: {
+      type: String,
+      default: '',
+    },
   },
   methods: {
     // 定制研学
-    handleCustom () {
-      this.$toast('暂未开放，敬请期待！');
+    handleCustom() {
+      this.$toast('暂未开放，敬请期待！')
     },
-    handleServiceOrder (active) {
+    handleServiceOrder(active) {
       this.$router.push({ name: 'ServiceOrderXST', query: { active: active } })
-    }
-  }
+    },
+  },
 }
 </script>
 <style lang="scss" scoped>
@@ -68,6 +70,9 @@ export default {
     justify-content: space-between;
     height: 140px;
     margin-top: 20px;
+    div{
+      width: 80px;
+    }
     img {
       display: block;
       width: 62px;
@@ -81,16 +86,16 @@ export default {
 }
 </style>
 <style lang="scss">
-  .elder{
-    .home_order{
-      .top{
-        p{
-          font-size: 44px;
-        }
+.elder {
+  .home_order {
+    .top {
+      p {
+        font-size: 44px;
       }
-       .icon_box p{
-         font-size: 34px;
-       }
+    }
+    .icon_box p {
+      font-size: 34px;
     }
   }
-</style>
\ No newline at end of file
+}
+</style>
diff --git a/src/views/Service/ServiceOrderXST.vue b/src/views/Service/ServiceOrderXST.vue
index 67afa9e..bd170e7 100644
--- a/src/views/Service/ServiceOrderXST.vue
+++ b/src/views/Service/ServiceOrderXST.vue
@@ -1,72 +1,6 @@
 <template>
   <div class="myOrders">
-    <!-- <van-nav-bar title="" left-text="返回首页" left-arrow @click-left="back" /> -->
     <van-tabs v-model="active" :before-change="beforeTabChange">
-      <van-tab title="待付款">
-        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadpay()">
-          <div class="showBoxDPJ" v-for="(item,index) in paylist" :key="index">
-            <div class="topLine">
-              <div class="topLineL">订单编号：{{item.orderpaynum}}</div>
-              <div class="topLineR" style="color:#F64C37">待付款</div>
-            </div>
-            <div class="top" @click="toEdit(item)">
-              <div class="pic">
-                <img :src="item.coverUrl ? item.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">
-              </div>
-              <div class="basefont">
-                <div class="titlefont">{{item.baseName}}</div>
-                <div class="tcfont">套餐名称：{{item.courseName}}</div>
-                <div class="tcfont">数量*{{item.orderCount}}</div>
-              </div>
-              <div class="priceRight">¥{{item.paymoney}}</div>
-            </div>
-            <div class="detailsBox">
-              <div class="detailsBoxOne">
-                <div>订单创建时间</div>
-                <div>{{item.intime.replace(/T/,' ')}}</div>
-              </div>
-            </div>
-          </div>
-        </van-list>
-      </van-tab>
-      <van-tab title="待使用">
-        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadmove()">
-          <div class="showBox" v-for="(item,index) in movelist" :key="index">
-            <div class="top" @click="toEdit(item)">
-              <div class="pic">
-                <img :src="item.coverUrl ? item.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">
-              </div>
-              <div class="basefont">
-                <div class="titlefont">{{item.baseName}}</div>
-                <div class="tcfont">套餐名称：{{item.courseName}}</div>
-                <div class="tcfont">数量*{{item.orderCount}}</div>
-              </div>
-              <div class="priceRight">¥{{item.paymoney}}</div>
-            </div>
-            <div class="groupTime">
-              <van-icon name="clock-o" /><span class="grey"> 活动日期</span><span> {{item.startDate}} - {{ item.endDate}}</span>
-            </div>
-            <div class="btnBox">
-              <div></div>
-              <div>
-                <van-button class="btn" type="warning" plain size="small" @click="showPintuanAbout = true" style="margin-right:15px">退款说明</van-button>
-                <!-- <van-button type="info" size="small" @click="makeCode(item.id)">核销码</van-button> -->
-                <van-button class="btn" type="info" size="small" @click="toCode(item)">核销码</van-button>
-              </div>
-            </div>
-            <div class="detailsBox">
-              <div class="detailsBoxOne">
-                <div>订单创建时间</div>
-                <div>{{item.intime.replace(/T/,' ')}}</div>
-              </div>
-              <div class="detailsBoxOne">
-                <div>订单编号</div>
-                <div>{{item.orderpaynum}}</div>
-              </div>
-            </div>
-          </div>
-        </van-list>
-      </van-tab>
       <van-tab title="待评价">
         <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadCareer()">
           <div class="showBoxDPJ" v-for="(item,index) in datalist" :key="index">
@@ -132,58 +66,6 @@
       </van-tab>
     </van-tabs>
 
-    <!--二维码-->
-    <!-- <div class="qrcodeBox" @click.self="qrcodeShow = false" v-show="qrcodeShow">
-      <div id="qrcode"></div>
-    </div> -->
-
-    <!--退款说明-->
-    <van-popup v-model="showPintuanAbout" round>
-      <div class="pintuan_about">
-        <img class="about_img" src="@/assets/service/tip.png" alt="">
-        <p class="about_title">退款说明</p>
-        <div class="about_box">
-          <p class="about_content">1、凡拼团活动报名人数未达最低成团数，本团活动则不开营，系统将在72小时内，全额退还，且不产生违约风险赔偿。</p>
-          <p class="about_content">2、如果您因行程发生变动需要取消预订，建议您尽可能提前与平台商户取得联系，并按商品订购须知或该商户旅游合同条款进行退款。</p>
-          <p class="about_content" style="font-weight:bold">如若未声明与明确的，按《浙江省境内旅游合同》条款退款。</p>
-          <!-- <p class="about_content">（1）出发前7日至4日，支付旅游费用总额的10%。</p>
-        <p class="about_content">（2）出发前3日至1日，支付旅游费用总额的15%。</p>
-        <p class="about_content">（3）出发当日，支付旅游费用总额的20%。</p> -->
-        </div>
-        <p class="about_know" @click="showPintuanAbout=false">我知道了</p>
-      </div>
-    </van-popup>
-
-    <van-popup v-model="showCode" round get-container="body">
-      <div class="codeCss">
-        <div class="showBox">
-          <div class="top">
-            <div class="pic">
-              <img :src="codeData.coverUrl ? codeData.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">
-            </div>
-            <div class="basefont">
-              <div class="titlefont">{{codeData.baseName}}</div>
-              <div class="tcfont">套餐名称：{{codeData.courseName}}</div>
-              <div class="tcfont">数量*{{codeData.orderCount}}</div>
-            </div>
-            <!-- <div class="priceRight">¥{{codeData.paymoney}}</div> -->
-          </div>
-          <div class="groupTime">
-            <van-icon name="clock-o" /><span class="grey"> 活动日期</span><span> {{codeData.startDate}} - {{ codeData.endDate}}</span>
-          </div>
-          <div class="qrcodeBox">
-            <div id="qrcode" ref="imageWrapper" v-if="!imgUrl"></div>
-            <div class="imgBox">
-              <img :src="imgUrl" v-if="imgUrl" style="width:100%;height:100%" />
-            </div>
-          </div>
-          <div class="numShow">
-            {{codeData.id}}
-          </div>
-          <div class="fontBottom">请向工作人员出示</div>
-        </div>
-      </div>
-    </van-popup>
     <van-popup v-model="showPreview" round get-container="body">
       <img class="preview_img" :src="previewUrl" alt="">
     </van-popup>
@@ -191,25 +73,17 @@
 </template>
 
 <script>
-import QRCode from 'qrcodejs2'  // 引入qrcode
-import html2canvas from "html2canvas"
-// let Base64 = require('js-base64').Base64;
 export default {
   name: 'ServiceOrder',
   data () {
     return {
       userInfo: '',
       active: 1,
-      paylist: [], //待付款
-      movelist: [],  //待核销
       list: [],  //所有
       datalist: [],  //未评价
       loading: false,
       finished: false,
       pageCareerIndex: 0,
-      qrcodeShow: false,
-      showPintuanAbout: false,
-      showCode: false,
       codeData: {},
       imgUrl: '',
       previewUrl: '',//图片预览
@@ -232,91 +106,17 @@ export default {
     }
   },
   methods: {
-    back () {
-      this.$router.push({ name: 'ServiceKQ' })
-    },
     beforeTabChange (item) {
       console.log(item)
-      this.paylist = [];
-      this.movelist = [];
       this.list = [];
       this.datalist = [];
       if (item == 0) {
-        this.onLoadpay()
-      } else if (item == 1) {
-        // this.onLoadCareer()
-        this.onLoadmove()
-      } else if (item == 2) {
         this.onLoadCareer()
-      } else {
+      } else if (item == 1) {
         this.onLoad()
       }
       return true;
     },
-    //获取待支付
-    onLoadpay () {
-      this.mgop({
-        api: 'mgop.sz.hswsy.GetOrderPayList', // 必须
-        host: 'https://mapi.zjzwfw.gov.cn/',
-        dataType: 'JSON',
-        type: 'GET',
-        appKey: 'fuxgnukl+2001895516+edccpx', // 必须
-        headers: {
-          //   'isTestUrl': '1'
-        },
-        data: {
-          "userId": localStorage.getItem('centerNo'),
-          "type": 1,
-          "page": 1,
-          "pageSize": 999
-        },
-        onSuccess: res => {
-          console.log('待支付:', res)
-          if (res.data.status == 1) {
-            this.paylist = res.data.data.list;
-            this.loading = false;
-            this.finished = true;
-          } else {
-            this.$toast.fail(res.data.message);
-          }
-        },
-        onFail: err => {
-          console.log('err', err)
-        }
-      });
-    },
-    //获取已支付
-    onLoadmove () {
-      this.mgop({
-        api: 'mgop.sz.hswsy.GetOrderPayList', // 必须
-        host: 'https://mapi.zjzwfw.gov.cn/',
-        dataType: 'JSON',
-        type: 'GET',
-        appKey: 'fuxgnukl+2001895516+edccpx', // 必须
-        headers: {
-          //   'isTestUrl': '1'
-        },
-        data: {
-          "userId": localStorage.getItem('centerNo'),
-          "type": 2,
-          "page": 1,
-          "pageSize": 999
-        },
-        onSuccess: res => {
-          console.log('已支付:', res)
-          if (res.data.status == 1) {
-            this.movelist = res.data.data.list;
-            this.loading = false;
-            this.finished = true;
-          } else {
-            this.$toast.fail(res.data.message);
-          }
-        },
-        onFail: err => {
-          console.log('err', err)
-        }
-      });
-    },
     //获取待评价
     onLoadCareer () {
       this.mgop({
@@ -381,48 +181,15 @@ export default {
         }
       });
     },
-    //生成核销码
-    makeCode (id) {
-      console.log(id.toString())
-      document.getElementById('qrcode').innerHTML = '';
-      this.qrcodeShow = true;
-
-      let qrcode = new QRCode('qrcode', {
-        width: 200,
-        height: 200,
-        text: id.toString(), // 二维码地址
-      })
-      this.canvanqrCode()
-    },
     //评价
     evaluate (item) {
       window.localStorage.setItem('courseInfo', JSON.stringify(item))
       this.$router.push({ name: 'evaluateCourse' })
     },
-    //核销码
-    toCode (item) {
-      this.codeData = {}
-      this.showCode = true
-      this.codeData = item
-      this.imgUrl = ''
-      setTimeout(() => {
-        this.makeCode(item.id)
-      }, 1000);
-    },
     //跳转
     toEdit (item) {
       this.$router.push({ path: 'abroad_detail', query: { courseId: item.courseId } })
     },
-    //二维码转图片
-    canvanqrCode () {
-      html2canvas(this.$refs.imageWrapper, {
-        width: 200,
-        height: 200
-      }).then(canvas => {
-        let dataURL = canvas.toDataURL("image/png");
-        this.imgUrl = dataURL;
-      });
-    },
     // 预览图片
     previewImg (url) {
       this.previewUrl = url;
@@ -444,23 +211,6 @@ export default {
   overflow: auto;
   background: #f6f7fa;
 
-  // .qrcodeBox {
-  //   position: fixed;
-  //   top: 0;
-  //   left: 0;
-  //   bottom: 0;
-  //   right: 0;
-  //   background-color: rgba(0, 0, 0, 0.4);
-
-  //   #qrcode {
-  //     position: absolute;
-  //     top: 50%;
-  //     left: 50%;
-  //     transform: translate(-50%, -50%);
-  //     padding: 20px;
-  //     background: #fff;
-  //   }
-  // }
 
   .list {
     padding: 20px;
@@ -794,21 +544,6 @@ export default {
         color: #999999;
       }
     }
-    .qrcodeBox {
-      width: 100%;
-      height: 430px;
-
-      #qrcode {
-        transform: translate(25%, 10%);
-        // margin: auto;
-      }
-      .imgBox {
-        width: 370px;
-        height: 370px;
-        margin: 30px auto 0;
-        // transform: translate(25%, 10%);
-      }
-    }
     .numShow {
       width: 100%;
       font-size: 28px;
diff --git a/src/views/Yanxue/YanxueDetail.vue b/src/views/Yanxue/YanxueDetail.vue
new file mode 100644
index 0000000..dd08e47
--- /dev/null
+++ b/src/views/Yanxue/YanxueDetail.vue
@@ -0,0 +1,25 @@
+<template>
+  <div class="yanxue_detail">
+    <img :src="image" alt="">
+  </div>
+</template>
+<script>
+import axios from 'axios'
+export default {
+  data() {
+    return {
+      image:''
+    }
+  },
+  mounted() {
+    this.image = `https://payment.myjxt.com/zlb_assets/image/${this.$route.query.image}.jpg`
+  },
+}
+</script>
+<style lang="scss">
+.yanxue_detail {
+  img{
+    width: 100%;
+  }
+}
+</style>
diff --git a/src/views/Yanxue/YanxuePage.vue b/src/views/Yanxue/YanxuePage.vue
new file mode 100644
index 0000000..9d8fe06
--- /dev/null
+++ b/src/views/Yanxue/YanxuePage.vue
@@ -0,0 +1,38 @@
+<template>
+  <div class="yanxue_page">
+    <p class="item" v-for="(item,index) in listData" :key="index" @click="handleItem(item.title)">{{item.title}}</p>
+  </div>
+</template>
+<script>
+import axios from 'axios'
+export default {
+  data() {
+    return {
+      listData:[]
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    getList() {
+      this.$toast.loading('加载中...')
+      axios.get(`https://payment.myjxt.com/zlb_assets/yanxue.json`).then((res) => {
+        this.$toast.clear()
+        console.log('列表：', res.data)
+        this.listData = res.data
+      })
+    },
+    handleItem(image){
+      this.$router.push({ name: 'YanxueDetail' ,query:{image:image}})
+    }
+  },
+}
+</script>
+<style lang="scss">
+.yanxue_page {
+  .item{
+    font-size: 30px;
+  }
+}
+</style>
--
libgit2 0.21.0