mirror of
https://gitee.com/elegant_wings/dbd-meeting-html.git
synced 2025-06-21 21:49:38 +08:00
534 lines
16 KiB
Vue
534 lines
16 KiB
Vue
<template>
|
|
<a-card :bordered='false'>
|
|
<div class='table-page-search-wrapper'>
|
|
<a-form layout='inline'>
|
|
<a-row :gutter='48'>
|
|
<a-col :md='5' :sm='15'>
|
|
<a-form-item label='关键词'>
|
|
<a-input placeholder='请输入关键词' v-model='queryParam.meetingName' />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :md='5' :sm='15'>
|
|
<a-form-item label='会议室类型'>
|
|
<a-select v-model='queryParam.typeName' placeholder='请选择会议室类型'>
|
|
<a-select-option :value='1'>
|
|
会议室
|
|
</a-select-option>
|
|
<a-select-option :value='2'>
|
|
路演厅
|
|
</a-select-option>
|
|
<a-select-option :value='3'>
|
|
洽谈室
|
|
</a-select-option>
|
|
<a-select-option :value='4'>
|
|
直播间
|
|
</a-select-option>
|
|
<a-select-option :value='5'>
|
|
茶室
|
|
</a-select-option>
|
|
<a-select-option :value='6'>
|
|
长阳会客厅
|
|
</a-select-option>
|
|
<a-select-option :value='7'>
|
|
多功能厅
|
|
</a-select-option>
|
|
<a-select-option :value='8'>
|
|
数据要素
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :md='5' :sm='15'>
|
|
<a-form-item label='排列形状'>
|
|
<a-select v-model='queryParam.shape' placeholder='请选择排列形状'>
|
|
<a-select-option value='围桌式'>
|
|
围桌式
|
|
</a-select-option>
|
|
<a-select-option value='课桌式'>
|
|
课桌式
|
|
</a-select-option>
|
|
<a-select-option value='长方形'>
|
|
长方形
|
|
</a-select-option>
|
|
<a-select-option value='U形'>
|
|
U形
|
|
</a-select-option>
|
|
<a-select-option value='鱼骨形'>
|
|
鱼骨形
|
|
</a-select-option>
|
|
<a-select-option value='开放形'>
|
|
开放形
|
|
</a-select-option>
|
|
<a-select-option value='会议形'>
|
|
会议形
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :md='5' :sm='15'>
|
|
<a-form-item label='容纳人数'>
|
|
<a-select v-model='queryParam.capacityNum' placeholder='请选择类型'>
|
|
<a-select-option v-for='(item,index) in capacityList' :key='item.id' :value='item.capacityNum'>
|
|
{{ item.capacityNum }}
|
|
</a-select-option>
|
|
</a-select>
|
|
</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>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<div class='table-operator'>
|
|
<a-button v-if='addEnable' type='primary' icon='plus' @click='$refs.modal.add()'>新建</a-button>
|
|
<a-dropdown v-if='removeEnable && selectedRowKeys.length > 0'>
|
|
<a-button type='danger' icon='delete' @click='delByIds(selectedRowKeys)'>删除</a-button>
|
|
</a-dropdown>
|
|
</div>
|
|
<s-table
|
|
size='default'
|
|
ref='table'
|
|
rowKey='id'
|
|
:rowSelection='{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }'
|
|
:columns='columns'
|
|
:data='loadData'
|
|
>
|
|
<span slot='type' slot-scope='text'>
|
|
{{ text | typeFilter }}
|
|
</span>
|
|
<span slot='item' slot-scope='text,record'>
|
|
<a @click='handleItemTable(record)'>{{ record.itemCount }}</a>
|
|
</span>
|
|
<span slot='serve' slot-scope='text,record'>
|
|
<a @click='handleServeTable(record)'>{{ record.serveCount }}</a>
|
|
</span>
|
|
<span slot='action' slot-scope='text, record'>
|
|
<a v-if='editEnabel' @click='handleEdit(record)'>编辑</a>
|
|
<a-divider type='vertical' />
|
|
<a v-if='removeEnable' @click='deleteShow([record.id])'>删除</a>
|
|
</span>
|
|
</s-table>
|
|
|
|
<a-modal
|
|
title='提示'
|
|
:visible='deleteVisible'
|
|
:confirm-loading='deleteLoading'
|
|
@ok='deleteOk'
|
|
@cancel='deleteCancel'
|
|
>
|
|
<p>是否确认删除？</p>
|
|
</a-modal>
|
|
|
|
|
|
<roomContent-modal ref='modal' @ok='handleOk' />
|
|
|
|
|
|
<a-modal v-model='visible' title='会议设备' width='500px' @ok='itemHandleOk()'>
|
|
<div class='table-page-search-wrapper'>
|
|
<a-form layout='inline'>
|
|
<a-row :gutter='48'>
|
|
<!-- <a-col :md='8' :sm='15'>-->
|
|
<!-- <a-form-item label='关键词'>-->
|
|
<!-- <a-input placeholder='请输入关键词' v-model='itemQueryParam.itemName' />-->
|
|
<!-- </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='() => (itemQueryParam = {})'>重置</a-button>
|
|
</span>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<div class='table-operator'>
|
|
</div>
|
|
<s-table
|
|
size='default'
|
|
ref='itemTable'
|
|
rowKey='id'
|
|
:rowSelection='{ selectedRowKeys: selectedItemRowKeys, onChange: onItemSelectChange }'
|
|
:columns='itemColumns'
|
|
:data='itemLoadData'
|
|
>
|
|
</s-table>
|
|
</a-modal>
|
|
<a-modal v-model='visible1' title='会议服务' width='1000px' @ok='serveHandleOk()'>
|
|
<div class='table-page-search-wrapper'>
|
|
<a-form layout='inline'>
|
|
<a-row :gutter='48'>
|
|
<!-- <a-col :md='8' :sm='15'>-->
|
|
<!-- <a-form-item label='关键词'>-->
|
|
<!-- <a-input placeholder='请输入关键词' v-model='serveQueryParam.serveName' />-->
|
|
<!-- </a-form-item>-->
|
|
<!-- </a-col>-->
|
|
<a-col :md='8' :sm='30'>
|
|
<a-form-item label='服务类型'>
|
|
<a-select v-model='serveQueryParam.itemType' placeholder='请选择服务类型'>
|
|
<a-select-option value='1'>
|
|
免费服务
|
|
</a-select-option>
|
|
<a-select-option value='2'>
|
|
增值服务
|
|
</a-select-option>
|
|
</a-select>
|
|
</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='() => (serveQueryParam = {})'>重置</a-button>
|
|
</span>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<div class='table-operator'>
|
|
</div>
|
|
<s-table
|
|
size='default'
|
|
ref='serveTable'
|
|
rowKey='id'
|
|
:rowSelection='{ selectedRowKeys: selectedServeRowKeys, onChange: onServeSelectChange }'
|
|
:columns='serveColumns'
|
|
:data='serveLoadData'
|
|
:scroll='{ x: true }'
|
|
>
|
|
<span slot='serveType' slot-scope='text'>
|
|
{{ text | serveTypeFilter }}
|
|
</span>
|
|
</s-table>
|
|
</a-modal>
|
|
</a-card>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import { STable } from '@/components'
|
|
|
|
import {
|
|
getRoomContentList, delRoomContent, selectSearchInfoByType,
|
|
selectSearchInfoByShape, selectSearchInfoByCapacity, addRoomServe,
|
|
selectRoomServeByRoom, selectRoomItemByRoom
|
|
} from '@/api/admin/meeting/roomContent'
|
|
import { getRoomServeList } from '@/api/admin/meeting/roomServe'
|
|
import { getRoomItemList } from '@/api/admin/meeting/roomItem'
|
|
import RoomContentModal from './modules/RoomContentModal.vue'
|
|
import { checkPermission } from '@/utils/permissions'
|
|
import { getDictArray } from '@/utils/dict'
|
|
import { addRoomItem } from '../../../api/admin/meeting/roomContent'
|
|
|
|
const typeMap = {}
|
|
const serveTypeMap = {}
|
|
export default {
|
|
name: 'TableList',
|
|
components: {
|
|
STable,
|
|
RoomContentModal
|
|
},
|
|
data() {
|
|
return {
|
|
labelCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 5 }
|
|
},
|
|
wrapperCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 16 }
|
|
},
|
|
form: this.$form.createForm(this),
|
|
mdl: {},
|
|
visible: false,
|
|
visible1: false,
|
|
typeMap,
|
|
// 高级搜索 展开/关闭
|
|
advanced: false,
|
|
// 查询参数
|
|
queryParam: {},
|
|
itemQueryParam: {
|
|
},
|
|
serveQueryParam: {},
|
|
capacityList: [],
|
|
shapeList: [],
|
|
typeList: [],
|
|
serveTypeMap,
|
|
itemColumns: [
|
|
{
|
|
title: '物品名称',
|
|
dataIndex: 'name'
|
|
}
|
|
],
|
|
serveColumns: [
|
|
{
|
|
title: '服务名称',
|
|
dataIndex: 'serveName'
|
|
},
|
|
{
|
|
title: '服务类型',
|
|
dataIndex: 'serveType',
|
|
scopedSlots: { customRender: 'serveType' }
|
|
},
|
|
{
|
|
title: '金额',
|
|
dataIndex: 'money'
|
|
}
|
|
],
|
|
|
|
// 表头
|
|
columns: [
|
|
{
|
|
title: '会议室名称',
|
|
dataIndex: 'meetingName'
|
|
},
|
|
{
|
|
title: '会议室类型',
|
|
dataIndex: 'type',
|
|
scopedSlots: { customRender: 'type' }
|
|
},
|
|
{
|
|
title: '容纳人数',
|
|
dataIndex: 'capacityNum'
|
|
},
|
|
{
|
|
title: '排列形状',
|
|
dataIndex: 'shape'
|
|
},
|
|
{
|
|
title: '会议室设备',
|
|
dataIndex: 'itemCount',
|
|
scopedSlots: { customRender: 'item' }
|
|
},
|
|
{
|
|
title: '关联服务',
|
|
dataIndex: 'serveCount',
|
|
scopedSlots: { customRender: 'serve' }
|
|
},
|
|
{
|
|
title: '金额',
|
|
dataIndex: 'money'
|
|
},
|
|
{
|
|
title: '负责人',
|
|
dataIndex: 'headName'
|
|
},
|
|
{
|
|
title: '操作',
|
|
width: '200px',
|
|
dataIndex: 'action',
|
|
scopedSlots: { customRender: 'action' }
|
|
}
|
|
],
|
|
// 加载数据方法 必须为 Promise 对象
|
|
loadData: (parameter) => {
|
|
return getRoomContentList(Object.assign(parameter, this.queryParam))
|
|
},
|
|
itemLoadData: (parameter) => {
|
|
console.log(this.parkId)
|
|
let param ={
|
|
parkId:this.parkId
|
|
}
|
|
|
|
return getRoomItemList(Object.assign(parameter, param))
|
|
},
|
|
serveLoadData: (parameter) => {
|
|
let param ={
|
|
parkId:this.parkId
|
|
}
|
|
return getRoomServeList(Object.assign(parameter, param))
|
|
},
|
|
selectedRowKeys: [],
|
|
selectedRows: [],
|
|
|
|
selectedItemRowKeys: [],
|
|
selectedItemRows: [],
|
|
|
|
selectedServeRowKeys: [],
|
|
selectedServeRows: [],
|
|
meetingId: '',
|
|
addEnable: checkPermission('meeting:roomContent:add'),
|
|
editEnabel: checkPermission('meeting:roomContent:edit'),
|
|
removeEnable: checkPermission('meeting:roomContent:remove'),
|
|
// 删除
|
|
deleteVisible: false,
|
|
deleteLoading: false,
|
|
deleteIds : null,
|
|
}
|
|
},
|
|
filters: {
|
|
typeFilter(Type) {
|
|
return typeMap[Type].text
|
|
},
|
|
serveTypeFilter(serveType) {
|
|
return serveTypeMap[serveType].text
|
|
}
|
|
},
|
|
async created() {
|
|
const TypeData = await getDictArray('meeting_type')
|
|
TypeData.map(d => {
|
|
typeMap[d.dictValue] = { text: d.dictLabel }
|
|
})
|
|
console.log(typeMap)
|
|
const serveTypeData = await getDictArray('serve_type')
|
|
serveTypeData.map(d => {
|
|
serveTypeMap[d.dictValue] = { text: d.dictLabel }
|
|
})
|
|
},
|
|
mounted() {
|
|
this.selectSearchInfoByType()
|
|
this.selectSearchInfoByShape()
|
|
this.selectSearchInfoByCapacity()
|
|
},
|
|
methods: {
|
|
itemHandleOk() {
|
|
console.log(this.meetingId)
|
|
let params = {
|
|
itemIds: this.selectedItemRowKeys,
|
|
roomContentId: this.meetingId
|
|
}
|
|
addRoomItem(params).then((res) => {
|
|
if (res.code == 0) {
|
|
this.$message.success('关联成功')
|
|
this.visible = false
|
|
this.selectedItemRowKeys = []
|
|
this.selectedItemRows = []
|
|
this.handleOk()
|
|
}
|
|
})
|
|
},
|
|
|
|
serveHandleOk() {
|
|
// 新增 物品跟会议室关联
|
|
let params = {
|
|
serveIds: this.selectedServeRowKeys,
|
|
romeContentId: this.meetingId
|
|
}
|
|
addRoomServe(params).then((res) => {
|
|
if (res.code == 0) {
|
|
this.$message.success('关联成功')
|
|
this.visible1 = false
|
|
this.selectedServeRowKeys = []
|
|
this.selectedServeRows = []
|
|
this.handleOk()
|
|
}
|
|
})
|
|
|
|
|
|
},
|
|
onItemSelectChange(selectedRowKeys, selectedRows) {
|
|
this.selectedItemRowKeys = selectedRowKeys
|
|
this.selectedItemRows = selectedRows
|
|
|
|
},
|
|
onServeSelectChange(selectedRowKeys, selectedRows) {
|
|
this.selectedServeRowKeys = selectedRowKeys
|
|
this.selectedServeRows = selectedRows
|
|
|
|
},
|
|
handleItemTable(record) {
|
|
let params = {
|
|
roomContentId: record.id,
|
|
}
|
|
this.parkId = record.parkId
|
|
|
|
selectRoomItemByRoom(params).then((res) => {
|
|
this.selectedItemRowKeys = res.data.map(d => d.itemId)
|
|
this.selectedItemRows = res.data
|
|
})
|
|
this.visible = true
|
|
this.meetingId = record.id
|
|
|
|
},
|
|
handleServeTable(record) {
|
|
let params = {
|
|
romeContentId: record.id,
|
|
|
|
}
|
|
this.parkId = record.parkId
|
|
selectRoomServeByRoom(params).then((res) => {
|
|
this.selectedServeRowKeys = res.data.map(d => d.serveId)
|
|
this.selectedServeRows = res.data
|
|
})
|
|
this.visible1 = true
|
|
this.meetingId = record.id
|
|
|
|
},
|
|
|
|
// 获取查询条件
|
|
selectSearchInfoByType() {
|
|
selectSearchInfoByType().then((res) => {
|
|
this.typeList = res.roomContents
|
|
})
|
|
},
|
|
selectSearchInfoByShape() {
|
|
selectSearchInfoByShape().then((res) => {
|
|
this.shapeList = res.roomContents
|
|
})
|
|
},
|
|
selectSearchInfoByCapacity() {
|
|
selectSearchInfoByCapacity().then((res) => {
|
|
this.capacityList = res.roomContents
|
|
})
|
|
},
|
|
onSelectChange(selectedRowKeys, selectedRows) {
|
|
this.selectedRowKeys = selectedRowKeys
|
|
this.selectedRows = selectedRows
|
|
},
|
|
handleAdd() {
|
|
this.$refs.modal.add()
|
|
},
|
|
handleEdit(record) {
|
|
this.$refs.modal.edit(record)
|
|
},
|
|
handleOk() {
|
|
this.$refs.table.refresh(true)
|
|
},
|
|
delByIds(ids) {
|
|
delRoomContent({ ids: ids.join(',') }).then((res) => {
|
|
if (res.code === 0) {
|
|
this.$message.success('删除成功')
|
|
this.handleOk()
|
|
} else {
|
|
this.$message.error(res.msg)
|
|
}
|
|
this.selectedRowKeys = []
|
|
// 删除结束
|
|
this.deleteVisible = false
|
|
this.deleteLoading = false
|
|
})
|
|
},
|
|
deleteShow(ids) {
|
|
this.deleteVisible = true
|
|
this.deleteIds = ids
|
|
},
|
|
deleteOk() {
|
|
this.deleteLoading = true;
|
|
this.delByIds(this.deleteIds)
|
|
},
|
|
deleteCancel() {
|
|
this.deleteVisible = false
|
|
},
|
|
},
|
|
watch: {
|
|
/*
|
|
'selectedRows': function (selectedRows) {
|
|
this.needTotalList = this.needTotalList.map(item => {
|
|
return {
|
|
...item,
|
|
total: selectedRows.reduce( (sum, val) => {
|
|
return sum + val[item.dataIndex]
|
|
}, 0)
|
|
}
|
|
})
|
|
}
|
|
*/
|
|
}
|
|
}
|
|
</script>
|