guoyuepeng
/
qa-prevention-gwj-vue
1
0
Fork 3
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

1.消防点位二维码

hyx_2024-11-06_newInspect
guoyuepeng 2024-10-31 16:08:29 +08:00
parent 82d63b32db
commit 4cbef9b2fb
1 changed files with 450 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

494
src/views/firefighting/points/components/list.vue
View File

@ -29,7 +29,11 @@
<el-col :span="4">
<el-form-item label="是否标点" label-width="110px">
<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-form-item>
</el-col>
@ -67,16 +71,22 @@
<el-table-column prop="DEVICE_COUNT" label="点位下消防器材数"/>
<el-table-column prop="DEPARTMENT_NAME" label="负责部门"/>
<el-table-column prop="USERNAME" label="负责人"/>
<el-table-column label="操作" width="380">
<el-table-column prop="ISPUNCTUATION" label="是否标点">
<template slot-scope="{row}">
<el-button
v-show="true"
class="tiffany-btn"
icon="el-icon-picture"
type="primary"
size="mini"
@click="handleShowQr(row)">点位二维码
</el-button>
<el-tag v-if="row.ISPUNCTUATION == 0" type="success">是</el-tag>
<el-tag v-else type="danger">否</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="450">
<template slot-scope="{row}">
<!-- <el-button-->
<!-- v-show="true"-->
<!-- class="tiffany-btn"-->
<!-- icon="el-icon-picture"-->
<!-- type="primary"-->
<!-- size="mini"-->
<!-- @click="handleShowQr(row)">点位二维码-->
<!-- </el-button>-->
<el-button
v-show="edit"
type="primary"
@ -91,6 +101,22 @@
size="mini"
@click="handleDelete(row)">删除
</el-button>
<!-- 新增按钮：检查记录二维码 -->
<!-- <el-button-->
<!-- class="tiffany-btn"-->
<!-- icon="el-icon-document"-->
<!-- type="info"-->
<!-- size="mini"-->
<!-- @click="handleShowRecordQr(row)">检查记录二维码-->
<!-- </el-button>-->
<el-button
class="tiffany-btn"
icon="el-icon-document"
type="info"
size="mini"
@click="handleShowNotificationCard(row)">
告知卡
</el-button>
</template>
</el-table-column>
</el-table>
@ -98,6 +124,7 @@
<div>
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增</el-button>
<el-button type="danger" icon="el-icon-delete" @click="handleDelete">批量删除</el-button>
<el-button type="info" icon="el-icon-plus" @click="handleEditUser">批量修改负责人</el-button>
</div>
<pagination
:total="total"
@ -108,27 +135,91 @@
</div>
</div>
<el-dialog :visible.sync="dialogFormShow" title="查看二维码" width="680px" class="top-dialog">
<div id="printTest" style="border: 1px solid #fff;">
<div class="level-title" style="margin-top:20px">
<h1>消防点位信息</h1>
<!-- <el-dialog :visible.sync="dialogFormShow" title="查看二维码" width="680px" class="top-dialog">-->
<!-- <div id="printTest" style="border: 1px solid #fff;">-->
<!-- <div class="level-title" style="margin-top:20px">-->
<!-- <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_jianchama" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
</div>
<div class="title">查询码</div>
<div class="qr">
<vue-qr :text="qrcodeStr_chaxunma" :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_jianchama" :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="qrcodeStr_chaxunma" :margin="0" :size="280" color-dark="#000" color-light="#fff"/>
</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 slot="footer" class="dialog-footer">
@ -136,6 +227,45 @@
<el-button v-print="'#printTest'" type="primary">打 印</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogRecordFormShow" title="查看检查记录二维码" width="680px" class="top-dialog">
<div id="recordPrintTest" style="border: 1px solid #fff;">
<div class="level-title" style="margin-top:20px">
<h1>检查记录二维码</h1>
</div>
<div class="table-qrcode">
<vue-qr :text="recordQrcodeStr" :margin="0" :size="300" color-dark="#000" color-light="#fff"/>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogRecordFormShow = false">关 闭</el-button>
<el-button v-print="'#recordPrintTest'" type="primary">打 印</el-button>
</div>
</el-dialog>
<el-dialog v-loading="listLoading" :visible.sync="dialogEditUser" title="批量修改负责人" width="800px">
<el-form
ref="firefightingBatchEditDept"
:model="dialogEditUserForm"
:rules="dialogEditUserRules"
label-width="150px">
<el-row>
<el-form-item label="负责人员" prop="USER_ID">
<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-select>
</el-form-item>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogEditUser = false">取 消</el-button>
<el-button type="primary" @click="dialogEditUserConfirm">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
@ -148,9 +278,7 @@ import waves from '@/directive/waves' // waves directive
import SelectTree from '@/components/SelectTree'
export default {
components: { Pagination, SelectTree, vueQr },
directives: { waves },
data() {
return {
@ -158,7 +286,11 @@ export default {
addBtnType: true,
listLoading: true,
dialogFormShow: false,
qrcodeStr: '',
dialogRecordFormShow: false,
qrcodeStr_jianchama: '',
qrcodeStr_chaxunma: '',
tabsActive: 'horizontal',
recordQrcodeStr: '',
qrInfo: {},
add: false,
del: false,
@ -173,6 +305,9 @@ export default {
KEYWORDS: '',
FIRE_POINT_NAME: '',
FIRE_POINT_CODE: '',
selectForm: {
DEPARTMENT_ID: ''
},
// 树形菜单
filterText: '',
varList: [],
@ -181,7 +316,28 @@ export default {
value: 'id',
children: 'nodes',
label: 'name'
},
editDataIds: [],
dialogEditUser: false,
dialogEditUserForm: {
USER_ID: ''
},
dialogEditUserRules: {
USER_ID: [{ required: true, message: '请选择负责人', trigger: 'change' }]
},
deptTreeData: [],
userList: [],
punctuationStatusList: [
{
value: 0,
label: '是'
},
{
value: 1,
label: '否'
}
],
IS_PUNCTUATION: ''
}
},
watch: {
@ -193,36 +349,44 @@ export default {
created() {
this.getList()
this.hasButton()
this.getTreeData()
},
methods: {
handleShowQr(ROW) {
handleShowNotificationCard(ROW) {
this.dialogFormShow = true
this.qrInfo = ROW
this.qrcodeStr = this.config.weburlWaiwang + 'static/qrcode/views/bsbw/point_list.html?id=' + ROW.FIRE_POINT_ID
// 检查码
this.qrcodeStr_chaxunma = JSON.stringify({
MANAGER_TYPE: 'checkRecordManager',
USER_ID: ROW.USER_ID,
DEPARTMENT_ID: ROW.DEPARTMENT_ID,
FIRE_POINT_ID: ROW.FIRE_POINT_ID
})
// 查询码
this.qrcodeStr_jianchama = JSON.stringify({
MANAGER_TYPE: 'fireListManager',
FIRE_POINT_ID: ROW.FIRE_POINT_ID
})
},
handleEdit(FIRE_POINT_ID) {
this.$parent.FIRE_POINT_ID = FIRE_POINT_ID
this.$parent.activeName = 'Edit'
},
selectable(row, index) {
return row.DEVICE_COUNT == 0
return true
},
getRowKey(row) {
return row.FIRE_POINT_ID
},
// 添加
handleAdd() {
this.$parent.activeName = 'Edit'
this.$parent.FIRE_POINT_ID = ''
this.$parent.FIRE_POINT_CODE = ''
this.$parent.FIRE_POINT_NAME = ''
},
// 搜索
getQuery() {
// this.$refs.multipleTable.clearSelection()
this.getList()
},
// 获取列表
getList(pid) {
this.listLoading = true
this.varList = []
@ -231,7 +395,9 @@ export default {
'/firePoint/list?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
{
FIRE_POINT_NAME: this.FIRE_POINT_NAME,
FIRE_POINT_CODE: this.FIRE_POINT_CODE
FIRE_POINT_CODE: this.FIRE_POINT_CODE,
DEPARTMENT_ID: this.selectForm.DEPARTMENT_ID,
IS_PUNCTUATION: this.IS_PUNCTUATION
}
).then((data) => {
this.listLoading = false
@ -241,9 +407,14 @@ export default {
}).catch((e) => {
this.listLoading = false
})
}, goKeyReset() {
},
goKeyReset() {
this.FIRE_POINT_NAME = ''
this.FIRE_POINT_CODE = ''
this.IS_PUNCTUATION = ''
this.selectForm = {
DEPARTMENT_ID: ''
}
this.getList()
},
getDict() {
@ -283,6 +454,88 @@ export default {
this.listLoading = false
})
},
getTreeData() {
requestFN(
'/department/listTreeV2',
{}
).then((data) => {
this.deptTreeData = JSON.parse(data.zTreeNodes)
}).catch((e) => {
})
},
handleEditUser(row) {
this.editDataIds = []
if (row.FIRE_POINT_ID) {
this.editDataIds.push(row.FIRE_POINT_ID)
} else {
const selection = this.$refs.multipleTable.selection
if (!selection.length > 0) {
this.$message({
type: 'warning',
message: '请选择要修改的数据'
})
return
}
selection.forEach(item => {
this.editDataIds.push(item.FIRE_POINT_ID)
})
}
const selection = this.$refs.multipleTable.selection
const DEPARTMENT_ID = selection[0].DEPARTMENT_ID
if (selection.length > 1) {
let flag = false
selection.forEach(item => {
if (DEPARTMENT_ID !== item.DEPARTMENT_ID) {
this.$message({
type: 'warning',
message: '只能选择同一部门下的数据'
})
flag = true
}
})
if (flag) {
return
}
}
this.getUserList(DEPARTMENT_ID)
this.dialogEditUserForm = {
USER_ID: ''
}
this.dialogEditUser = true
},
getUserList(DEPARTMENT_ID) {
requestFN(
'/user/listAll',
{
DEPARTMENT_ID: DEPARTMENT_ID
}
).then((data) => {
this.userList = data.userList
}).catch((e) => {
})
},
dialogEditUserConfirm() {
this.$refs.firefightingBatchEditDept.validate((valid) => {
if (valid) {
this.listLoading = true
requestFN(
'/firePoint/batchEditFirePointUser',
{
DATA_IDS: this.editDataIds.join(','),
USER_ID: this.dialogEditUserForm.USER_ID
}
).then(() => {
this.$message({
message: '修改成功',
type: 'success'
})
this.dialogEditUser = false
this.getList()
}).catch(() => {
})
}
})
},
handleDelete(row) {
const DATA_IDS = []
if (row.FIRE_POINT_ID) {
@ -296,6 +549,19 @@ export default {
})
return
}
var flag = true
selection.forEach(item => {
if (item.DEVICE_COUNT > 0) {
flag = false
}
})
if (!flag) {
this.$message({
type: 'warning',
message: '选择的点位中有子数据，不能删除'
})
return
}
selection.forEach(item => {
DATA_IDS.push(item.FIRE_POINT_ID)
})
@ -347,15 +613,17 @@ export default {
}
</script>
<style scoped >
<style scoped>
.returnBtn {
float: right;
}
.app-container {
display: flex; /**/
display: flex;
align-items: baseline;
}
.table-qrcode{
.table-qrcode {
text-align: center;
padding-top: 20px;
width: 100%;
@ -365,3 +633,139 @@ export default {
width: 100%
}
</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>