提交 2ab43b7a authored 作者: zsf's avatar zsf

预支工资额度设置页面优化,bug修改

上级 1c5b1120
......@@ -61,7 +61,8 @@
}
.el-form .el-form-item__label {
font-weight: 700;
//font-weight: 700;
font-weight: normal;
}
.el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important;
......
......@@ -3,7 +3,7 @@
<p class="tips">
<div class="tipscontent">
<el-icon size="14px"><WarningFilled/></el-icon>
温馨提醒:在新增手续费的操作中,若最后一个区间的最大值为 0 ,则无法继续新增区间。需知,区间最大值为 0 即代表无限制</div>
温馨提醒:预支工资最大额度不超过1万,阶梯手续费最后一个区间的结束额度请输入0,0代表9999</div>
</p>
<el-form
......@@ -16,55 +16,62 @@
:rules="rules"
class="ruleFormRef"
>
<el-form-item label="最低预支额度" prop="minAmount">
<el-input v-model="formLabelAlign.minAmount" type="number" oninput="if(value) if(value<0){value='0'}"/>
</el-form-item>
<el-form-item></el-form-item>
<el-form-item></el-form-item>
<el-form-item label="无手续费当月累计限额" prop="freeAmount">
<el-input v-model="formLabelAlign.freeAmount" type="number" oninput="if(value) if(value<0){value='0'}"/>
</el-form-item>
<el-form-item></el-form-item>
<el-form-item label="手续费" style="width: 1010px;" prop="fee">
<el-table :data="formLabelAlign.fee">
<el-table-column label="手续费" align="center" prop="serviceFee" >
<template #default="{row}">
{{row.serviceFee + '%'}}
</template>
</el-table-column>
<el-table-column label="金额范围" align="center" prop="minAmount" >
<template #default="{row}">
{{row.minAmount + '-' + row.maxAmount}}
</template>
</el-table-column>
<el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="edit" @click="add(scope)" >编辑</el-button>
<el-button link type="primary" icon="Delete" @click="delFee(scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-button @click="add()" icon="Plus" style="width: 100%;border: 1px dashed #dcdfe6;margin-top: 6px;">新增</el-button>
</el-form-item>
<el-form-item style="width: 100%;">
<div style="margin: 0 auto;">
<el-button @click="resetForm">取消</el-button>
<el-button @click="submitForm" type="primary" >提交</el-button>
</div>
</el-form-item>
<div class="box">
<div class="boxTitle">无手续费起始额度</div>
<el-form-item label="最低预支额度" prop="minAmount">
<el-input v-model="formLabelAlign.minAmount" type="number" oninput="if(value) if(value<0){value='0'}"/>
</el-form-item>
<el-form-item></el-form-item>
<el-form-item></el-form-item>
<el-form-item label="无手续费当月累计限额" prop="freeAmount">
<el-input v-model="formLabelAlign.freeAmount" type="number" oninput="if(value) if(value<0){value='0'}"/>
</el-form-item>
<el-form-item></el-form-item>
</div>
<div class="box">
<div class="boxTitle">阶梯手续费</div>
<el-form-item label="手续费" style="width: 1010px;" prop="fee">
<el-table :data="formLabelAlign.fee">
<el-table-column label="手续费" align="center" prop="serviceFee" >
<template #default="{row}">
{{row.serviceFee + '%'}}
</template>
</el-table-column>
<el-table-column label="金额范围" align="center" prop="minAmount" >
<template #default="{row}">
{{row.minAmount + '-' + row.maxAmount}}
</template>
</el-table-column>
<el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="edit" @click="add(scope)" >编辑</el-button>
<el-button link type="primary" icon="Delete" @click="delFee(scope)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-button @click="add()" icon="Plus" style="width: 100%;border: 1px dashed #dcdfe6;margin-top: 6px;">新增</el-button>
</el-form-item>
<el-form-item style="width: 100%;">
<div style="margin: 0 auto;">
<el-button @click="resetForm">取消</el-button>
<el-button @click="submitForm" type="primary" >提交</el-button>
</div>
</el-form-item>
</div>
</el-form>
<!-- 新增手续费 -->
<el-dialog :title=title v-model="open" width="500px" append-to-body>
<el-form ref="addDialogRef" :model="addForm" :rules="feeRules" label-width="110">
<el-form-item label="手续费(%)" prop="serviceFee">
<el-input v-model="addForm.serviceFee" placeholder="请输入手续费" type="number" oninput="if(value) if(value<0){value='0'} if(value>=10){value='10'}" />
<el-input v-model="addForm.serviceFee" placeholder="请输入手续费" type="number" oninput="if(value) if(value<0){value=0} if(value>=1){value=1}" />
</el-form-item>
<el-form-item label="最小值" prop="minAmount">
<el-input v-model="addForm.minAmount" placeholder="请输入最小值" type="number" oninput="if(value) if(value<0){value='0'}" :disabled="disabled"/>
<el-form-item label="起始额度" prop="minAmount">
<el-input v-model="addForm.minAmount" placeholder="请输入起始额度" type="number" oninput="if(value) if(value<0){value=0} if(value>=9999){value=0}" :disabled="disabled"/>
</el-form-item>
<el-form-item label="最大值" prop="maxAmount">
<el-input v-model="addForm.maxAmount" placeholder="请输入最大值" type="number" oninput="if(value) if(value<0){value='0'}" />
<el-form-item label="结束额度" prop="maxAmount">
<el-input v-model="addForm.maxAmount" placeholder="请输入结束额度" type="number" maxlength="4" oninput="if(value) if(value<0){value=0} if(value>=9999){value=0}" />
</el-form-item>
</el-form>
<template #footer>
......@@ -108,8 +115,8 @@ const data = reactive({
},
feeRules:{
serviceFee: [{required: true,message:"请输入手续费",trigger:"blur"}],
minAmount: [{required: true,message:"请输入最小值",trigger:"blur"}],
maxAmount: [{required: true,message:"请输入最大值",trigger:"blur"}],
minAmount: [{required: true,message:"请输入起始额度",trigger:"blur"}],
maxAmount: [{required: true,message:"请输入结束额度",trigger:"blur"}],
}
});
......@@ -156,13 +163,7 @@ function submitDialog(){
if (!valid) return;
let list = formLabelAlign.value.fee || []
//校验最小值、最大值
if(addForm.value.maxAmount!=0 || currentIndex!=list.length-1){
if(parseFloat(addForm.value.minAmount)>parseFloat(addForm.value.maxAmount)){
return proxy.$modal.msgWarning(`最小值不能大于最大值!`);
}
}
//校验起始额度、结束额度
for (let i = 0; i < list.length; i++) {
if (list[i].serviceFee == addForm.value.serviceFee && list[i].id!=addForm.value.id) {
return proxy.$modal.msgWarning(`手续费已存在!`);
......@@ -170,8 +171,20 @@ function submitDialog(){
}
if(title.value==='新增手续费'){
if(addForm.value.maxAmount!=0){
if(parseFloat(addForm.value.minAmount)>parseFloat(addForm.value.maxAmount)){
return proxy.$modal.msgWarning(`起始额度不能大于结束额度!`);
}
}
formLabelAlign.value.fee.push({...addForm.value})
}else {
if(addForm.value.maxAmount!=0 || currentIndex!=list.length-1){
if(parseFloat(addForm.value.minAmount)>parseFloat(addForm.value.maxAmount)){
return proxy.$modal.msgWarning(`起始额度不能大于结束额度!`);
}
}
//当前数据的上一条数据
let lastData = formLabelAlign.value.fee[currentIndex-1];
//当前数据的下一条数据
......@@ -183,17 +196,17 @@ function submitDialog(){
}else {
if(currentIndex!==0){
if(addForm.value.minAmount==0){
return proxy.$modal.msgWarning('最小值不能为0');
return proxy.$modal.msgWarning('起始额度不能为0');
}
if(thisData.minAmount != addForm.value.minAmount){
if(addForm.value.minAmount==1){
return proxy.$modal.msgWarning('最小值不能为1');
return proxy.$modal.msgWarning('起始额度不能为1');
}
if(parseFloat(addForm.value.minAmount)<parseFloat(lastData.minAmount)){
return proxy.$modal.msgWarning(`最小值不能小于上条手续费的最小值:`+lastData.minAmount);
return proxy.$modal.msgWarning(`起始额度不能小于上条手续费的起始额度:`+lastData.minAmount);
}else if(parseFloat(addForm.value.minAmount)>parseFloat(lastData.maxAmount)){
return proxy.$modal.msgWarning(`最小值不能大于上条手续费的最大值:`+lastData.maxAmount);
return proxy.$modal.msgWarning(`起始额度不能大于上条手续费的结束额度:`+lastData.maxAmount);
}else {
lastData.maxAmount = addForm.value.minAmount - 1;
}
......@@ -203,7 +216,7 @@ function submitDialog(){
if(currentIndex!==list.length-1){
if(thisData.maxAmount != addForm.value.maxAmount){
if(parseFloat(addForm.value.maxAmount)>parseFloat(nextData.maxAmount)){
return proxy.$modal.msgWarning(`最大值不能大于下条手续费的最大值:`+nextData.maxAmount);
return proxy.$modal.msgWarning(`结束额度不能大于下条手续费的结束额度:`+nextData.maxAmount);
}else {
nextData.minAmount = parseFloat(addForm.value.maxAmount) + 1
}
......@@ -228,11 +241,11 @@ function delFee(row){
if(formLabelAlign.value.fee.length-1 === row.$index){
formLabelAlign.value.fee.splice(row.$index, 1)
}else {
//自动修改下一条数据的最小值
//自动修改下一条数据的起始额度
if(row.$index==0){
formLabelAlign.value.fee[row.$index+1].minAmount = 0;
}else {
formLabelAlign.value.fee[row.$index+1].minAmount = formLabelAlign.value.fee[row.$index-1].maxAmount
formLabelAlign.value.fee[row.$index+1].minAmount = formLabelAlign.value.fee[row.$index-1].maxAmount + 1
}
formLabelAlign.value.fee.splice(row.$index, 1)
}
......@@ -246,6 +259,9 @@ function submitForm(){
proxy.$refs.ruleFormRef.validate(async (valid) => {
if (!valid) return;
const submitForm = {...formLabelAlign.value}
if(submitForm.fee[submitForm.fee.length-1].maxAmount!=0){
return proxy.$modal.msgWarning('阶梯手续费最后一个区间的结束额度请输入0');
}
submitForm.fee = JSON.stringify(submitForm.fee)
if(formLabelAlign.value.id){
salaryAdvanceUpdate({...submitForm,code:code,rsapId:formLabelAlign.value.id}).then(res => {
......@@ -310,4 +326,16 @@ function getSalaryAdvance(){
.tipscontent{
margin-left: 7.4%;
}
.box{
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
margin: 0% -4% 1% -4%;
padding-top:2%;
background-color: white;
width: 950%;
}
.boxTitle{
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
font-size: 16px;
margin: 0% auto 2% 3%;
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论