添加兑换说明页面

src/router/router.js

@@ -6,8 +6,9 @@ const cooplist = r => require.ensure([], () => r(require('../views/cooperation-d
 const parent = r => require.ensure([], () => r(require('../views/parent-page')), 'parent')
 const merge = r => require.ensure([], () => r(require('../views/merge-detail')), 'merge')
 const test = r => require.ensure([], () => r(require('../views/test-components')), 'test-components')
-const CreditEdit = r => require.ensure([], () => r(require('../views/credit-edit')), 'credit-edit')
-const CreditDetail = r => require.ensure([], () => r(require('../views/credit-detail')), 'credit-detail')
+const creditedit = r => require.ensure([], () => r(require('../views/credit-edit')), 'credit-edit')
+const creditdetail = r => require.ensure([], () => r(require('../views/credit-detail')), 'credit-detail')
+const excgtips = r => require.ensure([], () => r(require('../views/exchange-tips')), 'exchange-tips')
 
 export default [{
     path: '/',
@@ -47,11 +48,15 @@ export default [{
         },
         {
             path: '/credit-edit',
-            component: CreditEdit
+            component: creditedit
         },
         {
             path: '/credit-detail',
-            component: CreditDetail
+            component: creditdetail
+        },
+        {
+            path: '/excg-tips',
+            component: excgtips
         },
         
     ]

src/views/exchange-tips.vue

+<template>
+  <div>
+    <header class="header">
+      <span>兑换须知</span>
+      <img src="../images/cme/close.png" alt="">
+    </header>
+    <div class="exchange-tips-wrapper fixed">
+      <div class="content">
+        <p class="title">一、云鹊医课程的版权归属何方？</p>
+        <p class="text">云鹊医平台所有的在线课程版权归云鹊医所有，任何以录屏或其它方式进行的盗版或盗版售卖行为均属侵权行为，一经发现，云鹊医将采取最严厉的措施进行打击并维权，包括但不限于：起诉侵权人、发函侵权人学校或单位、云鹊医全平台公示侵权人所有信息、在一定时间内或永久限制该侵权人购买、观看课程的权利。</p>
+        <p class="title">二、我应该如何兑换课程？</p>
+        <p class="text">点击课程页面上的“点击兑换”，即可通过啾啾币兑换等值的课程。如果啾啾币不足，可以通过啾啾币中心的任务列表赚取。目前仅支持完整课程的兑换，暂不支持单独章节的兑换。在啾啾币系统上线以前、用户已经加入学习的课程不受影响。</p>
+        <p class="title">三、兑换课程以后如何看课？</p>
+        <p class="text">打开云鹊医app，进入“个人中心”- “我的课程”，在“学习中”即可看到兑换成功的课程。课程兑换成功以后，用户可以永久收看该门课程。</p>
+        <p class="title">四、我兑换课程以后后悔了，可以退课吗？</p>
+        <p class="text">目前云鹊医平台不支持通过啾啾币兑换的课程退货，即不支持退回啾啾币的动作，所以请在兑换成功前自行确认是否要用啾啾币兑换该课程。对于用户自主消费啾啾币的行为产生的啾啾币减少，云鹊医平台不作后续处理。</p>
+        <p class="title">五、其它提示：</p>
+        <p class="text">由于学员较多，如有问题请直接留言，客服会在24小时以内回复，请谅解。 如果事件过于紧急，请联系云鹊医客服电话：4009208877。</p>
+      </div>
+    </div>
+  </div>
+</template>
+<style lang="scss" scoped>
+  @import "../style/mixin";
+  .header {
+    width: 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+    text-align: center;
+    padding: px2rem(20px) 0;
+    font-size: px2rem(18px);
+    line-height: px2rem(18px);
+    color: #333333;
+    background: #fff;
+    img {
+      position: absolute;
+      right: px2rem(20px);
+      width: px2rem(13px);
+      height: px2rem(13px);
+    }
+  }
+  .exchange-tips-wrapper {
+    padding-top: px2rem(30px);
+    margin: px2rem(20px);
+    font-size: px2rem(16px);
+    .fixed {
+      .header {
+        position: fixed;
+      }    
+    }
+
+    .content {
+      .title {
+        line-height: px2rem(18px);
+        font-weight: 700;
+        color: #373839;
+        margin: px2rem(12px) 0;
+      }
+      .text {
+        color: #676869;
+        // text-align-last: justify;
+        text-align: justify;       
+      }
+    }
+  }
+</style>
\ No newline at end of file