123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147 |
- <template>
- <div class="companyCollectionPaymentDetail-wrap">
- <a-spin :spinning="spinning" tip="Loading...">
- <a-page-header :ghost="false" :backIcon="false" class="companyCollectionPaymentDetail-cont" >
-
- <template slot="subTitle">
- <a id="companyCollectionPaymentDetail-back-btn" href="javascript:;" @click="handleBack"><a-icon type="left" /> 返回列表</a>
- <p style=" display: inline-block;margin: 0 0 0 20px;color: #000;font-size: 14px;font-weight: 600;">单号:{{ (basicInfoData&&basicInfoData.unitSettleNo) || '--' }}</p>
- </template>
- </a-page-header>
-
- <a-card size="small" :bordered="false" class="companyCollectionPaymentDetail-cont" v-if="basicInfoData">
- <a-collapse :activeKey="['1']">
- <a-collapse-panel key="1" header="基础信息">
- <a-descriptions :column="3">
- <a-descriptions-item label="客户名称" v-if="basicInfoData.settleClientType&&basicInfoData.settleClientType=='CUSTOMER'">{{ basicInfoData.settleClientNameCurrent || '--' }}{{ basicInfoData.settleClientName?basicInfoData.settleClientName==basicInfoData.settleClientNameCurrent?'':'('+basicInfoData.settleClientName+')':'' }}</a-descriptions-item>
- <a-descriptions-item label="客户名称" v-else>{{ basicInfoData.settleClientName ||'--' }}</a-descriptions-item>
- <a-descriptions-item label="单位类型">{{ basicInfoData.settleClientTypeDictValue || '--' }}</a-descriptions-item>
- <a-descriptions-item label="结算类型">{{ basicInfoData.settleTypeDictValue || '--' }}</a-descriptions-item>
- <a-descriptions-item label="应结算金额">{{ (basicInfoData.settleAmount || basicInfoData.settleAmount==0) ? toThousands(basicInfoData.settleAmount) : '--' }}</a-descriptions-item>
- <a-descriptions-item label="折让金额">{{ (discountAmount || discountAmount==0) ? toThousands(discountAmount) : '--' }}</a-descriptions-item>
- <a-descriptions-item label="实结算金额">{{ (basicInfoData.realSettleAmount || basicInfoData.realSettleAmount==0) ? toThousands(basicInfoData.realSettleAmount) : '--' }}</a-descriptions-item>
- <a-descriptions-item label="结算时间">{{ basicInfoData.createDate || '--' }}</a-descriptions-item>
- <a-descriptions-item label="操作人">{{ basicInfoData.operateName || '--' }}</a-descriptions-item>
- <a-descriptions-item label="结算方式">{{ basicInfoData.settleStyleSnDictValue || '--' }}</a-descriptions-item>
- <a-descriptions-item label="备注">{{ basicInfoData.remark || '--' }}</a-descriptions-item>
- </a-descriptions>
- </a-collapse-panel>
- </a-collapse>
- </a-card>
-
- <a-card size="small" :bordered="false" class="companyCollectionPaymentDetail-cont">
-
- <a-alert type="info" style="margin-bottom:10px">
- <div slot="message">
- 共 <strong>{{ total }}</strong> 条明细,
- 金额合计 <strong>{{ (basicInfoData&&(basicInfoData.totalSettleAmount || basicInfoData.totalSettleAmount==0)) ? toThousands(basicInfoData.totalSettleAmount) : '--' }}</strong> ,
- 结算金额合计 <strong>{{ (basicInfoData&&(basicInfoData.realSettleAmount || basicInfoData.realSettleAmount==0)) ? toThousands(basicInfoData.realSettleAmount) : '--' }}</strong>
- </div>
- </a-alert>
-
- <s-table
- class="sTable"
- ref="table"
- size="small"
- :rowKey="(record) => record.id"
- :columns="columns"
- :data="loadData"
- :defaultLoadData="false"
- bordered>
- </s-table>
- </a-card>
- </a-spin>
- </div>
- </template>
- <script>
- import { commonMixin } from '@/utils/mixin'
- import { STable, VSelect } from '@/components'
- import { settleUnitDetailList, settleUnitDetail } from '@/api/settle'
- export default {
- name: 'CompanyCollectionPaymentDetail',
- components: { STable, VSelect },
- mixins: [commonMixin],
- data () {
- const _this = this
- return {
- spinning: false,
- // 表头
- columns: [
- { title: '序号', dataIndex: 'no', align: 'center', width: '5%' },
- { title: '单据号', dataIndex: 'bizNo', align: 'center', width: '30%', customRender: function (text) { return text || '--' } },
- { title: '类型', dataIndex: 'bizTypeDictValue', align: 'center', width: '25%', customRender: function (text) { return text || '--' } },
- { title: '总款数', dataIndex: 'totalTypeNum', align: 'center', width: '10%', customRender: function (text) { return (text || text == 0)?text: '--' } },
- { title: '总数量', dataIndex: 'totalNum', align: 'center', width: '10%', customRender: function (text) { return (text || text == 0)?text: '--' } },
- { title: '金额', dataIndex: 'totalAmount', align: 'right', width: '20%', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
- { title: '结算金额', dataIndex: 'settleAmount', align: 'right', width: '20%', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } }
- ],
-
- loadData: parameter => {
- this.disabled = true
- this.spinning = true
- return settleUnitDetailList(Object.assign(parameter, { unitSettleSn: this.$route.params.sn })).then(res => {
- let data
- if (res.status == 200) {
- data = res.data
- const no = (data.pageNo - 1) * data.pageSize
- for (var i = 0; i < data.list.length; i++) {
- data.list[i].no = no + i + 1
- }
- this.disabled = false
- this.total = data.count || 0
- }
- this.spinning = false
- return data
- })
- },
- total: 0,
- basicInfoData: null
- }
- },
- computed: {
- // 折让金额
- discountAmount () {
- let val = 0
- if (this.basicInfoData && this.basicInfoData.discountAmount) {
- val = Math.abs(this.basicInfoData.discountAmount)
- }
- return val
- }
- },
- methods: {
- // 返回列表
- handleBack () {
- this.$router.push({ name: 'companyCollectionPaymentList' })
- },
-
- getDetail () {
- settleUnitDetail({ id: this.$route.params.id }).then(res => {
- if (res.status == 200) {
- this.basicInfoData = res.data
- this.$nextTick(() => {
- this.$refs.table.refresh(true)
- })
- } else {
- this.basicInfoData = null
- }
- })
- }
- },
- activated () {
- // 如果是新页签打开或者进入新的子页(例:存在列表第2条数据编辑页页签时再打开第4条数据的编辑页),则重置当前页面
- if (this.$store.state.app.isNewTab || !this.$store.state.app.isNewSubTab) {
- this.getDetail()
- }
- },
- beforeRouteEnter (to, from, next) {
- next(vm => {})
- }
- }
- </script>
- <style lang="less">
- .companyCollectionPaymentDetail-cont{
- margin-bottom: 6px;
- }
- </style>
|