Преглед на файлове

Merge remote-tracking branch 'origin/main'

# Conflicts:
#	src/permission.js
敲代码的猫 преди 5 месеца
родител
ревизия
d3621ec4c5

+ 53 - 0
src/api/zcustom/camera.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询摄像头列表
+export function listCamera(query) {
+  return request({
+    url: '/zcustom/camera/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询摄像头所有列表
+export function listAllCamera(query) {
+  return request({
+    url: '/zcustom/camera/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询摄像头详细
+export function getCamera(id) {
+  return request({
+    url: '/zcustom/camera/getInfo/' + id,
+    method: 'get'
+  })
+}
+
+// 新增摄像头
+export function addCamera(data) {
+  return request({
+    url: '/zcustom/camera/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改摄像头
+export function updateCamera(data) {
+  return request({
+    url: '/zcustom/camera/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除摄像头
+export function delCamera(id) {
+  return request({
+    url: '/zcustom/camera/remove/' + id,
+    method: 'get'
+  })
+}

+ 53 - 0
src/api/zcustom/issue.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询上报问题列表
+export function listIssue(query) {
+  return request({
+    url: '/zcustom/issue/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询上报问题所有列表
+export function listAllIssue(query) {
+  return request({
+    url: '/zcustom/issue/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询上报问题详细
+export function getIssue(id) {
+  return request({
+    url: '/zcustom/issue/getInfo/' + id,
+    method: 'get'
+  })
+}
+
+// 新增上报问题
+export function addIssue(data) {
+  return request({
+    url: '/zcustom/issue/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改上报问题
+export function updateIssue(data) {
+  return request({
+    url: '/zcustom/issue/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除上报问题
+export function delIssue(id) {
+  return request({
+    url: '/zcustom/issue/remove/' + id,
+    method: 'get'
+  })
+}

+ 53 - 0
src/api/zcustom/plan.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询工程计划列表
+export function listPlan(query) {
+  return request({
+    url: '/zcustom/plan/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工程计划所有列表
+export function listAllPlan(query) {
+  return request({
+    url: '/zcustom/plan/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工程计划详细
+export function getPlan(id) {
+  return request({
+    url: '/zcustom/plan/getInfo/' + id,
+    method: 'get'
+  })
+}
+
+// 新增工程计划
+export function addPlan(data) {
+  return request({
+    url: '/zcustom/plan/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改工程计划
+export function updatePlan(data) {
+  return request({
+    url: '/zcustom/plan/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除工程计划
+export function delPlan(id) {
+  return request({
+    url: '/zcustom/plan/remove/' + id,
+    method: 'get'
+  })
+}

+ 53 - 0
src/api/zcustom/platAppOrg.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询地区编码列表
+export function listPlatAppOrg(query) {
+  return request({
+    url: '/zcustom/platAppOrg/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询地区编码所有列表
+export function listAllPlatAppOrg(query) {
+  return request({
+    url: '/zcustom/platAppOrg/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询地区编码详细
+export function getPlatAppOrg(id) {
+  return request({
+    url: '/zcustom/platAppOrg/getInfo/' + id,
+    method: 'get'
+  })
+}
+
+// 新增地区编码
+export function addPlatAppOrg(data) {
+  return request({
+    url: '/zcustom/platAppOrg/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改地区编码
+export function updatePlatAppOrg(data) {
+  return request({
+    url: '/zcustom/platAppOrg/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除地区编码
+export function delPlatAppOrg(id) {
+  return request({
+    url: '/zcustom/platAppOrg/remove/' + id,
+    method: 'get'
+  })
+}

+ 53 - 0
src/api/zcustom/project.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询工程项目列表
+export function listProject(query) {
+  return request({
+    url: '/zcustom/project/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工程项目所有列表
+export function listAllProject(query) {
+  return request({
+    url: '/zcustom/project/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工程项目详细
+export function getProject(id) {
+  return request({
+    url: '/zcustom/project/getInfo/' + id,
+    method: 'get'
+  })
+}
+
+// 新增工程项目
+export function addProject(data) {
+  return request({
+    url: '/zcustom/project/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改工程项目
+export function updateProject(data) {
+  return request({
+    url: '/zcustom/project/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除工程项目
+export function delProject(id) {
+  return request({
+    url: '/zcustom/project/remove/' + id,
+    method: 'get'
+  })
+}

BIN
src/assets/images/main/choose_bg6.png


BIN
src/assets/images/main/choose_bg7.png


BIN
src/assets/images/main/choose_bg8.png


BIN
src/assets/logo/logo-login.png


BIN
src/assets/logo/logo.png


+ 1 - 1
src/layout/components/Sidebar/Logo.vue

@@ -66,7 +66,7 @@ export default {
     width: 100%;
 
     & .sidebar-logo {
-      width: 100px;
+      width: 150px;
       height: auto;
       vertical-align: middle;
       margin-right: 12px;

+ 29 - 29
src/permission.js

@@ -12,34 +12,34 @@ const whiteList = ['/login', '/auth-redirect', '/bind', '/register','/screen','/
 
 router.beforeEach((to, from, next) => {
   NProgress.start()
-  // if (getToken()) {
-  //   to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
-  //   /* has token*/
-  //   if (to.path === '/login') {
-  //     next({ path: '/' })
-  //     NProgress.done()
-  //   } else {
-  //     if (store.getters.roles.length === 0) {
-  //       isRelogin.show = true
-  //       // 判断当前用户是否已拉取完user_info信息
-  //       store.dispatch('GetInfo').then(() => {
-  //         isRelogin.show = false
-  //         store.dispatch('GenerateRoutes').then(accessRoutes => {
-  //           // 根据roles权限生成可访问的路由表
-  //           router.addRoutes(accessRoutes) // 动态添加可访问路由表
-  //           next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
-  //         })
-  //       }).catch(err => {
-  //           store.dispatch('LogOut').then(() => {
-  //             Message.error(err)
-  //             next({ path: '/' })
-  //           })
-  //         })
-  //     } else {
-  //       next()
-  //     }
-  //   }
-  // } else {
+  if (getToken()) {
+    to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
+    /* has token*/
+    if (to.path === '/login') {
+      next({ path: '/index' })
+      NProgress.done()
+    } else {
+      if (store.getters.roles.length === 0) {
+        isRelogin.show = true
+        // 判断当前用户是否已拉取完user_info信息
+        store.dispatch('GetInfo').then(() => {
+          isRelogin.show = false
+          store.dispatch('GenerateRoutes').then(accessRoutes => {
+            // 根据roles权限生成可访问的路由表
+            router.addRoutes(accessRoutes) // 动态添加可访问路由表
+            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
+          })
+        }).catch(err => {
+          store.dispatch('LogOut').then(() => {
+            Message.error(err)
+            next({ path: '/login' })
+          })
+        })
+      } else {
+        next()
+      }
+    }
+  } else {
     // 没有token
     if (whiteList.indexOf(to.path) !== -1) {
       // 在免登录白名单,直接进入
@@ -49,7 +49,7 @@ router.beforeEach((to, from, next) => {
       next(`/screen`) // 否则全部重定向到登录页
       NProgress.done()
     }
-  // } 
+  }
 })
 
 router.afterEach(() => {

+ 3 - 3
src/router/index.js

@@ -98,7 +98,7 @@ export const constantRoutes = [
       }
     ]
   }
-  
+
 ]
 
 // 动态路由,基于用户权限动态去加载
@@ -182,8 +182,8 @@ Router.prototype.push = function push(location) {
 }
 
 export default new Router({
-  base: "/screen",
-  mode: '', // 去掉url中的#
+  base: "",
+  mode: 'history', // 去掉url中的#
   scrollBehavior: () => ({ y: 0 }),
   routes: constantRoutes
 })

+ 1 - 1
src/utils/auth.js

@@ -1,6 +1,6 @@
 import Cookies from 'js-cookie'
 
-const TokenKey = 'Admin-Token'
+const TokenKey = 'Authorization'
 
 export function getToken() {
   return Cookies.get(TokenKey)

+ 414 - 45
src/views/screen/engineering/currentArea.vue

@@ -4,83 +4,276 @@
       <span>当前区域数据</span>
     </div> -->
     <div class="content-area">
-      <img src="@/assets/images/main/data_bg6.png" class="bg" />
+<!--      <img src="@/assets/images/main/data_bg6.png" class="bg" />-->
 
       <!-- 摄像头列表 -->
       <div class="content">
         <div class="content-title long">
-          <span class="title">摄像头列表</span>
+          <span class="title">问题台账统计</span>
         </div>
-        <div class="monitor-cont">
-          <div class="monitor-list" v-for="(item,index) in monitorList" :key="index" @click="chooseMonitor(index)">
-            <img src="@/assets/images/building_guarantee/img_12.png" class="img" />
-            <div class="monitor-info">
-              <div class="name">{{item.abbreviation}}</div>
+        <div class="sddha">
+          <div class="data-asgeh">
+            <div class="asdakda">
+              <div>
+                <img src="@/assets/images/service_new/img_1.png"/>
+              </div>
+              <div>本周检查项目数量</div>
             </div>
+            <div >
+              <div class="num">56 <span class="unit">个</span></div>
+            </div>
+          </div>
+          <div class="data-asgeh">
+            <div class="asdakda">
+              <div>
+                <img src="@/assets/images/service_new/img_1.png"/>
+              </div>
+              <div>问题数量</div>
+            </div>
+            <div class="num">56 <span class="unit">个</span></div>
+          </div>
+          <div class="data-asgeh">
+            <div class="asdakda">
+              <div>
+                <img src="@/assets/images/service_new/img_1.png"/>
+              </div>
+              <div>已整改数量</div>
+            </div>
+            <div class="num">56 <span class="unit">个</span></div>
           </div>
         </div>
       </div>
     </div>
+<!--    近一周问题列表/-->
+    <div class="content-ear">
+      <div class="content">
+        <div class="content-title long">
+          <span class="title">近一周问题列表</span>
+        </div>
+        <div class="table-cont">
+          <div class="table-top">
+            <div class="fir">时间</div>
+            <div class="snd">标题</div>
+            <div class="thd">问题状况</div>
+          </div>
+          <div class="table-roll">
+            <div class="table-bot">
+              <div class="table-list">
+                <div class="said"></div>
+                <div class="fir">2024/12/28</div>
+                <div class="snd">施工整改问题1</div>
+                <div class="smail"></div>
+                <div class="thd">处理中</div></div>
+            </div>
+            <div class="table-bot">
+              <div class="table-list">
+                <div class="said"></div>
+                <div class="fir">2024/12/28</div>
+                <div class="snd">施工整改问题1</div>
+                <div class="smail"></div>
+                <div class="thd">处理中</div></div>
+            </div>
+            <div class="table-bot">
+              <div class="table-list">
+                <div class="said"></div>
+                <div class="fir">2024/12/28</div>
+                <div class="snd">施工整改问题1</div>
+                <div class="smail"></div>
+                <div class="thd">处理中</div></div>
+            </div>
+            <div class="table-bot">
+              <div class="table-list">
+                <div class="said"></div>
+                <div class="fir">2024/12/28</div>
+                <div class="snd">施工整改问题1</div>
+                <div class="smail"></div>
+                <div class="thd">处理中</div></div>
+            </div>
+            <div class="table-bot">
+              <div class="table-list">
+                <div class="said"></div>
+                <div class="fir">2024/12/28</div>
+                <div class="snd">施工整改问题1</div>
+                <div class="smail"></div>
+                <div class="thd">处理中</div></div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+<!--    本周检查计划-->
+    <div class="content-ear">
+      <div class="content">
+        <div class="content-title long">
+          <span class="title">本周检查计划</span>
+        </div>
+        <div class="table-cont">
+          <div class="table-top">
+            <div class="fir">检查日期</div>
+            <div class="snd">所属项目</div>
+            <div class="thd">检查内容</div>
+            <div class="fir">负责人员</div>
+          </div>
+          <div class="table-roll">
+            <div class="table-bot">
+             <div class="table-roll">
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+               <div class="table-list">
+                 <div class="said"></div>
+                 <div class="fir">2024/12/17</div>
+                 <div class="snd">山西电网</div>
+                 <div class="thd">监控接入情况</div>
+                 <div class="fir">张三</div>
+               </div>
+             </div>
+            </div>
+          </div>
+
+        </div>
+      </div>
+    </div>
+<!--    本周施工计划-->
+    <div class="content-ear">
+      <div class="content">
+        <div class="content-title long">
+          <span class="title">本周施工计划</span>
+        </div>
+        <div style="display: flex;flex-wrap: nowrap;overflow: auto">
+          <div class="table-five">
+            <div class="table-top">
+              <div class="fir">所属项目</div>
+              <div class="snd">施工内容</div>
+              <div class="thd">开始日期</div>
+              <div class="fir">结束日期</div>
+              <div class="fiv">负责人</div>
+            </div>
+            <div class="table-bot">
+              <div class="table-roll">
+                <div class="table-list">
+                  <div class="fir">山西电网</div>
+                  <div class="snd">楼宇施工</div>
+                  <div class="thd">2024/12/27</div>
+                  <div class="fir">2025/12/27</div>
+                  <div class="fiv">张三</div>
+                </div>
+                <div class="table-list">
+                  <div class="fir">山西电网</div>
+                  <div class="snd">楼宇施工</div>
+                  <div class="thd">2024/12/27</div>
+                  <div class="fir">2025/12/27</div>
+                  <div class="fiv">张三</div>
+                </div>
+                <div class="table-list">
+                  <div class="fir">山西电网</div>
+                  <div class="snd">楼宇施工</div>
+                  <div class="thd">2024/12/27</div>
+                  <div class="fir">2025/12/27</div>
+                  <div class="fiv">张三</div>
+                </div>
+                <div class="table-list">
+                  <div class="fir">山西电网</div>
+                  <div class="snd">楼宇施工</div>
+                  <div class="thd">2024/12/27</div>
+                  <div class="fir">2025/12/27</div>
+                  <div class="fiv">张三</div>
+                </div>
+                <div class="table-list">
+                  <div class="fir">山西电网</div>
+                  <div class="snd">楼宇施工</div>
+                  <div class="thd">2024/12/27</div>
+                  <div class="fir">2025/12/27</div>
+                  <div class="fiv">张三</div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+      </div>
+    </div>
   </div>
+
 </template>
 
 <script>
 import LineChart from "@/components/Echarts/LineChart.vue";
 import echarts from "echarts";
-import {videoList} from "@/api/screen/service";
+import {getCanteenData, getCanteenNameList, videoList} from "@/api/screen/service";
+import BarChart from "@/components/Echarts/BarChart.vue";
 
 export default {
-  name: "CurrentArea",
+  name: "Canteen",
   components: {
-    LineChart,
+    BarChart
   },
   props: {
-    monitorName:{
-      type: String,
-      default: "",
-      required: true,
-    },
     appOrg: {
       type: String,
       default: "0000",
     },
   },
   watch:{
-    appOrg(newVal, oldVal){
-      this.monitorList = [];
-      setTimeout(()=>{
-        this.videoList();
-      },100)
-    }
   },
   data() {
-    return {
-      monitorList: [],
-    };
   },
   created() {
-    this.videoList();
   },
   destroyed() {},
   beforeDestroy() {},
   mounted() {},
   methods: {
-    //统一视频(工程现场监控)
-    videoList() {
-      let code = "";
-      videoList(code).then((res) => {
-        if (Number(res.code) === 200) {
-          this.monitorList = res.data
-        }
-      });
-    },
+  }
+}
 
-    //选择单个摄像头
-    chooseMonitor(index){
-      this.$emit("chooseMonitor", this.monitorList[index]);
-    }
-  },
-};
 </script>
 
 <style lang="scss">
@@ -92,9 +285,8 @@ export default {
     display: flex;
     flex-direction: row;
     align-items: flex-start;
-    justify-content: space-between;
+    justify-content: flex-start;
     padding: 15px 20px 0 15px;
-    height: calc(100% - 52px);
     overflow: auto;
 
     .bg{
@@ -107,10 +299,31 @@ export default {
       z-index:-5;
     }
   }
+  .content-ear {
+    width: 100%;
+    height: 28%;
+    display: flex;
+
+    flex-direction: row;
+    align-items: flex-start;
+    justify-content: flex-start;
+    padding: 15px 20px 0 15px;
+    overflow: auto;
 
+    .bg{
+      display: block;
+      width:calc(100% - 40px);
+      height:auto;
+      position: absolute;
+      left:20px;
+      bottom:40px;
+      z-index:-5;
+    }
+  }
   .content {
     margin-top: 10px;
     width: 100%;
+    flex-direction: row;
     .title-format {
     display: flex;
     flex-direction: row;
@@ -132,17 +345,54 @@ export default {
       }
     }
   }
+    .sddha{
+      display: flex;
+      margin-left: 20px;
+      align-items: flex-start;
+      justify-content: flex-start;
+
+      .data-asgeh{
+        display: flex;
+        flex-direction: column;
+        padding-top: 12px;
+        padding-left: 10px;
+        padding-right: 50px;
+        justify-content: flex-end;
+      }
+      .asdakda{
+        display: flex;
+        font-size:14px;
+        color:#FFFFFF;
+        justify-content: space-around;
+      }
+    }
+    .num{
+      font-size: 26px;
+      color: #00FFFF;
+      font-weight: bold;
+      font-family: "electronicFont";
+    }
+    .unit{
+      font-size: 12px;
+      color: #00FFFF;
+      font-weight: 500;
+      position: relative;
+      right:4px
+    }
+
+
     .data-list {
       display: flex;
       flex-direction: row;
       align-items: center;
-      justify-content: space-between;
-      width: 100%;
+      justify-content: flex-start;
+      width: 30%;
       .data-item {
         display: flex;
-        flex-direction: column;
+        flex-direction: row;
         justify-content: center;
         flex: 1;
+        width: 30%;
         border-right: 1px solid rgba(25, 252, 222, 0.2);
         margin-right: 20px;
         .data-detail {
@@ -170,6 +420,123 @@ export default {
     }
   }
 
+  .table-cont{
+    width: 100%;
+
+    .table-roll{
+      width: 100%;
+      height: 140px;
+      overflow: auto;
+    }
+    .table-top{
+
+      height: 26px;
+      background: url("../../../assets/images/building_guarantee/img_11.png") no-repeat;
+      background-size: 100% 100%;
+      padding:0 25px 0 10px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size:14px;
+      color:#00FFFF;
+    }
+    .table-bot{
+      width:100%;
+      padding: 5px 0px;
+
+      .table-list{
+        width:100%;
+        height:30px;
+        padding:5px 25px 0 10px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size:14px;
+        color:#FFFFFF;
+        font-weight: 500;
+      }
+    }
+
+    .fir{
+      width:40%;
+      text-align: left;
+      margin-left: 5px;
+    }
+    .snd{
+      width:30%;
+      text-align: left;
+    }
+    .thd{
+      width:30%;
+      left: 3px;
+      text-align: left;
+    }
+  }
+  .table-five{
+    width: 600px;
+
+    .table-roll{
+      width: 100%;
+      height: 120px;
+      overflow: auto;
+    }
+    .table-top{
+
+      height: 26px;
+      background: url("../../../assets/images/building_guarantee/img_11.png") no-repeat;
+      background-size: 100% 100%;
+      padding:0 25px 0 10px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size:14px;
+      color:#00FFFF;
+    }
+    .table-bot{
+      width:100%;
+      padding: 5px 0px;
+
+      .table-list{
+        width:100%;
+        height:30px;
+        padding:5px 25px 0 10px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size:14px;
+        color:#FFFFFF;
+        font-weight: 500;
+      }
+    }
+
+    .fir{
+
+      text-align: left;
+      margin-left: 5px;
+    }
+    .snd{
+
+      text-align: left;
+    }
+    .thd{
+
+      left: 3px;
+      text-align: left;
+    }
+  }
+
+  .said{
+    width: 1px;
+    height: 13px;
+    background-color: #00FFFF;
+  }
+  .smail{
+    width: 8px;
+    height: 8px;
+    background: #FAAD14;
+    border-radius: 50%;
+    border: 1px solid #FFDE9E;
+  }
   .content-title {
     width: 230px;
     height: 26px;
@@ -186,6 +553,7 @@ export default {
       top:-5px !important;
     }
   }
+
   .content-title.long {
     width: 100%;
     background: url("../../../assets/images/main/title_pro_long.png") no-repeat !important;
@@ -244,6 +612,7 @@ export default {
     }
   }
 
+
   ::-webkit-scrollbar {
     display: none;
     width: 3px;

+ 23 - 5
src/views/screen/engineering/main.vue

@@ -9,7 +9,7 @@
               src="@/assets/images/main/cont_title_bg.png"
               alt=""
             />
-            <div class="cont-title">各单位终端数据</div>
+            <div class="cont-title">基建项目总体情况</div>
           </div>
           <div class="components-item">
             <unit-access :key="appOrg"></unit-access>
@@ -17,6 +17,21 @@
           <!-- <monitoring v-if="menu === 1"></monitoring>
           <monitoring-video v-if="menu === 2"></monitoring-video> -->
         </div>
+        <div class="left-top">
+          <div class="cont-title-area">
+            <img
+              class="cont-title-bg"
+              src="@/assets/images/main/cont_title_bg.png"
+              alt=""
+            />
+            <div class="cont-title">现场监控接入情况</div>
+          </div>
+          <div class="components-item">
+            <unit-access-to :key="appOrg"></unit-access-to>
+          </div>
+          <!-- <monitoring v-if="menu === 1"></monitoring>
+          <monitoring-video v-if="menu === 2"></monitoring-video> -->
+        </div>
       </div>
     </div>
     <div class="middle flex-column">
@@ -125,7 +140,7 @@
               src="@/assets/images/main/cont_title_bg.png"
               alt=""
             />
-            <div class="cont-title">现场监控</div>
+            <div class="cont-title">现场远程检查情况</div>
           </div>
           <div class="components-item">
             <current-area @chooseMonitor="onChooseMonitor" :monitorName="monitorName" :key="appOrg"></current-area>
@@ -158,6 +173,7 @@
 <script>
 import Province from "../map/province.vue";
 import UnitAccess from "./unitAccess.vue";
+import UnitAccessTo from "./unitAccessto.vue";
 import CameraOnline from "./cameraOnline.vue";
 import CurrentArea from "./currentArea.vue";
 import Monitoring from "./monitoring.vue";
@@ -173,6 +189,7 @@ export default {
   components: {
     Province,
     UnitAccess,
+    UnitAccessTo,
     CameraOnline,
     CurrentArea,
     Monitoring,
@@ -358,10 +375,11 @@ export default {
     }
     .components-item {
       width: 550px;
-      height: 849px;
-      background: url("../../../assets/images/main/components_long_bg.png")
-        no-repeat;
+      height: 389px;
+      background: url("../../../assets/images/main/components_mid_bg.png")
+      no-repeat;
       background-size: cover;
+      margin-bottom: 28px;
       margin-left: 15px;
       overflow: hidden;
     }

+ 98 - 51
src/views/screen/engineering/unitAccess.vue

@@ -6,61 +6,68 @@
         <div class="data-list flex-row align-items-center flex-wrap">
           <div v-for="(item, index) in dataList" :key="index" class="data-item">
             <div class="title-format">
-              <img src="@/assets/images/main/blue.png" class="icon" alt="" />
-              <div class="title-info">
-                <span>{{ item.name }}</span>
+<!--              <img src="@/assets/images/main/blue.png" class="icon" alt="" />-->
+<!--              title-info-->
+              <div class="content-title long">
+                <span class="title">{{ item.name }}</span>
               </div>
             </div>
             <div class="data-detail">
+              <img   :src="item.image">
               <div class="data">{{ item.num }}</div>
               <div class="unit">{{ item.unit }}</div>
             </div>
           </div>
         </div>
+<!--折线图-->
+<!--        <div class="chart-item" style="margin-top:10px;">-->
+<!--          <line-chart-->
+<!--            v-if="show"-->
+<!--            :chart-data="lineData"-->
+<!--            :x-axis="lineAxis"-->
+<!--            :yAxis="lineYAxis"-->
+<!--            y-color="#FFF"-->
+<!--            l-color="#FFF"-->
+<!--            width="520px"-->
+<!--            height="160px"-->
+<!--          />-->
+<!--        </div>-->
+<!--        <div class="chart-item">-->
+<!--          <line-chart-->
+<!--            v-if="show"-->
+<!--            :chart-data="onlineData"-->
+<!--            :x-axis="onlineAxis"-->
+<!--            :yAxis="onlineYAxis"-->
+<!--            y-color="#FFF"-->
+<!--            l-color="#FFF"-->
+<!--            width="520px"-->
+<!--            height="160px"-->
+<!--          />-->
+<!--        </div>-->
 
-        <div class="chart-item" style="margin-top:10px;">
-          <line-chart
-            v-if="show"
-            :chart-data="lineData"
-            :x-axis="lineAxis"
-            :yAxis="lineYAxis"
-            y-color="#FFF"
-            l-color="#FFF"
-            width="520px"
-            height="160px"
-          />
-        </div>
-        <div class="chart-item">
-          <line-chart
-            v-if="show"
-            :chart-data="onlineData"
-            :x-axis="onlineAxis"
-            :yAxis="onlineYAxis"
-            y-color="#FFF"
-            l-color="#FFF"
-            width="520px"
-            height="160px"
-          />
-        </div>
-
-        <div class="table-cont">
-          <div class="table-top">
-            <div class="fir">单位名称</div>
-            <div class="snd">已接入摄像头数量</div>
-            <div class="thd">已接入摄像头在线数量</div>
-          </div>
-          <div class="table-bot">
-            <div class="table-list" v-for="(item,index) in unitDataList" :key="index">
-              <div class="fir">{{item.name}}</div>
-              <div class="snd">{{item.num}}</div>
-              <div class="thd color">{{item.onLineNum}}</div>
-            </div>
-          </div>
-        </div>
-
-
+<!--        <div class="table-cont">-->
+<!--          <div class="cont-title-area">-->
+<!--            <img-->
+<!--              class="cont-title-bg"-->
+<!--              src="@/assets/images/main/cont_title_bg.png"-->
+<!--              alt=""-->
+<!--            />-->
+<!--            <div class="cont-title">各单位终端数据</div>-->
+<!--          </div>-->
+<!--          <div class="table-top">-->
+<!--            <div class="fir">单位名称</div>-->
+<!--            <div class="snd">企业数量</div>-->
+<!--            <div class="thd">摄像头数量</div>-->
+<!--          </div>-->
+<!--          <div class="table-bot">-->
+<!--            <div class="table-list" v-for="(item,index) in unitDataList" :key="index">-->
+<!--              <div class="fir">{{item.name}}</div>-->
+<!--              <div class="snd">{{item.num}}</div>-->
+<!--              <div class="thd color">{{item.onLineNum}}</div>-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </div>-->
       </div>
-
     </div>
   </div>
 </template>
@@ -103,8 +110,12 @@ export default {
         containLabel: true,
         bottom: 0,
       },
+      imgList:[
+        require('../../../assets/images/main/choose_bg6.png'),
+      ],
       dataList: [
         {
+
           name: "接入单位数量",
           num: "56",
           unit: "个",
@@ -200,31 +211,37 @@ export default {
       setTimeout(()=>{
         this.dataList = [
           {
+            image: require('../../../assets/images/main/choose_bg8.png'),
             name: "接入单位数量",
             num: "56",
             unit: "个",
           },
           {
+            image: require('../../../assets/images/main/choose_bg7.png'),
             name: "应接入项目数量",
             num: "56",
             unit: "个",
           },
           {
+            image: require('../../../assets/images/main/choose_bg7.png'),
             name: "已接入项目数量",
             num: "56",
             unit: "个",
           },
           {
+            image: require('../../../assets/images/main/choose_bg6.png'),
             name: "已接入摄像头数量",
             num: "56",
             unit: "个",
           },
           {
+            image: require('../../../assets/images/main/choose_bg6.png'),
             name: "已接入摄像头在线数量",
             num: "56",
             unit: "个",
           },
           {
+            image: require('../../../assets/images/main/choose_bg6.png'),
             name: "已接入摄像头在线率",
             num: "56",
             unit: "%",
@@ -367,7 +384,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .data-unit-access {
   height: 100%;
   overflow: hidden;
@@ -377,7 +394,7 @@ export default {
     align-items: flex-start;
     justify-content: space-between;
     padding: 15px 20px 0 15px;
-    height: calc(100% - 52px);
+    height: calc(100% - 10px);
     overflow: auto;
   }
 
@@ -421,6 +438,22 @@ export default {
         }
       }
     }
+  .content-title {
+    width: 244px;
+    height: 33px;
+    background: url("../../../assets/images/main/title_pro.png") no-repeat !important;
+    background-size: 100% 100%;
+    font-family: "PingFangSC";
+    font-size: 16px;
+    font-weight: bold;
+    color: #00ffff;
+    //padding-left: 20px !important;
+    .title {
+      display: block;
+      position: relative;
+      top:-5px !important;
+    }
+  }
     .total-data {
       display: flex;
       align-items: baseline;
@@ -434,7 +467,15 @@ export default {
         font-size: 12px;
       }
     }
-
+    .data-detail{
+      align-items: center;
+      img{
+        width: 58px;
+        height:56px ;
+        margin-left: 45px;
+        margin-right: 5px;
+      }
+    }
     .data-list {
       display: flex;
       width: 100%;
@@ -442,12 +483,12 @@ export default {
         display: flex;
         flex-direction: column;
         justify-content: center;
-        width: 33%;
-        margin-bottom: 25px;
+        width: 50%;
+        margin-bottom: 11px;
         .data-detail {
           display: flex;
           flex-direction: row;
-          align-items: baseline;
+          align-items: center;
           color: #00ffff;
           margin-top: 11px;
           font-size: 12px;
@@ -502,6 +543,12 @@ export default {
       margin-top: 50px;
     }
   }
+ .iaco{
+   width: 58px;
+   height:56px ;
+   margin-left: 45px;
+   margin-right: 5px;
+ }
 
   .table-cont{
     width:100%;

+ 547 - 0
src/views/screen/engineering/unitAccessto.vue

@@ -0,0 +1,547 @@
+<template>
+  <div class="main-data data-unit-access">
+    <!-- <div class="title-area">各单位的接入情况</div> -->
+    <div class="content-area">
+      <div class="content-title">
+        <span class="title">工程现场监控接入情况</span>
+      </div>
+      <div class="content">
+        <div class="table-cont">
+          <div class="table-top">
+            <div class="fir">接入单位名称</div>
+            <div class="snd">已接入项目数量</div>
+            <div class="thd">已接入摄像头数量</div>
+          </div>
+          <div class="table-bot">
+            <div class="table-list" v-for="(item,index) in unitDataList" :key="index">
+              <div class="said"></div>
+              <div class="fir">{{item.name}}</div>
+              <div class="snd">{{item.num}}</div>
+              <div class="thd color">{{item.onLineNum}}</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BarChart from "@/components/Echarts/BarChart";
+import LineChart from "@/components/Echarts/LineChart.vue";
+import echarts from "echarts";
+
+export default {
+  name: "UnitAccessTo",
+  components: {
+    LineChart,
+    BarChart,
+  },
+  props:{
+    appOrg: {
+      type: String,
+      default: "0000",
+    },
+  },
+  watch:{
+    appOrg(newVal, oldVal){
+      // this.handleDataList();
+      // this.handleUnitDataList();
+      // this.handleCurrentArea();
+      // this.handleOnlineData();
+    }
+  },
+  data() {
+    return {
+      show: true,
+      barData: [],
+      barAxis: {},
+      barYAxis: {},
+      barGrid: {
+        top: 30,
+        left: "3%",
+        right: "6%",
+        containLabel: true,
+        bottom: 0,
+      },
+      dataList: [
+        {
+          name: "接入单位数量",
+          num: "56",
+          unit: "个",
+        },
+        {
+          name: "应接入项目数量",
+          num: "56",
+          unit: "个",
+        },
+        {
+          name: "已接入项目数量",
+          num: "56",
+          unit: "个",
+        },
+        {
+          name: "已接入摄像头数量",
+          num: "56",
+          unit: "个",
+        },
+        {
+          name: "已接入摄像头在线数量",
+          num: "56",
+          unit: "个",
+        },
+        {
+          name: "已接入摄像头在线率",
+          num: "56",
+          unit: "%",
+        },
+      ],
+      lineData: [],
+      lineAxis: {},
+      lineYAxis: {
+        name: "历史摄像头在线率",
+        nameTextStyle: {
+          color: "#fff",
+          padding: [0, 0, 0, 30],
+        },
+        axisLabel: {
+          color: "#FFF",
+        },
+        splitLine: {
+          show: false,
+        },
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        splitArea: false,
+      },
+      onlineData: [],
+      onlineAxis: {},
+      onlineYAxis: {
+        name: "历史摄像头数(个)",
+        nameTextStyle: {
+          color: "#fff",
+          fontSize: 14,
+          padding: [0,0,0,35]
+        },
+        axisLabel: {
+          color: "#FFF",
+        },
+        splitLine: {
+          show: false,
+        },
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        splitArea: false,
+      },
+      monitorList: [],
+      unitDataList: [],
+    };
+  },
+  created() {
+    this.handleDataList();
+    this.handleUnitDataList();
+    this.handleCurrentArea();
+    this.handleOnlineData();
+  },
+  destroyed() {},
+  beforeDestroy() {},
+  mounted() {},
+  methods: {
+
+    handleDataList() {
+      this.dataList = [];
+      setTimeout(()=>{
+        this.dataList = [
+          {
+            name: "接入单位数量",
+            num: "56",
+            unit: "个",
+          },
+          {
+            name: "应接入项目数量",
+            num: "56",
+            unit: "个",
+          },
+          {
+            name: "已接入项目数量",
+            num: "56",
+            unit: "个",
+          },
+          {
+            name: "已接入摄像头数量",
+            num: "56",
+            unit: "个",
+          },
+          {
+            name: "已接入摄像头在线数量",
+            num: "56",
+            unit: "个",
+          },
+          {
+            name: "已接入摄像头在线率",
+            num: "56",
+            unit: "%",
+          },
+        ];
+      },100)
+    },
+
+    //初始化
+    handleUnitDataList() {
+      let unitDataList = [];
+      unitDataList.push({
+        name: "国网山西省电力公司",
+        num: 56,
+        onLineNum: 46
+      });
+      unitDataList.push({
+        name: "国网太原供电公司",
+        num: 10,
+        onLineNum: 8
+      });
+      unitDataList.push({
+        name: "国网运城供电公司",
+        num: 8,
+        onLineNum: 4
+      });
+      unitDataList.push({
+        name: "国网临汾供电公司",
+        num: 7,
+        onLineNum: 6
+      });
+      unitDataList.push({
+        name: "国网晋城供电公司",
+        num: 6,
+        onLineNum: 6
+      });
+      unitDataList.push({
+        name: "国网吕梁供电公司",
+        num: 4,
+        onLineNum: 3
+      });
+      unitDataList.push({
+        name: "国网大同供电公司",
+        num: 4,
+        onLineNum: 3
+      });
+      this.unitDataList = unitDataList;
+    },
+
+    handleCurrentArea() {
+      (this.lineData = [
+        {
+          name: "",
+          type: "line",
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0.03,
+                color: "rgba(30, 240, 215, 0.4196)",
+              },
+              {
+                offset: 0.68,
+                color: "rgba(23, 240, 240, 0)",
+              },
+            ]),
+          },
+          lineStyle: {
+            width: 2, // 设置线宽
+            color: "#00FFFF", // 设置线的颜色
+          },
+
+          smooth: true,
+          data: [40, 60, 80, 50],
+        },
+      ]),
+        (this.lineAxis = {
+          type: "category",
+          data: ["0-6", "6-12", "12-18", "18-24"],
+          axisLabel: {
+            color: "white", // 设置横坐标轴字体颜色为红色
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#465A64",
+            },
+          },
+          boundaryGap: false,
+        });
+    },
+
+    handleOnlineData() {
+      (this.onlineData = [
+        {
+          name: "",
+          type: "line",
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0.03,
+                color: "rgba(30, 240, 215, 0.4196)",
+              },
+              {
+                offset: 0.68,
+                color: "rgba(23, 240, 240, 0)",
+              },
+            ]),
+          },
+          lineStyle: {
+            width: 2, // 设置线宽
+            color: "#00FFFF", // 设置线的颜色
+          },
+
+          smooth: true,
+          data: [40, 60, 80, 50],
+        },
+      ]),
+        (this.onlineAxis = {
+          type: "category",
+          data: ["0-6", "6-12", "12-18", "18-24"],
+          axisLabel: {
+            color: "white", // 设置横坐标轴字体颜色为红色
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#465A64",
+            },
+          },
+          boundaryGap: false,
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.content-title {
+  width: 100%;
+  height: 26px;
+  background: url("../../../assets/images/main/title_pro_long.png") no-repeat;
+  background-size: 100% 100%;
+  font-family: "PingFangSC";
+  font-size: 16px;
+  font-weight: bold;
+  color: #00ffff;
+  padding-left: 15px;
+  .title {
+    display: block;
+    position: relative;
+    top:-5px;
+  }
+}
+.data-unit-access {
+  height: 100%;
+  overflow: hidden;
+  .content-area {
+    display: flex;
+    flex-direction: column;
+    padding: 15px 20px 0 15px;
+  }
+
+  .said{
+    width: 1px;
+    height: 13px;
+    background-color: #00FFFF;
+  }
+
+
+  .content {
+    width: 100%;
+    margin-top: 20px;
+    display: flex;
+    flex-direction: column;
+    .title-format {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      img {
+        width: 6px;
+        height: 24px;
+        margin-right: 6px;
+      }
+      .title-info {
+        display: flex;
+        flex-direction: column;
+        font-size: 14px;
+        color: #ffffff;
+        .title-en {
+          font-size: 8px;
+          color: #ffffff;
+          opacity: 0.4;
+        }
+      }
+    }
+    .total-data {
+      display: flex;
+      align-items: baseline;
+      color: #19fcde;
+      margin-top: 4px;
+      .total {
+        font-size: 35px;
+        font-family: "electronicFont";
+      }
+      .unit {
+        font-size: 12px;
+      }
+    }
+    data-detail{
+      align-items: center;
+    }
+    .data-list {
+      display: flex;
+      width: 100%;
+      .data-item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        width: 50%;
+        margin-bottom: 11px;
+        .data-detail {
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+          color: #00ffff;
+          margin-top: 11px;
+          font-size: 12px;
+          .data {
+            font-size: 30px;
+            font-family: "electronicFont";
+          }
+        }
+      }
+      .data-item:nth-child(3n) {
+        margin-right: 0;
+      }
+    }
+
+    .rate-area {
+      position: relative;
+      margin-left: 35px;
+      img {
+        width: 168px;
+        height: 97px;
+      }
+      .rate {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        width: 100%;
+        position: absolute;
+        top: 0;
+        left: -10px;
+        color: #fff;
+        .rate-data {
+          display: flex;
+          flex-direction: row;
+          align-items: baseline;
+          color: #ffba44;
+          .data {
+            font-size: 30px;
+            font-family: "electronicFont";
+          }
+          .unit {
+            font-size: 12px;
+          }
+        }
+        .desc {
+          font-size: 12px;
+          text-align: center;
+        }
+      }
+    }
+    .chart-area{
+      margin-top: 50px;
+    }
+  }
+  .iaco{
+    width: 58px;
+    height:56px ;
+    margin-left: 45px;
+    margin-right: 5px;
+  }
+
+  .table-cont{
+    width:100%;
+
+    .table-top{
+      width:100%;
+      height: 26px;
+      background: url("../../../assets/images/building_guarantee/img_11.png") no-repeat;
+      background-size: 100% 100%;
+      padding:0 25px 0 10px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size:14px;
+      color:#00FFFF;
+    }
+    .table-bot{
+      width:100%;
+
+      .table-list{
+        width:100%;
+        height:30px;
+        margin-top: 3px;
+        padding:5px 25px 0 10px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size:14px;
+        color:#FFFFFF;
+        font-weight: 500;
+      }
+    }
+
+    .fir{
+      width:40%;
+      text-align: left;
+      margin-left: 5px;
+    }
+    .snd{
+      width:30%;
+      text-align: left;
+    }
+    .thd{
+      width:30%;
+      text-align: left;
+    }
+  }
+
+  ::-webkit-scrollbar {
+    display: none;
+    width: 3px;
+    height: 3px;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    //滑块部分
+    // border-radius: 5px;
+    background-color: #58cbbb;
+  }
+
+  ::-webkit-scrollbar-track {
+    //轨道部分
+    // box-shadow: inset 0 0 5px #ddd;
+    background: #ddd;
+    // border-radius: 5px;
+  }
+}
+</style>
+

+ 12 - 3
src/views/screen/main.vue

@@ -23,6 +23,7 @@
               后勤资源监控
             </div>
           </div>
+          <div class="mid" @dblclick="fullScreen"></div>
           <div class="right">
             <div
               :class="['model', 3 == curIndex ? 'cur' : '']"
@@ -131,6 +132,9 @@ export default {
     document.documentElement.requestFullscreen();
   },
   methods: {
+    fullScreen(){
+      document.documentElement.requestFullscreen();
+    },
     //切换菜单
     chooseTab(index) {
       this.curIndex = index;
@@ -166,12 +170,12 @@ export default {
   height: 100vh;
   overflow: hidden;
   position: relative;
+  background-image: url("../../assets/images/main/main_bg.jpg");
+  background-size: cover;
 
   .main-wrapper {
     width: 1920px;
     height: 1080px;
-    background-image: url("../../assets/images/main/main_bg.jpg");
-    background-size: cover;
 
     margin: 0 auto;
     position: relative;
@@ -211,6 +215,11 @@ export default {
           background: url("../../assets/images/main/menu_chooe.png") no-repeat;
         }
       }
+      .mid{
+        display: flex;
+        width: 700px;
+        height: 80px;
+      }
 
       .middle {
         flex: 1;
@@ -295,7 +304,7 @@ export default {
   .main-data{
     position: relative;
     z-index:3;
- 
+
   }
 
   .map-bg{

+ 254 - 100
src/views/screen/official/terminalDataDialog.vue

@@ -4,105 +4,150 @@
     @click.stop="preventDefault"
     @mouseleave="leaveFun"
   >
-    <div class="dialog-title">
-      <img src="@/assets/images/main/cont_title_bg.png" />
-      <div class="title">各单位终端数据</div>
-    </div>
+<!--    <div class="dialog-title">-->
+<!--      <img src="@/assets/images/main/cont_title_bg.png" />-->
+<!--      <div class="title">资源台账</div>-->
+<!--    </div>-->
+<!--    <div class="dialog-cont">-->
+<!--      <div class="dialog-left">-->
+<!--        <div class="dialog-list">-->
+
+<!--        </div>-->
+<!--      </div>-->
+<!--    </div>-->
     <div class="dialog-cont">
       <div class="dialog-left">
+        <div class="content-title long">
+          <span class="title">公务车实有数</span>
+        </div>
         <div class="dialog-list">
           <div class="content-left">
-            <div class="content-title">
-              <span class="title">终端设备整体在线率</span>
+            <div class="dialog-list">
+              <div class=" content-our">
+                <div class="content-two">
+                  <div class="img-car">
+                    <img src="@/assets/images/main/choose_bg9.png">
+                  </div>
+                    <div class="data-snd">
+                      <div class="names">56<span class="nums">万辆</span></div>
+                    </div>
+                </div>
+              </div>
+              <div class="saddddf">
+                <div class="naw">车辆用途</div>
+                <div class="content">
+                  <div class="charts-cont">
+                    <pie-chart
+                      :chart-data="pieData"
+                      :legend="pieLegend"
+                      :center="pieCenter"
+                      width="220px"
+                      height="140px"
+                    />
+                  </div>
+                </div>
+              </div>
             </div>
-            <div class="content">
-              <div class="rate-area">
-                <img
-                  src="@/assets/images/main/rate_bg.png"
-                  class="icon"
-                  alt=""
-                />
-                <div class="rate">
-                  <div class="rate-data">
-                    <div class="data">56</div>
-                    <div class="unit">%</div>
+            <div class="dialog-list">
+              <div>
+                <div class="naw">车辆类型</div>
+                <div class="content">
+                  <div class="charts-cont">
+                    <pie-chart
+                      :chart-data="totalPieData"
+                      :legend="totalPieLegend"
+                      :center="totalCenter"
+                      width="220px"
+                      height="140px"
+                    />
+                  </div>
+                </div>
+              </div>
+              <div>
+                <div class="naw">动力类型</div>
+                <div class="content">
+                  <div class="charts-cont">
+                    <pie-chart
+                      :chart-data="catePieData"
+                      :legend="catePieLegend"
+                      :center="catePieCenter"
+                      width="220px"
+                      height="140px"
+                    />
                   </div>
-                  <div class="desc">整体在线率</div>
                 </div>
               </div>
             </div>
+            </div>
           </div>
+      </div>
+        <div class="content-area">
+         <div class="contentr-left"  >
+           <div class="dialog-item wid100">
+             <div class="content-title">
+               <span class="title">公务车编制概况</span>
+             </div>
+             <div>
+               <div class="content-maper">
+                 <div class="content-one">
+                   <div class="img-car">
+                     <img src="@/assets/images/main/choose_bg9.png">
+                   </div>
+                   <div class="">
+                     <div class="namer">公务车编制数</div>
+                     <div class="names">56<span class="nums">万辆</span></div>
+                   </div>
+                 </div>
+               </div>
+               <div class="content-maper">
+                 <div class="content-one">
+                   <div class="img-car">
+                     <img src="@/assets/images/main/choose_bg9.png">
+                   </div>
+                   <div class="">
+                     <div class="namer">公务车缺勤率</div>
+                     <div class="names">56<span class="nums">%</span></div>
+                   </div>
+                 </div>
+               </div>
+             </div>
+           </div>
+         </div>
           <div class="content-right">
-            <div class="content-title">
-              <span class="title">设备在线数</span>
-            </div>
-            <div class="content">
-              <div class="data-content flex-row align-items-center">
-                <div class="data-left">
-                  <div class="data-item">
-                    <div class="data-fir">
-                      <img
-                        src="@/assets/images/service_new/img_2.png"
-                        class="icon"
-                      />
-                      <div class="name">离线数</div>
-                    </div>
-                    <div class="data-snd">
-                      <div class="num">56</div>
-                      <div class="unit">个</div>
+            <div class="dialog-item wid100">
+              <div class="content-title">
+                <span class="title">公务车年度车辆数</span>
+              </div>
+              <div class="">
+                <div class="content">
+                  <div class="rate-area">
+                    <img src="@/assets/images/main/rate_bg.png" class="img-car" alt="" />
+                    <div class="rate">
+                      <div class="rate-data">
+                        <div class="data">56</div>
+                        <div class="unit">%</div>
+                      </div>
+                      <div class="desc">整体在线率</div>
                     </div>
                   </div>
-                  <div class="data-item">
-                    <div class="data-fir">
-                      <img
-                        src="@/assets/images/service_new/img_1.png"
-                        class="icon"
-                      />
-                      <div class="name">在线数</div>
-                    </div>
-                    <div class="data-snd">
-                      <div class="num">56</div>
-                      <div class="unit">个</div>
+                </div>
+              </div>
+              <div class="">
+                <div class="content">
+                  <div class="rate-area">
+                    <img src="@/assets/images/main/rate_bg.png" class="img-car" alt="" />
+                    <div class="rate">
+                      <div class="rate-data">
+                        <div class="data">56</div>
+                        <div class="unit">%</div>
+                      </div>
+                      <div class="desc">整体在线率</div>
                     </div>
                   </div>
                 </div>
-                <div class="data-right">
-                  <pie-chart
-                    position="left"
-                    :chart-data="pieData"
-                    :legend="pieLegend"
-                    :center="pieCenter"
-                    :radius="pieRadius"
-                    width="150px"
-                    height="150px"
-                  />
-                </div>
               </div>
-            </div>
-          </div>
-        </div>
 
-        <div class="dialog-list">
-          <div class="dialog-item wid100">
-            <div class="content-title long">
-              <span class="title">各单位终端设备在线情况</span>
-            </div>
-            <div class="data-chart">
-              <!--              <div class="choose-area flex-row align-items-center">
-                <div class="choose-item">年度统计</div>
-                <div class="choose-item">2024年</div>
-              </div>-->
-              <bar-chart
-                :chart-data="barData"
-                :x-axis="barAxis"
-                :y-axis="barYAxis"
-                :grid="barGrid"
-                :legend="barLegend"
-                y-color="#FFF"
-                l-color="#FFF"
-                width="500px"
-                height="300px"
-              />
+              </div>
             </div>
           </div>
         </div>
@@ -113,11 +158,6 @@
               <span class="title">各单位车辆预警统计列表</span>
             </div>
             <div class="content">
-              <!--              <div class="choose-area flex-row align-items-center">-->
-              <!--                <div class="choose-item">单位</div>-->
-              <!--                <div class="choose-item">异动类型</div>-->
-              <!--                <div class="choose-item">预警排序</div>-->
-              <!--              </div>-->
               <div class="list-area">
                 <div class="list-item list-title">
                   <div class="item item-1">序号</div>
@@ -134,14 +174,7 @@
                   class="list-item"
                 >
                   <div class="item item-1">{{ index + 1 }}</div>
-                  <!-- <el-tooltip
-                    class="item"
-                    effect="dark"
-                    L:content="item.name"
-                    placement="top-start"
-                  > -->
                     <div class="item item-2">{{ item.name }}</div>
-                  <!-- </el-tooltip> -->
                   <div class="item item-3">{{ item.data1 }}</div>
                   <div class="item item-4">{{ item.data2 }}</div>
                   <div class="item item-5">{{ item.data3 }}</div>
@@ -154,7 +187,6 @@
         </div>
       </div>
     </div>
-  </div>
 </template>
 
 <script>
@@ -175,10 +207,50 @@ export default {
     return {
       //在线数
       pieData: [],
+      catePieData: [
+        { value: 40, name: "新能源汽车" },
+        { value: 20, name: "燃油汽车" },
+      ],
+      totalPieData: [
+        { value: 110, name: "商务车" },
+        { value: 120, name: "越野车" },
+        { value: 130, name: "小型客车" },
+        { value: 140, name: "大型客车" },
+        { value: 150, name: "小轿车" },
+      ],
+      catePieLegend: {
+        orient: "vertical",
+        top: 60,
+        right: 23,
+        itemWidth: 8, // 设置图例标记的宽度
+        itemHeight: 8, // 设置图例标记的高度
+        textStyle: {
+          color: "#FFF",
+        },
+      },
+      totalPieLegend: {
+        top: 20,
+        right: 10,
+        itemWidth: 8,
+        itemHeight: 8,
+        orient: "vertical",
+        textStyle: {
+          color: "#FFF",
+        },
+      },
       pieLegend: {
-        show: false,
+        orient: "vertical",
+        top: 50,
+        right: 30,
+        itemWidth: 8, // 设置图例标记的宽度
+        itemHeight: 8, // 设置图例标记的高度
+        textStyle: {
+          color: "#FFF",
+        },
       },
-      pieCenter: ["50%", "50%"],
+      pieCenter: ["27%", "50%"],
+      totalCenter: ["30%", "50%"],
+      catePieCenter: ["27%", "50%"],
       pieRadius: ["35%", "50%"],
 
       //各单位终端在线
@@ -599,7 +671,7 @@ export default {
     width: 100%;
     display: flex;
     justify-content: space-between !important;
-    margin-bottom: 20px;
+    margin-bottom: 0px;
 
     .dialog-item {
       width: calc(50% - 20px);
@@ -645,7 +717,6 @@ export default {
   }
 
   .content {
-    margin-top: 20px;
     .title-format {
       display: flex;
       flex-direction: row;
@@ -706,7 +777,6 @@ export default {
     }
   }
   .content {
-    margin-top: 20px;
     .title-format {
       display: flex;
       flex-direction: row;
@@ -1004,7 +1074,92 @@ export default {
     width: 3px;
     height: 3px;
   }
+  .content-left{
+    width: 520px;
+    height:320px;
+    float: left;
+  }
+  .content-our{
+    width: 50%;
+    height: 130px;
+    display: flex;
+    padding-top: 40px;
+    padding-left: 10px;
+    //align-items: center;
+    .img-car{
+      width: 105px;
+      height: 81px;
+    }
+    .content-two{
+      width: 181.5px;
+      height: 81px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+    .names{
+      font-size: 32px;
+      color:#00FFFF;
+      font-family: 'electronicFont';
+      .nums{
+        font-size:10px;
+        color:#00FFFF;
+        font-weight: 500;
+        position: relative;
 
+        left:2px;
+      }
+    }
+  }
+  .saddddf{
+    display: flex;
+    flex-direction: column;
+
+  }
+  .naw{
+    color: white;
+  }
+  .content-area {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    justify-content: space-between;
+    padding: 15px 20px 0 15px;
+  }
+  .contentr-left{
+    width: 520px;
+    height:240px;
+    float: left;
+  }
+  .content-right{
+    width: 520px;
+    height:240px;
+    float: left;
+  }
+  .content-one{
+    display: flex;
+    justify-content: center; /* 水平居中 */
+    align-items: center;    /* 垂直居中 */
+    height: 100%;           /* 确保父容器有高度 */
+  }
+  .names{
+    font-size: 32px;
+    color:#00FFFF;
+    font-family: 'electronicFont';
+    .nums{
+      font-size:10px;
+      color:#00FFFF;
+      font-weight: 500;
+      position: relative;
+
+      left:2px;
+    }
+
+  }
+  .namer{
+    color: white;
+    font-size: 10px;
+  }
   ::-webkit-scrollbar-thumb {
     //滑块部分
     // border-radius: 5px;
@@ -1019,4 +1174,3 @@ export default {
   }
 }
 </style>
-

+ 325 - 0
src/views/zcustom/camera/index.vue

@@ -0,0 +1,325 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+      <el-form-item label="摄像头名称" prop="cameraName">
+        <el-input
+          v-model="queryParams.cameraName"
+          placeholder="请输入摄像头名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="在线标志" prop="onlineFlag">
+        <el-input
+          v-model="queryParams.onlineFlag"
+          placeholder="请输入在线标志"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="接入标志" prop="connectFlag">
+        <el-input
+          v-model="queryParams.connectFlag"
+          placeholder="请输入接入标志"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['zcustom:camera:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['zcustom:camera:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['zcustom:camera:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="cameraList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" width="50">
+        <template slot-scope="scope">
+          {{(scope.$index + 1) + ((queryParams.pageNum - 1) * queryParams.pageSize)}}
+        </template>
+      </el-table-column>
+      <el-table-column label="摄像头名称" align="center" prop="cameraName" />
+      <el-table-column label="摄像头类型" align="center" prop="type">
+        <template slot-scope="scope">
+          <span v-if="scope.row.type == 0">海康</span>
+          <span v-if="scope.row.type == 1">大华</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="摄像头状态" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status == 0">启用</span>
+          <span v-if="scope.row.status == 2">禁用</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="在线标志" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.onlineFlag == 0">在线</span>
+          <span v-if="scope.row.onlineFlag == 2">离线</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="接入标志" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.connectFlag == 0">已接入</span>
+          <span v-if="scope.row.connectFlag == 2">未接入</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['zcustom:camera:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['zcustom:camera:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改摄像头对话框 -->
+    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="摄像头名称" prop="cameraName">
+          <el-input v-model="form.cameraName" placeholder="请输入摄像头名称" />
+        </el-form-item>
+        <el-form-item label="所属项目id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入所属项目id" />
+        </el-form-item>
+        <el-form-item label="在线标志" prop="onlineFlag">
+          <el-input v-model="form.onlineFlag" placeholder="请输入在线标志" />
+        </el-form-item>
+        <el-form-item label="接入标志" prop="connectFlag">
+          <el-input v-model="form.connectFlag" placeholder="请输入接入标志" />
+        </el-form-item>
+        <el-form-item label="删除标志" prop="delFlag">
+          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listCamera, getCamera, delCamera, addCamera, updateCamera } from "@/api/zcustom/camera";
+
+export default {
+  name: "Camera",
+  data() {
+    return {
+      // 根路径
+      baseURL: process.env.VUE_APP_BASE_API,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 摄像头表格数据
+      cameraList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        cameraName: null,
+        projectId: null,
+        type: null,
+        status: null,
+        onlineFlag: null,
+        connectFlag: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        id: [
+          { required: true, message: "摄像头id不能为空", trigger: "blur" }
+        ],
+        cameraName: [
+          { required: true, message: "摄像头名称不能为空", trigger: "blur" }
+        ],
+        projectId: [
+          { required: true, message: "所属项目id不能为空", trigger: "blur" }
+        ],
+        type: [
+          { required: true, message: "摄像头类型不能为空", trigger: "change" }
+        ],
+        status: [
+          { required: true, message: "摄像头状态不能为空", trigger: "blur" }
+        ],
+        onlineFlag: [
+          { required: true, message: "在线标志不能为空", trigger: "blur" }
+        ],
+        connectFlag: [
+          { required: true, message: "接入标志不能为空", trigger: "blur" }
+        ],
+        delFlag: [
+          { required: true, message: "删除标志不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询摄像头列表 */
+    getList() {
+      this.loading = true;
+      listCamera(this.queryParams).then(response => {
+        this.cameraList =  response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        cameraName: null,
+        projectId: null,
+        type: null,
+        status: "0",
+        onlineFlag: null,
+        connectFlag: null,
+        delFlag: null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加摄像头";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getCamera(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改摄像头";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateCamera(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addCamera(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除?').then(function() {
+        return delCamera(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('zcustom/camera/export', {
+        ...this.queryParams
+      }, `camera_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

+ 270 - 0
src/views/zcustom/issue/index.vue

@@ -0,0 +1,270 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+      <el-form-item label="问题描述" prop="description">
+        <el-input
+          v-model="queryParams.description"
+          placeholder="请输入问题描述"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['zcustom:issue:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['zcustom:issue:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['zcustom:issue:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="issueList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" width="50">
+        <template slot-scope="scope">
+          {{(scope.$index + 1) + ((queryParams.pageNum - 1) * queryParams.pageSize)}}
+        </template>
+      </el-table-column>
+      <el-table-column label="问题描述" align="center" prop="description" />
+      <el-table-column label="问题状态" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status == 0" style="color: #42b983">●已解决</span>
+          <span v-if="scope.row.status == 2" style="color: #C03639">●待解决</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['zcustom:issue:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['zcustom:issue:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改上报问题对话框 -->
+    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="问题描述" prop="description">
+          <el-input v-model="form.description" placeholder="请输入问题描述" />
+        </el-form-item>
+        <el-form-item label="所属项目id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入所属项目id" />
+        </el-form-item>
+        <el-form-item label="删除标志" prop="delFlag">
+          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listIssue, getIssue, delIssue, addIssue, updateIssue } from "@/api/zcustom/issue";
+
+export default {
+  name: "Issue",
+  data() {
+    return {
+      // 根路径
+      baseURL: process.env.VUE_APP_BASE_API,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 上报问题表格数据
+      issueList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        description: null,
+        projectId: null,
+        status: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        id: [
+          { required: true, message: "问题id不能为空", trigger: "blur" }
+        ],
+        description: [
+          { required: true, message: "问题描述不能为空", trigger: "blur" }
+        ],
+        projectId: [
+          { required: true, message: "所属项目id不能为空", trigger: "blur" }
+        ],
+        status: [
+          { required: true, message: "问题状态不能为空", trigger: "blur" }
+        ],
+        delFlag: [
+          { required: true, message: "删除标志不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询上报问题列表 */
+    getList() {
+      this.loading = true;
+      listIssue(this.queryParams).then(response => {
+        this.issueList =  response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        description: null,
+        projectId: null,
+        status: "0",
+        delFlag: null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加上报问题";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getIssue(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改上报问题";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateIssue(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addIssue(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除?').then(function() {
+        return delIssue(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('zcustom/issue/export', {
+        ...this.queryParams
+      }, `issue_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

+ 324 - 0
src/views/zcustom/plan/index.vue

@@ -0,0 +1,324 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+      <el-form-item label="负责人" prop="head">
+        <el-input
+          v-model="queryParams.head"
+          placeholder="请输入负责人"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="开始日期" prop="startTime">
+        <el-date-picker clearable
+          v-model="queryParams.startTime"
+          type="date"
+          value-format="yyyy-MM-dd"
+          placeholder="请选择开始日期">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="结束日期" prop="endTime">
+        <el-date-picker clearable
+          v-model="queryParams.endTime"
+          type="date"
+          value-format="yyyy-MM-dd"
+          placeholder="请选择结束日期">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['zcustom:plan:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['zcustom:plan:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['zcustom:plan:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="planList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" width="50">
+        <template slot-scope="scope">
+          {{(scope.$index + 1) + ((queryParams.pageNum - 1) * queryParams.pageSize)}}
+        </template>
+      </el-table-column>
+      <el-table-column label="计划类型" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.type == 0">检查</span>
+          <span v-if="scope.row.type == 1">施工</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="负责人" align="center" prop="head" />
+      <el-table-column label="具体内容" align="center" prop="content" />
+      <el-table-column label="开始日期" align="center" prop="startTime" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.startTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="结束日期" align="center" prop="endTime" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.endTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['zcustom:plan:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['zcustom:plan:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改工程计划对话框 -->
+    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="所属项目id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入所属项目id" />
+        </el-form-item>
+        <el-form-item label="负责人" prop="head">
+          <el-input v-model="form.head" placeholder="请输入负责人" />
+        </el-form-item>
+        <el-form-item label="具体内容" prop="content">
+          <editor v-model="form.content" :min-height="192"/>
+        </el-form-item>
+        <el-form-item label="开始日期" prop="startTime">
+          <el-date-picker clearable
+            v-model="form.startTime"
+            type="date"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            placeholder="请选择开始日期">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="结束日期" prop="endTime">
+          <el-date-picker clearable
+            v-model="form.endTime"
+            type="date"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            placeholder="请选择结束日期">
+          </el-date-picker>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listPlan, getPlan, delPlan, addPlan, updatePlan } from "@/api/zcustom/plan";
+
+export default {
+  name: "Plan",
+  data() {
+    return {
+      // 根路径
+      baseURL: process.env.VUE_APP_BASE_API,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 工程计划表格数据
+      planList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: null,
+        type: null,
+        head: null,
+        content: null,
+        startTime: null,
+        endTime: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        id: [
+          { required: true, message: "计划id不能为空", trigger: "blur" }
+        ],
+        projectId: [
+          { required: true, message: "所属项目id不能为空", trigger: "blur" }
+        ],
+        type: [
+          { required: true, message: "计划类型不能为空", trigger: "change" }
+        ],
+        head: [
+          { required: true, message: "负责人不能为空", trigger: "blur" }
+        ],
+        content: [
+          { required: true, message: "具体内容不能为空", trigger: "blur" }
+        ],
+        startTime: [
+          { required: true, message: "开始日期不能为空", trigger: "blur" }
+        ],
+        endTime: [
+          { required: true, message: "结束日期不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询工程计划列表 */
+    getList() {
+      this.loading = true;
+      listPlan(this.queryParams).then(response => {
+        this.planList =  response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        projectId: null,
+        type: null,
+        head: null,
+        content: null,
+        startTime: null,
+        endTime: null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加工程计划";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getPlan(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改工程计划";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updatePlan(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addPlan(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除?').then(function() {
+        return delPlan(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('zcustom/plan/export', {
+        ...this.queryParams
+      }, `plan_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

+ 268 - 0
src/views/zcustom/platAppOrg/index.vue

@@ -0,0 +1,268 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+      <el-form-item label="地区编码" prop="appOrg">
+        <el-input
+          v-model="queryParams.appOrg"
+          placeholder="请输入地区编码"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="地区名称" prop="appName">
+        <el-input
+          v-model="queryParams.appName"
+          placeholder="请输入地区名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['zcustom:platAppOrg:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['zcustom:platAppOrg:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['zcustom:platAppOrg:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="platAppOrgList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" width="50">
+        <template slot-scope="scope">
+          {{(scope.$index + 1) + ((queryParams.pageNum - 1) * queryParams.pageSize)}}
+        </template>
+      </el-table-column>
+      <el-table-column label="地区编码" align="center" prop="appOrg" />
+      <el-table-column label="地区名称" align="center" prop="appName" />
+      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['zcustom:platAppOrg:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['zcustom:platAppOrg:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改地区编码对话框 -->
+    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="删除标志" prop="delFlag">
+          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
+        </el-form-item>
+        <el-form-item label="地区编码" prop="appOrg">
+          <el-input v-model="form.appOrg" placeholder="请输入地区编码" />
+        </el-form-item>
+        <el-form-item label="地区名称" prop="appName">
+          <el-input v-model="form.appName" placeholder="请输入地区名称" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listPlatAppOrg, getPlatAppOrg, delPlatAppOrg, addPlatAppOrg, updatePlatAppOrg } from "@/api/zcustom/platAppOrg";
+
+export default {
+  name: "PlatAppOrg",
+  data() {
+    return {
+      // 根路径
+      baseURL: process.env.VUE_APP_BASE_API,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 地区编码表格数据
+      platAppOrgList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        appOrg: null,
+        appName: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        id: [
+          { required: true, message: "$comment不能为空", trigger: "blur" }
+        ],
+        delFlag: [
+          { required: true, message: "删除标志不能为空", trigger: "blur" }
+        ],
+        appOrg: [
+          { required: true, message: "地区编码不能为空", trigger: "blur" }
+        ],
+        appName: [
+          { required: true, message: "地区名称不能为空", trigger: "blur" }
+        ]
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询地区编码列表 */
+    getList() {
+      this.loading = true;
+      listPlatAppOrg(this.queryParams).then(response => {
+        this.platAppOrgList =  response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        delFlag: null,
+        appOrg: null,
+        appName: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加地区编码";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getPlatAppOrg(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改地区编码";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updatePlatAppOrg(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addPlatAppOrg(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除?').then(function() {
+        return delPlatAppOrg(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('zcustom/platAppOrg/export', {
+        ...this.queryParams
+      }, `platAppOrg_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

+ 281 - 0
src/views/zcustom/project/index.vue

@@ -0,0 +1,281 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
+      <el-form-item label="项目名称" prop="projectName">
+        <el-input
+          v-model="queryParams.projectName"
+          placeholder="请输入项目名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="接入标志" prop="connectFlag">
+        <el-input
+          v-model="queryParams.connectFlag"
+          placeholder="请输入接入标志"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['zcustom:project:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['zcustom:project:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['zcustom:project:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="projectList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" width="50">
+        <template slot-scope="scope">
+          {{(scope.$index + 1) + ((queryParams.pageNum - 1) * queryParams.pageSize)}}
+        </template>
+      </el-table-column>
+      <el-table-column label="项目名称" align="center" prop="projectName" />
+      <el-table-column label="接入标志" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.connectFlag == 0">已接入</span>
+          <span v-if="scope.row.connectFlag == 2">未接入</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['zcustom:project:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['zcustom:project:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改工程项目对话框 -->
+    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="项目名称" prop="projectName">
+          <el-input v-model="form.projectName" placeholder="请输入项目名称" />
+        </el-form-item>
+        <el-form-item label="所属单位id" prop="unitId">
+          <el-input v-model="form.unitId" placeholder="请输入所属单位id" />
+        </el-form-item>
+        <el-form-item label="接入标志" prop="connectFlag">
+          <el-input v-model="form.connectFlag" placeholder="请输入接入标志" />
+        </el-form-item>
+        <el-form-item label="删除标志" prop="delFlag">
+          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listProject, getProject, delProject, addProject, updateProject } from "@/api/zcustom/project";
+
+export default {
+  name: "Project",
+  data() {
+    return {
+      // 根路径
+      baseURL: process.env.VUE_APP_BASE_API,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 工程项目表格数据
+      projectList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectName: null,
+        unitId: null,
+        connectFlag: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        id: [
+          { required: true, message: "项目id不能为空", trigger: "blur" }
+        ],
+        projectName: [
+          { required: true, message: "项目名称不能为空", trigger: "blur" }
+        ],
+        unitId: [
+          { required: true, message: "所属单位id不能为空", trigger: "blur" }
+        ],
+        connectFlag: [
+          { required: true, message: "接入标志不能为空", trigger: "blur" }
+        ],
+        delFlag: [
+          { required: true, message: "删除标志不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询工程项目列表 */
+    getList() {
+      this.loading = true;
+      listProject(this.queryParams).then(response => {
+        this.projectList =  response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        projectName: null,
+        unitId: null,
+        connectFlag: null,
+        delFlag: null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加工程项目";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getProject(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改工程项目";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateProject(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addProject(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除?').then(function() {
+        return delProject(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('zcustom/project/export', {
+        ...this.queryParams
+      }, `project_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>