From 3c3a94ebfdcc82cfd8395eb81df143444fbfa80e Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Sat, 07 Jan 2023 16:24:32 +0800
Subject: [PATCH] 首页柱状图样式、警力布局调整、活动样式修改
---
public/img/icon/del.png | 0
public/img/icon/route1.png | 0
src/views/police/index.vue | 2
src/router/axios.js | 4
src/views/layout/index.vue | 71 ++++++++++++++++-------
public/img/icon/arrow.png | 0
src/views/activity/index.vue | 28 ++++++---
src/views/house/index.vue | 1
src/views/home/components/leftContainer.vue | 57 +++++++++---------
9 files changed, 100 insertions(+), 63 deletions(-)
diff --git a/public/img/icon/arrow.png b/public/img/icon/arrow.png
new file mode 100644
index 0000000..3f2f46a
--- /dev/null
+++ b/public/img/icon/arrow.png
Binary files differ
diff --git a/public/img/icon/del.png b/public/img/icon/del.png
new file mode 100644
index 0000000..7a90bdf
--- /dev/null
+++ b/public/img/icon/del.png
Binary files differ
diff --git a/public/img/icon/route1.png b/public/img/icon/route1.png
new file mode 100644
index 0000000..0960fb7
--- /dev/null
+++ b/public/img/icon/route1.png
Binary files differ
diff --git a/src/router/axios.js b/src/router/axios.js
index 3249a70..91f0768 100644
--- a/src/router/axios.js
+++ b/src/router/axios.js
@@ -46,8 +46,8 @@
// config.baseURL = "http://192.168.0.129:18185/api"
} else if (config.requestBaseUrl == "fengt") {
// feng tu 数据
- config.baseURL = "http://10.141.11.11:18080"
- // config.baseURL = "http://192.168.0.112:18080"
+ // config.baseURL = "http://10.141.11.11:18080"
+ config.baseURL = "http://192.168.0.112:18080"
} else if (config.requestBaseUrl == "fengtDS") {
config.baseURL = "http://192.168.0.112:9091"
}
diff --git a/src/views/activity/index.vue b/src/views/activity/index.vue
index 13bdb78..77f5b53 100644
--- a/src/views/activity/index.vue
+++ b/src/views/activity/index.vue
@@ -128,7 +128,7 @@
<ul>
<li>
- <button @click="draw('billboard', 'policeman')">
+ <button @click="draw('billboard', 'policeman')" title="警员">
<img
src="../../../public/img/icon/police-people-btn.png"
style="height:100%"
@@ -136,7 +136,7 @@
</button>
</li>
<li>
- <button @click="draw('billboard', 'policecar')">
+ <button @click="draw('billboard', 'policecar')" title="警车">
<img src="../../../public/img/icon/car-btn.png" style="height:100%" />
</button>
</li>
@@ -150,19 +150,27 @@
<ul>
<li>
- <button @click="drawArrow('attack_arrow')">进攻箭头</button>
+ <button @click="drawArrow('attack_arrow')" title="进攻箭头">进攻箭头</button>
</li>
<li>
- <button @click="drawArrow('double_arrow')">双箭头</button>
+ <button @click="drawArrow('double_arrow')" title="双箭头">双箭头</button>
</li>
<li>
- <button @click="drawArrow('fine_arrow')">直箭头</button>
+ <button @click="drawArrow('fine_arrow')" title="直箭头">
+ <img src="../../../public/img/icon/arrow.png" style="height:100%" />
+ </button>
</li>
<li>
- <button @click="drawArrow('tailed_attack_arrow')">燕尾箭头</button>
+ <button @click="drawArrow('tailed_attack_arrow')" title="燕尾箭头">燕尾箭头</button>
</li>
<li>
- <button @click="removeAllArrow()">清除</button>
+ <button @click="removeAllArrow()">
+ <img
+ src="../../../public/img/icon/del.png"
+ style="height:100%"
+ title="清除"
+ />
+ </button>
</li>
</ul>
</div>
@@ -175,7 +183,9 @@
@click="draw('billboard', 'policeman')"
icon="el-icon-my-route"
></el-button>-->
- <button @click="draw('polyline', 'policecar')">巡逻路线</button>
+ <button @click="draw('polyline', 'policecar')" title="撤离路线">
+ <img src="../../../public/img/icon/route1.png" style="height:100%" />
+ </button>
</li>
</ul>
</div>
@@ -270,7 +280,7 @@
<div class="plan-control" v-show="dialogVisible">
<div class="row-box">
- <div class="category">应急预案：</div>
+ <div class="category">警力资源：</div>
<div class="category-value">
<el-switch
v-model="polylineSwitch"
diff --git a/src/views/home/components/leftContainer.vue b/src/views/home/components/leftContainer.vue
index 0f4dd44..13b8986 100644
--- a/src/views/home/components/leftContainer.vue
+++ b/src/views/home/components/leftContainer.vue
@@ -341,7 +341,7 @@
initPersonEcharts () {
var chartDom = document.getElementById('PersonEcharts')
homePersonmyChart = this.$echarts.init(chartDom)
- homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所'], [881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))
+ homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所'], [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))
},
initPersonOptions (xDate, yDate, colors) {
@@ -360,6 +360,7 @@
axisLabel: {
color: "#fff",
interval: 0,
+ rotate: 45,
fontSize: fontSize(14)
},
axisLine: {
@@ -431,8 +432,8 @@
this.initPersonEcharts()
homePersonmyChart.off('click')
this.clickPeopleChart()
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
colors = ['#06B5D7', '#44C0C1', '#71C8B1']
homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
} else if (type == 1) {
@@ -443,7 +444,7 @@
inithouseEcharts () {
var chartDom = document.getElementById('houseEcharts')
houseMyChart = this.$echarts.init(chartDom)
- houseMyChart.setOption(this.initHouseOptions(['商业房屋', '居民住宅', '公共用房', '文化场所', '政府建筑'], [88188, 1222211, 464104, 43201, 12302], [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]))
+ houseMyChart.setOption(this.initHouseOptions(['公共设施', '餐饮服务', '风景名胜', '公司企业', '购物服务', '商务住宅', '生活服务', '住宿服务', '政府机构及社会团体'], [88188, 1222211, 464104, 43201, 12302, 88188, 1222211, 464104, 43201, 12302], [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]))
},
initHouseOptions (xDate, y1Date, y2Date) {
@@ -500,6 +501,7 @@
{
data: y1Date,
type: 'bar',
+ barWidth: '24%',
zlevel: 2,
itemStyle: {
normal: {
@@ -511,19 +513,19 @@
}
},
},
- {
- data: y2Date,
- show: true,
- type: 'bar',
- barGap: '-100%',
- barWidth: '35%', //统计条宽度
- itemStyle: {
- normal: {
- color: 'rgba(102, 102, 102,0.5)'
- },
- },
- z: 1,
- }
+ // {
+ // data: y2Date,
+ // show: true,
+ // type: 'bar',
+ // barGap: '-100%',
+ // barWidth: '35%', //统计条宽度
+ // itemStyle: {
+ // normal: {
+ // color: 'rgba(102, 102, 102,0.5)'
+ // },
+ // },
+ // z: 1,
+ // }
],
grid: {
top: '2%',
@@ -542,12 +544,12 @@
let xDate, y1Date, y2Date
if (type == 0) {
- xDate = ['商业房屋', '居民住宅', '公共用房', '文化场所', '政府建筑']
- y1Date = [88188, 1222211, 464104, 43201, 12302]
+ xDate = ['公共设施', '餐饮服务', '风景名胜', '公司企业', '购物服务', '商务住宅', '生活服务', '住宿服务', '政府机构及社会团体']
+ y1Date = [88188, 1222211, 464104, 43201, 12302, 88188, 1222211, 464104, 43201, 12302]
y2Date = [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]
} else {
- xDate = ['公共场所', '学校教培', '机动车维修', '娱乐场所', '寄递业']
- y1Date = [54, 77, 97, 141, 191]
+ xDate = ['道路附属设施', '地名地址信息', '风景名胜', '交通设施服务', '金融保险服务', '科教文化服务', '摩托车服务', '汽车服务', '通行设施']
+ y1Date = [54, 77, 97, 141, 191, 54, 77, 97, 141, 191]
y2Date = [{ 'value': 191, 'realValue': 54 }, { 'value': 191, 'realValue': 77 }, { 'value': 191, 'realValue': 97 }, { 'value': 191, 'realValue': 141 }, { 'value': 191, 'realValue': 191 }]
}
houseMyChart.setOption(this.initHouseOptions(xDate, y1Date, y2Date), true)
@@ -607,7 +609,6 @@
data: yDate,
type: 'bar',
barWidth: '24%',
- barCategoryGap: '10%',
itemStyle: {
normal: {
barBorderRadius: [30, 30, 0, 0],
@@ -652,11 +653,11 @@
let xDate, yDate
if (type == 0) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [6414, 2211, 4321, 1232, 881]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [6414, 2211, 4321, 1232, 881, 6414, 2211, 4321, 1232, 881]
} else if (type == 1) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 6414, 2211, 4321, 1232, 881]
}
landMyChart.setOption(this.initLandOptions(xDate, yDate), true)
@@ -917,8 +918,8 @@
this.dataDeep = 1
let xDate, yDate, colors
if (this.tabType == 0) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
colors = ['#06B5D7', '#44C0C1', '#71C8B1']
} else if (this.tabType == 1) {
xDate = ['湖北', '上海', '北京', '广东', '浙江']
diff --git a/src/views/house/index.vue b/src/views/house/index.vue
index 807fa11..59f91af 100644
--- a/src/views/house/index.vue
+++ b/src/views/house/index.vue
@@ -765,6 +765,7 @@
parkingLotData: [],
comeOutData: [],
businessData: [],
+ keyPersonTitle: '人员详情',
keyPersonVisible: false,
keyPersonDetailArr: [
{
diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index b7e6324..cac5def 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -12,13 +12,21 @@
<div class="wrapper">
<div class="main-header">
<div class="menu-list left">
- <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list"
- @click="goToPath(item)" v-for="(item, index) in menuLeftList" :key="index">
+ <div
+ @mouseenter="item.childrenFlag = true"
+ @mouseleave="item.childrenFlag = false"
+ class="nav-list"
+ @click="goToPath(item)"
+ v-for="(item, index) in menuLeftList"
+ :key="index"
+ >
<span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span>
<div class="sub-nav-list" v-show="item.children && item.childrenFlag">
- <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)">
- {{ subItem.menuName }}
- </div>
+ <div
+ v-for="(subItem, subIndex) in item.children"
+ :key="subIndex"
+ @click="goToPath(subItem)"
+ >{{ subItem.menuName }}</div>
</div>
</div>
</div>
@@ -29,13 +37,21 @@
<!-- 菜单导航 -->
<div class="menu-list right">
- <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list"
- @click="goToPath(item)" v-for="(item, index) in menuRightList" :key="index">
+ <div
+ @mouseenter="item.childrenFlag = true"
+ @mouseleave="item.childrenFlag = false"
+ class="nav-list"
+ @click="goToPath(item)"
+ v-for="(item, index) in menuRightList"
+ :key="index"
+ >
<span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span>
<div class="sub-nav-list" v-show="item.children && item.childrenFlag">
- <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)">
- {{ subItem.menuName }}
- </div>
+ <div
+ v-for="(subItem, subIndex) in item.children"
+ :key="subIndex"
+ @click="goToPath(subItem)"
+ >{{ subItem.menuName }}</div>
</div>
</div>
</div>
@@ -74,15 +90,25 @@
<!-- 地图区域 -->
<map-box ref="modalForm">
<!-- 主体内容区域 -->
- <div slot="mainContent" class="main-content" id="MainContent"
- :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }">
+ <div
+ slot="mainContent"
+ class="main-content"
+ id="MainContent"
+ :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }"
+ >
<router-view ref="target-name"></router-view>
</div>
- <el-button slot="showButton" v-show="leftShow" class="flexible-btn"
+ <el-button
+ slot="showButton"
+ v-show="leftShow"
+ class="flexible-btn"
:class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }"
- :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'" id="FlexibleBtn" type="primary"
- @click="flexibelClick"></el-button>
+ :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'"
+ id="FlexibleBtn"
+ type="primary"
+ @click="flexibelClick"
+ ></el-button>
</map-box>
</div>
</div>
@@ -119,7 +145,7 @@
path: '/layout/video/list'
},
{
- menuName: '范围查询',
+ menuName: '视频巡查',
path: '/layout/video/region'
}
]
@@ -310,7 +336,7 @@
overflow: hidden;
letter-spacing: 6px;
- &>img {
+ & > img {
// width: 100%;
height: 80%;
margin: 0 10px 0 10px;
@@ -326,7 +352,7 @@
// border-radius: 10px 16px 10px 16px;
transform: skew(58deg);
- &>span {
+ & > span {
transform: skew(-58deg);
}
}
@@ -340,7 +366,7 @@
// border-radius: 16px 10px 16px 10px;
transform: skew(-58deg);
- &>span {
+ & > span {
transform: skew(58deg);
}
}
@@ -350,11 +376,10 @@
display: flex;
align-items: center;
- &>.nav-list {
-
+ & > .nav-list {
// color: rgba(32, 106, 181, 1);
// border-bottom: 2px solid #409eff;
- &>span.on {
+ & > span.on {
color: rgba(252, 189, 86, 1);
}
}
@@ -483,7 +508,7 @@
justify-content: space-around;
padding-top: 4px;
- &>div {
+ & > div {
width: 100px;
height: 40px;
background-color: rgba(168, 222, 255, 0.6);
diff --git a/src/views/police/index.vue b/src/views/police/index.vue
index 032b7b9..b840b59 100644
--- a/src/views/police/index.vue
+++ b/src/views/police/index.vue
@@ -12,7 +12,7 @@
<template>
<div class="police-page container">
<div v-show="boxShow" class="container-content">
- <div class="switch-box">
+ <div class="switch-box" v-show="!detailFlag">
资源类别：
<el-select
v-model="typeValue"
--
Gitblit v1.9.3