From b39329d1bd0df1ad2b35ec165cd36d8f9c8b6886 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Wed, 24 Aug 2022 19:30:54 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(=E5=8F=8C?=
 =?UTF-8?q?=E7=A2=B3=E7=AE=A1=E7=90=86)=EF=BC=9A=E5=AE=8C=E6=88=90?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projectAdmin/zjsj/carbon/centerBottom.vue | 14 +++++
 .../projectAdmin/zjsj/carbon/centerTop.vue    | 14 +++++
 src/views/projectAdmin/zjsj/carbon/index.vue  | 58 +++++++++++++++++--
 .../projectAdmin/zjsj/carbon/leftBottom.vue   | 14 +++++
 .../projectAdmin/zjsj/carbon/leftCenter.vue   | 14 +++++
 .../projectAdmin/zjsj/carbon/leftTop.vue      | 14 +++++
 .../projectAdmin/zjsj/carbon/rightBottom.vue  | 14 +++++
 .../projectAdmin/zjsj/carbon/rightCenter.vue  | 14 +++++
 .../projectAdmin/zjsj/carbon/rightTop.vue     | 14 +++++
 .../zjsj/security/centerBottom.vue            | 14 +++++
 .../projectAdmin/zjsj/security/centerTop.vue  | 14 +++++
 .../projectAdmin/zjsj/security/index.vue      | 58 +++++++++++++++++--
 .../projectAdmin/zjsj/security/leftBottom.vue | 14 +++++
 .../projectAdmin/zjsj/security/leftCenter.vue | 14 +++++
 .../projectAdmin/zjsj/security/leftTop.vue    | 14 +++++
 .../zjsj/security/rightBottom.vue             | 14 +++++
 .../zjsj/security/rightCenter.vue             | 14 +++++
 .../projectAdmin/zjsj/security/rightTop.vue   | 14 +++++
 18 files changed, 332 insertions(+), 8 deletions(-)
 create mode 100644 src/views/projectAdmin/zjsj/carbon/centerBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/centerTop.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/leftBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/leftCenter.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/leftTop.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/rightBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/rightCenter.vue
 create mode 100644 src/views/projectAdmin/zjsj/carbon/rightTop.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/centerBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/centerTop.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/leftBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/leftCenter.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/leftTop.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/rightBottom.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/rightCenter.vue
 create mode 100644 src/views/projectAdmin/zjsj/security/rightTop.vue

diff --git a/src/views/projectAdmin/zjsj/carbon/centerBottom.vue b/src/views/projectAdmin/zjsj/carbon/centerBottom.vue
new file mode 100644
index 00000000..52e55837
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/centerBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="晴雨表">
+    晴雨表
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/centerTop.vue b/src/views/projectAdmin/zjsj/carbon/centerTop.vue
new file mode 100644
index 00000000..22d7eab5
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/centerTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="实时数据">
+    实时数据
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/index.vue b/src/views/projectAdmin/zjsj/carbon/index.vue
index dd89ee25..9fe939db 100644
--- a/src/views/projectAdmin/zjsj/carbon/index.vue
+++ b/src/views/projectAdmin/zjsj/carbon/index.vue
@@ -1,16 +1,66 @@
 <template>
-  <div class="carbon">carbon</div>
+  <div class="carbon">
+    <div class="between">
+      <div class="top"><LeftTop /></div>
+      <div class="center"><LeftCenter /></div>
+      <div class="bottom"><LeftBottom /></div>
+    </div>
+    <div class="center">
+      <div class="top"><CenterTop /></div>
+      <div class="bottom"><CenterBottom /></div>
+    </div>
+    <div class="between">
+      <div class="top"><RightTop /></div>
+      <div class="center"><RightCenter /></div>
+      <div class="bottom"><RightBottom /></div>
+    </div>
+  </div>
 </template>
 
 <script>
-export default {}
+import LeftTop from './leftTop.vue'
+import LeftCenter from './leftCenter.vue'
+import LeftBottom from './leftBottom.vue'
+import CenterTop from './centerTop.vue'
+import CenterBottom from './centerBottom.vue'
+import RightTop from './rightTop.vue'
+import RightCenter from './rightCenter.vue'
+import RightBottom from './rightBottom.vue'
+export default {
+  components: { LeftTop, LeftCenter, LeftBottom, CenterTop, CenterBottom, RightTop, RightCenter, RightBottom }
+}
 </script>
 
 <style lang="less" scoped>
 .carbon {
   width: 100%;
   height: 100%;
-  background: url(../assets/temp/7.png) no-repeat;
-  background-size: 100% 100%;
+  display: flex;
+  justify-content: space-between;
+  // background: url(../assets/temp/7.png) no-repeat;
+  // background-size: 100% 100%;
+  .between {
+    width: 20%;
+    height: 100%;
+    .top {
+      height: 33.33%;
+    }
+    .center {
+      height: 33.33%;
+    }
+    .bottom {
+      height: 33.33%;
+    }
+  }
+  > .center {
+    width: calc(60% - 40px);
+    height: 100%;
+    .top {
+      height: 70%;
+    }
+    .bottom {
+      height: 30%;
+    }
+  }
 }
 </style>
diff --git a/src/views/projectAdmin/zjsj/carbon/leftBottom.vue b/src/views/projectAdmin/zjsj/carbon/leftBottom.vue
new file mode 100644
index 00000000..36501364
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/leftBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="趋势图">
+    趋势图
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/leftCenter.vue b/src/views/projectAdmin/zjsj/carbon/leftCenter.vue
new file mode 100644
index 00000000..91b401d1
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/leftCenter.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="雾炮喷淋">
+    雾炮喷淋
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/leftTop.vue b/src/views/projectAdmin/zjsj/carbon/leftTop.vue
new file mode 100644
index 00000000..46804d97
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/leftTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="环境监测">
+    环境监测
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/rightBottom.vue b/src/views/projectAdmin/zjsj/carbon/rightBottom.vue
new file mode 100644
index 00000000..1ad04124
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/rightBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="报警记录">
+    报警记录
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/rightCenter.vue b/src/views/projectAdmin/zjsj/carbon/rightCenter.vue
new file mode 100644
index 00000000..2a2ad3ee
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/rightCenter.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="今日报警统计">
+    今日报警统计
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/carbon/rightTop.vue b/src/views/projectAdmin/zjsj/carbon/rightTop.vue
new file mode 100644
index 00000000..5239a579
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/carbon/rightTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="空气分析">
+    空气分析
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/centerBottom.vue b/src/views/projectAdmin/zjsj/security/centerBottom.vue
new file mode 100644
index 00000000..52e55837
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/centerBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="晴雨表">
+    晴雨表
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/centerTop.vue b/src/views/projectAdmin/zjsj/security/centerTop.vue
new file mode 100644
index 00000000..22d7eab5
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/centerTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="实时数据">
+    实时数据
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/index.vue b/src/views/projectAdmin/zjsj/security/index.vue
index 96c48a33..917a4a48 100644
--- a/src/views/projectAdmin/zjsj/security/index.vue
+++ b/src/views/projectAdmin/zjsj/security/index.vue
@@ -1,16 +1,66 @@
 <template>
-  <div class="security">security</div>
+  <div class="security">
+    <div class="between">
+      <div class="top"><LeftTop /></div>
+      <div class="center"><LeftCenter /></div>
+      <div class="bottom"><LeftBottom /></div>
+    </div>
+    <div class="center">
+      <div class="top"><CenterTop /></div>
+      <div class="bottom"><CenterBottom /></div>
+    </div>
+    <div class="between">
+      <div class="top"><RightTop /></div>
+      <div class="center"><RightCenter /></div>
+      <div class="bottom"><RightBottom /></div>
+    </div>
+  </div>
 </template>
 
 <script>
-export default {}
+import LeftTop from './leftTop.vue'
+import LeftCenter from './leftCenter.vue'
+import LeftBottom from './leftBottom.vue'
+import CenterTop from './centerTop.vue'
+import CenterBottom from './centerBottom.vue'
+import RightTop from './rightTop.vue'
+import RightCenter from './rightCenter.vue'
+import RightBottom from './rightBottom.vue'
+export default {
+  components: { LeftTop, LeftCenter, LeftBottom, CenterTop, CenterBottom, RightTop, RightCenter, RightBottom }
+}
 </script>
 
 <style lang="less" scoped>
 .security {
   width: 100%;
   height: 100%;
-  background: url(../assets/temp/5.png) no-repeat;
-  background-size: 100% 100%;
+  display: flex;
+  justify-content: space-between;
+  // background: url(../assets/temp/5.png) no-repeat;
+  // background-size: 100% 100%;
+  .between {
+    width: 20%;
+    height: 100%;
+    .top {
+      height: 33.33%;
+    }
+    .center {
+      height: 33.33%;
+    }
+    .bottom {
+      height: 33.33%;
+    }
+  }
+  > .center {
+    width: calc(60% - 40px);
+    height: 100%;
+    .top {
+      height: 70%;
+    }
+    .bottom {
+      height: 30%;
+    }
+  }
 }
 </style>
diff --git a/src/views/projectAdmin/zjsj/security/leftBottom.vue b/src/views/projectAdmin/zjsj/security/leftBottom.vue
new file mode 100644
index 00000000..36501364
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/leftBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="趋势图">
+    趋势图
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/leftCenter.vue b/src/views/projectAdmin/zjsj/security/leftCenter.vue
new file mode 100644
index 00000000..91b401d1
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/leftCenter.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="雾炮喷淋">
+    雾炮喷淋
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/leftTop.vue b/src/views/projectAdmin/zjsj/security/leftTop.vue
new file mode 100644
index 00000000..46804d97
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/leftTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="环境监测">
+    环境监测
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/rightBottom.vue b/src/views/projectAdmin/zjsj/security/rightBottom.vue
new file mode 100644
index 00000000..1ad04124
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/rightBottom.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="报警记录">
+    报警记录
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/rightCenter.vue b/src/views/projectAdmin/zjsj/security/rightCenter.vue
new file mode 100644
index 00000000..2a2ad3ee
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/rightCenter.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="今日报警统计">
+    今日报警统计
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>
diff --git a/src/views/projectAdmin/zjsj/security/rightTop.vue b/src/views/projectAdmin/zjsj/security/rightTop.vue
new file mode 100644
index 00000000..5239a579
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/security/rightTop.vue
@@ -0,0 +1,14 @@
+<template>
+  <Card title="空气分析">
+    空气分析
+  </Card>
+</template>
+
+<script>
+import Card from '../components/Card.vue'
+export default {
+  components: { Card }
+}
+</script>
+
+<style></style>