|
@@ -17,7 +17,7 @@
|
|
</template>
|
|
</template>
|
|
<!-- 总计 -->
|
|
<!-- 总计 -->
|
|
<a-alert type="info" showIcon style="margin-bottom:15px">
|
|
<a-alert type="info" showIcon style="margin-bottom:15px">
|
|
- <div slot="message">总款数 <strong></strong> ,总数量 <strong></strong> ,总成本¥<strong></strong></div>
|
|
|
|
|
|
+ <div slot="message">共 <strong>{{ chooseLoadData.length }}</strong>条明细 ,金额合计¥<strong>{{ totalAmount }}</strong> ,余额合计¥<strong>{{ totalBalance }}</strong> ,本次结算金额合计¥<strong>{{ currentTotalBalance }}</strong></div>
|
|
</a-alert>
|
|
</a-alert>
|
|
<!-- 列表 -->
|
|
<!-- 列表 -->
|
|
<a-table
|
|
<a-table
|
|
@@ -30,16 +30,19 @@
|
|
:scroll="{ x: 1040, y: 300 }"
|
|
:scroll="{ x: 1040, y: 300 }"
|
|
:pagination="false"
|
|
:pagination="false"
|
|
bordered>
|
|
bordered>
|
|
|
|
+ <!-- 序号 -->
|
|
|
|
+ <template slot="no" slot-scope="text, record, index">
|
|
|
|
+ {{ index+1 }}
|
|
|
|
+ </template>
|
|
<!-- 本次结算金额 -->
|
|
<!-- 本次结算金额 -->
|
|
<template slot="settleAmount" slot-scope="text, record">
|
|
<template slot="settleAmount" slot-scope="text, record">
|
|
<a-input-number
|
|
<a-input-number
|
|
id="collectionPayment-settleAmount"
|
|
id="collectionPayment-settleAmount"
|
|
v-model="record.settleAmount"
|
|
v-model="record.settleAmount"
|
|
:precision="2"
|
|
:precision="2"
|
|
- :min="0"
|
|
|
|
- :max="record.unsettleAmount"
|
|
|
|
|
|
+ :min="record.unsettleAmount<0 ? record.unsettleAmount : 0.01"
|
|
|
|
+ :max="record.unsettleAmount<0 ? -0.01 : record.unsettleAmount"
|
|
placeholder="请输入"
|
|
placeholder="请输入"
|
|
- @blur="e => settleAmountBlur(e.target.value, record)"
|
|
|
|
style="width: 100%;" />
|
|
style="width: 100%;" />
|
|
</template>
|
|
</template>
|
|
<!-- 操作 -->
|
|
<!-- 操作 -->
|
|
@@ -62,47 +65,55 @@
|
|
:wrapper-col="formItemLayout.wrapperCol">
|
|
:wrapper-col="formItemLayout.wrapperCol">
|
|
<a-row :gutter="20">
|
|
<a-row :gutter="20">
|
|
<a-col span="12">
|
|
<a-col span="12">
|
|
- <a-form-model-item label="应结算金额" prop="supplierName">
|
|
|
|
|
|
+ <a-form-model-item prop="amountSettled">
|
|
|
|
+ <template slot="label">
|
|
|
|
+ 应结算金额(<span :class="isPositive ? 'green':'red'">{{ isPositive ? '收款' : '付款' }}</span>)
|
|
|
|
+ </template>
|
|
<a-input-number
|
|
<a-input-number
|
|
- id="collectionPayment-outQty"
|
|
|
|
- v-model="form.outQty"
|
|
|
|
- readonly
|
|
|
|
|
|
+ id="collectionPayment-amountSettled"
|
|
|
|
+ v-model="amountSettled"
|
|
|
|
+ disabled
|
|
:precision="2"
|
|
:precision="2"
|
|
- placeholder="请输入"
|
|
|
|
|
|
+ placeholder=""
|
|
style="width: 100%;" />
|
|
style="width: 100%;" />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
<a-col span="12">
|
|
<a-col span="12">
|
|
- <a-form-model-item label="折让金额" prop="supplierName">
|
|
|
|
|
|
+ <a-form-model-item label="折让金额" prop="discountAmount">
|
|
<a-input-number
|
|
<a-input-number
|
|
- id="collectionPayment-outQty"
|
|
|
|
- v-model="form.outQty"
|
|
|
|
|
|
+ id="collectionPayment-discountAmount"
|
|
|
|
+ v-model="form.discountAmount"
|
|
:precision="2"
|
|
:precision="2"
|
|
|
|
+ :min="0"
|
|
|
|
+ :max="amountSettled"
|
|
placeholder="请输入"
|
|
placeholder="请输入"
|
|
style="width: 100%;"
|
|
style="width: 100%;"
|
|
allowClear />
|
|
allowClear />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
<a-col span="12">
|
|
<a-col span="12">
|
|
- <a-form-model-item label="实结算金额" prop="supplierName">
|
|
|
|
|
|
+ <a-form-model-item prop="actualSettlementAmount">
|
|
|
|
+ <template slot="label">
|
|
|
|
+ 实结算金额(<span :class="isPositive ? 'green':'red'">{{ isPositive ? '收款' : '付款' }}</span>)
|
|
|
|
+ </template>
|
|
<a-input-number
|
|
<a-input-number
|
|
- id="collectionPayment-outQty"
|
|
|
|
- v-model="form.outQty"
|
|
|
|
- readonly
|
|
|
|
|
|
+ id="collectionPayment-actualSettlementAmount"
|
|
|
|
+ v-model="actualSettlementAmount"
|
|
|
|
+ disabled
|
|
:precision="2"
|
|
:precision="2"
|
|
- placeholder="请输入"
|
|
|
|
|
|
+ placeholder=""
|
|
style="width: 100%;" />
|
|
style="width: 100%;" />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
<a-col span="12">
|
|
<a-col span="12">
|
|
- <a-form-model-item label="结算方式" prop="supplierName">
|
|
|
|
- <a-select id="collectionPayment-countySn" v-model="form.countySn" placeholder="请选择结算方式" allowClear>
|
|
|
|
- <a-select-option v-for="item in settleStyleList" :value="item.id" :key="item.id">{{ item.name }}</a-select-option>
|
|
|
|
|
|
+ <a-form-model-item label="结算方式" prop="settleStyleSn">
|
|
|
|
+ <a-select id="collectionPayment-settleStyleSn" v-model="form.settleStyleSn" placeholder="请选择结算方式" allowClear>
|
|
|
|
+ <a-select-option v-for="item in settleStyleList" :value="item.settleStyleSn" :key="item.settleStyleSn">{{ item.name }}</a-select-option>
|
|
</a-select>
|
|
</a-select>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
<a-col span="24">
|
|
<a-col span="24">
|
|
- <a-form-model-item label="备注" prop="supplierName" :label-col="{ span: 3 }" :wrapper-col="{ span: 20 }">
|
|
|
|
|
|
+ <a-form-model-item label="备注" prop="remark" :label-col="{ span: 3 }" :wrapper-col="{ span: 20 }">
|
|
<a-textarea id="collectionPayment-remark" :maxLength="100" v-model="form.remark" placeholder="请输入备注(最多100个字符)" allowClear />
|
|
<a-textarea id="collectionPayment-remark" :maxLength="100" v-model="form.remark" placeholder="请输入备注(最多100个字符)" allowClear />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
@@ -122,7 +133,7 @@
|
|
style="padding: 0 60px;">提交</a-button>
|
|
style="padding: 0 60px;">提交</a-button>
|
|
</div>
|
|
</div>
|
|
</a-affix>
|
|
</a-affix>
|
|
- <choose-bill-modal :openModal="openModal" :nowChoose="chooseLoadData" @ok="handleOk" @close="openModal=false" />
|
|
|
|
|
|
+ <choose-bill-modal :openModal="openModal" :nowChoose="chooseLoadData" @ok="handleOk" @close="handleClose" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -130,6 +141,7 @@
|
|
import { STable, VSelect } from '@/components'
|
|
import { STable, VSelect } from '@/components'
|
|
import chooseBillModal from './chooseBillModal.vue'
|
|
import chooseBillModal from './chooseBillModal.vue'
|
|
import { settleStyleQueryAll } from '@/api/settleStyle'
|
|
import { settleStyleQueryAll } from '@/api/settleStyle'
|
|
|
|
+import { settleUnitSave } from '@/api/settle'
|
|
export default {
|
|
export default {
|
|
components: { STable, VSelect, chooseBillModal },
|
|
components: { STable, VSelect, chooseBillModal },
|
|
data () {
|
|
data () {
|
|
@@ -140,32 +152,77 @@ export default {
|
|
},
|
|
},
|
|
// 表头
|
|
// 表头
|
|
chooseColumns: [
|
|
chooseColumns: [
|
|
- { title: '序号', dataIndex: 'no', width: 80, align: 'center' },
|
|
|
|
|
|
+ { title: '序号', scopedSlots: { customRender: 'no' }, width: 80, align: 'center' },
|
|
{ title: '单据号', dataIndex: 'bizNo', width: 220, align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '单据号', dataIndex: 'bizNo', width: 220, align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '单据类型', dataIndex: 'bizTypeDictValue', align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '单据类型', dataIndex: 'bizTypeDictValue', align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '审核时间', dataIndex: 'auditTime', align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '审核时间', dataIndex: 'auditTime', align: 'center', customRender: function (text) { return text || '--' } },
|
|
{ title: '金额', dataIndex: 'totalAmount', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
{ title: '金额', dataIndex: 'totalAmount', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
{ title: '余额', dataIndex: 'unsettleAmount', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
{ title: '余额', dataIndex: 'unsettleAmount', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
- { title: '本次结算金额', dataIndex: 'settleAmount', width: 140, align: 'center' },
|
|
|
|
|
|
+ { title: '本次结算金额', scopedSlots: { customRender: 'settleAmount' }, width: 140, align: 'center' },
|
|
{ title: '操作', scopedSlots: { customRender: 'action' }, width: 100, align: 'center', fixed: 'right' }
|
|
{ title: '操作', scopedSlots: { customRender: 'action' }, width: 100, align: 'center', fixed: 'right' }
|
|
],
|
|
],
|
|
chooseLoadData: [],
|
|
chooseLoadData: [],
|
|
choosePageNo: 1, // 分页页码
|
|
choosePageNo: 1, // 分页页码
|
|
choosePageSize: 10, // 分页 每页多少条
|
|
choosePageSize: 10, // 分页 每页多少条
|
|
- productTotal: null, // 合计
|
|
|
|
settleStyleList: [], // 结算方式
|
|
settleStyleList: [], // 结算方式
|
|
formItemLayout: {
|
|
formItemLayout: {
|
|
labelCol: { span: 6 },
|
|
labelCol: { span: 6 },
|
|
wrapperCol: { span: 16 }
|
|
wrapperCol: { span: 16 }
|
|
},
|
|
},
|
|
- form: {},
|
|
|
|
|
|
+ form: {
|
|
|
|
+ discountAmount: 0, // 折让金额
|
|
|
|
+ settleStyleSn: undefined,
|
|
|
|
+ remark: ''
|
|
|
|
+ },
|
|
rules: {
|
|
rules: {
|
|
- supplierName: [
|
|
|
|
- { required: true, message: '请输入供应商名称', trigger: 'blur' }
|
|
|
|
- ]
|
|
|
|
|
|
+ discountAmount: [{ required: true, message: '请输入折让金额', trigger: 'blur' }],
|
|
|
|
+ settleStyleSn: [{ required: true, message: '请选择结算方式', trigger: 'change' }]
|
|
},
|
|
},
|
|
- openModal: false // 弹框
|
|
|
|
-
|
|
|
|
|
|
+ openModal: false, // 弹框
|
|
|
|
+ isPositive: true // 是否是正值
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ // 本次结算金额合计
|
|
|
|
+ currentTotalBalance () {
|
|
|
|
+ let val = 0
|
|
|
|
+ this.chooseLoadData.map(item => {
|
|
|
|
+ val += Number(item.settleAmount)
|
|
|
|
+ })
|
|
|
|
+ return val
|
|
|
|
+ },
|
|
|
|
+ // 金额合计
|
|
|
|
+ totalAmount () {
|
|
|
|
+ let val = 0
|
|
|
|
+ this.chooseLoadData.map(item => {
|
|
|
|
+ val += Number(item.totalAmount)
|
|
|
|
+ })
|
|
|
|
+ return val
|
|
|
|
+ },
|
|
|
|
+ // 余额合计
|
|
|
|
+ totalBalance () {
|
|
|
|
+ let val = 0
|
|
|
|
+ this.chooseLoadData.map(item => {
|
|
|
|
+ val += Number(item.unsettleAmount)
|
|
|
|
+ })
|
|
|
|
+ return val
|
|
|
|
+ },
|
|
|
|
+ // 应结算金额
|
|
|
|
+ amountSettled () {
|
|
|
|
+ let val = 0
|
|
|
|
+ this.chooseLoadData.map(item => {
|
|
|
|
+ val += Number(item.settleAmount)
|
|
|
|
+ })
|
|
|
|
+ if (val < 0) {
|
|
|
|
+ this.isPositive = false
|
|
|
|
+ } else {
|
|
|
|
+ this.isPositive = true
|
|
|
|
+ }
|
|
|
|
+ return Math.abs(val)
|
|
|
|
+ },
|
|
|
|
+ // 实结算金额
|
|
|
|
+ actualSettlementAmount () {
|
|
|
|
+ return this.amountSettled - this.form.discountAmount
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -173,13 +230,40 @@ export default {
|
|
handleChoose () {
|
|
handleChoose () {
|
|
this.openModal = true
|
|
this.openModal = true
|
|
},
|
|
},
|
|
- // 本次结算金额 blur
|
|
|
|
- settleAmountBlur (val, record) {
|
|
|
|
- console.log(val, record)
|
|
|
|
|
|
+ // 移除
|
|
|
|
+ handleDel (record) {
|
|
|
|
+ const ind = this.chooseLoadData.findIndex(item => item.id == record.id)
|
|
|
|
+ this.chooseLoadData.splice(ind, 1)
|
|
},
|
|
},
|
|
// 提交
|
|
// 提交
|
|
handleSubmit () {
|
|
handleSubmit () {
|
|
-
|
|
|
|
|
|
+ const _this = this
|
|
|
|
+ this.$refs.ruleForm.validate(valid => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ const form = _this.form
|
|
|
|
+ form.settleClientSn = _this.$route.params.sn || undefined
|
|
|
|
+ form.settleType = _this.isPositive ? 'R' : 'P'
|
|
|
|
+ form.settleAmount = _this.amountSettled
|
|
|
|
+ form.realSettleAmount = _this.actualSettlementAmount
|
|
|
|
+ form.detailList = []
|
|
|
|
+ _this.chooseLoadData.map(item => {
|
|
|
|
+ form.detailList.push({
|
|
|
|
+ bizSn: item.bizSn,
|
|
|
|
+ settleAmount: item.settleAmount
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ console.log(form, '--------------提交信息')
|
|
|
|
+ settleUnitSave(form).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ _this.$message.success(res.message)
|
|
|
|
+ _this.handleBack()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ console.log('error submit!!')
|
|
|
|
+ return false
|
|
|
|
+ }
|
|
|
|
+ })
|
|
},
|
|
},
|
|
handleOk (selectedRows) {
|
|
handleOk (selectedRows) {
|
|
this.chooseLoadData = selectedRows
|
|
this.chooseLoadData = selectedRows
|
|
@@ -197,6 +281,10 @@ export default {
|
|
// 返回列表
|
|
// 返回列表
|
|
handleBack () {
|
|
handleBack () {
|
|
this.$router.push({ path: `/financialManagement/companyReceivablePayable/list` })
|
|
this.$router.push({ path: `/financialManagement/companyReceivablePayable/list` })
|
|
|
|
+ },
|
|
|
|
+ // 关闭
|
|
|
|
+ handleClose () {
|
|
|
|
+ this.openModal = false
|
|
}
|
|
}
|
|
},
|
|
},
|
|
beforeRouteEnter (to, from, next) {
|
|
beforeRouteEnter (to, from, next) {
|
|
@@ -210,5 +298,11 @@ export default {
|
|
<style lang="less">
|
|
<style lang="less">
|
|
.collectionPayment-cont{
|
|
.collectionPayment-cont{
|
|
margin-bottom: 15px;
|
|
margin-bottom: 15px;
|
|
|
|
+ .green{
|
|
|
|
+ color: #19be6b;
|
|
|
|
+ }
|
|
|
|
+ .red{
|
|
|
|
+ color: #ed1c24;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|