| | |
| | | @click-left="$router.go(-1)"> |
| | | </van-nav-bar> |
| | | |
| | | <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div> |
| | | <div style="width: 100%; height: .25em; background-color: #777"></div> |
| | | |
| | | <div class="shjj" v-if="$store.state.userInfo.isActive == 3"> |
| | | {{ $t('shjj') }}: {{ $store.state.userInfo.authMsg }} |
| | | </div> |
| | | |
| | | <div class="form-group" :class="{ 'disabled': isSubmitting || isActive }"> |
| | | <label class="required-label">{{ $t('hj195') }}</label> |
| | |
| | | <div class="form-group" :class="{ 'disabled': isSubmitting || isActive }"> |
| | | <label class="required-label">{{ $t('it1') }}</label> |
| | | <van-radio-group v-model="auRadio" direction="horizontal" disabled style="font-size: 3.5vw;margin-top: 1em;"> |
| | | <van-radio name="1">{{ $t('dl1') }}</van-radio> |
| | | <van-radio name="2">{{ $t('pa1') }}</van-radio> |
| | | <van-radio name="3">{{ $t('ot1') }}</van-radio> |
| | | <van-radio name="1">{{ $t('hj196') }}</van-radio> |
| | | </van-radio-group> |
| | | </div> |
| | | |
| | |
| | | <input type="text" v-model="form.vaildNumber" class="form-input" :disabled="isActive" /> |
| | | </div> |
| | | |
| | | <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div> |
| | | <div style="width: 100%; height: .25em; background-color: #777"></div> |
| | | |
| | | <div class="form-group flex-between" :class="{ 'disabled': isSubmitting || isActive }"> |
| | | <label class="required-label">{{ $t('fsi1') }}</label> |
| | | |
| | | <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + 'user/upload.do'" |
| | | <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + '/user/upload.do'" |
| | | list-type="picture-card" name="upload_file" :show-file-list="false" :on-success="handleAvatarSuccess" |
| | | :on-error="handleError" :before-upload="beforeAvatarUpload" :disabled="isActive"> |
| | | <img v-if="form.img1key" :src="form.img1key" class="id-img avatar" style="width: 100%; height: 100%" /> |
| | |
| | | <div class="form-group flex-between" :class="{ 'disabled': isSubmitting || isActive }"> |
| | | <label class="required-label">{{ $t('bsi1') }}</label> |
| | | |
| | | <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + 'user/upload.do'" |
| | | <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + '/user/upload.do'" |
| | | list-type="picture-card" name="upload_file" :show-file-list="false" :on-success="handleAvatarSuccess2" |
| | | :on-error="handleError2" :before-upload="beforeAvatarUpload2" :disabled="isActive"> |
| | | <img v-if="form.img2key" :src="form.img2key" class="id-img avatar" style="width: 100%; height: 100%" /> |
| | |
| | | </el-upload> |
| | | </div> |
| | | |
| | | <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div> |
| | | <div style="width: 100%; height: .25em; background-color: #777"></div> |
| | | |
| | | <div class="submit-button" :class="{ 'disabled': isSubmitting || isActive }" @click="toSure"> |
| | | <span>{{ $t("uv1") }}</span> |
| | | <span> |
| | | {{ isSubmitting || isActive ? $store.state.userInfo.isActive == 2 ? $t('sptg') : $t("uv1") : $t('hj161') }} |
| | | </span> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | img2key: "", |
| | | }, |
| | | imgStatus: false, |
| | | imgStatus2: false, |
| | | previousImg1key: '', |
| | | previousImg2key: '', |
| | | admin: apiUrl.baseURL, |
| | | } |
| | | }, |
| | |
| | | } else if (!this.form.img2key) { |
| | | Toast(this.$t("hj209")); |
| | | } else { |
| | | // 验证图片地址是否为有效的网络地址 |
| | | if (this.form.img1key && this.form.img1key.startsWith('blob:')) { |
| | | Toast('请等待图片上传完成'); |
| | | return; |
| | | } |
| | | if (this.form.img2key && this.form.img2key.startsWith('blob:')) { |
| | | Toast('请等待图片上传完成'); |
| | | return; |
| | | } |
| | | // 显示确认弹窗 |
| | | this.toAuthentication(); |
| | | } |
| | |
| | | this.$store.commit("dialogVisible", false); |
| | | this.$store.state.userInfo = data.data; |
| | | this.userInfo = data.data; |
| | | if ( |
| | | this.$store.state.userInfo.isActive === 1 || |
| | | this.$store.state.userInfo.isActive === 2 |
| | | ) { |
| | | this.form.idCard = this.$store.state.userInfo.idCard; |
| | | this.form.vaildNumber = this.$store.state.userInfo.vaildNumber; |
| | | this.form.name = this.$store.state.userInfo.realName; |
| | | this.form.img1key = this.$store.state.userInfo.img1Key; |
| | | this.form.img2key = this.$store.state.userInfo.img2Key; |
| | | this.showBtn = false; |
| | | } |
| | | // 回填数据 |
| | | this.form.idCard = this.$store.state.userInfo.idCard; |
| | | this.form.vaildNumber = this.$store.state.userInfo.vaildNumber; |
| | | this.form.name = this.$store.state.userInfo.realName; |
| | | this.form.img1key = this.$store.state.userInfo.img1Key; |
| | | this.form.img2key = this.$store.state.userInfo.img2Key; |
| | | this.showBtn = false; |
| | | } else { |
| | | //this.$store.commit('dialogVisible',true); |
| | | //跳转到login |
| | |
| | | }, |
| | | handleAvatarSuccess(res, file) { |
| | | this.imgStatus = false; |
| | | this.form.img1key = res.data.url; |
| | | // 确保返回的是有效的网络图片地址,而不是临时 blob URL |
| | | if (res && res.data && res.data.url) { |
| | | // 验证 URL 是否为网络地址(不是 blob URL) |
| | | if (res.data.url.startsWith('http://') || res.data.url.startsWith('https://')) { |
| | | this.form.img1key = res.data.url; |
| | | } else { |
| | | // 如果返回的不是完整 URL,可能是相对路径,需要拼接 baseURL |
| | | this.form.img1key = this.admin.replace(/\/$/, '') + '/' + res.data.url.replace(/^\//, ''); |
| | | } |
| | | } else { |
| | | // 如果响应格式不正确,恢复之前的值 |
| | | if (this.previousImg1key) { |
| | | this.form.img1key = this.previousImg1key; |
| | | } |
| | | Toast(this.$t("hj209") || '图片上传失败,请重试'); |
| | | } |
| | | }, |
| | | beforeAvatarUpload(file) { |
| | | this.imgStatus = true; |
| | | // 保存之前的图片地址,如果上传失败可以恢复 |
| | | this.previousImg1key = this.form.img1key; |
| | | return true; |
| | | }, |
| | | handleError() { |
| | | this.imgStatus = false; |
| | | // 上传失败时,恢复之前的图片地址(如果有) |
| | | if (this.previousImg1key) { |
| | | this.form.img1key = this.previousImg1key; |
| | | } else { |
| | | // 如果没有之前的地址,清空并清理可能的临时 URL |
| | | if (this.form.img1key && this.form.img1key.startsWith('blob:')) { |
| | | URL.revokeObjectURL(this.form.img1key); |
| | | this.form.img1key = ''; |
| | | } |
| | | } |
| | | Toast(this.$t("hj209") || '图片上传失败,请重试'); |
| | | }, |
| | | handleAvatarSuccess2(res, file) { |
| | | this.imgStatus2 = false; |
| | | this.form.img2key = res.data.url; // URL.createObjectURL(file.raw); |
| | | // 确保返回的是有效的网络图片地址,而不是临时 blob URL |
| | | if (res && res.data && res.data.url) { |
| | | // 验证 URL 是否为网络地址(不是 blob URL) |
| | | if (res.data.url.startsWith('http://') || res.data.url.startsWith('https://')) { |
| | | this.form.img2key = res.data.url; |
| | | } else { |
| | | // 如果返回的不是完整 URL,可能是相对路径,需要拼接 baseURL |
| | | this.form.img2key = this.admin.replace(/\/$/, '') + '/' + res.data.url.replace(/^\//, ''); |
| | | } |
| | | } else { |
| | | // 如果响应格式不正确,恢复之前的值 |
| | | if (this.previousImg2key) { |
| | | this.form.img2key = this.previousImg2key; |
| | | } |
| | | Toast(this.$t("hj209") || '图片上传失败,请重试'); |
| | | } |
| | | }, |
| | | beforeAvatarUpload2(file) { |
| | | this.imgStatus2 = true; |
| | | const isLt10M = file.size / 1024 / 1024 < 10; |
| | | if (!isLt10M) { |
| | | this.$message.error(this.$t("hj205")); |
| | | this.imgStatus2 = false; |
| | | return false; |
| | | } else { |
| | | this.form.img2key = URL.createObjectURL(file); |
| | | compress(file, function (val) { }); |
| | | } |
| | | // 保存之前的图片地址,如果上传失败可以恢复 |
| | | this.previousImg2key = this.form.img2key; |
| | | // 不再设置临时 blob URL,等待上传成功后再设置 |
| | | compress(file, function (val) { }); |
| | | return true; |
| | | }, |
| | | handleError2() { |
| | | this.imgStatus2 = false; |
| | | // 上传失败时,恢复之前的图片地址(如果有) |
| | | if (this.previousImg2key) { |
| | | this.form.img2key = this.previousImg2key; |
| | | } else { |
| | | // 如果没有之前的地址,清空并清理可能的临时 URL |
| | | if (this.form.img2key && this.form.img2key.startsWith('blob:')) { |
| | | URL.revokeObjectURL(this.form.img2key); |
| | | this.form.img2key = ''; |
| | | } |
| | | } |
| | | Toast(this.$t("hj209") || '图片上传失败,请重试'); |
| | | }, |
| | | goBack() { |
| | | this.$router.go(-1); |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | @green: #c4d600; |
| | | @green: #287dff; |
| | | |
| | | /deep/ .van-nav-bar__content { |
| | | height: 65px; |
| | |
| | | display: none; |
| | | } |
| | | |
| | | .shjj { |
| | | font-size: .4rem; |
| | | color: red; |
| | | padding: .2rem; |
| | | } |
| | | |
| | | .authentication-container { |
| | | /* padding: 20px; */ |
| | | background-color: #ffffff; |
| | | // background-color: #ffffff; |
| | | min-height: 100vh; |
| | | font-size: 10vw; |
| | | } |
| | |
| | | } |
| | | |
| | | .required-label { |
| | | color: #333; |
| | | // color: #333; |
| | | font-weight: bold; |
| | | font-size: .4em; |
| | | } |
| | |
| | | padding: 0 15px; |
| | | font-size: .4em; |
| | | box-sizing: border-box; |
| | | color: #333; |
| | | // color: #333; |
| | | } |
| | | |
| | | .id-type-options { |
| | |
| | | width: 9.5em; |
| | | margin: .4em auto 0; |
| | | height: 1.2em; |
| | | background-color: #e6e254; |
| | | background-color: @green; |
| | | color: #fff; |
| | | border-radius: 4px; |
| | | display: flex; |