Files
2025-07-16 15:34:34 +08:00

325 lines
6.9 KiB
Vue

<template>
<view class="add">
<view class="form-item">
<label><text class="tip">*</text>政治面貌</label>
<picker :range="politicsOptions" @change="onPoliticsChange">
<view class="uni-input">
<text class="val">{{ politicsOptions[selectedPoliticsOptionIndex] || '请选择政治面貌' }}</text>
<uni-icons type="down" size="16" color="#202020"></uni-icons>
</view>
</picker>
</view>
<view class="form-item">
<label><text class="tip">*</text>职务</label>
<input type="text" v-model="valiFormData.classPost" placeholder="(例如:班长,没有填 无)" />
</view>
<view class="form-item">
<label><text class="tip">*</text>中国农业银行银行卡号</label>
<input type="number" v-model="valiFormData.bankCard" placeholder="请输入中国农业银行银行卡号" />
</view>
<view class="form-item">
<label><text class="tip">*</text>开户行</label>
<input type="text" v-model="valiFormData.bankAddr" placeholder="例如:中国农业银行南宁望州支行" />
</view>
<view class="form-item">
<label><text class="tip">*</text>获奖情况</label>
<textarea placeholder="请输入获奖情况" v-model="valiFormData.goodHis"></textarea>
</view>
<view class="form-item">
<label><text class="tip">*</text>主要事迹</label>
<textarea class="main-his" placeholder="输入主要事迹,字数100字以上" v-model="valiFormData.mainHis"></textarea>
</view>
<view class="btns">
<button v-if="valiFormData.applyStatus==10" @click="onReSubmit" :disabled="isSubmitting">重新提交</button>
</view>
</view>
</template>
<script>
import {
toBackPage
} from "@/utils/toBack.js"
import {
validateFormFields
} from "@/utils/validateForm.js"
import {
reApply
} from "@/api/good/xyjxj.js";
import {
alipayVali
} from "@/api/helpFunc/bank.js";
import {
listXyjxjCanType
} from "@/api/good/index.js";
export default {
data() {
return {
isSubmitting: false, //表单提交标志位
awardsList: [], //奖项
awardsIndex: 0,
// 校验表单数据
valiFormData: {
typeCode: '',
zzmm: '',
classPost: '',
bankCard: '',
bankAddr: '',
goodHis: '',
mainHis: '',
},
politicsOptions: ['群众', '共青团员', '党员'], // 政治面貌
selectedPoliticsOptionIndex: -1, // 当前选中的政治面貌索引
}
},
onLoad(option) {
this.getAwardsList();
this.detail = JSON.parse(option.detail);
this.valiFormData = this.detail;
this.politicsOptions.forEach((item, index) => {
if (item == this.valiFormData.zzmm) {
this.selectedPoliticsOptionIndex = index;
}
})
},
methods: {
async getAwardsList() {
let res = await listXyjxjCanType();
if (res.code == 200) {
this.awardsList = res.data;
this.awardsList.forEach((item, index) => {
if (item.typeName == this.valiFormData.typeName) {
this.awardsIndex = index;
}
})
}
},
//选择奖项
onAwardsChange(e) {
this.awardsIndex = e.detail.value;
this.valiFormData.typeCode = this.awardsList[this.awardsIndex].typeCode;
},
//选择政治面貌
onPoliticsChange(e) {
this.selectedPoliticsOptionIndex = e.detail.value;
this.valiFormData.zzmm = this.politicsOptions[this.selectedPoliticsOptionIndex];
},
async onReSubmit() {
const requiredFields = [
'zzmm',
'classPost',
'bankCard',
'bankAddr',
'goodHis',
'mainHis',
];
if (!validateFormFields(requiredFields, this.valiFormData)) {
return;
}
let boolCard = await alipayVali(this.valiFormData.bankCard);
if (boolCard.validated == false) {
uni.showToast({
title: "请输入正确的银行卡号",
icon: "none"
})
return;
}
if (boolCard.bank != "ABC") {
uni.showToast({
title: "请输入正确的中国农业银行银行卡号",
icon: "none"
})
return;
}
if (this.valiFormData.mainHis.length < 100) {
uni.showToast({
title: "主要事迹字数需要100字以上",
icon: "none"
});
return;
}
this.isSubmitting = true; // 设置为正在提交
uni.showLoading({
title: "正在提交",
success: () => {
this.valiFormData.applyId = this.valiFormData.id;
reApply(this.valiFormData).then(res => {
if (res.code == 200) {
uni.showToast({
title: "重新提交成功"
})
toBackPage(500, (page) => {
page.getList();
this.isSubmitting = false;
})
}
})
}
})
}
}
}
</script>
<style lang="scss" scoped>
.add {
background-color: #F5F5F7;
padding: 10px;
padding-bottom: 80px;
.form-item {
display: flex;
flex-direction: column;
padding: 22rpx 40rpx;
background-color: white;
margin-bottom: 20rpx;
border-radius: 16rpx;
.tip {
color: red;
font-size: 24rpx;
}
label {
margin-bottom: 20rpx;
display: inline-block;
}
input {
border: 1px solid #E1E1E1;
border-radius: 10rpx;
height: 70rpx;
padding-left: 30rpx;
.input-placeholder {
color: #b6b6b6;
}
}
textarea {
border: 1px solid #E1E1E1;
border-radius: 10rpx;
width: 100%;
height: 250rpx;
padding: 30rpx;
&.main-his {
height: 500rpx;
}
.input-placeholder {
color: #b6b6b6;
}
}
picker {
border: 1px solid #E1E1E1;
height: 70rpx;
line-height: 70rpx;
padding: 0 30rpx;
text {
color: #b6b6b6;
}
.uni-input {
display: flex;
color: #797979;
.val {
flex: 1;
}
}
}
.upload-img {
border: 1px solid #E1E1E1;
padding: 20rpx;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
.tip {
margin-top: 15rpx;
color: #7a7a7a;
font-size: 24rpx;
}
}
.img-list {
border: 1px solid #D8D8D8;
border-radius: 20rpx;
.imgs {
padding: 22rpx;
display: flex;
flex-wrap: wrap;
.img {
position: relative;
width: 160rpx;
height: 170rpx;
margin-bottom: 15rpx;
margin-right: 15rpx;
image {
width: 100%;
height: 100%;
}
.remove {
position: absolute;
right: 0;
top: 0;
color: white;
background-color: rgba(0, 0, 0, 0.4);
width: 52rpx;
height: 52rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
}
}
}
.btn {
border-top: 1px solid #D8D8D8;
height: 100rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
}
}
}
.btns {
padding: 10px;
display: flex;
background: white;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 999;
button {
flex: 1;
background-color: #1890FF;
color: white;
&[disabled] {
opacity: 0.5;
}
}
}
}
</style>