大屏问题修复

dev_xd
haha 2025-04-15 00:53:18 +08:00
parent 5e838368cb
commit 85e5da3405
8 changed files with 2099 additions and 2187 deletions

View File

@ -3,95 +3,69 @@
<el-row> <el-row>
<el-col :span="8"> <el-col :span="8">
<div class="head-title-tab"> <div class="head-title-tab">
<div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)"></div> <div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)" v-if="1==2"></div>
<div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)"></div> <div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)"></div>
<div :class="(nav >= 300 && nav < 400) || nav == 3 ? 'head-nav active' : 'head-nav'" <div :class="(nav >= 300 && nav < 400) || nav == 3 ? 'head-nav active' : 'head-nav'" style="position: relative;" class="has-submenu">
style="position: relative;" class="has-submenu">
<div @click="doNav(3)"></div> <div @click="doNav(3)"></div>
<div class="header-btn-list"> <div class="header-btn-list">
<div class="header-btn-list-arrow"></div> <div class="header-btn-list-arrow"></div>
<div class="header-btn-list-item" style=""> <div class="header-btn-list-item" style>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 301 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 301 ? 'active' : ''" class="sub-btn" @click="doNav(301)"></button>
@click="doNav(301)">安全隐患排查</button> <button type="button" :class="nav == 302 ? 'active' : ''" class="sub-btn" @click="doNav(302)"></button>
<button type="button" :class="nav == 302 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 303 ? 'active' : ''" class="sub-btn" @click="doNav(303)"></button>
@click="doNav(302)">教育培训</button> <button type="button" :class="nav == 304 ? 'active' : ''" class="sub-btn" @click="doNav(304)"></button>
<button type="button" :class="nav == 303 ? 'active' : ''" class="sub-btn"
@click="doNav(303)">基坑监测</button>
<button type="button" :class="nav == 304 ? 'active' : ''" class="sub-btn"
@click="doNav(304)">塔基监测</button>
</div> </div>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 305 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 305 ? 'active' : ''" class="sub-btn" @click="doNav(305)"></button>
@click="doNav(305)">高支模监测</button> <button type="button" :class="nav == 306 ? 'active' : ''" class="sub-btn" @click="doNav(306)"></button>
<button type="button" :class="nav == 306 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 307 ? 'active' : ''" class="sub-btn" @click="doNav(307)"></button>
@click="doNav(306)">配电箱监测</button> <button type="button" :class="nav == 308 ? 'active' : ''" class="sub-btn" @click="doNav(308)"></button>
<button type="button" :class="nav == 307 ? 'active' : ''" class="sub-btn"
@click="doNav(307)">爬架监测</button>
<button type="button" :class="nav == 308 ? 'active' : ''" class="sub-btn"
@click="doNav(308)">施工电梯监测</button>
</div> </div>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 309 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 309 ? 'active' : ''" class="sub-btn" @click="doNav(309)"></button>
@click="doNav(309)">视频监控</button> <button type="button" :class="nav == 310 ? 'active' : ''" class="sub-btn" @click="doNav(310)">AI</button>
<button type="button" :class="nav == 310 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 311 ? 'active' : ''" class="sub-btn" @click="doNav(311)"></button>
@click="doNav(310)">AI测控</button>
<button type="button" :class="nav == 311 ? 'active' : ''" class="sub-btn"
@click="doNav(311)">标准化管理</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div :class="(nav >= 400 && nav < 500) || nav == 4 ? 'head-nav active' : 'head-nav'" <div :class="(nav >= 400 && nav < 500) || nav == 4 ? 'head-nav active' : 'head-nav'" style="position: relative;" class="has-submenu">
style="position: relative;" class="has-submenu">
<div @click="doNav(4)"></div> <div @click="doNav(4)"></div>
<div class="header-btn-list"> <div class="header-btn-list">
<div class="header-btn-list-arrow"></div> <div class="header-btn-list-arrow"></div>
<div class="header-btn-list-item" style=""> <div class="header-btn-list-item" style>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 401 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 401 ? 'active' : ''" class="sub-btn" @click="doNav(401)"></button>
@click="doNav(401)">质量隐患排查</button> <button type="button" :class="nav == 402 ? 'active' : ''" class="sub-btn" @click="doNav(402)"></button>
<button type="button" :class="nav == 402 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 403 ? 'active' : ''" class="sub-btn" @click="doNav(403)"></button>
@click="doNav(402)">材料取样复试</button> <button type="button" :class="nav == 404 ? 'active' : ''" class="sub-btn" @click="doNav(404)"></button>
<button type="button" :class="nav == 403 ? 'active' : ''" class="sub-btn"
@click="doNav(403)">举牌验收</button>
<button type="button" :class="nav == 404 ? 'active' : ''" class="sub-btn"
@click="doNav(404)">标养室监测</button>
</div> </div>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 405 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 405 ? 'active' : ''" class="sub-btn" @click="doNav(405)"></button>
@click="doNav(405)">标准化管理</button> <button type="button" :class="nav == 406 ? 'active' : ''" class="sub-btn" @click="doNav(406)"></button>
<button type="button" :class="nav == 406 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 407 ? 'active' : ''" class="sub-btn" @click="doNav(407)"></button>
@click="doNav(406)">混泥土监测</button> <button type="button" :class="nav == 408 ? 'active' : ''" class="sub-btn" @click="doNav(408)"></button>
<button type="button" :class="nav == 407 ? 'active' : ''" class="sub-btn"
@click="doNav(407)">爬架监测</button>
<button type="button" :class="nav == 408 ? 'active' : ''" class="sub-btn"
@click="doNav(408)">施工电梯监测</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div :class="(nav >= 500 && nav < 600) || nav == 5 ? 'head-nav active' : 'head-nav'" <div :class="(nav >= 500 && nav < 600) || nav == 5 ? 'head-nav active' : 'head-nav'" style="position: relative;" class="has-submenu">
style="position: relative;" class="has-submenu">
<div @click="doNav(5)"></div> <div @click="doNav(5)"></div>
<div class="header-btn-list"> <div class="header-btn-list">
<div class="header-btn-list-arrow"></div> <div class="header-btn-list-arrow"></div>
<div class="header-btn-list-item" style=""> <div class="header-btn-list-item" style>
<div class="header-btn-list-padding menu-row1" style="text-align: left;"> <div class="header-btn-list-padding menu-row1" style="text-align: left;">
<button type="button" :class="nav == 5 ? 'active' : ''" class="sub-btn" <button type="button" :class="nav == 5 ? 'active' : ''" class="sub-btn" @click="doNav(5)"></button>
@click="doNav(5)">进度管理</button> <button type="button" :class="nav == 501 ? 'active' : ''" class="sub-btn" @click="doNav(501)"></button>
<button type="button" :class="nav == 501 ? 'active' : ''" class="sub-btn"
@click="doNav(501)">延时摄影</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="8" class="header-center"> <el-col :span="8" class="header-center">
<img class="prj-logo" :src="selProject.setting.orgLogo" <img class="prj-logo" :src="selProject.setting.orgLogo" v-if="selProject && selProject.setting && selProject.setting.orgLogo" />
v-if="selProject && selProject.setting && selProject.setting.orgLogo" />
{{ selProject?.setting?.orgName || '数字建安施工管理平台' }} {{ selProject?.setting?.orgName || '数字建安施工管理平台' }}
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
@ -99,31 +73,43 @@
<div :class="nav == 6 ? 'head-nav active' : 'head-nav'" @click="doNav(6)">绿</div> <div :class="nav == 6 ? 'head-nav active' : 'head-nav'" @click="doNav(6)">绿</div>
</div> </div>
<div class="header-title-user-info" style="display:inline-block;float:right;"> <div class="header-title-user-info" style="display:inline-block;float:right;">
<el-select v-model="selProjectId" popper-class="header-sel-project-pop" <el-select v-model="selProjectId" popper-class="header-sel-project-pop" style="width: 150px;margin-right: 20px;height:30px;line-height: 30px;" @change="doProjectSelect">
style="width: 150px;margin-right: 20px;height:30px;line-height: 30px;" <el-option v-for="it in projects" :key="it.id" :label="it.projectName" :value="it.id"></el-option>
@change="doProjectSelect">
<el-option v-for="it in projects" :key="it.id" :label="it.projectName"
:value="it.id"></el-option>
</el-select> </el-select>
<span class="command" @click="doLogout">{{ nickName }} <span class="command" @click="doLogout">
{{ nickName }}
<i class="el-icon-switch-button"></i> <i class="el-icon-switch-button"></i>
</span> </span>
</div> </div>
<i class="set-fullscreen set-font-size" <i class="set-fullscreen set-font-size" style="margin-left: 16px;position: absolute;top: 0px;right: 24px;" @click="toggleFullScreen">
style="margin-left: 16px;position: absolute;top: 0px;right: 24px;" @click="toggleFullScreen"> <svg
<svg class="icon" v-if="!isFullScreen" class="icon"
v-if="!isFullScreen"
style="width: 20px; vertical-align: middle;fill: currentColor;overflow: hidden;" style="width: 20px; vertical-align: middle;fill: currentColor;overflow: hidden;"
viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3304"> viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="3304"
>
<path <path
d="M145.066667 85.333333h153.6c25.6 0 42.666667-17.066667 42.666666-42.666666S324.266667 0 298.666667 0H34.133333C25.6 0 17.066667 8.533333 8.533333 17.066667 0 25.6 0 34.133333 0 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666666s42.666667-17.066667 42.666666-42.666666V145.066667l230.4 230.4c17.066667 17.066667 42.666667 17.066667 59.733334 0 17.066667-17.066667 17.066667-42.666667 0-59.733334L145.066667 85.333333z m170.666666 563.2L162.133333 802.133333l-76.8 76.8V725.333333C85.333333 699.733333 68.266667 682.666667 42.666667 682.666667s-42.666667 17.066667-42.666667 42.666666v256c0 25.6 17.066667 42.666667 42.666667 42.666667h256c25.6 0 42.666667-17.066667 42.666666-42.666667s-17.066667-42.666667-42.666666-42.666666H145.066667l76.8-76.8 153.6-153.6c17.066667-17.066667 17.066667-42.666667 0-59.733334-17.066667-17.066667-42.666667-17.066667-59.733334 0z m665.6 34.133334c-25.6 0-42.666667 17.066667-42.666666 42.666666v153.6l-76.8-76.8-153.6-153.6c-17.066667-17.066667-42.666667-17.066667-59.733334 0-17.066667 17.066667-17.066667 42.666667 0 59.733334l153.6 153.6 76.8 76.8H725.333333c-25.6 0-42.666667 17.066667-42.666666 42.666666s17.066667 42.666667 42.666666 42.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666666z m0-682.666667h-256c-25.6 0-42.666667 17.066667-42.666666 42.666667s17.066667 42.666667 42.666666 42.666666h153.6l-76.8 76.8-153.6 153.6c-17.066667 17.066667-17.066667 42.666667 0 59.733334 17.066667 17.066667 42.666667 17.066667 59.733334 0l153.6-153.6 76.8-76.8v153.6c0 25.6 17.066667 42.666667 42.666666 42.666666s42.666667-17.066667 42.666667-42.666666v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z" d="M145.066667 85.333333h153.6c25.6 0 42.666667-17.066667 42.666666-42.666666S324.266667 0 298.666667 0H34.133333C25.6 0 17.066667 8.533333 8.533333 17.066667 0 25.6 0 34.133333 0 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666666s42.666667-17.066667 42.666666-42.666666V145.066667l230.4 230.4c17.066667 17.066667 42.666667 17.066667 59.733334 0 17.066667-17.066667 17.066667-42.666667 0-59.733334L145.066667 85.333333z m170.666666 563.2L162.133333 802.133333l-76.8 76.8V725.333333C85.333333 699.733333 68.266667 682.666667 42.666667 682.666667s-42.666667 17.066667-42.666667 42.666666v256c0 25.6 17.066667 42.666667 42.666667 42.666667h256c25.6 0 42.666667-17.066667 42.666666-42.666667s-17.066667-42.666667-42.666666-42.666666H145.066667l76.8-76.8 153.6-153.6c17.066667-17.066667 17.066667-42.666667 0-59.733334-17.066667-17.066667-42.666667-17.066667-59.733334 0z m665.6 34.133334c-25.6 0-42.666667 17.066667-42.666666 42.666666v153.6l-76.8-76.8-153.6-153.6c-17.066667-17.066667-42.666667-17.066667-59.733334 0-17.066667 17.066667-17.066667 42.666667 0 59.733334l153.6 153.6 76.8 76.8H725.333333c-25.6 0-42.666667 17.066667-42.666666 42.666666s17.066667 42.666667 42.666666 42.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666666z m0-682.666667h-256c-25.6 0-42.666667 17.066667-42.666666 42.666667s17.066667 42.666667 42.666666 42.666666h153.6l-76.8 76.8-153.6 153.6c-17.066667 17.066667-17.066667 42.666667 0 59.733334 17.066667 17.066667 42.666667 17.066667 59.733334 0l153.6-153.6 76.8-76.8v153.6c0 25.6 17.066667 42.666667 42.666666 42.666666s42.666667-17.066667 42.666667-42.666666v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z"
fill="" p-id="3305"></path> fill
p-id="3305"
/>
</svg> </svg>
<svg class="icon" v-else <svg
class="icon"
v-else
style="width: 24px; vertical-align: middle;fill: currentColor;overflow: hidden;" style="width: 24px; vertical-align: middle;fill: currentColor;overflow: hidden;"
viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3952"> viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="3952"
>
<path <path
d="M384 597.333333h-256c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667h153.6L17.066667 947.2c-17.066667 17.066667-17.066667 42.666667 0 59.733333 17.066667 17.066667 42.666667 17.066667 59.733333 0L341.333333 742.4v153.6c0 25.6 17.066667 42.666667 42.666667 42.666667s42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z m358.4 85.333334h153.6c25.6 0 42.666667-17.066667 42.666667-42.666667s-17.066667-42.666667-42.666667-42.666667h-256c-25.6 0-42.666667 17.066667-42.666667 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666667s42.666667-17.066667 42.666667-42.666667V742.4l264.533333 264.533333c17.066667 17.066667 42.666667 17.066667 59.733333 0 17.066667-17.066667 17.066667-42.666667 0-59.733333L742.4 682.666667zM640 426.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667s-17.066667-42.666667-42.666667-42.666667H742.4L1006.933333 76.8c17.066667-17.066667 17.066667-42.666667 0-59.733333-17.066667-17.066667-42.666667-17.066667-59.733333 0L682.666667 281.6V128c0-25.6-17.066667-42.666667-42.666667-42.666667s-42.666667 17.066667-42.666667 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666667z m-256-341.333334c-25.6 0-42.666667 17.066667-42.666667 42.666667v153.6L76.8 8.533333C59.733333 0 25.6 0 8.533333 8.533333 0 25.6 0 59.733333 8.533333 76.8L281.6 341.333333H128c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z" d="M384 597.333333h-256c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667h153.6L17.066667 947.2c-17.066667 17.066667-17.066667 42.666667 0 59.733333 17.066667 17.066667 42.666667 17.066667 59.733333 0L341.333333 742.4v153.6c0 25.6 17.066667 42.666667 42.666667 42.666667s42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z m358.4 85.333334h153.6c25.6 0 42.666667-17.066667 42.666667-42.666667s-17.066667-42.666667-42.666667-42.666667h-256c-25.6 0-42.666667 17.066667-42.666667 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666667s42.666667-17.066667 42.666667-42.666667V742.4l264.533333 264.533333c17.066667 17.066667 42.666667 17.066667 59.733333 0 17.066667-17.066667 17.066667-42.666667 0-59.733333L742.4 682.666667zM640 426.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667s-17.066667-42.666667-42.666667-42.666667H742.4L1006.933333 76.8c17.066667-17.066667 17.066667-42.666667 0-59.733333-17.066667-17.066667-42.666667-17.066667-59.733333 0L682.666667 281.6V128c0-25.6-17.066667-42.666667-42.666667-42.666667s-42.666667 17.066667-42.666667 42.666667v256c0 25.6 17.066667 42.666667 42.666667 42.666667z m-256-341.333334c-25.6 0-42.666667 17.066667-42.666667 42.666667v153.6L76.8 8.533333C59.733333 0 25.6 0 8.533333 8.533333 0 25.6 0 59.733333 8.533333 76.8L281.6 341.333333H128c-25.6 0-42.666667 17.066667-42.666667 42.666667s17.066667 42.666667 42.666667 42.666667h256c25.6 0 42.666667-17.066667 42.666667-42.666667v-256c0-25.6-17.066667-42.666667-42.666667-42.666667z"
p-id="3953"></path> p-id="3953"
/>
</svg> </svg>
</i> </i>
</el-col> </el-col>
@ -144,100 +130,102 @@ export default {
}, },
computed: { computed: {
nickName() { nickName() {
return this.$store.getters.nickName; return this.$store.getters.nickName
}, },
curNav() { curNav() {
return this.$store.getters.nav; return this.$store.getters.nav
} },
}, },
watch: { watch: {
curNav(n, o) { curNav(n, o) {
this.nav = this.$store.getters.nav; this.nav = this.$store.getters.nav
} },
}, },
mounted() { mounted() {
window.xapp = this; window.xapp = this
this.$api.project.findMyProjectList().then(d => { this.$api.project.findMyProjectList().then((d) => {
this.projects = d.rows || []; this.projects = d.rows || []
if (this.projects.length > 0) { if (this.projects.length > 0) {
let id = localStorage.getItem("selProj") || this.projects[0].id let id = localStorage.getItem('selProj') || this.projects[0].id
this.selProjectId = +id; this.selProjectId = +id
this.doProjectSelect(); this.doProjectSelect()
} }
}); })
}, },
methods: { methods: {
toggleFullScreen() { toggleFullScreen() {
let el = document.body; let el = document.body
this.$toggleFullScreen(el); this.$toggleFullScreen(el)
setTimeout(() => { setTimeout(() => {
this.isFullScreen = document.fullscreenElement == el; this.isFullScreen = document.fullscreenElement == el
}, 400); }, 400)
}, },
doProjectSelect() { doProjectSelect() {
let tmps = this.projects.filter(d => d.id == this.selProjectId); let tmps = this.projects.filter((d) => d.id == this.selProjectId)
if (tmps.length > 0) { if (tmps.length > 0) {
this.$store.dispatch('SetSelProject', tmps[0]); this.$store.dispatch('SetSelProject', tmps[0])
this.selProject = tmps[0]; this.selProject = tmps[0]
} else { } else {
this.$store.dispatch('SetSelProject', null); this.$store.dispatch('SetSelProject', null)
this.selProject = null; this.selProject = null
} }
localStorage.setItem("selProj", this.selProjectId); localStorage.setItem('selProj', this.selProjectId)
}, },
doNav(n) { doNav(n) {
if (this.nav == n) { if (this.nav == n) {
return; return
} }
this.nav = n; this.nav = n
switch (n) { switch (n) {
case 1: case 1:
this.$router.push("/index"); this.$router.push('/index')
break; break
case 2: case 2:
this.$router.push("/detail"); this.$router.push('/detail')
break; break
case 3: case 3:
this.$router.push("/prjSafety"); this.$router.push('/prjSafety')
break; break
case 309: case 309:
this.$router.push("/videoMonitor"); this.$router.push('/videoMonitor')
break; break
case 301: case 301:
this.$router.push("/safetyCheck"); this.$router.push('/safetyCheck')
break; break
case 304: case 304:
this.$router.push("/towerCrane"); this.$router.push('/towerCrane')
break; break
case 306: case 306:
this.$router.push("/powerIot"); this.$router.push('/powerIot')
break; break
case 4: case 4:
this.$router.push("/prjQuality"); this.$router.push('/prjQuality')
break; break
case 5: case 5:
this.$router.push("/prjProgress"); this.$router.push('/prjProgress')
break; break
case 6: case 6:
this.$router.push("/greenCarbon"); this.$router.push('/greenCarbon')
break; break
case 501: case 501:
this.$router.push("/photography"); this.$router.push('/photography')
break; break
} }
}, },
doLogout() { doLogout() {
this.$confirm('确定注销并退出系统吗?', '提示', { this.$confirm('确定注销并退出系统吗?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning',
}).then(() => { })
this.$store.dispatch('LogOut').then(() => { .then(() => {
location.href = window.XDBSAPP; this.$store.dispatch('LogOut').then(() => {
location.href = window.XDBSAPP
})
}) })
}).catch(() => { }); .catch(() => {})
} },
} },
} }
</script> </script>
@ -304,10 +292,8 @@ export default {
} }
} }
} }
} }
} }
} }
} }
} }
@ -370,8 +356,6 @@ export default {
} }
@media (min-width: 2561px) { @media (min-width: 2561px) {
.header-center { .header-center {
font-size: 52px !important; font-size: 52px !important;
margin-top: 10px; margin-top: 10px;

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -1,21 +1,21 @@
<template> <template>
<div class="index-page main-page"> <div class="index-page main-page"></div>
</div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
selProject: null selProject: null,
} }
}, },
mounted() { mounted() {
this.$store.dispatch('ChangeNav', 1); window.location.href = '#/detail'
this.$bus.$on('projectChange', prj => { this.$store.dispatch('ChangeNav', 1)
this.selProject = prj; this.$bus.$on('projectChange', (prj) => {
}); this.selProject = prj
} })
},
} }
</script> </script>

View File

@ -12,7 +12,7 @@
<div class="dept-info" v-else> <div class="dept-info" v-else>
<img class="dept-img" src="images/company_3.png" /> <img class="dept-img" src="images/company_3.png" />
<div class="dept-row"> <div class="dept-row">
<div class="dept-name">{{ deptType1.deptName }}</div> <div class="dept-name" :title="deptType1.deptName">{{ deptType1.deptName }}</div>
<div class="dept-leader-phone" :title="(deptType1.leader || '') + ' ' + (deptType1.phone || '')"> <div class="dept-leader-phone" :title="(deptType1.leader || '') + ' ' + (deptType1.phone || '')">
<span class="dept-leader">{{ deptType1.leader }}</span> <span class="dept-leader">{{ deptType1.leader }}</span>
<span class="dept-phone">{{ deptType1.phone }}</span> <span class="dept-phone">{{ deptType1.phone }}</span>
@ -26,7 +26,7 @@
<div class="dept-info" v-else> <div class="dept-info" v-else>
<img class="dept-img" src="images/company_2.png" /> <img class="dept-img" src="images/company_2.png" />
<div class="dept-row"> <div class="dept-row">
<div class="dept-name">{{ deptType2.deptName }}</div> <div class="dept-name" :title="deptType2.deptName">{{ deptType2.deptName }}</div>
<div class="dept-leader-phone" :title="(deptType2.leader || '') + ' ' + (deptType2.phone || '')"> <div class="dept-leader-phone" :title="(deptType2.leader || '') + ' ' + (deptType2.phone || '')">
<span class="dept-leader">{{ deptType2.leader }}</span> <span class="dept-leader">{{ deptType2.leader }}</span>
<span class="dept-phone">{{ deptType2.phone }}</span> <span class="dept-phone">{{ deptType2.phone }}</span>
@ -56,7 +56,7 @@
<div class="dept-info" v-else> <div class="dept-info" v-else>
<img class="dept-img" src="images/company_11.png" /> <img class="dept-img" src="images/company_11.png" />
<div class="dept-row"> <div class="dept-row">
<div class="dept-name">{{ deptType4.deptName }}</div> <div class="dept-name" :title="deptType4.deptName">{{ deptType4.deptName }}</div>
<div class="dept-leader-phone" :title="(deptType4.leader || '') + ' ' + (deptType4.phone || '')"> <div class="dept-leader-phone" :title="(deptType4.leader || '') + ' ' + (deptType4.phone || '')">
<span class="dept-leader">{{ deptType4.leader }}</span> <span class="dept-leader">{{ deptType4.leader }}</span>
<span class="dept-phone">{{ deptType4.phone }}</span> <span class="dept-phone">{{ deptType4.phone }}</span>
@ -72,7 +72,7 @@
<div class="dept-info" v-else> <div class="dept-info" v-else>
<img class="dept-img" src="images/company_12.png" /> <img class="dept-img" src="images/company_12.png" />
<div class="dept-row"> <div class="dept-row">
<div class="dept-name">{{ deptType5.deptName }}</div> <div class="dept-name" :title="deptType5.deptName">{{ deptType5.deptName }}</div>
<div class="dept-leader-phone" :title="(deptType5.leader || '') + ' ' + (deptType5.phone || '')"> <div class="dept-leader-phone" :title="(deptType5.leader || '') + ' ' + (deptType5.phone || '')">
<span class="dept-leader">{{ deptType5.leader }}</span> <span class="dept-leader">{{ deptType5.leader }}</span>
<span class="dept-phone">{{ deptType5.phone }}</span> <span class="dept-phone">{{ deptType5.phone }}</span>
@ -87,7 +87,7 @@
<div class="dept-info" v-else> <div class="dept-info" v-else>
<img class="dept-img" src="images/company_10.png" /> <img class="dept-img" src="images/company_10.png" />
<div class="dept-row"> <div class="dept-row">
<div class="dept-name">{{ deptType6.deptName }}</div> <div class="dept-name" :title="deptType6.deptName">{{ deptType6.deptName }}</div>
<div class="dept-leader-phone" :title="(deptType6.leader || '') + ' ' + (deptType6.phone || '')"> <div class="dept-leader-phone" :title="(deptType6.leader || '') + ' ' + (deptType6.phone || '')">
<span class="dept-leader">{{ deptType6.leader }}</span> <span class="dept-leader">{{ deptType6.leader }}</span>
<span class="dept-phone">{{ deptType6.phone }}</span> <span class="dept-phone">{{ deptType6.phone }}</span>
@ -820,6 +820,9 @@ export default {
.dept-name { .dept-name {
color: #50a2eb; color: #50a2eb;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.dept-leader-phone { .dept-leader-phone {
@ -904,7 +907,7 @@ export default {
.prj-img-nav { .prj-img-nav {
position: absolute; position: absolute;
z-index: 999; z-index: 999;
left: calc(50% - 100px);
.prj-img-nav-item { .prj-img-nav-item {
display: inline-block; display: inline-block;
line-height: 30px; line-height: 30px;

View File

@ -1,8 +1,6 @@
<template> <template>
<MyDialog v-if="show" v-model="show" width="60vw" height="75vh" class="safety-check-dialog"> <MyDialog v-if="show" v-model="show" width="60vw" height="75vh" class="safety-check-dialog">
<template slot="title"> <template slot="title">{{ title }}</template>
{{ title }}
</template>
<div class="head-title-tab" style="padding: 10px 0px;"> <div class="head-title-tab" style="padding: 10px 0px;">
<div :class="nav == 6 ? 'head-nav active' : 'head-nav'" @click="doNav(6)">{{ counts[0] }}</div> <div :class="nav == 6 ? 'head-nav active' : 'head-nav'" @click="doNav(6)">{{ counts[0] }}</div>
<div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)">{{ counts[1] }}</div> <div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)">{{ counts[1] }}</div>
@ -12,20 +10,17 @@
</div> </div>
<div class="scroll data-list" :key="dataKey"> <div class="scroll data-list" :key="dataKey">
<div v-if="rows.length == 0" style="text-align: center;" class="div-no-data"> <div v-if="rows.length == 0" style="text-align: center;" class="div-no-data">
<img src="images/nodata.png" style="width: 120px;"> <img src="images/nodata.png" style="width: 120px;" />
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div> <div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
</div> </div>
<div v-for="(it, idx) in rows" :key="idx" class="data-item"> <div v-for="(it, idx) in rows" :key="idx" class="data-item">
<div class="left-image"> <div class="left-image">
<div class="left-header"> <div class="left-header">
<span class="sp-nav" :class="it.imgSel == 0 ? 'active' : ''" @click="it.imgSel = 0">整改前</span> <span class="sp-nav" :class="it.imgSel == 0 ? 'active' : ''" @click="it.imgSel = 0">整改前</span>
<span class="sp-nav" :class="it.imgSel == 1 ? 'active' : ''" v-if="it.checkState == 4" <span class="sp-nav" :class="it.imgSel == 1 ? 'active' : ''" v-if="it.checkState == 4" @click="it.imgSel = 1"></span>
@click="it.imgSel = 1">整改后</span>
</div> </div>
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" v-if="it.imgSel == 0" <el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" v-if="it.imgSel == 0" :preview-src-list="[it.smarkUrl]"></el-image>
:preview-src-list="[it.smarkUrl]"></el-image> <el-image class="img-sm" fit="scale-down" :src="it.marksPicture" v-if="it.imgSel == 1" :preview-src-list="[it.marksPicture]"></el-image>
<el-image class="img-sm" fit="scale-down" :src="it.marksPicture" v-if="it.imgSel == 1"
:preview-src-list="[it.marksPicture]"></el-image>
</div> </div>
<div class="right-data"> <div class="right-data">
<el-col :span="12"> <el-col :span="12">
@ -63,8 +58,15 @@
</div> </div>
</div> </div>
</div> </div>
<el-pagination v-if="rows.length > 0" layout="total,prev, pager, next" @current-change="handleCurrentChange" <el-pagination
:total="total" :page-size="pageSize" :current-page.sync="pageNum" class="bg-pagination"></el-pagination> v-if="rows.length > 0"
layout="total,prev, pager, next"
@current-change="handleCurrentChange"
:total="total"
:page-size="pageSize"
:current-page.sync="pageNum"
class="bg-pagination"
></el-pagination>
</MyDialog> </MyDialog>
</template> </template>
@ -73,7 +75,7 @@ export default {
data() { data() {
return { return {
show: false, show: false,
title: "安全隐患排查", title: '安全隐患排查',
prjInfo: {}, prjInfo: {},
nav: 6, nav: 6,
problemType: null, problemType: null,
@ -88,39 +90,39 @@ export default {
}, },
methods: { methods: {
handleCurrentChange(n) { handleCurrentChange(n) {
this.pageNum = n; this.pageNum = n
this.loadData(); this.loadData()
}, },
getDict(n) { getDict(n) {
let tmps = this.dangerTypeDict.filter(d => d.value == n); let tmps = this.dangerTypeDict.filter((d) => d.value == n)
return tmps.length > 0 ? tmps[0].label : ''; return tmps.length > 0 ? tmps[0].label : ''
}, },
doNav(n) { doNav(n) {
this.nav = n; this.nav = n
this.loadData(); this.loadData()
}, },
showDialog(prj, n, dangerTypeDict) { showDialog(prj, n, dangerTypeDict) {
this.dangerTypeDict = dangerTypeDict; this.dangerTypeDict = dangerTypeDict
this.problemType = n == 0 ? null : n; this.problemType = n == 0 ? null : n
this.prjInfo = prj; this.prjInfo = prj
this.title = ["安全隐患排查", "日常巡检", "周检", "月检", "转型检查"][n]; this.title = ['安全隐患排查', '日常巡检', '周检', '月检', '专项检查'][n]
this.pageNum = 0; this.pageNum = 0
this.show = true; this.show = true
this.getCount(n); this.getCount(n)
this.loadData(); this.loadData()
}, },
getCount(n) { getCount(n) {
let postData = { let postData = {
projectId: this.prjInfo.id, projectId: this.prjInfo.id,
comId: this.prjInfo.comId, comId: this.prjInfo.comId,
infoType: 0 infoType: 0,
};
if (n > 0) {
postData.problemType = n;
} }
this.$api.safety.listCountForBG(postData).then(d => { if (n > 0) {
this.counts = d.data.filter(it => it.projectName != 'a').map(it => it.id) postData.problemType = n
}); }
this.$api.safety.listCountForBG(postData).then((d) => {
this.counts = d.data.filter((it) => it.projectName != 'a').map((it) => it.id)
})
}, },
loadData() { loadData() {
let postData = { let postData = {
@ -130,19 +132,18 @@ export default {
pageNum: this.pageNum, pageNum: this.pageNum,
pageSize: this.pageSize, pageSize: this.pageSize,
problemType: this.problemType, problemType: this.problemType,
projectName: this.nav projectName: this.nav,
}; }
this.$api.safety.listForBG(postData).then(d => { this.$api.safety.listForBG(postData).then((d) => {
this.total = d.total; this.total = d.total
this.rows = (d.rows || []).map(it => { this.rows = (d.rows || []).map((it) => {
it.imgSel = 0; it.imgSel = 0
return it; return it
}); })
this.dataKey++; this.dataKey++
}); })
} },
},
}
} }
</script> </script>
@ -189,16 +190,14 @@ export default {
line-height: 30px; line-height: 30px;
text-align: center; text-align: center;
background: #fff; background: #fff;
color: #5B84EB; color: #5b84eb;
cursor: pointer; cursor: pointer;
&.active { &.active {
color: #fff; color: #fff;
background: #5B84EB; background: #5b84eb;
} }
} }
} }
.el-image { .el-image {
@ -213,12 +212,11 @@ export default {
line-height: 30px; line-height: 30px;
.sp-label { .sp-label {
color: #8BFFD2; color: #8bffd2;
} }
} }
} }
} }
} }
@media (min-width: 1921px) and (max-width: 2560px) { @media (min-width: 1921px) and (max-width: 2560px) {
@ -241,14 +239,11 @@ export default {
max-height: calc(75vh - 180px); max-height: calc(75vh - 180px);
.data-item { .data-item {
.right-data { .right-data {
font-size: 18px; font-size: 18px;
.sp-label { .sp-label {
color: #8BFFD2; color: #8bffd2;
} }
} }
} }
@ -276,14 +271,11 @@ export default {
max-height: calc(75vh - 180px); max-height: calc(75vh - 180px);
.data-item { .data-item {
.right-data { .right-data {
font-size: 24px; font-size: 24px;
.sp-label { .sp-label {
color: #8BFFD2; color: #8bffd2;
} }
} }
} }

View File

@ -1,11 +1,9 @@
<template> <template>
<div class="project-safety-check main-page"> <div class="project-safety-check main-page">
<el-col :span="6" class="h100"> <el-col :span="6" class="h100">
<module-one-1-1 label="安全隐患排查" class="chart1-module"> <module-one-1-1 label="安全隐患排查" class="chart1-module">
<el-col :span="12" v-for="(it, idx) in chart1Data" :key="idx"> <el-col :span="12" v-for="(it, idx) in chart1Data" :key="idx">
<div <div class="equipment-list-min equipment-list-min_div quality-target-index-min quality-target-index-min_div">
class="equipment-list-min equipment-list-min_div quality-target-index-min quality-target-index-min_div">
<div class="czz-number-img czz-number-img-blue"> <div class="czz-number-img czz-number-img-blue">
<svg-icon icon-class="notesearch"></svg-icon> <svg-icon icon-class="notesearch"></svg-icon>
</div> </div>
@ -14,7 +12,8 @@
<span>{{ it.name }}</span> <span>{{ it.name }}</span>
</div> </div>
<div class="equipment-list-data equipment-list-data_div_bottom"> <div class="equipment-list-data equipment-list-data_div_bottom">
<span class="sp-data">{{ it.value || 0 }}</span><span class="sp-unit"></span> <span class="sp-data">{{ it.value || 0 }}</span>
<span class="sp-unit"></span>
</div> </div>
</div> </div>
</div> </div>
@ -24,12 +23,13 @@
<img src="images/icon2001.png" class="img-openwin" @click="showDlg(1)" /> <img src="images/icon2001.png" class="img-openwin" @click="showDlg(1)" />
<div class="div-item-chart"> <div class="div-item-chart">
<div class="data-item-chart"> <div class="data-item-chart">
<div class="total-info">{{ item1Data.total }}<br /> <div class="total-info">
{{ item1Data.total }}
<br />
<span class="sp-label">问题总数</span> <span class="sp-label">问题总数</span>
</div> </div>
<div class="chart-gif chart-overview-gif"></div> <div class="chart-gif chart-overview-gif"></div>
<my-chart :key="itemChartKey1" id="project-safety-check-item1" width="100%" height="100%" <my-chart :key="itemChartKey1" id="project-safety-check-item1" width="100%" height="100%" :render="o => renderDataItem(1)"></my-chart>
:render="o => renderDataItem(1)"></my-chart>
</div> </div>
<div class="div-item-info" :key="itemChartKey1"> <div class="div-item-info" :key="itemChartKey1">
<div v-for="(it, idx) in item1Data.infos" :key="idx" :class="'item-info'"> <div v-for="(it, idx) in item1Data.infos" :key="idx" :class="'item-info'">
@ -44,8 +44,7 @@
<div class="glr-title">最新提交</div> <div class="glr-title">最新提交</div>
<div class="div-item-list scroll"> <div class="div-item-list scroll">
<div v-for="(it, idx) in item1Data.items" :key="idx" class="list-item"> <div v-for="(it, idx) in item1Data.items" :key="idx" class="list-item">
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" <el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" :preview-src-list="[it.smarkUrl]"></el-image>
:preview-src-list="[it.smarkUrl]"></el-image>
<div class="list-item-info"> <div class="list-item-info">
<div class="item-row"> <div class="item-row">
<span class="sp-label">提交人:</span> <span class="sp-label">提交人:</span>
@ -80,8 +79,7 @@
<el-col :span="18" class="h100"> <el-col :span="18" class="h100">
<module-one-1-3 label="隐患类别统计"> <module-one-1-3 label="隐患类别统计">
<img src="images/icon2001.png" class="img-openwin" @click="showDlg(0)" /> <img src="images/icon2001.png" class="img-openwin" @click="showDlg(0)" />
<my-chart :key="chartKey2" id="project-safety-check-chart2" width="100%" height="100%" <my-chart :key="chartKey2" id="project-safety-check-chart2" width="100%" height="100%" :render="renderChart2"></my-chart>
:render="renderChart2"></my-chart>
</module-one-1-3> </module-one-1-3>
<el-row class="el-right"> <el-row class="el-right">
<el-col :span="8"> <el-col :span="8">
@ -89,12 +87,13 @@
<img src="images/icon2001.png" class="img-openwin" @click="showDlg(2)" /> <img src="images/icon2001.png" class="img-openwin" @click="showDlg(2)" />
<div class="div-item-chart"> <div class="div-item-chart">
<div class="data-item-chart"> <div class="data-item-chart">
<div class="total-info">{{ item2Data.total }}<br /> <div class="total-info">
{{ item2Data.total }}
<br />
<span class="sp-label">问题总数</span> <span class="sp-label">问题总数</span>
</div> </div>
<div class="chart-gif chart-overview-gif"></div> <div class="chart-gif chart-overview-gif"></div>
<my-chart :key="itemChartKey1" id="project-safety-check-item2" width="100%" <my-chart :key="itemChartKey1" id="project-safety-check-item2" width="100%" height="100%" :render="o => renderDataItem(2)"></my-chart>
height="100%" :render="o => renderDataItem(2)"></my-chart>
</div> </div>
<div class="div-item-info" :key="itemChartKey1"> <div class="div-item-info" :key="itemChartKey1">
<div v-for="(it, idx) in item2Data.infos" :key="idx" :class="'item-info'"> <div v-for="(it, idx) in item2Data.infos" :key="idx" :class="'item-info'">
@ -104,14 +103,12 @@
<span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span> <span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span>
</div> </div>
</div> </div>
</div> </div>
<div class="div-item-data"> <div class="div-item-data">
<div class="glr-title">最新提交</div> <div class="glr-title">最新提交</div>
<div class="div-item-list scroll"> <div class="div-item-list scroll">
<div v-for="(it, idx) in item2Data.items" :key="idx" class="list-item"> <div v-for="(it, idx) in item2Data.items" :key="idx" class="list-item">
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" <el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" :preview-src-list="[it.smarkUrl]"></el-image>
:preview-src-list="[it.smarkUrl]"></el-image>
<div class="list-item-info"> <div class="list-item-info">
<div class="item-row"> <div class="item-row">
<span class="sp-label">提交人:</span> <span class="sp-label">提交人:</span>
@ -148,12 +145,13 @@
<img src="images/icon2001.png" class="img-openwin" @click="showDlg(3)" /> <img src="images/icon2001.png" class="img-openwin" @click="showDlg(3)" />
<div class="div-item-chart"> <div class="div-item-chart">
<div class="data-item-chart"> <div class="data-item-chart">
<div class="total-info">{{ item3Data.total }}<br /> <div class="total-info">
{{ item3Data.total }}
<br />
<span class="sp-label">问题总数</span> <span class="sp-label">问题总数</span>
</div> </div>
<div class="chart-gif chart-overview-gif"></div> <div class="chart-gif chart-overview-gif"></div>
<my-chart :key="itemChartKey1" id="project-safety-check-item3" width="100%" <my-chart :key="itemChartKey1" id="project-safety-check-item3" width="100%" height="100%" :render="o => renderDataItem(3)"></my-chart>
height="100%" :render="o => renderDataItem(3)"></my-chart>
</div> </div>
<div class="div-item-info" :key="itemChartKey1"> <div class="div-item-info" :key="itemChartKey1">
<div v-for="(it, idx) in item3Data.infos" :key="idx" :class="'item-info'"> <div v-for="(it, idx) in item3Data.infos" :key="idx" :class="'item-info'">
@ -163,14 +161,12 @@
<span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span> <span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span>
</div> </div>
</div> </div>
</div> </div>
<div class="div-item-data"> <div class="div-item-data">
<div class="glr-title">最新提交</div> <div class="glr-title">最新提交</div>
<div class="div-item-list scroll"> <div class="div-item-list scroll">
<div v-for="(it, idx) in item3Data.items" :key="idx" class="list-item"> <div v-for="(it, idx) in item3Data.items" :key="idx" class="list-item">
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" <el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" :preview-src-list="[it.smarkUrl]"></el-image>
:preview-src-list="[it.smarkUrl]"></el-image>
<div class="list-item-info"> <div class="list-item-info">
<div class="item-row"> <div class="item-row">
<span class="sp-label">提交人:</span> <span class="sp-label">提交人:</span>
@ -203,16 +199,17 @@
</module-one-2-1> </module-one-2-1>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<module-one-2-1 label="转型检查"> <module-one-2-1 label="专项检查">
<img src="images/icon2001.png" class="img-openwin" @click="showDlg(4)" /> <img src="images/icon2001.png" class="img-openwin" @click="showDlg(4)" />
<div class="div-item-chart"> <div class="div-item-chart">
<div class="data-item-chart"> <div class="data-item-chart">
<div class="total-info">{{ item4Data.total }}<br /> <div class="total-info">
{{ item4Data.total }}
<br />
<span class="sp-label">问题总数</span> <span class="sp-label">问题总数</span>
</div> </div>
<div class="chart-gif chart-overview-gif"></div> <div class="chart-gif chart-overview-gif"></div>
<my-chart :key="itemChartKey1" id="project-safety-check-item4" width="100%" <my-chart :key="itemChartKey1" id="project-safety-check-item4" width="100%" height="100%" :render="o => renderDataItem(3)"></my-chart>
height="100%" :render="o => renderDataItem(3)"></my-chart>
</div> </div>
<div class="div-item-info" :key="itemChartKey1"> <div class="div-item-info" :key="itemChartKey1">
<div v-for="(it, idx) in item4Data.infos" :key="idx" :class="'item-info'"> <div v-for="(it, idx) in item4Data.infos" :key="idx" :class="'item-info'">
@ -222,14 +219,12 @@
<span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span> <span class="sp-percent led-number" v-if="idx > 0">{{ it.percent }}%</span>
</div> </div>
</div> </div>
</div> </div>
<div class="div-item-data"> <div class="div-item-data">
<div class="glr-title">最新提交</div> <div class="glr-title">最新提交</div>
<div class="div-item-list scroll"> <div class="div-item-list scroll">
<div v-for="(it, idx) in item4Data.items" :key="idx" class="list-item"> <div v-for="(it, idx) in item4Data.items" :key="idx" class="list-item">
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" <el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" :preview-src-list="[it.smarkUrl]"></el-image>
:preview-src-list="[it.smarkUrl]"></el-image>
<div class="list-item-info"> <div class="list-item-info">
<div class="item-row"> <div class="item-row">
<span class="sp-label">提交人:</span> <span class="sp-label">提交人:</span>
@ -281,17 +276,17 @@ export default {
dpi: '', dpi: '',
selProject: null, selProject: null,
legendOpt1: { legendOpt1: {
icon: "rect", icon: 'rect',
textStyle: { textStyle: {
color: "#c3dbfd", color: '#c3dbfd',
fontSize: 14, fontSize: 14,
rich: { rich: {
name: { name: {
color: "#c3dbfd", color: '#c3dbfd',
padding: [0, 20, 0, 0], padding: [0, 20, 0, 0],
}, },
percent: { percent: {
color: "#4676FD" color: '#4676FD',
}, },
}, },
}, },
@ -322,42 +317,42 @@ export default {
datas: [], datas: [],
infos: [], infos: [],
items: [], items: [],
} },
} }
}, },
mounted() { mounted() {
window.safetyApp = this; window.safetyApp = this
this.$store.dispatch('ChangeNav', 301); this.$store.dispatch('ChangeNav', 301)
this.$bus.$on('projectChange', prj => { this.$bus.$on('projectChange', (prj) => {
this.selProject = prj; this.selProject = prj
this.init(); this.init()
}); })
this.selProject = this.$store.getters.selProject; this.selProject = this.$store.getters.selProject
this.init(); this.init()
this.dpi = this.$dpi(); this.dpi = this.$dpi()
window.addEventListener("resize", () => { window.addEventListener('resize', () => {
if (this.dpi != this.$dpi()) { if (this.dpi != this.$dpi()) {
this.dpi = this.$dpi(); this.dpi = this.$dpi()
this.chartKey++; this.chartKey++
this.chartKey2++; this.chartKey2++
} }
}); })
this.$api.dict("ssp_proble_sub_type").then((d) => { this.$api.dict('ssp_proble_sub_type').then((d) => {
this.dangerTypeDict = d || []; this.dangerTypeDict = d || []
}); })
}, },
methods: { methods: {
showDlg(n) { showDlg(n) {
this.$refs.dlg.showDialog(this.selProject, n, this.dangerTypeDict); this.$refs.dlg.showDialog(this.selProject, n, this.dangerTypeDict)
}, },
init() { init() {
if (!this.selProject) { if (!this.selProject) {
return; return
} }
let postData = { let postData = {
projectId: this.selProject.id, projectId: this.selProject.id,
comId: this.selProject.comId comId: this.selProject.comId,
}; }
let ajaxs = [ let ajaxs = [
this.$api.safety.groupByProblemType(postData), this.$api.safety.groupByProblemType(postData),
this.$api.safety.groupByDangerType(postData), this.$api.safety.groupByDangerType(postData),
@ -369,119 +364,122 @@ export default {
this.$api.safety.listForBG({ ...postData, problemType: 3, infoType: 0, pageNum: 1, pageSize: 5 }), this.$api.safety.listForBG({ ...postData, problemType: 3, infoType: 0, pageNum: 1, pageSize: 5 }),
this.$api.safety.listCountForBG({ ...postData, problemType: 4, infoType: 0 }), this.$api.safety.listCountForBG({ ...postData, problemType: 4, infoType: 0 }),
this.$api.safety.listForBG({ ...postData, problemType: 4, infoType: 0, pageNum: 1, pageSize: 5 }), this.$api.safety.listForBG({ ...postData, problemType: 4, infoType: 0, pageNum: 1, pageSize: 5 }),
]; ]
this.$api.http.all(ajaxs).then(res => { this.$api.http.all(ajaxs).then((res) => {
this.chart1Data = (res[0].data || []).map(it => { this.chart1Data = (res[0].data || []).map((it) => {
return { return {
id: it.nickedInfo, id: it.nickedInfo,
value: it.id, value: it.id,
name: it.problemType, name: it.problemType,
data: it data: it,
} }
}); })
this.chart2Data = (res[1].data || []).map(it => { this.chart2Data = (res[1].data || []).map((it) => {
return { return {
id: it.nickedInfo, id: it.nickedInfo,
name: it.dangerType, name: it.dangerType,
value1: it.id, value1: it.id,
value2: it.comId, value2: it.comId,
} }
}); })
this.showChart1();// this.showChart1() //
this.showChart2();// this.showChart2() //
this.makeItemData(this.item1Data, res[2].data) this.makeItemData(this.item1Data, res[2].data)
this.item1Data.items = res[3].rows; this.item1Data.items = res[3].rows
this.makeItemData(this.item2Data, res[4].data) this.makeItemData(this.item2Data, res[4].data)
this.item2Data.items = res[5].rows; this.item2Data.items = res[5].rows
this.makeItemData(this.item3Data, res[6].data) this.makeItemData(this.item3Data, res[6].data)
this.item3Data.items = res[7].rows; this.item3Data.items = res[7].rows
this.makeItemData(this.item4Data, res[8].data) this.makeItemData(this.item4Data, res[8].data)
this.item4Data.items = res[9].rows; this.item4Data.items = res[9].rows
this.itemChartKey1++; this.itemChartKey1++
}); })
},
showChart1(n) {
}, },
showChart1(n) {},
showChart2() { showChart2() {
this.chartKey2++; this.chartKey2++
}, },
getStatus(s) { getStatus(s) {
let checkStates = [{ value: "0", label: '待整改' }, { value: "1", label: '待复检' }, let checkStates = [
{ value: "3", label: '复检驳回' }, { value: '0', label: '待整改' },
{ value: "4", label: '复检通过' }]; { value: '1', label: '待复检' },
let objs = checkStates.filter(it => it.value == s); { value: '3', label: '复检驳回' },
return objs.length > 0 ? objs[0].label : ''; { value: '4', label: '复检通过' },
]
let objs = checkStates.filter((it) => it.value == s)
return objs.length > 0 ? objs[0].label : ''
}, },
makeItemData(item, res) { makeItemData(item, res) {
let labels = ['问题总数', '待整改', '待复检', '复检驳回', '整改完成', '超时整改']; let labels = ['问题总数', '待整改', '待复检', '复检驳回', '整改完成', '超时整改']
item.total = res[0].id; item.total = res[0].id
let total = res[0].id; let total = res[0].id
item.datas = []; item.datas = []
for (let i = 1; i < 5; i++) { for (let i = 1; i < 5; i++) {
item.datas.push({ item.datas.push({
name: labels[i], name: labels[i],
value: res[i].id value: res[i].id,
}); })
} }
item.infos = []; item.infos = []
for (let i = 0; i < res.length; i++) { for (let i = 0; i < res.length; i++) {
item.infos.push({ item.infos.push({
name: labels[i], name: labels[i],
value: res[i].id, value: res[i].id,
type: res[i].projectName, type: res[i].projectName,
percent: total == 0 ? 0 : (res[i].id / total * 100.0).toFixed(1) percent: total == 0 ? 0 : ((res[i].id / total) * 100.0).toFixed(1),
}); })
} }
}, },
renderDataItem(n) { renderDataItem(n) {
let is1K = this.$dpi() == "1K"; let is1K = this.$dpi() == '1K'
let is2K = this.$dpi() == "2K"; let is2K = this.$dpi() == '2K'
let objs = this._data['item' + n + 'Data']; let objs = this._data['item' + n + 'Data']
let option = { let option = {
color: ["#71BCC4", "#EEBE47", "#5EA85D", "#5B84EB", "#E76168"], color: ['#71BCC4', '#EEBE47', '#5EA85D', '#5B84EB', '#E76168'],
series: [ series: [
{ {
type: 'pie', type: 'pie',
radius: ['40%', '70%'], radius: ['40%', '70%'],
padAngle: 1, padAngle: 1,
itemStyle: { itemStyle: {
borderRadius: 5 borderRadius: 5,
}, emphasis: { },
emphasis: {
label: { label: {
show: false, show: false,
} },
}, },
label: { label: {
show: false show: false,
}, },
labelLine: { labelLine: {
show: false show: false,
}, },
data: objs.datas data: objs.datas,
} },
] ],
}; }
return option; return option
}, },
renderChart2(opt) { renderChart2(opt) {
let is1K = this.$dpi() == "1K"; let is1K = this.$dpi() == '1K'
let is2K = this.$dpi() == "2K"; let is2K = this.$dpi() == '2K'
let option = { let option = {
grid: { grid: {
left: "5%", left: '5%',
right: "5%", right: '5%',
bottom: "0%", bottom: '0%',
top: "15%", top: '15%',
containLabel: true, containLabel: true,
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: 'axis',
valueFormatter: (v) => { return v }, valueFormatter: (v) => {
return v
},
textStyle: { textStyle: {
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
}, },
legend: { legend: {
@ -491,89 +489,89 @@ export default {
itemHeight: is1K ? 14 : is2K ? 20 : 20, itemHeight: is1K ? 14 : is2K ? 20 : 20,
itemGap: is1K ? 20 : is2K ? 30 : 40, itemGap: is1K ? 20 : is2K ? 30 : 40,
textStyle: { textStyle: {
color: "#fff", color: '#fff',
fontSize: is1K ? 14 : is2K ? 20 : 30, fontSize: is1K ? 14 : is2K ? 20 : 30,
} },
}, },
xAxis: [ xAxis: [
{ {
type: "category", type: 'category',
data: this.chart2Data.map(it => it.name.replace(/[“”]/g, "'")), data: this.chart2Data.map((it) => it.name.replace(/[“”]/g, "'")),
axisLabel: { axisLabel: {
width: is1K ? 60 : is2K ? 140 : 220, width: is1K ? 60 : is2K ? 140 : 220,
rotate: 15, margin: 15,
rotate: 10,
fontSize: is1K ? 12 : is2K ? 14 : 22, fontSize: is1K ? 12 : is2K ? 14 : 22,
overflow: "break", overflow: 'break',
color: "#a2c8f9" color: '#a2c8f9',
}, },
splitLine: { splitLine: {
lineStyle: { lineStyle: {
opacity: 0.1 opacity: 0.1,
} },
} },
}, },
], ],
yAxis: [ yAxis: [
{ {
type: "value", type: 'value',
minInterval: 1, minInterval: 1,
axisLabel: { axisLabel: {
formatter: '{value}', formatter: '{value}',
color: "#2ec2b3", color: '#2ec2b3',
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
splitLine: { splitLine: {
lineStyle: { lineStyle: {
opacity: 0.1 opacity: 0.1,
} },
}, },
}, },
], ],
series: [ series: [
{ {
name: '问题数', name: '问题数',
type: "bar", type: 'bar',
barGap: '0%', barGap: '0%',
barWidth: '20%', barWidth: '20%',
label: { label: {
show: true, show: true,
position: "top", position: 'top',
color: "#4DAAFC", color: '#4DAAFC',
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
lineStyle: { lineStyle: {
color: "#7ddff2", color: '#7ddff2',
}, },
itemStyle: { itemStyle: {
normal: { areaStyle: { type: "default", color: "#7ddff2", opacity: 0.1 } }, normal: { areaStyle: { type: 'default', color: '#7ddff2', opacity: 0.1 } },
}, },
data: this.chart2Data.map(it => it.value1), data: this.chart2Data.map((it) => it.value1),
}, },
{ {
name: '待改数', name: '待改数',
type: "bar", type: 'bar',
barGap: '0%', barGap: '0%',
barWidth: '20%', barWidth: '20%',
label: { label: {
show: true, show: true,
position: "top", position: 'top',
color: "#4DAAFC", color: '#4DAAFC',
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
lineStyle: { lineStyle: {
color: "#006594", color: '#006594',
}, },
itemStyle: { itemStyle: {
normal: { areaStyle: { type: "default", color: "#006594", opacity: 0.1 } }, normal: { areaStyle: { type: 'default', color: '#006594', opacity: 0.1 } },
}, },
data: this.chart2Data.map(it => it.value2), data: this.chart2Data.map((it) => it.value2),
} },
], ],
}; }
return option; return option
} },
},
}
} }
</script> </script>
@ -693,19 +691,19 @@ export default {
top: 4px; top: 4px;
&.is-b { &.is-b {
background-color: #71BCC4; background-color: #71bcc4;
} }
&.is-c { &.is-c {
background-color: #EEBE47; background-color: #eebe47;
} }
&.is-d { &.is-d {
background-color: #5EA85D; background-color: #5ea85d;
} }
&.is-e { &.is-e {
background-color: #5B84EB; background-color: #5b84eb;
} }
} }
@ -725,7 +723,7 @@ export default {
.sp-percent { .sp-percent {
margin-left: 8px; margin-left: 8px;
color: #5B84EB; color: #5b84eb;
} }
} }
} }
@ -763,7 +761,7 @@ export default {
line-height: 24px; line-height: 24px;
.sp-label { .sp-label {
color: #8BFFD2; color: #8bffd2;
} }
} }
} }
@ -933,8 +931,6 @@ export default {
} }
} }
} }
} }
.div-item-chart { .div-item-chart {
@ -1032,6 +1028,5 @@ export default {
} }
} }
} }
} }
</style> </style>

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="project-tower-crane main-page"> <div class="project-tower-crane main-page">
<el-col :span="6" class="h100"> <el-col :span="6" class="h100">
<module-one-3-1 label="设备概况" class="h100"> <module-one-3-1 label="设备概况" class="h100">
<el-row class="tower-total"> <el-row class="tower-total">
@ -11,8 +11,8 @@
<div class="equipment-list-data"> <div class="equipment-list-data">
<p class="p-label">塔机总数</p> <p class="p-label">塔机总数</p>
<div> <div>
<span class="span-num led-number">{{ towerTotalNum }}</span><span <span class="span-num led-number">{{ towerTotalNum }}</span>
class="span-unit"></span> <span class="span-unit"></span>
</div> </div>
</div> </div>
</div> </div>
@ -25,8 +25,8 @@
<div class="equipment-list-data"> <div class="equipment-list-data">
<p class="p-label">监控总数</p> <p class="p-label">监控总数</p>
<div> <div>
<span class="span-num led-number">{{ towerTotalNum }}</span><span <span class="span-num led-number">{{ towerTotalNum }}</span>
class="span-unit"></span> <span class="span-unit"></span>
</div> </div>
</div> </div>
</div> </div>
@ -34,8 +34,7 @@
</el-row> </el-row>
<el-row style="height: 160px; overflow: hidden" :key="chart1Key"> <el-row style="height: 160px; overflow: hidden" :key="chart1Key">
<staff-survey-chart :height="chart1Height" :unit="'个'" :data="towerConfigView" <staff-survey-chart :height="chart1Height" :unit="'个'" :data="towerConfigView" width="100%"></staff-survey-chart>
width="100%"></staff-survey-chart>
</el-row> </el-row>
<el-row class="left-data-list"> <el-row class="left-data-list">
@ -43,8 +42,7 @@
<div :class="'active'">监控列表</div> <div :class="'active'">监控列表</div>
</div> </div>
<div class="drv-list scroll" id="listMin"> <div class="drv-list scroll" id="listMin">
<div v-for="(it, idx) in towerConfigList" :key="idx" class="drv-item list-for" <div v-for="(it, idx) in towerConfigList" :key="idx" class="drv-item list-for" :class="index == idx ? 'active' : ''" @click="onTowerCraneList(idx)">
:class="index == idx ? 'active' : ''" @click="onTowerCraneList(idx)">
<div class="item-content"> <div class="item-content">
<div class="dev-row1"> <div class="dev-row1">
<div class="survey_content"> <div class="survey_content">
@ -64,10 +62,11 @@
</div> </div>
<div class="data-row"> <div class="data-row">
<span class="sp-label">设备状态:</span> <span class="sp-label">设备状态:</span>
<span class="sp-value" <span class="sp-value" :class="it.online == 2 ? 'is-offline' : 'is-online'">
:class="it.online == 2 ? 'is-offline' : 'is-online'">{{ {{
it.online == 2 ? "离线" : "在线" it.online == 2 ? "离线" : "在线"
}}</span> }}
</span>
</div> </div>
</div> </div>
</div> </div>
@ -108,7 +107,6 @@
</module-one-3-1> </module-one-3-1>
</el-col> </el-col>
<el-col :span="18" class="h100"> <el-col :span="18" class="h100">
<el-row class="main-content"> <el-row class="main-content">
<el-col :span="16" class="h100"> <el-col :span="16" class="h100">
<el-row class="total-data"> <el-row class="total-data">
@ -148,23 +146,17 @@
<el-col :span="6"> <el-col :span="6">
<div class="warning-info-title" style="padding-left: 20px; position: relative; z-index: 9"> <div class="warning-info-title" style="padding-left: 20px; position: relative; z-index: 9">
<div :class="'active'"> <div :class="'active'">超载率({{ getRoudValue(towerConfigStat.b0, towerConfigStat.a0) }})</div>
超载率({{ getRoudValue(towerConfigStat.b0, towerConfigStat.a0) }})
</div>
<div class="title-bg"></div> <div class="title-bg"></div>
</div> </div>
<div class="data-row2"> <div class="data-row2">
<div class="data-row2-col"> <div class="data-row2-col">
<div class="s-text">本月</div> <div class="s-text">本月</div>
<div class="s-number"> <div class="s-number">{{ getRoudValue(towerConfigStat.b1, towerConfigStat.a1) }}</div>
{{ getRoudValue(towerConfigStat.b1, towerConfigStat.a1) }}
</div>
</div> </div>
<div class="data-row2-col"> <div class="data-row2-col">
<div class="s-text">累计</div> <div class="s-text">累计</div>
<div class="s-number"> <div class="s-number">{{ getRoudValue(towerConfigStat.b0, towerConfigStat.a0) }}</div>
{{ getRoudValue(towerConfigStat.b0, towerConfigStat.a0) }}
</div>
</div> </div>
</div> </div>
</el-col> </el-col>
@ -191,24 +183,32 @@
<div class="safe-tower-crane-min" style="position: relative"> <div class="safe-tower-crane-min" style="position: relative">
<el-row class="row-crane-min"> <el-row class="row-crane-min">
<el-col :span="2"> <el-col :span="2">
<div class="safe-tower-left" v-if="towerConfigList.length > 1" <div class="safe-tower-left" v-if="towerConfigList.length > 1" @click="safeTowerLeft"></div>
@click="safeTowerLeft"></div>
</el-col> </el-col>
<el-col :span="20"> <el-col :span="20">
<div class="safe-tower-content-max"> <div class="safe-tower-content-max">
<transition :name="direction"> <transition :name="direction">
<component :is="comName" :value="selDev" :width="360" :height="200" <component
:top="55" :left="85" :tHeight="runData.height" :tLoad="runData.load" :is="comName"
:tRotation="runData.rotation" :tRange="runData.range" :value="selDev"
:tLeanAngleX="runData.leanAngleX" :tLeanAngleY="runData.leanAngleY" :width="360"
:height="200"
:top="55"
:left="85"
:tHeight="runData.height"
:tLoad="runData.load"
:tRotation="runData.rotation"
:tRange="runData.range"
:tLeanAngleX="runData.leanAngleX"
:tLeanAngleY="runData.leanAngleY"
:tLoadPercent="runData.loadPercent" :tLoadPercent="runData.loadPercent"
:tMomentPercent="runData.momentPercent"></component> :tMomentPercent="runData.momentPercent"
></component>
</transition> </transition>
</div> </div>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
<div class="safe-tower-right" v-if="towerConfigList.length > 1" <div class="safe-tower-right" v-if="towerConfigList.length > 1" @click="safeTowerRight"></div>
@click="safeTowerRight"></div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -224,25 +224,16 @@
</div> </div>
<div class="afoot-content safe-afoot-content"> <div class="afoot-content safe-afoot-content">
<div class="afoot-overflow safe-afoot-overflow" id="afootOverflow"> <div class="afoot-overflow safe-afoot-overflow" id="afootOverflow">
<div v-if="warningData.length == 0" class="not-data"> <div v-if="warningData.length == 0" class="not-data"></div>
暂无预警数据
</div>
<div v-if="warningData.length > 0" class="quality-table special-table scroll" <div v-if="warningData.length > 0" class="quality-table special-table scroll" style="padding:0px;" :key="tbHeight">
style="padding:0px;" :key="tbHeight"> <el-table :data="warningData" class="mytable" style="width: 100%;background: transparent;" :height="tbHeight" ref="fbsubordinateUnit">
<el-table :data="warningData" class="mytable"
style="width: 100%;background: transparent;" :height="tbHeight"
ref="fbsubordinateUnit">
<el-table-column prop="createTime" label="发送时间"></el-table-column> <el-table-column prop="createTime" label="发送时间"></el-table-column>
<el-table-column label="预警类型"> <el-table-column label="预警类型">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="tag-group"> <div class="tag-group">
<template v-for="(item, idx) in dicts"> <template v-for="(item, idx) in dicts">
<el-tag :key="idx" <el-tag :key="idx" v-if="dic(item.value, scope.row.warnings)" type="danger" effect="dark">{{ item.label }}</el-tag>
v-if="dic(item.value, scope.row.warnings)" type="danger"
effect="dark">
{{ item.label }}
</el-tag>
</template> </template>
</div> </div>
</template> </template>
@ -257,8 +248,7 @@
<div class="analyse-text">力矩曲线</div> <div class="analyse-text">力矩曲线</div>
</div> </div>
<div class="safe-moment"> <div class="safe-moment">
<my-chart :key="itemChartKey1" id="project-tower-crane-item2" width="100%" height="100%" <my-chart :key="itemChartKey1" id="project-tower-crane-item2" width="100%" height="100%" :render="o => renderDataItem2(o)"></my-chart>
:render="o => renderDataItem2(o)"></my-chart>
</div> </div>
</div> </div>
</div> </div>
@ -282,8 +272,10 @@
<div v-for="i in 10" :key="i" class="scale-item"></div> <div v-for="i in 10" :key="i" class="scale-item"></div>
</div> </div>
<span class="sp-data1 sp-data sp-sc">报警:{{ it.data1 }}</span> <span class="sp-data1 sp-data sp-sc">报警:{{ it.data1 }}</span>
<span class="sp-data2 sp-data sp-sc" v-if="it.data2 >= 5" :style="calcTop(it)">:{{ <span class="sp-data2 sp-data sp-sc" v-if="it.data2 >= 5" :style="calcTop(it)">
it.data2 }}</span> 报警:{{
it.data2 }}
</span>
<span class="sp-sc2 sp-sc">{{ it.scale2 }}</span> <span class="sp-sc2 sp-sc">{{ it.scale2 }}</span>
</div> </div>
</div> </div>
@ -294,9 +286,9 @@
</template> </template>
<script> <script>
import debounce from "lodash.debounce"; import debounce from 'lodash.debounce'
import "@/components/tower-crane-value-1"; import '@/components/tower-crane-value-1'
import "@/components/tower-crane-value-2"; import '@/components/tower-crane-value-2'
export default { export default {
data() { data() {
return { return {
@ -311,29 +303,29 @@ export default {
towerConfigList: [], towerConfigList: [],
towerConfigStat: { a0: 0, b0: 0, c0: 0, a1: 0, b1: 0, c1: 0 }, towerConfigStat: { a0: 0, b0: 0, c0: 0, a1: 0, b1: 0, c1: 0 },
runData: { runData: {
height: "0", height: '0',
range: "0", range: '0',
rotation: "0", rotation: '0',
load: "0", load: '0',
windSpeed: "0", windSpeed: '0',
leanAngleX: "0", leanAngleX: '0',
leanAngleY: "0", leanAngleY: '0',
loadPercent: "0", loadPercent: '0',
momentPercent: "0", momentPercent: '0',
windSpeedPercent: "0", windSpeedPercent: '0',
warnings: null, warnings: null,
}, },
selDev: {}, selDev: {},
devBottomInfo: [ devBottomInfo: [
{ title: "幅度", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '幅度', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
{ title: "风速", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '风速', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
{ title: "吊重", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '吊重', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
{ title: "倾角", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '倾角', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
{ title: "转角", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '转角', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
{ title: "高度", data1: 0, data2: 0, scale1: "0", scale2: "0m" }, { title: '高度', data1: 0, data2: 0, scale1: '0', scale2: '0m' },
], ],
direction: "right", direction: 'right',
comName: "tower-crane-value-1", comName: 'tower-crane-value-1',
warningData: [], warningData: [],
momentData: {}, momentData: {},
forIndex: 0, forIndex: 0,
@ -347,287 +339,289 @@ export default {
} }
}, },
mounted() { mounted() {
window.safetyApp = this; window.safetyApp = this
this.$store.dispatch('ChangeNav', 304); this.$store.dispatch('ChangeNav', 304)
this.$bus.$on('projectChange', prj => { this.$bus.$on('projectChange', (prj) => {
this.selProject = prj; this.selProject = prj
this.init(); this.init()
}); })
this.selProject = this.$store.getters.selProject; this.selProject = this.$store.getters.selProject
this.init(); this.init()
this.dpi = this.$dpi(); this.dpi = this.$dpi()
this.resize(); this.resize()
window.addEventListener("resize", () => { window.addEventListener('resize', () => {
if (this.dpi != this.$dpi()) { if (this.dpi != this.$dpi()) {
this.dpi = this.$dpi(); this.dpi = this.$dpi()
this.resize(); this.resize()
} }
})
}); this.$api.dict('ssp_proble_sub_type').then((d) => {
this.$api.dict("ssp_proble_sub_type").then((d) => { this.dangerTypeDict = d || []
this.dangerTypeDict = d || []; })
});
this.momentData = JSON.parse( this.momentData = JSON.parse(
'{"point":[[null,null]],"dataX":[15,20,25,30,35,40,45,50,55,60],"dataY":[3,3,3,3,2.59,2.2,1.9,1.66,1.46,1.3]}' '{"point":[[null,null]],"dataX":[15,20,25,30,35,40,45,50,55,60],"dataY":[3,3,3,3,2.59,2.2,1.9,1.66,1.46,1.3]}'
); )
}, },
created() { created() {
this.$api.dict("device_tower_warning").then((d) => { this.$api.dict('device_tower_warning').then((d) => {
this.dicts = d || []; this.dicts = d || []
console.log("---->", this.dicts); console.log('---->', this.dicts)
}); })
}, },
methods: { methods: {
resize() { resize() {
this.chart1Key++; this.chart1Key++
this.itemChartKey1++; this.itemChartKey1++
let is1K = this.$dpi() == "1K"; let is1K = this.$dpi() == '1K'
let is2K = this.$dpi() == "2K"; let is2K = this.$dpi() == '2K'
this.tbHeight = is1K ? 290 : is2K ? 410 : 770; this.tbHeight = is1K ? 290 : is2K ? 410 : 770
}, },
init() { init() {
if (!this.selProject) { if (!this.selProject) {
return; return
} }
this.initTowerConfigView(); this.initTowerConfigView()
this.initTowerConfigList(); this.initTowerConfigList()
}, },
getRoudValue(a, b) { getRoudValue(a, b) {
if (a > 0) { if (a > 0) {
return (parseFloat(a / b) * 100).toFixed(1) + "%"; return (parseFloat(a / b) * 100).toFixed(1) + '%'
} else { } else {
return "0%"; return '0%'
} }
}, },
initTowerConfigView() { initTowerConfigView() {
let postData = { let postData = {
comId: this.selProject.comId, comId: this.selProject.comId,
projectId: this.selProject.id, projectId: this.selProject.id,
}; }
this.$api.tower.findTowerConfigGroupOnline(postData).then((d) => { this.$api.tower.findTowerConfigGroupOnline(postData).then((d) => {
let list = []; let list = []
let total = 0; let total = 0
if (d.data && d.data.length > 0) { if (d.data && d.data.length > 0) {
d.data.forEach((datum) => { d.data.forEach((datum) => {
total += datum.total; total += datum.total
if (datum.online == 1) { if (datum.online == 1) {
list.push({ text: "在线数量", value: datum.total }); list.push({ text: '在线数量', value: datum.total })
if (d.data.length == 1) { if (d.data.length == 1) {
list.push({ text: "离线数量", value: 0 }); list.push({ text: '离线数量', value: 0 })
} }
} else { } else {
list.push({ text: "离线数量", value: datum.total }); list.push({ text: '离线数量', value: datum.total })
} }
}); })
} }
this.towerTotalNum = total; this.towerTotalNum = total
this.towerConfigView = list; this.towerConfigView = list
}); })
}, },
initTowerConfigList() { initTowerConfigList() {
let postData = { let postData = {
comdId: this.selProject.comId, comdId: this.selProject.comId,
projectId: this.selProject.id, projectId: this.selProject.id,
}; }
this.$api.tower.findTowerConfigListByProjectId(postData).then((d) => { this.$api.tower.findTowerConfigListByProjectId(postData).then((d) => {
this.towerConfigList = d.data || []; this.towerConfigList = d.data || []
if (d.data.length > 0) { if (d.data.length > 0) {
this.initSelDev(this.index); this.initSelDev(this.index)
} else { } else {
this.runData.height = "0"; this.runData.height = '0'
this.runData.range = "0"; this.runData.range = '0'
this.runData.rotation = "0"; this.runData.rotation = '0'
this.runData.load = "0"; this.runData.load = '0'
this.runData.windSpeed = "0"; this.runData.windSpeed = '0'
this.runData.leanAngleX = "0"; this.runData.leanAngleX = '0'
this.runData.leanAngleY = "0"; this.runData.leanAngleY = '0'
this.runData.loadPercent = "0"; this.runData.loadPercent = '0'
this.runData.momentPercent = "0"; this.runData.momentPercent = '0'
this.runData.windSpeedPercent = "0"; this.runData.windSpeedPercent = '0'
this.runData.warnings = null; this.runData.warnings = null
this.devBottomInfo[0].data1 = 0; this.devBottomInfo[0].data1 = 0
this.devBottomInfo[1].data1 = 0; this.devBottomInfo[1].data1 = 0
this.devBottomInfo[2].data1 = 0; this.devBottomInfo[2].data1 = 0
this.devBottomInfo[3].data1 = 0; this.devBottomInfo[3].data1 = 0
this.devBottomInfo[4].data1 = 0; this.devBottomInfo[4].data1 = 0
this.devBottomInfo[5].data1 = 0; this.devBottomInfo[5].data1 = 0
this.devBottomInfo[0].data2 = 0; this.devBottomInfo[0].data2 = 0
this.devBottomInfo[1].data2 = 0; this.devBottomInfo[1].data2 = 0
this.devBottomInfo[2].data2 = 0; this.devBottomInfo[2].data2 = 0
this.devBottomInfo[3].data2 = 0; this.devBottomInfo[3].data2 = 0
this.devBottomInfo[4].data2 = 0; this.devBottomInfo[4].data2 = 0
this.devBottomInfo[5].data2 = 0; this.devBottomInfo[5].data2 = 0
this.towerConfigStat.a0 = 0; this.towerConfigStat.a0 = 0
this.towerConfigStat.b0 = 0; this.towerConfigStat.b0 = 0
this.towerConfigStat.c0 = 0; this.towerConfigStat.c0 = 0
this.towerConfigStat.a1 = 0; this.towerConfigStat.a1 = 0
this.towerConfigStat.b1 = 0; this.towerConfigStat.b1 = 0
this.towerConfigStat.c1 = 0; this.towerConfigStat.c1 = 0
this.warningData = []; this.warningData = []
this.selDev = { deviceName: "未找到设备", frontBrachium: 0, afterBrachium: 0 }; this.selDev = { deviceName: '未找到设备', frontBrachium: 0, afterBrachium: 0 }
} }
}); })
}, },
dic(ds, value) { dic(ds, value) {
if (value.split(",").indexOf(ds) > -1) { if (value.split(',').indexOf(ds) > -1) {
return true; return true
} else { } else {
return false return false
} }
}, },
initSelDev(n) { initSelDev(n) {
this.selDev = this.towerConfigList[this.index]; this.selDev = this.towerConfigList[this.index]
this.initLimitData(); this.initLimitData()
this.initRunData(); this.initRunData()
// //
clearInterval(this.warningInterval); clearInterval(this.warningInterval)
this.warningInterval = setInterval(this.initRunData, 60000); this.warningInterval = setInterval(this.initRunData, 60000)
this.initCountData(); this.initCountData()
clearInterval(this.countvwInterval); clearInterval(this.countvwInterval)
this.countvwInterval = setInterval(this.initCountData, 60000); this.countvwInterval = setInterval(this.initCountData, 60000)
}, },
initCountData() { initCountData() {
this.$api.tower.findTowerStatisticsView(this.selDev.deviceSn).then((d) => { this.$api.tower.findTowerStatisticsView(this.selDev.deviceSn).then((d) => {
this.towerConfigStat = d.data || []; this.towerConfigStat = d.data || []
}); })
}, },
initLimitData() { initLimitData() {
this.$api.tower.selectDevTowerDataLimitList(this.selDev.deviceSn).then((d) => { this.$api.tower.selectDevTowerDataLimitList(this.selDev.deviceSn).then((d) => {
this.devBottomInfo[0].data2 = d.data[0].rangeLimitStart; if (d.length > 0) {
this.devBottomInfo[1].data2 = d.data[0].windSpeedWarning; this.devBottomInfo[0].data2 = d.data[0].rangeLimitStart
this.devBottomInfo[2].data2 = d.data[0].loadWarning; this.devBottomInfo[1].data2 = d.data[0].windSpeedWarning
this.devBottomInfo[3].data2 = d.data[0].leanWarning; this.devBottomInfo[2].data2 = d.data[0].loadWarning
this.devBottomInfo[4].data2 = d.data[0].rotationLimitStart; this.devBottomInfo[3].data2 = d.data[0].leanWarning
this.devBottomInfo[5].data2 = d.data[0].highLimitWarning; this.devBottomInfo[4].data2 = d.data[0].rotationLimitStart
}); this.devBottomInfo[5].data2 = d.data[0].highLimitWarning
}
})
}, },
initRunData() { initRunData() {
this.$api.tower.selectDevTowerDataRunList(this.selDev.deviceSn).then((d) => { this.$api.tower.selectDevTowerDataRunList(this.selDev.deviceSn).then((d) => {
if (d.data.length > 0) { if (d.data.length > 0) {
this.runData.height = d.data[0].height; this.runData.height = d.data[0].height
this.runData.range = d.data[0].range; this.runData.range = d.data[0].range
this.runData.rotation = d.data[0].rotation; this.runData.rotation = d.data[0].rotation
this.runData.load = d.data[0].load; this.runData.load = d.data[0].load
this.runData.windSpeed = d.data[0].windSpeed; this.runData.windSpeed = d.data[0].windSpeed
this.runData.leanAngleX = d.data[0].leanAngleX; this.runData.leanAngleX = d.data[0].leanAngleX
this.runData.leanAngleY = d.data[0].leanAngleY; this.runData.leanAngleY = d.data[0].leanAngleY
this.runData.loadPercent = d.data[0].loadPercent; this.runData.loadPercent = d.data[0].loadPercent
this.runData.momentPercent = d.data[0].momentPercent; this.runData.momentPercent = d.data[0].momentPercent
this.runData.windSpeedPercent = d.data[0].windSpeedPercent; this.runData.windSpeedPercent = d.data[0].windSpeedPercent
this.runData.warnings = d.data[0].warnings; this.runData.warnings = d.data[0].warnings
this.devBottomInfo[0].data1 = d.data[0].range; this.devBottomInfo[0].data1 = d.data[0].range
this.devBottomInfo[1].data1 = d.data[0].windSpeed; this.devBottomInfo[1].data1 = d.data[0].windSpeed
this.devBottomInfo[2].data1 = d.data[0].load; this.devBottomInfo[2].data1 = d.data[0].load
this.devBottomInfo[3].data1 = d.data[0].leanAnglePercent this.devBottomInfo[3].data1 = d.data[0].leanAnglePercent ? d.data[0].leanAnglePercent : 0
? d.data[0].leanAnglePercent this.devBottomInfo[4].data1 = d.data[0].rotation
: 0; this.devBottomInfo[5].data1 = d.data[0].height
this.devBottomInfo[4].data1 = d.data[0].rotation;
this.devBottomInfo[5].data1 = d.data[0].height;
} }
this.warningData = d.data || []; this.warningData = d.data || []
}); })
}, },
calcTop(d) { calcTop(d) {
let tmp = 100 - (d.data2 * 100.0) / d.data1; let tmp = 100 - (d.data2 * 100.0) / d.data1
return `top:calc(20px + ${tmp > 78 ? 78 : tmp}%)`; return `top:calc(20px + ${tmp > 78 ? 78 : tmp}%)`
}, },
getRoudValue(a, b) { getRoudValue(a, b) {
if (a > 0) { if (a > 0) {
return (parseFloat(a / b) * 100).toFixed(1) + "%"; return (parseFloat(a / b) * 100).toFixed(1) + '%'
} else { } else {
return "0%"; return '0%'
} }
}, },
safeTowerLeft() { safeTowerLeft() {
this.direction = "left"; this.direction = 'left'
this.automaticRoll(); this.automaticRoll()
}, },
safeTowerRight() { safeTowerRight() {
// //
this.direction = "right"; this.direction = 'right'
this.automaticRoll(); this.automaticRoll()
}, },
automaticRoll() { automaticRoll() {
// //
if (this.direction == "right") { if (this.direction == 'right') {
if (this.index == this.towerConfigList.length - 1) { if (this.index == this.towerConfigList.length - 1) {
this.index = 0; this.index = 0
} else { } else {
this.index = this.index + 1; this.index = this.index + 1
} }
} else { } else {
if (this.index == 0) { if (this.index == 0) {
this.index = this.towerConfigList.length - 1; this.index = this.towerConfigList.length - 1
} else { } else {
this.index = this.index - 1; this.index = this.index - 1
} }
} }
this.selDev = this.towerConfigList[this.index]; this.selDev = this.towerConfigList[this.index]
var height = $(".list-for").innerHeight(); var height = $('.list-for').innerHeight()
$("#listMin").animate({ scrollTop: height * this.index + "px" }); $('#listMin').animate({ scrollTop: height * this.index + 'px' })
}, },
onTowerCraneList(n) { onTowerCraneList(n) {
this.index = n; this.index = n
this.selDev = this.towerConfigList[this.index]; this.selDev = this.towerConfigList[this.index]
this.initLimitData(); this.initLimitData()
this.initCountData(); this.initCountData()
// //
this.direction = "right"; this.direction = 'right'
}, },
safeAutomaticRoll() { safeAutomaticRoll() {
var height = $(".safe-afoot-overflow").innerHeight(); var height = $('.safe-afoot-overflow').innerHeight()
console.log(height); console.log(height)
if (this.forIndex == this.warningData.length) { if (this.forIndex == this.warningData.length) {
this.forIndex = 0; this.forIndex = 0
} else { } else {
this.forIndex = this.forIndex + 1; this.forIndex = this.forIndex + 1
} }
$("#afootOverflow").animate({ scrollTop: height * this.forIndex + "px" }); $('#afootOverflow').animate({ scrollTop: height * this.forIndex + 'px' })
}, },
warningListMinMouseover() { warningListMinMouseover() {
clearInterval(this.warningInterval); clearInterval(this.warningInterval)
}, },
warningListMinMouseout() { warningListMinMouseout() {
this.warningInterval = setInterval(this.safeAutomaticRoll, 10000); this.warningInterval = setInterval(this.safeAutomaticRoll, 10000)
}, },
renderDataItem2(o) { renderDataItem2(o) {
let data = this.momentData; let data = this.momentData
var color = '#20bc00' var color = '#20bc00'
var Xmax = Math.max.apply(null, data.dataX); var Xmax = Math.max.apply(null, data.dataX)
var Ymax = Math.max.apply(null, data.dataY); var Ymax = Math.max.apply(null, data.dataY)
let is1K = this.$dpi() == "1K"; let is1K = this.$dpi() == '1K'
let is2K = this.$dpi() == "2K"; let is2K = this.$dpi() == '2K'
let option = { let option = {
tooltip: { tooltip: {
position: "top", position: 'top',
formatter: function (params) { formatter: function (params) {
var fd = params.data[0]; var fd = params.data[0]
var dz = params.data[1] var dz = params.data[1]
res = '<div style="padding: 5px 10px;">' + res =
'<div style="padding-bottom: 5px;">幅度:<span>' + fd + '</span> m</div>' + '<div style="padding: 5px 10px;">' +
'<div>吊重:<span>' + dz + '</span> t</div>' + '<div style="padding-bottom: 5px;">幅度:<span>' +
fd +
'</span> m</div>' +
'<div>吊重:<span>' +
dz +
'</span> t</div>' +
'</div>' '</div>'
return res return res
}, },
}, },
grid: { grid: {
top: "20%", top: '20%',
right: "15%", right: '15%',
left: "4%", left: '4%',
bottom: "5%", bottom: '5%',
containLabel: true containLabel: true,
}, },
xAxis: [ xAxis: [
{ {
type: "value", type: 'value',
name: '幅度/m', name: '幅度/m',
max: 60, max: 60,
nameTextStyle: { nameTextStyle: {
color: "#c5d9fc", color: '#c5d9fc',
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
splitLine: { splitLine: {
//线 //线
@ -637,32 +631,31 @@ export default {
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
color: "#c5d9fc", color: '#c5d9fc',
margin: 20, margin: 20,
fontSize: 30 fontSize: 30,
}, },
}, },
}, },
{ {
type: "category", type: 'category',
boundaryGap: false, boundaryGap: false,
position: "bottom", position: 'bottom',
axisLine: { axisLine: {
//线x //线x
show: true, show: true,
lineStyle: { lineStyle: {
color: "#194e92", color: '#194e92',
type: "dashed", type: 'dashed',
}, },
}, },
axisLabel: { axisLabel: {
show: false, show: false,
// //
textStyle: { textStyle: {
color: "#c5d9fc", color: '#c5d9fc',
margin: 20, margin: 20,
fontSize: 30 fontSize: 30,
}, },
}, },
data: data.dataX, data: data.dataX,
@ -672,11 +665,11 @@ export default {
{ {
name: '吊重/t', name: '吊重/t',
nameTextStyle: { nameTextStyle: {
color: "#c5d9fc", color: '#c5d9fc',
fontSize: is1K ? 12 : is2K ? 14 : 24 fontSize: is1K ? 12 : is2K ? 14 : 24,
}, },
max: Ymax + 1, max: Ymax + 1,
type: "value", type: 'value',
splitNumber: 7, splitNumber: 7,
splitLine: { splitLine: {
show: false, show: false,
@ -685,15 +678,15 @@ export default {
//线x //线x
show: true, show: true,
lineStyle: { lineStyle: {
color: "#194e92", color: '#194e92',
type: "dashed", type: 'dashed',
}, },
}, },
axisLabel: { axisLabel: {
margin: 20, margin: 20,
textStyle: { textStyle: {
color: "#c5d9fc", color: '#c5d9fc',
fontSize: is1K ? 12 : is2K ? 14 : 18 fontSize: is1K ? 12 : is2K ? 14 : 18,
}, },
}, },
axisTick: { show: false }, axisTick: { show: false },
@ -701,33 +694,33 @@ export default {
], ],
series: [ series: [
{ {
name: "吊重", name: '吊重',
type: "effectScatter", type: 'effectScatter',
rippleEffect: { // rippleEffect: {
color: 'purple', // , //
color: 'purple', // ,
brushType: 'fill', // ,线,'stroke' 'fill' brushType: 'fill', // ,线,'stroke' 'fill'
period: 2, // period: 2, //
scale: '3', // scale: '3', //
}, },
xAxisIndex: 0, xAxisIndex: 0,
yAxisIndex: 0, yAxisIndex: 0,
symbolSize: 15, // symbolSize: 15, //
itemStyle: { itemStyle: {
color: color, color: color,
}, },
data: data.point, data: data.point,
}, },
{ {
type: "line", type: 'line',
symbol: "none", symbol: 'none',
smooth: true, smooth: true,
xAxisIndex: 1, xAxisIndex: 1,
yAxisIndex: 0, yAxisIndex: 0,
lineStyle: { lineStyle: {
normal: { normal: {
width: 3, width: 3,
color: "#5968db", // 线 color: '#5968db', // 线
}, },
}, },
areaStyle: { areaStyle: {
@ -740,22 +733,22 @@ export default {
0, 0,
1, 1,
[ [
{ offset: 0, color: "rgb(25,43,115,0.9)" }, { offset: 0, color: 'rgb(25,43,115,0.9)' },
{ offset: 0.7, color: "rgba(25,43,115, 0)" }, { offset: 0.7, color: 'rgba(25,43,115, 0)' },
], ],
false false
), ),
shadowColor: "rgba(25,43,115, 1)", // shadowColor: 'rgba(25,43,115, 1)', //
}, },
}, },
data: data.dataY, data: data.dataY,
}, },
], ],
}; }
return option; return option
} },
} },
} }
</script> </script>
@ -779,13 +772,13 @@ export default {
&.czz-number-img-blue { &.czz-number-img-blue {
.svg-icon { .svg-icon {
fill: #1e90ff fill: #1e90ff;
} }
} }
&.czz-number-img-green { &.czz-number-img-green {
.svg-icon { .svg-icon {
fill: ForestGreen fill: ForestGreen;
} }
} }
} }
@ -847,7 +840,6 @@ export default {
} }
} }
} }
} }
.dev-row2 { .dev-row2 {
@ -1062,7 +1054,6 @@ export default {
width: 50px; width: 50px;
height: 50px; height: 50px;
} }
} }
.p-label { .p-label {
@ -1137,7 +1128,6 @@ export default {
margin-left: 4px; margin-left: 4px;
} }
} }
} }
} }
} }
@ -1175,7 +1165,6 @@ export default {
} }
.safe-tower-content-data { .safe-tower-content-data {
.safe-tower-icon { .safe-tower-icon {
transform: scale(1.5); transform: scale(1.5);
position: relative; position: relative;
@ -1188,10 +1177,7 @@ export default {
padding: 30px 5px; padding: 30px 5px;
} }
} }
} }
} }
.analyse-map { .analyse-map {
@ -1294,7 +1280,6 @@ export default {
width: 80px; width: 80px;
height: 80px; height: 80px;
} }
} }
.p-label { .p-label {
@ -1369,7 +1354,6 @@ export default {
margin-left: 4px; margin-left: 4px;
} }
} }
} }
} }
} }
@ -1407,7 +1391,6 @@ export default {
} }
.safe-tower-content-data { .safe-tower-content-data {
.safe-tower-icon { .safe-tower-icon {
transform: scale(2.5); transform: scale(2.5);
position: relative; position: relative;
@ -1420,7 +1403,6 @@ export default {
padding: 60px 5px; padding: 60px 5px;
} }
} }
} }
} }
@ -1506,6 +1488,5 @@ export default {
} }
} }
} }
} }
</style> </style>