This commit is contained in:
SelfRidicule 2024-03-21 16:41:52 +08:00
parent 21ba9a3668
commit 2d2823ae72
2 changed files with 308 additions and 98 deletions

View File

@ -0,0 +1,254 @@
<template>
<a-card :body-style="{padding: '24px 32px'}" :bordered='false'>
<div class='back' @click='backPage'>
<a-icon type='rollback' />
<div class='label'>返回</div>
</div>
<div style='display: flex;margin-bottom: 20px'>
<span style='width: 20px;display: block;font-size: 25px;color: #1890ff;font-weight: bold;'>|</span>
<span style='display: block;margin-top: 11px;font-size: 15px'>预约详情</span>
</div>
<a-form-model :model='form' :label-col='labelCol' :wrapper-col='wrapperCol'>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='会议主题'>
{{ form.title }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='会议室名称' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.roomContent.meetingName }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='预约人'>
{{ form.userName }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='会议类型' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.roomContent.typeName }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='联系方式'>
{{ form.phone }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='所属公司' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.customerName }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='会议开始时间'>
{{ form.startTime }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='会议结束时间' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.endDate }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='订单编号'>
{{ form.oderNumber }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='实收金额' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.orderMoney }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='订单状态'>
{{ form.statusName }}
</a-form-item>
</a-col>
<a-col :span='10' v-if='form.statusName == "已取消"'>
<a-form-item label='取消原因' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.cancelResaon }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item label='使用优惠劵' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.ticketName }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='支付时间'>
{{ form.orderTime }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item label='创建时间' :labelCol='labelCol' :wrapperCol='wrapperCol'>
{{ form.createTime }}
</a-form-item>
</a-col>
</a-row>
</a-form-model>
<div style='display: flex;margin-bottom: 20px'>
<span style='width: 20px;display: block;font-size: 25px;color: #1890ff;font-weight: bold;'>|</span>
<span style='display: block;margin-top: 11px;font-size: 15px'>邀请记录</span>
</div>
<div class='recordHeadView'>
<div>
<span>邀请人数{{actualNum}}</span>
<span class='shidarenshu'>实到人数{{attainNum}}</span>
</div>
<!-- <div class='search'>-->
<!-- <div>关键词</div>-->
<!-- <a-input class='searchInput' placeholder='请输入关键词' v-model='queryParam.title' />-->
<!-- </div>-->
</div>
<s-table
class='dataTable'
:columns='columns'
:data='loadData'
size='default'
ref='table'
bordered
>
</s-table>
</a-card>
</template>
<script>
import { STable } from '@/components'
import { get, personList } from '@/api/admin/meeting/reservation'
// import ReservationModal from '@/views/admin/meeting/modules/ReservationModal'
export default {
name: 'reservationInfo',
components: {
STable
},
data() {
return {
labelCol: { span: 12 },
wrapperCol: { span: 8 },
form: {
roomContent: {}
},
queryParam: {
reservationId: this.$route.query.id
},
columns: [
{
title: '参会人员',
dataIndex: 'participantName'
},
{
title: '联系电话',
dataIndex: 'participantPhone'
},
{
title: '邀请人',
dataIndex: 'userName'
},
{
title: '接收时间',
dataIndex: 'createTime'
},
{
title: '是否到访',
dataIndex: 'status'
},
{
title: '到访时间',
dataIndex: 'joinTime'
}
],
dataList: [
{
name: 'wqc'
}
],
// Promise
loadData: parameter => {
return personList(Object.assign(parameter, this.queryParam))
},
actualNum : null,
attainNum : null
}
},
created() {
this.getDetail()
personList({
reservationId: this.$route.query.id
}).then(res => {
this.actualNum = res.actualNum
this.attainNum = res.attainNum
})
},
methods: {
getDetail() {
get(this.$route.query.id).then(res => {
console.log('getDetail', res)
this.form = res
})
},
backPage() {
this.$router.back()
}
}
}
</script>
<style scoped>
.back {
display: flex;
justify-content: flex-end;
align-items: center;
padding-right: 100px;
cursor: pointer;
}
.back .label {
margin-left: 4px;
}
.recordHeadView {
display: flex;
justify-content: space-between;
align-items: center;
width: 1000px;
margin: 14px auto;
color: black;
}
.recordHeadView .shidarenshu {
margin-left: 50px;
}
.recordHeadView .search {
display: flex;
justify-content: center;
align-items: center;
}
.recordHeadView .search .searchInput {
flex: 1;
}
.dataTable {
width: 1000px;
margin: 0 auto;
}
</style>

View File

@ -1,73 +1,48 @@
<template> <template>
<a-card :bordered="false"> <a-card :bordered='false'>
<div class="table-page-search-wrapper"> <div class='table-page-search-wrapper'>
<a-form layout="inline"> <a-form layout='inline'>
<a-row :gutter="48"> <a-row :gutter='48'>
<a-col :md="5" :sm="15"> <a-col :md='5' :sm='15'>
<a-form-item label="访客id"> <a-form-item label='姓名'>
<a-input placeholder="请输入访客id" v-model="queryParam.userId"/> <a-input placeholder='请输入姓名' v-model='queryParam.name' />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :md="5" :sm="15"> <a-col :md='8' :sm='24'>
<a-form-item label="被访人id"> <span class='table-page-search-submitButtons'>
<a-input placeholder="请输入被访人id" v-model="queryParam.intervieweeId"/> <a-button type='primary' @click='$refs.table.refresh(true)'>查询</a-button>
</a-form-item> <a-button style='margin-left: 8px' @click='() => queryParam = {}'>重置</a-button>
</a-col>
<a-col :md="5" :sm="15">
<a-form-item label="姓名">
<a-input placeholder="请输入姓名" v-model="queryParam.name"/>
</a-form-item>
</a-col>
<a-col :md="5" :sm="15">
<a-form-item label="手机号">
<a-input placeholder="请输入手机号" v-model="queryParam.phone"/>
</a-form-item>
</a-col>
<a-col :md="5" :sm="15">
<a-form-item label="来访是由">
<a-input placeholder="请输入来访是由" v-model="queryParam.visitContent"/>
</a-form-item>
</a-col>
<a-col :md="5" :sm="15">
<a-form-item label="证件号码">
<a-input placeholder="请输入证件号码" v-model="queryParam.cardNo"/>
</a-form-item>
</a-col>
<a-col :md="5" :sm="15">
<a-form-item label="照片">
<a-input placeholder="请输入照片" v-model="queryParam.photo"/>
</a-form-item>
</a-col>
<a-col :md="8" :sm="24">
<span class="table-page-search-submitButtons">
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
<a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
</a-form> </a-form>
</div> </div>
<div class="table-operator"> <div class='table-operator'>
<a-button v-if="addEnable" type="primary" icon="plus" @click="$refs.modal.add()">新建</a-button> <a-button v-if='addEnable' type='primary' icon='plus' @click='$refs.modal.add()'>新建</a-button>
<a-dropdown v-if="removeEnable&&selectedRowKeys.length > 0"> <a-dropdown v-if='removeEnable&&selectedRowKeys.length > 0'>
<a-button type="danger" icon="delete" @click="delByIds(selectedRowKeys)">删除</a-button> <a-button type='danger' icon='delete' @click='delByIds(selectedRowKeys)'>删除</a-button>
</a-dropdown> </a-dropdown>
</div> </div>
<s-table <s-table
size="default" size='default'
ref="table" ref='table'
rowKey="id" rowKey='id'
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" :rowSelection='{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}'
:columns="columns" :columns='columns'
:data="loadData" :data='loadData'
> >
<span slot="action" slot-scope="text, record"> <span slot='photo' slot-scope='text, record'>
<a v-if="editEnabel" @click="handleEdit(record)">编辑</a> <img :src='baseUrl + record.photo' style='max-width: 100px; max-height: 120px'>
<a-divider type="vertical" /> </span>
<a v-if="removeEnable" @click="delByIds([record.id])">删除</a> <span slot='action' slot-scope='text, record'>
<a @click='handleInfo(record)'>详情</a>
<a-divider type='vertical' />
<a v-if='editEnabel' @click='handleEdit(record)'>编辑</a>
<a-divider type='vertical' />
<a v-if='removeEnable' @click='delByIds([record.id])'>删除</a>
</span> </span>
</s-table> </s-table>
<visitorPerson-modal ref="modal" @ok="handleOk"/> <visitorPerson-modal ref='modal' @ok='handleOk' />
</a-card> </a-card>
</template> </template>
@ -86,6 +61,7 @@
}, },
data() { data() {
return { return {
baseUrl: process.env.VUE_APP_API_BASE_URL,
labelCol: { labelCol: {
xs: { span: 24 }, xs: { span: 24 },
sm: { span: 5 } sm: { span: 5 }
@ -103,26 +79,13 @@
// //
columns: [ columns: [
{ {
title: '访客id', title: '访客姓名',
dataIndex: 'userId'
},
{
title: '被访人id',
dataIndex: 'intervieweeId'
},
{
title: '姓名',
dataIndex: 'name' dataIndex: 'name'
}, },
{ {
title: '手机号', title: '访客联系方式',
dataIndex: 'phone' dataIndex: 'phone'
}, },
{
title: '加入时间',
dataIndex: 'joinTime',
sorter: true
},
{ {
title: '到访时间', title: '到访时间',
dataIndex: 'visitTime', dataIndex: 'visitTime',
@ -133,25 +96,14 @@
dataIndex: 'leaveTime', dataIndex: 'leaveTime',
sorter: true sorter: true
}, },
{
title: '来访是由',
dataIndex: 'visitContent'
},
{
title: '证件类型',
dataIndex: 'cardType'
},
{
title: '证件号码',
dataIndex: 'cardNo'
},
{ {
title: '状态', title: '状态',
dataIndex: 'status' dataIndex: 'status'
}, },
{ {
title: '照片', title: '照片',
dataIndex: 'photo' dataIndex: 'photo',
scopedSlots: { customRender: 'photo' }
}, },
{ {
title: '操作', title: '操作',
@ -171,8 +123,7 @@
removeEnable: checkPermission('meeting:visitorPerson:remove') removeEnable: checkPermission('meeting:visitorPerson:remove')
} }
}, },
filters: { filters: {},
},
created() { created() {
}, },
methods: { methods: {
@ -180,6 +131,11 @@
this.selectedRowKeys = selectedRowKeys this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows this.selectedRows = selectedRows
}, },
//
handleInfo(record) {
console.log('handleInfo', record)
this.$router.push({ name: 'visitorPersonInfo', query: { id: record.id } })
},
handleAdd() { handleAdd() {
this.$refs.modal.add() this.$refs.modal.add()
}, },