<template>
|
<TableLayout :permissions="['business:rooms:query']">
|
<!-- 搜索表单 -->
|
<el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="80px" inline>
|
<!-- <el-form-item label="会议室名称" prop="name">
|
<el-input v-model="searchForm.name" placeholder="请输入名称" @keypress.enter.native="search"></el-input>
|
</el-form-item> -->
|
<!-- <el-form-item label="会议室" prop="roomId">
|
<el-select
|
v-model="searchForm.roomId"
|
filterable
|
clearable
|
placeholder="请选择会议室"
|
>
|
<el-option
|
v-for="item in rooms"
|
:key="item.id"
|
:value="item.id"
|
:label="item.name"
|
/>
|
</el-select>
|
</el-form-item> -->
|
<el-form-item label="年份" prop="yearNum">
|
<!-- <div @click="selectMemberAction">
|
<el-input v-model="searchForm.id" disabled placeholder="选择部门成员"></el-input>
|
</div> -->
|
<!-- {{ searchForm.sysList }} -->
|
<el-select
|
v-model="searchForm.yearNum"
|
clearable
|
placeholder="选择部门成员"
|
>
|
<el-option
|
v-for="item in years"
|
:key="item"
|
:value="item"
|
:label="`${item}年`"
|
></el-option>
|
<!-- <el-option :key="1" :value="1" label="禁用" /> -->
|
</el-select>
|
</el-form-item>
|
|
<section>
|
<el-button type="primary" @click="search">搜索</el-button>
|
|
<el-button @click="reset">重置</el-button>
|
</section>
|
</el-form>
|
<!-- 表格和分页 -->
|
<template v-slot:table-wrap>
|
<ul class="toolbar" v-permissions="['business:rooms:create', 'business:rooms:delete']">
|
<li><el-button :loading="isWorking.export" v-permissions="['business:rooms:exportExcel']" @click="exportExcel">导出</el-button></li>
|
<!-- <li><el-button type="primary" @click="$refs.operaRoomsWindow.open('新建会议室')" v-permissions="['business:rooms:create']">新建</el-button></li>
|
<li><el-button @click="deleteByIdInBatch" v-permissions="['business:rooms:delete']">删除</el-button></li> -->
|
</ul>
|
<el-table
|
v-loading="isWorking.search"
|
:data="tableData.list"
|
stripe
|
border
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column prop="roomName" label="会议室" align="center" min-width="120px"></el-table-column>
|
<el-table-column prop="januaryCount" label="一月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.januaryCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="二月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.februaryCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="三月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.marchCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="四月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.aprilCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="五月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.mayCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="六月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.juneCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="七月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.julyCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="八月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.augustCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="九月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.septemberCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="十月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.octoberCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="十一月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.novemberCount}H` }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="januaryCount" label="十二月" align="center" min-width="80px">
|
<template slot-scope="{row}">
|
{{ `${row.decemberCount}H` }}
|
</template>
|
</el-table-column>
|
|
</el-table>
|
</template>
|
</TableLayout>
|
</template>
|
|
<script>
|
import BaseTable from '@/components/base/BaseTable'
|
import TableLayout from '@/layouts/TableLayout'
|
import { getRoomStatistics, exportRoomStatistics } from '@/api/meeting/bookings'
|
// import { findList } from '@/api/meeting/rooms'
|
export default {
|
name: 'Rooms',
|
extends: BaseTable,
|
components: { TableLayout, },
|
data () {
|
return {
|
years: [
|
'2021', '2022', '2023'
|
],
|
rooms: [],
|
// 搜索
|
searchForm: {
|
yearNum: '',
|
roomId: ''
|
}
|
}
|
},
|
|
created () {
|
this.config({
|
module: '会议室信息表',
|
api: '/meeting/rooms',
|
'field.id': 'id',
|
'field.main': 'id'
|
})
|
// findList({})
|
// .then(res => {
|
// this.rooms = res
|
// })
|
let tempYear = new Date().getFullYear()
|
this.searchForm.yearNum = tempYear
|
this.years = [tempYear-2, tempYear-1, tempYear]
|
this.search()
|
},
|
methods: {
|
// 导出Excel
|
exportExcel () {
|
this.__checkApi()
|
this.$dialog.exportConfirm('确认导出吗？')
|
.then(() => {
|
this.isWorking.export = true
|
exportRoomStatistics({
|
page: this.tableData.pagination.pageIndex,
|
capacity: 1000000,
|
model: this.searchForm,
|
sorts: this.tableData.sorts
|
})
|
.then(response => {
|
this.download(response)
|
})
|
.catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.isWorking.export = false
|
})
|
})
|
.catch(() => {})
|
},
|
// 页码变更处理
|
handlePageChange () {
|
this.isWorking.search = true
|
getRoomStatistics(this.searchForm.yearNum, this.searchForm.roomId)
|
.then(data => {
|
this.tableData.list = data
|
// this.tableData.pagination.total = data.total
|
})
|
.catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.isWorking.search = false
|
})
|
},
|
// selectMemberAction() {
|
// console.log('21212');
|
// this.$refs.selectMember.open('选择管理员')
|
// },
|
changeStatus(item) {
|
updateById({
|
id: item.id,
|
status: item.status
|
}).then(res => {
|
this.search()
|
})
|
}
|
},
|
}
|
</script>
|
|
<style scoped>
|
::v-deep .el-input.is-disabled .el-input__inner {
|
background-color: #fff !important;
|
cursor: pointer;
|
}
|
</style>
|
