<template>
  <v-page>
    <v-header :title="$t('safe.c7')"></v-header>
    <view class="layout-main" style="background-color: #121212;">
		<scroll-view>
    	<view class=" m-x-lg m-y-lg p-x-md bg-panel-3 rounded-md box-shadow">
    	  <view class="list">
    	    <!-- --------google------ -->
    	    <!-- <v-link
    	      tag="li"
    	      to="/pages/safe/google"
    	      class="item link-active d-flex p-x-md p-y-md align-center border-b"
    	    >
    	      <view class="flex-fill d-flex justify-between m-r-xs">
    	        <view class="color-light">{{$t('safe.b9')}}</view>
    	        <van-switch v-if="user.google_token" @click.native.stop @input="switchVer(3)" size="28rpx" :checked="user.google_status==1" />
    	      </view>
    	      <van-icon name="arrow" />
    	    </v-link> -->
    	    <!-- -------login---------- -->
			<v-link tag="li" to="/pages/safe/login-password" class="item link-active d-flex align-center" style="padding: 10px 0px;">
				<view class="img_info">
					<img src="@/assets/img/info1.png" style="width: 20px;" />
				</view>
				<view class="flex-fill d-flex justify-between m-r-xs">
					<view class="color-light">{{$t('safe.c8')}}</view>
				</view>
				<van-icon name="arrow" />
    	    </v-link>
			
    	    <!-- ----------交易密码---------- -->
    	   <!-- <v-link
    	      tag="li"
    	      to="/pages/safe/transaction-password"
    	      class="item link-active d-flex p-x-md p-y-md align-center border-b"
    	    >
    	      <view class="flex-fill d-flex justify-between m-r-xs">
    	        <view class="color-light">{{$t('safe.d1')}}</view>
    	      </view>
    	      <van-icon name="arrow" />
    	    </v-link> -->
    	    <!-- -----------邮箱--------- -->
    	    <!-- <v-link
    	      tag="li"
    	      to="/pages/safe/email"
    	      class="item link-active d-flex p-x-md p-y-md align-center border-b"
    	    >
    	      <view class="flex-fill d-flex justify-between m-r-xs">
    	        <view class="color-light">{{$t('safe.a2')}}</view>
    	        <van-switch v-if="user.email" @click.native.stop @input="switchVer(2)" size="28rpx" :checked="user.email_status==1" />
    	      </view>
    	      <van-icon name="arrow" />
    	    </v-link> -->
    	    <!-- ----------手机---------- -->
    	    <!-- <v-link
    	      tag="li"
    	      to="/pages/safe/phone"
    	      class="item link-active d-flex p-x-md p-y-md align-center border-b"
    	    >
    	      <view class="flex-fill d-flex justify-between m-r-xs">
    	        <view class="color-light">{{$t('safe.d2')}}</view>
    	        <van-switch v-if="user.phone" @click.native.stop @input="switchVer(1)" size="28rpx" :checked="user.phone_status==1" />
    	      </view>
    	      <van-icon name="arrow" />
    	    </v-link> -->
    	  </view>
    	</view>
		<!-- 提款密码 -->
		<view class=" m-x-lg m-y-lg bg-panel-3 rounded-md box-shadow">
			<view class="list">
				<v-link tag="li" to="/pages/safe/withdrawals-pwd" class="item link-active d-flex p-x-md align-center" style="padding: 10px 0px;">
					<view class="img_info">
						<img src="@/assets/img/info5.png" style="width: 20px;" />
					</view>
					<view class="flex-fill d-flex justify-between m-r-xs">
						<view class="color-light">{{$t('common.c30')}}</view>
					</view>
					<van-icon name="arrow" />
				</v-link>
			</view>
		</view>
		<view class=" m-x-lg m-y-lg bg-panel-3 rounded-md box-shadow">
			<view class="list">
				<v-link tag="li" @click.native="ResetClick" to="" class="item link-active d-flex p-x-md align-center" style="padding: 10px 0px;">
					<view class="img_info">
						<img src="@/assets/img/info6.png" style="width: 20px;" />
					</view>
					<view class="flex-fill d-flex justify-between m-r-xs">
						<view class="color-light">{{$t('common.c15')}}</view>
					</view>
					<van-icon name="arrow" />
				</v-link>
			</view>
		</view>
		<view class=" m-x-lg m-y-lg bg-panel-3 rounded-md box-shadow">
			<view class="list">
				<v-link tag="view" :to="{path: status!=2&&status!=1?'/pages/auth/certification':''}"
				class="item link-active p-x-md align-center" style="display: flex;justify-content: space-between;align-items: center;padding: 10px 0px;">
					<view style="display: flex;align-items: center;">
						<view class="img_info">
							<img src="@/assets/img/info2.png" style="width: 20px;" />
						</view>
						<view class="color-light" v-if="status==0">{{$t('common.c9')}}</view>
						<view class="color-yellows" v-else-if="status==1">{{$t('auth.a5')}}</view>
						<view class="color-buy" v-else-if="status==2">{{$t('common.c10')}}</view>
						<view class="color-sell" v-else-if="status==3">{{$t('common.c11')}}</view>
					</view>
					<van-icon name="arrow" />
				</v-link>
				<view style="color: #409EFF;padding-bottom: 20rpx;margin: 0rpx 30rpx;" v-if="status==3">
					<view style="width: 600rpx;color: #fff;">{{$t('common.c12')}}：</view>
					<view style="width: 600rpx;text-align: left;word-wrap: break-word;">{{remark}}</view>
				</view>
			</view>
		</view>
		<view class=" m-x-lg m-y-lg bg-panel-3 rounded-md box-shadow">
			<view class="list">
				<v-link tag="li" to="/pages/safe/email" class="item link-active d-flex p-x-md align-center" style="justify-content: space-between;padding: 10px 0px;">
					<view class="d-flex align-center">
						<view class="img_info">
							<img src="@/assets/img/info3.png" style="width: 18px;" />
						</view>
						<view class="color-light" style="">{{$t('accountSettings.a7')}}</view>
					</view>
					<view class="d-flex align-center" style="justify-content: space-between;width: 160px;">
						<view style="word-wrap: break-word;width: 100px;">{{user.email}}</view>
						<van-icon class="p-l-xs" name="arrow" size="16" color="#9FA6B5" @click.stop />
					</view>
				</v-link>
			</view>
		</view>
		<view class=" m-x-lg m-y-lg bg-panel-3 rounded-md box-shadow">
			<view class="list">
				<v-link tag="li" to="/pages/assets/address-list" class="item link-active d-flex p-x-md align-center" style="padding: 10px 0px;">
					<view class="img_info">
						<img src="@/assets/img/info4.png" style="width: 20px;" />
					</view>
					<view class="flex-fill d-flex justify-between m-r-xs">
						<view class="color-light">{{$t('base.c5')}}</view>
					</view>
					<van-icon name="arrow" />
				</v-link>
			</view>
		</view>
		</scroll-view>
    </view>
   <van-popup
      :show="switchShow"
       @close="switchShow=false"
      closeable
      close-on-popstate
      position="bottom"
      custom-style="height:60%"
    >
      <switch-page v-if="switchShow" @close="switchShow=false" :type="switchType" />
    </van-popup>
	
    <van-toast id="van-toast" />
	<van-dialog id="van-dialog" />
  </v-page>
</template>
<script>
import { mapState ,mapActions} from "vuex";
import Dialog from '../../wxcomponents/vant/dialog/dialog';
import switchPage from "./switch";
import Profile from "@/api/profile";
import Setting from "@/api/setting";
export default {
  components: {
    switchPage,
  },
  computed: {
    ...mapState({
      user: "user",
    }),
  },
  data() {
    return {
      switchShow: false,
      switchType: 0,
	  status: 0,
	  remark:''
    };
  },
  methods: {
     ...mapActions({
      setUserInfo: "setUserInfo",
    }),
    switchVer(idx) {
      this.switchType = idx;
      this.switchShow = true;
    },
	getAuthInfo() {
	  Profile.getAuthInfo().then(res => {
	    this.status = res.data.status
		this.remark = res.data.remark
	    // this.user_auth_level = res.data.primary_status
	  })
	},
	ResetClick(){
		Dialog.alert({
		  title: this.$t('common.c30'),
		  message: this.$t('common.c31'),
		  confirmButtonText: this.$t('common.c28')
		}).then(() => {
			Setting.withdrawalReset().then((res) => {
				console.log('已请求重置提款密码');
		    });
		});
	}
  },
  onShow() {
     this.setUserInfo()
	 this.getAuthInfo()
  },
  mounted(){
   
  }
};
</script>
<style scoped>
	::v-deep .van-button--default{
		border:0px;
	}
	.bg-panel-3{
		background-color: #242424;
	}
	.img_info{
		width: 40px;
		height: 40px;
		display: flex;
		margin-right: 10px;
		border-radius: 40px;
		align-items: center;
		justify-content: center;
		background-color: #313147;
	}
</style>