<template>
  <view>
    <view class="site">
      <view class="header-toper">
        <!-- <view class="start-bar"></view> -->
        <view class="header-toper-title">
          <image src="../../static/img/back.png" mode="" @click="goPage('../index/index')"></image>
          <text>{{ $lang.lang.site.set }}</text>
        </view>
      </view>
      <!-- <view class="start-bar"></view> -->
      <view class="items mt200">
        <view class="items-v">
          <image src=".../../static/img/site_vip.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.vip }}</text>
            <view class="text">{{ userScoreLevelInfo.levelName }}</view>
          </view>
        </view>
        <view class="items-v" @click="$request.goPage('../auth/auth')">
          <image src=".../../static/img/site_auth.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.auth }}</text>
            <view
              :class="
                idStatus == 2
                  ? 'items-v-it-rt color36'
                  : idStatus == 1
                  ? 'items-v-it-rt rte6'
                  : 'items-v-it-rt'
              "
              >{{ noticeId }}</view
            >
          </view>
        </view>
        <view class="items-v">
          <image src=".../../static/img/site_company.png" mode=""></image>
          <view class="items-v-it noborder">
            <text>{{ $lang.lang.site.comAuth }}</text>
            <view
              :class="
                companyStatus == 2
                  ? 'items-v-it-rt color36'
                  : companyStatus == 1
                  ? 'items-v-it-rt rte6'
                  : 'items-v-it-rt'
              "
              >{{ companyNotice }}</view
            >
          </view>
        </view>
      </view>

      <view class="items">
        <view class="items-v">
          <image src=".../../static/img/site_tel.png" mode=""></image>
          <view class="items-v-it">
            <text v-if="userInfo"
              >{{ $lang.lang.site.bindTel }}:
              {{ userInfo.areaCode ? $request.checkAddIcon(userInfo.areaCode) : ''
              }}{{
                userInfo.mobile
                  ? userInfo.mobile.substr(0, 3) + '****' + userInfo.mobile.substr(8, 3)
                  : $lang.lang.site.unbind
              }}</text
            >
            <view class="items-v-it-rt rte036" @click="changMobile">{{
              $lang.lang.site.changeBind
            }}</view>
          </view>
        </view>
        <view class="items-v">
          <image src=".../../static/img/mail.png" mode=""></image>
          <view class="items-v-it">
            <text v-if="userInfo"
              >{{ $lang.lang.site.bindEmail }}:<span class="email">{{
                userInfo.email || $lang.lang.site.unbind
              }}</span></text
            >
            <view class="items-v-it-rt rte036" @click="changMail">{{
              userInfo.email ? $lang.lang.site.changeBind : $lang.lang.site.tobind
            }}</view>
          </view>
        </view>
        <view class="items-v" @click="toEditPsd">
          <image src=".../../static/img/site_pass.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.editPsd }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
        <view class="items-v" @click="$request.goPage('../telcode/telcode')">
          <image src=".../../static/img/site_pass.png" mode=""></image>
          <view class="items-v-it noborder">
            <text>{{ $lang.lang.site.controlPsd }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
      </view>

      <view class="items">
        <view class="items-v" @click="toMyInfo">
          <image src=".../../static/img/site_person.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.info }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
        <view class="items-v" @click="toCompanyInfo">
          <image src=".../../static/img/site_company.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.companyInfo }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
        <view class="items-v" @click="toAddress">
          <image src=".../../static/img/site_address.png" mode=""></image>
          <view class="items-v-it noborder">
            <text>{{ $lang.lang.site.address }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
      </view>

      <view class="items">
        <view class="items-v" @click="$request.goPage('../help/help')">
          <image src=".../../static/img/site_help.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.help }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
        <view class="items-v" @click="$request.goPage('../ecash/ecash')">
          <image src=".../../static/img/site_person.png" mode=""></image>
          <view class="items-v-it noborder">
            <text>{{ $lang.lang.site.search }}</text>
            <image class="rgt" src="../../static/img/rgt.png" mode=""></image>
          </view>
        </view>
      </view>
      <!-- 			<view class="es-btn" @click="getAdData(1)">
				<text>V{{version}}<text class="redtext" v-if="adData">{{$lang.lang.notices.newVersions}}</text></text>
			</view>
			<view class="es-btn">
				<text>V{{version}}</text>
			</view> -->
      <view class="items">
        <!-- #ifdef APP-PLUS -->
        <view class="items-v" @click="getAdData(1)">
          <image src=".../../static/img/site_person.png" mode=""></image>
          <view class="items-v-it">
            <text
              >V{{ version
              }}<text class="redtext" v-if="adData">{{
                $lang.lang.notices.newVersions
              }}</text></text
            >
            <!-- <image class="rgt" src="../../static/img/rgt.png" mode=""></image> -->
          </view>
        </view>
        <!-- #endif -->
        <view class="items-v">
          <image src=".../../static/img/earth.png" mode=""></image>
          <view class="items-v-it">
            <text>{{ $lang.lang.site.change }}</text>
            <picker class="languageCode" :range="languageName" :value="index" @change="changeLang">
              <view class="uni-input">{{languageName[index]}}</view>
            </picker>
          </view>
        </view>
      </view>
    </view>
    <view class="footer">
      <view @click="loginOut">{{ $lang.lang.site.exit }}</view>
    </view>
    <view class="footer2">
      <view @click="loginOff" class="logoff">{{ $lang.lang.site.logOff }}</view>
    </view>

    <uni-popup ref="adpopup" type="center" :mask-click="false">
      <view class="ad-conten">
        <image
          v-if="!forceUpdate"
          @click="closeAd"
          class="ad-bg"
          src="../../static/img/index_close.png"
        ></image>
        <view class="ad-title">V{{ appVersion }}{{ $lang.lang.notices.newVersion }}</view>
        <view class="ad-info">
          <rich-text :nodes="adData"></rich-text>
        </view>
        <view class="ad-btns">
          <view class="ad-btn" @click="toupdate">
            <view>{{ $lang.lang.notices.update }}</view>
          </view>
          <view v-if="!forceUpdate" class="ad-btn" @click="closeAd">
            <view>{{ $lang.lang.notices.close }}</view>
          </view>
        </view>
        <view class="progress" v-if="showdownLine">
          <progress :percent="downloadNum" show-info stroke-width="3" />
        </view>
      </view>
    </uni-popup>
    <uni-popup ref="newpass" type="center">
      <view class="newpass_content">
        <view class="newpss_title">{{ $lang.lang.site.startPsd }}</view>
        <view class="login-item">
          <view class="login-vp login-v">
            <input
              class="vp-input"
              v-model="password"
              type="password"
              maxlength="32"
              :placeholder="$lang.lang.notices.numPsd"
            />
          </view>
          <view class="login-vp login-v">
            <input
              class="vp-input"
              v-model="password2"
              type="password"
              maxlength="32"
              :placeholder="$lang.lang.notices.password"
            />
          </view>
        </view>
        <view class="login-btns">
          <view class="" @click="setpsd">{{ $lang.lang.site.confirm }}</view>
          <view class="" @click="$refs.newpass.close()">{{ $lang.lang.site.cancel }}</view>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
import storage from '../../utils/storage'
export default {
  data() {
    return {
      userInfo: {},
      index: 0,
      languageName:['Chinese', 'English','French'],
      language:'zh',
      languages: [
        { value: 'zh', text: "Chinese" },
        { value: 'en', text: "English" },
        { value: 'fr', text: "French" },
      ],
      noticeId: this.$lang.lang.site.unauth,
      statusData: [],
      companyNotice: this.$lang.lang.site.unauth,
      idStatus: 0,
      companyStatus: 0,
      password: '',
      password2: '',
      isHavePassword: false,
      locale: this.$request.getLocale(),
      version: '1.0.2',
      appUrl: '',
      adData: '',
      versionCode: 0,
      appVersion: '',
      forceUpdate: 0,
      showdownLine: false,
      downloadNum: 0, //下载百分比
      totalSize: 0, //下载总量
      // 用户等级信息
      userScoreLevelInfo: {}
    }
  },
  onLoad() {
    this.getVersion()
    this.getStatusData()
    //#ifdef APP-PLUS
    this.getAdData(2)
    //#endif
  },
  onShow() {
    this.getUserInfo()
    setTimeout(() => {
      // this.getCompany()
      this.getIdcard()
    }, 500)
  },
  methods: {
    toupdate() {
      let that = this
      if (that.showdownLine) return
      // #ifdef APP-PLUS

      let platform = uni.getSystemInfoSync().platform.toLocaleLowerCase()
      if (platform == 'ios') {
        plus.runtime.openURL('https://apps.apple.com/us/app/e-c-logistics/id6466407990')
      } else {
        // uni.showLoading({
        // 	title: this.$lang.lang.notices.startDown,
        // })
        that.showdownLine = true
        uni.showLoading({
          title: this.$lang.lang.notices.startDown
        })
        var dtask = plus.downloader.createDownload(
          that.appUrl,
          {
            timeout: 60,
            retry: 1,
            retryInterval: 3
          },
          (d, status) => {
            if (status == 200) {
              uni.hideLoading()
              that.closeVe()
              that.showdownLine = false
              console.log('下载成功安装: ' + d.filename)
              plus.runtime.install(
                d.filename,
                {},
                () => {},
                function (error) {
                  uni.showToast({
                    title: that.$lang.lang.notices.failDown,
                    duration: 1500,
                    icon: 'none'
                  })
                }
              )
            } else {
              that.showdownLine = false
              that.closeVe()
              plus.nativeUI.alert(that.$lang.lang.notices.failDown)
            }
          }
        )

        // uni.navigateTo({
        // 	url:'../updateView/updateView?url='+this.appUrl
        // })

        try {
          dtask.start()
          // 下载进度
          dtask.addEventListener('statechanged', function (download, status) {
            if (that.downloadNum == 100) {
              uni.hideLoading()
            }
            switch (download.state) {
              case 1:
                showLoading.setTitle('正在下载')
                break
              case 2:
                break
              case 3: //进度条百分比 totalSize为总量，baifen为当前下载的百分比
                if (that.totalSize == 0) {
                  that.totalSize = parseInt(download.totalSize)
                }
                if (
                  parseInt((download.downloadedSize / that.totalSize) * 100) != that.downloadNum
                ) {
                  that.downloadNum = parseInt((download.downloadedSize / that.totalSize) * 100)
                }
                break
              case 4:
                // mui.toast("下载完成");
                uni.hideLoading()
                break
            }
          })
        } catch (err) {
          uni.hideLoading()
          that.showdownLine = false
          that.closeVe()
          uni.showToast({
            title: that.$lang.lang.notices.failDown,
            duration: 1500,
            icon: 'none'
          })
        }
      }
      // #endif
    },
    openAd() {
      this.$refs.adpopup.open()
    },
    closeAd() {
      this.$refs.adpopup.close()
    },
    getAdData(n) {
      let that = this
      var addType = uni.getSystemInfoSync().platform == 'ios' ? 'userIos' : 'userAndroid'
      that.$request
        .get('/app-api/system/version/latestVersion', {
          appType: addType,
          versionCode: that.versionCode
        })
        .then((res) => {
          if (res.code == 0 && res.data) {
            that.adData = res.data.desp
            that.appUrl = res.data.appUrl
            that.appVersion = res.data.appVersion
            that.forceUpdate = res.data.forceUpdate
            if (n == 1) {
              that.openAd()
            }
          } else {
            if (n == 1) {
              uni.showToast({
                title: that.$lang.lang.notices.nowNews,
                icon: 'none'
              })
            }
          }
        })
    },
    changeLang(e) {
      this.index = e.detail.value
      const data = this.languages[e.detail.value].value;
      this.locale = data
      uni.setStorageSync('locale', data)
      uni.setLocale(data);
      this.$lang.setLang(data)
      this.getIdcard()
      ;(this.companyNotice = this.$lang.lang.site.unauth),
        uni.showToast({
          title: data == 'zh' ? '切换成功' : 'Handover successful'
        })
    },
    goPage() {
      uni.reLaunch({
        url: '../index/index',
        success() {}
      })
    },
    toEditPsd() {
      if (!this.isHavePassword) {
        this.$refs.newpass.open()
      } else {
        uni.navigateTo({
          url: '../editPsd/editPsd'
        })
      }
    },
    changMobile() {
      if (!this.isHavePassword) {
        this.$refs.newpass.open()
      } else {
        uni.navigateTo({
          url: '../changeTel/changeTel'
        })
      }
    },
    getUserInfo() {
      this.$request.get('/app-api/member/user/get').then((res) => {
        if (res.code == 0 && res.data) {
          this.userInfo = res.data
          this.isHavePassword = this.userInfo.isHavePassword
          this.userScoreLevelInfo = res.data.userScoreLevelInfo
        }
      })
    },
    loginOut() {
      uni.removeStorageSync('Authorization')
      storage.clean()
      uni.navigateTo({
        url: '../login/login'
      })
    },
    getIdcard() {
      this.$request.get('/app-api/member/user/get-auth-idcard-info').then((res) => {
        if (res.code == 0 && res.data) {
          this.noticeId = this.getNoticeName(res.data.status)
          this.idStatus = res.data.status
        }
      })
    },
    getCompany() {
      this.$request.get('/app-api/member/user/get-auth-enterprise-info').then((res) => {
        if (res.code == 0 && res.data) {
          this.companyNotice = this.getNoticeName(res.data.status)
          this.companyStatus = res.data.status
        }
      })
    },
    getNoticeName(status) {
      var arr = this.statusData.find((item) => item.value == status)
      if (arr) {
        return arr[this.$lang.label]
      } else {
        return ''
      }
    },
    getVersion() {
      this.version = uni.getStorageSync('appversion')
      this.versionCode = uni.getStorageSync('versionCode')
    },
    getStatusData() {
      this.$request.getConfig('audit_status').then((res) => {
        if (res.code == 0 && res.data && res.data.list.length > 0) {
          this.statusData = res.data.list
        }
      })
    },
    toMyInfo() {
      uni.navigateTo({
        url: '../my_info/my_info'
      })
    },
    toCompanyInfo() {
      uni.navigateTo({
        url: '../company_info/company_info'
      })
    },
    changMail() {
      if (!this.isHavePassword) {
        this.$refs.newpass.open()
      } else {
        uni.navigateTo({
          url: '../edit_mail/edit_mail'
        })
      }
    },
    setpsd() {
      let params = {
        password: this.password2
      }

      if (this.password == '') {
        return uni.showToast({
          title: this.$lang.lang.notices.password,
          icon: 'error'
        })
      } else {
        var reg1 = new RegExp('^(?=.*[0-9])(?=.*[a-zA-Z])(.{6,32})$')
        if (!reg1.test(this.password)) {
          return uni.showToast({
            title: this.$lang.lang.notices.numPsd,
            icon: 'error'
          })
        }
      }
      if (this.password2 == '') {
        return uni.showToast({
          title: this.$lang.lang.notices.nextPsd,
          icon: 'error'
        })
      }
      if (this.password != this.password2) {
        return uni.showToast({
          title: this.$lang.lang.notices.different,
          icon: 'none'
        })
      }
      let that = this
      that.$request.post('/app-api/member/update-password', params).then((res) => {
        if (res.code == 0) {
          that.getUserInfo()
          that.$refs.newpass.close()
          uni.showToast({
            title: this.$lang.lang.notices.edited,
            icon: 'none'
          })
        } else {
          uni.showToast({
            title: res.msg,
            icon: 'none'
          })
        }
      })
    },
    loginOff() {
      let that = this
      uni.showModal({
        title: '提示',
        content: that.$lang.lang.site.logNotice,
        success: function (res) {
          if (res.confirm) {
            that.$request.deleted('/app-api/member/member/cancellation').then((res) => {
              if (res.code == 0 && res.data) {
                storage.clean()
                uni.showToast({
                  title: that.$lang.lang.site.offSuccess,
                  icon: 'none'
                })
                uni.setStorageSync('Authorization', '')
                setTimeout(() => {
                  uni.reLaunch({
                    url: '../login/login'
                  })
                  // uni.reLaunch({
                  // 	url: '../login/login'
                  // })
                }, 2000)
              } else {
                uni.showToast({
                  title: res.msg,
                  icon: 'none'
                })
              }
            })
          } else if (res.cancel) {
            console.log('用户点击取消')
          }
        }
      })
    },
    // 跳转地址信息
    toAddress() {
      uni.navigateTo({
        url: '../address/address'
      })
    }
  }
}
</script>

<style>
@import url(../../static/css/site.css);
</style>
