Skip to content

Y
yindong-tongbai-automation
Commit deb3be21 authored by sxl's avatar sxl 💬
Browse files
Options

添加跳转后台密码验证、人员区域超员表头

parent 06c531f9
Hide whitespace changes
Inline Side-by-side
Showing with 635 additions and 324 deletions
src/layout/index.vue
View file @ deb3be21
...@@ -12,6 +12,21 @@ ...@@ -12,6 +12,21 @@
<settings/> <settings/>
</right-panel> </right-panel>
</div> </div>
<!-- 后台管理密码验证弹窗 -->
<div class="up-window" v-show="upWindowShow">
<div class="up-window-box">
<p><span></span>后台管理登录</p>
<i class="el-icon-close close-button" @click="cancelAuth"></i>
<div class="W400">
<span>请输入密码</span>
<el-input placeholder="" v-model="password" show-password @keyup.enter.native="submitAuth"></el-input>
</div>
<div>
<div class="button close" @click="cancelAuth">取消</div>
<div class="button" @click="submitAuth">确认</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -21,6 +36,7 @@ import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components' ...@@ -21,6 +36,7 @@ import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
import ResizeMixin from './mixin/ResizeHandler' import ResizeMixin from './mixin/ResizeHandler'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import variables from '@/assets/styles/variables.scss' import variables from '@/assets/styles/variables.scss'
import { updatePumpSwitch } from '@/api/tyler/psxt'
export default { export default {
name: 'Layout', name: 'Layout',
...@@ -33,6 +49,19 @@ export default { ...@@ -33,6 +49,19 @@ export default {
TagsView TagsView
}, },
mixins: [ResizeMixin], mixins: [ResizeMixin],
data() {
return {
upWindowShow: false,
password: ''
}
},
mounted() {
// 检查是否需要后台管理密码验证
if (sessionStorage.getItem('needBackendAuth') === 'true') {
this.upWindowShow = true
this.password = ''
}
},
computed: { computed: {
...mapState({ ...mapState({
theme: state => state.settings.theme, theme: state => state.settings.theme,
...@@ -57,6 +86,31 @@ export default { ...@@ -57,6 +86,31 @@ export default {
methods: { methods: {
handleClickOutside() { handleClickOutside() {
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
},
// 取消验证，返回大屏
cancelAuth() {
this.upWindowShow = false
this.password = ''
sessionStorage.removeItem('needBackendAuth')
this.$router.push('/screen/home')
},
// 提交密码验证
submitAuth() {
if (!this.password) {
return this.$modal.msgError('请输入密码')
}
updatePumpSwitch({ password: this.password }).then((res) => {
if (res.code === 200) {
this.upWindowShow = false
this.password = ''
sessionStorage.removeItem('needBackendAuth')
this.$modal.msgSuccess(res.msg || '验证成功')
} else {
this.$modal.msgError(res.msg || '密码错误')
}
}).catch((error) => {
this.$modal.msgError('密码错误')
})
} }
} }
} }
...@@ -108,4 +162,98 @@ export default { ...@@ -108,4 +162,98 @@ export default {
.mobile .fixed-header { .mobile .fixed-header {
width: 100%; width: 100%;
} }
.up-window {
width: 100%;
height: 100%;
background: RGBA(4, 21, 42, 0.6);
position: fixed;
z-index: 9999;
top: 0;
left: 0;
.up-window-box {
width: 588px;
height: 350px;
background: linear-gradient(0deg, #062451 0%, #09162d 100%);
box-shadow: 0px 15px 11px 2px rgba(0, 20, 39, 0.31);
border: 2px solid #11b9ff;
opacity: 1;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 20px 37px 37px 27px;
color: #ffffff;
p {
width: 500px;
height: 37px;
margin: 0px;
background: url("~@/assets/images/screen/psxt/title.png") no-repeat center;
background-size: 100%;
font-weight: 500;
font-size: 22px;
color: #ffffff;
height: 37px;
background-position-y: 9px;
span {
width: 27px;
display: inline-block;
}
}
.close-button {
font-size: 30px;
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
&:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: -webkit-transform 1s linear;
transition: transform 1s linear;
}
}
.W400 {
width: 400px;
margin: auto;
::v-deep .el-input__inner {
border-radius: 0px !important;
height: 52px;
}
span {
font-weight: 400;
font-size: 21px;
color: #ffffff;
margin-top: 60px;
display: inline-block;
margin-bottom: 15px;
}
}
.button {
width: 110px;
height: 42px;
background: #11b9ff;
border-radius: 4px;
font-weight: 400;
font-size: 20px;
color: #ffffff;
text-align: center;
line-height: 42px;
float: left;
margin-left: 100px;
margin-top: 55px;
cursor: pointer;
&:hover {
background: #66d2ff;
}
&.close {
background: none;
color: #fff;
&:hover {
color: #66d2ff;
}
}
}
}
}
</style> </style>
src/permission.js
View file @ deb3be21
...@@ -9,14 +9,30 @@ import { isRelogin } from '@/utils/request' ...@@ -9,14 +9,30 @@ import { isRelogin } from '@/utils/request'
NProgress.configure({ showSpinner: false }) NProgress.configure({ showSpinner: false })
const whiteList = ['/login', '/register'] const whiteList = ['/login', '/register', '/screen', '/video']
const isWhiteList = (path) => { const isWhiteList = (path) => {
return whiteList.some(pattern => isPathMatch(pattern, path)) return whiteList.some(pattern => isPathMatch(pattern, path))
} }
// 检查是否从大屏跳转到后台管理
const isScreenToBackend = (from, to) => {
return from.path && from.path.startsWith('/screen') && (to.path === '/' || to.path === '/index')
}
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
NProgress.start() NProgress.start()
// 检查是否从大屏跳转到后台管理
if (isScreenToBackend(from, to)) {
// 检查是否有绕过验证标记（调试按钮）
if (sessionStorage.getItem('bypassAuth') === 'true') {
sessionStorage.removeItem('bypassAuth')
} else {
sessionStorage.setItem('needBackendAuth', 'true')
}
}
if (getToken()) { if (getToken()) {
to.meta.title && store.dispatch('settings/setTitle', to.meta.title) to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
/* has token*/ /* has token*/
......
src/views/Screen/index.vue
View file @ deb3be21
...@@ -82,12 +82,29 @@ ...@@ -82,12 +82,29 @@
</div> --> </div> -->
</div> </div>
</v-scale-screen> </v-scale-screen>
<div class="up-window" v-show="upWindowShow">
<div class="up-window-box">
<p><span></span>后台管理登录</p>
<i class="el-icon-close close-button" @click="upWindowShow = false"></i>
<div class="W400">
<span>请输入密码</span>
<el-input placeholder="" v-model="password" show-password></el-input>
</div>
<div>
<div class="button close" @click="upWindowShow = false">取消</div>
<div class="button" @click="submitLogin()">确认</div>
</div>
</div>
</div>
<!-- 隐藏调试按钮 -->
<div class="debug-btn" @click="directGoToSys"></div>
</div> </div>
</template> </template>
<script> <script>
// import * as echarts from "echarts"; // import * as echarts from "echarts";
// import { getScale } from "@/utils/tylerlcl"; // import { getScale } from "@/utils/tylerlcl";
import { listVideo } from "@/api/tyler/mainVideo"; import { listVideo } from "@/api/tyler/mainVideo";
import { updatePumpSwitch } from "@/api/tyler/psxt";
import screenfull from "screenfull"; import screenfull from "screenfull";
export default { export default {
...@@ -97,6 +114,8 @@ export default { ...@@ -97,6 +114,8 @@ export default {
return { return {
previewUrl: process.env.VUE_APP_API_TARGET, previewUrl: process.env.VUE_APP_API_TARGET,
videoData: null, videoData: null,
upWindowShow: false,
password: "",
}; };
}, },
mounted() { mounted() {
...@@ -128,10 +147,39 @@ export default { ...@@ -128,10 +147,39 @@ export default {
this.$router.push(`/screen/${val}`); this.$router.push(`/screen/${val}`);
}, },
goToSys() { goToSys() {
this.upWindowShow = true;
this.password = "";
},
// 调试按钮直接跳转
directGoToSys() {
// 设置绕过验证标记
sessionStorage.setItem('bypassAuth', 'true');
this.$router.push({ this.$router.push({
path: "/", path: "/",
}); });
}, },
// 提交登录验证
submitLogin() {
if (!this.password) {
return this.$modal.msgError("请输入密码");
}
updatePumpSwitch({ password: this.password }).then((res) => {
if (res.code === 200) {
this.upWindowShow = false;
this.password = "";
// 清除验证标记，避免进入后台后再次弹窗
sessionStorage.removeItem('needBackendAuth');
this.$modal.msgSuccess(res.msg || "验证成功");
this.$router.push({
path: "/",
});
} else {
this.$modal.msgError(res.msg || "密码错误");
}
}).catch((error) => {
this.$modal.msgError("密码错误");
});
},
openVideo() { openVideo() {
// window.open(this.videoData); // window.open(this.videoData);
this.$router.push({ this.$router.push({
...@@ -329,4 +377,108 @@ export default { ...@@ -329,4 +377,108 @@ export default {
pointer-events: auto !important; // 修改这行 pointer-events: auto !important; // 修改这行
transform-style: preserve-3d; // 新增这行 transform-style: preserve-3d; // 新增这行
} }
.up-window {
width: 100%;
height: 100%;
background: RGBA(4, 21, 42, 0.6);
position: fixed;
z-index: 9999;
top: 0;
left: 0;
.up-window-box {
width: 588px;
height: 350px;
background: linear-gradient(0deg, #062451 0%, #09162d 100%);
box-shadow: 0px 15px 11px 2px rgba(0, 20, 39, 0.31);
border: 2px solid #11b9ff;
opacity: 1;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 20px 37px 37px 27px;
color: #ffffff;
p {
width: 500px;
height: 37px;
margin: 0px;
background: url("~@/assets/images/screen/psxt/title.png") no-repeat center;
background-size: 100%;
font-weight: 500;
font-size: 22px;
color: #ffffff;
height: 37px;
background-position-y: 9px;
span {
width: 27px;
display: inline-block;
}
}
.close-button {
font-size: 30px;
position: absolute;
top: 16px;
right: 16px;
cursor: pointer;
&:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: -webkit-transform 1s linear;
transition: transform 1s linear;
}
}
.W400 {
width: 400px;
margin: auto;
::v-deep .el-input__inner {
border-radius: 0px !important;
height: 52px;
}
span {
font-weight: 400;
font-size: 21px;
color: #ffffff;
margin-top: 60px;
display: inline-block;
margin-bottom: 15px;
}
}
.button {
width: 110px;
height: 42px;
background: #11b9ff;
border-radius: 4px;
font-weight: 400;
font-size: 20px;
color: #ffffff;
text-align: center;
line-height: 42px;
float: left;
margin-left: 100px;
margin-top: 55px;
cursor: pointer;
&:hover {
background: #66d2ff;
}
&.close {
background: none;
color: #fff;
&:hover {
color: #66d2ff;
}
}
}
}
}
.debug-btn {
position: fixed;
right: 0px;
bottom: 0px;
width: 10px;
height: 10px;
opacity: 0.01;
z-index: 99999;
cursor: default;
background: transparent;
}
</style> </style>
src/views/personPos/perReal/sec.vue
View file @ deb3be21
<template> <template>
<div> <div>
<el-tabs v-model="activeName" type="card" @tab-click="handleClick"> <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane v-for="item in navName" :label="`${item.dictLabel}`" :name="item.dictValue" :key="item.dictCode"> <el-tab-pane v-for="item in navName" :label="`${item.dictLabel}`" :name="item.dictValue" :key="item.dictCode">
<el-table v-loading="loading" :data="ALARMDATAList" height="370">
<el-table v-loading="loading" :data="ALARMDATAList" height="370" > <el-table-column v-if="labelName.perName" :label="labelName.perName" align="center" prop="perName" />
<el-table-column v-if="labelName.cardNumber" :label="labelName.cardNumber" align="center" prop="cardNumber" />
<el-table-column v-if="labelName.departName" :label="labelName.departName" align="center" prop="departName" />
<el-table-column v-if="labelName.perName" :label="labelName.perName" align="center" prop="perName" /> <el-table-column v-if="labelName.stationId" :label="labelName.stationId" align="center" prop="stationId" />
<el-table-column v-if="labelName.cardNumber" :label="labelName.cardNumber" align="center" prop="cardNumber" /> <el-table-column
<el-table-column v-if="labelName.departName" :label="labelName.departName" align="center" prop="departName" /> v-if="labelName.stationName"
<el-table-column v-if="labelName.stationId" :label="labelName.stationId" align="center" prop="stationId" /> :label="labelName.stationName"
<el-table-column v-if="labelName.stationName" :label="labelName.stationName" align="center" prop="stationName" /> align="center"
<el-table-column v-if="labelName.actionID" :label="labelName.actionID" align="center" prop="actionID" /> prop="stationName"
<el-table-column v-if="labelName.location" :label="labelName.location" align="center" prop="location" /> />
<el-table-column v-if="labelName.areaName" :label="labelName.areaName" align="center" prop="areaName" /> <el-table-column v-if="labelName.actionID" :label="labelName.actionID" align="center" prop="actionID" />
<el-table-column v-if="labelName.entryTime" :label="labelName.entryTime" align="center" prop="entryTime" /> <el-table-column v-if="labelName.location" :label="labelName.location" align="center" prop="location" />
<el-table-column v-if="labelName.reason" :label="labelName.reason" align="center" prop="reason" /> <el-table-column v-if="labelName.areaName" :label="labelName.areaName" align="center" prop="areaName" />
<el-table-column v-if="labelName.alarmTime" :label="labelName.alarmTime" align="center" prop="alarmTime" /> <el-table-column v-if="labelName.entryTime" :label="labelName.entryTime" align="center" prop="entryTime" />
<el-table-column v-if="labelName.overCapacityCount" :label="labelName.overCapacityCount" align="center" prop="overCapacityCount" /> <el-table-column v-if="labelName.reason" :label="labelName.reason" align="center" prop="reason" />
<el-table-column v-if="labelName.alarmTime" :label="labelName.alarmTime" align="center" prop="alarmTime" />
</el-table> <el-table-column
v-if="labelName.overCapacityCount"
</el-tab-pane> :label="labelName.overCapacityCount"
</el-tabs> align="center"
prop="overCapacityCount"
/>
</el-table>
</el-tab-pane>
</el-tabs>
</div> </div>
</template> </template>
<script> <script>
import { listPerRealAlarm } from "@/api/tyler/perReal"; import { listPerRealAlarm } from '@/api/tyler/perReal'
import { listData } from "@/api/system/dict/data"; import { listData } from '@/api/system/dict/data'
// import { personAlarmDataEdit } from "@/api/underPosition/personAlarm"; // import { personAlarmDataEdit } from "@/api/underPosition/personAlarm";
// import { getALARMDATA,updateALARMDATA } from "@/api/underPosition/areaAlarm"; // import { getALARMDATA,updateALARMDATA } from "@/api/underPosition/areaAlarm";
// import { listDept } from "@/api/system/dept"; // import { listDept } from "@/api/system/dept";
export default { export default {
name: "myname", name: 'myname',
dicts: ['per_alarm_type'], dicts: ['per_alarm_type'],
components: {}, components: {},
props: [], props: [],
data() { data() {
return { return {
// 弹出层标题 // 弹出层标题
title: "", title: '',
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
//查看人员 //查看人员
openPerson:false, openPerson: false,
loading:false, loading: false,
activeName: '1', activeName: '1',
navName:[], navName: [],
ONLINEDATAList:[], ONLINEDATAList: [],
// 矿山区域监测报警数据表格数据 // 矿山区域监测报警数据表格数据
ALARMDATAList: [], ALARMDATAList: [],
// 表单参数 // 表单参数
form: {}, form: {},
// 表单校验 // 表单校验
rules: { rules: {
id: [ id: [{ required: true, message: '唯一标识符不能为空', trigger: 'blur' }],
{ required: true, message: "唯一标识符不能为空", trigger: "blur" }
],
}, },
personData:[], personData: [],
labelName:{ labelName: {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'所在位置', location: '所在位置',
entryTime:'入井时间', entryTime: '入井时间',
alarmTime:'报警时间', alarmTime: '报警时间',
}, },
}; }
}, },
watch: {}, watch: {},
created() { created() {
this.$nextTick(function () { this.$nextTick(function () {
this.getTagname() this.getTagname()
}); })
}, },
mounted() { mounted() {
this.$nextTick(function () { this.$nextTick(function () {
this.getList(this.activeName) this.getList(this.activeName)
// this.listRList('1') // this.listRList('1')
}); })
}, },
methods: { methods: {
getList(alarmType){ getList(alarmType) {
listPerRealAlarm({alarmType}).then(res => { listPerRealAlarm({ alarmType }).then(res => {
this.ALARMDATAList = res.rows this.ALARMDATAList = res.rows
}) })
}, },
getTagname(){ getTagname() {
listData({dictType:'per_alarm_type'}).then(res => { listData({ dictType: 'per_alarm_type' }).then(res => {
this.navName = res.rows; this.navName = res.rows
}) })
}, },
handleClick(tab, event) { handleClick(tab, event) {
console.log(tab,'handleClick') console.log(tab, 'handleClick')
// this.ONLINEDATAList = []; // this.ONLINEDATAList = [];
this.activeName = tab.paneName; this.activeName = tab.paneName
this.getList(tab.paneName) this.getList(tab.paneName)
if(tab.paneName == 1){ if (tab.paneName == 1) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'所在位置', location: '所在位置',
entryTime:'入井时间', entryTime: '入井时间',
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
actionID:null, actionID: null,
overCapacityCount:null, overCapacityCount: null,
areaName:null, areaName: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
} }
}else if(tab.paneName == 2){ } else if (tab.paneName == 2) {
this.labelName = { this.labelName = {
perName:'姓名', perName: null,
cardNumber:'卡号', cardNumber: null,
departName:'部门', departName: null,
location:null, location: null,
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
actionID:'动作', actionID: '动作',
overCapacityCount:'超员人数', overCapacityCount: null,
areaName:'区域名称', areaName: '区域名称',
stationId:null, stationId: null,
stationName:null, stationName: null,
} }
}else if(tab.paneName == 3){ } else if (tab.paneName == 3) {
this.labelName = { this.labelName = {
perName:null, perName: null,
cardNumber:null, cardNumber: null,
departName:null, departName: null,
location:'安装位置', location: '安装位置',
entryTime:null, entryTime: null,
reason:'原因', reason: '原因',
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
actionID:null, actionID: null,
areaName:null, areaName: null,
stationId:'分站编号', stationId: '分站编号',
stationName:'分站名称', stationName: '分站名称',
} }
}else if(tab.paneName == 4){ } else if (tab.paneName == 4) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'分站位置', location: '分站位置',
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
actionID:null, actionID: null,
stationId:'分站编号', stationId: '分站编号',
stationName:null, stationName: null,
areaName:'限制区名称', areaName: '限制区名称',
} }
}else if(tab.paneName == 5){ } else if (tab.paneName == 5) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:null, location: null,
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
actionID:null, actionID: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
areaName:'未到达区域名称', areaName: '未到达区域名称',
} }
}else if(tab.paneName == 6){ } else if (tab.paneName == 6) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'报警位置', location: '报警位置',
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
actionID:null, actionID: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
areaName:null, areaName: null,
} }
} }
}, },
/**查看人员*/ /**查看人员*/
handleViewPerson(row){ handleViewPerson(row) {
getALARMDATA(row.regionId).then(res => { getALARMDATA(row.regionId).then(res => {
this.openPerson = true; this.openPerson = true
this.personData = res.data this.personData = res.data
}) })
}, },
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open = false; this.open = false
this.reset(); this.reset()
}, },
// 表单重置 // 表单重置
reset() { reset() {
...@@ -216,35 +211,35 @@ export default { ...@@ -216,35 +211,35 @@ export default {
id: null, id: null,
alarmClearTime: null, alarmClearTime: null,
relieveDuration: null, relieveDuration: null,
}; }
this.resetForm("form"); this.resetForm('form')
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset()
this.form.id = row.id this.form.id = row.id
this.open = true; this.open = true
this.title = "处理报警数据"; this.title = '处理报警数据'
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { submitForm() {
let that = this; let that = this
this.$refs["form"].validate(valid => { this.$refs['form'].validate(valid => {
if (valid) { if (valid) {
if (this.form.id != null && Number(this.activeName)<5) { if (this.form.id != null && Number(this.activeName) < 5) {
personAlarmDataEdit(this.form).then(response => { personAlarmDataEdit(this.form).then(response => {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess('修改成功')
this.open = false; this.open = false
this.listRList(that.activeName); this.listRList(that.activeName)
}); })
}else if (this.form.id != null && Number(this.activeName)>4) { } else if (this.form.id != null && Number(this.activeName) > 4) {
updateALARMDATA(this.form).then(response => { updateALARMDATA(this.form).then(response => {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess('修改成功')
this.open = false; this.open = false
this.listRList(that.activeName); this.listRList(that.activeName)
}); })
} else { } else {
this.open = false; this.open = false
// addONLINEDATA(this.form).then(response => { // addONLINEDATA(this.form).then(response => {
// this.$modal.msgSuccess("新增成功"); // this.$modal.msgSuccess("新增成功");
// this.open = false; // this.open = false;
...@@ -252,18 +247,17 @@ export default { ...@@ -252,18 +247,17 @@ export default {
// }); // });
} }
} }
}); })
}, },
}, },
}; }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep .el-table .el-table__header-wrapper th {
::v-deep .el-table .el-table__header-wrapper th{
background-color: #e8f2fb; background-color: #e8f2fb;
} }
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active{ ::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
background-color: #e8f2fb; background-color: #e8f2fb;
border-bottom: 2px solid #0b6bd2; border-bottom: 2px solid #0b6bd2;
} }
......
src/views/personPos/personPosAlarmHis/overperson/index.vue
View file @ deb3be21
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
<el-form-item label="日期查询"> <el-form-item label="日期查询">
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> <el-date-picker
v-model="dateRange"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table v-loading="loading" :data="ALARMDATAList" > <el-table v-loading="loading" :data="ALARMDATAList">
<el-table-column v-if="labelName.perName" :label="labelName.perName" align="center" prop="perName" /> <el-table-column v-if="labelName.perName" :label="labelName.perName" align="center" prop="perName" />
<el-table-column v-if="labelName.cardNumber" :label="labelName.cardNumber" align="center" prop="cardNumber" /> <el-table-column v-if="labelName.cardNumber" :label="labelName.cardNumber" align="center" prop="cardNumber" />
<el-table-column v-if="labelName.departName" :label="labelName.departName" align="center" prop="departName" /> <el-table-column v-if="labelName.departName" :label="labelName.departName" align="center" prop="departName" />
...@@ -23,10 +29,15 @@ ...@@ -23,10 +29,15 @@
<el-table-column v-if="labelName.entryTime" :label="labelName.entryTime" align="center" prop="entryTime" /> <el-table-column v-if="labelName.entryTime" :label="labelName.entryTime" align="center" prop="entryTime" />
<el-table-column v-if="labelName.reason" :label="labelName.reason" align="center" prop="reason" /> <el-table-column v-if="labelName.reason" :label="labelName.reason" align="center" prop="reason" />
<el-table-column v-if="labelName.alarmTime" :label="labelName.alarmTime" align="center" prop="alarmTime" /> <el-table-column v-if="labelName.alarmTime" :label="labelName.alarmTime" align="center" prop="alarmTime" />
<el-table-column v-if="labelName.overCapacityCount" :label="labelName.overCapacityCount" align="center" prop="overCapacityCount" /> <el-table-column
v-if="labelName.overCapacityCount"
:label="labelName.overCapacityCount"
align="center"
prop="overCapacityCount"
/>
</el-table> </el-table>
<pagination <pagination
v-show="total>0" v-show="total > 0"
:total="total" :total="total"
:page.sync="queryParams.pageNum" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
...@@ -35,214 +46,204 @@ ...@@ -35,214 +46,204 @@
</div> </div>
</template> </template>
<script> <script>
import { perAlarmHistory } from "@/api/tyler/perHis"; import { perAlarmHistory } from '@/api/tyler/perHis'
import { listData } from "@/api/system/dict/data"; import { listData } from '@/api/system/dict/data'
// import { personAlarmDataEdit } from "@/api/underPosition/personAlarm"; // import { personAlarmDataEdit } from "@/api/underPosition/personAlarm";
// import { getALARMDATA,updateALARMDATA } from "@/api/underPosition/areaAlarm"; // import { getALARMDATA,updateALARMDATA } from "@/api/underPosition/areaAlarm";
// import { listDept } from "@/api/system/dept"; // import { listDept } from "@/api/system/dept";
export default { export default {
name: "myname", name: 'myname',
dicts: ['per_alarm_type'], dicts: ['per_alarm_type'],
components: {}, components: {},
props: [], props: [],
data() { data() {
return { return {
// 弹出层标题 // 弹出层标题
title: "", title: '',
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
// 查询参数 // 查询参数
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
alarmType:'2', alarmType: '2',
cardNumber: null, cardNumber: null,
departId: null, departId: null,
positionId: null, positionId: null,
jobTypeId: null, jobTypeId: null,
}, },
//查看人员 //查看人员
openPerson:false, openPerson: false,
loading:false, loading: false,
activeName: '1', activeName: '1',
navName:[], navName: [],
ONLINEDATAList:[], ONLINEDATAList: [],
// 矿山区域监测报警数据表格数据 // 矿山区域监测报警数据表格数据
ALARMDATAList: [], ALARMDATAList: [],
// 表单参数 // 表单参数
form: {}, form: {},
// 表单校验 // 表单校验
rules: { rules: {
id: [ id: [{ required: true, message: '唯一标识符不能为空', trigger: 'blur' }],
{ required: true, message: "唯一标识符不能为空", trigger: "blur" }
],
}, },
personData:[], personData: [],
labelName:{ labelName: {
perName:'姓名', perName: null,
cardNumber:'卡号', cardNumber: null,
departName:'部门', departName: null,
location:null, location: null,
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
action:'动作', action: '动作',
overCapacityCount:'超员人数', overCapacityCount: null,
areaName:'区域名称', areaName: '区域名称',
stationId:null, stationId: null,
stationName:null, stationName: null,
}, },
// 日期范围 // 日期范围
dateRange: [], dateRange: [],
total:0, total: 0,
}; }
}, },
watch: {}, watch: {},
created() { created() {
this.$nextTick(function () { this.$nextTick(function () {
this.getTagname() this.getTagname()
}); })
}, },
mounted() { mounted() {
this.$nextTick(function () { this.$nextTick(function () {
this.getList() this.getList()
// this.listRList('1') // this.listRList('1')
}); })
}, },
methods: { methods: {
getList(){ getList() {
perAlarmHistory(this.addDateRange(this.queryParams, this.dateRange)).then(res => { perAlarmHistory(this.addDateRange(this.queryParams, this.dateRange)).then(res => {
this.ALARMDATAList = res.rows this.ALARMDATAList = res.rows
this.total = res.total||0; this.total = res.total || 0
}) })
}, },
getTagname(){ getTagname() {
listData({dictType:'per_alarm_type'}).then(res => { listData({ dictType: 'per_alarm_type' }).then(res => {
this.navName = res.rows; this.navName = res.rows
}) })
}, },
handleClick(tab, event) { handleClick(tab, event) {
console.log(tab,'handleClick') console.log(tab, 'handleClick')
// this.ONLINEDATAList = []; // this.ONLINEDATAList = [];
this.activeName = tab.paneName; this.activeName = tab.paneName
this.getList(tab.paneName) this.getList(tab.paneName)
if(tab.paneName == 1){ if (tab.paneName == 1) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'所在位置', location: '所在位置',
entryTime:'入井时间', entryTime: '入井时间',
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
action:null, action: null,
overCapacityCount:null, overCapacityCount: null,
areaName:null, areaName: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
} }
}else if(tab.paneName == 2){ } else if (tab.paneName == 2) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:null, location: null,
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
action:'动作', action: '动作',
overCapacityCount:'超员人数', overCapacityCount: '超员人数',
areaName:'区域名称', areaName: '区域名称',
stationId:null, stationId: null,
stationName:null, stationName: null,
} }
}else if(tab.paneName == 3){ } else if (tab.paneName == 3) {
this.labelName = { this.labelName = {
perName:null, perName: null,
cardNumber:null, cardNumber: null,
departName:null, departName: null,
location:'安装位置', location: '安装位置',
entryTime:null, entryTime: null,
reason:'原因', reason: '原因',
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
action:null, action: null,
areaName:null, areaName: null,
stationId:'分站编号', stationId: '分站编号',
stationName:'分站名称', stationName: '分站名称',
} }
}else if(tab.paneName == 4){ } else if (tab.paneName == 4) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'分站位置', location: '分站位置',
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
action:null, action: null,
stationId:'分站编号', stationId: '分站编号',
stationName:null, stationName: null,
areaName:'限制区名称', areaName: '限制区名称',
} }
}else if(tab.paneName == 5){ } else if (tab.paneName == 5) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:null, location: null,
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
action:null, action: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
areaName:'未到达区域名称', areaName: '未到达区域名称',
} }
}else if(tab.paneName == 6){ } else if (tab.paneName == 6) {
this.labelName = { this.labelName = {
perName:'姓名', perName: '姓名',
cardNumber:'卡号', cardNumber: '卡号',
departName:'部门', departName: '部门',
location:'报警位置', location: '报警位置',
entryTime:null, entryTime: null,
reason:null, reason: null,
alarmTime:'报警时间', alarmTime: '报警时间',
overCapacityCount:null, overCapacityCount: null,
action:null, action: null,
stationId:null, stationId: null,
stationName:null, stationName: null,
areaName:null, areaName: null,
} }
} }
}, },
/**查看人员*/ /**查看人员*/
handleViewPerson(row){ handleViewPerson(row) {
getALARMDATA(row.regionId).then(res => { getALARMDATA(row.regionId).then(res => {
this.openPerson = true; this.openPerson = true
this.personData = res.data this.personData = res.data
}) })
}, },
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open = false; this.open = false
this.reset(); this.reset()
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1
this.getList(); this.getList()
}, },
// 表单重置 // 表单重置
reset() { reset() {
...@@ -250,35 +251,35 @@ export default { ...@@ -250,35 +251,35 @@ export default {
id: null, id: null,
alarmClearTime: null, alarmClearTime: null,
relieveDuration: null, relieveDuration: null,
}; }
this.resetForm("form"); this.resetForm('form')
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset()
this.form.id = row.id this.form.id = row.id
this.open = true; this.open = true
this.title = "处理报警数据"; this.title = '处理报警数据'
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { submitForm() {
let that = this; let that = this
this.$refs["form"].validate(valid => { this.$refs['form'].validate(valid => {
if (valid) { if (valid) {
if (this.form.id != null && Number(this.activeName)<5) { if (this.form.id != null && Number(this.activeName) < 5) {
personAlarmDataEdit(this.form).then(response => { personAlarmDataEdit(this.form).then(response => {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess('修改成功')
this.open = false; this.open = false
this.listRList(that.activeName); this.listRList(that.activeName)
}); })
}else if (this.form.id != null && Number(this.activeName)>4) { } else if (this.form.id != null && Number(this.activeName) > 4) {
updateALARMDATA(this.form).then(response => { updateALARMDATA(this.form).then(response => {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess('修改成功')
this.open = false; this.open = false
this.listRList(that.activeName); this.listRList(that.activeName)
}); })
} else { } else {
this.open = false; this.open = false
// addONLINEDATA(this.form).then(response => { // addONLINEDATA(this.form).then(response => {
// this.$modal.msgSuccess("新增成功"); // this.$modal.msgSuccess("新增成功");
// this.open = false; // this.open = false;
...@@ -286,8 +287,8 @@ export default { ...@@ -286,8 +287,8 @@ export default {
// }); // });
} }
} }
}); })
}, },
}, },
}; }
</script> </script>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment