我的消息开发

This commit is contained in:
fengachen
2021-09-28 15:41:08 +08:00
parent d87b8eeb94
commit 74f0af9b74
14 changed files with 1612 additions and 213 deletions
@@ -0,0 +1,289 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
@cancel="handleCancel"
cancelText="关闭">
<!--会议信息begin-->
<section class="base-info">
<h3 class="title">会议信息</h3>
<a-row :gutter="24">
<a-col :span="12">
<label>会议名称:</label>
<span><j-ellipsis :value="model.meetingName" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>会议类型:</label>
<span><j-ellipsis :value="generateMeetingType(model.meetingType)" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>召开时间:</label>
<span>{{model.startTime + '~' + model.endTime}}</span>
</a-col>
<a-col :span="12">
<label>年份:</label>
<span><j-ellipsis :value="model.particularYear" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>召开地点:</label>
<span><j-ellipsis :value="model.venue + '/' + model.address"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>负责人:</label>
<span><j-ellipsis :value="model.directorName" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>报名截止时间:</label>
<span><j-ellipsis :value="model.registerDeadline" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>会议通知:</label>
<span><preview-file :file-id="model.meetingFiles"></preview-file></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="24">
<label>会议内容:</label>
<span><j-ellipsis :value="model.meetingContent" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
</section>
<!--会议信息end-->
<!--报名信息begin-->
<section class="base-info">
<h3 class="title">报名信息</h3>
<a-row :gutter="24">
<a-col :span="12">
<label>参会单位:</label>
<span><j-ellipsis :value="model.principalName" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>参会人:</label>
<span><j-ellipsis :value="model.principalName" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>身份:</label>
<span><j-ellipsis :value="model.receivableAmount" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>性别:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>手机号:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>付款方式:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>需要发票:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<label>发票邮寄地址:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
<a-col :span="12">
<label>邮编:</label>
<span><j-ellipsis :value="model.remarks" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
</section>
<!--报名信息end-->
<!--会议资料begin-->
<section class="base-info">
<h3 class="title">会议资料</h3>
<a-row :gutter="24">
<a-col :span="12">
<label>参会单位:</label>
<span><j-ellipsis :value="model.principalName" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
</section>
<!--会议资料end-->
<!--开票邮寄信息begin-->
<section class="base-info">
<h3 class="title">开票邮寄信息</h3>
<a-row :gutter="24">
<a-col :span="12">
<label>参会单位:</label>
<span><j-ellipsis :value="model.principalName" :length="20"></j-ellipsis></span>
</a-col>
</a-row>
</section>
<!--开票邮寄信息end-->
<template slot="footer">
<a-button @click="handleCancel">关闭</a-button>
</template>
</j-modal>
</template>
<script>
import PreviewFile from '@comp/jero/PreviewFile'
import JEllipsis from '@comp/jero/JEllipsis'
import {getMeetInfoById} from '@api/incomePaymentsApi'
// import {getSingUpUserInfo} from '@api/incomePaymentsApi'
export default {
name: 'MeetingDetailModal',
components:{
PreviewFile,
JEllipsis
},
data() {
return {
title: '会议详情',
width: 800,
visible: false,
model: {},
}
},
methods: {
open(param) {
this.visible = true
if(param){
this.queryMeetingInfoById(param.id).then(res => {
// 会议详情
this.model = Object.assign({},res)
console.log(this.model,'this.model')
})
}
},
close() {
this.visible = false
},
handleCancel() {
this.close()
},
/*
* 通过会议id获取会议性情
* */
queryMeetingInfoById(id){
return new Promise(resolve => {
let result = {}
getMeetInfoById({id}).then(res => {
if(res.success){
result = res.result
}
}).finally( () => {
resolve(result)
})
})
},
/*
* 会议类型 1 工作组会议 2 标协会议 3国际研讨会 4 其他会议
* */
generateMeetingType(val) {
switch (val) {
case '1':
return '工作组会议'
case '2':
return '标协会议'
case '3':
return '国际研讨会'
case '4':
return '其他会议'
default:
return '其他会议'
}
},
}
}
</script>
<style scoped lang="less">
.ant-row {
margin: 12px;
}
h3 {
position: relative;
}
label {
color: #666;
}
.contract-num {
color: #42b983;
cursor: pointer;
}
h3.title::before {
position: absolute;
top: 4px;
left: -10px;
content: "";
height: 20px;
width: 2px;
background: #069f99;
}
/* 到账信息 */
.payment-info {
margin-bottom: 14px;
&-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;
}
}
/* 开票邮寄信息 */
.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>