优化结算页面
This commit is contained in:
BianLzhaoMin
parent
a5635d173a
commit
a591d01bb3
|
|
@ -19,6 +19,7 @@
|
|||
:totalPrice="settleTotalPrice_01"
|
||||
:tableData="settleTableData_01"
|
||||
@handelSaveSuccess="handelSaveSuccess"
|
||||
v-if="settleTableData_01.length > 0"
|
||||
/>
|
||||
<!-- 03承担方 -->
|
||||
<FinishTable
|
||||
|
|
@ -29,6 +30,7 @@
|
|||
:totalPrice="settleTotalPrice_03"
|
||||
:tableData="settleTableData_03"
|
||||
@handelSaveSuccess="handelSaveSuccess"
|
||||
v-if="settleTableData_03.length > 0"
|
||||
/>
|
||||
<FinishTable
|
||||
:tableColumns="repairTableColumns"
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
调整天数批量设置：
|
||||
<el-input
|
||||
v-model="batchNum"
|
||||
ref="batchNumRef"
|
||||
type="number"
|
||||
clearable
|
||||
style="width: 120px"
|
||||
|
|
@ -38,6 +39,7 @@
|
|||
size="mini"
|
||||
type="success"
|
||||
v-if="!isEdit && isCostBear"
|
||||
@click="submitSell"
|
||||
>确认结算</el-button
|
||||
>
|
||||
<el-button
|
||||
|
|
@ -60,30 +62,36 @@
|
|||
:width="t.t_slot === 't_date' ? '180' : ''"
|
||||
show-overflow-tooltip
|
||||
>
|
||||
<template slot-scope="{ row }">
|
||||
<template slot-scope="scope">
|
||||
<template v-if="t.t_slot && isEdit">
|
||||
<!-- 调整天数时的输入框 -->
|
||||
<el-input
|
||||
v-if="t.t_slot === 't_ipt'"
|
||||
v-model.number="row[t.t_prop]"
|
||||
v-model.number="scope.row[t.t_prop]"
|
||||
style="width: 80px"
|
||||
type="number"
|
||||
:ref="`editIpt_${scope.$index}`"
|
||||
:class="{
|
||||
active: activeIndex === scope.$index,
|
||||
}"
|
||||
/>
|
||||
|
||||
<template v-if="t.t_slot === 't_date'">
|
||||
<el-date-picker
|
||||
v-model="row[t.t_prop]"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
v-if="!row[t.t_prop]"
|
||||
style="width: 150px"
|
||||
/>
|
||||
<template v-else>
|
||||
{{ row[t.t_prop] }}
|
||||
</template>
|
||||
</template>
|
||||
<!-- 调整终结日期的日期选择组件 -->
|
||||
<el-date-picker
|
||||
v-model="scope.row[t.t_prop]"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
v-if="t.t_slot === 't_date'"
|
||||
value-format="yyyy-M-d"
|
||||
:ref="`editTime_${scope.$index}`"
|
||||
:class="{
|
||||
active: activeIndexTime === scope.$index,
|
||||
}"
|
||||
style="width: 150px"
|
||||
/>
|
||||
</template>
|
||||
<template v-else>
|
||||
{{ row[t.t_prop] }}
|
||||
{{ scope.row[t.t_prop] }}
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -134,15 +142,20 @@ export default {
|
|||
|
||||
data() {
|
||||
return {
|
||||
isEdit: false,
|
||||
batchNum: 0,
|
||||
// tableDataList: [],
|
||||
isEdit: false, // 是否编辑数据
|
||||
batchNum: '', // 批量调整天数的数据源
|
||||
activeIndex: '', // 调整天数输入框不合格时的 index 用来设置动态 class 增加一个红色边框
|
||||
activeIndexTime: '', // 调整终结日期时的 index 用来设置动态 class 增加一个红色边框
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 编辑按钮
|
||||
/** 编辑按钮 */
|
||||
handleEdit() {
|
||||
this.isEdit = !this.isEdit
|
||||
if (!this.isEdit) {
|
||||
this.batchNum = ''
|
||||
this.$emit('handelSaveSuccess')
|
||||
}
|
||||
},
|
||||
/** 调整天数 */
|
||||
iptChange(val) {
|
||||
|
|
@ -161,40 +174,67 @@ export default {
|
|||
const regex = /^-?\d+$/
|
||||
let isNum = false
|
||||
try {
|
||||
this.tableData.map((e) => {
|
||||
// 1. 先循环列表数据 判断调整的天数是否符合要求
|
||||
this.tableData.map((e, v) => {
|
||||
console.log(e.endTime, '选择的时间')
|
||||
|
||||
if (!e.endTime) {
|
||||
this.$message.error('请选择终结日期！')
|
||||
this.activeIndexTime = v
|
||||
this.$refs[`editTime_${v}`][0].focus()
|
||||
isNum = true
|
||||
throw new Error()
|
||||
}
|
||||
if (!regex.test(e.trimDay)) {
|
||||
this.$message.error('请输入正整数和负整数或0！')
|
||||
this.activeIndex = v
|
||||
this.$refs[`editIpt_${v}`][0].focus()
|
||||
isNum = true
|
||||
throw new Error()
|
||||
}
|
||||
})
|
||||
} catch {}
|
||||
|
||||
if (isNum) {
|
||||
this.$message.error('请输入正整数和负整数或0！')
|
||||
return
|
||||
}
|
||||
if (isNum) return
|
||||
|
||||
let saveParams = []
|
||||
this.tableData.map((e) => {
|
||||
const item = {
|
||||
agreementId: e.agreementId,
|
||||
typeId: e.typeId,
|
||||
trimDay: e.trimDay,
|
||||
maId: e.maId || '',
|
||||
// 2. 组装保存时的参数
|
||||
let saveParams = []
|
||||
this.tableData.map((e) => {
|
||||
const item = {
|
||||
agreementId: e.agreementId, // 协议id
|
||||
typeId: e.typeId, // 设备id
|
||||
trimDay: e.trimDay, // 调整的天数
|
||||
maId: e.maId || '',
|
||||
}
|
||||
|
||||
saveParams.push(item)
|
||||
})
|
||||
|
||||
// 3. 请求后台接口传递更改后的数据
|
||||
const res = await editSaveApi(saveParams)
|
||||
|
||||
if (res.code == 200) {
|
||||
this.$message.success('保存成功！')
|
||||
this.activeIndex = ''
|
||||
this.activeIndexTime = ''
|
||||
this.batchNum = ''
|
||||
this.isEdit = false
|
||||
this.$emit('handelSaveSuccess')
|
||||
}
|
||||
|
||||
saveParams.push(item)
|
||||
} catch {}
|
||||
},
|
||||
/** 单个列表确认结算 */
|
||||
submitSell() {
|
||||
this.$confirm(
|
||||
'确定后则会生成财务报表，数据将不可修改，请确认检查无误',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
},
|
||||
).then(() => {
|
||||
console.log('确定，后续走确定逻辑')
|
||||
})
|
||||
|
||||
console.log(saveParams, '保存时的参数---')
|
||||
|
||||
const res = await editSaveApi(saveParams)
|
||||
|
||||
if (res.code == 200) {
|
||||
this.$message.success('保存成功！')
|
||||
this.isEdit = false
|
||||
this.$emit('handelSaveSuccess')
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
@ -254,4 +294,9 @@ export default {
|
|||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
::v-deep .active {
|
||||
.el-input__inner:focus {
|
||||
border-color: #f56c6c;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue