用户中心，充值中心，会员中心完成，添加代理商模块

src/App.vue

@@ -51,7 +51,7 @@ export default {
 }
 
 .cu-btn-primary {
-  background-image: url("../static/images/index/Rectangle.png");
+  background-image: url("https://img.shuimuai.com/web/Rectangle.png");
   background-position: center;
   background-size: 100% 100%;
   width: 100%;

src/app.json

@@ -1,12 +1,28 @@
 {
   "pages": [
     "pages/index/main",
-    "pages/logs/main",
-    "pages/counter/main",
     "pages/start/main",
     "pages/report/main",
     "pages/game_record/main",
-    "pages/user_center/main"
+    "pages/user_center/main",
+    "pages/user_center/edit/main",
+    "pages/user_center/edit/confirm_phone_first/main",
+    "pages/user_center/edit/confirm_phone_finally/main",
+    "pages/user_center/orders/main",
+    "pages/user_center/vip/main",
+    "pages/user_center/vip_code/main",
+    "pages/user_center/recharge/main",
+    "pages/user_center/address/edit/main",
+    "pages/user_center/address/list/main",
+    "pages/agent/index/main",
+    "pages/agent/customer/main",
+    "pages/agent/extend/detail/main",
+    "pages/agent/extend/orders/main",
+    "pages/agent/income_cal/main",
+    "pages/agent/invite_card_inventory/main",
+    "pages/agent/settlement_center/index/main",
+    "pages/agent/settlement_center/withdraw/detail/main",
+    "pages/agent/settlement_center/withdraw/list/main"
   ],
   "window": {
     "backgroundTextStyle": "light",

src/components/banner.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="banner_container">
-    <img src="../../static/images/index/banner1.png" class="full_img main_banner" alt="">
+    <img src="https://img.shuimuai.com/web/banner1.png" class="full_img main_banner" alt="">
     <button class="cu-btn bg-yellow text-white join_button">立即参与</button>
   </div>
 </template>

src/components/device/device.vue

@@ -153,6 +153,7 @@ export default {
     open_scan() {
       let $this = this
       wx.scanCode({
+        onlyFromCamera:true,
         success: (res) => {
           let $data = res
           if ($data.result) {

src/components/index/personal.vue

@@ -140,9 +140,11 @@ export default {
     close_pop() {
       this.pop_show = false
     },
-    //跳转充值页面
-    to_recharge(){
-
+    //跳转充值中心
+    to_recharge() {
+      mpvue.navigateTo({
+        url: "/pages/user_center/recharge/main"
+      })
     }
   },
   mounted() {

src/components/index/scan.vue

@@ -22,7 +22,9 @@
     name:'scan_container',
     methods:{
       open_scan(){
-        wx.scanCode()
+        wx.scanCode({
+          onlyFromCamera:true
+        })
       },
       toLogin(){
         this.$emit('changeStatus','login')

src/components/user_center/order_list.css

@@ -0,0 +1,9 @@
+.order_icon {
+  width: 37px;
+  height: 37px;
+}
+
+.thumb_container {
+  width: 100%;
+  text-align: center;
+}

src/components/user_center/order_list.vue

@@ -0,0 +1,93 @@
+<template>
+  <div id="order_list_container">
+    <van-card
+      v-for="(order,index) in orders"
+      :key="index"
+    >
+      <!--      抬头部分-->
+      <div slot="title" class="flex justify-between">
+        <div>
+          <text class="text-gray">订单号&nbsp;</text>
+          <text class>{{ order.sn }}</text>
+        </div>
+        <div>
+          <text class="text-gray">{{ order.create_time }}</text>
+          <view class="text-right">
+            <template v-if="order.status">
+              <text class="text-bold">交易完成</text>
+            </template>
+            <template>
+              <text>待支付</text>
+            </template>
+          </view>
+        </div>
+      </div>
+      <!--      图标部分-->
+      <div slot="thumb" class="thumb_container">
+        <img  src="https://img.shuimuai.com/web/icon_dingdan.png" class="order_icon" alt="">
+      </div>
+      <!--      消费产品-->
+      <div slot="desc">
+        <div>
+          <text class="text-gray">消费产品&nbsp;</text>
+          <text>{{ order.production.name }} x {{ order.production.count }}</text>
+        </div>
+        <div class="padding-tb-lg flex justify-between align-center">
+          <div>
+            <text class="text-gray">付款方式&nbsp;</text>
+            <template v-if="order.pay_type == 'wechat'">
+              <text class="text-bold">微信支付</text>
+            </template>
+            <template>
+              <text>其他支付</text>
+            </template>
+          </div>
+          <div>
+            <text class="text-gray">实付款&nbsp;</text>
+            <text class="text-gray text-xxl">{{ order.total_price }}</text>
+          </div>
+
+        </div>
+      </div>
+
+      <!--      联系客服的按钮-->
+      <div slot="price">
+        <!--        <van-button type="default" open-type="contact">联系客服</van-button>-->
+        <button class="cu-btn" open-type="contact">联系客服</button>
+
+      </div>
+    </van-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "order_list",
+  props: ['status'],
+  data() {
+    return {
+      orders: [
+        {
+          id: 1,
+          sn: "201708161601",
+          production:
+            {
+              id: 1,
+              name: '钻石会员卡',
+              count: 1
+            }
+          ,
+          total_price: 23678.99,
+          pay_type: 'wechat',
+          status: 2,
+          create_time: "2018/09/24 10:44"
+        }
+      ],
+    }
+  }
+}
+</script>
+
+<style>
+@import "order_list.css";
+</style>

src/pages/agent/customer/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/customer/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/customer/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/extend/detail/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/extend/detail/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/extend/detail/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/extend/orders/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/extend/orders/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/extend/orders/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/income_cal/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/income_cal/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/income_cal/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/index/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/index/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/index/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/invite_card_inventory/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/invite_card_inventory/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/invite_card_inventory/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/settlement_center/index/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/settlement_center/index/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/settlement_center/index/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/settlement_center/withdraw/detail/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/settlement_center/withdraw/detail/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/settlement_center/withdraw/detail/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/agent/settlement_center/withdraw/list/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div id="agent_index_container">
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: "agent_index_container",
+  components: {},
+  data() {
+    return {
+    }
+  },
+  methods: {
+  },
+  mounted() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/agent/settlement_center/withdraw/list/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/agent/settlement_center/withdraw/list/main.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {
+  }
+}

src/pages/bak/index_bak.vue

@@ -1,126 +1,2 @@
-<template>
-  <div @click="clickHandle">
-
-    <div class="userinfo" @click="bindViewTap">
-      <img class="userinfo-avatar" v-if="userInfo.avatarUrl" :src="userInfo.avatarUrl" background-size="cover" />
-      <img class="userinfo-avatar" src="/static/images/user.png" background-size="cover" />
-
-      <div class="userinfo-nickname">
-        <card :text="userInfo.nickName"></card>
-      </div>
-    </div>
-
-    <div class="usermotto">
-      <div class="user-motto">
-        <card :text="motto"></card>
-      </div>
-    </div>
-
-    <form class="form-container">
-      <input type="text" class="form-control" :value="motto" placeholder="v-model" />
-      <input type="text" class="form-control" v-model="motto" placeholder="v-model" />
-      <input type="text" class="form-control" v-model.lazy="motto" placeholder="v-model.lazy" />
-    </form>
-
-    <a href="/pages/counter/main" class="counter">去往Vuex示例页面</a>
-
-    <div class="all">
-        <div class="left">
-        </div>
-        <div class="right">
-        </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import card from '@/components/card'
-
-export default {
-  data () {
-    return {
-      motto: 'Hello miniprograme',
-      userInfo: {
-        nickName: 'mpvue',
-        avatarUrl: 'http://mpvue.com/assets/logo.png'
-      }
-    }
-  },
-
-  components: {
-    card
-  },
-
-  methods: {
-    bindViewTap () {
-      const url = '../logs/main'
-      if (mpvuePlatform === 'wx') {
-        mpvue.switchTab({ url })
-      } else {
-        mpvue.navigateTo({ url })
-      }
-    },
-    clickHandle (ev) {
-      console.log('clickHandle:', ev)
-      // throw {message: 'custom test'}
-    }
-  },
-
-  created () {
-    // let app = getApp()
-  }
-}
-</script>
-
-<style scoped>
-.userinfo {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.userinfo-avatar {
-  width: 128rpx;
-  height: 128rpx;
-  margin: 20rpx;
-  border-radius: 50%;
-}
-
-.userinfo-nickname {
-  color: #aaa;
-}
-
-.usermotto {
-  margin-top: 150px;
-}
-
-.form-control {
-  display: block;
-  padding: 0 12px;
-  margin-bottom: 5px;
-  border: 1px solid #ccc;
-}
-.all{
-  width:7.5rem;
-  height:1rem;
-  background-color:blue;
-}
-.all:after{
-  display:block;
-  content:'';
-  clear:both;
-}
-.left{
-  float:left;
-  width:3rem;
-  height:1rem;
-  background-color:red;
-}
-
-.right{
-  float:left;
-  width:4.5rem;
-  height:1rem;
-  background-color:green;
-}
-</style>
+<!--    公用按钮-->
+<button class="cu-btn lg cu-btn-primary text-white text-center" @click="open_scan">扫码连接脑环</button>

src/pages/counter/index.vue

@@ -1,44 +0,0 @@
-<template>
-  <div class="counter-warp">
-    <p>Vuex counter：{{ count }}</p>
-    <p>
-      <button @click="increment">+</button>
-      <button @click="decrement">-</button>
-    </p>
-  </div>
-</template>
-
-<script>
-// Use Vuex
-import store from './store'
-
-export default {
-  computed: {
-    count () {
-      return store.state.count
-    }
-  },
-  methods: {
-    increment () {
-      store.commit('increment')
-    },
-    decrement () {
-      store.commit('decrement')
-    }
-  }
-}
-</script>
-
-<style>
-.counter-warp {
-  text-align: center;
-  margin-top: 100px;
-}
-.home {
-  display: inline-block;
-  margin: 100px auto;
-  padding: 5px 10px;
-  color: blue;
-  border: 1px solid blue;
-}
-</style>

src/pages/counter/main.js

@@ -1,5 +0,0 @@
-import Vue from 'vue'
-import App from './index'
-
-const app = new Vue(App)
-app.$mount()

src/pages/counter/store.js

@@ -1,24 +0,0 @@
-// https://vuex.vuejs.org/zh-cn/intro.html
-// make sure to call Vue.use(Vuex) if using a module system
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-Vue.use(Vuex)
-
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment: (state) => {
-      const obj = state
-      obj.count += 1
-    },
-    decrement: (state) => {
-      const obj = state
-      obj.count -= 1
-    }
-  }
-})
-
-export default store

src/pages/index/index.vue

@@ -64,8 +64,10 @@ export default {
       this.status = $status
     },
     //跳转充值中心
-    to_recharge(){
-
+    to_recharge() {
+      mpvue.navigateTo({
+        url: "/pages/user_center/recharge/main"
+      })
     }
   },
   mounted() {

src/pages/logs/index.vue

@@ -1,61 +0,0 @@
-<template>
-  <div>
-      <swiper v-if="imgUrls.length > 0" indidator-dots="imgUrls.length > 1" >
-      <block v-for="(item, index) in imgUrls" :key="index" >
-        <swiper-item>
-          <image :src="item" mode="scaleToFill"></image>
-        </swiper-item>
-      </block>
-    </swiper>
-
-    <ul class="container log-list">
-      <li v-for="(log, index) in logs" :class="{ red: aa }" :key="index" class="log-item">
-        <card :text="(index + 1) + ' . ' + log"></card>
-      </li>
-    </ul>
-  </div>
-</template>
-
-<script>
-import { formatTime } from '@/utils/index'
-import card from '@/components/card'
-
-export default {
-  components: {
-    card
-  },
-
-  data () {
-    return {
-      logs: [],
-      imgUrls: [
-        'http://mss.sankuai.com/v1/mss_51a7233366a4427fa6132a6ce72dbe54/newsPicture/05558951-de60-49fb-b674-dd906c8897a6',
-        'http://mss.sankuai.com/v1/mss_51a7233366a4427fa6132a6ce72dbe54/coursePicture/0fbcfdf7-0040-4692-8f84-78bb21f3395d',
-        'http://mss.sankuai.com/v1/mss_51a7233366a4427fa6132a6ce72dbe54/management-school-picture/7683b32e-4e44-4b2f-9c03-c21f34320870'
-      ]
-    }
-  },
-
-  created () {
-    let logs
-    if (mpvuePlatform === 'my') {
-      logs = mpvue.getStorageSync({key: 'logs'}).data || []
-    } else {
-      logs = mpvue.getStorageSync('logs') || []
-    }
-    this.logs = logs.map(log => formatTime(new Date(log)))
-  }
-}
-</script>
-
-<style>
-.log-list {
-  display: flex;
-  flex-direction: column;
-  padding: 40rpx;
-}
-
-.log-item {
-  margin: 10rpx;
-}
-</style>

src/pages/logs/main.js

@@ -1,5 +0,0 @@
-import Vue from 'vue'
-import App from './index'
-
-const app = new Vue(App)
-app.$mount()

src/pages/logs/main.json

@@ -1,3 +0,0 @@
-{
-  "navigationBarTitleText": "查看启动日志"
-}

src/pages/user_center/address/edit/index.css

@@ -0,0 +1,7 @@
+.button_container{
+  padding: 10px;
+  position: absolute;
+  bottom: 50px;
+  text-align: center;
+  width: 100%;
+}

src/pages/user_center/address/edit/index.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="uc_address_edit_container">
+    <van-field
+      :value="address_info.username"
+      required
+      clearable
+      label="收货人"
+      placeholder="收货人姓名"
+    />
+    <van-field
+      :value="address_info.phone"
+      required
+      clearable
+      label="手机号"
+      placeholder="收货人手机号"
+    />
+    <van-field
+      :value="address_info.city"
+      required
+      clearable
+      label="所在地区"
+      placeholder="选择省/市/区"
+      is-link
+    />
+    <van-field
+      :value="address_info.detail"
+      required
+      clearable
+      label="详细地址"
+      placeholder="请填写详细地址"
+    />
+    <div class="button_container">
+      <button class="cu-btn lg cu-btn-primary text-white text-center padding" @click="choose_ok">保存并使用</button>
+    </div>
+  </div>
+</template>
+
+<script>
+
+var $this
+export default {
+  name: "uc_address_edit_container",
+  components: {},
+  data() {
+    return {
+      address_info: {
+        username: "",
+        phone: "",
+        city: "",
+        detail: ""
+      }
+    }
+  },
+  methods: {
+    //保存并使用
+    choose_ok() {
+      $this.to_address_list()
+    },
+    //  跳转到地址列表
+    to_address_list() {
+      // mpvue.navigateTo({
+      //   url: "/pages/user_center/address/list/main"
+      // })
+      mpvue.navigateBack({
+        delta:1
+      })
+    }
+  }
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/address/edit/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/address/edit/main.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {
+    "van-field": "../../../../static/vant/field/index",
+    "van-row": "../../../../static/vant/row/index",
+    "van-col": "../../../../static/vant/col/index"
+  }
+}

src/pages/user_center/address/list/index.vue

@@ -0,0 +1,48 @@
+<template>
+  <div class="uc_address_list_container">
+    <van-cell-group>
+      <van-cell :label="userinfo.address" url="/pages/user_center/address/edit/main">
+        <view class="cu-avatar lg round margin-lr"
+              :style="'background-image:url('+userinfo.avatar+');'" slot="icon"></view>
+
+        <view slot="title">
+          <text class="text-bold">{{userinfo.nickname}}</text>
+          &emsp;
+          <text class="text-gray text-sm">{{userinfo.phone}}</text>
+        </view>
+      </van-cell>
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+
+var $this
+export default {
+  name: "uc_address_list_container",
+  components: {},
+  data() {
+    return {
+      userinfo: {
+        avatar: "https://img.shuimuai.com/web/icon_dingdan.png",
+        nickname: "吴亦凡",
+        phone: "13677889905",
+        address: "广东省深圳市南山区海岸时代公寓A2313"
+      }
+    }
+  },
+  methods: {}
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/address/list/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/address/list/main.json

@@ -0,0 +1,8 @@
+{
+  "usingComponents": {
+    "van-row": "../../../../static/vant/row/index",
+    "van-col": "../../../../static/vant/col/index",
+    "van-cell": "../../../../static/vant/cell/index",
+    "van-cell-group": "../../../../static/vant/cell-group/index"
+  }
+}

src/pages/user_center/edit/confirm_phone_finally/index.css

@@ -0,0 +1,16 @@
+/*头像*/
+.main_icon {
+  width: 96px;
+  height: 83px;
+  margin: 50px auto;
+}
+
+.main_content {
+  width: 100%;
+}
+
+.bottom_button{
+  position: absolute;
+  bottom: 50px;
+  width: 100%;
+}

src/pages/user_center/edit/confirm_phone_finally/index.vue

@@ -0,0 +1,123 @@
+<template>
+  <div class="uc_edit_container">
+    <div class="main_content text-center">
+      <img src="https://img.shuimuai.com/sign_phone_shuimu.png" class="main_icon" alt="">
+      <view class="solid-bottom text-xl padding">
+        <text class="text-black text-bold">验证当前手机号 {{ phone }}</text>
+      </view>
+      <view class=" text-sm">
+        <text class="text-gray sub-title">为了你的账号安全，请输入验证码</text>
+      </view>
+
+      <van-field
+        value="+86"
+        center
+        label="国家"
+        readonly
+        :custom-style='custom_style'
+      >
+      </van-field>
+
+      <van-field
+        :value="new_phone"
+        label="手机号"
+        placeholder="请输入手机号"
+        maxlength="11"
+        error-message="手机号格式错误"
+        :custom-style="custom_style"
+        type="number"
+      />
+
+      <van-field
+        :value="sms"
+        center
+        clearable
+        label="短信验证码"
+        placeholder="请输入短信验证码"
+        use-button-slot
+        :custom-style='custom_style'
+      >
+        <van-button slot="button" size="small" type="primary" @click="sand_sms"
+        >发送验证码
+        </van-button
+        >
+      </van-field>
+      <div class="padding bottom_button">
+        <button class="cu-btn lg cu-btn-primary text-white text-center " @click="confirm_modify">确定修改</button>
+      </div>
+    </div>
+    <van-toast id="van-toast"/>
+  </div>
+</template>
+
+<script>
+import Toast from '../../../../../static/vant/toast/toast';
+
+var $this
+export default {
+  name: "uc_edit_container",
+  components: {},
+  data() {
+    return {
+      base_phone: "18802603801",
+      phone: "18802603801",
+      sms: "",
+      custom_style: `width: 330px;
+            height: 49px;
+            background: rgba(242, 243, 255, 0.6);
+            box-shadow: 0px 3px 7px 0px rgba(159, 159, 159, 0.84);
+            border-radius: 10px;
+            margin: 20px auto;
+      `,
+      new_phone: ""
+    }
+  },
+  methods: {
+    //假隐藏
+    cut_phone($val) {
+      let start = $val.slice(0, 4);
+
+      let end = $val.slice(-2);
+      return start + '******' + end;
+    },
+    //  发送验证码
+    sand_sms() {
+      if (!$this.new_phone) {
+        Toast.fail('手机号不为空')
+      }
+      let $param = {
+        phone: $this.new_phone
+      }
+      $this.$fly.post('user/get-code', $param).then((res) => {
+        let $data = res.data
+        if ($data.code != 200) {
+          Toast.fail($data.errmsg)
+        }
+      })
+    },
+    //确认修改
+    confirm_modify() {
+      // 修改成功跳转个人首页
+      // mpvue.reLaunch({
+      //   url:"/pages/user_center/edit/main"
+      // })
+      mpvue.navigateBack({
+        delta: 2
+      })
+    }
+  }
+  ,
+  mounted() {
+    $this.phone = $this.cut_phone($this.phone)
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/edit/confirm_phone_finally/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/edit/confirm_phone_finally/main.json

@@ -0,0 +1,11 @@
+{
+  "usingComponents": {
+    "van-popup": "../../../../static/vant/popup/index",
+    "van-icon": "../../../../static/vant/icon/index",
+    "van-cell": "../../../../static/vant/cell/index",
+    "van-cell-group": "../../../../static/vant/cell-group/index",
+    "van-field": "../../../../static/vant/field/index",
+    "van-button": "../../../../static/vant/button/index",
+    "van-toast": "../../../../static/vant/toast/index"
+  }
+}

src/pages/user_center/edit/confirm_phone_first/index.css

@@ -0,0 +1,16 @@
+/*头像*/
+.main_icon {
+  width: 96px;
+  height: 83px;
+  margin: 50px auto;
+}
+
+.main_content {
+  width: 100%;
+}
+
+.bottom_button{
+  position: absolute;
+  bottom: 50px;
+  width: 100%;
+}

src/pages/user_center/edit/confirm_phone_first/index.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="uc_edit_container">
+    <div class="main_content text-center">
+      <img src="https://img.shuimuai.com/sign_phone_shuimu.png" class="main_icon" alt="">
+      <view class="solid-bottom text-xl padding">
+        <text class="text-black text-bold">验证当前手机号 {{ phone }}</text>
+      </view>
+      <view class=" text-sm">
+        <text class="text-gray sub-title">为了你的账号安全，请输入验证码</text>
+      </view>
+
+      <van-field
+        :value="sms"
+        center
+        clearable
+        label="短信验证码"
+        placeholder="请输入短信验证码"
+        use-button-slot
+        :custom-style=custom_style
+      >
+        <van-button slot="button" size="small" type="primary" @click="sand_sms"
+        >发送验证码
+        </van-button
+        >
+      </van-field>
+      <div class="padding bottom_button">
+        <button class="cu-btn lg cu-btn-primary text-white text-center " @click="to_finally_confirm">确定修改</button>
+      </div>
+    </div>
+    <van-toast id="van-toast" />
+  </div>
+</template>
+
+<script>
+import Toast from '../../../../../static/vant/toast/toast';
+var $this
+export default {
+  name: "uc_edit_container",
+  components: {},
+  data() {
+    return {
+      base_phone: "18802603801",
+      phone: "18802603801",
+      sms: "",
+      custom_style: `width: 330px;
+            height: 49px;
+            background: rgba(242, 243, 255, 0.6);
+            box-shadow: 0px 3px 7px 0px rgba(159, 159, 159, 0.84);
+            border-radius: 10px;
+            margin: 30px auto;
+      `
+    }
+  },
+  methods: {
+    //假隐藏
+    cut_phone($val) {
+      let start = $val.slice(0, 4);
+
+      let end = $val.slice(-2);
+      return start + '******' + end;
+    },
+    //  发送验证码
+    sand_sms() {
+      let $param = {
+        phone:$this.base_phone
+      }
+      $this.$fly.post('user/get-code',$param).then((res)=>{
+        let $data = res.data
+        if ($data.code != 200){
+          Toast.fail($data.errmsg)
+        }
+      })
+    },
+    //跳转最终修改手机的页面
+    to_finally_confirm(){
+      mpvue.navigateTo({
+        url:"/pages/user_center/edit/confirm_phone_finally/main"
+      })
+    }
+  }
+  ,
+  mounted() {
+    $this.phone = $this.cut_phone($this.phone)
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/edit/confirm_phone_first/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/edit/confirm_phone_first/main.json

@@ -0,0 +1,11 @@
+{
+  "usingComponents": {
+    "van-popup": "../../../../static/vant/popup/index",
+    "van-icon": "../../../../static/vant/icon/index",
+    "van-cell": "../../../../static/vant/cell/index",
+    "van-cell-group": "../../../../static/vant/cell-group/index",
+    "van-field": "../../../../static/vant/field/index",
+    "van-button": "../../../../static/vant/button/index",
+    "van-toast": "../../../../static/vant/toast/index"
+  }
+}

src/pages/user_center/edit/index.css

@@ -0,0 +1,5 @@
+/*头像*/
+.avatar {
+  width: 40px;
+  height: 40px;
+}

src/pages/user_center/edit/index.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="uc_edit_container">
+    <van-cell title="头像">
+      <img :src="userinfo.avatar" alt="" class="avatar">
+    </van-cell>
+    <van-cell title="手机号" :value="userinfo.phone" is-link url="/pages/user_center/edit/confirm_phone_first/main"/>
+    <van-cell title="会员码" is-link>
+      <van-icon name="qr"/>
+    </van-cell>
+    <van-cell title="昵称" :value="userinfo.nickname"/>
+    <van-cell title="性别" is-link>
+      <template v-if="userinfo.gender">
+        男
+      </template>
+      <template v-else>
+        女
+      </template>
+    </van-cell>
+    <van-cell title="生日" :value="userinfo.birthday" is-link/>
+    <van-cell title="家庭组" :value="userinfo.home_group" is-link/>
+    <van-cell title="推荐人" :value="userinfo.recommend"/>
+  </div>
+</template>
+
+<script>
+var $this
+export default {
+  name: "uc_edit_container",
+  components: {},
+  data() {
+    return {
+      userinfo: {
+        avatar: "https://img.shuimuai.com/weixintouxiang.png",
+        phone: '13722886629',
+        code: "",
+        nickname: "嘤嘤怪",
+        gender: 1,
+        birthday: "1862-02-32",
+        home_group: "超级复读机",
+        recommend: "莲花山云雨"
+      }
+    }
+  },
+  methods: {
+  }
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/edit/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/edit/main.json

@@ -0,0 +1,8 @@
+{
+  "usingComponents": {
+    "van-popup": "../../../static/vant/popup/index",
+    "van-icon": "../../../static/vant/icon/index",
+    "van-cell": "../../../static/vant/cell/index",
+    "van-cell-group": "../../../static/vant/cell-group/index"
+  }
+}

src/pages/user_center/index.css

@@ -140,12 +140,6 @@ image.bianji {
 /* 菜单 */
 .menu {
   width: 100%;
-  height: 21px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 34px 24px 34px 19px;
-  box-sizing: border-box;
 }
 
 .menu image:first-child {
@@ -158,3 +152,8 @@ image.bianji {
   height: 16px;
 }
 
+.contact_button{
+  position: relative;
+  bottom: 45px;
+  opacity: 0;
+}

src/pages/user_center/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="uc_container">
     <view class="head"></view>
-    <img class="bianji" src="https://img.shuimuai.com/m_btn_bianji%402x.png"/>
+    <img class="bianji" src="https://img.shuimuai.com/m_btn_bianji%402x.png" @click="to_edit"/>
     <view class="user">
       <view class="up">
         <view class="left">
@@ -41,32 +41,30 @@
       </view>
     </view>
     <view class="detail">
-      <img src="https://img.shuimuai.com/m_btn_huiyuanma%402x.png"/>
-      <img src="https://img.shuimuai.com/m_btn_huiyuanquanyi%402x.png"/>
-      <img src="https://img.shuimuai.com/m_btn_jiatingzu%402x.png"/>
-    </view>
-    <view class="menu">
-      <img src="https://img.shuimuai.com/m_icon_dingdan%402x.png"/>
-      <view>我的订单</view>
-      <img src="https://img.shuimuai.com/m_sign_arrow%402x.png"/>
-    </view>
-    <view class="menu">
-      <img src="https://img.shuimuai.com/m_icon_dailishang%402x.png"/>
-      <view>代理商中心</view>
-      <img src="https://img.shuimuai.com/m_sign_arrow%402x.png"/>
-    </view>
-    <view class="menu">
-      <img src="https://img.shuimuai.com/m_icon_jiatingzu%402x.png"/>
-      <view>家庭组</view>
-      <img src="https://img.shuimuai.com/m_sign_arrow%402x.png"/>
-    </view>
-    <view class="menu">
-      <img src="https://img.shuimuai.com/m_icon_kefu%402x.png"/>
-      <view>联系客服</view>
-      <img src="https://img.shuimuai.com/m_sign_arrow%402x.png"/>
+      <!--      会员码-->
+      <img src="https://img.shuimuai.com/m_btn_huiyuanma%402x.png" @click="to_vip_code"/>
+      <!--      会员权益-->
+      <img src="https://img.shuimuai.com/m_btn_huiyuanquanyi%402x.png" @click="to_vip"/>
+      <!--      加入家庭组-->
+      <img src="https://img.shuimuai.com/m_btn_jiatingzu%402x.png" @click="open_scan"/>
     </view>
 
+    <!--    菜单模块-->
+    <van-cell-group class="menu">
+      <van-cell title="我的订单" icon="notes-o" is-link url="/pages/user_center/orders/main"/>
+      <van-cell title="代理商中心" icon="manager-o" is-link url="/pages/agent/index/main"/>
+      <van-cell title="家庭组" icon="wap-home-o" is-link/>
+      <van-cell title="收货地址" icon="location-o" is-link/>
+      <van-cell title="联系客服" icon="service-o" is-link/>
+      <van-button open-type="contact" block custom-class="contact_button" >
+        <div>
+          <view>
+            <van-icon name="service-o"/>&nbsp;联系客服
+          </view>
+        </div>
 
+      </van-button>
+    </van-cell-group>
   </div>
 </template>
 
@@ -78,7 +76,31 @@ export default {
   data() {
     return {}
   },
-  methods: {}
+  methods: {
+    to_edit() {
+      mpvue.navigateTo({
+        url: "/pages/user_center/edit/main"
+      })
+    },
+    //跳转vip权益
+    to_vip(){
+      mpvue.navigateTo({
+        url:"/pages/user_center/vip/main"
+      })
+    },
+    //打开扫一扫
+    open_scan(){
+      mpvue.scanCode({
+        onlyFromCamera:true
+      })
+    },
+    //跳转会员码
+    to_vip_code(){
+      mpvue.navigateTo({
+        url:"/pages/user_center/vip_code/main"
+      })
+    }
+  }
   ,
   mounted() {
   },

src/pages/user_center/main.json

@@ -3,7 +3,10 @@
     "van-row": "../../static/vant/row/index",
     "van-col": "../../static/vant/col/index",
     "van-popup": "../../static/vant/popup/index",
-    "van-count-down": "../../static/vant/count-down/index",
-    "ec-canvas": "../../static/ec-canvas/ec-canvas"
+    "van-cell": "../../static/vant/cell/index",
+    "van-cell-group": "../../static/vant/cell-group/index",
+    "van-icon": "../../static/vant/icon/index",
+        "van-button": "../../static/vant/button/index"
+
   }
 }

src/pages/user_center/orders/index.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="uc_orders_container">
+    <van-tabs :active="0" color="#4B3AB0">
+      <van-tab title="全部">
+        <order_list></order_list>
+      </van-tab>
+      <van-tab title="待支付">
+        <order_list></order_list>
+      </van-tab>
+      <van-tab title="已支付">
+        <order_list></order_list>
+      </van-tab>
+    </van-tabs>
+  </div>
+</template>
+
+<script>
+import order_list from "@/components/user_center/order_list";
+
+var $this
+export default {
+  name: "uc_orders_container",
+  components: {
+    order_list
+  },
+  data() {
+    return {}
+  },
+  methods: {}
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/orders/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/orders/main.json

@@ -0,0 +1,8 @@
+{
+  "usingComponents": {
+    "van-tab": "../../../static/vant/tab/index",
+    "van-tabs": "../../../static/vant/tabs/index",
+    "van-card": "../../../static/vant/card/index",
+    "van-button": "../../../static/vant/button/index"
+  }
+}

src/pages/user_center/recharge/index.css

@@ -0,0 +1,121 @@
+.uc_recharge_container {
+  padding: 0px 10px;
+}
+
+.mine {
+  width: 354px;
+  height: 93px;
+  background: rgba(242, 243, 255, 0.6);
+  box-shadow: 0px 3px 7px 0px rgba(159, 159, 159, 0.84);
+  border-radius: 0px 0px 11px 11px;
+  margin: 0px auto;
+}
+
+.mine_min {
+  font-size: 40px;
+}
+
+.line {
+  width: 4px;
+  height: 16px;
+  background: #5D4DB8;
+}
+
+
+/*会员*/
+.vip {
+  width: 345px;
+  height: 100px;
+  background-position: center;
+  background-size: 100% 100%;
+}
+
+.gold {
+  background-image: url("https://img.shuimuai.com/web/frame_huangjinhuiyuan.png");
+}
+
+.platina {
+  background-image: url("https://img.shuimuai.com/web/frame_baijinhuiyuan.png");
+}
+
+.diamond {
+  background-image: url("https://img.shuimuai.com/web/frame_zuanshihuiyuan.png");
+}
+
+.normal {
+  background-image: url("https://img.shuimuai.com/web/frame_cika.png");
+}
+
+.card_body {
+  padding: 5px 0px;
+}
+
+.check_detail {
+  width: 73px;
+  height: 22px;
+}
+
+.desc {
+  width: 324px;
+  /*height: 128px;*/
+  margin: 10px auto;
+  font-size: 10px;
+  color: #6B6B6B;
+}
+
+.buy_button {
+  text-align: center;
+}
+
+.order_confirm, .err_container {
+  width: 344px;
+  height: 312px;
+}
+
+.order_price_container {
+  margin-top: 140px;
+}
+
+/*充值按钮*/
+.recharge_button {
+  position: absolute;
+  bottom: 20px;
+  width: 90%;
+}
+
+/*标题*/
+.err_container .title {
+  font-size: 20px;
+  font-weight: bold;
+  color: #4C4C4C;
+  line-height: 24px;
+}
+
+.err_img {
+  width: 73px;
+  height: 83px;
+}
+
+.button_group {
+  width: 100%;
+}
+
+
+/*子标题*/
+.err_container .sub-title {
+  font-size: 12px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #4B4B4B;
+  line-height: 24px;
+  width: 200px;
+  height: 30px;
+}
+
+.boy_logo {
+  width: 167px;
+  height: 184px;
+}
+.ext_container{
+  height: 420px;
+}

src/pages/user_center/recharge/index.vue

@@ -0,0 +1,321 @@
+<template>
+  <div class="uc_recharge_container">
+    <!--    头部卡片-->
+    <div class="mine padding">
+      <div class="flex justify-between">
+        <view>
+          <text class="text-gray">当前剩余时长（分钟）</text>
+        </view>
+        <view>
+          <text class="cuIcon-calendar"></text>
+          <text class="under_line">我的订单</text>
+        </view>
+      </div>
+      <view>
+        <text class="text-bold mine_min">30</text>
+      </view>
+    </div>
+
+    <!--    标题-->
+    <div class="title flex padding align-center">
+      <div class="line margin-right"></div>
+      <text>会员升级</text>
+    </div>
+
+    <!--    黄金会员-->
+    <div class="gold vip">
+      <van-row>
+        <van-col span="8" offset="6">
+          <div class="card_body">
+            <view>
+              <text class="mine_min  text-white">200</text>
+              <text class="text-white">分钟</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">3个月专注力训练课程</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">分级利润权益</text>
+            </view>
+          </div>
+        </van-col>
+
+        <van-col span="5" offset="4">
+          <div class="card_body">
+
+            <view>
+              <text class="text-white text-sm">价格</text>
+            </view>
+            <view>
+              <text class="text-white mine_min">199</text>
+            </view>
+            <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
+
+          </div>
+        </van-col>
+
+      </van-row>
+    </div>
+
+    <!--    描述-->
+    <view class="desc">
+
+      黄金会员权益：<br>
+      1）获得核销时间为200分钟，有效期3个自然月（从购买当日时间开始计时）。<br>
+      2）获得5张次卡（实体卡），次卡不能自己使用，只能用给其它人使用。获得次卡的用户A可进行1次到店体验，且成为黄金会员的一级分销用户。<br>
+      如果次卡用户A进行消费，则黄金会员用户则获得以下对应的分润：<br>
+      购买次卡获得20元分润，购买黄金会员卡获得50元分润，购买白金会员获得100元分润，购买钻石会员则获得200元分润，线下购买创客代理获得300元分润，线下购买区域代理获得600元分润，线下购买合伙人，获得2000元分润。<br>
+      如果次卡用户A发展其它人B成为水母会员用户，则B作为次卡用户A的一级分销用户，也是黄金会员的二级分销用户，如果B产生消费，则次卡会员A获得一级分润（同上述的黄金会员一级分润）黄金会员可获得如下二级分润：<br>
+      B购买次卡获得5元分润，购买黄金会员卡获得15元分润，购买白金会员获得30元分润，购买钻石会员则获得60元分润。线下购买创客代理获得90元分润，线下购买区域代理获得180元分润，线下购买合伙人，获得600元分润。<br>
+
+    </view>
+
+
+    <!--    购买按钮-->
+    <div class="buy_button">
+      <button class="cu-btn lg bg-orange text-center margin " @click="open_order_confirm">购买黄金会员</button>
+    </div>
+
+    <!--    白金会员-->
+    <div class="platina vip">
+      <van-row>
+        <van-col span="8" offset="6">
+          <div class="card_body">
+            <view>
+              <text class="mine_min  text-white">600</text>
+              <text class="text-white">分钟</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">租赁设备</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">更高分级利润权益</text>
+            </view>
+          </div>
+        </van-col>
+
+        <van-col span="5" offset="4">
+          <div class="card_body">
+
+            <view>
+              <text class="text-white text-sm">价格</text>
+            </view>
+            <view>
+              <text class="text-white mine_min">599</text>
+            </view>
+            <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
+
+          </div>
+        </van-col>
+
+      </van-row>
+    </div>
+
+    <!--    钻石会员-->
+    <div class="diamond vip">
+      <van-row>
+        <van-col span="8" offset="6">
+          <div class="card_body">
+            <view>
+              <text class="mine_min  text-white">1000</text>
+              <text class="text-white text-sm">分钟</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">租赁设备</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">更高分级利润权益</text>
+            </view>
+          </div>
+        </van-col>
+
+        <van-col span="5" offset="4">
+          <div class="card_body">
+
+            <view>
+              <text class="text-white text-sm">价格</text>
+            </view>
+            <view>
+              <text class="text-white mine_min">199</text>
+            </view>
+            <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
+
+          </div>
+        </van-col>
+
+      </van-row>
+    </div>
+
+    <div class="title flex padding align-center">
+      <div class="line margin-right"></div>
+      <text>体验磁卡次卡</text>
+    </div>
+    <!--  体验次卡-->
+    <div class="normal vip">
+      <van-row>
+        <van-col span="8" offset="6">
+          <div class="card_body">
+            <view>
+              <text class="mine_min  text-white">200</text>
+              <text class="text-white">分钟</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">3个月专注力训练课程</text>
+            </view>
+            <view>
+              <text class="text-white text-sm">分级利润权益</text>
+            </view>
+          </div>
+        </van-col>
+
+        <van-col span="5" offset="4">
+          <div class="card_body">
+
+            <view>
+              <text class="text-white text-sm">价格</text>
+            </view>
+            <view>
+              <text class="text-white mine_min">199</text>
+            </view>
+            <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
+
+          </div>
+        </van-col>
+
+      </van-row>
+    </div>
+
+
+    <!--    确认订单 弹窗-->
+    <van-popup :show="order_confirm" @close="close_order_confirm" round closeable>
+      <div class="order_confirm padding">
+        <view>
+          <text class="text-sm text-gray">已选商品&emsp;水母星球-钻石会员</text>
+          <br>
+        </view>
+        <view>
+          <text class="text-sm text-gray">商品价格&emsp;299元</text>
+          <br>
+
+        </view>
+        <view>
+          <text class="text-sm text-gray">支付方式&emsp;微信支付</text>
+          <br>
+
+        </view>
+        <view class="order_price_container">
+          <text class="text-sm text-gray">实付(元)&emsp;</text>
+          <text class="mine_min">299</text>
+        </view>
+        <button class="cu-btn bg-primary lg text-white recharge_button" @click="success_pay">立即充值</button>
+      </div>
+    </van-popup>
+
+    <!--    充值失败-->
+    <van-popup :show="err_show" @close="close_err_pop" round :close-on-click-overlay="false">
+      <div class="err_container flex flex-direction align-center justify-around">
+        <view>
+          <text class="title">
+            充值失败，请再次尝试
+          </text>
+        </view>
+        <img src="https://img.shuimuai.com/web/sign_notimeJfish.png" class="err_img" alt="">
+        <div class="button_group flex justify-around">
+          <button class="cu-btn bg-gray text-white lg" @click="cancel_recharge">取消支付</button>
+          <button class="cu-btn  bg-primary text-white lg" @click="repay">再次支付</button>
+        </div>
+      </div>
+    </van-popup>
+
+    <!--    充值成功-->
+    <van-popup :show="success_show" @close="close_success_pop" round :close-on-click-overlay="false">
+      <div class="err_container flex flex-direction align-center justify-around ext_container">
+        <img src="https://img.shuimuai.com/web/boyya.png" class="boy_logo" alt="">
+        <view>
+          <text class="title">
+            充值成功
+          </text>
+        </view>
+        <view class="sub-title">
+          <text class="text-gray">
+            黄金会员包含 5张 实体邀请卡,我们将以快递形式发出,请填写收货地址.
+          </text>
+        </view>
+        <div class="button_group flex justify-around">
+          <button class="cu-btn bg-gray text-white lg" @click="close_success_pop">以后再填</button>
+          <button class="cu-btn  bg-primary text-white lg" @click="to_write_address">填写地址</button>
+        </div>
+      </div>
+    </van-popup>
+  </div>
+</template>
+
+<script>
+
+var $this
+export default {
+  name: "uc_recharge_container",
+  components: {},
+  data() {
+    return {
+      order: {},
+      order_confirm: false,
+      err_show: false,
+      success_show: true
+    }
+  },
+  methods: {
+    //弹出确认订单
+    open_order_confirm() {
+      $this.order_confirm = true
+    },
+    //关闭确认订单
+    close_order_confirm() {
+      $this.order_confirm = false
+    },
+    //关闭充值失败窗口
+    close_err_pop() {
+      $this.err_show = false
+    },
+    //取消充值
+    cancel_recharge() {
+      $this.close_err_pop()
+    },
+    // 打开充值成功窗口
+    open_success_window() {
+      $this.success_show = true
+    },
+    //关闭充值成功窗口
+    close_success_pop() {
+      $this.success_show = false
+    },
+    //再次付款
+    repay() {
+
+    },
+    // 成功支付
+    success_pay() {
+      // 支付成功后得回调方法
+      //  接收回调方法后弹出支付成功
+    },
+    //跳转填写地址
+    to_write_address(){
+      mpvue.navigateTo({
+        url:"/pages/user_center/address/list/main"
+      })
+    }
+  }
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/recharge/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/recharge/main.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {
+    "van-row": "../../../static/vant/row/index",
+    "van-col": "../../../static/vant/col/index",
+    "van-popup": "../../../static/vant/popup/index"
+  }
+}

src/pages/user_center/vip/index.css

@@ -0,0 +1,63 @@
+.banner {
+  width: 100%;
+  height: 100px;
+  background-color: #4B3AB0;
+  border: 1px solid #fff
+}
+
+.uc_vip_container .content {
+  padding: 10px;
+}
+
+.uc_vip_container .content .title {
+  font-size: 10px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #6B6B6B;
+  line-height: 24px;
+
+}
+
+/*权益grid*/
+.benefit {
+  text-align: center;
+  margin-top: 20px;
+}
+
+.benefit .icon:first-child {
+  width: 44px;
+  height: 31px;
+}
+
+.benefit .icon {
+  width: 40px;
+  height: 40px;
+}
+
+.benefit .title {
+  font-size: 14px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #6B6B6B;
+  line-height: 20px;
+
+}
+
+.benefit .subtitle {
+  font-size: 10px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #6B6B6B;
+}
+
+.desc {
+  margin: 30px 0px;
+  width: 355px;
+  height: 273px;
+  font-size: 10px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #6B6B6B;
+  line-height: 20px;
+  padding: 15px;
+}

src/pages/user_center/vip/index.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="uc_vip_container">
+    <div class="banner">
+
+    </div>
+
+    <div class="content">
+      <div class="title">
+        <text>我的会员权益</text>
+      </div>
+
+      <!--      权益列表-->
+      <van-row gutter="10" class="benefit-row">
+        <van-col span="8" v-for="(item,index) in benefits" :key="index">
+          <view class="benefit">
+            <img :src="item.icon" alt="" class="icon">
+            <view>
+              <text class="title">{{ item.title }}</text>
+            </view>
+            <view>
+              <text class="subtitle">{{ item.sub_title }}</text>
+            </view>
+          </view>
+        </van-col>
+      </van-row>
+
+
+      <!--      权益描述-->
+      <view class="desc">
+        黄金会员权益：
+        <br>
+        1）获得核销时间为200分钟，有效期3个自然月（从购买当日时间开始计时）。
+        <br>
+        2）获得5张次卡（实体卡），次卡不能自己使用，只能用给其它人使用。获得次卡的用户A可进行1次到店体验，且成为黄金会员的一级分销用户。
+        <br>
+        如果次卡用户A进行消费，则黄金会员用户则获得以下对应的分润：
+        <br>
+        购买次卡获得20元分润，购买黄金会员卡获得50元分润，购买白金会员获得100元分润，购买钻石会员则获得200元分润，线下购买创客代理获得300元分润，线下购买区域代理获得600元分润，线下购买合伙人，获得2000元分润。
+        <br>
+        <br>
+        如果次卡用户A发展其它人B成为水母会员用户，则B作为次卡用户A的一级分销用户，也是黄金会员的二级分销用户，如果B产生消费，则次卡会员A获得一级分润（同上述的黄金会员一级分润）黄金会员可获得如下二级分润：
+        <br>
+        B购买次卡获得5元分润，购买黄金会员卡获得15元分润，购买白金会员获得30元分润，购买钻石会员则获得60元分润。线下购买创客代理获得90元分润，线下购买区域代理获得180元分润，线下购买合伙人，获得600元分润。
+      </view>
+    </div>
+  </div>
+</template>
+
+<script>
+
+var $this
+export default {
+  name: "uc_vip_container",
+  components: {},
+  data() {
+    return {
+      benefits: [
+        {
+          id: 1,
+          icon: "https://img.shuimuai.com/quanyi_icon_1.png",
+          title: "会员卡",
+          sub_title: "1张"
+        },
+        {
+          id: 2,
+          icon: "https://img.shuimuai.com/quanyi_icon_2.png",
+          title: "核销时间1700分钟",
+          sub_title: "游玩限期3个月"
+        },
+        {
+          id: 3,
+          icon: "https://img.shuimuai.com/quanyi_icon_3.png",
+          title: "参与活动",
+          sub_title: "3个月内"
+        },
+        {
+          id: 4,
+          icon: "https://img.shuimuai.com/quanyi_icon_4.png",
+          title: "销售产品",
+          sub_title: "租1套、每天15分钟"
+        },
+        {
+          id: 5,
+          icon: "https://img.shuimuai.com/quanyi_icon_5.png",
+          title: "参与课程",
+          sub_title: "3个月"
+        },
+        {
+          id: 6,
+          icon: "https://img.shuimuai.com/quanyi_icon_6.png",
+          title: "分润",
+          sub_title: "一级分润、二级分润"
+        },
+      ],
+    }
+  },
+  methods: {}
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/vip/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/vip/main.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "van-row": "../../../static/vant/row/index",
+    "van-col": "../../../static/vant/col/index"
+  }
+}

src/pages/user_center/vip_code/index.css

@@ -0,0 +1,68 @@
+.uc_vip_code_container{
+  padding: 80px 0px;
+}
+
+.card {
+  width: 347px;
+  height: 403px;
+  background: #FFFFFF;
+  box-shadow: 0px 3px 7px 0px #A6A6A6;
+  border-radius: 11px;
+  margin: 0px auto;
+}
+
+.user {
+  width: 100%;
+}
+
+.user .up {
+  width: 100%;
+  height: 40px;
+  margin-top: 9px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.user .up .left {
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: start;
+}
+
+.user .up .left image {
+  width: 40px;
+  height: 40px;
+  margin-left: 17px;
+  margin-right: 8px;
+}
+
+
+.user .up .left view {
+  height: 40px;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+
+.user .up .left view text:first-child {
+  font-size: 15px;
+  font-weight: bold;
+}
+
+.user .up .left view text:last-child {
+  font-size: 13px;
+}
+
+.user .up .right {
+  height: 40px;
+
+}
+
+.qrcode{
+  width: 139px;
+height: 139px;
+
+}

src/pages/user_center/vip_code/index.vue

@@ -0,0 +1,45 @@
+<template>
+  <div class="uc_vip_code_container">
+    <div class="card text-center padding-top-xl">
+      <view class="user margin-xl">
+        <view class="up">
+          <view class="left">
+            <img src="https://img.shuimuai.com/weixintouxiang.png"/>
+            <view>
+              <text>
+                <text>小疯兔</text>
+              </text>
+              <text>普通会员 有效期至 2020.11.11</text>
+            </view>
+          </view>
+        </view>
+      </view>
+      <img src="https://img.shuimuai.com/web/demo_code.png" class="qrcode margin-xl" alt="">
+    </div>
+  </div>
+</template>
+
+<script>
+
+var $this
+export default {
+  name: "uc_vip_code_container",
+  components: {},
+  data() {
+    return {}
+  },
+  methods: {}
+  ,
+  mounted() {
+  },
+  created() {
+    $this = this;
+  },
+  onLoad() {
+  }
+}
+</script>
+
+<style scoped>
+@import "index.css";
+</style>

src/pages/user_center/vip_code/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './index'
+
+// add this to handle exception
+Vue.config.errorHandler = function (err) {
+  if (console && console.error) {
+    console.error(err)
+  }
+}
+
+const app = new Vue(App)
+app.$mount()

src/pages/user_center/vip_code/main.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "van-row": "../../../static/vant/row/index",
+    "van-col": "../../../static/vant/col/index"
+  }
+}

static/ec-canvas/ec-canvas.js

@@ -1,250 +0,0 @@
-import WxCanvas from './wx-canvas';
-import * as echarts from './echarts';
-
-let ctx;
-
-function compareVersion(v1, v2) {
-  v1 = v1.split('.')
-  v2 = v2.split('.')
-  const len = Math.max(v1.length, v2.length)
-
-  while (v1.length < len) {
-    v1.push('0')
-  }
-  while (v2.length < len) {
-    v2.push('0')
-  }
-
-  for (let i = 0; i < len; i++) {
-    const num1 = parseInt(v1[i])
-    const num2 = parseInt(v2[i])
-
-    if (num1 > num2) {
-      return 1
-    } else if (num1 < num2) {
-      return -1
-    }
-  }
-  return 0
-}
-
-Component({
-  properties: {
-    canvasId: {
-      type: String,
-      value: 'ec-canvas'
-    },
-
-    ec: {
-      type: Object
-    },
-
-    forceUseOldCanvas: {
-      type: Boolean,
-      value: false
-    }
-  },
-
-  data: {
-    isUseNewCanvas: false
-  },
-
-  ready: function () {
-    // Disable prograssive because drawImage doesn't support DOM as parameter
-    // See https://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.drawImage.html
-    echarts.registerPreprocessor(option => {
-      if (option && option.series) {
-        if (option.series.length > 0) {
-          option.series.forEach(series => {
-            series.progressive = 0;
-          });
-        }
-        else if (typeof option.series === 'object') {
-          option.series.progressive = 0;
-        }
-      }
-    });
-
-    if (!this.data.ec) {
-      console.warn('组件需绑定 ec 变量，例：<ec-canvas id="mychart-dom-bar" '
-        + 'canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>');
-      return;
-    }
-
-    if (!this.data.ec.lazyLoad) {
-      this.init();
-    }
-  },
-
-  methods: {
-    init: function (callback) {
-      const version = wx.getSystemInfoSync().SDKVersion
-
-      const canUseNewCanvas = compareVersion(version, '2.9.0') >= 0;
-      const forceUseOldCanvas = this.data.forceUseOldCanvas;
-      const isUseNewCanvas = canUseNewCanvas && !forceUseOldCanvas;
-      this.setData({ isUseNewCanvas });
-
-      if (forceUseOldCanvas && canUseNewCanvas) {
-        console.warn('开发者强制使用旧canvas,建议关闭');
-      }
-
-      if (isUseNewCanvas) {
-        // console.log('微信基础库版本大于2.9.0，开始使用<canvas type="2d"/>');
-        // 2.9.0 可以使用 <canvas type="2d"></canvas>
-        this.initByNewWay(callback);
-      } else {
-        const isValid = compareVersion(version, '1.9.91') >= 0
-        if (!isValid) {
-          console.error('微信基础库版本过低，需大于等于 1.9.91。'
-            + '参见：https://github.com/ecomfe/echarts-for-weixin'
-            + '#%E5%BE%AE%E4%BF%A1%E7%89%88%E6%9C%AC%E8%A6%81%E6%B1%82');
-          return;
-        } else {
-          console.warn('建议将微信基础库调整大于等于2.9.0版本。升级后绘图将有更好性能');
-          this.initByOldWay(callback);
-        }
-      }
-    },
-
-    initByOldWay(callback) {
-      // 1.9.91 <= version < 2.9.0：原来的方式初始化
-      ctx = wx.createCanvasContext(this.data.canvasId, this);
-      const canvas = new WxCanvas(ctx, this.data.canvasId, false);
-
-      echarts.setCanvasCreator(() => {
-        return canvas;
-      });
-      // const canvasDpr = wx.getSystemInfoSync().pixelRatio // 微信旧的canvas不能传入dpr
-      const canvasDpr = 1
-      var query = wx.createSelectorQuery().in(this);
-      query.select('.ec-canvas').boundingClientRect(res => {
-        if (typeof callback === 'function') {
-          this.chart = callback(canvas, res.width, res.height, canvasDpr);
-        }
-        else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
-          this.chart = this.data.ec.onInit(canvas, res.width, res.height, canvasDpr);
-        }
-        else {
-          this.triggerEvent('init', {
-            canvas: canvas,
-            width: res.width,
-            height: res.height,
-            canvasDpr: canvasDpr // 增加了dpr，可方便外面echarts.init
-          });
-        }
-      }).exec();
-    },
-
-    initByNewWay(callback) {
-      // version >= 2.9.0：使用新的方式初始化
-      const query = wx.createSelectorQuery().in(this)
-      query
-        .select('.ec-canvas')
-        .fields({ node: true, size: true })
-        .exec(res => {
-          const canvasNode = res[0].node
-          this.canvasNode = canvasNode
-
-          const canvasDpr = wx.getSystemInfoSync().pixelRatio
-          const canvasWidth = res[0].width
-          const canvasHeight = res[0].height
-
-          const ctx = canvasNode.getContext('2d')
-
-          const canvas = new WxCanvas(ctx, this.data.canvasId, true, canvasNode)
-          echarts.setCanvasCreator(() => {
-            return canvas
-          })
-
-          if (typeof callback === 'function') {
-            this.chart = callback(canvas, canvasWidth, canvasHeight, canvasDpr)
-          } else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
-            this.chart = this.data.ec.onInit(canvas, canvasWidth, canvasHeight, canvasDpr)
-          } else {
-            this.triggerEvent('init', {
-              canvas: canvas,
-              width: canvasWidth,
-              height: canvasHeight,
-              dpr: canvasDpr
-            })
-          }
-        })
-    },
-    canvasToTempFilePath(opt) {
-      if (this.data.isUseNewCanvas) {
-        // 新版
-        const query = wx.createSelectorQuery().in(this)
-        query
-          .select('.ec-canvas')
-          .fields({ node: true, size: true })
-          .exec(res => {
-            const canvasNode = res[0].node
-            opt.canvas = canvasNode
-            wx.canvasToTempFilePath(opt)
-          })
-      } else {
-        // 旧的
-        if (!opt.canvasId) {
-          opt.canvasId = this.data.canvasId;
-        }
-        ctx.draw(true, () => {
-          wx.canvasToTempFilePath(opt, this);
-        });
-      }
-    },
-
-    touchStart(e) {
-      if (this.chart && e.touches.length > 0) {
-        var touch = e.touches[0];
-        var handler = this.chart.getZr().handler;
-        handler.dispatch('mousedown', {
-          zrX: touch.x,
-          zrY: touch.y
-        });
-        handler.dispatch('mousemove', {
-          zrX: touch.x,
-          zrY: touch.y
-        });
-        handler.processGesture(wrapTouch(e), 'start');
-      }
-    },
-
-    touchMove(e) {
-      if (this.chart && e.touches.length > 0) {
-        var touch = e.touches[0];
-        var handler = this.chart.getZr().handler;
-        handler.dispatch('mousemove', {
-          zrX: touch.x,
-          zrY: touch.y
-        });
-        handler.processGesture(wrapTouch(e), 'change');
-      }
-    },
-
-    touchEnd(e) {
-      if (this.chart) {
-        const touch = e.changedTouches ? e.changedTouches[0] : {};
-        var handler = this.chart.getZr().handler;
-        handler.dispatch('mouseup', {
-          zrX: touch.x,
-          zrY: touch.y
-        });
-        handler.dispatch('click', {
-          zrX: touch.x,
-          zrY: touch.y
-        });
-        handler.processGesture(wrapTouch(e), 'end');
-      }
-    }
-  }
-});
-
-function wrapTouch(event) {
-  for (let i = 0; i < event.touches.length; ++i) {
-    const touch = event.touches[i];
-    touch.offsetX = touch.x;
-    touch.offsetY = touch.y;
-  }
-  return event;
-}

static/ec-canvas/ec-canvas.json

@@ -1,4 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {}
-}

static/ec-canvas/ec-canvas.wxml

@@ -1,4 +0,0 @@
-<!-- 新的：接口对其了H5 -->
-<canvas wx:if="{{isUseNewCanvas}}" type="2d" class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>
-<!-- 旧的 -->
-<canvas wx:else class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>

static/ec-canvas/ec-canvas.wxss

@@ -1,4 +0,0 @@
-.ec-canvas {
-  width: 100%;
-  height: 100%;
-}

static/ec-canvas/wx-canvas.js

@@ -1,121 +0,0 @@
-export default class WxCanvas {
-  constructor(ctx, canvasId, isNew, canvasNode) {
-    this.ctx = ctx;
-    this.canvasId = canvasId;
-    this.chart = null;
-    this.isNew = isNew
-    if (isNew) {
-      this.canvasNode = canvasNode;
-    }
-    else {
-      this._initStyle(ctx);
-    }
-
-    // this._initCanvas(zrender, ctx);
-
-    this._initEvent();
-  }
-
-  getContext(contextType) {
-    if (contextType === '2d') {
-      return this.ctx;
-    }
-  }
-
-  // canvasToTempFilePath(opt) {
-  //   if (!opt.canvasId) {
-  //     opt.canvasId = this.canvasId;
-  //   }
-  //   return wx.canvasToTempFilePath(opt, this);
-  // }
-
-  setChart(chart) {
-    this.chart = chart;
-  }
-
-  attachEvent() {
-    // noop
-  }
-
-  detachEvent() {
-    // noop
-  }
-
-  _initCanvas(zrender, ctx) {
-    zrender.util.getContext = function () {
-      return ctx;
-    };
-
-    zrender.util.$override('measureText', function (text, font) {
-      ctx.font = font || '12px sans-serif';
-      return ctx.measureText(text);
-    });
-  }
-
-  _initStyle(ctx) {
-    var styles = ['fillStyle', 'strokeStyle', 'globalAlpha',
-      'textAlign', 'textBaseAlign', 'shadow', 'lineWidth',
-      'lineCap', 'lineJoin', 'lineDash', 'miterLimit', 'fontSize'];
-
-    styles.forEach(style => {
-      Object.defineProperty(ctx, style, {
-        set: value => {
-          if (style !== 'fillStyle' && style !== 'strokeStyle'
-            || value !== 'none' && value !== null
-          ) {
-            ctx['set' + style.charAt(0).toUpperCase() + style.slice(1)](value);
-          }
-        }
-      });
-    });
-
-    ctx.createRadialGradient = () => {
-      return ctx.createCircularGradient(arguments);
-    };
-  }
-
-  _initEvent() {
-    this.event = {};
-    const eventNames = [{
-      wxName: 'touchStart',
-      ecName: 'mousedown'
-    }, {
-      wxName: 'touchMove',
-      ecName: 'mousemove'
-    }, {
-      wxName: 'touchEnd',
-      ecName: 'mouseup'
-    }, {
-      wxName: 'touchEnd',
-      ecName: 'click'
-    }];
-
-    eventNames.forEach(name => {
-      this.event[name.wxName] = e => {
-        const touch = e.touches[0];
-        this.chart.getZr().handler.dispatch(name.ecName, {
-          zrX: name.wxName === 'tap' ? touch.clientX : touch.x,
-          zrY: name.wxName === 'tap' ? touch.clientY : touch.y
-        });
-      };
-    });
-  }
-
-  set width(w) {
-    if (this.canvasNode) this.canvasNode.width = w
-  }
-  set height(h) {
-    if (this.canvasNode) this.canvasNode.height = h
-  }
-
-  get width() {
-    if (this.canvasNode)
-      return this.canvasNode.width
-    return 0
-  }
-  get height() {
-    if (this.canvasNode)
-      return this.canvasNode.height
-    return 0
-  }
-}