LK/income_payments_enterprise_terminal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update] 全局样式去掉最小宽度，防止出现双滚动条的情况；合同修改

Browse Source
This commit is contained in:
zhaoxiao
2021-12-15 15:03:47 +08:00
parent bf1238dc26
commit b5d7868313
12 changed files with 627 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
-2
View File
@@ -22,8 +22,6 @@
height: 100%;
margin: 0px;
padding: 0px;
/*最小宽度1200*/
min-width: 1200px;
overflow-x: auto;
}
src/assets/less/common.less
-1
View File
@@ -105,7 +105,6 @@
//页面边距
.main-box {
min-width: 1100px;
margin: 12px 12px 0 12px;
}
src/components/detailPage/FileList.vue
+6 -2
View File
@@ -64,12 +64,16 @@ export default {
default: () => {
return []
}
},
// 列表加载状态
fileLoading: {
type: Boolean,
default: false
}
},
data() {
return {
columns,
fileLoading: false
columns
}
},
methods: {
src/components/jero/JYearDate.vue
+109
View File
@@ -0,0 +1,109 @@
<template>
<a-date-picker
:disabledDate="disabledDate"
:disabled="disabled || readOnly"
:placeholder="placeholder"
@change="handleDateChange"
:value="momVal"
:showTime="showTime"
:format="dateFormat"
mode="year"
:getCalendarContainer="getCalendarContainer"
:open="opent"
@openChange="handleChange"
@panelChange="onPanelChange"
> </a-date-picker>
</template>
<script>
import moment from 'moment'
export default {
name: 'JYearDate',
props: {
placeholder: {
type: String,
default: '',
required: false
},
value: {
type: String,
required: false
},
disabledDate: {
type: Function
},
dateFormat: {
type: String,
default: 'YYYY',
required: false
},
// 此属性可以被废弃了
triggerChange: {
type: Boolean,
required: false,
default: false
},
readOnly: {
type: Boolean,
required: false,
default: false
},
disabled: {
type: Boolean,
required: false,
default: false
},
showTime: {
type: Boolean,
required: false,
default: false
},
getCalendarContainer: {
type: Function,
default: (node) => node.parentNode
}
},
data() {
const dateStr = this.value
return {
decorator: '',
momVal: !dateStr ? null : moment(dateStr, this.dateFormat),
opent: false
}
},
watch: {
value(val) {
if (!val) {
this.momVal = null
} else {
this.momVal = moment(val, this.dateFormat)
}
}
},
methods: {
moment,
handleDateChange(mom, dateStr) {
this.opent = false
this.$emit('change', dateStr)
},
handleChange(open) {
this.opent = open
this.$nextTick(() => {
})
},
onPanelChange(value, mode) {
this.opent = false
// 扩展 年份的时候对点击的年份进行回传
if (this.dateFormat === 'YYYY') {
const year = new Date(value._d).getFullYear()
this.$emit('change', year + '')
}
}
},
// 2.2新增 在组件内定义 指定父组件调用时候的传值属性和事件类型 这个牛逼
model: {
prop: 'value',
event: 'change'
}
}
</script>
src/views/MessagePage/ProjectDetailModal.vue
+191 -102
View File
@@ -6,109 +6,126 @@
switchFullscreen
@cancel="handleCancel"
cancelText="关闭">
<!-- 基本信息begin-->
<section class="base-info">
<h3 class="title">基本信息</h3>
<a-row :gutter="24">
<a-col :span="12" class="detail-item">
<label>项目名称：</label>
<span><j-ellipsis :value="basicInfo.chargeProject" :length="20"></j-ellipsis></span>
</a-col>
<!-- 我的项目--款项用途-->
<a-col :span="12" v-if="basicInfo.projectType === 1" class="detail-item">
<label>款项用途：</label>
<span><j-ellipsis :value="basicInfo.chargeUse_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>项目负责人：</label>
<span><j-ellipsis :value="basicInfo.principalName" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>应付金额：</label>
<span><j-ellipsis :value="`${basicInfo.receivableAmount}元`" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>实付金额：</label>
<span><j-ellipsis :value="`${basicInfo.paidAmount}元`" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>打包：</label>
<span><j-ellipsis :value="basicInfo.pack_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>需要发票：</label>
<span><j-ellipsis :value="basicInfo.needInvoice_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>付款方式：</label>
<span><j-ellipsis :value="basicInfo.chargeWay_dictText" :length="20"></j-ellipsis></span>
</a-col>
<!-- 合同-->
<a-col :span="12" v-if="basicInfo.chargeWay === 2" class="detail-item">
<label>合同编号：</label>
<span class="contract-num" @click="toContractDetail"><j-ellipsis :value="basicInfo.contractNum"
:length="20"></j-ellipsis></span>
</a-col>
<!-- 收费通知-->
<a-col :span="12" v-if="basicInfo.chargeWay === 3" class="detail-item">
<label>收费通知号：</label>
<span><j-ellipsis :value="basicInfo.chargeNoticeNo" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" v-if="basicInfo.chargeWay === 3" class="detail-item">
<label>收费通知：</label>
<span style="width: 100%;"><preview-file style="width: 80%" :file-id="basicInfo.chargeNoticeId"></preview-file></span>
</a-col>
</a-row>
<a-row :gutter="24" v-if="basicInfo.files">
<a-col class="detail-item">
<label>项目资料：</label>
<span style="width: 100%;">
<preview-file style="width: 80%" :file-id="basicInfo.files"></preview-file>
</span>
</a-col>
</a-row>
</section>
<!-- 基本信息end-->
<!--到账信息begin-->
<section class="payment-info">
<h3 class="title">付款信息</h3>
<div class="payment-info-box">
<section class="payment-info-title">付款信息</section>
<template v-if="paymentInfoList && paymentInfoList.length > 0">
<div class="payment-info-content" v-for="item of paymentInfoList" :key="item.id">
{{ item.paymentDate }}付款{{ item.amountReceived }}元
</div>
</template>
<a-list v-else :data-source="[]"/>
</div>
</section>
<!--到账信息end-->
<!--开票邮寄信息begin-->
<section class="logistics-info">
<h3 class="title">开票邮寄信息</h3>
<div class="wrap-table">
<a-table
ref="table"
size="middle"
rowKey="id"
:pagination="false"
:columns="columns"
:dataSource="logisticsInfoList"
class="j-table-force-nowrap"
>
<a-spin :spinning="basicLoading">
<!-- 基本信息begin-->
<section class="base-info">
<h3 class="title">基本信息</h3>
<a-row :gutter="24">
<a-col :span="12" class="detail-item">
<label>项目名称：</label>
<span><j-ellipsis :value="basicInfo.chargeProject" :length="20"></j-ellipsis></span>
</a-col>
<!-- 我的项目--款项用途-->
<a-col :span="12" v-if="basicInfo.projectType === 1" class="detail-item">
<label>款项用途：</label>
<span><j-ellipsis :value="basicInfo.chargeUse_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>项目负责人：</label>
<span><j-ellipsis :value="basicInfo.principalName" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>应付金额：</label>
<span><j-ellipsis :value="`${basicInfo.receivableAmount}元`" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>实付金额：</label>
<span><j-ellipsis :value="`${basicInfo.paidAmount}元`" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>打包：</label>
<span><j-ellipsis :value="basicInfo.pack_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>需要发票：</label>
<span><j-ellipsis :value="basicInfo.needInvoice_dictText" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" class="detail-item">
<label>付款方式：</label>
<span><j-ellipsis :value="basicInfo.chargeWay_dictText" :length="20"></j-ellipsis></span>
</a-col>
<!-- 合同-->
<a-col :span="12" v-if="basicInfo.chargeWay === 2" class="detail-item">
<label>合同编号：</label>
<span><j-ellipsis :value="basicInfo.contractNum"
:length="20"></j-ellipsis></span>
</a-col>
<!-- 收费通知-->
<a-col :span="12" v-if="basicInfo.chargeWay === 3" class="detail-item">
<label>收费通知号：</label>
<span><j-ellipsis :value="basicInfo.chargeNoticeNo" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12" v-if="basicInfo.chargeWay === 3" class="detail-item">
<label>收费通知：</label>
<span style="width: 100%;"><preview-file style="width: 80%"
:file-id="basicInfo.chargeNoticeId"></preview-file></span>
</a-col>
</a-row>
<!-- <a-row :gutter="24" v-if="basicInfo.files">-->
<!-- <a-col class="detail-item">-->
<!-- <label>项目资料：</label>-->
<!-- <span style="width: 100%;">-->
<!-- <preview-file style="width: 80%" :file-id="basicInfo.files"></preview-file>-->
<!-- </span>-->
<!-- </a-col>-->
<!-- </a-row>-->
</section>
<!-- 基本信息end-->
<!--到账信息begin-->
<section class="payment-info">
<div class="collapsible-title">
<h3 class="title">付款信息</h3>
<a-button type="link" @click="viewPaymentInfo">{{ showPaymentInfo ? '收起' : '查看' }}</a-button>
</div>
<div class="payment-info-box" v-show="showPaymentInfo">
<section class="payment-info-title">付款信息</section>
<template v-if="paymentInfoList && paymentInfoList.length > 0">
<div class="payment-info-content" v-for="item of paymentInfoList" :key="item.id">
{{ item.paymentDate }}付款{{ item.amountReceived }}元
</div>
</template>
<a-list v-else :data-source="[]"/>
</div>
</section>
<!--到账信息end-->
<!--开票邮寄信息begin-->
<section class="logistics-info">
<div class="collapsible-title">
<h3 class="title">开票邮寄信息</h3>
<a-button type="link" @click="viewMailInfo">{{ showMailInfo ? '收起' : '查看' }}</a-button>
</div>
<div class="wrap-table" v-show="showMailInfo">
<a-table
ref="table"
size="middle"
rowKey="id"
:pagination="false"
:columns="columns"
:dataSource="logisticsInfoList"
class="j-table-force-nowrap"
>
<span slot="action" slot-scope="record" class="action-span-cell">
<a @click="lookLogistics(record)" v-if="record.postStatus === 1">查看物流</a>
</span>
<!-- <p slot="expandedRowRender" slot-scope="record" style="margin: 0">-->
<!-- {{ record.sendDate }}-->
<!-- </p>-->
</a-table>
<!-- <p slot="expandedRowRender" slot-scope="record" style="margin: 0">-->
<!-- {{ record.sendDate }}-->
<!-- </p>-->
</a-table>
</div>
</section>
<!--开票邮寄信息end-->
<!-- 项目资料-->
<div class="meeting basic-box" v-if="basicInfo.files">
<h3 class="title">项目资料</h3>
<file-list ref="fileListTable" :data-source="fileList" :file-loading="fileLoading"></file-list>
</div>
</section>
<!--开票邮寄信息end-->
<template slot="footer">
<a-button @click="handleCancel">关闭</a-button>
</template>
<template slot="footer">
<a-button @click="handleCancel">关闭</a-button>
</template>
</a-spin>
</j-modal>
</template>
@@ -116,6 +133,8 @@
import { queryCommonProjectById } from '@api/incomePaymentsApi'
import JEllipsis from '@comp/jero/JEllipsis'
import PreviewFile from '@comp/jero/PreviewFile'
import FileList from '@comp/detailPage/FileList'
import { getFileInfo } from '@api/api'
// import {getAction} from "@api/manage";
const columns = [
{
@@ -191,15 +210,25 @@ export default {
contactsInfo: {},
columns,
// 到账信息
paymentInfoList:[],
paymentInfoList: [],
// 开票邮寄信息
logisticsInfoList:[],
logisticsInfoList: [],
// 显示付款信息
showPaymentInfo: false,
// 显示邮寄信息
showMailInfo: false,
// 项目资料列表
fileList: [],
basicLoading: false,
// 项目资料列表的加载状态
fileLoading: false
}
},
computed: {},
components: {
JEllipsis,
PreviewFile
PreviewFile,
FileList
},
created() {
console.log('xiangmuxiangqing')
@@ -214,6 +243,7 @@ export default {
this.currentProjectId = record.id
}
// 通过id查询项目详情
this.basicLoading = true
queryCommonProjectById({ id: this.currentProjectId }).then(res => {
if (res.success) {
console.log(res.result, 'res.result')
@@ -223,9 +253,15 @@ export default {
this.paymentInfoList = res.result.paymentRecord
// 开票邮寄信息
this.logisticsInfoList = res.result.mailBill
// 拿项目资料信息，现在的文件列表数据不全
if (this.basicInfo.files) {
this.initFileList(this.basicInfo.files)
}
} else {
console.log('未查到相应的信息')
}
}).finally(() => {
this.basicLoading = false
})
},
handleCancel() {
@@ -281,6 +317,53 @@ export default {
} else {
return '缴费方式'
}
},
/**
* 控制付款信息显隐
*/
viewPaymentInfo() {
this.showPaymentInfo = !this.showPaymentInfo
},
/**
* 控制开票邮寄信息显隐
*/
viewMailInfo() {
this.showMailInfo = !this.showMailInfo
},
/*
* 通过文件id获取文件的相关信息
* */
getFileInfo(id) {
return new Promise(resolve => {
let result = {}
getFileInfo({ id: id }).then(res => {
if (res.success) {
result = res.result
}
}).finally(() => {
resolve(result)
})
})
},
/*
* 获取文件信息
* */
async initFileList(fileIds) {
this.fileLoading = true
if (fileIds) {
const fileList = []
let arr = fileIds.split(',')
for (let i = 0; i < arr.length; i++) {
let fileObj = {}
fileObj = await this.getFileInfo(arr[i])
fileList.push({ fileId: fileObj.id, fileName: fileObj.fileName, createTime: fileObj.createTime })
}
this.fileList = [...fileList]
} else {
this.fileList = []
}
this.fileLoading = false
console.log(this.fileList)
}
}
}
@@ -314,6 +397,12 @@ h3.title::before {
background: #069f99;
}
/*可收起的标题样式*/
.collapsible-title {
display: flex;
justify-content: space-between;
}
/*基本信息*/
.base-info {
.ant-col {
src/views/mineContract/MineContract.vue
+96 -59
View File
@@ -23,92 +23,114 @@
<!-- 表格区域-->
<div>
<a-spin :spinning="loading">
<project-table :column-data="columns" :table-data="dataSource" @change="handlePageChange">
<!-- 打包、需要发票、到账、开票、邮寄-->
<template v-slot:status="{record, text}">
<status-slot :statu-obj="record" :status-no="text" :status-type="true" status-key="payMailContract"
:get-info-func="getContractDetailById"></status-slot>
</template>
<!-- 项目名称-->
<template v-slot:projectName="{record, text}">
<a-tooltip>
<template slot="title">
{{ text }}
</template>
<div @click="openDetail(record.id)" class="project-name">
{{ text }}
</div>
</a-tooltip>
</template>
<!-- 需要tooltip的文本-->
<template v-slot:text="{record,text}">
<a-tooltip>
<template slot="title">
{{ text }}
</template>
{{ text }}
</a-tooltip>
</template>
<!-- 金额-->
<template v-slot:money="{record,text}">
<a-tooltip>
<template slot="title">
{{ text }}元
</template>
{{ text }}元
</a-tooltip>
</template>
</project-table>
</a-spin>
<a-table
ref="table"
rowKey="id"
size="middle"
:scroll="{x: 1200}"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
@change="handleTableChange"
class="j-table-force-nowrap">
<!-- 项目名称-->
<template slot="projectName" slot-scope="text, record">
<j-ellipsis :value="text" :length="20" class="project-name" @click="openDetail(record.id)"></j-ellipsis>
</template>
<!-- 作废-->
<template slot="invalid" slot-scope="text, record">
<j-ellipsis :value="text" :length="18"></j-ellipsis>
<a-tag color="red" v-if="record.status === 6">已作废</a-tag>
</template>
<template slot="text" slot-scope="text, record">
<j-ellipsis :value="text" :length="18"></j-ellipsis>
</template>
<template slot="action" slot-scope="text, record">
<a @click="viewMailInfo(record.id)">查看</a>
</template>
</a-table>
</div>
<!-- 表格区域end-->
</a-card>
<project-detail-modal ref="projectDetail" @openContractModule="openDetail"></project-detail-modal>
<mine-contract-module :visible.sync="detailVisible" :contract-id="contractId" @openProjectDetail="openDetailModal"></mine-contract-module>
<mine-contract-module :visible.sync="detailVisible"
:contract-id="contractId"
:title="modalTitle"
@openProjectDetail="openDetailModal"></mine-contract-module>
</div>
</template>
<script>
import { JeroListMixin } from '@/mixins/JeroListMixin'
import ProjectTable from '@comp/table/ProjectTable'
import MineContractModule from '@views/mineContract/modules/MineContractModule'
import StatusSlot from '@comp/tools/StatusSlot'
import { getContractDetailById } from '@api/incomePaymentsApi'
import ProjectDetailModal from '@views/MessagePage/ProjectDetailModal'
export default {
name: 'MineContract',
components: { ProjectTable, MineContractModule, StatusSlot, ProjectDetailModal },
components: { MineContractModule, ProjectDetailModal },
mixins: [JeroListMixin],
data() {
return {
columns: [
{
title: '',
title: '序号',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
}, {
title: '合同编号',
dataIndex: 'contractNum',
scopedSlots: 'projectName',
col: 5
align: 'center',
scopedSlots: { customRender: 'text' }
}, {
title: '合同名称',
dataIndex: 'contractName',
scopedSlots: 'text',
col: 5
align: 'center',
scopedSlots: { customRender: 'invalid' }
}, {
title: '合同金额',
title: '关联项目',
dataIndex: 'associatedProject',
align: 'center',
scopedSlots: { customRender: 'text' }
}, {
title: '签订单位',
dataIndex: 'signedCompanyTemporaryName',
align: 'center',
scopedSlots: { customRender: 'text' }
}, {
title: '签订单位联系人',
dataIndex: 'signedContactsTemporaryName',
align: 'center',
scopedSlots: { customRender: 'text' }
}, {
title: '合同总金额',
dataIndex: 'contractAmount',
scopedSlots: 'money',
col: 5
align: 'center',
width: 200,
scopedSlots: { customRender: 'text' }
}, {
title: '负责人',
dataIndex: 'principalName',
scopedSlots: 'text',
col: 5
title: '创建时间',
dataIndex: 'createTime',
align: 'center',
width: 160,
scopedSlots: { customRender: 'text' }
}, {
title: '邮寄',
title: '邮寄信息',
dataIndex: 'postStatus',
scopedSlots: 'status',
col: 4
align: 'center',
width: 100,
scopedSlots: { customRender: 'action' }
}
],
url: {
@@ -116,7 +138,8 @@ export default {
},
contractId: '',
detailVisible: false,
projectType: null
projectType: null,
modalTitle: ''
}
},
methods: {
@@ -130,7 +153,21 @@ export default {
this.ipagination.pageSize = pagination.pageSize
this.loadData()
},
/**
* 查看详情
* @param id
*/
openDetail(id) {
this.modalTitle = '合同信息'
this.contractId = id
this.detailVisible = true
},
/**
* 查看邮寄信息
* @param id
*/
viewMailInfo(id) {
this.modalTitle = '合同邮寄信息'
this.contractId = id
this.detailVisible = true
},
@@ -140,7 +177,7 @@ export default {
openDetailModal(record) {
this.projectType = record.projectType
this.$refs.projectDetail.open(record)
},
}
}
}
</script>
src/views/mineContract/modules/MineContractModule.vue
+21 -38
View File
@@ -1,13 +1,13 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
@cancel="handleCancel"
cancelText="关闭">
:title="title"
:width="width"
:visible="visible"
switchFullscreen
@cancel="handleCancel"
cancelText="关闭">
<a-spin :spinning="loading">
<div class="basic-info">
<div class="basic-info" v-if="title !== '合同邮寄信息'">
<h3 class="title">基本信息</h3>
<a-row>
<a-col :span="12">
@@ -51,7 +51,7 @@
<a-col :span="3">关联项目：</a-col>
<a-col :span="21">
<span v-for="(item, index) in associatedProjectList" :key="index">
<div @click="openDetailModal(item)" class="project-name">{{ item.chargeProject }}</div>
<div>{{ item.chargeProject }}</div>
</span>
</a-col>
</a-row>
@@ -60,16 +60,16 @@
</a-row>
</div>
<h3 class="title">合同邮寄信息</h3>
<div class="wrap-table">
<h3 class="title" v-if="title !== '合同邮寄信息'">合同邮寄信息</h3>
<div>
<a-table
ref="table"
size="middle"
rowKey="id"
:pagination="false"
:columns="columns"
:dataSource="logisticsInfoList"
class="j-table-force-nowrap"
ref="table"
size="middle"
rowKey="id"
:pagination="false"
:columns="columns"
:dataSource="logisticsInfoList"
class="j-table-force-nowrap"
>
<span slot="action" slot-scope="record" class="action-span-cell">
<a @click="lookLogistics(record)">查看物流</a>
@@ -99,6 +99,10 @@ export default {
contractId: {
type: String,
default: ''
},
title: {
type: String,
default: '合同信息'
}
},
watch: {
@@ -110,7 +114,6 @@ export default {
},
data() {
return {
title: '合同信息',
width: 800,
loading: false,
columns: [
@@ -213,24 +216,4 @@ h3.title::before {
margin: 2px 0;
}
}
.wrap-table {
border: 1px solid #ccc;
border-bottom: none;
}
/deep/ .ant-table-thead {
tr > th {
color: #fff;
background: #a2e6e4;
border: none;
}
}
/deep/ .ant-table-tbody {
tr > td {
border: none;
border-bottom: 1px solid #ccc;
}
}
</style>
src/views/mineProject/MineProject.vue
+2
View File
@@ -39,6 +39,8 @@
<a-table
ref="table"
rowKey="id"
size="middle"
:scroll="{x: 1200}"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
src/views/standardsAssociation/Council.vue
+1
View File
@@ -25,6 +25,7 @@
<a-table
ref="table"
rowKey="id"
:scroll="{x: 1200}"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
src/views/subBidCommittee/SubBidCommittee.vue
+1
View File
@@ -25,6 +25,7 @@
<a-table
ref="table"
rowKey="id"
:scroll="{x: 1200}"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
src/views/workTeam/WorkTeam.vue
+17 -10
View File
@@ -10,16 +10,21 @@
<a-input placeholder="请输入项目名称" v-model="queryParam.chargeProject" :maxLength="50"></a-input>
</a-form-item>
</a-col>
<!-- <a-col :xl="6" :lg="8" :md="8" :sm="24">-->
<!-- <a-form-item label="需要发票">-->
<!-- <j-dict-select-tag dict-code="invoice_type" placeholder="请选择是否需要发票"-->
<!-- v-model="queryParam.needInvoice"></j-dict-select-tag>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :xl="6" :lg="8" :md="8" :sm="24">-->
<!-- <a-form-item label="打包项目">-->
<!-- <j-dict-select-tag dict-code="yn" placeholder="请选择是否打包"-->
<!-- v-model="queryParam.pack"></j-dict-select-tag>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<a-col :xl="6" :lg="8" :md="8" :sm="24">
<a-form-item label="需要发票">
<j-dict-select-tag dict-code="invoice_type" placeholder="请选择是否需要发票"
v-model="queryParam.needInvoice"></j-dict-select-tag>
</a-form-item>
</a-col>
<a-col :xl="6" :lg="8" :md="8" :sm="24">
<a-form-item label="打包项目">
<j-dict-select-tag dict-code="yn" placeholder="请选择是否打包"
v-model="queryParam.pack"></j-dict-select-tag>
<a-form-item label="运行年份">
<j-year-date style="width:100%" placeholder="请选择运行年份" v-model="queryParam.year"></j-year-date>
</a-form-item>
</a-col>
@@ -39,6 +44,7 @@
<a-table
ref="table"
rowKey="id"
:scroll="{x: 1200}"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
@@ -74,10 +80,11 @@
import { JeroListMixin } from '@/mixins/JeroListMixin'
import ProjectDetailModal from '@views/MessagePage/ProjectDetailModal'
import MineContractModule from '@views/mineContract/modules/MineContractModule'
import JYearDate from '@comp/jero/JYearDate'
export default {
name: 'WorkTeam',
components: { ProjectDetailModal, MineContractModule },
components: { ProjectDetailModal, MineContractModule, JYearDate },
mixins: [JeroListMixin],
data() {
return {
src/views/workTeam/WorkTeamDetail.vue
+183 -7
View File
@@ -6,7 +6,7 @@
<h3 class="title">基本信息</h3>
<a-spin :spinning="basicLoading">
<a-row :gutter="10">
<a-col :span="24" class="basic-info-item"><label>项目名称：</label><span>{{ detail.name }}</span>
<a-col :span="24" class="basic-info-item"><label>项目名称：</label><span>{{ detail.chargeProject }}</span>
</a-col>
<a-col :span="8" class="basic-info-item"><label>项目负责人：</label><span>{{ detail.principalName }}</span>
</a-col>
@@ -26,13 +26,11 @@
<span>{{ detail.contractNum }}</span>
</a-col>
<!-- 收费通知-->
<!-- v-if="detail.chargeWay === 3"-->
<a-col :span="8" class="basic-info-item">
<a-col :span="8" class="basic-info-item" v-if="detail.chargeWay === 3">
<label>收费通知号：</label>
<span>{{ detail.chargeNoticeNo }}</span>
</a-col>
<!-- v-if="detail.chargeWay === 3"-->
<a-col :span="12" class="basic-info-item">
<a-col :span="12" class="basic-info-item" v-if="detail.chargeWay === 3">
<label>收费通知：</label>
<span style="width: 100%;">
<preview-file style="width: 80%" :file-id="detail.chargeNoticeId"></preview-file>
@@ -69,7 +67,50 @@
</a-table>
</div>
<!-- 付款信息-->
<div class="payment-info basic-box">
<div class="collapsible-title">
<h3 class="title">付款信息</h3>
<a-button type="link" @click="viewPaymentInfo">{{ showPaymentInfo ? '收起' : '查看' }}</a-button>
</div>
<div class="payment-info-box" v-show="showPaymentInfo">
<section class="payment-info-title">付款信息</section>
<template v-if="paymentInfoList && paymentInfoList.length > 0">
<div class="payment-info-content" v-for="item of paymentInfoList" :key="item.id">
{{ item.paymentDate }}付款{{ item.amountReceived }}元
</div>
</template>
<a-list v-else :data-source="[]"/>
</div>
</div>
<!-- 开票邮寄信息-->
<div class="logistics-info basic-box">
<div class="collapsible-title">
<h3 class="title">开票邮寄信息</h3>
<a-button type="link" @click="viewMailInfo">{{ showMailInfo ? '收起' : '查看' }}</a-button>
</div>
<div class="wrap-table" v-show="showMailInfo">
<a-table
ref="table"
size="middle"
rowKey="id"
:pagination="false"
:columns="mailColumns"
:dataSource="logisticsInfoList"
class="j-table-force-nowrap"
>
<span slot="action" slot-scope="record" class="action-span-cell">
<a @click="lookLogistics(record)" v-if="record.postStatus === 1">查看物流</a>
</span>
<!-- <p slot="expandedRowRender" slot-scope="record" style="margin: 0">-->
<!-- {{ record.sendDate }}-->
<!-- </p>-->
</a-table>
</div>
</div>
<!-- 工作组会议-->
<div class="meeting basic-box">
<h3 class="title">工作组会议</h3>
@@ -147,6 +188,55 @@ const fileColumns = [
scopedSlots: { customRender: 'action' }
}]
const mailColumns = [
{
title: '开票人',
align: 'center',
dataIndex: 'realName'
},
{
title: '日期',
align: 'center',
dataIndex: 'billDate'
},
{
title: '金额(元)',
align: 'center',
dataIndex: 'invoiceAmount'
},
{
title: '票号',
align: 'center',
dataIndex: 'billNo'
},
{
title: '项目',
align: 'center',
dataIndex: 'projectName'
},
{
title: '邮寄人',
align: 'center',
dataIndex: 'mailName'
},
{
title: '快递',
align: 'center',
dataIndex: 'sendMethod_dictText'
},
{
title: '快递单号',
align: 'center',
dataIndex: 'postNo'
},
{
title: '操作',
align: 'center',
dataIndex: '',
scopedSlots: { customRender: 'action' }
}
]
export default {
name: 'WorkTeamDetail',
components: { MeetingList, FileList, UnderStudyFilesModal, PreviewFile },
@@ -161,6 +251,12 @@ export default {
columns,
// 过程文件表头
fileColumns,
// 开票邮寄表头
mailColumns,
// 到账信息
paymentInfoList: [],
// 开票邮寄信息
logisticsInfoList: [],
dataSource: [],
/* 分页参数 */
ipagination: {
@@ -174,7 +270,11 @@ export default {
showSizeChanger: true,
total: 0
},
loading: false
loading: false,
// 显示付款信息
showPaymentInfo: false,
// 显示邮寄信息
showMailInfo: false
}
},
created() {
@@ -223,10 +323,33 @@ export default {
queryCommonProjectById(param).then(res => {
if (res.success) {
this.detail = res.result
// 到账信息
this.paymentInfoList = res.result.paymentRecord
// 开票邮寄信息
this.logisticsInfoList = res.result.mailBill
} else {
this.$message.warn(res.message)
}
})
},
/**
* 控制付款信息显隐
*/
viewPaymentInfo() {
this.showPaymentInfo = !this.showPaymentInfo
},
/**
* 控制开票邮寄信息显隐
*/
viewMailInfo() {
this.showMailInfo = !this.showMailInfo
},
/*
* 查看物流
* */
lookLogistics(record) {
const com = Number(record.sendMethod) === 1 && 'ems' || 'shunfeng'
window.open(`https://www.kuaidi100.com/chaxun?com=${ com }&nu=${ record.postNo }`)
}
}
}
@@ -277,4 +400,57 @@ export default {
margin-bottom: 5px;
}
}
/*可收起的标题样式*/
.collapsible-title {
display: flex;
justify-content: space-between;
}
/* 到账信息 */
.payment-info {
&-box {
border: 1px solid #ccc;
}
&-title {
text-align: center;
font-size: 14px;
height: 35px;
line-height: 35px;
letter-spacing: 1px;
color: #fff;
background: #a2e6e4;
}
&-content {
color: #424242;
//background: #efefef;
padding: 5px;
padding-left: 10px;
//border: 1px solid #ccc;
border-top: none;
}
}
/* 查看 开票邮寄信息*/
.logistics-info {
position: relative;
.wrap-table.hide {
height: 0;
display: none;
transition: all 0.5s ease-out;
}
.wrap-table {
transition: all 0.5s ease-out;
}
//.ant-table.hide{
// height: 0;
// display: none;
//}
}
</style>