|
@@ -65,7 +65,10 @@
|
|
<el-row class="rightTopNumber">
|
|
<el-row class="rightTopNumber">
|
|
<span>
|
|
<span>
|
|
同比:{{proptionList.find(val=>val.type === '火灾') && (proptionList.find(val=>val.type === '火灾').radio * 100).toFixed(2) || 0}}%
|
|
同比:{{proptionList.find(val=>val.type === '火灾') && (proptionList.find(val=>val.type === '火灾').radio * 100).toFixed(2) || 0}}%
|
|
- <span :style="{color: proptionList.find(val=>val.type === '火灾') && proptionList.find(val=>val.type === '火灾').sameStatus === 2 ? 'green' : 'red'}">{{proptionList.find(val=>val.type === '火灾') && proptionList.find(val=>val.type === '火灾').sameStatus === 2 ? '↓' : proptionList.find(val=>val.type === '火灾') && proptionList.find(val=>val.type === '火灾').sameStatus === 2?'↑':''}}</span>
|
|
|
|
|
|
+ <span :style="{color: proptionList.find(val=>val.type === '火灾') && proptionList.find(val=>val.type === '火灾').sameStatus === 2 ? 'green' : 'red'}">
|
|
|
|
+ <i class="iconfont" v-if="proptionList.find(val=>val.type === '火灾')"
|
|
|
|
+ :class="proptionList.find(val=>val.type === '火灾').sameStatus === 1 ? 'icon-arrowTop-fill' : proptionList.find(val=>val.type === '火灾').sameStatus === 2 ? 'icon-xiajiantou-' : ''"></i>
|
|
|
|
+ </span>
|
|
</span>
|
|
</span>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
@@ -77,7 +80,10 @@
|
|
<el-row class="rightTopNumber">
|
|
<el-row class="rightTopNumber">
|
|
<span>
|
|
<span>
|
|
同比:{{proptionList.find(val=>val.type === '社会救助') && (proptionList.find(val=>val.type === '社会救助').radio * 100).toFixed(2) || 0}}%
|
|
同比:{{proptionList.find(val=>val.type === '社会救助') && (proptionList.find(val=>val.type === '社会救助').radio * 100).toFixed(2) || 0}}%
|
|
- <span :style="{color: proptionList.find(val=>val.type === '社会救助') && proptionList.find(val=>val.type === '社会救助').sameStatus === 2 ? 'green' : 'red'}">{{proptionList.find(val=>val.type === '社会救助') && proptionList.find(val=>val.type === '社会救助').sameStatus === 2 ? '↓' : proptionList.find(val=>val.type === '社会救助') && proptionList.find(val=>val.type === '社会救助').sameStatus === 2?'↑':''}}</span>
|
|
|
|
|
|
+ <span :style="{color: proptionList.find(val=>val.type === '社会救助') && proptionList.find(val=>val.type === '社会救助').sameStatus === 2 ? 'green' : 'red'}">
|
|
|
|
+ <i class="iconfont" v-if="proptionList.find(val=>val.type === '社会救助')"
|
|
|
|
+ :class="proptionList.find(val=>val.type === '社会救助').sameStatus === 1 ? 'icon-arrowTop-fill' : proptionList.find(val=>val.type === '社会救助').sameStatus === 2 ? 'icon-xiajiantou-' : ''"></i>
|
|
|
|
+ </span>
|
|
</span>
|
|
</span>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
@@ -89,7 +95,10 @@
|
|
<el-row class="rightTopNumber">
|
|
<el-row class="rightTopNumber">
|
|
<span>
|
|
<span>
|
|
同比:{{proptionList.find(val=>val.type === '抢险救援') && (proptionList.find(val=>val.type === '抢险救援').radio * 100).toFixed(2) || 0}}%
|
|
同比:{{proptionList.find(val=>val.type === '抢险救援') && (proptionList.find(val=>val.type === '抢险救援').radio * 100).toFixed(2) || 0}}%
|
|
- <span :style="{color: proptionList.find(val=>val.type === '抢险救援') && proptionList.find(val=>val.type === '抢险救援').sameStatus === 2 ? 'green' : 'red'}">{{proptionList.find(val=>val.type === '抢险救援') && proptionList.find(val=>val.type === '抢险救援').sameStatus === 2 ? '↓' : proptionList.find(val=>val.type === '抢险救援') && proptionList.find(val=>val.type === '抢险救援').sameStatus === 2?'↑':''}}</span>
|
|
|
|
|
|
+ <span :style="{color: proptionList.find(val=>val.type === '抢险救援') && proptionList.find(val=>val.type === '抢险救援').sameStatus === 2 ? 'green' : 'red'}">
|
|
|
|
+ <i class="iconfont" v-if="proptionList.find(val=>val.type === '抢险救援')"
|
|
|
|
+ :class="proptionList.find(val=>val.type === '抢险救援').sameStatus === 1 ? 'icon-arrowTop-fill' : proptionList.find(val=>val.type === '抢险救援').sameStatus === 2 ? 'icon-xiajiantou-' : ''"></i>
|
|
|
|
+ </span>
|
|
</span>
|
|
</span>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
</el-row>
|
|
@@ -112,7 +121,7 @@
|
|
:key="item.prop"
|
|
:key="item.prop"
|
|
:prop="item.prop"
|
|
:prop="item.prop"
|
|
align="center"
|
|
align="center"
|
|
- min-width="20"
|
|
|
|
|
|
+ :min-width="item.prop === 'type' && 30 || item.prop === 'zhongdui' && 40"
|
|
:label="item.name"
|
|
:label="item.name"
|
|
>
|
|
>
|
|
<template v-if="item.prop === 'type'" #default="scope">
|
|
<template v-if="item.prop === 'type'" #default="scope">
|
|
@@ -155,31 +164,38 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<template>
|
|
<template>
|
|
- <i class="iconfont icon-icon-test" v-if="item.prop === 'type'"></i>
|
|
|
|
|
|
+ <i class="iconfont"
|
|
|
|
+ :class="{
|
|
|
|
+ 'icon-icon-test' : scope.row['ajlxdm'] == 1,
|
|
|
|
+ 'icon-jiuyuan': scope.row['ajlxdm'] == 2,
|
|
|
|
+ 'icon-minzhengtubiao1-08':scope.row['ajlxdm'] == 3,
|
|
|
|
+ }"
|
|
|
|
+ :style="{color: scope.row['ajdj'] == '零级' ? 'green' : scope.row['ajdj'] == '一级' ? '#eec10d' : scope.row['ajdj'] == '二级' ? '#ff730c' : scope.row['ajdj'] == '三级' ? '#ff0012' : '#2e98f2'}"
|
|
|
|
+ v-if="item.prop === 'type'"></i>
|
|
<div class="name-wrapper" v-else>{{ scope.row[item.prop] }}</div>
|
|
<div class="name-wrapper" v-else>{{ scope.row[item.prop] }}</div>
|
|
</template>
|
|
</template>
|
|
</el-tooltip>
|
|
</el-tooltip>
|
|
</template>
|
|
</template>
|
|
<template v-else #default="scope">
|
|
<template v-else #default="scope">
|
|
- {{ item.prop === 'type' ? '' : (item.prop === 'status' ? (scope.row[item.prop] == 1 ? '可用' : '不可用') : scope.row[item.prop])}}
|
|
|
|
|
|
+ {{ item.prop === 'type' ? '' : item.prop === 'lasj' ? scope.row[item.prop] && scope.row[item.prop].slice(5) : item.prop === 'afdz' ? scope.row[item.prop].replace(new RegExp("闵行区 ",""),"") : item.prop === 'status' ? (scope.row[item.prop] == 1 ? '可用' : '不可用') : scope.row[item.prop]}}
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
- <el-card class="box-card" v-if="isVideo">
|
|
|
|
- <template #header>
|
|
|
|
- <div class="card-header">
|
|
|
|
- <span>实时视频</span>
|
|
|
|
- <i class="el-icon-close" @click="isVideo = false"></i>
|
|
|
|
- </div>
|
|
|
|
- </template>
|
|
|
|
- <!-- <img src="~@a/img/test/car.png" alt=""> -->
|
|
|
|
- <!-- controls -->
|
|
|
|
- <video src="~@a/img/test/card.mp4" class="videoBox" autoplay height="auto"></video>
|
|
|
|
- <!-- <video-player class="video-player vjs-custom-skin"
|
|
|
|
- ref="videoPlayer"
|
|
|
|
- :playsinline="true"
|
|
|
|
- :options="playerOptions">
|
|
|
|
- </video-player> -->
|
|
|
|
|
|
+ <el-card class="box-card" v-if="isVideo">
|
|
|
|
+ <template #header>
|
|
|
|
+ <div class="card-header">
|
|
|
|
+ <span>实时视频</span>
|
|
|
|
+ <i class="el-icon-close" @click="isVideo = false"></i>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+ <!-- <img src="~@a/img/test/car.png" alt=""> -->
|
|
|
|
+ <!-- controls -->
|
|
|
|
+ <video src="~@a/img/test/card.mp4" class="videoBox" autoplay height="auto"></video>
|
|
|
|
+ <!-- <video-player class="video-player vjs-custom-skin"
|
|
|
|
+ ref="videoPlayer"
|
|
|
|
+ :playsinline="true"
|
|
|
|
+ :options="playerOptions">
|
|
|
|
+ </video-player> -->
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
</el-col>
|
|
</el-col>
|
|
@@ -192,7 +208,8 @@ import barChart from "@c/bar";
|
|
import lineSmooth from "@c/line-smooth";
|
|
import lineSmooth from "@c/line-smooth";
|
|
import gauge from "@c/gauge";
|
|
import gauge from "@c/gauge";
|
|
import linstener from "@c/mixins/linstener";
|
|
import linstener from "@c/mixins/linstener";
|
|
-import map from "@c/mixins/map-data";
|
|
|
|
|
|
+// import map from "@c/mixins/map-data";
|
|
|
|
+import map from "@c/mixins/map-gaode";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
export default {
|
|
@@ -202,12 +219,13 @@ export default {
|
|
headerData: [
|
|
headerData: [
|
|
{ prop: "type", name: "类型" },
|
|
{ prop: "type", name: "类型" },
|
|
{ prop: "lasj", name: "立案时间" },
|
|
{ prop: "lasj", name: "立案时间" },
|
|
- { prop: "ajdj", name: "警情等级" },
|
|
|
|
|
|
+ // { prop: "ajdj", name: "警情等级" },
|
|
{ prop: "afdz", name: "案发地址" },
|
|
{ prop: "afdz", name: "案发地址" },
|
|
- { prop: "cdcl", name: "调动车辆" },
|
|
|
|
- { prop: "bcxx", name: "原因" },
|
|
|
|
|
|
+ // { prop: "cdcl", name: "调动车辆" },
|
|
|
|
+ // { prop: "bcxx", name: "原因" },
|
|
|
|
+ { prop: "czdx", name: "处置对象" },
|
|
{ prop: "zhongdui", name: "所属中队" },
|
|
{ prop: "zhongdui", name: "所属中队" },
|
|
- { prop: "ajzt", name: "状况" },
|
|
|
|
|
|
+ // { prop: "ajzt", name: "状况" },
|
|
],
|
|
],
|
|
isVideo:false,
|
|
isVideo:false,
|
|
playerOptions: {
|
|
playerOptions: {
|
|
@@ -322,7 +340,7 @@ export default {
|
|
},
|
|
},
|
|
// 创建标点和点击事件
|
|
// 创建标点和点击事件
|
|
addMarker(lnglats) {
|
|
addMarker(lnglats) {
|
|
- let target = lnglats.map((val, ind) => {
|
|
|
|
|
|
+ let target = lnglats.map((val) => {
|
|
let marker = {
|
|
let marker = {
|
|
id: val.id,
|
|
id: val.id,
|
|
attrbutes: val,
|
|
attrbutes: val,
|
|
@@ -593,6 +611,7 @@ export default {
|
|
padding: 0.1rem 0.2rem;
|
|
padding: 0.1rem 0.2rem;
|
|
font-size: 0.2125rem;
|
|
font-size: 0.2125rem;
|
|
border-radius: 0.1875rem;
|
|
border-radius: 0.1875rem;
|
|
|
|
+ display: flex;
|
|
box-shadow: inset 0 0 0.2rem 0.0125rem #30cfff;
|
|
box-shadow: inset 0 0 0.2rem 0.0125rem #30cfff;
|
|
}
|
|
}
|
|
}
|
|
}
|