拆分会客厅

This commit is contained in:
a0049873 2022-12-07 09:36:45 +08:00
parent 1eb4e4f46e
commit cfcf580da2
2 changed files with 373 additions and 25 deletions

View File

@ -6,7 +6,7 @@
style="width: 160px"
placeholder="请输入会客厅名称"
></el-input>
<el-select
<!-- <el-select
v-model="value"
style="width: 160px"
clearable
@ -19,7 +19,7 @@
:value="item.value"
>
</el-option>
</el-select>
</el-select> -->
<el-button type="primary" @click="searchData">查询</el-button>
</div>
<div>
@ -50,13 +50,13 @@
header-align="center"
align="center"
></el-table-column>
<el-table-column
<!-- <el-table-column
label="申请状态"
prop="state"
header-align="center"
align="center"
:formatter="formatter"
></el-table-column>
></el-table-column> -->
<el-table-column
:label="$t('handle')"
fixed="right"
@ -222,14 +222,14 @@ export default {
options: [
{
value: '1',
label: '待审核',
label: '待审核'
},
{
value: '0',
label: '审核完成',
},
label: '审核完成'
}
],
value: '',
value: '1',
limit: 10,
page: 1,
total: 0,
@ -245,7 +245,7 @@ export default {
file: '',
name: '',
creator: '',
roomNameA: '',
roomNameA: ''
}
},
mounted () {
@ -294,13 +294,13 @@ export default {
},
ok () {
let query = {
const query = {
auditViem: this.desc,
state: this.radio,
id: this.id,
name: this.name,
roomName: this.roomName,
creator: this.creator,
creator: this.creator
}
this.$http.put('/bookMeeting', query).then(({ data: res }) => {
this.dialogVisibleChuli = false
@ -316,8 +316,8 @@ export default {
},
formatter (row, column) {
return row.state == '1' ? '待审核' : '审核完成'
},
},
}
}
}
</script>
<style scoped lang="scss">
@ -328,7 +328,7 @@ export default {
}
.roomExamineSearch {
display: flex;
width: 410px;
width: 240px;
margin-bottom: 20px;
justify-content: space-between;
}

View File

@ -0,0 +1,348 @@
<template>
<el-card shadow="never" class="roomBox">
<div class="roomExamineSearch">
<el-input
v-model="roomNameA"
style="width: 160px"
placeholder="请输入会客厅名称"
></el-input>
<!-- <el-select
v-model="value"
style="width: 160px"
clearable
placeholder="请选择审核状态"
>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select> -->
<el-button type="primary" @click="searchData">查询</el-button>
</div>
<div>
<el-table border style="width: 100%" :data="tableData">
<el-table-column
label="申请人"
prop="name"
header-align="center"
align="center"
>
</el-table-column>
<el-table-column
label="申请部门"
prop="dept"
header-align="center"
align="center"
>
</el-table-column>
<el-table-column
label="申请会客厅"
prop="roomName"
header-align="center"
align="center"
></el-table-column>
<el-table-column
label="申请时段"
prop="bookDate"
header-align="center"
align="center"
></el-table-column>
<!-- <el-table-column
label="申请状态"
prop="state"
header-align="center"
align="center"
:formatter="formatter"
></el-table-column> -->
<el-table-column
:label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="150"
>
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click="taskDetails(scope.row, scope.row.state)"
>{{ scope.row.state == '1' ? '处理' : '详情' }}</el-button
>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="[10, 20, 50]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
</div>
<el-dialog
:title="lookData.roomName"
:visible.sync="dialogVisible"
width="50%"
>
<div class="modalResult" style="margin-bottom: 20px">处理结果</div>
<div
style="
width: 100%;
height: 0.01rem;
border-top: 1px solid #ccc;
transform: scaleY(0.5);
"
></div>
<div
class="modalExamine"
style="display: flex; flex-direction: column; margin-top: 20px"
>
<span style="margin-bottom: 20px">
审核结果{{ lookData.state === '2' ? '通过' : '不通过' }}
</span>
<span style="width: 90%; margin-bottom: 20px">
审核意见{{ lookData.auditViem }}
</span>
</div>
<div class="modalYuyue" style="margin-bottom: 20px">预约信息</div>
<div
style="
width: 100%;
height: 0.01rem;
border-top: 1px solid #ccc;
transform: scaleY(0.5);
"
></div>
<div class="modalTime" style="margin-bottom: 20px">
<div style="margin: 20px 0 20px 0">
预约日期{{ lookData.bookDate }}
</div>
<div>预约时段{{ lookData.startTime }}-{{ lookData.endTime }}</div>
<div
class="modalContent"
style="
width: 85%;
display: flex;
justify-content: space-between;
margin: 15px 0 15px 0;
"
>
<span>预约人{{ lookData.name }}</span>
<span>联系方式{{ lookData.phone }}</span>
<span>预约部门{{ lookData.dept }}</span>
</div>
<div style="width: 800px; margin-bottom: 30px">
使用事项{{ lookData.matter }}
</div>
</div>
<div>
<div style="display: flex; align-items: center">
<span>附件</span>
<el-button
v-show="file != ''"
size="mini"
@click="downloadTemplate(file)"
>下载</el-button
>
</div>
</div>
</el-dialog>
<el-dialog
:title="lookData.roomName"
:visible.sync="dialogVisibleChuli"
width="50%"
>
<div class="modalResult" style="margin-bottom: 10px">预约信息</div>
<div
style="
width: 100%;
height: 0.01rem;
border-top: 1px solid #ccc;
transform: scaleY(0.5);
"
></div>
<el-row style="display: flex; margin-top: 20px">
<el-col :span="8">预约日期{{ lookData.bookDate }}</el-col>
<el-col :span="8"
>预约时段{{ lookData.startTime }}-{{ lookData.endTime }}</el-col
>
</el-row>
<div class="modalTime">
<el-row class="modalContent" style="margin: 15px 0 15px 0">
<el-col :span="8">申请人{{ lookData.name }}</el-col>
<el-col :span="8">联系方式{{ lookData.phone }}</el-col>
<el-col :span="8">申请部门{{ lookData.dept }}</el-col>
</el-row>
<el-row style="margin-bottom: 30px">
<el-col :span="24"> 使用事项{{ lookData.matter }} </el-col>
</el-row>
<el-row>
<el-col :span="2">审核结果</el-col>
<el-col :span="8" style="display: flex">
<el-radio v-model="radio" label="2">通过</el-radio>
<el-radio v-model="radio" label="3">不通过</el-radio>
</el-col>
</el-row>
<el-row style="display: flex; margin-top: 20px">
<el-col :span="2">审核意见</el-col>
<el-col :span="16">
<el-input type="textarea" v-model="desc"></el-input>
</el-col>
</el-row>
<el-row style="display: flex; margin-top: 20px">
<el-col :span="2">附件</el-col>
<el-col :span="16">
<el-button
v-if="file != ''"
size="mini"
@click="downloadTemplate(file)"
>下载</el-button
>
</el-col>
</el-row>
<div slot="footer" class="dialog-footer">
<el-button @click="No"> </el-button>
<el-button type="primary" @click="ok"> </el-button>
</div>
</div>
</el-dialog>
</el-card>
</template>
<script>
import Cookies from 'js-cookie'
export default {
data () {
return {
options: [
{
value: '1',
label: '待审核'
},
{
value: '0',
label: '审核完成'
}
],
value: '0',
limit: 10,
page: 1,
total: 0,
roomName: '',
tableData: [],
dialogVisible: false,
dialogVisibleChuli: false,
lookData: {},
radio: '2',
desc: '',
id: '',
num: '',
file: '',
name: '',
creator: '',
roomNameA: ''
}
},
mounted () {
this.getSerach()
},
methods: {
getSerach () {
this.$http
.get(
`/bookMeeting/auditPage?page=${this.page}&limit=${this.limit}&roomName=${this.roomNameA}&state=${this.value}`
)
.then(({ data: res }) => {
this.tableData = res.data.list
this.total = res.data.total
})
},
downloadTemplate (file) {
// window.SITE_CONFIG.apiURL +
window.open(`${file}?token=` + Cookies.get('ucsToken'))
},
handleSizeChange (val) {
this.limit = val
this.getSerach()
},
handleCurrentChange (val) {
this.page = val
this.getSerach()
},
searchData () {
this.getSerach()
},
taskDetails (item, num) {
if (num == '1') {
this.dialogVisibleChuli = true
this.id = item.id
this.name = item.name
this.roomName = item.roomName
this.creator = item.creator
} else {
this.dialogVisible = true
}
this.$http.get(`bookMeeting/${item.id}`).then(({ data: res }) => {
this.file = res.data.file
})
this.lookData = item
},
ok () {
const query = {
auditViem: this.desc,
state: this.radio,
id: this.id,
name: this.name,
roomName: this.roomName,
creator: this.creator
}
this.$http.put('/bookMeeting', query).then(({ data: res }) => {
this.dialogVisibleChuli = false
this.radio = '2'
this.desc = ''
this.getSerach()
})
},
No () {
this.radio = '2'
this.desc = ''
this.dialogVisibleChuli = false
},
formatter (row, column) {
return row.state == '1' ? '待审核' : '审核完成'
}
}
}
</script>
<style scoped lang="scss">
.roomBox {
min-height: calc(calc(100vh - 50px - 38px - 30px));
.roomHeadSpan {
font-weight: 600;
}
.roomExamineSearch {
display: flex;
width: 240px;
margin-bottom: 20px;
justify-content: space-between;
}
}
.dialog-footer {
text-align: center;
margin-top: 40px;
}
// ::v-deep .el-input {
// margin-right: 15px;
// display: inline-block;
// }
// ::v-deep .el-select {
// margin-right: 20px;
// display: inline-block;
// }
</style>