消防点位维护扫码
parent
b574bd137f
commit
4a02fdefd8
|
@ -29,7 +29,11 @@
|
||||||
<el-col :span="4">
|
<el-col :span="4">
|
||||||
<el-form-item label="是否标点" label-width="110px">
|
<el-form-item label="是否标点" label-width="110px">
|
||||||
<el-select v-model="IS_PUNCTUATION" clearable placeholder="请选择" style="width: 100%;">
|
<el-select v-model="IS_PUNCTUATION" clearable placeholder="请选择" style="width: 100%;">
|
||||||
<el-option v-for="item in punctuationStatusList" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option
|
||||||
|
v-for="item in punctuationStatusList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
@ -75,14 +79,14 @@
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" width="450">
|
<el-table-column label="操作" width="450">
|
||||||
<template slot-scope="{row}">
|
<template slot-scope="{row}">
|
||||||
<el-button
|
<!-- <el-button-->
|
||||||
v-show="true"
|
<!-- v-show="true"-->
|
||||||
class="tiffany-btn"
|
<!-- class="tiffany-btn"-->
|
||||||
icon="el-icon-picture"
|
<!-- icon="el-icon-picture"-->
|
||||||
type="primary"
|
<!-- type="primary"-->
|
||||||
size="mini"
|
<!-- size="mini"-->
|
||||||
@click="handleShowQr(row)">点位二维码
|
<!-- @click="handleShowQr(row)">点位二维码-->
|
||||||
</el-button>
|
<!-- </el-button>-->
|
||||||
<el-button
|
<el-button
|
||||||
v-show="edit"
|
v-show="edit"
|
||||||
type="primary"
|
type="primary"
|
||||||
|
@ -98,12 +102,20 @@
|
||||||
@click="handleDelete(row)">删除
|
@click="handleDelete(row)">删除
|
||||||
</el-button>
|
</el-button>
|
||||||
<!-- 新增按钮:检查记录二维码 -->
|
<!-- 新增按钮:检查记录二维码 -->
|
||||||
|
<!-- <el-button-->
|
||||||
|
<!-- class="tiffany-btn"-->
|
||||||
|
<!-- icon="el-icon-document"-->
|
||||||
|
<!-- type="info"-->
|
||||||
|
<!-- size="mini"-->
|
||||||
|
<!-- @click="handleShowRecordQr(row)">检查记录二维码-->
|
||||||
|
<!-- </el-button>-->
|
||||||
<el-button
|
<el-button
|
||||||
class="tiffany-btn"
|
class="tiffany-btn"
|
||||||
icon="el-icon-document"
|
icon="el-icon-document"
|
||||||
type="info"
|
type="info"
|
||||||
size="mini"
|
size="mini"
|
||||||
@click="handleShowRecordQr(row)">检查记录二维码
|
@click="handleShowNotificationCard(row)">
|
||||||
|
告知卡
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -123,27 +135,91 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-dialog :visible.sync="dialogFormShow" title="查看二维码" width="680px" class="top-dialog">
|
<!-- <el-dialog :visible.sync="dialogFormShow" title="查看二维码" width="680px" class="top-dialog">-->
|
||||||
<div id="printTest" style="border: 1px solid #fff;">
|
<!-- <div id="printTest" style="border: 1px solid #fff;">-->
|
||||||
<div class="level-title" style="margin-top:20px">
|
<!-- <div class="level-title" style="margin-top:20px">-->
|
||||||
<h1>消防点位信息</h1>
|
<!-- <h1>消防点位信息</h1>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <table class="table-ui">-->
|
||||||
|
<!-- <tr>-->
|
||||||
|
<!-- <td class="tbg">消防区域</td>-->
|
||||||
|
<!-- <td >{{ qrInfo.FIRE_REGION_NAME }}</td>-->
|
||||||
|
<!-- <td class="tbg">消防点位</td>-->
|
||||||
|
<!-- <td>{{ qrInfo.FIRE_POINT_NAME }}</td>-->
|
||||||
|
<!-- </tr>-->
|
||||||
|
<!-- <tr>-->
|
||||||
|
<!-- <td class="tbg">负责部门</td>-->
|
||||||
|
<!-- <td>{{ qrInfo.DEPARTMENT_NAME }}</td>-->
|
||||||
|
<!-- <td class="tbg">负责人</td>-->
|
||||||
|
<!-- <td>{{ qrInfo.USERNAME }}</td>-->
|
||||||
|
<!-- </tr>-->
|
||||||
|
<!-- </table>-->
|
||||||
|
<!-- <div class="table-qrcode">-->
|
||||||
|
<!-- <vue-qr :text="qrcodeStr" :margin="0" :size="300" color-dark="#000" color-light="#fff" />-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div slot="footer" class="dialog-footer">-->
|
||||||
|
<!-- <el-button @click="dialogFormShow = false">关 闭</el-button>-->
|
||||||
|
<!-- <el-button v-print="'#printTest'" type="primary">打 印</el-button>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </el-dialog>-->
|
||||||
|
|
||||||
|
<el-dialog :visible.sync="dialogFormShow" title="消防点位维护信息告知牌" width="780px" class="top-dialog">
|
||||||
|
<el-tabs v-model="tabsActive">
|
||||||
|
<el-tab-pane label="横版" name="horizontal"/>
|
||||||
|
<el-tab-pane label="竖版" name="vertical"/>
|
||||||
|
</el-tabs>
|
||||||
|
<div id="printTest">
|
||||||
|
<div class="main_title">消防点位维护信息告知牌</div>
|
||||||
|
<div v-if="tabsActive === 'horizontal'" class="horizontal">
|
||||||
|
<div class="info">
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">消防点位</div>
|
||||||
|
<div class="value">{{ qrInfo.FIRE_POINT_NAME }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">点位编号</div>
|
||||||
|
<div class="value">{{ qrInfo.FIRE_POINT_CODE }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="qr_info">
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">检查码</div>
|
||||||
|
<div class="qr">
|
||||||
|
<vue-qr :text="qrcodeStr" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
|
||||||
|
</div>
|
||||||
|
<div class="title">查询码</div>
|
||||||
|
<div class="qr">
|
||||||
|
<vue-qr :text="qrcodeStr1" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="tabsActive === 'vertical'" class="vertical">
|
||||||
|
<div class="info">
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">消防点位</div>
|
||||||
|
<div class="value">{{ qrInfo.FIRE_POINT_NAME }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">点位编号</div>
|
||||||
|
<div class="value">{{ qrInfo.FIRE_POINT_CODE }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="qr_info">
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">检查码</div>
|
||||||
|
<div class="qr">
|
||||||
|
<vue-qr :text="qrcodeStr" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="title">查询码</div>
|
||||||
|
<div class="qr">
|
||||||
|
<vue-qr :text="qrcodeStr1" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<table class="table-ui">
|
|
||||||
<tr>
|
|
||||||
<td class="tbg">消防区域</td>
|
|
||||||
<td >{{ qrInfo.FIRE_REGION_NAME }}</td>
|
|
||||||
<td class="tbg">消防点位</td>
|
|
||||||
<td>{{ qrInfo.FIRE_POINT_NAME }}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="tbg">负责部门</td>
|
|
||||||
<td>{{ qrInfo.DEPARTMENT_NAME }}</td>
|
|
||||||
<td class="tbg">负责人</td>
|
|
||||||
<td>{{ qrInfo.USERNAME }}</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
<div class="table-qrcode">
|
|
||||||
<vue-qr :text="qrcodeStr" :margin="0" :size="300" color-dark="#000" color-light="#fff" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer" class="dialog-footer">
|
<div slot="footer" class="dialog-footer">
|
||||||
|
@ -168,10 +244,18 @@
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<el-dialog v-loading="listLoading" :visible.sync="dialogEditUser" title="批量修改负责人" width="800px">
|
<el-dialog v-loading="listLoading" :visible.sync="dialogEditUser" title="批量修改负责人" width="800px">
|
||||||
<el-form ref="firefightingBatchEditDept" :model="dialogEditUserForm" :rules="dialogEditUserRules" label-width="150px">
|
<el-form
|
||||||
|
ref="firefightingBatchEditDept"
|
||||||
|
:model="dialogEditUserForm"
|
||||||
|
:rules="dialogEditUserRules"
|
||||||
|
label-width="150px">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-form-item label="负责人员" prop="USER_ID">
|
<el-form-item label="负责人员" prop="USER_ID">
|
||||||
<el-select v-model="dialogEditUserForm.USER_ID" placeholder="请选择人员" class="filter-item" style="width: 80%;">
|
<el-select
|
||||||
|
v-model="dialogEditUserForm.USER_ID"
|
||||||
|
placeholder="请选择人员"
|
||||||
|
class="filter-item"
|
||||||
|
style="width: 80%;">
|
||||||
<el-option v-for="item in userList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID"/>
|
<el-option v-for="item in userList" :key="item.USER_ID" :label="item.NAME" :value="item.USER_ID"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
@ -204,6 +288,8 @@ export default {
|
||||||
dialogFormShow: false,
|
dialogFormShow: false,
|
||||||
dialogRecordFormShow: false,
|
dialogRecordFormShow: false,
|
||||||
qrcodeStr: '',
|
qrcodeStr: '',
|
||||||
|
qrcodeStr1: '',
|
||||||
|
tabsActive: 'horizontal',
|
||||||
recordQrcodeStr: '',
|
recordQrcodeStr: '',
|
||||||
qrInfo: {},
|
qrInfo: {},
|
||||||
add: false,
|
add: false,
|
||||||
|
@ -275,6 +361,7 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
handleShowRecordQr(ROW) {
|
handleShowRecordQr(ROW) {
|
||||||
|
console.log(ROW)
|
||||||
this.dialogFormShow = true
|
this.dialogFormShow = true
|
||||||
// 确保qrInfo绑定了需要显示的数据字段
|
// 确保qrInfo绑定了需要显示的数据字段
|
||||||
this.qrInfo = {
|
this.qrInfo = {
|
||||||
|
@ -293,6 +380,22 @@ export default {
|
||||||
this.qrcodeStr = jsonStr
|
this.qrcodeStr = jsonStr
|
||||||
console.info(this.qrcodeStr)
|
console.info(this.qrcodeStr)
|
||||||
},
|
},
|
||||||
|
handleShowNotificationCard(ROW) {
|
||||||
|
this.dialogFormShow = true
|
||||||
|
this.qrInfo = ROW
|
||||||
|
// 检查码
|
||||||
|
this.qrcodeStr = JSON.stringify({
|
||||||
|
MANAGER_TYPE: 'checkRecordManager',
|
||||||
|
USER_ID: ROW.USER_ID,
|
||||||
|
DEPARTMENT_ID: ROW.DEPARTMENT_ID,
|
||||||
|
FIRE_POINT_ID: ROW.FIRE_POINT_ID
|
||||||
|
})
|
||||||
|
// 查询码
|
||||||
|
this.qrcodeStr1 = JSON.stringify({
|
||||||
|
MANAGER_TYPE: 'fireListManager',
|
||||||
|
FIRE_POINT_ID: ROW.FIRE_POINT_ID
|
||||||
|
})
|
||||||
|
},
|
||||||
handleEdit(FIRE_POINT_ID) {
|
handleEdit(FIRE_POINT_ID) {
|
||||||
this.$parent.FIRE_POINT_ID = FIRE_POINT_ID
|
this.$parent.FIRE_POINT_ID = FIRE_POINT_ID
|
||||||
this.$parent.activeName = 'Edit'
|
this.$parent.activeName = 'Edit'
|
||||||
|
@ -456,7 +559,8 @@ export default {
|
||||||
})
|
})
|
||||||
this.dialogEditUser = false
|
this.dialogEditUser = false
|
||||||
this.getList()
|
this.getList()
|
||||||
}).catch(() => {})
|
}).catch(() => {
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -541,10 +645,12 @@ export default {
|
||||||
.returnBtn {
|
.returnBtn {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-container {
|
.app-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-qrcode {
|
.table-qrcode {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
|
@ -555,3 +661,139 @@ export default {
|
||||||
width: 100%
|
width: 100%
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
#printTest {
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
padding: 20px;
|
||||||
|
margin: 10px;
|
||||||
|
|
||||||
|
.main_title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 30px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.horizontal {
|
||||||
|
.info {
|
||||||
|
color: #000;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-top: 30px;
|
||||||
|
|
||||||
|
.row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
width: 120px;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding: 5px;
|
||||||
|
letter-spacing: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-left: none;
|
||||||
|
flex: 1;
|
||||||
|
padding: 5px 5px 5px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& + .row {
|
||||||
|
.title, .value {
|
||||||
|
border-top: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr_info {
|
||||||
|
color: #000;
|
||||||
|
font-size: 16px;
|
||||||
|
|
||||||
|
.row {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
width: 30px;
|
||||||
|
line-height: 22px;
|
||||||
|
writing-mode: vertical-rl;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 15px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-top: none;
|
||||||
|
padding: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr {
|
||||||
|
flex: 1;
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-top: none;
|
||||||
|
border-left: none;
|
||||||
|
padding: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
& + .title {
|
||||||
|
border-left: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.vertical {
|
||||||
|
.info, .qr_info {
|
||||||
|
color: #000;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-top: 30px;
|
||||||
|
|
||||||
|
.row {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
width: 200px;
|
||||||
|
text-align: center;
|
||||||
|
padding: 5px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
letter-spacing: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value, .qr {
|
||||||
|
padding: 5px 5px 5px 10px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-left: none;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
& + .row {
|
||||||
|
.title, .value, .qr {
|
||||||
|
border-top: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr_info {
|
||||||
|
margin-top: 0;
|
||||||
|
|
||||||
|
.row {
|
||||||
|
.title {
|
||||||
|
letter-spacing: 12px;
|
||||||
|
line-height: 280px;
|
||||||
|
border-top: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-top: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue