first commit

滴滴淘/h5(1)/src/view/pages/Authentication.vue

@@ -0,0 +1,165 @@
+<template lang="pug">
+  .authentication.content
+    NavbarComponent(:title=" mode == 'add'?'修改地址':'买号认证'" showLeft)
+    .line
+    .pd43
+      .platform_list(v-for='item in bindAccount.info')
+        div(@click='goUrl(item.account_id,item.status)')
+          .platform.mt30.flex.pd30
+            Icons(name='buyer-icon-taobao_' size='1' color='#ff5000' v-if='item.account_type == 10')
+            Icons(name='buyer-icon-jingdong_' size='1' color='#e6241a' v-if='item.account_type == 20')
+            p.flex1.ml40 {{item.account_type_text}}
+            span.examine(v-if='item.status == -1') {{item.status_text}}
+            span.examine(v-if='item.status == 0') {{item.status_text}}
+            span.already(v-if='item.status == 1') {{item.status_text}}
+            span.examine(v-if='item.status == -9') {{item.status_text}}
+            van-icon(name="arrow" size='0.46rem')
+      .platform_list(v-for='item in platform' v-if="mode !== 'add'")
+        div(@click='goAdd(item.id)')
+          .platform.mt30.flex.pd30
+            Icons( :name='item.icon' size='1' :color='item.color')
+            p.flex1.ml40 {{item.name}}
+            span 去认证
+            van-icon(name="arrow" size='0.46rem')
+</template>
+<script lang="ts">
+  import {Component, Provide, Vue, Inject} from 'vue-property-decorator';
+  import NavbarComponent from "@/components/Navbar.vue";
+  import { Dialog } from 'vant';
+  import Icons from '@/components/Icons.vue'
+
+  @Component({
+    components: {
+      NavbarComponent,
+      Icons
+    }
+  })
+  export default class Authentication extends Vue {
+    $http: any
+
+    // inject 注入 App.vue 提供的变量
+    @Inject() readonly HiddenTabBar!: Function
+    @Inject() readonly ShowTabBar!: Function
+
+    // 进入此页面的不同方式 add表示地址不显示添加买号
+    private mode: string = ''
+
+    private platform: Array<any> = [
+      {
+        name: '淘宝认证',
+        id: 10,
+        num: 0,
+        icon: 'buyer-icon-taobao_',
+        color: '#ff5000'
+      }
+      // {
+      //   name: '京东认证',
+      //   id: 20,
+      //   num: 0,
+      //   icon: 'buyer-icon-jingdong_',
+      //   color: '#e6241a'
+      // }
+      // {
+      //   name: '拼多多认证',
+      //   id: 3,
+      //   num: 0,
+      //   icon: ''
+      // }
+    ]
+
+    // 已绑账号数据
+    private bindAccount: any = {}
+
+    private created(): void {
+      this.HiddenTabBar()
+      this.getAccountlist()
+      if(this.$route.query.mode !== void 0){
+        this.mode = this.$route.query.mode as string
+      }
+    }
+
+    beforeRouteLeave (to: any, from: any, next: any) {
+      this.ShowTabBar()
+      next()
+    }
+
+    // 获取买号列表
+    private async getAccountlist(): Promise<void> {
+      let res = await this.$http.UserService.getAccountlist()
+      this.bindAccount = res
+      res.info.forEach((v: any, i: number) => {
+        switch (v.account_type) {
+          case 10:
+            this.platform[0].num++
+            break;
+          case 20:
+            this.platform[1].num++
+            break;
+          case 30:
+            this.platform[2].num++
+            break;
+          default:
+            break;
+        }
+      });
+    }
+    private goUrl(id: string, status: number): void {
+      let url = "";
+      if (status == -1) {
+        url = "/AddAccount";
+      } else if (status == 1) {
+        url = "/ModifyAddress";
+      }else{
+        return
+      }
+      this.$router.push({ path: url, query: { id: id, status: String(status),type: '10' } });
+    }
+    private goAdd(id: string): void {
+      let info: any = this.bindAccount
+      switch (info.auth_status) {
+        case -4:
+          Dialog.alert({
+            message: info.auth_msg,
+            confirmButtonText: '前往'
+          }).then(()=>{
+            this.$router.push({ path: '/realName' });
+          })
+          break;
+        case -3:
+          Dialog.alert({
+            message: info.auth_msg
+          })
+          break;
+        case -2:
+          Dialog.alert({
+            message: info.auth_msg,
+            confirmButtonText: '前往'
+          }).then(()=>{
+            this.$router.push({ path: '/realName' });
+          })
+          break;
+        case -1:
+          Dialog.alert({
+            message: info.auth_msg
+          })
+          break;
+        case 1:
+          let index = parseInt(id) == 10?0:1
+          if(this.platform[index].num >= 2) {
+            Dialog.alert({
+              title: '账号已达到上限',
+              message: '每个平台最多添加2个账号'
+            })
+            return
+          }
+          this.$router.push({ path: '/AddAccount', query: { type: id } });
+          break;
+        default:
+          break;
+      }
+    }
+  }
+</script>
+<style lang="stylus" scoped>
+@import '~@assets/stylus/page/authentication';
+</style>