安全教育
This commit is contained in:
jxj_gmj
parent
e28b562b84
commit
140a53a773
@ -6,15 +6,15 @@
|
||||
|
||||
<div class="textDivBox">
|
||||
<div class="textDiv">
|
||||
<span>67</span>
|
||||
<span>{{threeLevel.projectWorkerNumber}}</span>
|
||||
<p>项目总人数</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>51</span>
|
||||
<span>{{threeLevel.projectTrainWorkerNumber}}</span>
|
||||
<p>项目培训人数</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>46.79%</span>
|
||||
<span>{{threeLevel.projectTrainRatio}}%</span>
|
||||
<p>项目培训率</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -28,11 +28,14 @@
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<vue-scroll>
|
||||
<div class="row" v-for="i in 20" :key="i">
|
||||
<div class="td">每日安全交底</div>
|
||||
<div class="td">缪维彪</div>
|
||||
<div class="td">45</div>
|
||||
<div class="td">2022-09-28</div>
|
||||
<div class="row" v-for="i in threeLevel.workerSafeEducationList" :key="i.id">
|
||||
<div class="td">{{i.eduCourseName}}</div>
|
||||
<div class="td">{{i.eduTeacher}}</div>
|
||||
<div class="td">{{(i.eduClasshour!=0?i.eduClasshour/60:0)}}</div>
|
||||
<div class="td">{{i.eduTime}}</div>
|
||||
</div>
|
||||
<div class="row" v-if="threeLevel.workerSafeEducationList.length==0">
|
||||
<div style="font-size:14px;color: #999;text-align: center;width: 100%;">暂无数据</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
</div>
|
||||
@ -43,11 +46,11 @@
|
||||
|
||||
<div class="textDivBox">
|
||||
<div class="textDiv">
|
||||
<span>3次</span>
|
||||
<span>{{shouting.allCount}}</span>
|
||||
<p>今日班前喊话次数</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>12</span>
|
||||
<span>{{shouting.todayCount}}</span>
|
||||
<p>班前喊话次数</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -61,11 +64,14 @@
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<vue-scroll>
|
||||
<div class="row" v-for="(item,index) in imgList" :key="index">
|
||||
<div class="td">{{item.time}}</div>
|
||||
<div class="td">{{item.names}}</div>
|
||||
<div class="td">{{item.team}}</div>
|
||||
<div class="td"><img :src="item.src" /></div>
|
||||
<div class="row" v-for="(item,index) in shouting.shoutInfoList" :key="index">
|
||||
<div class="td">{{item.shoutTime}}</div>
|
||||
<div class="td">{{item.dutyUserName}}</div>
|
||||
<div class="td">{{item.teamName}}</div>
|
||||
<div class="td"><img :src="item.shoutImage" /></div>
|
||||
</div>
|
||||
<div class="row" v-if="shouting.shoutInfoList.length==0">
|
||||
<div style="font-size:14px;color: #999;text-align: center;width: 100%;">暂无数据</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
</div>
|
||||
@ -78,21 +84,21 @@
|
||||
安<span style="width:100px;height:100px;border-bottom:1px solid #F56C35;padding:0 0 5px 0">全交</span>底
|
||||
</div>
|
||||
|
||||
<div class="textDivBox">
|
||||
<div class="textDivBox">
|
||||
<div class="textDiv">
|
||||
<span>67次</span>
|
||||
<span>{{safetyDisclosure.trainNumber}}次</span>
|
||||
<p>培训次数</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>23次</span>
|
||||
<span>{{safetyDisclosure.specialOperationsNumber}}次</span>
|
||||
<p>特种作业</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>11次</span>
|
||||
<span>{{safetyDisclosure.disclosureInRainySeasonNumber}}次</span>
|
||||
<p>雨季交底</p>
|
||||
</div>
|
||||
<div class="textDiv">
|
||||
<span>26次</span>
|
||||
<span>{{safetyDisclosure.electricityDisclosureNumber}}次</span>
|
||||
<p>用电交底</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -106,11 +112,14 @@
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<vue-scroll>
|
||||
<div class="row" v-for="i in 20" :key="i">
|
||||
<div class="td">每日安全交底</div>
|
||||
<div class="td">钢筋交底</div>
|
||||
<div class="td">缪维彪</div>
|
||||
<div class="td">2022-09-28</div>
|
||||
<div class="row" v-for="i in safetyDisclosure.workerSafeEducationList" :key="i.id">
|
||||
<div class="td">{{i.eduCourseName}}</div>
|
||||
<div class="td">{{i.eduTypeList[i.eduType]}}</div>
|
||||
<div class="td">{{i.eduTeacher}}</div>
|
||||
<div class="td">{{i.eduTime}}</div>
|
||||
</div>
|
||||
<div class="row" v-if="safetyDisclosure.workerSafeEducationList.length==0">
|
||||
<div style="font-size:14px;color: #999;text-align: center;width: 100%;">暂无数据</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
</div>
|
||||
@ -122,29 +131,60 @@
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import { mapState } from 'vuex'
|
||||
import {getThreeLevelDataByProjectSnApi,getSecurityDataByProjectSnApi,getTodayInfoByProjectSnApi} from '@/assets/js/api/zhongjianFourth'
|
||||
export default {
|
||||
components: {
|
||||
Card
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgList: [
|
||||
{ src:require("../assets/images/common/bg_fmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_wmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_wmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_kmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_fmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_pmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_rmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_dmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_bmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_amk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_nmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
{ src:require("../assets/images/common/bg_nmk.png"),time:"2022-09-28", names:"缪维彪",team:"钢筋班组"},
|
||||
|
||||
]
|
||||
threeLevel:{
|
||||
workerSafeEducationList:[]
|
||||
},
|
||||
safetyDisclosure:{
|
||||
workerSafeEducationList:[]
|
||||
},
|
||||
shouting:{
|
||||
shoutInfoList:[]
|
||||
},
|
||||
eduTypeList:{
|
||||
1:'入场三级教育',2:'定期安全教育',3:'日常安全交底',4:'VR安全教育',5:'班前教育',6:'日常教育（日常违规教育)',7:'每日交底（方案交底）',8:'每日交底（安全技术交底）',9:'每日交底（大工程交底）',10:'入职培训'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['projectSn']),
|
||||
},
|
||||
created() {
|
||||
this.getThreeLevelDataByProjectSn();
|
||||
this.getSecurityDataByProjectSn();
|
||||
this.getTodayInfoByProjectSn();
|
||||
},
|
||||
methods: {
|
||||
// 进场三级交底
|
||||
getThreeLevelDataByProjectSn(){
|
||||
getThreeLevelDataByProjectSnApi({projectSn:this.projectSn}).then(res=>{
|
||||
console.log(res,'getThreeLevelDataByProjectSn')
|
||||
this.threeLevel=res.result;
|
||||
})
|
||||
},
|
||||
//安全交底
|
||||
getSecurityDataByProjectSn(){
|
||||
getSecurityDataByProjectSnApi({projectSn:this.projectSn}).then(res=>{
|
||||
console.log(res,'getThreeLevelDataByProjectSn')
|
||||
this.safetyDisclosure=res.result;
|
||||
})
|
||||
},
|
||||
//班前喊话
|
||||
getTodayInfoByProjectSn(){
|
||||
getTodayInfoByProjectSnApi({projectSn:this.projectSn}).then(res=>{
|
||||
console.log(res,'getTodayInfoByProjectSnApi')
|
||||
this.shouting=res.result;
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -10,12 +10,12 @@
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<vue-scroll>
|
||||
<div class="row" v-for="(item,index) in aiList" :key="index">
|
||||
<div class="row" v-for="(item, index) in aiList" :key="index">
|
||||
<div>
|
||||
<img :src= item.src />
|
||||
<img :src=item.imageUrl />
|
||||
</div>
|
||||
<div class="carNum">{{item.thingType}}</div>
|
||||
<div class="datetime">{{item.time}}</div>
|
||||
<div class="carNum">{{ alarmTypeList[item.thingType] }}</div>
|
||||
<div class="datetime">{{ item.createTime }}</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
</div>
|
||||
@ -25,18 +25,39 @@
|
||||
|
||||
<script>
|
||||
import Card from "../components/Card.vue";
|
||||
import { mapState } from 'vuex'
|
||||
import {
|
||||
|
||||
selectNewPAiListApi
|
||||
} from '@/assets/js/api/zhongjianFourth'
|
||||
export default {
|
||||
components: { Card },
|
||||
data(){
|
||||
return{
|
||||
aiList:[
|
||||
{ src:require("../assets/images/common/bg_smk.png"),thingType:"上班抽烟", time: "2022-01-23 15:30" },
|
||||
{ src:require("../assets/images/common/bg_omk.png"),thingType:"未戴安全帽", time: "2022-01-23 15:30" },
|
||||
{ src:require("../assets/images/common/bg_ymk.png"),thingType:"未穿反光衣", time: "2022-01-23 15:30" },
|
||||
{ src:require("../assets/images/common/bg_ymk.png"),thingType:"未穿反光衣", time: "2022-01-23 15:30" },
|
||||
data() {
|
||||
return {
|
||||
alarmTypeList: {
|
||||
1: '烟感', 2: '明火', 3: '人员倒地', 4: '未戴安全帽', 5: '区域入侵', 6: '越界入侵', 7: '人员聚集衣', 8: '反光衣', 9: '裸土覆盖', 13: '口罩识别', 14: '徘徊预警', 15: '物体滞留监测', 16: '绊线监测'
|
||||
},
|
||||
aiList: [
|
||||
{ imageUrl: require("../assets/images/common/bg_smk.png"), thingType: "3", createTime: "2022-01-23 15:30" },
|
||||
{ imageUrl: require("../assets/images/common/bg_omk.png"), thingType: "2", createTime: "2022-01-23 15:30" },
|
||||
{ imageUrl: require("../assets/images/common/bg_ymk.png"), thingType: "6", createTime: "2022-01-23 15:30" },
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['projectSn']),
|
||||
},
|
||||
created() {
|
||||
this.getSelectNewPAiListApi()
|
||||
},
|
||||
methods: {
|
||||
getSelectNewPAiListApi() {
|
||||
selectNewPAiListApi({ projectSn: this.projectSn, count: 20 }).then(res => {
|
||||
console.log(res, '=============ai分析')
|
||||
this.aiList = res.result.length>0?res.result:this.aiList;
|
||||
})
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -45,32 +66,41 @@ export default {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.thead {
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
color: #59b2c0;
|
||||
}
|
||||
|
||||
.tbody {
|
||||
height: calc(100% - 30px);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
div {
|
||||
text-align: center;
|
||||
|
||||
&:last-child {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 80px;
|
||||
height: 50px;
|
||||
|
||||
@ -3,13 +3,10 @@
|
||||
<div class="charts">
|
||||
<div class="dllm">
|
||||
<div class="woria">
|
||||
<JRingChart
|
||||
:title="{ text: '安全隐患', subTitle: `${todayInspection.totalNum}件`, fontSize: 18 }"
|
||||
<JRingChart :title="{ text: '安全隐患', subTitle: `${safetyPatrolInspection.allTotalNum}件`, fontSize: 18 }"
|
||||
:color="['#6EE4F0', '#E7622A']"
|
||||
:data="[{ value: safetyPeril.rectificationNum, name:'已处理' }, { value: safetyPeril.noRectificationNum, name:'未处理' }]"
|
||||
:radius="['60%', '85%']"
|
||||
:legend="false"
|
||||
/>
|
||||
:data="[{ value: safetyPatrolInspection.allRectificationNum, name: '已处理' }, { value: safetyPatrolInspection.allNoRectificationNum, name: '未处理' }]"
|
||||
:radius="['60%', '85%']" :legend="false" />
|
||||
</div>
|
||||
<div class="legend">
|
||||
<div class="row">
|
||||
@ -17,8 +14,8 @@
|
||||
<span>占比</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span>{{ safetyPeril.rectificationNum || 0 }}</span>
|
||||
<span>{{ safetyPeril.rectificationRatio || 0 }}%</span>
|
||||
<span>{{ safetyPatrolInspection.allRectificationNum || 0 }}</span>
|
||||
<span>{{ safetyPatrolInspection.allRectificationRatio || 0 }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="legend">
|
||||
@ -27,20 +24,17 @@
|
||||
<span>占比</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span>{{ safetyPeril.noRectificationNum || 0 }}</span>
|
||||
<span>{{ safetyPeril.noRectificationRatio || 0 }}%</span>
|
||||
<span>{{ safetyPatrolInspection.allNoRectificationNum || 0 }}</span>
|
||||
<span>{{ safetyPatrolInspection.noRectificationRatio || 0 }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dllm">
|
||||
<div class="woria">
|
||||
<JRingChart
|
||||
:title="{ text: '今日巡检', subTitle: `${todayInspection.totalNum}件`, fontSize: 18 }"
|
||||
<JRingChart :title="{ text: '今日隐患', subTitle: `${safetyPatrolInspection.todayTotalNum}件`, fontSize: 18 }"
|
||||
:color="['#6EE4F0', '#E7622A']"
|
||||
:data="[{ value: todayInspection.rectificationNum, name:'已巡检' }, { value: todayInspection.noRectificationNum, name:'未巡检' }]"
|
||||
:radius="['60%', '85%']"
|
||||
:legend="false"
|
||||
/>
|
||||
:data="[{ value: safetyPatrolInspection.todayRectificationNum, name: '已巡检' }, { value: safetyPatrolInspection.todayNoRectificationRatio, name: '未巡检' }]"
|
||||
:radius="['60%', '85%']" :legend="false" />
|
||||
</div>
|
||||
<div class="legend">
|
||||
<div class="row">
|
||||
@ -48,8 +42,8 @@
|
||||
<span>占比</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span>{{ todayInspection.rectificationNum || 0 }}</span>
|
||||
<span>{{ todayInspection.rectificationRatio || 0 }}%</span>
|
||||
<span>{{ safetyPatrolInspection.todayRectificationNum || 0 }}</span>
|
||||
<span>{{ safetyPatrolInspection.todayRectificationRatio || 0 }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="legend">
|
||||
@ -58,8 +52,8 @@
|
||||
<span>占比</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span>{{ todayInspection.noRectificationNum || 0 }}</span>
|
||||
<span>{{ todayInspection.noRectificationRatio || 0 }}%</span>
|
||||
<span>{{ safetyPatrolInspection.todayNoRectificationRatio || 0 }}</span>
|
||||
<span>{{ safetyPatrolInspection.todayNoRectificationRatio || 0 }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -74,11 +68,15 @@
|
||||
</div>
|
||||
<div class="tbody">
|
||||
<vue-scroll>
|
||||
<div class="row" :class="fmtStatusColor(item.status)" v-for="(item, index) in list" :key="index">
|
||||
<div class="td">{{ fmtType(item.type) }}</div>
|
||||
<div class="td">{{ item.datetime }}</div>
|
||||
<div class="row" :class="fmtStatusColor(item.status)"
|
||||
v-for="(item, index) in safetyPatrolInspection.hiddenDangerInspectRecordList" :key="index">
|
||||
<div class="td">{{ fmtType(item.recordType) }}</div>
|
||||
<div class="td">{{ item.inspectTime }}</div>
|
||||
<div class="td" :class="fmtStatusColor(item.status)">{{ fmtStatus(item.status) }}</div>
|
||||
</div>
|
||||
<div class="row" v-if="safetyPatrolInspection.hiddenDangerInspectRecordList.length == 0">
|
||||
<div style="font-size:14px;color: #999;text-align: center;width: 100%;">暂无数据</div>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
</div>
|
||||
</div>
|
||||
@ -86,10 +84,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
// getSafetyPerilInfo,
|
||||
import {
|
||||
getAllTodayDataHdirApi,
|
||||
getTodayInspectionInfo
|
||||
} from '@/assets/js/api/zhongjianFourth'
|
||||
} from '@/assets/js/api/zhongjianFourth'
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
import Card from '../components/Card.vue'
|
||||
@ -98,6 +96,9 @@ export default {
|
||||
components: { Card, JRingChart },
|
||||
data() {
|
||||
return {
|
||||
safetyPatrolInspection: {
|
||||
hiddenDangerInspectRecordList:[]
|
||||
},
|
||||
// 安全隐患
|
||||
safetyPeril: {
|
||||
rectificationNum: 0,
|
||||
@ -125,12 +126,19 @@ export default {
|
||||
},
|
||||
created() {
|
||||
// this.getSafetyPerilInfo()
|
||||
this.getTodayInspectionInfo()
|
||||
this.getTodayInspectionInfo();
|
||||
this.getAllTodayDataHdir();
|
||||
},
|
||||
computed: {
|
||||
...mapState(['projectSn']),
|
||||
},
|
||||
methods: {
|
||||
getAllTodayDataHdir() {
|
||||
getAllTodayDataHdirApi({ projectSn: this.projectSn }).then(res => {
|
||||
console.log(res, 'getAllTodayDataHdir')
|
||||
this.safetyPatrolInspection = res.result
|
||||
})
|
||||
},
|
||||
// /** 查询安全隐患数据 */
|
||||
// getSafetyPerilInfo() {
|
||||
// getSafetyPerilInfo({ projectSn: this.projectSn }).then(res => {
|
||||
@ -149,13 +157,14 @@ export default {
|
||||
Object.keys(todayInspection).forEach(key => {
|
||||
todayInspection[key] = res.result[key];
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
fmtType(type) {
|
||||
return type === 1 ? '物料堆放' : type === 2 ? '未戴安全帽' : type === 3 ? '未穿反光衣' : '--'
|
||||
return type == 1 ? '隐患问题' : type == 2 ? '排查记录' : ''
|
||||
// return type === 1 ? '物料堆放' : type === 2 ? '未戴安全帽' : type === 3 ? '未穿反光衣' : '--'
|
||||
},
|
||||
fmtStatus(status) {
|
||||
return status === 1 ? '未处理' : status === 2 ? '已处理' : status === 3 ? '整改中' : '--'
|
||||
return status === 1 ? '无需整改' : status === 2 ? '待整改' : status === 3 ? '待复查' : status === 4 ? '合格' : status === 5 ? '不合格' : ''
|
||||
},
|
||||
fmtStatusColor(status) {
|
||||
return status === 1 ? 'orange' : status === 2 ? 'green' : status === 3 ? 'blue' : ''
|
||||
@ -170,19 +179,23 @@ export default {
|
||||
height: 47%;
|
||||
display: flex;
|
||||
color: #fff;
|
||||
|
||||
.dllm {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.woria {
|
||||
width: 100%;
|
||||
height: calc(100% - 92px);
|
||||
}
|
||||
|
||||
.legend {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
@ -190,32 +203,40 @@ export default {
|
||||
left: -10px;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
&:nth-child(2)::before {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-color: #6ee4ef;
|
||||
}
|
||||
|
||||
&:nth-child(3)::before {
|
||||
width: 12px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-color: #e7622a;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
|
||||
span {
|
||||
text-align: center;
|
||||
|
||||
&:first-child {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
@ -226,24 +247,30 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.security-list {
|
||||
margin-top: 3%;
|
||||
height: 48%;
|
||||
color: #fff;
|
||||
|
||||
.thead {
|
||||
color: #6ae3eb;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.tbody {
|
||||
height: calc(100% - 50px);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.row {
|
||||
width: 98%;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
display: flex;
|
||||
|
||||
&.orange {
|
||||
|
||||
//background: linear-gradient(90deg, #356f83, #213c4f);
|
||||
&::before {
|
||||
content: '';
|
||||
@ -252,23 +279,30 @@ export default {
|
||||
// background-color: #67d4d9;
|
||||
}
|
||||
}
|
||||
|
||||
.td {
|
||||
text-align: center;
|
||||
|
||||
&:nth-child(1) {
|
||||
width: 28%;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
width: calc(72% - 80px);
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
&.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
|
||||
&.green {
|
||||
color: #40cdad;
|
||||
}
|
||||
|
||||
&.blue {
|
||||
color: #64ccd9;
|
||||
}
|
||||
|
||||
@ -1,9 +1,33 @@
|
||||
<template>
|
||||
<Card title="设备监控">
|
||||
<div class="devices">
|
||||
<vue-scroll>
|
||||
<div class="device" v-for="i in 5" :key="i">
|
||||
<div class="device-name">空压机{{i}}</div>
|
||||
<div class="">
|
||||
<div class="flex between devList">
|
||||
<div v-for="(item, index) in devList" :key="index" @click="selectDev(item.val,index)" class="devItem">
|
||||
<span :class="selectDevVal==item.val?'that_class':''" >
|
||||
{{ item.tit }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<vue-scroll style="height:calc(100% - 52px)">
|
||||
<!-- ai设备 -->
|
||||
<aiDev v-if="devindex==0" :list="viewlist"></aiDev>
|
||||
<!-- 电箱 -->
|
||||
<electrical :list="viewlist" v-if="(devindex==2)"></electrical>
|
||||
<!-- 绿色设备 -->
|
||||
<environmentDevList :list="viewlist" v-if="(devindex==3)"></environmentDevList>
|
||||
<!-- 升降机 -->
|
||||
<lifterList :list="viewlist" v-if="(devindex==4)"></lifterList>
|
||||
<!-- 塔吊 -->
|
||||
<towerList :list="viewlist" v-if="(devindex==5)"></towerList>
|
||||
<!-- 摄像 -->
|
||||
<videoItemList :list="viewlist" v-if="(devindex==6)"></videoItemList>
|
||||
|
||||
<!-- <div class="device" v-for="i in 5" :key="i">
|
||||
<div class="device-name">空压机{{ i }}</div>
|
||||
<div class="info">
|
||||
<img class="image" src="../assets/images/common/bg_kyj.png" />
|
||||
<div class="detail">
|
||||
@ -15,39 +39,149 @@
|
||||
<div class="detail-item">漏电流：99A</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</vue-scroll>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import { getAllDevApi } from '@/assets/js/api/zhongjianFourth';
|
||||
import { mapState } from 'vuex';
|
||||
import aiDev from './rightTopComponents/aiDevList.vue'
|
||||
import electrical from './rightTopComponents/electrical.vue'
|
||||
import environmentDevList from './rightTopComponents/environmentDevList.vue'
|
||||
import lifterList from './rightTopComponents/lifterList.vue'
|
||||
import towerList from './rightTopComponents/towerList.vue'
|
||||
import videoItemList from './rightTopComponents/videoItemList.vue'
|
||||
import Card from '../components/Card.vue';
|
||||
export default {
|
||||
components: { Card }
|
||||
components: { Card,aiDev,electrical,environmentDevList,lifterList,towerList,videoItemList},
|
||||
data() {
|
||||
return {
|
||||
viewlist:[],
|
||||
devList: [
|
||||
{
|
||||
tit: 'AI设备',
|
||||
val: 1,
|
||||
key:'aiList'
|
||||
},
|
||||
{
|
||||
tit: '车辆',
|
||||
val: 2,
|
||||
key:'carList'
|
||||
},
|
||||
{
|
||||
tit: '电箱',
|
||||
val: 3,
|
||||
key:'electricalDevList',
|
||||
},
|
||||
{
|
||||
tit: '绿色设备',
|
||||
val: 4,
|
||||
key:'environmentDevList',
|
||||
},
|
||||
{
|
||||
tit: '升降机',
|
||||
val: 5,
|
||||
key:'lifterList'
|
||||
},
|
||||
{
|
||||
tit: '塔吊',
|
||||
val: 6,
|
||||
key:'towerList'
|
||||
},
|
||||
{
|
||||
tit: '摄像头',
|
||||
val: 7,
|
||||
key:'videoItemList'
|
||||
},
|
||||
],
|
||||
selectDevVal:1,
|
||||
devindex:0,
|
||||
allDevlist:[]
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['projectSn']),
|
||||
},
|
||||
created() {
|
||||
this.getAllDev();
|
||||
},
|
||||
methods: {
|
||||
selectDev(v,i) {
|
||||
this.selectDevVal = v;
|
||||
this.devindex=i;
|
||||
let key=this.devList[i].key;
|
||||
this.viewlist=this.allDevlist[key]
|
||||
|
||||
},
|
||||
getAllDev() {
|
||||
getAllDevApi({ projectSn: this.projectSn }).then(res => {
|
||||
console.log(res, 'getAllDevApi===========')
|
||||
this.allDevlist=res.result
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.that_class{
|
||||
color: #6EE5F0!important;
|
||||
}
|
||||
.devList {
|
||||
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
height: 40px;
|
||||
|
||||
.devItem {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
height: 176px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
@ -55,12 +189,15 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
|
||||
@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{i.hardwareName}}</div>
|
||||
<div class="info">
|
||||
|
||||
<div class="detail">
|
||||
<div class="detail-item green">状态：{{(i.deviceState==1?'在线':'离线')}}</div>
|
||||
<div class="detail-item grey">标识：{{i.hardwareId}}</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(list.length==0)" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function(){
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{ i.devName }}</div>
|
||||
<div class="info">
|
||||
|
||||
<div class="detail">
|
||||
<div class="detail-item green">状态：{{ i.isClosed == 1 ? '在线' : '离线' }}</div>
|
||||
<div class="detail-item grey">开关状态：{{ i.switchState == 1 ? '开' : '关' }}</div>
|
||||
<div class="detail-item grey">安装单位：{{ i.installCompany }}</div>
|
||||
<div class="detail-item orange">安装地址：{{ i.installAddress }}</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(list.length==0)" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,85 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{i.deviceName}}</div>
|
||||
<div class="info">
|
||||
<!-- <img class="image" src="../../assets/images/common/bg_kyj.png" /> -->
|
||||
<div class="detail">
|
||||
<div class="detail-item green">状态：{{ i.isClosed == 1 ? '在线' : '离线' }}</div>
|
||||
<div class="detail-item grey">是否启用：{{ i.isEnable == 1 ? '是' : '否' }}</div>
|
||||
|
||||
<div class="detail-item orange">安装地址：{{ i.address }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(list.length==0)" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{ i.devName }}</div>
|
||||
<div class="info">
|
||||
<img class="image" :src="i.installationImage" />
|
||||
<div class="detail">
|
||||
<div class="detail-item green">状态：{{ i.devOnline == 1 ? '在线' : '离线' }}</div>
|
||||
<div class="detail-item grey">设备状态：{{devStateList[i.devState]}}</div>
|
||||
<div class="detail-item orange">类型：{{i.elevatorType==0?'单笼':'多笼'}}</div>
|
||||
<div class="detail-item">额定人数:{{i.ratedPeopleNum}}</div>
|
||||
<div class="detail-item">最大载重：{{i.maxLoad}}</div>
|
||||
<div class="detail-item">最大高度：{{i.maxHeight}}</div>
|
||||
<div class="detail-item">承包企业：{{i.generalContractorsName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(list.length==0)" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
devStateList:{
|
||||
1:'设备进场',2:'设备安装',3:'设备验收',4:'设备使用',5:'设备拆除',6:'设备退场'
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{ i.devName }}</div>
|
||||
<div class="info">
|
||||
<img class="image" :src="i.installationImage" />
|
||||
<div class="detail">
|
||||
|
||||
<div class="detail-item grey">设备状态：{{devStateList[i.devState]}}</div>
|
||||
<div class="detail-item orange">类型：{{typeObj[i.type]}}</div>
|
||||
<div class="detail-item">额定人数:{{i.ratedPeopleNum}}</div>
|
||||
<div class="detail-item">最大起重重量：{{i.maxLiftingCapacity}}</div>
|
||||
<div class="detail-item">塔身高度:{{i.maxHeight}}</div>
|
||||
<div class="detail-item">塔节数量:{{i.nodeCount}}</div>
|
||||
<div class="detail-item">承包企业：{{i.generalContractorsName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list.length==0" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
devStateList:{
|
||||
1:'设备进场',2:'设备安装',3:'设备验收',4:'设备使用',5:'设备拆除',6:'设备退场'
|
||||
},
|
||||
typeObj:{
|
||||
1:'塔吊',2:'升降机',3:'龙门吊'
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="device" v-for="i in list" :key="i">
|
||||
<div class="device-name">{{ i.videoName }}</div>
|
||||
<div class="info">
|
||||
<img class="image" :src="i.coverUrl" />
|
||||
<div class="detail">
|
||||
|
||||
<div class="detail-item green">状态：{{ i.deviceState == 1 ? '在线' : '离线' }}</div>
|
||||
<div class="detail-item red">报警总数：{{i.alarmCount}}</div>
|
||||
<div class="detail-item orange">类型：{{deviceTypeObj[i.deviceType]}}</div>
|
||||
<div class="detail-item green">视频类型：{{videoTypeObj[i.videoType]}}</div>
|
||||
|
||||
<div class="detail-item">最大载重：{{i.maxLoad}}</div>
|
||||
<div class="detail-item">AI识别功能：{{(i.aiFunctionType==0?'否':'是')}}</div>
|
||||
|
||||
<div class="detail-item">承包企业：{{i.generalContractorsName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(list.length==0)" style="font-size: 14px;color: #999;text-align: center;margin-top: 120px;">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
deviceTypeObj:{
|
||||
1:'枪机',2:'球机',3:'热成像',4:'单兵',5:'全景',6:'无人机'
|
||||
},
|
||||
videoTypeObj:{
|
||||
1:'萤石云',2:'乐橙',3:'ISC',4:'大华',5:'宇视',6:'国标'
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.devices {
|
||||
padding-left: 20px;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
|
||||
.device {
|
||||
width: 100%;
|
||||
// margin-top: 12px;
|
||||
|
||||
.device-name {
|
||||
// margin-top: 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
line-height: 22px;
|
||||
font-size: 12px;
|
||||
color: #68d8e4;
|
||||
display: flex;
|
||||
|
||||
.image {
|
||||
margin-right: 20px;
|
||||
width: 170px;
|
||||
height: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #46d7b6;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #9da1aa;
|
||||
}
|
||||
.red{
|
||||
color: red;
|
||||
}
|
||||
|
||||
.orange {
|
||||
color: #e7622a;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user