Skip to content

C
campSite
Commit 98c00ea4 authored by ‘yangmengxue’'s avatar ‘yangmengxue’
Browse files
Options

支付文字修改

parent 31ac18b2
Hide whitespace changes
Inline Side-by-side
Showing with 595 additions and 563 deletions
src/components/index/SignUp/paying.vue
View file @ 98c00ea4
......@@ -16,7 +16,7 @@
</div>
<div class="btn">
<el-button @click="paying()" v-if="$store.state.human == 1"
>上传缴费截图
>上传缴费截图
</el-button>
<el-button @click="paying()" v-else>立即支付</el-button>
</div>
......@@ -106,19 +106,34 @@
title="提示"
width="30%"
>
<div class="margin1">
如您使用手机报名：点击“确认”后将直接发起微信支付，按照指引完成支付即可。
</div>
<div class="margin1">
如您使用电脑报名：点击“确认”后系统将出现支付二维码，使用手机微信或支付宝扫码，按照指引完成支付即可。
</div>
<div>
<div>为保障支付顺利，请注意：</div>
<div>1、请确保支付账户余额充足。</div>
<div>
2、如因支付失败需再次支付时，务必使用和第一次支付时相同的微信或支付宝账号进行操作。
<div v-if="this.transfer_account == 1">
<div>
<div>为确保缴费流程顺利，请注意：</div>
<div>1、请在缴费时仔细核对收款账户信息，确保信息准确无误。</div>
<div>2、在转账过程中，务必在附言或备注栏中注明“学生本人姓名”。</div>
<div>
3、完成支付后，将带有订单编号的付款截图作为转账凭证上传至指定界面。
</div>
</div>
</div>
<div v-else>
<div class="margin1">
如您使用手机报名：点击“确认”后将直接发起微信支付，按照指引完成支付即可。
</div>
<div class="margin1">
如您使用电脑报名：点击“确认”后系统将出现支付二维码，使用手机微信或支付宝扫码，按照指引完成支付即可。
</div>
<div>
<div>为保障支付顺利，请注意：</div>
<div>1、请确保支付账户余额充足。</div>
<div>
2、如因支付失败需再次支付时，务必使用和第一次支付时相同的微信或支付宝账号进行操作。
</div>
</div>
</div>
</div>
<span class="dialog-footer" slot="footer">
<el-button @click="dialogPayingVisible = false">取 消</el-button>
<el-button @click="toPaying" type="primary">确 定</el-button>
......@@ -163,7 +178,7 @@
<div><span>收款单位:</span>{{ payee }}</div>
<div><span>账号:</span>{{ bank_idcard }}</div>
<div><span>开户行:</span>{{ bank_first }}</div>
<span>上传转账截图</span>
<span>上传带有订单编号的转账截图</span>
<div class="image_add">
<div class="image_in">
<el-upload
......@@ -188,27 +203,27 @@
class="el-upload-list__item-thumbnail"
/>
<span class="el-upload-list__item-actions">
<span
@click="handlePictureCardPreview(file)"
class="el-upload-list__item-preview"
>
<i class="el-icon-zoom-in"></i>
</span>
<span
@click="handleDownload(file)"
class="el-upload-list__item-delete"
v-if="!disabled"
>
<i class="el-icon-download"></i>
</span>
<span
@click="handleRemove(file)"
class="el-upload-list__item-delete"
v-if="!disabled"
>
<i class="el-icon-delete"></i>
<span
@click="handlePictureCardPreview(file)"
class="el-upload-list__item-preview"
>
<i class="el-icon-zoom-in"></i>
</span>
<span
@click="handleDownload(file)"
class="el-upload-list__item-delete"
v-if="!disabled"
>
<i class="el-icon-download"></i>
</span>
<span
@click="handleRemove(file)"
class="el-upload-list__item-delete"
v-if="!disabled"
>
<i class="el-icon-delete"></i>
</span>
</span>
</span>
</div>
</div>
<i class="el-icon-circle-plus"> </i>
......@@ -216,12 +231,11 @@
</div>
<el-dialog :visible.sync="dialogVisible">
<img :src="resultPicture" alt="" width="100%"/>
<img :src="resultPicture" alt="" width="100%" />
</el-dialog>
</div>
</div>
<span class="dialog-footer" slot="footer">
<el-button @click="bankDialogVisible = false">取 消</el-button>
<el-button @click="uploadConfirm" type="primary">确 定</el-button>
......@@ -231,338 +245,346 @@
</template>
<script>
/* eslint-disable */
import ConfirmSignUp from "c/index/SignUp/ConfirmSignUp";
import {delPayingPic, getAccount, signUpInit,} from "r/index/signUp";
import {getWxConfig} from "r/index/pay";
import {achievementCallBack, cosSignature} from "r/index/cosUpload";
import COS from "cos-js-sdk-v5";
export default {
name: "Paying",
components: {
ConfirmSignUp,
/* eslint-disable */
import ConfirmSignUp from "c/index/SignUp/ConfirmSignUp";
import { delPayingPic, getAccount, signUpInit } from "r/index/signUp";
import { getWxConfig } from "r/index/pay";
import { achievementCallBack, cosSignature } from "r/index/cosUpload";
import COS from "cos-js-sdk-v5";
export default {
name: "Paying",
components: {
ConfirmSignUp,
},
data() {
return {
dialogPayingVisible: false, //支付时候tip
dialogChoose: false, //付款方式选择
confirmSignUpDialogFu: false, // 控制确认报名弹框的显示与隐藏
bankDialogVisible: false, //上传银行截图弹框的显示与隐藏
personalInfo: {},
camp_name: "", //营地名称
has_amount: "", //支付金额
status: "", //状态
status_wx: "", //状态
type: "", //状态
//支付状态判断
transfer_account: window.localStorage.getItem(
"transfer_account" + this.$store.state.indexIdentity
),
payee: window.localStorage.getItem(
"payee" + this.$store.state.indexIdentity
),
bank_first: window.localStorage.getItem(
"bank_first" + this.$store.state.indexIdentity
),
bank_idcard: window.localStorage.getItem(
"bank_idcard" + this.$store.state.indexIdentity
),
isUploading: false, // 图片上传蒙层
dialogVisible: false,
fileList: [],
file: "",
file_image: {},
resultPicture: "",
disabled: false, //限制输入框
hideUpload: false,
isBank_infoFile: false,
};
},
created() {
const code = this.$store.state.indexIdentity;
this.has_amount = window.localStorage.getItem("has_amount" + code);
// 已上传的银行付款图片
let bank_infoFile = window.localStorage.getItem(
"bank_info" + window.localStorage.getItem("index-phone-all") + code
);
JSON.parse(bank_infoFile).map((i) => {
if (i.url != "") {
this.isBank_infoFile = true;
}
});
if (
bank_infoFile &&
this.isBank_infoFile == true &&
JSON.parse(bank_infoFile).length > 0
) {
console.log(JSON.parse(bank_infoFile));
this.fileList = JSON.parse(bank_infoFile);
}
this.getAccount();
this.commonApi(33);
},
methods: {
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {});
},
data() {
return {
dialogPayingVisible: false, //支付时候tip
dialogChoose: false, //付款方式选择
confirmSignUpDialogFu: false, // 控制确认报名弹框的显示与隐藏
bankDialogVisible: false, //上传银行截图弹框的显示与隐藏
personalInfo: {},
camp_name: "", //营地名称
has_amount: "", //支付金额
status: "", //状态
status_wx: "", //状态
type: "", //状态
//支付状态判断
transfer_account: window.localStorage.getItem(
"transfer_account" + this.$store.state.indexIdentity
),
payee: window.localStorage.getItem(
"payee" + this.$store.state.indexIdentity
),
bank_first: window.localStorage.getItem(
"bank_first" + this.$store.state.indexIdentity
),
bank_idcard: window.localStorage.getItem(
"bank_idcard" + this.$store.state.indexIdentity
),
isUploading: false, // 图片上传蒙层
dialogVisible: false,
fileList: [],
file: "",
file_image: {},
resultPicture: "",
disabled: false, //限制输入框
hideUpload: false,
isBank_infoFile: false,
};
// 子组件触发，关闭确认报名弹框
closeCFSUDialog(val, isSuccess) {
console.log(val, "val");
console.log(isSuccess, "isSuccess");
this.confirmSignUpDialogFu = val;
if (isSuccess == 1) {
this.$emit("getstatus", 6);
}
},
toWechat() {
// this.dialogChoose = false;
this.confirmSignUpDialogFu = true;
},
created() {
const code = this.$store.state.indexIdentity;
this.has_amount = window.localStorage.getItem("has_amount" + code);
// 已上传的银行付款图片
let bank_infoFile = window.localStorage.getItem(
"bank_info" + window.localStorage.getItem("index-phone-all") + code
);
JSON.parse(bank_infoFile).map((i) => {
if (i.url != '') {
this.isBank_infoFile = true
toPaybao() {
getWxConfig({
pay_type: 2,
}).then((res) => {
console.log(res, "getWxConfig");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
})
if (bank_infoFile && this.isBank_infoFile == true && JSON.parse(bank_infoFile).length > 0) {
console.log(JSON.parse(bank_infoFile));
this.fileList = JSON.parse(bank_infoFile);
/* 此处form就是后台返回接收到的数据 */
let form = res.data.data;
console.log(form);
// return
let div = document.createElement("div");
div.innerHTML = form;
document.body.appendChild(div);
document.forms[0].acceptCharset = "GBK"; //保持与支付宝默认编码格式一致，如果不一致将会出现：调试错误，请回到请求来源地.
// 重新发起请求，错误代码 invalid-signature 错误原因: 验签出错，建议检查签名字符串或签名私钥与应用公钥是否匹配
document.forms[0].submit(); //
let alipay_submit = document.getElementById("alipay_submit");
div.removeChild(alipay_submit);
});
},
// 立即支付-按钮
paying() {
let code = this.$store.state.indexIdentity;
if (code == "3c7e84455750447799e4b70bda5f4493") {
this.toPaying();
} else {
this.dialogPayingVisible = true;
}
this.getAccount();
this.commonApi(33)
},
methods: {
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
})
.catch((_) => {
});
},
// 子组件触发，关闭确认报名弹框
closeCFSUDialog(val, isSuccess) {
console.log(val, "val");
console.log(isSuccess, "isSuccess");
this.confirmSignUpDialogFu = val;
if (isSuccess == 1) {
this.$emit("getstatus", 6);
}
},
toWechat() {
// this.dialogChoose = false;
this.confirmSignUpDialogFu = true;
},
toPaybao() {
getWxConfig({
pay_type: 2,
}).then((res) => {
console.log(res, "getWxConfig");
toPaying() {
this.commonApi(34);
this.dialogPayingVisible = false;
if (this.has_amount == 0) {
getWxConfig({ pay_type: 3 }).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
/* 此处form就是后台返回接收到的数据 */
let form = res.data.data;
console.log(form);
// return
let div = document.createElement("div");
div.innerHTML = form;
document.body.appendChild(div);
document.forms[0].acceptCharset = "GBK"; //保持与支付宝默认编码格式一致，如果不一致将会出现：调试错误，请回到请求来源地.
// 重新发起请求，错误代码 invalid-signature 错误原因: 验签出错，建议检查签名字符串或签名私钥与应用公钥是否匹配
document.forms[0].submit(); //
let alipay_submit = document.getElementById("alipay_submit");
div.removeChild(alipay_submit);
this.$message.success(res.data.err_msg);
this.$emit("getstatus", 6);
});
},
// 立即支付-按钮
paying() {
let code = this.$store.state.indexIdentity;
if (code == "3c7e84455750447799e4b70bda5f4493") {
this.toPaying();
} else {
this.dialogPayingVisible = true;
}
},
toPaying() {
this.commonApi(34)
this.dialogPayingVisible = false;
if (this.has_amount == 0) {
getWxConfig({pay_type: 3}).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.$message.success(res.data.err_msg);
this.$emit("getstatus", 6);
});
} else {
// transfer_account 判断微信支付宝或者银行卡支付
if (this.transfer_account == 0) {
this.dialogChoose = true;
} else {
// transfer_account 判断微信支付宝或者银行卡支付
if (this.transfer_account == 0) {
this.dialogChoose = true;
} else {
this.bankDialogVisible = true;
if (this.fileList.length >= 1) {
this.hideUpload = true;
}
this.bankDialogVisible = true;
if (this.fileList.length >= 1) {
this.hideUpload = true;
}
}
// setTimeout(this.signUpInit(this.status_wx), 1000);
},
signUpInit() {
signUpInit({}).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
// setTimeout(this.signUpInit(this.status_wx), 1000);
},
signUpInit() {
signUpInit({}).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.status = res.data.status;
// return;
// 点击下一步传值给status,更新
if (this.status == 4) {
this.type = "check";
this.status = 3;
if (this.isNexts == 1) {
if (res.data.examine_status == 1) {
this.type = "pay";
this.status = 4;
} else if (res.data.examine_status == 2) {
this.type = "referInfo";
this.status = 2;
}
}
this.status = res.data.status;
// return;
// 点击下一步传值给status,更新
if (this.status == 4) {
this.type = "check";
this.status = 3;
if (this.isNexts == 1) {
if (res.data.examine_status == 1) {
this.type = "pay";
this.status = 4;
} else if (res.data.examine_status == 2) {
this.type = "referInfo";
this.status = 2;
if (res.data.pay_amount == 0) {
getWxConfig({ pay_type: 3 }).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
}
if (res.data.pay_amount == 0) {
getWxConfig({pay_type: 3}).then((res) => {
console.log(res, "signUpInit");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.$message.success(res.data.err_msg);
});
}
// pay_amount支付金额等于0，直接跳到成功页面
} else if (this.status == 5) {
this.type = "pay";
// pay_amount支付金额等于0，直接跳到成功页面
if (res.data.pay_amount == 0) {
this.type = "success";
this.$emit("getstatus", 6);
this.$message.success(res.data.err_msg);
});
}
// pay_amount支付金额等于0，直接跳到成功页面
} else if (this.status == 5) {
this.type = "pay";
// pay_amount支付金额等于0，直接跳到成功页面
if (res.data.pay_amount == 0) {
this.type = "success";
this.$emit("getstatus", 6);
} else {
// transfer_account 判断微信支付宝或者银行卡支付
if (this.transfer_account == 0) {
this.dialogChoose = true;
} else {
// transfer_account 判断微信支付宝或者银行卡支付
if (this.transfer_account == 0) {
this.dialogChoose = true;
} else {
this.bankDialogVisible = true;
if (this.fileList.length >= 1) {
this.hideUpload = true;
}
this.bankDialogVisible = true;
if (this.fileList.length >= 1) {
this.hideUpload = true;
}
}
}
// else if (this.status == 6) {
// this.type = "success";
// }
this.$emit("getstatus", res.data.status);
});
},
getAccount() {
getAccount({}).then((res) => {
// console.log(res, "getAccount");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.personalInfo = res.data.info;
// this.personalInfo.create_time = parseTime(res.data.info.create_time);
});
},
// 图片上传成功前钩子
beforeAvatarUpload(file) {
// console.log(file, "beforeImage");
const isJPG = file.type === "image/jpg";
const isPng = file.type === "image/png";
const isJPEG = file.type === "image/jpeg";
const isLt10M = file.size / 1024 / 1024 < 10;
// console.log(isLt10M)
if (!isJPG && !isPng && !isJPEG) {
this.$message.info("上传图片只能是 JPG,JPEG或png 格式!");
}
if (!isLt10M) {
this.$message.info("上传图片大小不能超过 10MB!");
}
return (isJPG || isPng || isJPEG) && isLt10M;
},
handlePictureCardPreview(file) {
console.log(file, "11111111");
this.resultPicture = file.url;
this.dialogVisible = true;
},
// 文件上传中处理
handleUploadProgress(event, file, fileList) {
// console.log(fileList);
this.isUploading = true;
if (this.fileList.length < 1) {
return this.$message.info("超过上传数量");
// else if (this.status == 6) {
// this.type = "success";
// }
this.$emit("getstatus", res.data.status);
});
},
getAccount() {
getAccount({}).then((res) => {
// console.log(res, "getAccount");
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
},
uploadSuccess(res, file, fileList) {
this.referForm.achievementPath = res;
this.fileList = {
name: file.name,
url: res,
};
this.$refs["imgUrl"].clearFiles(); //上传成功之后清除历史记录
},
uploadPicture(params) {
// console.log("已经准备好上传图片", params);
this.file = params.file;
let raw = params.file;
let image = {
name: raw.name,
size: raw.size,
type: raw.type,
};
this.file_image = image;
this.getCosConfigs(this.file_image, params.file);
},
// 上传截图
uploadConfirm() {
this.bankDialogVisible = false;
// this.$message.success("你的支付信息已提交，请留意短信通知。");
// this.getOssConfigs(this.file_image, this.file);
},
async changeStatus() {
// console.log(SERVER_WS_URL);
let {data: res} = await getWxConfig({
pay_type: 4,
});
},
// cos上传
async getCosConfigs(image, file) {
this.loading = true;
await cosSignature({image: image, index: '3'})
.then((res) => {
let resData = res.data.data
if (res.data.code === 200) {
const cos = new COS({
// 必选参数
getAuthorization: (options, callback) => {
callback({
TmpSecretId: resData.credentials.credential.credentials.tmpSecretId,
TmpSecretKey: resData.credentials.credential.credentials.tmpSecretKey,
XCosSecurityToken: resData.credentials.credential.credentials.sessionToken,
StartTime: resData.credentials.credential.startTime, // 时间戳，单位秒，如：1580000000
ExpiredTime: resData.credentials.credential.expiredTime, // 时间戳，单位秒，如：1580000900
});
},
});
console.log(resData)
cos.putObject({
Bucket: resData.credentials.bucket,
Region: resData.credentials.region,
Key: resData.key,
Body: file,
onProgress: (progressData) => {
console.log("上传进度：" + JSON.stringify(progressData));
},
this.personalInfo = res.data.info;
// this.personalInfo.create_time = parseTime(res.data.info.create_time);
});
},
// 图片上传成功前钩子
beforeAvatarUpload(file) {
// console.log(file, "beforeImage");
const isJPG = file.type === "image/jpg";
const isPng = file.type === "image/png";
const isJPEG = file.type === "image/jpeg";
const isLt10M = file.size / 1024 / 1024 < 10;
// console.log(isLt10M)
if (!isJPG && !isPng && !isJPEG) {
this.$message.info("上传图片只能是 JPG,JPEG或png 格式!");
}
if (!isLt10M) {
this.$message.info("上传图片大小不能超过 10MB!");
}
return (isJPG || isPng || isJPEG) && isLt10M;
},
handlePictureCardPreview(file) {
console.log(file, "11111111");
this.resultPicture = file.url;
this.dialogVisible = true;
},
// 文件上传中处理
handleUploadProgress(event, file, fileList) {
// console.log(fileList);
this.isUploading = true;
if (this.fileList.length < 1) {
return this.$message.info("超过上传数量");
}
},
uploadSuccess(res, file, fileList) {
this.referForm.achievementPath = res;
this.fileList = {
name: file.name,
url: res,
};
this.$refs["imgUrl"].clearFiles(); //上传成功之后清除历史记录
},
uploadPicture(params) {
// console.log("已经准备好上传图片", params);
this.file = params.file;
let raw = params.file;
let image = {
name: raw.name,
size: raw.size,
type: raw.type,
};
this.file_image = image;
this.getCosConfigs(this.file_image, params.file);
},
// 上传截图
uploadConfirm() {
this.bankDialogVisible = false;
// this.$message.success("你的支付信息已提交，请留意短信通知。");
// this.getOssConfigs(this.file_image, this.file);
},
async changeStatus() {
// console.log(SERVER_WS_URL);
let { data: res } = await getWxConfig({
pay_type: 4,
});
},
// cos上传
async getCosConfigs(image, file) {
this.loading = true;
await cosSignature({ image: image, index: "3" })
.then((res) => {
let resData = res.data.data;
if (res.data.code === 200) {
const cos = new COS({
// 必选参数
getAuthorization: (options, callback) => {
callback({
TmpSecretId:
resData.credentials.credential.credentials.tmpSecretId,
TmpSecretKey:
resData.credentials.credential.credentials.tmpSecretKey,
XCosSecurityToken:
resData.credentials.credential.credentials.sessionToken,
StartTime: resData.credentials.credential.startTime, // 时间戳，单位秒，如：1580000000
ExpiredTime: resData.credentials.credential.expiredTime, // 时间戳，单位秒，如：1580000900
});
},
});
console.log(resData);
cos.putObject(
{
Bucket: resData.credentials.bucket,
Region: resData.credentials.region,
Key: resData.key,
Body: file,
onProgress: (progressData) => {
console.log("上传进度：" + JSON.stringify(progressData));
},
(err, data) => {
},
(err, data) => {
console.log(data);
if (err) {
console.log(err);
this.loading = false;
this.$message.error("上传失败！");
} else {
console.log(data);
if (err) {
console.log(err);
this.loading = false;
this.$message.error('上传失败！')
} else {
console.log(data);
this.signUploadSuccess('http://' + data.Location, resData);
}
this.signUploadSuccess("http://" + data.Location, resData);
}
);
} else {
this.$message.error(resData.msg);
}
})
.catch((err) => {
console.log(err);
});
},
// cos上传-告诉后端上传成功
async signUploadSuccess(path, resData) {
await achievementCallBack({key: resData.key, index: 3}).then(res => {
}
);
} else {
this.$message.error(resData.msg);
}
})
.catch((err) => {
console.log(err);
});
},
// cos上传-告诉后端上传成功
async signUploadSuccess(path, resData) {
await achievementCallBack({ key: resData.key, index: 3 })
.then((res) => {
if (res.data.code != 200) {
this.loading = false;
return this.$message.error('上传失败！');
return this.$message.error("上传失败！");
}
console.log(res)
console.log(res);
this.loading = false;
this.$message.success('上传成功！');
this.$message.success("上传成功！");
this.resultPicture = path + "?t=" + Date.parse(new Date());
this.$forceUpdate();
let obj = {
......@@ -570,274 +592,284 @@
};
this.fileList.push(obj);
let code = this.$store.state.indexIdentity;
window.localStorage.setItem("sign_up_payfile_" + window.localStorage.getItem("index-phone-all") + code, JSON.stringify(this.fileList));
window.localStorage.setItem(
"sign_up_payfile_" +
window.localStorage.getItem("index-phone-all") +
code,
JSON.stringify(this.fileList)
);
this.$message.success({
message:
"您已上传成功，等待短信通知，审核通过后登录报名网址。",
message: "您已上传成功，等待短信通知，审核通过后登录报名网址。",
duration: 5000,
});
this.hideUpload = this.fileList.length >= 1;
this.changeStatus();
}).catch(err => {
this.loading = false;
})
},
// async getOssConfigs(image, file) {
// let obj = {
// url: "",
// savefile: "",
// };
// await getBankInfoOss({image: image})
// .then((res) => {
// console.log(res, "开始上传图片");
// if (res.data.code === 200) {
// let oss_url = res.data.config.host;
// let filename = res.data.config.file;
// let formData = new FormData();
// formData.append("OSSAccessKeyId", res.data.config.accessid);
// formData.append("policy", res.data.config.policy);
// formData.append("signature", res.data.config.signature);
// formData.append("filename", res.data.config.file);
// formData.append("key", res.data.config.savefile);
// formData.append("callback", res.data.config.callback);
// formData.append("success_action_status", 200);
// formData.append("file", file);
// // console.log(formData);
// upload(oss_url, formData)
// .then((ress) => {
// console.log(555555555);
// console.log(ress, "ress");
// if (ress.data.code != 200) {
// return this.$message.error(ress.data.msg);
// }
// this.resultPicture = filename + "?t=" + Date.parse(new Date());
// // this.$forceUpdate();
// obj = {
// url: ress.data.picture_path,
// savefile: res.data.config.savefile,
// };
// this.fileList.push(obj);
// let code = this.$store.state.indexIdentity;
// window.localStorage.setItem("sign_up_payfile_" + window.localStorage.getItem("index-phone-all") + code, JSON.stringify(this.fileList));
// this.$message.success({
// message:
// "您已上传成功，等待短信通知，审核通过后登录报名网址。",
// duration: 5000,
// });
// this.changeStatus();
// this.hideUpload = this.fileList.length >= this.limitCount;
// })
// .catch((err) => {
// this.$message.error(err);
// });
// } else {
// this.$message.error(res.data.msg);
// }
// })
// .catch((err) => {
// // console.log(err);
// });
// },
// 下载证明资料图片
handleDownload(file) {
// console.log(file,'file22');
window.location.href = file.url;
},
//删除图片
handleRemove(file) {
console.log(file, "file");
this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
let getfile = file.url;
console.log(file)
// console.log(savefile.match(/^(?:[^\/]|\/\/)*/),'222222')；//获取域名
let str = getfile.split(
"https://yingdi-bank-info-1320656968.cos.ap-beijing.myqcloud.com/"
); //https://yingdi-bank-info-1320656968.cos.ap-beijing.myqcloud.com/进行分割，
let savefile = str[1].split('?')[0];
delPayingPic({object: savefile}).then((res) => {
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.fileList.forEach((item, idx) => {
if (item.url == file.url) {
this.fileList.splice(idx, 1);
let code = this.$store.state.indexIdentity;
window.localStorage.setItem("sign_up_payfile_" + window.localStorage.getItem("index-phone-all") + code, JSON.stringify(this.fileList));
this.$message.success("删除成功");
this.hideUpload = this.fileList.length >= 1;
window.localStorage.removeItem(
"bank_info" +
.catch((err) => {
this.loading = false;
});
},
// async getOssConfigs(image, file) {
// let obj = {
// url: "",
// savefile: "",
// };
// await getBankInfoOss({image: image})
// .then((res) => {
// console.log(res, "开始上传图片");
// if (res.data.code === 200) {
// let oss_url = res.data.config.host;
// let filename = res.data.config.file;
// let formData = new FormData();
// formData.append("OSSAccessKeyId", res.data.config.accessid);
// formData.append("policy", res.data.config.policy);
// formData.append("signature", res.data.config.signature);
// formData.append("filename", res.data.config.file);
// formData.append("key", res.data.config.savefile);
// formData.append("callback", res.data.config.callback);
// formData.append("success_action_status", 200);
// formData.append("file", file);
// // console.log(formData);
// upload(oss_url, formData)
// .then((ress) => {
// console.log(555555555);
// console.log(ress, "ress");
// if (ress.data.code != 200) {
// return this.$message.error(ress.data.msg);
// }
// this.resultPicture = filename + "?t=" + Date.parse(new Date());
// // this.$forceUpdate();
// obj = {
// url: ress.data.picture_path,
// savefile: res.data.config.savefile,
// };
// this.fileList.push(obj);
// let code = this.$store.state.indexIdentity;
// window.localStorage.setItem("sign_up_payfile_" + window.localStorage.getItem("index-phone-all") + code, JSON.stringify(this.fileList));
// this.$message.success({
// message:
// "您已上传成功，等待短信通知，审核通过后登录报名网址。",
// duration: 5000,
// });
// this.changeStatus();
// this.hideUpload = this.fileList.length >= this.limitCount;
// })
// .catch((err) => {
// this.$message.error(err);
// });
// } else {
// this.$message.error(res.data.msg);
// }
// })
// .catch((err) => {
// // console.log(err);
// });
// },
// 下载证明资料图片
handleDownload(file) {
// console.log(file,'file22');
window.location.href = file.url;
},
//删除图片
handleRemove(file) {
console.log(file, "file");
this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
let getfile = file.url;
console.log(file);
// console.log(savefile.match(/^(?:[^\/]|\/\/)*/),'222222')；//获取域名
let str = getfile.split(
"https://yingdi-bank-info-1320656968.cos.ap-beijing.myqcloud.com/"
); //https://yingdi-bank-info-1320656968.cos.ap-beijing.myqcloud.com/进行分割，
let savefile = str[1].split("?")[0];
delPayingPic({ object: savefile }).then((res) => {
if (res.data.code != 200) {
return this.$message.error(res.data.msg);
}
this.fileList.forEach((item, idx) => {
if (item.url == file.url) {
this.fileList.splice(idx, 1);
let code = this.$store.state.indexIdentity;
window.localStorage.setItem(
"sign_up_payfile_" +
window.localStorage.getItem("index-phone-all") +
code,
JSON.stringify(this.fileList)
);
this.$message.success("删除成功");
this.hideUpload = this.fileList.length >= 1;
window.localStorage.removeItem(
"bank_info" +
window.localStorage.getItem("index-phone-all") +
code
);
}
});
});
})
.catch((err) => {
this.$message({
type: "info",
message: "取消删除",
);
}
});
});
},
})
.catch((err) => {
this.$message({
type: "info",
message: "取消删除",
});
});
},
};
},
};
</script>
<style lang="scss" scoped>
@import "a/scss/btn";
@import "a/scss/dialog";
@import "a/scss/btn";
@import "a/scss/dialog";
.btn {
padding-bottom: 0 !important;
}
.btn {
padding-bottom: 0 !important;
}
.flex {
display: flex;
}
.flex {
display: flex;
.margin1 {
margin-bottom: 1rem;
}
::v-deep .hide {
.el-upload--picture-card {
display: none;
}
.margin1 {
margin-bottom: 1rem;
.el-upload-list__item div {
height: 100%;
}
}
::v-deep .hide {
.el-upload--picture-card {
display: none;
}
.paying {
padding: 0 56px 65px 56px;
.el-upload-list__item div {
height: 100%;
}
.pay_titile {
font-size: 18px;
font-weight: 500;
color: #12141c;
line-height: 18px;
}
.paying {
padding: 0 56px 65px 56px;
.pay_top {
margin: 24px 0;
.pay_titile {
font-size: 18px;
div {
font-size: 14px;
font-weight: 500;
color: #12141c;
line-height: 18px;
line-height: 32px;
}
}
.pay_top {
margin: 24px 0;
.line {
height: 1px;
border-bottom: 1px solid #d1d1d1;
}
div {
font-size: 14px;
font-weight: 500;
color: #12141c;
line-height: 32px;
}
}
.pay-money {
font-size: 18px;
font-weight: 500;
color: #12141c;
line-height: 24px;
justify-content: space-between;
margin: 43px 0 0 0;
.line {
height: 1px;
border-bottom: 1px solid #d1d1d1;
span {
color: #60194a;
}
}
.pay-money {
font-size: 18px;
font-weight: 500;
color: #12141c;
line-height: 24px;
justify-content: space-between;
margin: 43px 0 0 0;
.pay_bottom {
font-size: 12px;
font-weight: 500;
color: #999999;
line-height: 21px;
span {
color: #60194a;
}
.cc {
font-weight: 600;
color: black;
}
.pay_bottom {
font-size: 12px;
font-weight: 500;
color: #999999;
line-height: 21px;
.cc {
font-weight: 600;
color: black;
}
.starIcon {
color: red;
}
.starIcon {
color: red;
}
}
}
.choose {
text-align: center;
.choose {
text-align: center;
.img_choose {
justify-content: space-around;
.img_choose {
justify-content: space-around;
img {
width: 38%;
cursor: pointer;
}
}
.text_choose {
font-size: 15px;
margin: 20px 0 50px 0;
img {
width: 38%;
cursor: pointer;
}
}
.btn .el-button {
width: 120px !important;
}
.text_choose {
font-size: 15px;
margin: 20px 0 50px 0;
}
// .pay_code {
// text-align: center;
// :nth-child(1) {
// font-size: 14px;
// font-weight: 500;
// color: #12141c;
// line-height: 14px;
// span {
// font-size: 13px !important;
// color: var(--color);
// }
// }
// :nth-child(2) {
// font-size: 14px;
// font-weight: 500;
// color: var(--color);
// line-height: 24px;
// }
// :nth-child(4) {
// font-size: 14px;
// font-weight: 500;
// color: #333333;
// line-height: 16px;
// span {
// font-size: 17px !important;
// color: var(--color);
// }
// }
// :nth-child(5) {
// font-size: 12px;
// font-weight: 500;
// color: #666666;
// line-height: 12px;
// }
// }
.bank_pay {
& div {
margin: 8px 0;
}
.btn .el-button {
width: 120px !important;
}
}
// .pay_code {
// text-align: center;
// :nth-child(1) {
// font-size: 14px;
// font-weight: 500;
// color: #12141c;
// line-height: 14px;
// span {
// font-size: 13px !important;
// color: var(--color);
// }
// }
// :nth-child(2) {
// font-size: 14px;
// font-weight: 500;
// color: var(--color);
// line-height: 24px;
// }
// :nth-child(4) {
// font-size: 14px;
// font-weight: 500;
// color: #333333;
// line-height: 16px;
// span {
// font-size: 17px !important;
// color: var(--color);
// }
// }
// :nth-child(5) {
// font-size: 12px;
// font-weight: 500;
// color: #666666;
// line-height: 12px;
// }
// }
.bank_pay {
& div {
margin: 8px 0;
}
& span {
font-weight: 600;
}
& span {
font-weight: 600;
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment