307 lines
10 KiB
Vue
307 lines
10 KiB
Vue
<!--缴费信息-证书缴费-->
|
|
<template>
|
|
<div class="main-box">
|
|
<a-card :bordered="false">
|
|
<!-- 查询区域 -->
|
|
<div class="table-page-search-wrapper">
|
|
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
<a-row :gutter="24">
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24" v-if="!memberFlag">
|
|
<a-form-item label="单位全称">
|
|
<a-input placeholder="请输入单位全称" v-model="queryParam.companyName"></a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="缴费状态">
|
|
<j-dict-select-tag placeholder="请选择缴费状态" v-model="queryParam.paymentStatus"
|
|
dictCode="certificate_payment_status" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<template>
|
|
<a-col :xl="10" :lg="11" :md="12" :sm="24">
|
|
<a-form-item label="缴费时间">
|
|
<j-date date-format="YYYY-MM-DD 00:00:00" placeholder="请选择开始日期" class="query-group-cust"
|
|
v-model="queryParam.submissionTime_begin" :disabled-date="disabledStartDate"></j-date>
|
|
<span class="query-group-split-cust"></span>
|
|
<j-date date-format="YYYY-MM-DD 23:59:59" placeholder="请选择结束日期" class="query-group-cust"
|
|
v-model="queryParam.submissionTime_end" :disabled-date="disabledEndDate"></j-date>
|
|
</a-form-item>
|
|
</a-col>
|
|
</template>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<a-form-item label="缴费类型">
|
|
<j-dict-select-tag placeholder="请选择缴费类型" v-model="queryParam.paymentType"
|
|
dictCode="certificate_payment_type" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
|
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">刷新</a-button>
|
|
<!-- <a @click="handleToggleSearch" style="margin-left: 8px">-->
|
|
<!-- {{ toggleSearchStatus ? '收起' : '展开' }}-->
|
|
<!-- <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>-->
|
|
<!-- </a>-->
|
|
</span>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<!-- 查询区域-END -->
|
|
|
|
<!-- 操作按钮区域 -->
|
|
<div class="table-operator">
|
|
<!-- <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>-->
|
|
</div>
|
|
|
|
<!-- table区域-begin -->
|
|
<div>
|
|
<!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
|
|
<!-- <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项-->
|
|
<!-- <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
|
|
<!-- </div>-->
|
|
|
|
<a-table
|
|
ref="table"
|
|
size="middle"
|
|
bordered
|
|
rowKey="id"
|
|
:columns="columns"
|
|
:dataSource="dataSource"
|
|
:pagination="ipagination"
|
|
:loading="loading"
|
|
class="j-table-force-nowrap"
|
|
@change="handleTableChange">
|
|
|
|
<template slot="htmlSlot" slot-scope="text">
|
|
<div v-html="text"></div>
|
|
</template>
|
|
<template slot="imgSlot" slot-scope="text">
|
|
<span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
|
|
<img v-else :src="getImgView(text)" height="25px" alt=""
|
|
style="max-width:80px;font-size: 12px;font-style: italic;" />
|
|
</template>
|
|
<template slot="fileSlot" slot-scope="text">
|
|
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
|
<a-button
|
|
v-else
|
|
:ghost="true"
|
|
type="primary"
|
|
icon="download"
|
|
size="small"
|
|
@click="uploadFile(text)">
|
|
下载
|
|
</a-button>
|
|
</template>
|
|
|
|
<span slot="action" class="action-span-cell" slot-scope="text, record">
|
|
<!-- <a v-has="'certificate:paymentinfo:check'" v-show="record.paymentStatus==1" @click="(record.paymentStatus==1) && handleCheck(record)">核对凭证</a>-->
|
|
<a @click="handleDetail(record)">查看</a>
|
|
</span>
|
|
|
|
</a-table>
|
|
</div>
|
|
|
|
<certificatePaymentInfo-modal ref="modalForm" @ok="modalFormOk"></certificatePaymentInfo-modal>
|
|
</a-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import '@/assets/less/TableExpand.less'
|
|
import { mixinDevice } from '@/utils/mixin'
|
|
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
|
import CertificatePaymentInfoModal from './modules/CertificatePaymentInfoModal'
|
|
import JDictSelectTag from '@/components/standardsAssociation/JDictSelectTag.vue'
|
|
import JDate from '@/components/tools/JDate.vue'
|
|
import { getMemberInfoById } from '@/api/standardsAssociationApi'
|
|
import { RangeDateMixin } from '@/mixins/RangeDateMixin'
|
|
import { deleteAction, getAction, getFileAccessHttpUrl } from '@/api/memberManage'
|
|
|
|
export default {
|
|
name: 'CertificateInfo',
|
|
mixins: [JeroListMixin, mixinDevice, RangeDateMixin],
|
|
components: {
|
|
JDictSelectTag,
|
|
JDate,
|
|
CertificatePaymentInfoModal
|
|
},
|
|
data() {
|
|
return {
|
|
deleteAction,
|
|
getAction,
|
|
getFileAccessHttpUrl,
|
|
// 时间范围查询显示的类型
|
|
rangeDateFormat: {
|
|
begin: 'YYYY-MM-DD hh:mm:ss',
|
|
end: 'YYYY-MM-DD hh:mm:ss'
|
|
},
|
|
// todo 目前先固定id
|
|
userId: '1413419593870872578',
|
|
description: '证书缴费信息表管理页面',
|
|
// 表头
|
|
columns: [],
|
|
url: {
|
|
list: '/certificatePaymentInfo/list',
|
|
delete: '/certificatePaymentInfo/delete',
|
|
deleteBatch: '/certificatePaymentInfo/deleteBatch',
|
|
exportXlsUrl: '/certificatePaymentInfo/exportXls',
|
|
importExcelUrl: '/certificatePaymentInfo/importExcel'
|
|
},
|
|
/* 筛选参数 */
|
|
filters: {
|
|
column: '',
|
|
order: ''
|
|
},
|
|
dictOptions: {},
|
|
memberFlag: true,
|
|
dateKeyObj: {
|
|
beginKey: 'submissionTime_begin',
|
|
endKey: 'submissionTime_end'
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.loadMember()
|
|
},
|
|
methods: {
|
|
initDictConfig() {
|
|
},
|
|
// 核对凭证
|
|
handleCheck: function(record) {
|
|
this.$refs.modalForm.handleCheck(record)
|
|
this.$refs.modalForm.title = '核对凭证'
|
|
this.$refs.modalForm.pageType = 2
|
|
},
|
|
// 查看
|
|
handleDetail: function(record) {
|
|
this.$refs.modalForm.detail(record)
|
|
this.$refs.modalForm.title = '查看'
|
|
this.$refs.modalForm.disableSubmit = true
|
|
this.$refs.modalForm.pageType = 2
|
|
},
|
|
loadMember() {
|
|
getMemberInfoById({ id: this.userId }).then((res) => {
|
|
if (res.success) {
|
|
this.memberFlag = true
|
|
// 表头
|
|
this.columns = [
|
|
{
|
|
title: '序号',
|
|
dataIndex: '',
|
|
key: 'rowIndex',
|
|
width: 60,
|
|
align: 'center',
|
|
customRender: function(t, r, index) {
|
|
return parseInt(index) + 1
|
|
}
|
|
},
|
|
{
|
|
title: '缴费单号',
|
|
align: 'center',
|
|
dataIndex: 'billNumber'
|
|
},
|
|
{
|
|
title: '缴费类型',
|
|
align: 'center',
|
|
dataIndex: 'paymentType_dictText'
|
|
},
|
|
{
|
|
title: '缴费金额',
|
|
align: 'center',
|
|
dataIndex: 'paymentAmount'
|
|
},
|
|
{
|
|
title: '缴费时间',
|
|
align: 'center',
|
|
dataIndex: 'submissionTime'
|
|
},
|
|
{
|
|
title: '核对时间',
|
|
align: 'center',
|
|
dataIndex: 'checkTime'
|
|
},
|
|
{
|
|
title: '缴费状态',
|
|
align: 'center',
|
|
dataIndex: 'paymentStatus_dictText'
|
|
},
|
|
{
|
|
title: '操作',
|
|
dataIndex: 'action',
|
|
align: 'center',
|
|
// fixed:"right",
|
|
width: 200,
|
|
scopedSlots: { customRender: 'action' }
|
|
}
|
|
]
|
|
} else {
|
|
this.memberFlag = false
|
|
// 表头
|
|
this.columns = [
|
|
{
|
|
title: '序号',
|
|
dataIndex: '',
|
|
key: 'rowIndex',
|
|
width: 60,
|
|
align: 'center',
|
|
customRender: function(t, r, index) {
|
|
return parseInt(index) + 1
|
|
}
|
|
},
|
|
{
|
|
title: '缴费单号',
|
|
align: 'center',
|
|
dataIndex: 'billNumber'
|
|
},
|
|
{
|
|
title: '单位全称',
|
|
align: 'center',
|
|
dataIndex: 'companyName'
|
|
},
|
|
{
|
|
title: '缴费类型',
|
|
align: 'center',
|
|
dataIndex: 'paymentType_dictText'
|
|
},
|
|
{
|
|
title: '缴费金额',
|
|
align: 'center',
|
|
dataIndex: 'paymentAmount'
|
|
},
|
|
{
|
|
title: '缴费时间',
|
|
align: 'center',
|
|
dataIndex: 'submissionTime'
|
|
},
|
|
{
|
|
title: '核对时间',
|
|
align: 'center',
|
|
dataIndex: 'checkTime'
|
|
},
|
|
{
|
|
title: '缴费状态',
|
|
align: 'center',
|
|
dataIndex: 'paymentStatus_dictText'
|
|
},
|
|
{
|
|
title: '操作',
|
|
dataIndex: 'action',
|
|
align: 'center',
|
|
// fixed:"right",
|
|
width: 200,
|
|
scopedSlots: { customRender: 'action' }
|
|
}
|
|
]
|
|
console.log(res.message)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~@assets/less/common.less';
|
|
</style>
|