0826

src/components/createInvoice/index.vue

@@ -2,6 +2,28 @@
   <div>
     <div class="select-layout">
       <p class="sub-title">
+        <span>筛选设备</span>
+      </p>
+      <div class="address-input-con">
+        <div class="address-input-item">
+          <div class="address-sub">
+            <div class="top-title">设备选择</div>
+            <div class="ant-input prov" @click="handleSelect('device')">
+              {{activeDevice.childName||'设备选择'}}
+              <ul v-if="device">
+                <li
+                  v-for="(item,i) in invoicedevice"
+                  :key="i"
+                  @click="handledeviceClick(item)"
+                >{{item.childName}}</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="select-layout">
+      <p class="sub-title">
         <span>发票金额</span>
       </p>
       <div class="address-input-con">
@@ -185,7 +207,7 @@
 <script>
 import { mapState } from 'vuex'
 import { citylist } from './city'
-let sle = ['prov', 'city', 'dist']
+let sle = ['prov', 'city', 'dist', 'device']
 
 export default {
   data () {
@@ -201,15 +223,25 @@ export default {
       prov: false,
       city: false,
       dist: false,
+      device: false,
       currentPID: idArr[0] || 18,
       currentCID: idArr[1] || 3,
       currentSID: idArr[2] || 2,
-      areaPath: ''
+      areaPath: '',
+      activeDevice: {}
     }
   },
   computed: {
     ...mapState({
-      token: state => state.user.token
+      token: state => state.user.token,
+      invoicedevice: state => {
+        let type = Object.prototype.toString.call(state.user.invoicedevice)
+        if (type === '[object Object]') {
+          return state.user.invoicedevice
+        }
+        let condition = state.user.invoicedevice && state.user.invoicedevice !== 'null'
+        return (condition ? state.user.invoicedevice : [])
+      }
     }),
     currentProv: function () {
       let tmp = this.citylist[this.currentPID]
@@ -228,6 +260,16 @@ export default {
     }
   },
   methods: {
+    async getAllDevice (searchKey = '') {
+      let params = {
+        cameraType: ''
+      }
+      await this.$store.dispatch('getInvoiceDevice', params)
+      this.activeDevice = this.invoicedevice[0]
+    },
+    handledeviceClick (item) {
+      this.activeDevice = item
+    },
     handleSelect (item) {
       sle.forEach(i => {
         if (i === item) {
@@ -303,7 +345,7 @@ export default {
         }
       }
 
-      params['cameraId'] = ''
+      params['cameraId'] = this.activeDevice.id
 
       let res = await this.$http.post('/user/invoice/add', params, {
         headers: {
@@ -314,7 +356,7 @@ export default {
 
       if (response.code === 0) {
         this.$toast.show('success', '开票成功', () => {
-          this.$router.replace({name: 'consumption'})
+          this.$router.replace({name: 'consumption', params: {id: 2}})
         })
       } else {
         return this.$toast.show('warn', response.msg, () => {})
@@ -323,6 +365,7 @@ export default {
   },
   mounted () {
     this.handleChange()
+    this.getAllDevice()
   }
 }
 </script>

src/components/toast/binding.vue

@@ -11,8 +11,8 @@
       </div>
       <div class="binding-con">
         <div class="binding-body" v-if="!bindingSuccess">
-          <div class="b-input">
-            <input :class="{notbing:hasBind}" v-model="SN" placeholder="请输入产品包装盒上的S/N码" type="text">
+          <div class="b-input" :class="{notbing:hasBind}">
+            <input v-model="SN" placeholder="请输入产品包装盒上的S/N码" type="text">
           </div>
           <div class="bind-error">{{hasBind?errorMsg:''}}</div>
           <div class="bind-info">
@@ -86,9 +86,10 @@ export default {
       })
       let data = result.data
       if (data.code === 0) {
-        this.successName = this.SN
         this.SN = ''
-        this.bindingSuccess = true
+        this.$toast.show('warn', '绑定成功', () => {
+          this.SN = ''
+        })
       } else if (data.code === 4010) {
         this.hasBind = true
         this.errorMsg = '绑定的相机不存在'
@@ -124,6 +125,7 @@ $theme-color: #1fe4dc;
       .b-input{
         width: 70%;
         margin: 0 auto;
+        border: solid 1px #e7e7e7;
         input{
           width: 100%;
           text-align: center;
@@ -132,12 +134,12 @@ $theme-color: #1fe4dc;
           padding: 0 20px 0 10px;
           line-height: 30px;
           font-size: 12px;
-          border: solid 1px #e7e7e7;
-        }
-        .notbing{
-          border: 1px solid #ff0000;
+          border: none;
         }
       }
+      .notbing{
+        border: 1px solid #ff0000;
+      }
       .bind-info{
         width: 90%;
         margin: 15px auto;

src/pages/account/forget/index.vue

@@ -19,23 +19,23 @@
             </li>
           </ul>
         </div>
-        <input v-model="phone" oninput="value=value.replace(/[^\d]/g,'')" maxlength='11' @focus="inputActive='phone'" @blur="blurHandle" type="text" placeholder="手机">
+        <input v-model="phone" oninput="value=value.replace(/[^\d]/g,'')" maxlength='11' @focus="inputActive='phone'" @blur="inputActive=''" type="text" placeholder="手机">
       </div>
       <div class="code-con">
         <div class="input-con" :class="{inputActive:inputActive==='code'}">
           <img :src="`${$cdn}images/icon/icon-code@2x.png`" style="width:23px;" alt="">
-          <input v-model="authCode" @focus="inputActive='code'" @blur="blurHandle" style="padding-left:6px;" type="text" placeholder="输入验证码">
+          <input v-model="authCode" @focus="inputActive='code'" @blur="inputActive=''" style="padding-left:6px;" type="text" placeholder="输入验证码">
         </div>
         <div v-if="!jishi" class="btns" @click="getAuthCode">获取验证码</div>
         <span class="btns" v-else>{{interTime}}s后重新发送</span>
       </div>
       <div class="input-con"  :class="{inputActive:inputActive==='password'}">
         <img :src="`${$cdn}images/icon/icon-password@2x.png`" alt="">
-        <input v-model="password" @focus="inputActive='password'" @blur="blurHandle" type="password" placeholder="新密码">
+        <input v-model="password" @focus="inputActive='password'" @blur="inputActive=''" type="password" placeholder="新密码">
       </div>
       <div class="input-con"  :class="{inputActive:inputActive==='confirm'}">
         <img :src="`${$cdn}images/icon/icon-confirm@2x.png`" alt="">
-        <input v-model="confirmpass" @focus="inputActive='confirm'" @blur="blurHandle" type="password" placeholder="再次输入新密码">
+        <input v-model="confirmpass" @focus="inputActive='confirm'" @blur="inputActive=''" type="password" placeholder="再次输入新密码">
       </div>
       <div class="btns" @click="submit">提交</div>
     </div>
@@ -80,13 +80,7 @@ export default {
       this.showSelect = false
       this.codeActive = item
     },
-    blurHandle () {
-      this.inputActive = ''
-      document.querySelector('#app').style.height = 'auto'
-      setTimeout(() => {
-        document.querySelector('#app').style.height = '100%'
-      }, 20)
-    },
+
     async getAuthCode () {
       let res = await this.$store.dispatch('getAuthCode', {
         phone: this.phone,

src/pages/account/login/index.vue

@@ -8,11 +8,11 @@
     <div class="login-con">
       <div class="input-con" :class="{inputActive:inputActive==='text'}">
         <img :src="`${$cdn}images/icon/icon-phone@2x.png`" alt="">
-        <input v-model="phone" oninput="value=value.replace(/[^\d]/g,'')" maxlength='11' @focus="inputActive='text'" @blur="blurHandle" type="text" placeholder="手机">
+        <input v-model="phone" oninput="value=value.replace(/[^\d]/g,'')" maxlength='11' @blur="inputActive=''" @focus="inputActive='text'" type="text" placeholder="手机">
       </div>
       <div class="input-con"  :class="{inputActive:inputActive==='password'}">
         <img :src="`${$cdn}images/icon/icon-password@2x.png`" alt="">
-        <input v-model="password" @focus="inputActive='password'" @blur="blurHandle" type="password" placeholder="密码">
+        <input v-model="password" @focus="inputActive='password'" @blur="inputActive=''" type="password" placeholder="密码">
       </div>
       <div class="forget">
         <router-link :to="{path:'/forget'}">忘记密码？</router-link>
@@ -53,14 +53,8 @@ export default {
       if (this.token) {
         this.$router.replace({path: '/information'})
       }
-    },
-    blurHandle () {
-      this.inputActive = ''
-      document.querySelector('#app').style.height = 'auto'
-      setTimeout(() => {
-        document.querySelector('#app').style.height = '100%'
-      }, 20)
     }
+
   }
 }
 </script>

src/pages/account/manage/cart/index.vue

@@ -20,12 +20,13 @@
         <div class="info-con">
             <div class="i-info">
             <div class="img-product">
-              <img :src="item.goodsId===4?`${$cdn}images/banner_pro.png`:`${$cdn}images/t_product.png`" alt="">
+              <img :src="pictures[item.goodsId]" alt="">
             </div>
             <div class="info-detail">
               <div class="detail-top">
-                <img class="img-txt" :src="item.goodsId===4?`${$cdn}images/download-pro.png`:`${$cdn}images/download-lite.png`" alt="">
-                <div>标准套餐</div>
+                <img class="img-txt" :src="cameraName[item.goodsId]" alt="" v-if="item.goodsId!==7">
+                <p v-else>{{cameraName[item.goodsId]}}</p>
+                <div>{{item.goodsId===7?'通用适配型':'标准套餐'}}</div>
                 <img class="i-close" @click="rmItem(item)" :src="`${$cdn}images/i_close.png`" alt="">
               </div>
               <div class="detail-bottom">
@@ -33,11 +34,11 @@
                   CNY ￥ {{item.price}}
                 </div>
                 <div class="ipt-number">
-                  <img class="i-close" @click="reduce(item)" :src="`${$cdn}images/ic_cart_less_h@2x.png`" alt="">
+                  <img class="sniper-icon" @click="reduce(item)" :src="`${$cdn}images/ic_cart_less_h@2x.png`" alt="">
                   <div class="input-num">
                     <input v-model="item.goodsCount" disabled type="text" step="1">
                   </div>
-                  <img class="i-close" @click="add(item)" :src="`${$cdn}images/ic_cart_plus_h@2x.png`" alt="">
+                  <img class="sniper-icon" @click="add(item)" :src="`${$cdn}images/ic_cart_plus_h@2x.png`" alt="">
                 </div>
               </div>
             </div>
@@ -65,7 +66,7 @@
     <div class="no-cart-con" v-else>
       <img :src="`${$cdn}images/nocart.png`" alt="">
       <div class="nocart-txt">您的购物车是空的</div>
-      <div class="btn-submit" @click="$router.push({path:'/eight'})">继续选购</div>
+      <div class="btn-submit" @click="$router.push({path:'/purchase'})">继续选购</div>
     </div>
   </div>
 </template>
@@ -83,6 +84,7 @@ var cloneObj = function (obj) {
   }
   return newObj
 }
+
 export default {
   computed: {
     ...mapState({
@@ -97,7 +99,19 @@ export default {
     })
   },
   data () {
+    let pictures = {
+      7: `${this.$cdn}images/zhijia.png`,
+      1: `${this.$cdn}images/t_product.png`,
+      4: `${this.$cdn}images/banner_pro.png`
+    }
+    let cameraName = {
+      7: `精准拍摄支架`,
+      1: `${this.$cdn}images/download-lite.png`,
+      4: `${this.$cdn}images/download-pro.png`
+    }
     return {
+      pictures,
+      cameraName,
       checked: false,
       checkedArr: {
         0: '',

src/pages/account/manage/cart/style.scss

@@ -162,6 +162,12 @@
                 height: 18px;
                 opacity: 0.5;
               }
+              p{
+                font-size: 16px;
+                color: #000;
+                font-weight: bold;
+                margin-bottom: 8px;
+              }
             }
             .detail-bottom{
               display: flex;
@@ -195,9 +201,10 @@
                     transition: all .3s linear;
                   }
                 }
-                img{
+                .sniper-icon{
                   width: 22px;
                   height: 22px;
+                  flex-shrink: 0;
                 }
               }
             }

src/pages/account/manage/change/index.vue

@@ -13,7 +13,7 @@
             <div class="top-title">验证码</div>
             <div class="code-con">
               <div class="ant-input" >
-               <input @blur="blurHandle" v-model="code" type="text" placeholder="请输入验证码" />
+               <input v-model="code" type="text" placeholder="请输入验证码" />
               </div>
                 <button type="submit" class="ant-btn ant-btn-primary code">
                     <span v-if="!jishi" @click="getAuthCode">获取验证码</span>
@@ -26,7 +26,7 @@
           <div class="order-sub">
             <div class="top-title">密码</div>
               <div class="ant-input" >
-                <input @blur="blurHandle" v-model="password" type="password" placeholder="请输入密码" />
+                <input v-model="password" type="password" placeholder="请输入密码" />
               </div>
           </div>
         </div>
@@ -34,7 +34,7 @@
           <div class="order-sub">
             <div class="top-title">确认密码</div>
               <div class="ant-input" >
-                <input @blur="blurHandle" v-model="confirmpassword" type="password" placeholder="请再次输入密码" />
+                <input v-model="confirmpassword" type="password" placeholder="请再次输入密码" />
               </div>
           </div>
         </div>
@@ -67,12 +67,6 @@ export default {
     }
   },
   methods: {
-    blurHandle () {
-      document.querySelector('#app').style.height = 'auto'
-      setTimeout(() => {
-        document.querySelector('#app').style.height = '100%'
-      }, 20)
-    },
     async getAuthCode () {
       let {userName, country} = this.info
       let res = await this.$store.dispatch('getAuthCode', {

src/pages/account/manage/consumpdetail/consumption.js

@@ -0,0 +1,122 @@
+let capacity = [
+  [
+    {
+      key: 'childName',
+      name: '设备',
+      width: 120
+    }, {
+      key: 'orderSn',
+      name: '扩容单号',
+      width: 200
+    }, {
+      key: 'channel',
+      name: '获得渠道'
+    }, {
+      key: 'unitSize',
+      name: '容量大小'
+    }, {
+      key: 'payType',
+      name: '支付类型'
+    }, {
+      key: 'amount',
+      name: '实付金额'
+    }, {
+      key: 'validDate',
+      name: '有效期'
+    }, {
+      key: 'status',
+      name: '状态'
+    }, {
+      key: 'tradeTime',
+      name: '消费时间'
+    }
+  ]
+]
+
+let recharge = [
+  [
+    {
+      key: 'childName',
+      name: '设备'
+    },
+    {
+      key: 'status',
+      name: '充值类型'
+    }, {
+      key: 'body',
+      name: '充值名称'
+    }, {
+      key: 'points',
+      name: '点数'
+    }, {
+      key: 'tradeTime',
+      name: '消费时间'
+    }
+  ]
+]
+
+let invoice = [
+  [
+    {
+      key: 'finish',
+      name: '状态'
+    },
+    {
+      key: 'createTime',
+      name: '申请时间'
+    }, {
+      key: 'type',
+      name: '发票类型'
+    }
+  ],
+  [
+    {
+      key: 'money',
+      name: '开票金额'
+    },
+    {
+      key: 'title',
+      name: '抬头'
+    },
+    {
+      key: 'code',
+      name: '税号'
+    },
+    {
+      key: 'organizedAddress',
+      name: '注册地址'
+    },
+    {
+      key: 'registerPhone',
+      name: '电话号码'
+    },
+    {
+      key: 'bankName',
+      name: '开户银行'
+    },
+    {
+      key: 'bankAccount',
+      name: '银行账号'
+    }
+  ],
+  [
+    {
+      key: 'shipName',
+      name: '联系人'
+    },
+    {
+      key: 'shipMobile',
+      name: '联系电话'
+    },
+    {
+      key: 'shipAreaPath',
+      name: '收货地址',
+      address: 'shipAddress'
+    }
+  ]
+]
+export {
+  capacity,
+  recharge,
+  invoice
+}

src/pages/account/manage/consumpdetail/index.vue

@@ -0,0 +1,81 @@
+<template>
+  <div class="detail-layout">
+    <div v-for="(item,index) in tabActive" :key="index">
+      <p v-for="(sub,i) in item" :key="i" >
+        <span>{{sub.name}}</span>
+        <span>{{activeItem[sub.key]||'无'}}{{sub.address?activeItem[sub.address]:''}}</span>
+      </p>
+    </div>
+  </div>
+</template>
+<script>
+import {capacity, recharge, invoice} from './consumption'
+import { mapState } from 'vuex'
+
+let consumpType = {
+  0: 'capacity',
+  1: 'recharge',
+  2: 'invoice'
+}
+
+export default {
+  data () {
+    return {
+      capacity,
+      recharge,
+      invoice
+    }
+  },
+  computed: {
+    ...mapState({
+      activeItem: state => {
+        let type = Object.prototype.toString.call(state.user.recordinfo)
+        if (type === '[object Object]') {
+          return state.user.recordinfo
+        }
+        let condition = state.user.recordinfo && state.user.recordinfo !== 'null' && type !== '[object Array]'
+        return condition ? JSON.parse(state.user.recordinfo) : {}
+      }
+    }),
+    tabActive () {
+      let type = consumpType[this.$route.params.id]
+      return this[type]
+    }
+
+  },
+
+  mounted () {
+  }
+}
+</script>
+<style lang="scss" scoped>
+.detail-layout{
+  min-height: 70vh;
+  div{
+    padding: 15px;
+    background: #fff;
+    margin-top: 15px;
+    border-top: 1px solid #e7e7e7;
+    border-bottom: 1px solid #e7e7e7;
+    p{
+      margin-bottom: 15px;
+      color: #2d2d2d;
+      font-size: 12px;
+      &:first-of-type{
+        span{
+          &:last-of-type{
+            font-weight: bold;
+          }
+        }
+      }
+      span{
+        &:first-of-type{
+          display: inline-block;
+          width: 30vw;
+          color: #969696;
+        }
+      }
+    }
+  }
+}
+</style>

src/pages/account/manage/consumption/index.vue

@@ -2,14 +2,14 @@
   <div class="consumption-layout">
     <div class="plate">
       <ul class="re-list">
-        <li v-for="(item,i) in data" :key="i">
-          <template v-if="tabActive===1">
+        <li v-for="(item,i) in data" :key="i" @click="toDetail(item)">
+          <template v-if="Number(tabActive)===1">
             <p class="f-title">{{item.childName}}</p>
             <p>{{item.body}}</p>
             <div>{{item.fuhao}}{{item.points}}<i class="iconfont icon-shang"></i></div>
 
           </template>
-           <template v-else-if="tabActive===0">
+           <template v-else-if="Number(tabActive)===0">
             <p class="f-title">{{item.childName}}</p>
             <p>{{item.channel}}</p>
             <div>{{item.status}}<i class="iconfont icon-shang"></i></div>
@@ -52,6 +52,20 @@ let invoceStatusType = {
   0: '未开票',
   1: '已开票'
 }
+
+let invoiceType = {
+  1: '不需要发票',
+  2: '增值税普通发票',
+  3: '增值税专用发票'
+}
+
+let rechargeType = {
+  0: '系统赠送',
+  '-1': '支出',
+  1: '充值',
+  2: '系统退充值'
+}
+
 export default {
   props: ['tabactive'],
   components: { Paging },
@@ -71,7 +85,6 @@ export default {
       currentPage: 1,
       total: 0,
       data: [],
-      tabActive: this.tabactive,
       searchKey: '',
       pageSize: 8
     }
@@ -111,13 +124,23 @@ export default {
         let condition = state.user.invoicedevice && state.user.invoicedevice !== 'null'
         return (condition ? state.user.invoicedevice : [])
       }
-    })
+    }),
+    tabActive: function () {
+      return this.$route.params.id
+    }
   },
   methods: {
+    toDetail (item) {
+      this.$router.push({
+        name: 'consumpdetail'
+      })
+      this.$store.commit('RECORDINFO', item)
+    },
     pageChange (data) {
       this.currentPage = data
     },
     getList (searchKey = '') {
+      window.scroll(0, 0)
       let str = methodStr[this.tabActive]
       this[str](searchKey)
     },
@@ -138,6 +161,7 @@ export default {
       this.data = this.mycharge.list
       this.data.forEach(item => {
         item['fuhao'] = item['status'] === -1 ? '-' : '+'
+        item['status'] = rechargeType[item['status']]
       })
     },
     async getInvoiceList () {
@@ -153,6 +177,7 @@ export default {
       this.data = this.myinvoicelist.list
       this.data.forEach(item => {
         item['detail'] = '详细'
+        item['type'] = invoiceType[item['type']]
         item['finish'] = invoceStatusType[item['finish']]
       })
     },
@@ -179,9 +204,6 @@ export default {
     }
   },
   mounted () {
-    this.$bus.$on('selectdevice', id => {
-      this.tabActive = id
-    })
     this.getList()
   },
   watch: {
@@ -189,7 +211,7 @@ export default {
       this.getList()
     },
     tabActive (newVal) {
-      this.getList()
+      this.currentPage === 1 ? this.getList() : this.currentPage = 1
     }
   }
 }

src/pages/account/manage/device/index.vue

@@ -1,14 +1,14 @@
 <template>
   <div class="device-layout">
     <div class="plate">
-      <template v-if="tabActive===4">
+      <template v-if="Number(tabActive)===4">
         <div class="d-item" v-for="(item,i) in mydevice.list" :key="i" >
           <img :src="`${$cdn}images/banner_pro.png`" alt="">
           <img v-if="item.spaceEndTime" class="king" :src="`${$cdn}images/icon-huiyuan.png`" alt="">
 
           <div class="eight-right">
             <p class="i-title">ID:{{item.childName}}</p>
-            <p class="i-dec">云存储空间</p>
+            <p class="i-dec">{{item.spaceEndTime||'云存储空间'}}</p>
             <div class="capacity">
               <div class="c-line">
                 <div class="active" :style="{width:getBar(item.usedSpace,item.totalSpace)}"></div>
@@ -19,10 +19,7 @@
             <div class="btn-con">
               <span class="btn" @click="unbind(item)">解绑</span>
               <span class="btn" @click="$router.push({name:'introduce',params:{id:item.childName}})">扩容</span>
-              <span class="btn primary"  v-if="!item.spaceEndTime" @click="$router.push({name:'privilege',params: {
-          cameraId: item.id,
-          childName: item.childName
-        }})">升级</span>
+              <span class="btn primary"  v-if="!item.spaceEndTime" @click="$router.push({name:'introduce',params:{id:item.childName}})">升级</span>
               <span class="btn" @click="$router.push({name:'introduce',params:{id:item.childName}})" v-else >续期</span>
             </div>
           </div>
@@ -74,7 +71,6 @@ export default {
     ]
     return {
       tabList,
-      tabActive: 4,
       currentPage: 1,
       total: 0,
       searchKey: '',
@@ -92,7 +88,11 @@ export default {
         let condition = state.user.mydevice && state.user.mydevice !== 'null' && type !== '[object Array]'
         return (condition ? JSON.parse(state.user.mydevice) : {})
       }
-    })
+    }),
+    tabActive: function () {
+      return this.$route.params.id
+    }
+
   },
   methods: {
     getPercent (a, b) {
@@ -162,9 +162,6 @@ export default {
   },
   mounted () {
     this.getList()
-    this.$bus.$on('selectdevice', id => {
-      this.tabActive = id
-    })
   },
   watch: {
     currentPage () {

src/pages/account/manage/index.vue

@@ -5,7 +5,7 @@
       <span v-if="title==='我的设备'" @click="addDevice" class="btns">
         +添加设备
       </span>
-      <span v-if="consumpselected.id===2&&title==='消费记录'" @click="openInvoice" class="btns">
+      <span v-if="Number(consumpselected.id)===2&&title==='消费记录'" @click="openInvoice" class="btns">
         开具发票
       </span>
       <div v-if="title==='我的设备'" class="select" ref="mbMenu1" @click="selectedActive=!selectedActive">
@@ -21,7 +21,7 @@
         </div>
       </div>
     </div>
-    <router-view :tabactive='consumpselected.id' />
+    <router-view />
   </div>
 </template>
 
@@ -34,6 +34,7 @@ let titleName = {
   'myscene': '我的场景',
   'device': '我的设备',
   'consumption': '消费记录',
+  'consumpdetail': '记录详细',
   'change': '修改密码',
   'confirm': '确认订单',
   'submit': '确认订单',
@@ -42,6 +43,18 @@ let titleName = {
   'payselect': '支付方式',
   'cart': '购物车'
 }
+
+let recid = {
+  0: '扩容记录',
+  1: '充值记录',
+  2: '增值发票'
+}
+
+let deviceid = {
+  0: 'Lite',
+  4: 'Pro'
+}
+
 export default {
   computed: {
     ...mapState({
@@ -49,7 +62,22 @@ export default {
       language: state => state.language.current
     }),
     title: function () {
+      if (this.$route.name === 'consumpdetail') {
+        return this.consumpselected.name
+      }
       return titleName[this.$route.name]
+    },
+    consumpselected: function () {
+      return {
+        name: recid[this.$route.params.id],
+        id: this.$route.params.id
+      }
+    },
+    selected: function () {
+      return {
+        name: deviceid[this.$route.params.id],
+        id: this.$route.params.id
+      }
     }
   },
   methods: {
@@ -64,12 +92,12 @@ export default {
       })
     },
     emithandle (item) {
-      this.selected = item
-      this.$bus.$emit('selectdevice', item.id)
+      this.$router.push({name: 'device', params: {id: item.id}})
     },
     emithandlerecord (item) {
-      this.consumpselected = item
-      this.$bus.$emit('selectdevice', item.id)
+      this.$router.push({name: 'consumption', params: {id: item.id}})
+      // this.consumpselected = item
+      // this.$bus.$emit('selectdevice', item.id)
     }
   },
   data () {
@@ -94,18 +122,11 @@ export default {
         id: 2
       }
     ]
+
     return {
       selectedActive: false,
       selectType,
-      consumpType,
-      selected: {
-        name: 'Pro',
-        id: 4
-      },
-      consumpselected: {
-        name: '扩容记录',
-        id: 0
-      }
+      consumpType
     }
   },
   mounted () {

src/pages/account/manage/information/index.vue

@@ -1,5 +1,15 @@
 <template>
   <div class="information-layout">
+    <div class="top-con">
+      <img :src="`${$cdn}images/info-bg.png`" alt="">
+      <div class="tc">
+        <div>
+          <p>{{content.content||'尚未开通任何会员'}}</p>
+          <!-- <p>{{addstar(info.userName)}}</p> -->
+        </div>
+        <div class="btn" @click="$router.push({name:'purchase'})">立即购买</div>
+      </div>
+    </div>
     <div class="user-con">
       <div class="user-top">
         <div class="user-img" :style="{backgroundImage:`url(${info.head||`${$cdn}images/head-default.png`})`}">
@@ -135,10 +145,29 @@ export default {
     return {
       isShowAddress: true,
       tempSelect: '',
-      isShowInvoice: true
+      isShowInvoice: true,
+      content: ''
     }
   },
   methods: {
+    addstar (item) {
+      let back = item.substring(7, 12)
+      let font = item.substring(0, 3)
+      return font + '*****' + back
+    },
+    async getInfo () {
+      let res = await this.$http
+        .post('/user/camera/deadline', {}, {
+          headers: {
+            token: this.token
+          }
+        })
+      let data = res.data
+      if (data.code !== 0) {
+        return false
+      }
+      this.content = data.data
+    },
     getCurrentStatus (data) {
       this.tempSelect = data
     },
@@ -169,6 +198,7 @@ export default {
     }
   },
   mounted () {
+    this.getInfo()
     this.$store.dispatch('getInfo', {
       url: '/user/getReceiverInfo',
       name: 'address'

src/pages/account/manage/information/style.scss

@@ -18,7 +18,49 @@
   margin-left: 5px;
 }
 .information-layout{
+  $theme-color: #1fe4dc;
+
   margin-top: 20px;
+  .top-con{
+    position: relative;
+    width: 100%;
+    margin-bottom: 10px;
+    img{
+      width: 100%;
+    }
+    .tc{
+      color: #fff;
+      width: 80%;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      transform: translate(-50%,-50%);
+      p{
+        font-size: 12px;
+        &:first-of-type{
+          font-weight: bold;
+          font-size: 16px;
+          margin-bottom: 5px;
+        }
+      }
+      .btn{
+        background: $theme-color;
+        color: #000000;
+        display: inline-block;
+        width: 85px;
+        text-align: center;
+        height: 25px;
+        line-height: 25px;
+        border-radius: 6px;
+        font-weight: bold;
+        flex-shrink: 0;
+        margin-left: 10px;
+      }
+    }
+  }
   .user-con{
     width: 100%;
     display: flex;

src/pages/account/manage/myscene/index.vue

@@ -102,7 +102,7 @@ export default {
       this.currentPage = data
     },
     async getList () {
-      document.querySelector('#app').scrollTo(0, 0)
+      window.scrollTo(0, 0)
 
       let params = {
         pageNum: this.currentPage,

src/pages/account/manage/order/index.vue

@@ -94,7 +94,8 @@ export default {
       this.currentPage = data
     },
     async getList () {
-      document.querySelector('#app').scrollTo(0, 0)
+      window.scrollTo(0, 0)
+
       let params = {
         type: '',
         pageNum: this.currentPage,
@@ -150,7 +151,8 @@ export default {
     goPay (item) {
       this.$store.commit('ORDERINFO', {
         orderSn: item.orderSn,
-        price: item.goodsAmount
+        price: item.goodsAmount,
+        orderType: 0
       })
       this.$router.push({
         name: 'payselect',

src/pages/account/manage/payselect/index.vue

@@ -11,7 +11,7 @@
         </form>
       </div>
     </div>
-    <div class="btn-back" @click="$router.replace({path:'/order'})">返回</div>
+    <div class="btn-back" @click="$router.back()">返回</div>
   </div>
 </template>
 
@@ -25,6 +25,12 @@ let PAYS = {
   2: 'paypal'
 }
 
+// let to = {
+//   0: {path: '/order'},
+//   1: {path: '/order'},
+//   2: {path: '/order'}
+// }
+
 export default {
   computed: {
     ...mapState({

src/pages/account/manage/submit/index.vue

@@ -54,13 +54,14 @@
       <div class="confirm-products">
         <div class="confirm-products-item" v-for="(item,i) in payinfo.goods" :key="i">
           <div class="product-thumb">
-            <img :src="item.goodsId===4?`${$cdn}images/banner_pro.png`:`${$cdn}images/t_product.png`" alt="">
+            <img :src="pictures[item.goodsId]" alt="">
           </div>
           <div class="product-info">
             <div class="product-name">
-                <img class="img-txt" :src="item.goodsId===4?`${$cdn}images/download-pro.png`:`${$cdn}images/download-lite.png`" alt="">
+              <img class="img-txt" :src="cameraName[item.goodsId]" alt="" v-if="item.goodsId!==7">
+              <p class="img-p" v-else>{{cameraName[item.goodsId]}}</p>
             </div>
-            <div class="product-name">标准套餐</div>
+            <div class="product-name">{{item.goodsId===7?'通用适配型':'标准套餐'}}</div>
             <div class="product-count">
               <span class="product-price">CNY ￥{{item.price}} x {{item.goodsCount}}</span>
               <span class="product-sum">CNY ￥{{item.price}}</span>
@@ -137,7 +138,19 @@ export default {
     })
   },
   data () {
+    let pictures = {
+      7: `${this.$cdn}images/zhijia.png`,
+      1: `${this.$cdn}images/t_product.png`,
+      4: `${this.$cdn}images/banner_pro.png`
+    }
+    let cameraName = {
+      7: `精准拍摄支架`,
+      1: `${this.$cdn}images/download-lite.png`,
+      4: `${this.$cdn}images/download-pro.png`
+    }
     return {
+      pictures,
+      cameraName,
       selected: false,
       isWeixin: browser.weixin,
       orderId: '',
@@ -164,7 +177,8 @@ export default {
 
       this.$store.commit('ORDERINFO', {
         orderSn: res.data.data.orderSn,
-        price: res.data.data.goodsAmount
+        price: res.data.data.goodsAmount,
+        orderType: 0
       })
       this.$store.dispatch('getCart')
       let data = {

src/pages/account/manage/submit/style.scss

@@ -130,6 +130,9 @@
             .img-txt{
               width: 90px;
             }
+            .img-p{
+              font-weight: bold;
+            }
           }
           .product-count{
             display: flex;

src/pages/account/register/index.vue

@@ -8,7 +8,7 @@
     <div class="login-con">
       <div class="input-con" :class="{inputActive:inputActive==='nickname'}">
         <img :src="`${$cdn}images/icon/icon-user@2x.png`" alt="">
-        <input v-model="nickname" @focus="inputActive='nickname'" @blur="blurHandle" type="text" placeholder="昵称">
+        <input v-model="nickname" @focus="inputActive='nickname'" @blur="inputActive=''" type="text" placeholder="昵称">
       </div>
       <div class="input-con" :class="{inputActive:inputActive==='phone'}">
         <img :src="`${$cdn}images/icon/icon-phone@2x.png`" alt="">
@@ -23,23 +23,23 @@
             </li>
           </ul>
         </div>
-        <input oninput="value=value.replace(/[^\d]/g,'')" v-model="phone" @focus="inputActive='phone'" @blur="blurHandle" type="text" placeholder="手机">
+        <input oninput="value=value.replace(/[^\d]/g,'')" v-model="phone" @focus="inputActive='phone'" @blur="inputActive=''" type="text" placeholder="手机">
       </div>
       <div class="code-con">
         <div class="input-con" :class="{inputActive:inputActive==='code'}">
           <img :src="`${$cdn}images/icon/icon-code@2x.png`" style="width:23px;" alt="">
-          <input v-model="authCode" @focus="inputActive='code'" @blur="blurHandle" style="padding-left:6px;" type="text" placeholder="输入验证码">
+          <input v-model="authCode" @focus="inputActive='code'" @blur="inputActive=''" style="padding-left:6px;" type="text" placeholder="输入验证码">
         </div>
         <div v-if="!jishi" class="btns" @click="getAuthCode">获取验证码</div>
         <span class="btns" v-else>{{interTime}}s后重新发送</span>
       </div>
       <div class="input-con"  :class="{inputActive:inputActive==='password'}">
         <img :src="`${$cdn}images/icon/icon-password@2x.png`" alt="">
-        <input v-model="password" @focus="inputActive='password'" @blur="blurHandle" type="password" placeholder="密码">
+        <input v-model="password" @focus="inputActive='password'" @blur="inputActive=''" type="password" placeholder="密码">
       </div>
       <div class="input-con"  :class="{inputActive:inputActive==='confirm'}">
         <img :src="`${$cdn}images/icon/icon-confirm@2x.png`" alt="">
-        <input v-model="confirmPass" @focus="inputActive='confirm'" @blur="blurHandle" type="password" placeholder="再次输入密码">
+        <input v-model="confirmPass" @focus="inputActive='confirm'" @blur="inputActive=''" type="password" placeholder="再次输入密码">
       </div>
       <div class="agree">
         <input type="checkbox" v-model="isAgree">
@@ -87,13 +87,7 @@ export default {
     })
   },
   methods: {
-    blurHandle () {
-      this.inputActive = ''
-      document.querySelector('#app').style.height = 'auto'
-      setTimeout(() => {
-        document.querySelector('#app').style.height = '100%'
-      }, 20)
-    },
+
     selectItem (item) {
       this.showSelect = false
       this.codeActive = item

src/pages/cases/index.vue

@@ -30,7 +30,7 @@
           <div class="c-title">
               <span>{{item.sceneName}}</span>
               <div>
-                <img :src="`${$cdn}images/eye.png`" alt>
+                <img :src="item.sceneScheme>=4?`${$cdn}images/eye-pro.png`:`${$cdn}images/eye_lite.png`" alt>
                 <span>{{item.sceneScheme>=4?'Pro':'Lite'}}</span>
               </div>
           </div>
@@ -130,7 +130,7 @@ export default {
       location.href = temp1.replace('http://', 'https://')
     },
     async getData () {
-      document.querySelector('#app').scrollTo(0, 0)
+      window.scrollTo(0, 0)
 
       let params = {
         pageSize: this.pageSize,

src/pages/cases/style.scss

@@ -146,14 +146,11 @@
         align-items: center;
         div{
           width: 20%;
-          vertical-align: middle;
           text-align: right;
           img{
-            width: 20%;
-            vertical-align: middle;
+            width: 30%;
           }
           span{
-            vertical-align: middle;
             color: #2d2d2d;
           }
         }

src/pages/check/index.vue

@@ -17,7 +17,7 @@
         </div>
       </div>
       <div class="check-footer">
-        <div class="btn" @click="$router.replace({path:'/order'})">稍后支付</div>
+        <div class="btn" @click="backto">稍后支付</div>
         <div class="btn" @click="queryOrderStatus">完成支付</div>
       </div>
     </div>
@@ -42,14 +42,25 @@ export default {
     })
   },
   methods: {
+    backto () {
+      let to = this.orderinfo.orderType === 0 ? {
+        path: '/order'
+      } : {
+        name: 'device',
+        params: {
+          id: 4
+        }
+      }
+      this.$router.replace(to)
+    },
     async queryOrderStatus () {
-      let {orderSn} = this.orderinfo
+      let {orderSn, orderType} = this.orderinfo
       if (!orderSn) {
         return this.$toast.show('error', '获取订单信息失败')
       }
       let params = {
         orderSn,
-        orderType: 0,
+        orderType,
         payType: 0
       }
       let res = await this.$http

src/pages/introduce/style.scss

@@ -0,0 +1,302 @@
+.introtow-layout{
+  $font-color:#2d2d2d;
+  $theme-color:#1fe4dc;
+  .p-tag{
+    background-color: #ffe8e8;
+    display: inline-block;
+    color: #f04c42;
+    font-size: 10px;
+    padding: 2px 4px;
+    border-radius: 4px;
+    margin-bottom: 0;
+  }
+  
+  .it-header{
+    padding: 18px 0 23px;
+    .capacity{
+      padding: 0 12px;
+      .c-line{
+        width: 40%;
+        height: 6px;
+        border-radius: 5px;
+        background-color: #ccc;
+        overflow: hidden;
+        .active{
+          background-color: $theme-color;
+          height: 100%;
+        }
+      }
+      .c-dec{
+        padding-top: 4px;
+        color: #969696;
+        font-size: 12px;
+      }
+      
+    }
+  }
+  .it-txt{
+    &>p{
+      margin-bottom: 6px;
+      padding-left: 10px;
+      color: #969696;
+      font-size: 12px;
+      &:first-child{
+        font-weight: bold;
+        font-size: 16px;
+        color: #2d2d2d;
+      }
+    }
+  }
+  .point-list{
+    background-color: #f7f7f7;
+    padding: 15px 0;
+    &>p{
+      &:first-child{
+        font-size: 18px;
+      }
+    }
+    .card-scroll{
+      overflow-y: hidden;
+      overflow-x: scroll;
+      white-space: nowrap;
+      margin-left: 12px;
+      &::-webkit-scrollbar{
+        display: none;
+      }
+      .card-item{
+        width: 160px;
+        display: inline-block;
+        background-color: #fff;
+        margin-right: 8px;
+        padding: 12px;
+        p{
+          font-size: 14px;
+          font-weight: bold;
+          margin-bottom: 6px;
+          span{
+            font-size: 20px;
+          }
+          i{
+            color: #ccc;
+            font-size: 10px;
+            text-decoration: line-through;
+            margin-left: 4px;
+          }
+        }
+        .top-card{
+          position: relative;
+          width: 100%;
+          margin-bottom: 6px;
+          img{
+            width: 100%;
+          }
+          div{
+            text-align: center;
+            color: #fff;
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%,-50%);
+            p{
+              font-size: 28px;
+              margin: 0;
+              font-weight: normal;
+              &:last-of-type{
+                position: relative;
+                font-size: 12px;
+                margin-top: 5px;
+                min-width: 100px;
+                &::after, &::before{
+                  content: '';
+                  display: inline-block;
+                  background: #fff;
+                  height: 2px;
+                  width: 12px;
+                  vertical-align: middle;
+                  margin: 0 5px;
+                  position: relative;
+                  top: -2px;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  .point-qa{
+    padding: 12px;
+    .qa-item{
+      p{
+        font-size: 12px;
+        margin-bottom: 10px;
+        color: #969696;
+        line-height: 1.5;
+        &:first-child{
+          color: #2d2d2d;
+          font-weight: bold;
+          font-size: 14px;
+          margin-bottom: 6px;
+        }
+      }
+    }
+  }
+  .hover-mask{
+    position: fixed;
+    background: rgba($color: #000000, $alpha: 0.2);
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    transform: translateY(100%);
+    transition: 0.3s ease transform;
+    .h-con{
+      width: 100%;
+      height: 65vh;
+      border-top-right-radius: 30px;
+      border-top-left-radius: 30px;
+      background: #fff;
+      bottom: 0;
+      position: fixed;
+      .h-title{
+        text-align: center;
+        line-height: 45px;
+        border-bottom:1px solid #e7e7e7;
+        font-size: 18px;
+      }
+      .point-card{
+        color: $font-color;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        background-color: #fff;
+        padding: 12px;
+        margin: 36px 16px 42px;
+        width: calc(100% - 32px);
+        box-shadow: 0 0 16px rgba($color: #000000, $alpha: 0.2);
+        .p-left{
+          flex: 4;
+          p{
+            line-height: 1;
+            font-size: 16px;
+            font-weight: bold;
+            margin-bottom: 8px;
+            &:last-of-type{
+              margin-top: 8px;
+              color: #969696;
+              font-size: 10px;
+              font-weight: normal;
+            }
+          }
+        }
+        .p-right{
+          flex: 3;
+          .top-card{
+            position: relative;
+            width: 100%;
+            img{
+              width: 100%;
+            }
+            div{
+              text-align: center;
+              color: #fff;
+              position: absolute;
+              top: 50%;
+              left: 50%;
+              transform: translate(-50%,-50%);
+              p{
+                font-size: 28px;
+                font-weight: normal;
+                &:last-of-type{
+                  font-size: 12px;
+                  margin-top: 5px;
+                  min-width: 100px;
+                  &::after, &::before{
+                    content: '';
+                    display: inline-block;
+                    background: #fff;
+                    height: 2px;
+                    width: 12px;
+                    vertical-align: middle;
+                    margin: 0 5px;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+      .poinit-detail{
+        border-top:1px solid #e7e7e7;
+        .pd-title{
+          padding: 16px;
+          display: flex;
+          justify-content: space-between;
+          div{
+            font-weight: bold;
+            i{
+              color: #ccc;
+              font-size: 10px;
+              text-decoration: line-through;
+              margin-left: 4px;
+            }
+          }
+        }
+        .point-qa{
+          padding: 0 16px;
+          overflow: auto;
+          height: calc(65vh - 320px);
+          .qa-item{
+            p{
+              font-size: 12px;
+              margin-bottom: 10px;
+              color: #969696;
+              line-height: 1.5;
+              &:first-child{
+                color: #2d2d2d;
+                font-weight: bold;
+                font-size: 14px;
+                margin-bottom: 6px;
+              }
+            }
+          }
+        }
+      }
+      .point-pay{
+        position: absolute;
+        bottom: 0;
+        background: #fff;
+        border-top:1px solid #e7e7e7;
+        width: 100%;
+        height: 48px;
+        line-height: 48px;
+        padding-left: 16px;
+        display: flex;
+        justify-content: space-between;
+        .pp-left{
+          font-size: 23px;
+          font-weight: bold;
+          span{
+            font-weight: normal;
+            color: #969696;
+            font-size: 14px;
+          }
+          i{
+            font-size: 14px;
+            font-weight: bold;
+          }
+        }
+        .btn{
+          font-size: 16px;
+          text-align: center;
+          width: 125px;
+          background: $theme-color;
+        }
+      }
+    }
+  }
+  .hover-active{
+    transform: none;
+  }
+}

src/pages/introtow/index.vue

@@ -1,57 +1,207 @@
 <template>
- <div class="introtow-layout">
-   <div class="it-header it-txt">
-     <p>ID:asdasd</p>
-     <p>剩余点数：2000</p>
-   </div>
-   <div class="point-list it-txt">
-     <p>限时抢购点数包</p>
-     <p>购买立即生效</p>
-     <div class="card-scroll">
-       <div class="card-item" v-for="(item,i) in 3" :key="i">
-         <div></div>
-         <p>小号点数包</p>
-         <p>￥<span>539</span><i>￥600</i></p>
-         <p class="p-tag">限时活动</p>
-       </div>
-     </div>
-   </div>
-   <div class="point-qa">
-     <div class="qa-item" v-for="(item,i) in qa" :key="i">
-       <p>{{item.q}}</p>
-       <p>{{item.a}}</p>
-     </div>
-   </div>
- </div>
+  <div class="introtow-layout">
+    <div class="it-header it-txt">
+      <p>ID:：{{detail.childName}}</p>
+      <p>剩余点数：{{detail.balance}}</p>
+    </div>
+    <div class="point-list it-txt">
+      <p>限时抢购点数包</p>
+      <p>购买立即生效</p>
+      <div class="card-scroll">
+        <div @click="toPay(item)" class="card-item" v-for="(item,i) in type" :key="i">
+          <div class="top-card">
+            <img :src="`${$cdn}images/card-bg1.png`" alt />
+            <div>
+              <p>{{item.price}}</p>
+              <p>立即抢购</p>
+            </div>
+          </div>
+          <p>小号点数包</p>
+          <p>
+            ￥
+            <span>{{item.capacity}}</span>
+            <i>￥{{item.price}}</i>
+          </p>
+          <p class="p-tag">限时活动</p>
+        </div>
+      </div>
+    </div>
+    <div class="point-qa">
+      <div class="qa-item" v-for="(item,i) in qa" :key="i">
+        <p>{{item.q}}</p>
+        <p>{{item.a}}</p>
+      </div>
+    </div>
+    <div class="hover-mask" @touchmove.prevent @click="payactive=!payactive" :class="{'hover-active':payactive}">
+      <div class="h-con" @click.stop>
+        <p class="h-title">购买扩容包</p>
+        <div class="point-card">
+          <div class="p-left">
+            <p>小号扩容包</p>
+            <p>购买点数计算存储更多场景</p>
+          </div>
+          <div class="p-right">
+            <div class="top-card">
+              <img :src="`${$cdn}images/card-bg1.png`" alt />
+              <div>
+                <p>{{item.price}}</p>
+                <p>立即抢购</p>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="poinit-detail">
+          <div class="pd-title">
+            <span>售卖价</span>
+            <div>
+              <span class="p-tag">限时优惠</span>
+              <i>￥{{item.dollarPrice}}</i>
+              ￥{{item.price}}
+            </div>
+          </div>
+          <div class="point-qa" @touchmove.stop>
+            <div class="qa-item" v-for="(item,i) in qa" :key="i">
+              <p v-html="item.q"></p>
+              <p v-html="item.a"></p>
+            </div>
+          </div>
+        </div>
+        <div class="point-pay">
+          <div class="pp-left">
+            <span>应付金额：</span>
+            <i>￥</i>
+            {{item.price}}
+          </div>
+          <div class="btn" @click="pay">前往支付</div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
+import { mapState } from 'vuex'
 
 export default {
-
+  computed: {
+    ...mapState({
+      token: state => state.user.token
+    })
+  },
   data () {
+    let type = [
+      {
+        capacity: '600点',
+        price: '600',
+        dollarPrice: '600'
+      },
+      {
+        capacity: '800点',
+        price: '800',
+        dollarPrice: '800'
+      },
+      {
+        dollarPrice: '1000',
+        capacity: '1000点',
+        price: '1000'
+      }
+    ]
     let qa = [
       {
         q: '为什么需要点数充值？',
-        a: '当您的基础点数不足99点时，最新拍摄的场景将无法生成，通过购买点数则可以计算存储更多场景。'
+        a: '答：当您的基础点数不足99点时，最新拍摄的场景将无法生成，通过购买点数则可以计算存储更多场景。'
       }, {
         q: '点数充值之后还可以退款吗？',
-        a: '不可以，因为点数充值之后，相应点数会立即到账生效，所以不接受中途退款，敬请谅解。'
+        a: '答：不可以，因为点数充值之后，相应点数会立即到账生效，所以不接受中途退款，敬请谅解。'
       }, {
         q: '删除场景后会返还点数吗？',
-        a: '点数充值没有有效期，所以消费后代表永久记录您的美好空间，删除场景后不会返还。'
+        a: '答：点数充值没有有效期，所以消费后代表永久记录您的美好空间，删除场景后不会返还。'
       }, {
         q: '点数不足还可继续拍摄上传吗？',
-        a: '点数不足时，不影响设备正常的拍摄，但会无法上传计算，这时只能进行删除操作；直到您的点数满足消费，此时您才可以将拍摄的场景上传计算，随之可查看、编辑和分享。'
+        a: '答：点数不足时，不影响设备正常的拍摄，但会无法上传计算，这时只能进行删除操作；直到您的点数满足消费，此时您才可以将拍摄的场景上传计算，随之可查看、编辑和分享。'
       }
     ]
     return {
-      qa
+      payactive: false,
+      qa,
+      detail: '',
+      type,
+      currentId: '',
+      orderSn: '',
+      item: ''
+    }
+  },
+  mounted () {
+    this.getDetail()
+  },
+  methods: {
+    async getDetail () {
+      let { id } = this.$route.params
+      let params = {
+        childName: id
+      }
+      let result = await this.$http({
+        method: 'post',
+        data: params,
+        headers: {
+          token: this.token
+        },
+        url: '/user/camera/detail'
+      })
+      let data = result.data
+      if (data.code !== 0) {
+        return this.$toast.show('error', '获取设备详情失败')
+      }
+      this.detail = data.data
+    },
+    toPay (item) {
+      this.payactive = !this.payactive
+      this.item = item
+    },
+    async pay () {
+      let { price } = this.item
+
+      let params = {
+        cameraId: this.detail.id,
+        points: price,
+        payType: 0,
+        abroad: this.language === 'en' ? 1 : 0
+      }
+
+      let res = await this.$http.post('/user/order/rechargeOrder', params, {
+        headers: {
+          token: this.token
+        }
+      })
+
+      let data = res.data
+      if (data.code !== 0) {
+        return this.$toast.show('error', '获取订单信息失败')
+      }
+      let { id, orderSn } = data.data
+      this.currentId = id
+      this.orderSn = orderSn
+      this.goPay({ id, orderSn })
+    },
+
+    goPay (item) {
+      this.$store.commit('ORDERINFO', {
+        orderSn: item.orderSn,
+        price: item.goodsAmount || 0,
+        orderType: 1
+      })
+      this.$router.push({
+        name: 'payselect',
+        params: {
+          orderId: item.id || 1,
+          orderType: 1
+        }
+      })
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import './style.scss';
+@import "./style.scss";
 </style>

src/pages/introtow/style.scss

@@ -1,78 +1,119 @@
-.introtow-layout{
-  .it-header{
+.introtow-layout {
+  $font-color: #2d2d2d;
+  $theme-color: #1fe4dc;
+  .p-tag {
+    background-color: #ffe8e8;
+    display: inline-block;
+    color: #f04c42;
+    font-size: 10px;
+    padding: 2px 4px;
+    border-radius: 4px;
+    margin-bottom: 0;
+  }
+  .it-header {
     height: 74px;
     padding: 18px 0 23px;
   }
-  .it-txt{
-    &>p{
+  .it-txt {
+    & > p {
       margin-bottom: 6px;
       padding-left: 10px;
       color: #969696;
       font-size: 12px;
-      &:first-child{
+      &:first-child {
         font-weight: bold;
         font-size: 16px;
         color: #2d2d2d;
       }
     }
   }
-  .point-list{
+  .point-list {
     background-color: #f7f7f7;
     padding: 15px 0;
-    &>p{
-      &:first-child{
+    & > p {
+      &:first-child {
         font-size: 18px;
       }
     }
-    .card-scroll{
+    .card-scroll {
       overflow-y: hidden;
       overflow-x: scroll;
       white-space: nowrap;
       margin-left: 12px;
-      &::-webkit-scrollbar{
+      &::-webkit-scrollbar {
         display: none;
       }
-      .card-item{
-        width: 135px;
+      .card-item {
+        width: 160px;
         display: inline-block;
         background-color: #fff;
         margin-right: 8px;
         padding: 12px;
-        .p-tag{
-          background-color: #ffe8e8;
-          display: inline-block;
-          color: #f04c42;
-          font-size: 10px;
-          padding: 2px 4px;
-          border-radius: 4px;
-          margin-bottom: 0;
-        }
-        p{
+        p {
           font-size: 14px;
           font-weight: bold;
           margin-bottom: 6px;
-          span{
+          span {
             font-size: 20px;
           }
-          i{
+          i {
             color: #ccc;
             font-size: 10px;
             text-decoration: line-through;
             margin-left: 4px;
           }
         }
+        .top-card {
+          position: relative;
+          width: 100%;
+          margin-bottom: 6px;
+          img {
+            width: 100%;
+          }
+          div {
+            text-align: center;
+            color: #fff;
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            p {
+              font-size: 28px;
+              margin: 0;
+              font-weight: normal;
+              &:last-of-type {
+                position: relative;
+                font-size: 12px;
+                margin-top: 5px;
+                min-width: 100px;
+                &::after,
+                &::before {
+                  content: "";
+                  display: inline-block;
+                  background: #fff;
+                  height: 2px;
+                  width: 12px;
+                  vertical-align: middle;
+                  margin: 0 5px;
+                  position: relative;
+                  top: -2px;
+                }
+              }
+            }
+          }
+        }
       }
     }
   }
-  .point-qa{
+  .point-qa {
     padding: 12px;
-    .qa-item{
-      p{
+    .qa-item {
+      p {
         font-size: 12px;
         margin-bottom: 10px;
         color: #969696;
         line-height: 1.5;
-        &:first-child{
+        &:first-child {
           color: #2d2d2d;
           font-weight: bold;
           font-size: 14px;
@@ -81,4 +122,162 @@
       }
     }
   }
-}
+  .hover-mask {
+    position: fixed;
+    background: rgba($color: #000000, $alpha: 0.2);
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    transform: translateY(100%);
+    transition: 0.3s ease transform;
+    .h-con {
+      width: 100%;
+      height: 65vh;
+      border-top-right-radius: 30px;
+      border-top-left-radius: 30px;
+      background: #fff;
+      bottom: 0;
+      position: fixed;
+      .h-title {
+        text-align: center;
+        line-height: 45px;
+        border-bottom: 1px solid #e7e7e7;
+        font-size: 18px;
+      }
+      .point-card {
+        color: $font-color;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        background-color: #fff;
+        padding: 12px;
+        margin: 36px 16px 42px;
+        width: calc(100% - 32px);
+        box-shadow: 0 0 16px rgba($color: #000000, $alpha: 0.2);
+        .p-left {
+          flex: 4;
+          p {
+            font-size: 16px;
+            font-weight: bold;
+            margin-bottom: 8px;
+            &:last-of-type {
+              margin-top: 8px;
+              color: #969696;
+              font-size: 10px;
+              font-weight: normal;
+            }
+          }
+        }
+        .p-right {
+          flex: 3;
+          .top-card {
+            position: relative;
+            width: 100%;
+            img {
+              width: 100%;
+            }
+            div {
+              text-align: center;
+              color: #fff;
+              position: absolute;
+              top: 50%;
+              left: 50%;
+              transform: translate(-50%, -50%);
+              p {
+                font-size: 28px;
+                font-weight: normal;
+                &:last-of-type {
+                  font-size: 12px;
+                  margin-top: 5px;
+                  min-width: 100px;
+                  &::after,
+                  &::before {
+                    content: "";
+                    display: inline-block;
+                    background: #fff;
+                    height: 2px;
+                    width: 12px;
+                    vertical-align: middle;
+                    margin: 0 5px;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+      .poinit-detail {
+        border-top: 1px solid #e7e7e7;
+        .pd-title {
+          padding: 16px;
+          display: flex;
+          justify-content: space-between;
+          div {
+            font-weight: bold;
+            i {
+              color: #ccc;
+              font-size: 10px;
+              text-decoration: line-through;
+              margin-left: 4px;
+            }
+          }
+        }
+        .point-qa {
+          padding: 0 16px;
+          overflow: auto;
+          height: calc(65vh - 320px);
+          .qa-item {
+            p {
+              font-size: 12px;
+              margin-bottom: 10px;
+              color: #969696;
+              line-height: 1.5;
+              &:first-child {
+                color: #2d2d2d;
+                font-weight: bold;
+                font-size: 14px;
+                margin-bottom: 6px;
+              }
+            }
+          }
+        }
+      }
+      .point-pay {
+        position: absolute;
+        bottom: 0;
+        background: #fff;
+        border-top: 1px solid #e7e7e7;
+        width: 100%;
+        height: 48px;
+        line-height: 48px;
+        padding-left: 16px;
+        display: flex;
+        justify-content: space-between;
+        .pp-left {
+          font-size: 23px;
+          font-weight: bold;
+          span {
+            font-weight: normal;
+            color: #969696;
+            font-size: 14px;
+          }
+          i {
+            font-size: 14px;
+            font-weight: bold;
+          }
+        }
+        .btn {
+          font-size: 16px;
+          text-align: center;
+          width: 125px;
+          background: $theme-color;
+        }
+      }
+    }
+  }
+  .hover-active {
+    transform: none;
+  }
+}

src/pages/layout/header.vue

@@ -90,6 +90,9 @@ export default {
       language: state => state.language.current
     }),
     isAccout: function () {
+      if (this.$route.name === 'introduce' || this.$route.name === 'introtow') {
+        return true
+      }
       if (this.$route.matched.length > 0) {
         return this.$route.matched[0]['name'] === 'manage'
       }
@@ -119,11 +122,11 @@ export default {
       },
       {
         name: '我的设备',
-        to: {path: '/device'}
+        to: {name: 'device', params: {id: 4}}
       },
       {
         name: '消费记录',
-        to: {path: '/consumption'}
+        to: {name: 'consumption', params: {id: 0}}
       },
       {
         name: '修改密码',

src/pages/payresult/index.vue

@@ -18,7 +18,7 @@
         <span>CNY ￥{{orderinfo.price||'*****'}}</span>
       </div>
     </div>
-    <div class="btn-submit" @click="$router.replace({path:'/order'})">我的订单</div>
+    <div class="btn-submit" @click="backto">{{orderinfo.orderType===0?'我的订单':'我的设备'}}</div>
   </div>
 </template>
 
@@ -57,7 +57,17 @@ export default {
     })
   },
   methods: {
-
+    backto () {
+      let to = this.orderinfo.orderType === 0 ? {
+        path: '/order'
+      } : {
+        name: 'device',
+        params: {
+          id: 4
+        }
+      }
+      this.$router.replace(to)
+    }
   }
 }
 </script>

src/pages/purchase/index.vue

@@ -1,24 +1,22 @@
 <template>
   <div class="purchase-layout">
     <div class="plate01">
-      <div class="top">
-        <span @click="$router.push({name:'eight'})">{{langPurchase.top1}}</span>
-        <span @click="scrollTo('jsgg')">{{langPurchase.top2}}</span>
-      </div>
       <div class="main-layout">
         <img class="pro" :src="`${$cdn}images/banner_pro.png`" alt="">
         <div class="txt-con">
           <img class="p-logo" :src="`${$cdn}images/pro-logo-m.png`" alt="">
           <div class="p-label" v-html="langPurchase.dec"></div>
-          <div class="p-price">{{langPurchase.price}}</div>
+          <div class="p-price">{{selectParts?langPurchase.addzhijia:langPurchase.price}}</div>
         </div>
         <div class="attr-con">
           <div class="attr">{{langPurchase.color.key}}</div>
           <div class="box color">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt>
             <i class="iconfont icon-yuandian"></i>
             {{langPurchase.color.val}}</div>
           <div class="attr">{{langPurchase.service.key}}</div>
           <div class="box service">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt>
             <ul>
               <li v-for="(item,i) in langPurchase.service.val1" :key="i" v-html="item"></li>
             </ul>
@@ -28,7 +26,8 @@
             </ul>
           </div>
           <div class="attr">{{langPurchase.gift.key}}</div>
-          <div class="box zhijia">
+          <div class="box zhijia" :class="{'no-active':!selectParts}" @click="selectParts=!selectParts">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click"  alt>
             <img :src="`${$cdn}images/zhijia.png`" alt>
             <span>{{langPurchase.gift.val}}</span>
           </div>
@@ -60,7 +59,6 @@
 import { mapState } from 'vuex'
 
 import spinner from '@/components/spinner'
-import { getPosition } from '@/util'
 
 export default {
   components: {
@@ -74,7 +72,8 @@ export default {
   },
   data () {
     return {
-      count: 1
+      count: 1,
+      selectParts: true
     }
   },
   methods: {
@@ -90,21 +89,14 @@ export default {
         goodsCount: this.count,
         skuSn: 'U15609161635760015'
       }
+      let zhijia = {
+        goodsId: 7,
+        goodsCount: this.count,
+        skuSn: 'U15604134406280073'
+      }
       await this.$store.dispatch('addCart', params)
+      this.selectParts && await this.$store.dispatch('addCart', zhijia)
       this.$router.push({path: '/cart'})
-    },
-    scrollTo (href) {
-      this.interval = null
-      let inter = 0
-      let tag = getPosition(this.$refs[href]).y - 48
-      let speed = Math.ceil(tag / 40)
-      this.interval = setInterval(() => {
-        inter += speed
-        document.querySelector('#app').scrollTo(0, Math.min(inter, tag))
-        if ((document.querySelector('#app').scrollTop) >= tag) {
-          clearInterval(this.interval)
-        }
-      })
     }
   }
 }

src/pages/purchase/style.scss

@@ -71,6 +71,16 @@
           color: rgba(0,0,0,.45);
           padding: 0 63px;
           box-sizing: border-box;
+          position: relative;
+          .t-click{
+            position: absolute;
+            right: 0;
+            bottom: 0;
+            margin: 0;
+            width: 16px;
+            height: 16px;
+            padding: 0;
+          }
         }
         .color{
           height: 50px;
@@ -132,6 +142,13 @@
         .count{
           margin: 0;
         }
+        .no-active{
+          border: 1px solid #e3e3e3;
+          background-color: #fff;
+          .t-click{
+            display: none;
+          }
+        }
         .btn{
           cursor: pointer;
           width: 100%;

src/pages/purchasetwo/index.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="purchase-layout">
     <div class="plate01">
-      <div class="top">
-        <span @click="$router.push({name:'binocular'})">{{langPurchase.top1}}</span>
-        <span @click="scrollTo('jsgg')">{{langPurchase.top2}}</span>
-      </div>
       <div class="main-layout">
         <img class="pro" :src="`${$cdn}images/t_product.png`" alt="">
         <div class="txt-con">
@@ -15,10 +11,12 @@
         <div class="attr-con">
           <div class="attr">{{langPurchase.color.key}}</div>
           <div class="box color">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt>
             <i class="iconfont icon-yuandian"></i>
             {{langPurchase.color.val}}</div>
           <div class="attr">{{langPurchase.service.key}}</div>
           <div class="box service">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt>
             <ul>
               <li v-for="(item,i) in langPurchase.service.val1" :key="i" v-html="item"></li>
             </ul>
@@ -29,6 +27,7 @@
           </div>
           <div class="attr">{{langPurchase.gift.key}}</div>
           <div class="box zhijia">
+            <img :src="`${$cdn}images/tag-icon.png`" class="t-click" alt>
             <img :src="`${$cdn}images/zhijia.png`" alt>
             <span>{{langPurchase.gift.val}}</span>
           </div>
@@ -60,7 +59,6 @@
 import { mapState } from 'vuex'
 
 import spinner from '@/components/spinner'
-import { getPosition } from '@/util'
 
 export default {
   components: {
@@ -137,19 +135,6 @@ export default {
       }
       await this.$store.dispatch('addCart', params)
       this.$router.push({path: '/cart'})
-    },
-    scrollTo (href) {
-      this.interval = null
-      let inter = 0
-      let tag = getPosition(this.$refs[href]).y - 48
-      let speed = Math.ceil(tag / 40)
-      this.interval = setInterval(() => {
-        inter += speed
-        document.querySelector('#app').scrollTo(0, Math.min(inter, tag))
-        if ((document.querySelector('#app').scrollTop) >= tag) {
-          clearInterval(this.interval)
-        }
-      })
     }
   }
 }

src/pages/purchasetwo/style.scss

@@ -71,6 +71,16 @@
           color: rgba(0,0,0,.45);
           padding: 0 63px;
           box-sizing: border-box;
+          position: relative;
+          .t-click{
+            position: absolute;
+            right: 0;
+            bottom: 0;
+            margin: 0;
+            width: 16px;
+            height: 16px;
+            padding: 0;
+          }
         }
         .color{
           height: 50px;
@@ -132,6 +142,13 @@
         .count{
           margin: 0;
         }
+        .no-active{
+          border: 1px solid #e3e3e3;
+          background-color: #fff;
+          .t-click{
+            display: none;
+          }
+        }
         .btn{
           cursor: pointer;
           width: 100%;

src/router/index.js

@@ -92,17 +92,23 @@ let router = new Router({
         },
         {
           name: 'device',
-          path: '/device',
+          path: '/device/:id',
           component: resolve => require(['@/pages/account/manage/device'], resolve),
           meta: {requireAuth: true}
         },
         {
           name: 'consumption',
-          path: '/consumption',
+          path: '/consumption/:id',
           component: resolve => require(['@/pages/account/manage/consumption'], resolve),
           meta: {requireAuth: true}
         },
         {
+          name: 'consumpdetail',
+          path: '/consumpdetail/:id',
+          component: resolve => require(['@/pages/account/manage/consumpdetail'], resolve),
+          meta: {requireAuth: true}
+        },
+        {
           name: 'order',
           path: '/order',
           component: resolve => require(['@/pages/account/manage/order'], resolve),
@@ -244,10 +250,10 @@ router.afterEach((to, from) => {
       }
       setTimeout(() => {
         window.skip = true
-        document.querySelector('#app').scrollTo(0, top - 70)
+        window.scrollTo(0, top - 70)
       })
     } else {
-      document.querySelector('#app').scrollTo(0, 0)
+      window.scrollTo(0, 0)
     }
   }
 })

src/store/language/cn/home.js

@@ -71,46 +71,46 @@ export default{
     }
   },
   items: [
-    {url: 'https://www.4dkankan.com/showPC.html?m=x2kIkoCB',
+    {url: 'https://www.4dkankan.com/showApp.html?m=x2kIkoCB',
       image: baseUrl + 'images/phone_7.jpg',
       icon: baseUrl + 'images/phone_icon_7.png',
-      text: '万豪' },
+      text: '万豪酒店' },
     {url: 'https://admin.4dmuseum.cn/showApp.html?m=241&bigScene&novr',
       image: baseUrl + 'images/phone_2.jpg',
       icon: baseUrl + 'images/phone_icon_2.png',
       text: '广东省博物馆' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=laaVIiT7',
+    {url: 'http://www.4dkankan.com/showApp.html?m=laaVIiT7',
       image: baseUrl + 'images/phone_3.jpg',
       icon: baseUrl + 'images/phone_icon_3.png',
-      text: '海昏侯' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=OOM185Kf',
+      text: '海昏侯考古成果展' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=OOM185Kf',
       image: baseUrl + 'images/phone_4.jpg',
       icon: baseUrl + 'images/phone_icon_4.png',
-      text: '华发' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=djryzBtW',
+      text: '华发地产' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=djryzBtW',
       image: baseUrl + 'images/phone_5.jpg',
       icon: baseUrl + 'images/phone_icon_5.png',
-      text: '欧派' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=ImlLYDW8',
+      text: '欧派橱柜' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=ImlLYDW8',
       image: baseUrl + 'images/phone_6.jpg',
       icon: baseUrl + 'images/phone_icon_6.png',
-      text: '融信' },
-    {url: 'https://www.cgaii.com/museum/cultural/index.html',
+      text: '融信地产' },
+    {url: 'https://www.4dkankan.com/showApp.html?m=X99yIvTq',
       image: baseUrl + 'images/phone_1.jpg',
       icon: baseUrl + 'images/phone_icon_1.png',
       text: '德国陶瓷博物馆' },
-    {url: 'https://www.4dkankan.com/showPC.html?m=iTz0LxLs',
+    {url: 'https://www.4dkankan.com/showApp.html?m=iTz0LxLs',
       image: baseUrl + 'images/phone_8.jpg',
       icon: baseUrl + 'images/phone_icon_8.png',
-      text: '万科' },
-    {url: 'https://www.4dkankan.com/showPC.html?m=0mVvxHHT',
+      text: '万科地产' },
+    {url: 'https://www.4dkankan.com/showApp.html?m=0mVvxHHT',
       image: baseUrl + 'images/phone_9.jpg',
       icon: baseUrl + 'images/phone_icon_9.png',
-      text: '伟星' },
+      text: '伟星地产' },
     {url: 'https://admin.4dmuseum.cn/showApp.html?m=240&bigScene&novr',
       image: baseUrl + 'images/phone_10.jpg',
       icon: baseUrl + 'images/phone_icon_10.png',
-      text: '武侯祠' }
+      text: '宝鸡青铜博物院' }
   ],
   reports: {
     name: '媒体报道',

src/store/language/cn/purchase.js

@@ -4,6 +4,7 @@ export default{
   dec: '15分钟快速三维重建，全自动生成数字3D空间，实时计算空间尺寸，12K分辨率，支持4倍放大',
   yushou: '【新品预售】',
   price: 'RMB 9,800',
+  addzhijia: 'RMB 10,395',
   buy: '立即购买',
   tiaokuan: '* 付款成功后5个工作日内发货，默认顺丰快递包邮',
   guige: {
@@ -72,7 +73,7 @@ export default{
     ]
   },
   gift: {
-    key: '赠品',
+    key: '配件选购',
     val: ' 官方拍摄支架 x 1'
   },
   count: {

src/store/language/en/home.js

@@ -71,46 +71,46 @@ export default{
     }
   },
   items: [
-    {url: 'https://www.4dkankan.com/showPC.html?m=x2kIkoCB',
+    {url: 'https://www.4dkankan.com/showApp.html?m=x2kIkoCB',
       image: baseUrl + 'images/phone_7.jpg',
       icon: baseUrl + 'images/phone_icon_7.png',
-      text: '万豪' },
+      text: '万豪酒店' },
     {url: 'https://admin.4dmuseum.cn/showApp.html?m=241&bigScene&novr',
       image: baseUrl + 'images/phone_2.jpg',
       icon: baseUrl + 'images/phone_icon_2.png',
       text: '广东省博物馆' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=laaVIiT7',
+    {url: 'http://www.4dkankan.com/showApp.html?m=laaVIiT7',
       image: baseUrl + 'images/phone_3.jpg',
       icon: baseUrl + 'images/phone_icon_3.png',
-      text: '海昏侯' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=OOM185Kf',
+      text: '海昏侯考古成果展' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=OOM185Kf',
       image: baseUrl + 'images/phone_4.jpg',
       icon: baseUrl + 'images/phone_icon_4.png',
-      text: '华发' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=djryzBtW',
+      text: '华发地产' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=djryzBtW',
       image: baseUrl + 'images/phone_5.jpg',
       icon: baseUrl + 'images/phone_icon_5.png',
-      text: '欧派' },
-    {url: 'http://www.4dkankan.com/showPC.html?m=ImlLYDW8',
+      text: '欧派橱柜' },
+    {url: 'http://www.4dkankan.com/showApp.html?m=ImlLYDW8',
       image: baseUrl + 'images/phone_6.jpg',
       icon: baseUrl + 'images/phone_icon_6.png',
-      text: '融信' },
-    {url: 'https://www.cgaii.com/museum/cultural/index.html',
+      text: '融信地产' },
+    {url: 'https://www.4dkankan.com/showApp.html?m=X99yIvTq',
       image: baseUrl + 'images/phone_1.jpg',
       icon: baseUrl + 'images/phone_icon_1.png',
       text: '德国陶瓷博物馆' },
-    {url: 'https://www.4dkankan.com/showPC.html?m=iTz0LxLs',
+    {url: 'https://www.4dkankan.com/showApp.html?m=iTz0LxLs',
       image: baseUrl + 'images/phone_8.jpg',
       icon: baseUrl + 'images/phone_icon_8.png',
-      text: '万科' },
-    {url: 'https://www.4dkankan.com/showPC.html?m=0mVvxHHT',
+      text: '万科地产' },
+    {url: 'https://www.4dkankan.com/showApp.html?m=0mVvxHHT',
       image: baseUrl + 'images/phone_9.jpg',
       icon: baseUrl + 'images/phone_icon_9.png',
-      text: '伟星' },
+      text: '伟星地产' },
     {url: 'https://admin.4dmuseum.cn/showApp.html?m=240&bigScene&novr',
       image: baseUrl + 'images/phone_10.jpg',
       icon: baseUrl + 'images/phone_icon_10.png',
-      text: '武侯祠' }
+      text: '宝鸡青铜博物院' }
   ],
   reports: {
     name: 'Media coverage',

src/store/language/en/purchase.js

@@ -4,6 +4,7 @@ export default{
   dec: '15分钟快速三维重建，全自动生成数字3D空间，实时计算空间尺寸，12K分辨率，支持4倍放大',
   yushou: '【新品预售】',
   price: 'RMB 9,800',
+  addzhijia: 'RMB 10,395',
   buy: '立即购买',
   tiaokuan: '* 付款成功后5个工作日内发货，默认顺丰快递包邮',
   guige: {
@@ -72,7 +73,7 @@ export default{
     ]
   },
   gift: {
-    key: '赠品',
+    key: '配件选购',
     val: ' 官方拍摄支架 x 1'
   },
   count: {

src/store/user.js

@@ -13,6 +13,7 @@ let fdkankantoken = Cookies.get('4dkankantoken') || ''
 let cart = (localStorage && localStorage.getItem('cart')) || []
 let payinfo = (localStorage && localStorage.getItem('payinfo')) || {}
 let orderinfo = (localStorage && localStorage.getItem('orderinfo')) || {}
+let recordinfo = (localStorage && localStorage.getItem('recordinfo')) || {}
 
 let invoice2 = (localStorage && localStorage.getItem('invoice2')) || []
 let invoice3 = (localStorage && localStorage.getItem('invoice3')) || []
@@ -42,8 +43,10 @@ export default {
     myexpansion: '',
     mycharge: '',
     myinvoicelist: '',
+    invoicedevice: '',
     payinfo,
     orderinfo,
+    recordinfo,
     invoice2: invoice2,
     invoice3: invoice3,
     ...dataObj
@@ -85,11 +88,16 @@ export default {
     },
 
     ORDERINFO (state, data) {
-      console.log(data)
       state.orderinfo = data
       localStorage.setItem('orderinfo', JSON.stringify(data))
     },
 
+    RECORDINFO (state, data) {
+      console.log(data)
+      state.recordinfo = data
+      localStorage.setItem('recordinfo', JSON.stringify(data))
+    },
+
     PAYINFO (state, data) {
       state.payinfo = data
       localStorage.setItem('payinfo', JSON.stringify(data))
@@ -119,6 +127,11 @@ export default {
       localStorage.setItem('myinvoicelist', JSON.stringify(data))
     },
 
+    INVOICEDEVICE (state, data) {
+      state.invoicedevice = data
+      localStorage.setItem('invoicedevice', JSON.stringify(data))
+    },
+
     myOrder (state, data) {
       state.myorder = data
       localStorage.setItem('myorder', JSON.stringify(data))
@@ -354,6 +367,21 @@ export default {
       let data = res.data
       if (data.code !== 0) return
       context.commit('MYINVOICELIST', data.data)
+    },
+
+    async getInvoiceDevice (context, params) {
+      let res = await http({
+        method: 'post',
+        data: params,
+        headers: {
+          token: context.state.token
+        },
+        url: '/user/camera/getAll'
+      })
+
+      let data = res.data
+      if (data.code !== 0) return
+      context.commit('INVOICEDEVICE', data.data)
     }
   }
 }