my-info.vue

<!--
 * @Author: your name
 * @Date: 2019-11-07 17:48:53
 * @LastEditTime : 2019-12-23 15:30:46
 * @LastEditors  : Please set LastEditors
 * @Description: In User Settings Edit
 -->
<!-- -->
<template>
  <h-view id="my-info">
    <h-header class="bar-custom">
      <div slot="center">个人中心</div>
    </h-header>

    <!-- <div :class="['top',(multipleRole!=='GUTA'&&user_bp_type!=='GUTA')?'has':'antiHas']" style="margin-top:-1px;"> -->
    <div class="top" style="margin-top: -1px">
      <div
        class="card-top"
        :style="{ height: nowBind.bp_type === 'MANAGER' ? '3.4rem' : '2.4rem' }"
      >
        <img :src="upLoadObj" @click="checkType" />
        <div class="sign">
          <span>{{ user_phone }}</span>
          <div class="now-bind">
            <!-- 电子签
            <p
              :class="[elecStatus ? 'across' : 'un-across']"
              @click="certification"
            >
              {{ elecStatusDesceibe }}
            </p>-->

            <span>{{ nowBind.bp_name ? `${nowBind.bp_name} (当前)` : '未绑定' }}</span>
            <div v-show="nowBind.bp_name && nowBind.bp_type !== 'MANAGER'" @click="changeUser">切换</div>
          </div>
        </div>
      </div>
    </div>

    <div class="bind-user" v-if="nowBind.bp_type !== 'MANAGER'">
      <div class="box">
        <p class="title">我绑定的用户</p>
        <div v-if="!myBindUser.length" class="no-user">
          暂无绑定用户,
          <router-link to="/user-bind">去绑定~</router-link>
        </div>

        <template v-else>
          <div v-for="item of myBindUser" class="bind-item">
            <p>{{ item.bp_name }}</p>
            <div>{{ item.bp_identity_name }}</div>
          </div>

          <div class="more" @click="$router.push('/myBindUser')">更多操作</div>
        </template>
      </div>
    </div>

    <h-content class="my-content has-footer">
      <div class="content-top">
        <list-item :item-height="44" class="list">
<!--          <item @click.native="goContract">-->
<!--            <img slot="left-icon" src="@/assets/myInfo/agreement.png" class="left-icon" />-->
<!--            <div slot="name">我的合同</div>-->
<!--          </item>-->
<!--          <item-->
<!--            v-if="user_bp_type === 'TENANT' || user_bp_type === 'GUTA'"-->
<!--            @click.native="goReimburse"-->
<!--          >-->
<!--            <img slot="left-icon" src="@/assets/myInfo/repay.png" class="left-icon" />-->
<!--            <div slot="name">我的还款</div>-->
<!--          </item>-->
<!--          <item v-if="user_bp_type === 'TENANT'" @click.native="goInvoice">-->
<!--            <img slot="left-icon" src="@/assets/myInfo/invoice.png" class="left-icon" />-->
<!--            <div slot="name">我的发票</div>-->
<!--          </item>-->
          <item @click.native="goMyProduct">
            <img slot="left-icon" src="@/assets/myInfo/collect.png" class="left-icon" />
            <div slot="name">我的收藏</div>
            <div
              v-if="productCount > 0"
              slot="right-icon"
              :class="{
                'right-icon-width': productCount > 99,
                'right-icon': productCount < 99,
              }"
            >{{ productCount > 99 ? "99+" : productCount }}</div>
          </item>
          <item @click.native="changeHelp">
            <img slot="left-icon" src="@/assets/myInfo/help.png" class="left-icon" />
            <div slot="name">帮助与反馈</div>
          </item>
          <item @click.native="goAbout">
            <img slot="left-icon" src="@/assets/myInfo/about.png" class="left-icon" />
            <div slot="name">关于汉得</div>
          </item>
          <item @click.native="goSetting">
            <img slot="left-icon" src="@/assets/myInfo/setting.png" class="left-icon" />
            <div slot="name">设置</div>
          </item>
          <item @click.native="goContactUs">
            <img slot="left-icon" src="@/assets/myInfo/contact.png" class="left-icon" />
            <div slot="name">联系我们</div>
          </item>
          <!-- <item @click.native="updateVersion">
            <img slot="left-icon" src="@/assets/myInfo/refresh.png" class="left-icon" >
            <div slot="name">检查更新</div>
          </item>-->
          <!-- <item @click.native="openTest">
            <img slot="left-icon" src="@/assets/myInfo/refresh.png" class="left-icon" >
            <div slot="name">当前版本</div>
            <div slot="content">{{ currentVersion }}</div>
          </item>-->
          <item @click.native="logOut">
            <img slot="left-icon" src="@/assets/myInfo/exit.png" class="left-icon" />
            <div slot="name">退出登录</div>
          </item>
        </list-item>
        <div class="version">版本号:{{ currentVersion }}</div>
        <!-- <button
          v-if="!popSetect" v-show="user_bp_type !== 'MANAGER'"
          @click="approveBtn ? unBind() : changePageHead()"
        >
          {{ description }}
        </button>
        <button v-if="popSetect" v-show="user_bp_type !== 'MANAGER'" @click="popSetectBox = true">
          {{ description }}
        </button>-->
      </div>
    </h-content>
    <role-switch
      v-show="roleSwitchFlag"
      ref="roleSwitchRoleList"
      :roleList="multiRoleList"
      @roleConfirm="roleConfirm"
      @roleCancle="roleCancle"
    />
    <!-- <role-switch
      v-show="popSetectBox"
      ref="roleSwitchType"
      :roleList="type"
      @roleConfirm="typeConfirm"
      @roleCancle="typeCancle"
    />-->
  </h-view>
</template>

<script>
import roleSwitch from './role-switch-component'
import defaultImg from '../../assets/myInfo/1.png'
export default {
  components: {
    roleSwitch,
    defaultImg,
  },
  data() {
    return {
      currentVersion: process.env.currentVersion,
      // multipleRole: '',
      upLoadObj: defaultImg, // 上传的图片
      // flag: true,
      // isAGENT: false,
      // popSetect: false, // true:待提交或者审核未通过
      // popSetectBox: false, // 弹出选择框
      // elecStatusDesceibe: '',
      user_bp_status: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_status,
      // user_bp_class: '',
      // bp_id: '',
      user_phone: window.localStorage.getItem('user_phone'),
      // user_bp_name: '',
      user_bp_type: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_type,
      // signCount: '0',
      // carNum: '0',
      // faceSign: '0',
      // prjSubmit: '0',
      // confirmCount: '0',
      productCount: '0',
      // carCount: '9',
      // description: '',
      // bp_identity: '',
      // bp_type_n: '',
      // approveBtn: false,
      // elecStatus: false,
      // authFlag: false,
      roleSwitchFlag: false, // 选择角色模态框显示标志
      multiRoleList: [], // 查到的多角色
      app_user_id: window.localStorage.getItem('app_user_id'),
      // type: [
      //   {
      //     bp_type: '0',
      //     bp_type_n: '修改信息',
      //   },
      //   {
      //     bp_type: '1',
      //     bp_type_n: '重新选择用户类型',
      //   },
      // ],

      //绑定的用户列表
      bindUserList: JSON.parse(window.localStorage.getItem('bind-user-list')),
      nowBind: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')),
    }
  },
  computed: {
    myBindUser() {
      if (this.bindUserList.length > 2) return [this.bindUserList[0], this.bindUserList[1]];

      return this.bindUserList;
    }
  },
  // watch: {
  // user_bp_type (newVal, oldVal) {
  //   if (newVal === 'AGENT') {
  //     this.isAGENT = true
  //   } else {
  //     this.isAGENT = false
  //   }
  // },
  // bp_identity(newVal, oldVal) {
  //   switch (newVal) {
  //     case 'NP_NO': {
  //       this.elecStatusDesceibe = '个人待认证'
  //       this.elecStatus = false
  //       break
  //     }
  //     case 'NP_YES': {
  //       this.elecStatusDesceibe = '个人认证通过'
  //       this.elecStatus = true
  //       break
  //     }
  //     case 'ORG_NO': {
  //       this.elecStatusDesceibe = '企业待认证'
  //       this.elecStatus = false
  //       break
  //     }
  //     case 'ORG_YES': {
  //       this.elecStatusDesceibe = '企业认证通过'
  //       this.elecStatus = true
  //       break
  //     }
  //     case 'ORG_L_NO': {
  //       this.elecStatusDesceibe = '法人待认证'
  //       this.elecStatus = false
  //       break
  //     }
  //     case 'ORG_L_YES': {
  //       this.elecStatusDesceibe = '法人认证通过'
  //       this.elecStatus = true
  //       break
  //     }
  //     case 'ORG_AUTH_NO': {
  //       this.elecStatusDesceibe = '授权人待认证'
  //       this.elecStatus = false
  //       break
  //     }
  //     case 'ORG_AUTH_YES': {
  //       this.elecStatusDesceibe = '授权人认证通过'
  //       this.elecStatus = true
  //       break
  //     }
  //     default: {
  //       this.elecStatusDesceibe = '用户未绑定'
  //       this.elecStatus = false
  //       break
  //     }
  //   }
  // },
  // },
  mounted() {
    this.getList()
    this.getMultipleRole();
    this.getHead();
  },
  beforeRouteEnter(to, from, next) {
    next((vm) => {
      // vm.signCount = '0'
      // vm.carNum = '0'
      // vm.faceSign = '0'
      // vm.prjSubmit = '0'
      // vm.confirmCount = '0'
      // vm.productCount = '0'
      // vm.carCount = '9'
      vm.multiRoleList = []
      // vm.multipleRole = window.localStorage.getItem('multipleRole')
      // if (window.localStorage.getItem('user_phone')) {
      // vm.userQuery()
      // }
      // vm.numQuery()
    })
    next()
  },
  methods: {
    // 获取用户列表，并缓存
    async getList() {
      let url = process.env.basePath + 'user_bp_query';
      let params = { app_user_id: window.localStorage.getItem('app_user_id') };

      try {
        hlsPopup.showLoading('请稍等');
        let query = await this.hlsHttp.post(url, params);

        if (query.result == 'S') {
          this.hlsPopup.hideLoading();

          // 自己添加认证文字
          let register = {
            NP_NO: "个人",
            NP_YES: "个人",
            ORG_YES: "企业",
            ORG_NO: "企业",
            ORG_L_NO: "法人",
            ORG_L_YES: "法人",
            ORG_AUTH_NO: "授权人",
            ORG_AUTH_YES: "授权人"
          }

          query.lists = query.lists.map(item => {
            item.bp_identity_name = register[item.bp_identity];
            return item;
          })

          window.localStorage.setItem('bind-user-list', JSON.stringify(query.lists));
          window.localStorage.setItem('now_user_bp_bind_id', JSON.stringify(query.lists.length ? query.lists[0] : {}));
          if (!query.lists.length)
            window.localStorage.setItem('now_user_bp_bind_id', JSON.stringify({}));


          this.bindUserList = query.lists;
        } else {
          this.hlsPopup.hideLoading();
          this.hlsPopup.showLongCenter(res.message);
        }
      } catch (error) {
        this.hlsPopup.hideLoading();
      }
    },

    changeUser() {
      this.hlsPopup.selectList({
        list: this.bindUserList.map(item => ({ code_name: item.bp_name, code: item.bp_id })),
        code: 'code',
        object: {},
        returnItem: (index, obj) => {
          this.nowBind = this.bindUserList[index];
          window.localStorage.setItem('now_user_bp_bind_id', JSON.stringify(this.nowBind));
          hlsPopup.showLongCenter('用户已切换成功');

          // 获取角色列表
          this.getMultipleRole();
        },
      })
    },
    // openTest () {
    //   // cordova.InAppBrowser.open('http://www.baidu.com', '_blank', 'location=yes')
    //   var date = '2019.11.23'
    //   var times = this.dateFormat(date)
    //   console.log(times)
    // },
    // dateFormat (str) {
    //   // return `${str.substring(0,4)}-${str.substring(4,6)}-${str.substring(6)}`
    //   return str.replace(/\./g, '-')
    // },

    // 查询头像
    getHead() {
      let vm = this
      let url = process.env.basePath + 'app_attment_query'
      let param = {
        master: {
          source_type: 'HLS_APP_USER',
          pkvalue: vm.app_user_id,
        },
      }
      hlsPopup.showLoading('请稍候')
      vm.$post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          if (res.info) {
            vm.upLoadObj =
              process.env.filePath +
              'attachment_id=' +
              res.info.attachment_id +
              '&access_token=' +
              window.localStorage.access_token
          } else {
            vm.upLoadObj = defaultImg
          }
        } else {
          hlsPopup.showLongCenter(res.message)
        }
      })
    },
    // 选择角色后确定
    roleConfirm(role) {
      this.roleSwitchFlag = false

      this.nowBind = { ...this.nowBind, bp_type: role.bp_type, bp_type_n: role.bp_type_n };
      window.localStorage.setItem('now_user_bp_bind_id', JSON.stringify(this.nowBind));


      // window.localStorage.setItem('multipleRole', role.bp_type)
      // this.multipleRole = role.bp_type  // 当前的角色权限
      // console.log('选择后的角色为：' + role)
      // window.localStorage.setItem('bp_type', role.bp_type)
    },
    // typeConfirm (e) {
    //   // 选择操作方式后
    //   this.popSetectBox = false
    //   if (e.bp_type === '0') {  修改信息
    //     this.changePageHead()
    //   } else if (e.bp_type === '1') { 重新选择用户类型
    //     this.unBindSelext()
    //   }
    // },
    // 选择角色后取消
    roleCancle() {
      this.roleSwitchFlag = false
    },
    // typeCancle () {
    //   this.popSetectBox = false
    // },
    goContract() {
      this.$router.push({
        name: 'MyContract',
      })
    },
    // // 监听用户状态
    // watchBpStatus () {
    //   if (!this.bp_id && this.user_bp_status === 'NEW') {
    //     this.description = '用户绑定'
    //     this.approveBtn = false
    //     this.popSetect = false
    //   } else if (this.bp_id && this.user_bp_status === 'NEW') {
    //     this.description = '待提交'
    //     this.approveBtn = false
    //     this.popSetect = true // 是否弹出选择框
    //   } else if (this.bp_id && this.user_bp_status === 'APPROVED') {
    //     this.description = '解除绑定'
    //     this.approveBtn = true
    //     this.popSetect = false
    //   } else if (
    //     (this.bp_id && this.user_bp_status === 'RETURN') ||
    //     (this.bp_id && this.user_bp_status === 'REJECT')
    //   ) {
    //     this.description = '审核未通过'
    //     this.approveBtn = false
    //     this.popSetect = true // 是否弹出选择框
    //   } else {
    //     this.description = '审批中'
    //     this.approveBtn = false
    //     this.popSetect = false
    //   }
    // },
    // 我的发票
    goInvoice() {
      this.$router.push({
        name: 'MyInvoice',
      })
    },
    // 合同创建
    // goCreate () {
    //   this.$router.push({
    //     name: 'ContractCreateList',
    //     params: {
    //       user_bp_type: this.user_bp_type,
    //     },
    //   })
    // },
    // 进入待签约功能，客户类型为经销商则进入经销商功能，非经销商则进入融租方案确认
    // goSign () {
    //   if (this.bp_id) {
    //     // if (this.user_bp_type === 'AGENT') {
    //     //   this.$router.push({
    //     //     name: 'ContractList',
    //     //   })
    //     // } else {
    //     this.$router.push({
    //       name: 'ContractSigning',
    //       params: {
    //         user_bp_type: this.user_bp_type,
    //       },
    //     })
    //     // }
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // 进入待确认，（进件确认）
    // goConfirm () {
    //   this.$router.push({
    //     name: 'IntoList',
    //   })
    //   // this.$router.push({
    //   //   name: 'IframTest',
    //   // })
    // },
    // 进入我的还款
    goReimburse() {
      if (this.nowBind.bp_id) {
        this.$router.push({
          name: 'ReimburseMyselfList',
        })
      } else {
        hlsPopup.showLongCenter('请先进行用户绑定')
      }
    },
    // 进入我的收藏
    goMyProduct() {
      this.$router.push({
        name: 'MyProductList',
      })
    },
    // 进入
    // changeContract (e) {
    //   this.$router.push({
    //     name: 'ContractRecords',
    //     params: {
    //       bp_type: e,
    //     },
    //   })
    // },
    // 进入融租合同创建
    // goStart () {
    //   if (this.bp_id) {
    //     this.$router.push({
    //       name: 'StartList',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // 进入合同签订
    // goCarConfirm () {
    //   if (this.bp_id) {
    //     this.$router.push({
    //       name: 'ConfirmList',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // goVideoSign () {
    //   if (this.bp_id) {
    //     this.$router.push({
    //       name: 'VideoSign',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    changeHelp() {
      this.$router.push({
        name: 'HelpList',
      })
    },
    // changeDrawbackList () {
    //   if (this.bp_id) {
    //     this.$router.push({
    //       name: 'DrawbackList',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // changePay () {
    //   if (window.localStorage.getItem('bp_id') !== 'undefined') {
    //     this.$router.push({
    //       name: 'FirstPay',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // changeRent () {
    //   if (window.localStorage.getItem('bp_id') !== 'undefined') {
    //     this.$router.push({
    //       name: 'NewList',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    // changeCash () {
    //   if (window.localStorage.getItem('bp_id') !== 'undefined') {
    //     this.$router.push({
    //       name: 'MarginFirstPay',
    //     })
    //   } else {
    //     hlsPopup.showLongCenter('请先进行用户绑定')
    //   }
    // },
    updateVersion() {
      if (vum.Platform.isAndroid()) {
        this.hote_update_version(
          '发现新版本是否更新',
          'http://hlsapp.hand-china.com/file/XCMG/www_myself/dev/android/www.zip'
        )
      } else {
        this.hote_update_version(
          '发现新版本是否更新',
          'http://hlsapp.hand-china.com/file/XCMG/www_myself/dev/ios/www.zip'
        )
      }
    },
    hote_update_version(content, url) {
      hlsPopup.showConfirm({
        title: '版本更新',
        content: content,
        onConfirm: function (index) {
          if (index === 1) {
            hotpatch.updateNewVersion(url)
          }
        },
      })
    },
    logOut() {
      let vm = this
      hlsPopup.showConfirm({
        title: '提示',
        content: '确定退出',
        onConfirm: function (index) {
          if (index === 1) {
            let width = window.localStorage.getItem('width')
            let height = window.localStorage.getItem('height')
            if (window.localStorage.isReadPolicy === 'false') {
              window.localStorage.clear()
            } else if (window.localStorage.isReadPolicy === 'true') {
              window.localStorage.clear()
              window.localStorage.setItem('isReadPolicy', true)
            } else {
              window.localStorage.clear()
            }
            window.localStorage.setItem('width', width)
            window.localStorage.setItem('height', height)
            vm.$router.push('/login')
            // location.reload()
          }
        },
      })
    },
    // unBindSelext () {
    //   let vm = this
    //   vm.popSetectBox = true
    //   hlsPopup.showConfirm({
    //     title: '提示',
    //     content: '确定解除绑定？',
    //     onConfirm: function (index) {
    //       if (index === 1) {
    //         let myPhone = window.localStorage.getItem('user_phone')
    //         let myPassword = window.localStorage.getItem('password')
    //         let url = process.env.basePath + 'bp_unbind'
    //         let param = {
    //           master: {
    //             phone: myPhone,
    //             password: myPassword,
    //           },
    //         }
    //         vm.hlsPopup.showLoading('请稍候')
    //         vm.hlsHttp.post(url, param).then(function (res) {
    //           vm.hlsPopup.hideLoading()
    //           if (res.result === 'S') {
    //             vm.hlsPopup.showLongCenter('解绑成功')
    //             if (window.localStorage.getItem('user_phone')) {
    //               vm.userQuery()
    //             }
    //             vm.approveBtn = false
    //             vm.$router.push({
    //               name: 'UserBind',
    //             })
    //           } else {
    //             vm.hlsPopup.showLongCenter(res.message)
    //           }
    //         })
    //       }
    //     },
    //   })
    // },

    // 解绑
    // unBind () {
    //   let vm = this
    //   hlsPopup.showConfirm({
    //     title: '提示',
    //     content: '确定解除绑定？',
    //     onConfirm: function (index) {
    //       if (index === 1) {
    //         // window.localStorage.clear()
    //         // vm.$router.push('/login')
    //         let myPhone = window.localStorage.getItem('user_phone')
    //         let myPassword = window.localStorage.getItem('password')
    //         let url = process.env.basePath + 'bp_unbind'
    //         let param = {
    //           master: {
    //             phone: myPhone,
    //             password: myPassword,
    //           },
    //         }
    //         vm.hlsPopup.showLoading('请稍候')
    //         vm.hlsHttp.post(url, param).then(function (res) {
    //           vm.hlsPopup.hideLoading()
    //           if (res.result === 'S') {
    //             vm.hlsPopup.showLongCenter('解绑成功')
    //             if (window.localStorage.getItem('user_phone')) {
    //               vm.userQuery()
    //             }
    //             // vm.flag = truet
    //             vm.approveBtn = false
    //           } else {
    //             vm.hlsPopup.showLongCenter(res.message)
    //           }
    //         })
    //       }
    //     },
    //   })
    // },
    checkType() {
      let vm = this
      this.hlsPopup.showActionSheet({
        buttonArray:
          vm.user_bp_type === 'MANAGER' ? ['修改头像'] : ['修改头像', '角色切换'],
        // '角色切换'
        callback: (index) => {
          if (index === 0) {
            this.imgUploadShow(vm.app_user_id)
          }
          //  else if (index === 2) {
          // this.changePageHead(this.nowBind);
          // }
          else if (index === 1) {
            // console.log(vm.user_bp_type);
            // console.log(vm.user_bp_status);
            if (
              (vm.user_bp_type === 'TENANT' ||
                vm.user_bp_type === 'GUTA' ||
                vm.user_bp_type === 'AGENT') &&
              vm.user_bp_status === 'APPROVED'
            ) {
              vm.$refs.roleSwitchRoleList.show()
            } else {
              hlsPopup.showLongCenter('您当前尚无可用角色')
            }
          }
        },
      })
    },

    // 角色列表 有用
    getMultipleRole() {
      let vm = this
      let url = process.env.basePath + 'bp_role_query'

      let param = {
        master: {
          bp_id: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_id,
          bp_type: JSON.parse(window.localStorage.getItem('now_user_bp_bind_id')).bp_type,
        },
      }
      vm.hlsHttp.post(url, param).then(function (res) {
        if (res.result === 'S') {
          let obj = {
            bp_type: JSON.parse(window.localStorage.getItem("now_user_bp_bind_id")).bp_type,
            bp_type_n: JSON.parse(window.localStorage.getItem("now_user_bp_bind_id")).bp_type_n,
          }
          vm.multiRoleList = [...res.lists, obj]
        }
      })
    },
    // 图片上传入口
    imgUploadShow(check_id) {
      let vm = this
      // vm.upload_list = []
      hlsPopup.showActionSheet({
        titleText: '请选择照片',
        buttonArray: ['拍照', '从相册取'],
        callback: (index) => {
          if (index === 0) {
            vm.imgUploadOpenCamera(check_id)
          } else {
            vm.imgUploadTakePicture(check_id)
          }
        },
      })
    },
    imgUploadOpenCamera(check_id) {
      let vm = this
      let obj = {
        pkvalue: check_id,
        source_type: 'HLS_APP_USER',
        picture: '',
        check_id: check_id,
        filePath: '',
        attachment_id: '',
        user_id: 1,
        fileName: '',
      }
      let cameraoptions = {
        quality: 100,
      }
      let success = function (imgdata) {
        obj.picture = hlsUtil.convertImageUrl(imgdata)
        obj.filePath = imgdata
        vm.upLoadObj = obj.picture
        vm.save_picture(obj)
      }
      let error = function () {
        hlsPopup.showLongCenter('请拍照')
      }
      hlsUtil.openCamera(cameraoptions, success, error)
    },
    imgUploadTakePicture(check_id) {
      let vm = this
      let obj = {
        pkvalue: check_id,
        source_type: 'HLS_APP_USER',
        picture: '',
        check_id: check_id,
        filePath: '',
        attachment_id: '',
        user_id: 1,
        fileName: '',
      }
      let cameraoptions = {
        quality: 100,
      }
      let success = function (imgUrl) {
        obj.picture = hlsUtil.convertImageUrl(imgUrl[0])
        obj.filePath = imgUrl[0]
        vm.upLoadObj = obj.picture
        console.log('$$$$$$$$$$$$$$$1' + imgUrl[0])
        // 拍完一张立马执行保存图片逻辑
        vm.save_picture(obj)
      }
      let error = function () {
        hlsPopup.showLongCenter('请选择图片')
      }
      vm.hlsUtil.takePicture(cameraoptions, success, error)
    },
    openCamera(ocrType, type) {
      let vm = this
      let cameraoptions = {
        quality: 60,
        width: 1843,
        height: 1382,
      }
      let success = function (imgdata) {
        if (!imgdata) {
          hlsPopup.showLongCenter('请拍照')
        }
      }
      let error = function () {
        hlsPopup.showLongCenter('请拍照')
      }
      hlsUtil.openCamera(cameraoptions, success, error)
    },
    takePicture(ocrType, type) {
      let vm = this
      var cameraoptions = {
        quality: 70,
        width: 1843,
        height: 1382,
        maxCount: 1,
      }
      let success = function (imgUrl) {
        if (imgUrl.length === 0) {
          hlsPopup.showLongCenter('请选择一张图片')
        }
      }
      let error = function () {
        hlsPopup.showLongCenter(error)
      }
      vm.hlsUtil.takePicture(cameraoptions, success, error)
    },
    save_picture(obj) {
      if (obj) {
        let success = function () {
          hlsPopup.showLongCenter('头像上传成功')
        }
        hlsUtil.fileUploadSvc(obj, success)
      } else {
        hlsPopup.hideLoading()
      }
    },

    // 修改信息逻辑
    changePageHead(item) {

      if (!Object.keys(item).length) return;

      if (item.bp_status === 'APPROVING') {
        this.hlsPopup.showLongCenter('您的绑定申请还在流程中');
        return;
      };

      let params = {
        bp_id: item.bp_id,
        user_bp_name: item.bp_name,
        bp_class: item.bp_class,
        status: item.bp_status,
        isAGENT: item.bp_type === 'AGENT', //是否为经销商
        isMultiRole: ["GUTA", "TENANT", "AGENT"].includes(item.bp_type) // 是否为 担保人/承租人 能否为多角色
      };

      let name = item.bp_class === "NP" ? "NPBaseInfo" : "EnterpriseNew";

      this.$router.push({ name, params });

      // let vm = this
      // if (vm.bp_id) {
      //   if (vm.user_bp_status === 'NEW' || vm.user_bp_status === 'RETURN') {
      //     vm.flag = true
      //     if (vm.user_bp_class === 'NP') {
      //       vm.$router.push({
      //         name: 'NPBaseInfo',
      //         params: {
      //           bp_id: this.bp_id,
      //           user_bp_name: this.user_bp_name,
      //         },
      //       })
      //     } else {
      //       this.$router.push({
      //         name: 'EnterpriseNew',
      //         params: {
      //           bp_id: this.bp_id,
      //           user_bp_name: this.user_bp_name,
      //           bp_class: vm.user_bp_class,
      //         },
      //       })
      //     }
      //   } else if (vm.user_bp_status === 'APPROVED') {
      //     vm.flag = false
      //     if (vm.user_bp_class === 'NP') {
      //       vm.$router.push({
      //         name: 'NPBaseInfo',
      //         params: {
      //           bp_id: this.bp_id,
      //           user_bp_name: this.user_bp_name,
      //           isAGENT: this.isAGENT,
      //           status: 'APPROVED',
      //           isMultiRole: this.isMultiRole,
      //         },
      //       })
      //     } else {
      //       this.$router.push({
      //         name: 'EnterpriseNew',
      //         params: {
      //           bp_id: this.bp_id,
      //           user_bp_name: this.user_bp_name,
      //           isAGENT: this.isAGENT,
      //           status: 'APPROVED',
      //           isMultiRole: this.isMultiRole,
      //           bp_class: vm.user_bp_class,
      //         },
      //       })
      //     }
      //   } else if (vm.user_bp_status === 'REJECT') {
      //     vm.flag = true
      //     if (vm.user_bp_class === 'NP') {
      //       vm.$router.push({
      //         name: 'NPBaseInfo',
      //         params: {
      //           bp_id: this.bp_id,
      //           isMultiRole: this.isMultiRole,
      //           user_bp_name: this.user_bp_name,
      //           status: 'APPROVED',
      //         },
      //       })
      //     } else {
      //       this.$router.push({
      //         name: 'EnterpriseNew',
      //         params: {
      //           bp_id: this.bp_id,
      //           isMultiRole: this.isMultiRole,
      //           user_bp_name: this.user_bp_name,
      //           bp_class: vm.user_bp_class,
      //           status: 'APPROVED',
      //         },
      //       })
      //     }
      //   } else if (vm.user_bp_status === 'APPROVING') {
      //     vm.flag = true
      //     this.hlsPopup.showLongCenter('您的绑定申请还在流程中')
      //   }
      // } else {
      //   vm.flag = true
      //   this.$router.push({
      //     name: 'UserBind',
      //   })
      // }
    },

    // userQuery () {
    // let vm = this
    // let url = $config.basePath + 'user_query'
    // let param = {
    //   // phone: window.localStorage.getItem('user_phone'),
    //   bp_id: vm.nowBind.bp_id
    // }
    // vm.hlsPopup.showLoading('请稍候')
    // vm.$post(url, param).then(function (res) {
    //   if (res.result === 'S') {
    //     if (res.info.user_bp_status === 'APPROVED') {
    //       vm.flag = false
    //     }
    //     window.localStorage.setItem('user_phone', res.info.user_phone)
    //     vm.user_bp_status = res.info.user_bp_status
    //     vm.user_bp_class = res.info.user_bp_class
    //     vm.bp_id = res.info.user_bp_id
    //     vm.bp_identity = res.info.bp_identity
    //     vm.app_user_id = res.info.app_user_id
    //     window.localStorage.removeItem('bp_id')
    //     window.localStorage.setItem('bp_id', res.info.user_bp_id)
    //     window.localStorage.setItem('user_bp_status', res.info.user_bp_status)
    //     window.localStorage.setItem('bp_name', res.info.user_bp_name)
    //     window.localStorage.setItem('bp_identity', res.info.bp_identity)
    //     window.localStorage.setItem('bp_class', res.info.user_bp_class)
    //     if (localStorage.bp_type || localStorage.multipleRole) {

    //     } else {
    //       window.localStorage.setItem('bp_type', res.info.user_bp_type)
    //       window.localStorage.setItem('multipleRole', res.info.user_bp_type)
    //     }
    //     vm.user_bp_name = res.info.user_bp_name
    //     vm.user_bp_type = res.info.user_bp_type
    //     vm.user_phone = res.info.user_phone
    //     vm.bp_type_n = res.info.user_bp_type_n
    //     vm.watchBpStatus()
    //     vm.getHead()
    //     vm.getMultipleRole()
    //     if (vm.user_bp_type === 'AGENT') {
    //       vm.isAGENT = true
    //     } else {
    //       vm.isAGENT = false
    //     }
    //     if (
    //       vm.user_bp_type === 'GUTA' ||
    //       vm.user_bp_type === 'TENANT' ||
    //       vm.user_bp_type === 'AGENT'
    //     ) {
    //       vm.isMultiRole = true
    //     } else {
    //       vm.isMultiRole = false
    //     }
    //   } else {
    //     this.hlsPopup.showLongCenter(res.message)
    //   }
    // })
    // },

    // 各种角标的数量
    // numQuery () {
    //   let vm = this
    //   let url = $config.basePath + 'number_display_query'
    //   let param = {
    //     user_phone: window.localStorage.getItem('user_phone'),
    //   }
    //   vm.$post(url, param).then(function (res) {
    //     if (res.result === 'S') {
    //       if ('info' in res) {
    //         vm.signCount = res.info.con_confirm_num || 0
    //         // vm.confirmCount = res.info.con_confirm_num
    //         vm.productCount = res.info.collect_num || 0
    //         vm.carCount = res.info.car_confirm_num || 0
    //         vm.faceSign = res.info.face_sign_num || 0
    //         vm.prjSubmit = res.info.prj_submit_num || 0
    //       }
    //     } else {
    //       this.hlsPopup.showLongCenter(res.message)
    //     }
    //   })
    // },
    // 认证入口
    // async certification () {
    //   let vm = this
    //   let authFlag = await vm.getNpCertificationUrl()
    //   if (authFlag === true) {
    //     if (vm.bp_id) {
    //       if (vm.bp_identity === 'NP_NO' || vm.bp_identity === 'ORG_L_NO' || vm.bp_identity === 'ORG_AUTH_NO') {
    //         let url = process.env.basePath + 'bp_query'
    //         let param = {
    //           bp_id: window.localStorage.bp_id,
    //         }
    //         hlsPopup.showLoading('请稍候')
    //         vm.hlsHttp.post(url, param).then((result) => {
    //           hlsPopup.hideLoading()
    //           if (result.result === 'S') {
    //             let data = result.lists[0]
    //             cordova.plugins.IdCardPlugin.idCardIdentify(
    //               {
    //                 idNum: data.id_card_no,
    //                 idName: data.bp_name,
    //                 phoneNum: window.localStorage.user_phone,
    //               },
    //               function (suc) {
    //                 let success = JSON.parse(suc)
    //                 if (success.code === 1) {
    //                   if (window.localStorage.getItem('user_phone')) {
    //                     // vm.userQuery()
    //                   }
    //                 }
    //               },
    //               function (reason) {
    //                 let error = JSON.parse(reason)
    //                 vm.hlsPopup.showLongCenter('认证失败: ' + error.message)
    //               }
    //             )
    //           } else {
    //             vm.hlsPopup.showLongCenter(result.message)
    //           }
    //         })
    //       } else if (vm.bp_identity === 'ORG_NO') {
    //         hlsPopup.showLongCenter('APP端不支持认证企业账号，请移步PC端操作')
    //       } else {
    //         hlsPopup.showLongCenter('您已认证通过')
    //       }
    //     } else {
    //       hlsPopup.showLongCenter('请先进行用户绑定！')
    //     }
    //   } else if (authFlag === false) {
    //     hlsPopup.showLongCenter('用户已绑定！')
    //     if (window.localStorage.getItem('user_phone')) {
    //       // vm.userQuery()
    //     }
    //   }
    // },
    // async getNpCertificationUrl () {
    //   let vm = this
    //   let url = $config.basePath + 'auth_user_sign'
    //   let param = {
    //     phone: vm.user_phone,
    //   }
    //   hlsPopup.showLoading('请稍候')
    //   let res = await vm.$post(url, param)
    //   hlsPopup.hideLoading()
    //   if (res.info.code === 0 && res.info.data.authUrl) {
    //     // hlsPopup.showLongCenter('绑定失败！')
    //     return true
    //   } else if (res.info.code === 0 && res.info.data.openId) {
    //     // hlsPopup.showLongCenter('绑定成功！')
    //     // vm.userQuery()
    //     return false
    //   } else {
    //     hlsPopup.showLongCenter(res.info.msg)
    //     return ''
    //   }
    // },
    // 获取企业认证url
    // async getOrgCertificationUrl () {
    //   let vm = this
    //   let url = $config.basePath + 'auth_company_sign'
    //   let param = {
    //     phone: vm.user_phone,
    //   }
    //   hlsPopup.showLoading('请稍候')
    //   let res = await vm.$post(url, param)
    //   hlsPopup.hideLoading()
    //   if ((res.info.code === 0) && (res.info.data.authUrl)) {
    //     hlsPopup.showLongCenter('绑定失败！')
    //   } else if ((res.info.code === 0) && (res.info.data.openId)) {
    //     hlsPopup.showLongCenter('绑定成功！')
    //     if (window.localStorage.getItem('user_phone')) {
    //       // vm.userQuery()
    //     }
    //   } else {
    //     hlsPopup.showError(res.info.msg)
    //   }
    // },

    goAbout() {
      this.$router.push({
        name: 'About',
      })
    },
    goSetting() {
      this.$router.push({
        name: 'Setting',
      })
    },
    goContactUs() {
      this.$router.push({
        name: 'ContactUs',
      })
    },
  },
}
</script>

<style lang="less" scoped>
#my-info {
  /* .content-wrap{
    margin-left:40px;
  }
  .content-wrap:not(:nth-of-type(1)){
    margin-left:70px;
  }*/
  .card-top {
    width: 330px;
    margin: 0 auto;
    height: 2.4rem;
    display: flex;
    align-items: center;
    .sign {
      margin-left: 24px;
      height: 55px;
      span {
        font-family: PingFangSC-Semibold;
        font-size: 18px;
        color: #fff;
        margin-top: 10px;
      }
      div {
        display: flex;
        align-items: center;
        margin-top: 10px;
        font-family: PingFangSC-Regular;
        font-size: 12px;
        color: #ffffff;
        letter-spacing: 0;
        p {
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 0 5px;
          height: 20px;
          margin-left: 10px;
          border: 1px solid #fff;
          border-radius: 4px;
          font-family: PingFangSC-Regular;
          font-size: 12px;
          color: #ffffff;
          letter-spacing: 0;
        }
        .across {
          background-color: #1d3fff;
        }
        .un-across {
          background: #0523ce;
        }
      }

      .now-bind {
        display: flex;
        min-width: 220px;
        justify-content: space-between;
        align-items: center;

        span {
          font-size: 15px;
          color: orange;
          margin: 0;
          max-width: 180px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }

        div {
          color: orange;
          border: 1px solid orange;
          padding: 2px 5px;
          border-radius: 2px;
          cursor: pointer;
          margin: 0;
        }
      }
    }
    img {
      width: 59px;
      height: 59px;
      border-radius: 50%;
      border: 1px solid #00469c;
    }
  }

  .bind-user {
    background-color: #efefef;
    .box {
      box-sizing: border-box;
      width: 90%;
      background-color: #fff;
      margin: 0 auto;
      transform: translateY(-12px);
      min-height: 70px;
      border-radius: 10px;
      padding: 10px 10px 0 10px;
    }
    .title {
      color: rgb(252, 205, 46);
      font-size: 90%;
      font-weight: 600;
      margin-bottom: 10px;
    }

    .no-user {
      line-height: 50px;
      text-align: center;
      color: rgb(205, 209, 213);
      font-size: 90%;

      a {
        text-decoration: underline;
      }
    }

    .bind-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 30px;
      font-size: 85%;
      border-bottom: 1px solid rgb(242, 242, 242);
      color: #333;
      p {
      }

      div {
        font-size: 75%;
        border-radius: 3px;
        border: 1px solid blue;
        padding: 2px 3px;
        color: blue;
      }
    }

    .more {
      height: 31px;
      display: flex;
      justify-content: center;
      align-items: center;
      color: rgb(213, 217, 224);
      font-size: 85%;
      // text-align: center;
      // line-height: 31px;
      font-weight: 600;
    }
  }

  .has {
    height: 206px;
  }
  .antiHas {
    height: 3.12rem;
  }
  .top {
    width: 100%;
    // height: 206px;
    background: url("../../assets/myInfo/back.png") no-repeat;
    background-size: 100% 156px;
    background-color: #efefef;
    .header {
      background-color: rgba(0, 0, 0, 0);
      .top-word {
        font-family: PingFangSC-Semibold;
        font-size: 17px;
        letter-spacing: 0.61px;
        color: #fff;
      }
    }
    .card {
      width: 359px;
      height: 108px;
      margin: 0 auto;
      z-index: 10;
      position: relative;
      top: 0px;
      left: 0px;
      background-color: #fff;
      border-radius: 4px;
      .card-info {
        width: 295px;
        margin: 0 auto;
        .card-bottom {
          height: 100px;
          width: 285px;
          margin: 0 auto;
          display: flex;
          justify-content: flex-start;
          align-items: center;
          text-align: center;
          p {
            font-family: PingFangSC-Regular;
            font-size: 13px;
            color: #3c3d48;
            margin-top: 5px;
          }
          img {
            width: 48px;
            height: 48px;
          }
          div:not(:first-child) {
            margin-left: 60px;
          }
        }
      }
    }
  }
  .my-content {
    overflow: hidden;
    background-color: #efefef;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    .content-top {
       overflow-y: scroll;
      width: 339px;
      height: 96%;
      // height: 121px;
      background-color: #efefef;
      border-radius: 4px;
      margin-top: 8px;
      .version {
        background-color: #efefef;
        padding: 10px 0;
        text-align: center;
        font-family: PingFangSC-Regular;
        font-size: 14px;
        color: #656464;
      }
    }
    .userInfo {
      height: 45px;
      line-height: 45px;
      color: @headerColor;
      font-size: 15px;
      margin-left: 16px;
      position: relative;
    }
    .userInfo::before {
      content: "";
      display: block;
      width: 4px;
      height: 20px;
      background-color: @headerColor;
      position: absolute;
      left: -15px;
      top: 12px;
    }
    .my-contract {
      // width: 295px;
      margin: 0 auto;
      display: flex;
      // justify-content: space-around;
      // align-items: center;
      // flex:1;
      text-align: center;
      padding: 0 6%;
      justify-content: flex-start;
      .content-wrap {
        position: relative;
        width: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        .content-wrap-class {
          position: absolute;
          top: -10px;
          left: 56px;
          font-size: 10px;
          width: 18px;
          height: 18px;
          text-align: center;
          line-height: 18px;
          background-color: red;
          color: #fff;
          border-radius: 50%;
        }
        .content-wrap-class-width {
          position: absolute;
          top: -10px;
          left: 25px;
          font-size: 10px;
          width: 24px;
          height: 18px;
          text-align: center;
          line-height: 18px;
          background-color: red;
          color: #fff;
          border-radius: 50%;
        }
      }
      img {
        width: 38px;
        height: 38px;
      }
      p {
        font-family: PingFangSC-Regular;
        font-size: 12px;
        color: #383f45;
        margin-top: 5px;
      }
      /* div:not(:first-child) {
        margin-left: 85px;
      }*/
    }
    .list {
      width: 339px;
      margin: 0 auto;
      background-color: #fff;
      font-family: PingFangSC-Regular;
      font-size: 14px;
      color: #656464;
      letter-spacing: 0;
      line-height: 18px;
    }
  }
  button {
    width: 339px;
    height: 40px;
    background: @headerColor;
    border-radius: 4px;
    color: #fff;
    margin: 0 auto;
    margin-bottom: 68px;
    margin-top: 10px;
  }
}
.content {
  position: relative;
  background-color: #fff;
}
.right-icon {
  width: 18px;
  height: 18px;
  font-size: 10px;
  text-align: center;
  line-height: 18px;
  background-color: red;
  color: #fff;
  border-radius: 50%;
}
.right-icon-width {
  width: 24px;
  height: 18px;
  font-size: 10px;
  text-align: center;
  line-height: 18px;
  background-color: red;
  color: #fff;
  border-radius: 50%;
}
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
  .platform-ios {
    #my-info {
      button {
        margin-bottom: 98px;
      }
    }
  }
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
  .platform-ios {
    #my-info {
      button {
        margin-bottom: 98px;
      }
    }
  }
}
</style>