<template>
|
<div class="resetVerify">
|
<fx-header>
|
<template #title>
|
{{ title }}
|
</template>
|
</fx-header>
|
<div class="content">
|
<div>
|
<div class="textColor">{{ $t('uploadCredentPassport') }}</div>
|
<div class="flex mt-4 mb-8 justify-between">
|
<div class="flex-1 flex flex-col text-center justify-center items-center">
|
<div class="upload-wrap">
|
<!-- <img :src="idcard_path_front_path" alt="" class="w-full imgShow" v-if="showImg1" /> -->
|
<van-uploader v-model="frontFile" multiple :max-count="1" :after-read="afterRead"
|
@click-upload="onClickUpload('frontFile')" />
|
</div>
|
<div class="mt-4 font-14 h-5 text-grey">{{ $t('credentFront') }}</div>
|
</div>
|
<div class="flex-1 flex flex-col text-center justify-center items-center">
|
<div class="upload-wrap">
|
<!-- <img :src="idcard_path_back_path" alt="" class="w-full imgShow" v-if="showImg2" /> -->
|
<van-uploader v-model="reverseFile" multiple :max-count="1" :after-read="afterRead"
|
@click-upload="onClickUpload('reverseFile')" />
|
</div>
|
<div class="mt-4 font-14 h-5 text-grey">{{ $t('credentObverse') }}</div>
|
</div>
|
<div class="flex-1 flex flex-col text-center justify-center items-center">
|
<div class="upload-wrap">
|
<!-- <img :src="idcard_path_hold_path" alt="" class="w-full imgShow" v-if="showImg3" /> -->
|
<van-uploader v-model="fileList" multiple :max-count="1" :after-read="afterRead"
|
@click-upload="onClickUpload('fileList')" />
|
</div>
|
<div class="mt-4 font-14 h-5 text-grey">{{ $t('handCredent') }}</div>
|
</div>
|
</div>
|
</div>
|
<ExChecked class="mb-5" :list="list" @checkedSelect="onChecked"></ExChecked>
|
<div v-if="currentType == 0">
|
<ExInput :label="$t('fundsPassword')" :placeholderText="$t('fundsPasswordContTips')" v-model="password"
|
:tips="$t('funsPasswordTips')" typeText="password" />
|
<ExInput :label="$t('confirmFundsPassword')" :placeholderText="$t('fundsPasswordContTips')"
|
v-model="repassword" :tips="$t('funsPasswordTips')" typeText="password" />
|
</div>
|
<ExInput :max="250" :label="$t('message')" :placeholderText="$t('entryMessage')" v-model="remark" />
|
<van-button class="w-full" style="margin-top:10px;" @click="submit" type="primary">
|
{{ $t('submit') }}
|
</van-button>
|
</div>
|
</div>
|
</template>
|
|
<script setup>
|
import ExInput from "@/components/ex-input/index.vue";
|
import ExChecked from "@/components/ex-checked/index.vue";
|
import { _uploadImage } from '@/service/upload.api'
|
import { _getSafewordApply, _setSafewordApply } from '@/service/user.api.js'
|
import { Uploader } from 'vant';
|
import { ref, onMounted } from "vue";
|
import { useI18n } from "vue-i18n";
|
import { useRouter, useRoute } from "vue-router";
|
const { t } = useI18n()
|
const router = useRouter()
|
const route = useRoute()
|
|
const title = ref('')
|
const remark = ref('')
|
const password = ref('')
|
const repassword = ref('')
|
const currentType = ref(0)
|
const list = ref([
|
{
|
name: t('resetFundsPassword'),
|
type: 0
|
},
|
{
|
name: t('resetPhone'),
|
type: 1
|
},
|
{
|
name: t('resetEmail'),
|
type: 2
|
},
|
{
|
name: t('resetGoogleVerify'),
|
type: 3
|
},
|
])
|
const frontFile = ref([])
|
const reverseFile = ref([])
|
const fileList = ref([])
|
const idcard_path_front_path = ref('')
|
const idcard_path_back_path = ref('')
|
const idcard_path_hold_path = ref('')
|
const curFile = ref('frontFile')
|
const status = ref('') // 0
|
const showImg1 = ref(false)
|
const showImg2 = ref(false)
|
const showImg3 = ref(false)
|
|
|
onMounted(() => {
|
currentType.value = route.query.type;
|
init(currentType.value);
|
getSafewordApply();
|
})
|
|
const init = (type) => {
|
if (type == 1) {
|
title.value = t("artificialResetPhone");
|
} else if (type == 2) {
|
title.value = t("artificialResetEmail");
|
} else if (type == 3) {
|
title.value = t("artificialResetGoogleVerify");
|
} else {
|
title.value = t("artificialResetFundsPassword");
|
}
|
}
|
const onChecked = (index) => {
|
currentType.value = index;
|
console.log(currentType.value)
|
init(currentType.value)
|
}
|
const afterRead = (file) => { /// 处理文件
|
console.log(file);
|
file.status = 'uploading'
|
file.message = t('uploading')
|
_uploadImage(file).then(data => {
|
file.status = 'success';
|
file.message = t('uploadSuccess');
|
file.resURL = data
|
if (curFile.value == 'frontFile') {
|
frontFile.value = [file]
|
} else if (curFile.value == 'reverseFile') {
|
reverseFile.value = [file]
|
} else {
|
fileList.value = [file]
|
}
|
}).catch(err => {
|
file.status = 'failed';
|
file.message = t('uploadFailed');
|
})
|
}
|
const onClickUpload = (type) => {
|
console.log(type);
|
curFile.value = type
|
}
|
const getSafewordApply = () => {
|
_getSafewordApply({
|
}).then((data) => {
|
if (data.length != 0) {
|
status.value = data[0].status;
|
idcard_path_front_path.value = data[0].idcard_path_front_path
|
idcard_path_back_path.value = data[0].idcard_path_back_path
|
idcard_path_hold_path.value = data[0].idcard_path_hold_path
|
}
|
})
|
}
|
const setSafewordApply = () => {
|
let operate;
|
if (currentType.value == 0) {
|
operate = 0
|
} else if (currentType.value == 1) {
|
operate = 2
|
} else if (currentType.value == 2) {
|
operate = 3
|
} else if (currentType.value == 3) {
|
operate = 1
|
}
|
_setSafewordApply({
|
idcard_path_front: frontFile.value.length && frontFile.value[0].resURL || idcard_path_front_path.value || '',
|
idcard_path_back: reverseFile.value.length && reverseFile.value[0].resURL || idcard_path_back_path.value || '',
|
idcard_path_hold: fileList.value.length && fileList.value[0].resURL || idcard_path_back_path.value || '',
|
operate: operate, //0 修改资金 1取消谷歌绑定 ，2取消手机绑定 3取消邮箱绑定
|
safeword: password.value,
|
safeword_confirm: repassword.value,
|
remark: remark.value
|
}).then((res) => {
|
router.push({ name: 'resetSuccess', query: { type: currentType.value } })
|
})
|
}
|
const submit = () => {
|
setSafewordApply();
|
|
}
|
|
|
</script>
|
|
<style lang="scss" scoped>
|
.resetVerify {
|
width: 100%;
|
box-sizing: border-box;
|
}
|
|
|
.content {
|
font-size: 13px;
|
padding: 16px;
|
border-top: 1px solid $border-grey;
|
}
|
|
.btn {
|
background: $btn_main;
|
color: $text_color;
|
height: 44px;
|
line-height: 44px;
|
text-align: center;
|
font-size: 16px;
|
border-radius: 5px;
|
}
|
|
.upload-wrap {
|
width: 110px;
|
height: 110px;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
position: relative;
|
|
img {
|
height: 100%;
|
}
|
}
|
|
.opacity0 {
|
opacity: 0;
|
}
|
|
.opacity1 {
|
opacity: 1;
|
}
|
|
.imgShow {
|
top: 0;
|
position: absolute;
|
}
|
</style>
|
