From 845c790070b07021e547a27d84511ccb3d5faf64 Mon Sep 17 00:00:00 2001
From: hh <292475944@qq.com>
Date: Mon, 20 Dec 2021 17:35:45 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=89=E5=85=A8=E7=AE=A1=E7=90=86-=E5=A0=86?=
 =?UTF-8?q?=E5=8F=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/bigScreen/drivingCabin/center2.vue  |  30 +-
 .../bigScreen/securityManage/center2.vue      |  20 +-
 src/views/bigScreen/securityManage/right1.vue | 738 ++++++++++--------
 src/views/bigScreen/securityManage/right2.vue | 346 +++-----
 4 files changed, 538 insertions(+), 596 deletions(-)

diff --git a/src/views/bigScreen/drivingCabin/center2.vue b/src/views/bigScreen/drivingCabin/center2.vue
index 41f5cb7..7ae032a 100644
--- a/src/views/bigScreen/drivingCabin/center2.vue
+++ b/src/views/bigScreen/drivingCabin/center2.vue
@@ -90,22 +90,22 @@ export default {
     return {
       listData: [1, 2, 3, 4, 5, 6, 7, 8],
       val: {
-        attendanceWorker: "",
-        completeTask: "",
-        equipmentRate: "",
-        expenditure: "",
+        attendanceWorker: "0",
+        completeTask: "0",
+        equipmentRate: "0",
+        expenditure: "0",
         id: 1,
-        income: "",
-        newContract: "",
-        operatingEquipment: "",
-        qualityProblem: "",
-        safetyProblem: "",
-        taskRate: "",
-        todayDate: "",
-        totalEquipment: "",
-        totalTask: "",
-        totalWorker: "",
-        workerRate: "",
+        income: "0",
+        newContract: "0",
+        operatingEquipment: "0",
+        qualityProblem: "0",
+        safetyProblem: "0",
+        taskRate: "0",
+        todayDate: "0",
+        totalEquipment: "0",
+        totalTask: "0",
+        totalWorker: "0",
+        workerRate: "0",
       }
     }
   },
diff --git a/src/views/bigScreen/securityManage/center2.vue b/src/views/bigScreen/securityManage/center2.vue
index 730db99..e77eef7 100644
--- a/src/views/bigScreen/securityManage/center2.vue
+++ b/src/views/bigScreen/securityManage/center2.vue
@@ -111,9 +111,25 @@ export default {
 			],
 		}
 	},
-	mounted() {},
+	mounted() {
+		    this.$nextTick(() => {
+      this.getData()
+    })
+	},
 	beforeDestroy() {},
-	methods: {},
+	methods: {
+		getData() {
+			      this.request({
+        url: '/hx/securityManagement/dangerousWork',
+        method: 'get',
+		params: {type :1}
+      }).then(res => {
+		  if (200 == res.code) {
+			  console.log(res)
+		  }
+	  })
+		}
+	},
 }
 </script>
 
diff --git a/src/views/bigScreen/securityManage/right1.vue b/src/views/bigScreen/securityManage/right1.vue
index e7f4080..f6d796b 100644
--- a/src/views/bigScreen/securityManage/right1.vue
+++ b/src/views/bigScreen/securityManage/right1.vue
@@ -1,12 +1,12 @@
 <template>
-	<div>
-		<container2 title="重点危险源部门分布">
-			<div style="height: 100%; width: 100%" ref="left1"></div>
-		</container2>
-		<container2 title="重大危险点部门分布" style="margin-top: 10px">
-			<div style="height: 100%; width: 100%" ref="left2"></div>
-		</container2>
-	</div>
+  <div>
+    <container2 title="重点危险源部门分布">
+      <div style="height: 100%; width: 100%" ref="left1"></div>
+    </container2>
+    <container2 title="重大危险点部门分布" style="margin-top: 10px">
+      <div style="height: 100%; width: 100%" ref="left2"></div>
+    </container2>
+  </div>
 </template>
 
 <script>
@@ -20,334 +20,430 @@ import colorList from '@/utils/colorPalette'
 import echarts from 'echarts'
 require('echarts/theme/macarons') // echarts theme
 export default {
-	// mixins: [resize],
-	name: 'left1',
-	components: {
-		rocketTit,
-		container2,
-		bigScreenTabs,
-		progressBar,
-	},
-	data() {
-		return {
-			colorList,
-		}
-	},
-	mounted() {
-		this.$nextTick(() => {
-			this.initChart()
-			this.initLine()
-		})
-	},
-	beforeDestroy() {},
-	methods: {
-		initChart() {
-			this.chart = echarts.init(this.$refs.left1)
-			this.setOptions()
-		},
-		setOptions() {
-			this.chart.setOption({
-				tooltip: {
-					trigger: 'axis',
-					axisPointer: {
-						type: 'shadow',
-					},
-				},
-				legend: {
-					data: ['一级危险源', '二级危险源', '三级危险源', '四级危险源'],
-					textStyle: {
-						color: '#fff', //legend字体颜色
-					},
-				},
-				grid: {
-					left: 20,
-					right: 20,
-					top: 30,
-					bottom: 50,
-					containLabel: true,
-				},
-				dataZoom: {
-					type: 'slider',
-					// start: 0,
-					// end: 50,
-					textStyle: {
-						color: '#fff',
-					},
-				},
-				xAxis: [
-					{
-						type: 'category',
-						data: ['部门一', '部门二', '部门三', '部门四', '部门五', '部门六', '部门七'],
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-				],
-				yAxis: [
-					{
-						name: '个',
-						splitLine: {
-							show: true,
-							//  改变轴线颜色
-							lineStyle: {
-								// 使用深浅的间隔色
-								color: ['rgba(255, 255, 255,.5)'],
-							},
-						},
-						axisLabel: {
-							formatter: '{value}',
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-					{
-						type: 'value',
-					},
-				],
-				series: [
-					{
-						name: '四级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#FF9F43',
-						},
-						barWidth: 30,
-						data: [120, 132, 101, 134, 90, 230, 210],
-					},
-					{
-						name: '三级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#F7DC87',
-						},
-						barWidth: 30,
-						data: [220, 182, 191, 234, 290, 330, 310],
-					},
-					{
-						name: '二级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#55C5A2',
-						},
-						barWidth: 30,
-						data: [150, 232, 201, 154, 190, 330, 410],
-					},
-					{
-						name: '一级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#5B8FF9',
-						},
-						barWidth: 30,
-						data: [150, 232, 201, 154, 190, 330, 410],
-					},
-				],
-			})
-		},
-		initLine() {
-			this.chart = echarts.init(this.$refs.left2)
-			this.setOptions2()
-		},
-		setOptions2() {
-			this.chart.setOption({
-				tooltip: {
-					trigger: 'axis',
-					axisPointer: {
-						type: 'shadow',
-					},
-				},
-				legend: {
-					data: ['一级危险源', '二级危险源', '三级危险源'],
-					textStyle: {
-						color: '#fff', //legend字体颜色
-					},
-				},
-				grid: {
-					left: 20,
-					right: 20,
-					top: 30,
-					bottom: 50,
-					containLabel: true,
-				},
-				dataZoom: {
-					type: 'slider',
-					// start: 0,
-					// end: 50,
-					textStyle: {
-						color: '#fff',
-					},
-				},
-				xAxis: [
-					{
-						type: 'category',
-						data: ['部门一', '部门二', '部门三', '部门四', '部门五', '部门六', '部门七'],
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-				],
-				yAxis: [
-					{
-						name: '个',
-						splitLine: {
-							show: true,
-							//  改变轴线颜色
-							lineStyle: {
-								// 使用深浅的间隔色
-								color: ['rgba(255, 255, 255,.5)'],
-							},
-						},
-						axisLabel: {
-							formatter: '{value}',
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-					{
-						type: 'value',
-					},
-				],
-				series: [
-					{
-						name: '三级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#F7DC87',
-						},
-						barWidth: 30,
-						data: [220, 182, 191, 234, 290, 330, 310],
-					},
-					{
-						name: '二级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#55C5A2',
-						},
-						barWidth: 30,
-						data: [150, 232, 201, 154, 190, 330, 410],
-					},
-					{
-						name: '一级危险源',
-						type: 'bar',
-						stack: 'Ad',
-						emphasis: {
-							focus: 'series',
-						},
-						itemStyle: {
-							color: '#5B8FF9',
-						},
-						barWidth: 30,
-						data: [150, 232, 201, 154, 190, 330, 410],
-					},
-				],
-			})
-		},
-	},
+  // mixins: [resize],
+  name: 'left1',
+  components: {
+    rocketTit,
+    container2,
+    bigScreenTabs,
+    progressBar,
+  },
+  data () {
+    return {
+      colorList,
+      chart1: null,
+      chart2: null,
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.initChart()
+      this.initLine()
+    })
+  },
+  beforeDestroy () { },
+  methods: {
+    initChart () {
+      this.request({
+        url: '/hx/securityManagement/dangerSource',
+        method: 'get',
+      }).then(res => {
+
+        if (200 == res.code) {
+          let titData = res.data.allLevel;
+          let data = res.data;
+          delete data.allLevel;
+          let titList = [];
+          let valList = [];
+          for (let index = 0; index < titData.length; index++) {
+            valList.push([])
+          }
+          // var a = {
+          // 	titData: ['一级危险源', '二级危险源', '三级危险源', '四级危险源'],
+          // 	valData: 		{
+          // 			titList:['部门一', '部门二', '部门三', '部门四', '部门五', '部门六', '部门七'],
+          // 			valList:[
+          // 				[120, 132, 101, 134, 90, 230, 210],
+          // 				[120, 132, 101, 134, 90, 230, 210],
+          // 				[120, 132, 101, 134, 90, 230, 210],
+          // 				[120, 132, 101, 134, 90, 230, 210],
+          // 			],
+          // 		}
+          // };
+          for (const key in data) {
+            if (Object.hasOwnProperty.call(data, key)) {
+              const item = data[key];
+              titList.push(key);
+              for (let i = 0; i < item.length; i++) {
+                const ele = item[i];
+                let index = titData.findIndex(e => e == ele.name);
+                valList[index][titList.length - 1] = ele.COUNTNUMBER;
+              }
+            }
+          }
+
+          this.chart1 = echarts.init(this.$refs.left1)
+          this.chart1.setOption({
+            tooltip: {
+              trigger: 'axis',
+              axisPointer: {
+                type: 'shadow',
+              },
+            },
+            legend: {
+              //   data: ['一级危险源', '二级危险源', '三级危险源', '四级危险源'],
+              data: titData,
+              textStyle: {
+                color: '#fff', //legend字体颜色
+              },
+            },
+            grid: {
+              left: 20,
+              right: 20,
+              top: 30,
+              bottom: 50,
+              containLabel: true,
+            },
+            dataZoom: {
+              type: 'slider',
+              start: 0,
+              end: this.dataZoomEnd(titList.length, 5),
+            },
+            color: ['#5B8FF9', '#55C5A2', '#F7DC87', '#FF9F43'],
+            xAxis: [
+              {
+                type: 'category',
+                // data: ['部门一', '部门二', '部门三', '部门四', '部门五', '部门六', '部门七'],
+                data: titList,
+                axisLine: {
+                  lineStyle: {
+                    color: 'rgb(255, 255, 255)',
+                  },
+                },
+              },
+            ],
+            yAxis: [
+              {
+                name: '个',
+                splitLine: {
+                  show: true,
+                  //  改变轴线颜色
+                  lineStyle: {
+                    // 使用深浅的间隔色
+                    color: ['rgba(255, 255, 255,.5)'],
+                  },
+                },
+                axisLabel: {
+                  formatter: '{value}',
+                },
+                axisLine: {
+                  lineStyle: {
+                    color: 'rgb(255, 255, 255)',
+                  },
+                },
+              },
+              {
+                type: 'value',
+              },
+            ],
+            series: [
+              ...valList.map((e, index) => {
+                return {
+
+                  name: titData[index],
+                  type: 'bar',
+                  stack: 'Ad',
+                  emphasis: {
+                    focus: 'series',
+                  },
+
+                  barWidth: 30,
+                  data: e,
+                }
+              })
+              //   {
+              //     name: '四级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#FF9F43',
+              //     },
+              //     barWidth: 30,
+              //     data: [120, 132, 101, 134, 90, 230, 210],
+              //   },
+              //   {
+              //     name: '三级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#F7DC87',
+              //     },
+              //     barWidth: 30,
+              //     data: [220, 182, 191, 234, 290, 330, 310],
+              //   },
+              //   {
+              //     name: '二级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#55C5A2',
+              //     },
+              //     barWidth: 30,
+              //     data: [150, 232, 201, 154, 190, 330, 410],
+              //   },
+              //   {
+              //     name: '一级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#5B8FF9',
+              //     },
+              //     barWidth: 30,
+              //     data: [150, 232, 201, 154, 190, 330, 410],
+              //   },
+            ],
+          })
+        }
+      })
+      this.setOptions()
+    },
+    setOptions () {
+
+    },
+    initLine () {
+      this.request({
+        url: '/hx/securityManagement/dangerPoint',
+        method: 'get',
+      }).then(res => {
+        if (200 == res.code) {
+          let titData = res.data.allLevel;
+          let data = res.data;
+          delete data.allLevel;
+          let titList = [];
+          let valList = [];
+          for (let index = 0; index < titData.length; index++) {
+            valList.push([])
+          }
+          for (const key in data) {
+            if (Object.hasOwnProperty.call(data, key)) {
+              const item = data[key];
+              titList.push(key);
+              for (let i = 0; i < item.length; i++) {
+                const ele = item[i];
+                let index = titData.findIndex(e => e == ele.name);
+                valList[index][titList.length - 1] = ele.COUNTNUMBER;
+              }
+            }
+          }
+          this.chart2 = echarts.init(this.$refs.left2)
+          this.chart2.setOption({
+            tooltip: {
+              trigger: 'axis',
+              axisPointer: {
+                type: 'shadow',
+              },
+            },
+            legend: {
+              //   data: ['一级危险源', '二级危险源', '三级危险源'],
+              data: titData,
+              textStyle: {
+                color: '#fff', //legend字体颜色
+              },
+            },
+            grid: {
+              left: 20,
+              right: 20,
+              top: 30,
+              bottom: 50,
+              containLabel: true,
+            },
+            dataZoom: {
+              type: 'slider',
+              start: 0,
+              end: this.dataZoomEnd(titList.length, 5),
+            },
+            color: ['#5B8FF9', '#55C5A2', '#F7DC87', '#FF9F43'],
+            xAxis: [
+              {
+                type: 'category',
+                data: titList,
+                // data: ['部门一', '部门二', '部门三', '部门四', '部门五', '部门六', '部门七'],
+                axisLine: {
+                  lineStyle: {
+                    color: 'rgb(255, 255, 255)',
+                  },
+                },
+              },
+            ],
+            yAxis: [
+              {
+                name: '个',
+                splitLine: {
+                  show: true,
+                  //  改变轴线颜色
+                  lineStyle: {
+                    // 使用深浅的间隔色
+                    color: ['rgba(255, 255, 255,.5)'],
+                  },
+                },
+                axisLabel: {
+                  formatter: '{value}',
+                },
+                axisLine: {
+                  lineStyle: {
+                    color: 'rgb(255, 255, 255)',
+                  },
+                },
+              },
+              {
+                type: 'value',
+              },
+            ],
+            series: [
+              ...valList.map((e, index) => {
+                return {
+
+                  name: titData[index],
+                  type: 'bar',
+                  stack: 'Ad',
+                  emphasis: {
+                    focus: 'series',
+                  },
+
+                  barWidth: 30,
+                  data: e,
+                }
+              }),
+              //   {
+              //     name: '三级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#F7DC87',
+              //     },
+              //     barWidth: 30,
+              //     data: [220, 182, 191, 234, 290, 330, 310],
+              //   },
+              //   {
+              //     name: '二级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#55C5A2',
+              //     },
+              //     barWidth: 30,
+              //     data: [150, 232, 201, 154, 190, 330, 410],
+              //   },
+              //   {
+              //     name: '一级危险源',
+              //     type: 'bar',
+              //     stack: 'Ad',
+              //     emphasis: {
+              //       focus: 'series',
+              //     },
+              //     itemStyle: {
+              //       color: '#5B8FF9',
+              //     },
+              //     barWidth: 30,
+              //     data: [150, 232, 201, 154, 190, 330, 410],
+              //   },
+            ],
+          })
+
+        }
+      })
+    },
+
+  },
 }
 </script>
 
 <style lang="scss" scoped>
 .wrap {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	width: 100%;
-	.box {
-		padding: 0 0 5px 15px;
-		display: flex;
-		align-items: center;
-		.num {
-			font-size: 24px;
-			font-weight: 600;
-			margin: 0 10px;
-		}
-	}
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+  .box {
+    padding: 0 0 5px 15px;
+    display: flex;
+    align-items: center;
+    .num {
+      font-size: 24px;
+      font-weight: 600;
+      margin: 0 10px;
+    }
+  }
 }
 
 .content1 {
-	// height: 200px;
-	height: 100%;
+  // height: 200px;
+  height: 100%;
 
-	.chart1 {
-		margin: 0 auto;
-		width: 100%;
-		height: 192px;
-		background: transparent;
-	}
+  .chart1 {
+    margin: 0 auto;
+    width: 100%;
+    height: 192px;
+    background: transparent;
+  }
 }
 
 .num {
-	font-size: 30px;
-	font-family: Roboto-BlackItalic, Roboto;
-	font-weight: normal;
-	color: #91d5fe;
-	vertical-align: sub;
-	//   margin-right: 3px;
+  font-size: 30px;
+  font-family: Roboto-BlackItalic, Roboto;
+  font-weight: normal;
+  color: #91d5fe;
+  vertical-align: sub;
+  //   margin-right: 3px;
 }
 
 .content2 {
-	padding: 20px;
-	flex: 1;
-	height: 100%;
-	box-sizing: border-box;
-	display: flex;
-	flex-direction: column;
-	.chart2 {
-		height: 100%;
-	}
+  padding: 20px;
+  flex: 1;
+  height: 100%;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  .chart2 {
+    height: 100%;
+  }
 
-	.tit {
-		font-size: 16px;
-		font-family: PingFangSC-Semibold, PingFang SC;
-		font-weight: 600;
-		color: #ffffff;
-		line-height: 22px;
-		position: relative;
-		padding-left: 15px;
-	}
-	.tit::after {
-		content: '';
-		display: block;
-		position: absolute;
-		top: 3px;
-		left: 0px;
-		width: 4px;
-		height: 16px;
-		background: #00ffff;
-	}
+  .tit {
+    font-size: 16px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #ffffff;
+    line-height: 22px;
+    position: relative;
+    padding-left: 15px;
+  }
+  .tit::after {
+    content: "";
+    display: block;
+    position: absolute;
+    top: 3px;
+    left: 0px;
+    width: 4px;
+    height: 16px;
+    background: #00ffff;
+  }
 }
 </style>
diff --git a/src/views/bigScreen/securityManage/right2.vue b/src/views/bigScreen/securityManage/right2.vue
index 996247f..cb2ff2d 100644
--- a/src/views/bigScreen/securityManage/right2.vue
+++ b/src/views/bigScreen/securityManage/right2.vue
@@ -1,24 +1,24 @@
 <template>
-	<div>
-		<container5 title="危险作业厂所压减情况">
-			<el-row style="height: 80%; display: flex; align-items: center">
-				<el-col :span="12">
-					<div class="right1_bg right1_bg1">
-						<div><span class="num">4 / 6</span></div>
-						<div style="font-size: 14px">现有/原有</div>
-						<div class="txt">三人以上危险作业场所</div>
-					</div>
-				</el-col>
-				<el-col :span="12">
-					<div class="right1_bg right1_bg2">
-						<div><span class="num">2 / 7</span></div>
-						<div style="font-size: 14px">现有/原有</div>
-						<div class="txt">十人以上危险作业场所</div>
-					</div>
-				</el-col>
-			</el-row>
-		</container5>
-	</div>
+  <div>
+    <container5 title="危险作业厂所压减情况">
+      <el-row style="height: 80%; display: flex; align-items: center">
+        <el-col :span="12">
+          <div class="right1_bg right1_bg1">
+            <div><span class="num">{{val[0].NOWNUMBER}} / {{val[0].INITNUMBER}}</span></div>
+            <div style="font-size: 14px">现有/原有</div>
+            <div class="txt">{{val[0].name}}危险作业场所</div>
+          </div>
+        </el-col>
+        <el-col :span="12">
+          <div class="right1_bg right1_bg2">
+            <div><span class="num">{{val[1].NOWNUMBER}} / {{val[1].INITNUMBER}}</span></div>
+            <div style="font-size: 14px">现有/原有</div>
+            <div class="txt">{{val[1].name}}危险作业场所</div>
+          </div>
+        </el-col>
+      </el-row>
+    </container5>
+  </div>
 </template>
 
 <script>
@@ -31,252 +31,82 @@ import echarts from 'echarts'
 require('echarts/theme/macarons') // echarts theme
 import resize from '../../dashboard/mixins/resize'
 export default {
-	mixins: [resize],
-	name: 'right2',
-	components: {
-		scalseBox,
-		bigScreenHead,
-		rocketTit,
-		container5,
-	},
-	data() {
-		return {
-			dateRange: [],
-			chart: null,
-			option: {
-				legend: {
-					data: ['利润', '利润预测', '利润目标完成率'],
-					textStyle: {
-						color: '#fff',
-					},
-				},
-				grid: {
-					left: '3%',
-					right: '6%',
-					bottom: '3%',
-					containLabel: true,
-				},
-				xAxis: [
-					{
-						type: 'category',
-						data: [
-							'2021-01',
-							'2021-02',
-							'2021-03',
-							'2021-04',
-							'2021-05',
-							'2021-06',
-							'2021-07',
-							'2021-08',
-							'2021-09',
-							'2021-10',
-							'2021-11',
-							'2021-12',
-						],
-						axisPointer: {
-							type: 'shadow',
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-				],
-				yAxis: [
-					{
-						type: 'value',
-						name: '万元',
-						min: 0,
-						max: 250,
-						interval: 50,
-						axisLabel: {
-							formatter: '{value}',
-						},
-						splitLine: {
-							show: false, //不显示网格线
-						},
-						splitArea: {
-							show: false, //不显示网格区域
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-					{
-						type: 'value',
-						min: 0,
-						max: 25,
-						interval: 5,
-						axisLabel: {
-							formatter: '{value} %',
-						},
-						splitLine: {
-							show: false, //不显示网格线
-						},
-						splitArea: {
-							show: false, //不显示网格区域
-						},
-						axisLine: {
-							lineStyle: {
-								color: 'rgb(255, 255, 255)',
-							},
-						},
-					},
-				],
-				grid: {
-					containLabel: true,
-					width: '99%',
-					left: 0,
-					top: 50,
-					bottom: 50,
-				},
-				dataZoom: {},
-				series: [
-					{
-						name: '利润',
-						type: 'bar',
-						barWidth: 20,
-						data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
-						itemStyle: {
-							color: 'rgb(118,196,166)',
-						},
-					},
-					{
-						name: '利润预测',
-						type: 'bar',
-						barWidth: 20,
-						data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
-						itemStyle: {
-							color: {
-								type: 'linear', // 线性渐变
-								x: 0,
-								y: 0,
-								x2: 0,
-								y2: 1,
-								colorStops: [
-									{
-										offset: 0,
-										color: '#B5D3FE', // 0%处的颜色为红色
-									},
-									{
-										offset: 1,
-										color: '#7EA7FC', // 100%处的颜色为蓝
-									},
-								],
-							},
-						},
-					},
-					{
-						name: '利润目标完成率',
-						type: 'line',
-						yAxisIndex: 1,
-						smooth: false,
-						data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
-						itemStyle: {
-							normal: {
-								color: '#F6D97E',
-							},
-						},
-						symbol: 'none',
-					},
-				],
-				// yAxis: {
-				//   type: 'value',
-				//   splitLine: {
-				//     show: false//不显示网格线
-				//   },
-				//   splitArea: {
-				//     show: false//不显示网格区域
-				//   },
-				//   axisLine: {
-				//     lineStyle: {
-				//       color: 'rgb(255, 255, 255)'
-				//     },
-				//   }
-				// },
-				// series: [
-				//   {
-				//     name: '利润',
-				//     type: 'bar',
-				//     data: [
-				//       2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
-				//     ]
-				//   },
-				//   {
-				//     name: '利润预测',
-				//     type: 'bar',
-				//     data: [
-				//       2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
-				//     ]
-				//   },
-				//   {
-				//     name: '利润目标完成率',
-				//     type: 'line',
-				//     yAxisIndex: 1,
-				//     data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
-				//   }
-
-				// ]
-			},
-		}
-	},
-	mounted() {
-		this.$nextTick(() => {
-			// this.initChart()
-		})
-	},
-	beforeDestroy() {
-		if (!this.chart) {
-			return
-		}
-		this.chart.dispose()
-		this.chart = null
-	},
-	methods: {
-		initChart() {
-			this.chart = echarts.init(this.$refs.chart)
-			this.chart.setOption(this.option)
-		},
-	},
+  mixins: [resize],
+  name: 'right2',
+  components: {
+    scalseBox,
+    bigScreenHead,
+    rocketTit,
+    container5,
+  },
+  // {"msg":"操作成功","code":200,"data":}
+  data () {
+    return {
+      val: [
+		  { "INITNUMBER": 0, "name": "三人以上", "NOWNUMBER": 0 },
+		  { "INITNUMBER": 0, "name": "十人以上", "NOWNUMBER": 0 }
+		]
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.getData()
+      // this.initChart()
+    })
+  },
+  beforeDestroy () {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    getData () {
+      this.request({
+        url: '/hx/securityManagement/dangerPlace',
+        method: 'get',
+      }).then(res => {
+        this.val = res.data
+      })
+    }
+  },
 }
 </script>
 
 <style lang="scss" scoped>
 .right1_bg {
-	position: relative;
-	width: 147px;
-	height: 113px;
-	background-size: cover;
-	text-align: center;
-	padding: 0 0 10px 0;
-	margin: 20px auto 0 auto;
-	font-size: 14px;
-	.num {
-		font-size: 35px;
-		font-family: Roboto-Black, Roboto;
-		font-weight: 900;
-		line-height: 35px;
-		margin-right: 3px;
-		vertical-align: middle;
-	}
-	.txt {
-		position: absolute;
-		bottom: -30px;
-	}
+  position: relative;
+  width: 147px;
+  height: 113px;
+  background-size: cover;
+  text-align: center;
+  padding: 0 0 10px 0;
+  margin: 20px auto 0 auto;
+  font-size: 14px;
+  .num {
+    font-size: 35px;
+    font-family: Roboto-Black, Roboto;
+    font-weight: 900;
+    line-height: 35px;
+    margin-right: 3px;
+    vertical-align: middle;
+  }
+  .txt {
+    position: absolute;
+    bottom: -30px;
+  }
 }
 .right1_bg1 {
-	background-image: url(./right2-1.png);
-	.num {
-		color: #1098ff;
-	}
+  background-image: url(./right2-1.png);
+  .num {
+    color: #1098ff;
+  }
 }
 .right1_bg2 {
-	background-image: url(./right2-2.png);
-	.num {
-		color: #f6d97e;
-	}
+  background-image: url(./right2-2.png);
+  .num {
+    color: #f6d97e;
+  }
 }
 </style>