4 lat temu · 57db95712a
--- a/houtai/.editorconfig
+++ b/houtai/.editorconfig
@@ -0,0 +1,5 @@
 
				+[*.{js,jsx,ts,tsx,vue}]
			
 
				+indent_style = space
			
 
				+indent_size = 2
			
 
				+trim_trailing_whitespace = true
			
 
				+insert_final_newline = true
			
--- a/houtai/.gitignore
+++ b/houtai/.gitignore
@@ -0,0 +1,23 @@
 
				+.DS_Store
			
 
				+node_modules
			
 
				+/dist
			
 
				+
			
 
				+
			
 
				+# local env files
			
 
				+.env.local
			
 
				+.env.*.local
			
 
				+
			
 
				+# Log files
			
 
				+npm-debug.log*
			
 
				+yarn-debug.log*
			
 
				+yarn-error.log*
			
 
				+pnpm-debug.log*
			
 
				+
			
 
				+# Editor directories and files
			
 
				+.idea
			
 
				+.vscode
			
 
				+*.suo
			
 
				+*.ntvs*
			
 
				+*.njsproj
			
 
				+*.sln
			
 
				+*.sw?
			
--- a/houtai/README.md
+++ b/houtai/README.md
@@ -0,0 +1,24 @@
 
				+# houtai
			
 
				+
			
 
				+## Project setup
			
 
				+```
			
 
				+npm install
			
 
				+```
			
 
				+
			
 
				+### Compiles and hot-reloads for development
			
 
				+```
			
 
				+npm run serve
			
 
				+```
			
 
				+
			
 
				+### Compiles and minifies for production
			
 
				+```
			
 
				+npm run build
			
 
				+```
			
 
				+
			
 
				+### Lints and fixes files
			
 
				+```
			
 
				+npm run lint
			
 
				+```
			
 
				+
			
 
				+### Customize configuration
			
 
				+See [Configuration Reference](https://cli.vuejs.org/config/).
			
--- a/houtai/babel.config.js
+++ b/houtai/babel.config.js
@@ -0,0 +1,5 @@
 
				+module.exports = {
			
 
				+  presets: [
			
 
				+    '@vue/cli-plugin-babel/preset'
			
 
				+  ]
			
 
				+}
			
--- a/houtai/package-lock.json
+++ b/houtai/package-lock.json
--- a/houtai/package.json
+++ b/houtai/package.json
@@ -0,0 +1,66 @@
 
				+{
			
 
				+  "name": "houtai",
			
 
				+  "version": "0.1.0",
			
 
				+  "private": true,
			
 
				+  "scripts": {
			
 
				+    "serve": "vue-cli-service serve",
			
 
				+    "build": "vue-cli-service build",
			
 
				+    "lint": "vue-cli-service lint"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "Base64": "^1.1.0",
			
 
				+    "axios": "^0.24.0",
			
 
				+    "core-js": "^3.6.5",
			
 
				+    "element-ui": "^2.15.6",
			
 
				+    "js-base64": "^3.7.2",
			
 
				+    "moment": "^2.29.1",
			
 
				+    "vue": "^2.6.11",
			
 
				+    "vue-router": "^3.2.0"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@vue/cli-plugin-babel": "~4.5.0",
			
 
				+    "@vue/cli-plugin-eslint": "~4.5.0",
			
 
				+    "@vue/cli-plugin-router": "~4.5.0",
			
 
				+    "@vue/cli-service": "~4.5.0",
			
 
				+    "@vue/eslint-config-standard": "^5.1.2",
			
 
				+    "babel-eslint": "^10.1.0",
			
 
				+    "eslint": "^6.7.2",
			
 
				+    "eslint-plugin-import": "^2.20.2",
			
 
				+    "eslint-plugin-node": "^11.1.0",
			
 
				+    "eslint-plugin-promise": "^4.2.1",
			
 
				+    "eslint-plugin-standard": "^4.0.0",
			
 
				+    "eslint-plugin-vue": "^6.2.2",
			
 
				+    "less": "^3.0.4",
			
 
				+    "less-loader": "^5.0.0",
			
 
				+    "lint-staged": "^9.5.0",
			
 
				+    "vue-template-compiler": "^2.6.11"
			
 
				+  },
			
 
				+  "eslintConfig": {
			
 
				+    "root": true,
			
 
				+    "env": {
			
 
				+      "node": true
			
 
				+    },
			
 
				+    "extends": [
			
 
				+      "plugin:vue/essential",
			
 
				+      "@vue/standard"
			
 
				+    ],
			
 
				+    "parserOptions": {
			
 
				+      "parser": "babel-eslint"
			
 
				+    },
			
 
				+    "rules": {}
			
 
				+  },
			
 
				+  "browserslist": [
			
 
				+    "> 1%",
			
 
				+    "last 2 versions",
			
 
				+    "not dead"
			
 
				+  ],
			
 
				+  "gitHooks": {
			
 
				+    "pre-commit": "lint-staged"
			
 
				+  },
			
 
				+  "lint-staged": {
			
 
				+    "*.{js,jsx,vue}": [
			
 
				+      "vue-cli-service lint",
			
 
				+      "git add"
			
 
				+    ]
			
 
				+  }
			
 
				+}
			
--- a/houtai/public/favicon.ico
+++ b/houtai/public/favicon.ico
--- a/houtai/public/index.html
+++ b/houtai/public/index.html
@@ -0,0 +1,17 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="">
			
 
				+  <head>
			
 
				+    <meta charset="utf-8">
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
			
 
				+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
			
 
				+    <title>中国人民解放军陆军勤务学院-管理后台</title>
			
 
				+  </head>
			
 
				+  <body>
			
 
				+    <noscript>
			
 
				+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
			
 
				+    </noscript>
			
 
				+    <div id="app"></div>
			
 
				+    <!-- built files will be auto injected -->
			
 
				+  </body>
			
 
				+</html>
			
--- a/houtai/src/App.vue
+++ b/houtai/src/App.vue
@@ -0,0 +1,9 @@
 
				+<template>
			
 
				+  <div id="app">
			
 
				+    <Router-view/>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<style lang="less">
			
 
				+
			
 
				+</style>
			
--- a/houtai/src/apis/login.js
+++ b/houtai/src/apis/login.js
@@ -0,0 +1,17 @@
 
				+import axios from '../utils/request'
			
 
				+// 用户登录接口
			
 
				+export const userLogin = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/admin/login',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改密码
			
 
				+export const updatePwd = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/sys/user/updatePwd',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab1.js
+++ b/houtai/src/apis/tab1.js
@@ -0,0 +1,24 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取整体概况
			
 
				+export const parkList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/park/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// // 获取整体概况
			
 
				+// export const getDetailById = (id) => {
			
 
				+//   return axios({
			
 
				+//     method: 'post',
			
 
				+//     url: `/cms/park/detail/${id}`
			
 
				+//   })
			
 
				+// }
			
 
				+// 点击修改
			
 
				+export const parkSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/park/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab2.js
+++ b/houtai/src/apis/tab2.js
@@ -0,0 +1,17 @@
 
				+import axios from '../utils/request'
			
 
				+// 鹏城云脑-能耗管理
			
 
				+export const energyList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/energy/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改
			
 
				+export const energySave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/energy/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab3.js
+++ b/houtai/src/apis/tab3.js
@@ -0,0 +1,45 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取鹏城云脑-安防管理
			
 
				+export const securityList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/security/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改
			
 
				+export const securitySave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/security/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面-列表
			
 
				+export const securityVideoList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/security/video/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面-编辑-新增
			
 
				+export const videoSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/security/video/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面-详情通过id
			
 
				+export const videoDetailById = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/security/video/detail/${id}`
			
 
				+  })
			
 
				+}
			
 
				+// 删除
			
 
				+export const videoRemove = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/security/video/remove/${id}`
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab4.js
+++ b/houtai/src/apis/tab4.js
@@ -0,0 +1,45 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取鹏城云脑-物联网设备
			
 
				+export const securityList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/lot/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改
			
 
				+export const lotSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/lot/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 今日报警-列表
			
 
				+export const securityVideoList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/lot/alarm/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 今日报警-编辑-新增
			
 
				+export const alarmSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/lot/alarm/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 今日报警-详情通过id
			
 
				+export const videoDetailById = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/lot/alarm/detail/${id}`
			
 
				+  })
			
 
				+}
			
 
				+// 删除
			
 
				+export const alarmRemove = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/lot/alarm/remove/${id}`
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab5.js
+++ b/houtai/src/apis/tab5.js
@@ -0,0 +1,73 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取工地监控
			
 
				+export const siteList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改工地监控
			
 
				+export const siteSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 获取监控画面列表
			
 
				+export const siteVideoList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/video/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 新增-修改监控画面列表
			
 
				+export const siteVideoSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/video/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面列表-通过id获取详情
			
 
				+export const videoDetailById = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/site/video/detail/${id}`
			
 
				+  })
			
 
				+}
			
 
				+// 获取进度管理列表
			
 
				+export const siteImgList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/img/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 新增-修改监控画面列表
			
 
				+export const siteImgSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/site/img/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面列表-通过id获取详情
			
 
				+export const videoDetailById3 = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/site/img/detail/${id}`
			
 
				+  })
			
 
				+}
			
 
				+// 监控画面-删除
			
 
				+export const videoRemove = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/site/video/remove/${id}`
			
 
				+  })
			
 
				+}
			
 
				+// 进度管理-删除
			
 
				+export const imgRemove = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/site/img/remove/${id}`
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab6.js
+++ b/houtai/src/apis/tab6.js
@@ -0,0 +1,46 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取无人机监控
			
 
				+export const aerialList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/aerial/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 修改无人机监控
			
 
				+export const aerialSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/aerial/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 获取无人机监控图-列表
			
 
				+export const imgList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/aerial/img/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 新增-修改无人机监控图
			
 
				+export const aerialImgSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/cms/aerial/img/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 无人机监控图-通过id获取详情
			
 
				+export const imgDetailById = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/aerial/img/detail/${id}`
			
 
				+  })
			
 
				+}
			
 
				+
			
 
				+// 无人机监控图-删除
			
 
				+export const imgRemove = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/cms/aerial/img/remove/${id}`
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab7.js
+++ b/houtai/src/apis/tab7.js
@@ -0,0 +1,29 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取用户列表
			
 
				+export const userList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/sys/user/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 编辑-新增用户
			
 
				+export const userSave = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/sys/user/save',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
 
				+// 启用、停用账户
			
 
				+export const userEditStatus = (id, isEnabled) => {
			
 
				+  return axios({
			
 
				+    url: `/sys/user/editStatus/${id}/${isEnabled}`
			
 
				+  })
			
 
				+}
			
 
				+// 删除
			
 
				+export const userRemoves = (id) => {
			
 
				+  return axios({
			
 
				+    url: `/sys/user/removes/${id}`
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/apis/tab8.js
+++ b/houtai/src/apis/tab8.js
@@ -0,0 +1,9 @@
 
				+import axios from '../utils/request'
			
 
				+// 获取操作日志列表
			
 
				+export const logList = (data) => {
			
 
				+  return axios({
			
 
				+    method: 'post',
			
 
				+    url: '/sys/log/list',
			
 
				+    data
			
 
				+  })
			
 
				+}
			
--- a/houtai/src/assets/css/base.css
+++ b/houtai/src/assets/css/base.css
@@ -0,0 +1,129 @@
 
				+* {
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  box-sizing: border-box;
			
 
				+}
			
 
				+body {
			
 
				+  background-color: #f2f2f2;
			
 
				+}
			
 
				+ul li {
			
 
				+  list-style: none;
			
 
				+}
			
 
				+a {
			
 
				+  text-decoration:none ;
			
 
				+  color: #66b1ff;
			
 
				+}
			
 
				+.insideTop {
			
 
				+  position: relative;
			
 
				+  padding-left: 30px;
			
 
				+  font-weight: 700;
			
 
				+  height: 40px;
			
 
				+  margin-bottom: 12px;
			
 
				+}
			
 
				+.insideTop .add{
			
 
				+  position: absolute;
			
 
				+  top: -10px;
			
 
				+  right: 30px;
			
 
				+}
			
 
				+.obstruct{
			
 
				+  position: absolute;
			
 
				+  left: 0px;
			
 
				+  top: 60px;
			
 
				+  width: 100%;
			
 
				+  background-color: #f2f2f2;
			
 
				+  height: 12px;
			
 
				+}
			
 
				+.biaoshi{
			
 
				+  position: relative;
			
 
				+  font-style:normal
			
 
				+}
			
 
				+.biaoshi::before{
			
 
				+  position: absolute;
			
 
				+  top: 0px;
			
 
				+  left: -92px;
			
 
				+  content: '*';
			
 
				+  color: #F56C6C;
			
 
				+}
			
 
				+
			
 
				+.el-button--primary{
			
 
				+  background-color: #b9412e;
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.el-button--primary:focus, .el-button--primary:hover {
			
 
				+  background: #a33e2f;
			
 
				+  border-color: #a33e2f;
			
 
				+}
			
 
				+.el-input.is-active .el-input__inner, .el-input__inner:focus {
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.cell{
			
 
				+  text-align: center !important;
			
 
				+}
			
 
				+.el-input__inner{
			
 
				+  line-height: normal;
			
 
				+}
			
 
				+input::-webkit-outer-spin-button,
			
 
				+input::-webkit-inner-spin-button {
			
 
				+-webkit-appearance: none;
			
 
				+}
			
 
				+input[type="number"] {
			
 
				+-moz-appearance: textfield;
			
 
				+}
			
 
				+.el-dialog{
			
 
				+  min-width: 652px;
			
 
				+}
			
 
				+.el-upload__tip{
			
 
				+  font-size: 14px;
			
 
				+}
			
 
				+.el-range-editor.is-active, .el-range-editor.is-active:hover{
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.el-date-table td.today span{
			
 
				+  color: #b9412e;
			
 
				+}
			
 
				+.el-date-table td.end-date span, .el-date-table td.start-date span{
			
 
				+  background-color: #b9412e;
			
 
				+}
			
 
				+.el-date-table td.available:hover{
			
 
				+  color: #b9412e;
			
 
				+}
			
 
				+.el-select .el-input__inner:focus{
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.el-select-dropdown__item.selected{
			
 
				+  color: #b9412e;
			
 
				+}
			
 
				+.el-select .el-input.is-focus .el-input__inner{
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.el-table--fit{
			
 
				+  border-top: 1px solid #EBEEF5;
			
 
				+}
			
 
				+.table_img{
			
 
				+  width: 100px;
			
 
				+  height: 50px;
			
 
				+  object-fit: cover;
			
 
				+}
			
 
				+.table_name{
			
 
				+  cursor: pointer;
			
 
				+  overflow: hidden;
			
 
				+  text-overflow: ellipsis;
			
 
				+  white-space: nowrap;    
			
 
				+}
			
 
				+.el-button--text{
			
 
				+  color: #964134;
			
 
				+}
			
 
				+.el-button--text:focus, .el-button--text:hover{
			
 
				+  color: #e06a58;
			
 
				+}
			
 
				+.upHint{
			
 
				+  color: black;
			
 
				+  height: 20px;
			
 
				+}
			
 
				+.el-radio__input.is-checked+.el-radio__label{
			
 
				+  color: #964134;
			
 
				+}
			
 
				+.el-radio__input.is-checked .el-radio__inner{
			
 
				+  border-color: #964134;
			
 
				+  background: #964134;
			
 
				+}
			
--- a/houtai/src/assets/img/demo.png
+++ b/houtai/src/assets/img/demo.png
--- a/houtai/src/assets/img/logo.png
+++ b/houtai/src/assets/img/logo.png
--- a/houtai/src/assets/img/user.jpg
+++ b/houtai/src/assets/img/user.jpg
--- a/houtai/src/components/Tab5DialogThree.vue
+++ b/houtai/src/components/Tab5DialogThree.vue
@@ -0,0 +1,205 @@
 
				+<template>
			
 
				+  <div class="Tab5DialogThree">
			
 
				+    <el-dialog
			
 
				+      :title="ruleForm.id ? '修改' : '新增'"
			
 
				+      :visible="isShow"
			
 
				+      @close="btnX()"
			
 
				+    >
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="年份：" prop="year">
			
 
				+          <el-input v-model="ruleForm.year" style="width:500px"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <!-- 图片和附件 -->
			
 
				+        <el-form-item label="进度图片：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            class="avatar-uploader"
			
 
				+            :action="baseURL + '/cms/site/img/upload'"
			
 
				+            :headers="{
			
 
				+              token,
			
 
				+            }"
			
 
				+            :show-file-list="false"
			
 
				+            :before-upload="beforethumbUpload"
			
 
				+            :on-success="upload_thumb_success"
			
 
				+          >
			
 
				+            <div v-if="ruleForm.thumb" class="imgdiv">
			
 
				+              <img
			
 
				+                style="width: 100%; height: 100%"
			
 
				+                :src="baseURL + ruleForm.thumb"
			
 
				+              />
			
 
				+              <i
			
 
				+                class="el-icon-circle-close"
			
 
				+                @click.stop="ruleForm.thumb = ''"
			
 
				+              ></i>
			
 
				+            </div>
			
 
				+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
			
 
				+          </el-upload>
			
 
				+          <span>格式要求：支持png、jpg、gif和jpeg的图片格式；最大支持5M。</span>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { videoDetailById3, siteImgSave } from '@/apis/tab5'
			
 
				+
			
 
				+import axios from '@/utils/request'
			
 
				+export default {
			
 
				+  name: 'Tab5DialogThree',
			
 
				+  props: {
			
 
				+    isShow: {
			
 
				+      type: Boolean,
			
 
				+      default: false
			
 
				+    }
			
 
				+  },
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      // 服务器前缀地址
			
 
				+      baseURL: '',
			
 
				+      token: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        thumb: '',
			
 
				+        year: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        year: [{ required: true, message: '不能为空', trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  watch: {
			
 
				+
			
 
				+  },
			
 
				+  methods: {
			
 
				+    // 点击关闭
			
 
				+    btnX () {
			
 
				+      this.$emit('update:isShow', false)
			
 
				+      // 清空表单
			
 
				+      this.ruleForm = {
			
 
				+        id: '',
			
 
				+        thumb: '',
			
 
				+        year: ''
			
 
				+      }
			
 
				+      // 关闭验证
			
 
				+      this.$refs.ruleForm.resetFields()
			
 
				+    },
			
 
				+    // 点击确定
			
 
				+    async btnOk () {
			
 
				+      if (this.ruleForm.thumb === '') { return this.$message.warning('封面图片不能为空') }
			
 
				+      if (this.ruleForm.year.trim() === '') { return this.$message.warning('年份不能为空') }
			
 
				+      const obj = { ...this.ruleForm }
			
 
				+      const res = await siteImgSave(obj)
			
 
				+      if (res.code === 0) {
			
 
				+        this.$message.success('操作成功')
			
 
				+        // 通知父组件刷新页面
			
 
				+        this.$emit('refresh')
			
 
				+        this.btnX()
			
 
				+      } else return this.$message.warning(res.msg)
			
 
				+      // console.log(998, res)
			
 
				+    },
			
 
				+    // 上传图片
			
 
				+    beforethumbUpload (file) {
			
 
				+      // console.log(998, file)
			
 
				+      // 限制图片大小和格式
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 5
			
 
				+      const typeOk =
			
 
				+        file.type === 'image/png' ||
			
 
				+        file.type === 'image/jpeg' ||
			
 
				+        file.type === 'image/gif'
			
 
				+
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (!typeOk) {
			
 
				+          this.$message.error('照片格式有误！')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('照片大小超过5M！')
			
 
				+          reject(file)
			
 
				+        } else if (file.name.length > 32) {
			
 
				+          this.$message.error('照片名字不能超过32个字！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          this.$message.success('上传成功')
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    upload_thumb_success (data) {
			
 
				+      // console.log('图片上传成功', data.data.urlPath)
			
 
				+      this.ruleForm.thumb = data.data.urlPath
			
 
				+    },
			
 
				+    // 通过id获取详情---让父组件调用
			
 
				+    async videoDetailById3 (id) {
			
 
				+      const res = await videoDetailById3(id)
			
 
				+      this.ruleForm = res.data
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    // 获取用户token
			
 
				+    this.token = localStorage.getItem('SZSBL_token')
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.biaoshi::before {
			
 
				+  top: 1px;
			
 
				+}
			
 
				+.biaoshi2::before {
			
 
				+  top: -10px;
			
 
				+  left: -64px;
			
 
				+}
			
 
				+/deep/.el-upload-list {
			
 
				+  width: 500px;
			
 
				+}
			
 
				+/deep/.el-icon-plus {
			
 
				+  border: 1px dashed #ccc;
			
 
				+}
			
 
				+.avatar-uploader .el-upload {
			
 
				+  border-radius: 6px;
			
 
				+  cursor: pointer;
			
 
				+  position: relative;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.avatar-uploader .el-upload:hover {
			
 
				+  border-color: #3e5eb3;
			
 
				+}
			
 
				+.avatar-uploader-icon {
			
 
				+  font-size: 28px;
			
 
				+  color: #8c939d;
			
 
				+  width: 178px;
			
 
				+  height: 178px;
			
 
				+  line-height: 178px;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+/deep/.el-icon-circle-close {
			
 
				+  font-size: 20px;
			
 
				+}
			
 
				+.imgdiv {
			
 
				+  max-width: 400px;
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/components/tab3Dialog.vue
+++ b/houtai/src/components/tab3Dialog.vue
@@ -0,0 +1,273 @@
 
				+<template>
			
 
				+  <div class="tab3Dialog">
			
 
				+    <el-dialog :title="ruleForm.id?'修改':'新增'" :visible="isShow" @close="btnX()">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="标题：" prop="name">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.name"
			
 
				+            maxlength="25"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <!-- 图片和附件 -->
			
 
				+        <el-form-item label="封面图片：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            class="avatar-uploader"
			
 
				+            :action="baseURL + '/cms/security/video/upload/img'"
			
 
				+            :headers="{
			
 
				+              token,
			
 
				+            }"
			
 
				+            :show-file-list="false"
			
 
				+            :before-upload="beforethumbUpload"
			
 
				+            :on-success="upload_thumb_success"
			
 
				+          >
			
 
				+            <div v-if="ruleForm.thumb" class="imgdiv">
			
 
				+              <img
			
 
				+                style="width: 100%; height: 100%"
			
 
				+                :src="baseURL + ruleForm.thumb"
			
 
				+              />
			
 
				+              <i
			
 
				+                class="el-icon-circle-close"
			
 
				+                @click.stop="ruleForm.thumb = ''"
			
 
				+              ></i>
			
 
				+            </div>
			
 
				+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
			
 
				+          </el-upload>
			
 
				+          <span>格式要求：支持png、jpg、gif和jpeg的图片格式；最大支持5M。</span>
			
 
				+        </el-form-item>
			
 
				+        <!-- 上传附件 -->
			
 
				+        <el-form-item label="视频文件：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            multiple
			
 
				+            class="upload-demo"
			
 
				+            :file-list='fileList'
			
 
				+            :action="baseURL + '/cms/security/video/upload/video'"
			
 
				+            :headers="{ token }"
			
 
				+            :before-upload="beforeFujian"
			
 
				+            :on-success="successFujian"
			
 
				+            :before-remove="beforeRemove"
			
 
				+            :on-remove="handleRemove"
			
 
				+            :limit="1"
			
 
				+            :on-exceed="handleExceed"
			
 
				+            :show-file-list="true"
			
 
				+          >
			
 
				+            <el-button size="small" type="primary">点击上传</el-button>
			
 
				+            <div class="el-upload__tip" slot="tip">
			
 
				+              支持AVI、mov、rmvb、rm、FLV、mp4、3GP等格式的视频文件，大小不超过1GB。
			
 
				+            </div>
			
 
				+          </el-upload>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { videoDetailById, videoSave } from '@/apis/tab3'
			
 
				+
			
 
				+import axios from '@/utils/request'
			
 
				+export default {
			
 
				+  name: 'tab3Dialog',
			
 
				+  props: {
			
 
				+    isShow: {
			
 
				+      type: Boolean,
			
 
				+      default: false
			
 
				+    }
			
 
				+  },
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      fileList: [],
			
 
				+      // 服务器前缀地址
			
 
				+      baseURL: '',
			
 
				+      token: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        thumb: '',
			
 
				+        video: '',
			
 
				+        fileName: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        name: [{ required: true, message: '不能为空', trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  methods: {
			
 
				+    // 点击关闭
			
 
				+    btnX () {
			
 
				+      this.$emit('update:isShow', false)
			
 
				+      // 清空表单
			
 
				+      this.ruleForm = {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        thumb: '',
			
 
				+        video: '',
			
 
				+        fileName: ''
			
 
				+      }
			
 
				+      this.fileList = []
			
 
				+    },
			
 
				+    // 点击确定
			
 
				+    async btnOk () {
			
 
				+      if (this.ruleForm.name.trim() === '') return this.$message.warning('标题不能为空')
			
 
				+      if (this.ruleForm.thumb === '') return this.$message.warning('封面图片不能为空')
			
 
				+      if (this.ruleForm.video === '') return this.$message.warning('视频文件不能为空')
			
 
				+      const obj = { ...this.ruleForm }
			
 
				+      const res = await videoSave(obj)
			
 
				+      if (res.code === 0) {
			
 
				+        this.$message.success('操作成功')
			
 
				+        // 通知父组件刷新页面
			
 
				+        this.$emit('refresh')
			
 
				+        this.btnX()
			
 
				+      } else this.$message.warning(res.msg)
			
 
				+      // console.log(998, res)
			
 
				+    },
			
 
				+    // 上传图片
			
 
				+    beforethumbUpload (file) {
			
 
				+      // console.log(998, file)
			
 
				+      // 限制图片大小和格式
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 5
			
 
				+      const typeOk =
			
 
				+        file.type === 'image/png' ||
			
 
				+        file.type === 'image/jpeg' ||
			
 
				+        file.type === 'image/gif'
			
 
				+
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (!typeOk) {
			
 
				+          this.$message.error('照片格式有误！')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('照片大小超过5M！')
			
 
				+          reject(file)
			
 
				+        } else if (file.name.length > 32) {
			
 
				+          this.$message.error('照片名字不能超过32个字！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          this.$message.success('上传成功')
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    upload_thumb_success (data) {
			
 
				+      // console.log('图片上传成功', data.data.urlPath)
			
 
				+      this.ruleForm.thumb = data.data.urlPath
			
 
				+    },
			
 
				+    // 上传附件
			
 
				+    beforeFujian (file) {
			
 
				+      console.log('附件上传前', file)
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 1024
			
 
				+      const typeOk =
			
 
				+        file.type === 'video/mp4' ||
			
 
				+        file.type === 'video/avi' ||
			
 
				+        file.type === 'video/quicktime' || file.type === 'video/rm' || (file.type === '' && (file.name.includes('.flv') || file.name.includes('.rmvb'))) || file.type === 'video/3gpp'
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (file.name.length > 32) {
			
 
				+          this.$message.error('视频名字不能超过32个字')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('视频大小超过1GB！')
			
 
				+          reject(file)
			
 
				+        } else if (!typeOk) {
			
 
				+          this.$message.error('视频格式有误！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    successFujian (file) {
			
 
				+      console.log('上传附件成功', file)
			
 
				+      if (file.code === 0) {
			
 
				+        this.ruleForm.video = file.data.urlPath
			
 
				+        this.ruleForm.fileName = file.data.fileName
			
 
				+        this.$message.success('上传成功')
			
 
				+      } else if (file.code === -1) {
			
 
				+        this.$message.warning('上传失败，不支持的文件格式')
			
 
				+      }
			
 
				+    },
			
 
				+    beforeRemove (file, fileList) {
			
 
				+      if (file && file.status === 'success') {
			
 
				+        return this.$confirm(`确定移除 ${file.name}？`)
			
 
				+      }
			
 
				+    },
			
 
				+    handleRemove (file, fileList) {
			
 
				+      this.ruleForm.video = ''
			
 
				+      this.ruleForm.fileName = ''
			
 
				+    },
			
 
				+    handleExceed (files, fileList) {
			
 
				+      this.$message.warning('只能上传一个视频，请删除原视频后操作')
			
 
				+    },
			
 
				+    // 通过id获取详情---让父组件调用
			
 
				+    async videoDetailById (id) {
			
 
				+      const res = await videoDetailById(id)
			
 
				+      this.ruleForm = res.data
			
 
				+      this.fileList = [{ name: res.data.fileName }]
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    // 获取用户token
			
 
				+    this.token = localStorage.getItem('SZSBL_token')
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.biaoshi::before {
			
 
				+  top: 1px;
			
 
				+}
			
 
				+/deep/.el-upload-list{
			
 
				+  width: 500px;
			
 
				+}
			
 
				+/deep/.el-icon-plus {
			
 
				+  border: 1px dashed #ccc;
			
 
				+}
			
 
				+.avatar-uploader .el-upload {
			
 
				+  border-radius: 6px;
			
 
				+  cursor: pointer;
			
 
				+  position: relative;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.avatar-uploader .el-upload:hover {
			
 
				+  border-color: #3e5eb3;
			
 
				+}
			
 
				+.avatar-uploader-icon {
			
 
				+  font-size: 28px;
			
 
				+  color: #8c939d;
			
 
				+  width: 178px;
			
 
				+  height: 178px;
			
 
				+  line-height: 178px;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+/deep/.el-icon-circle-close {
			
 
				+  font-size: 20px;
			
 
				+}
			
 
				+.imgdiv {
			
 
				+  max-width: 400px;
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/components/tab4Dialog.vue
+++ b/houtai/src/components/tab4Dialog.vue
@@ -0,0 +1,203 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab4Dialog">
			
 
				+    <el-dialog :title="ruleForm.id?'修改':'新增'" :visible="isShow" @close="btnX()">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="报警设备：" prop="name">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.name"
			
 
				+            maxlength="10"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="报警位置：" prop="location">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.location"
			
 
				+            maxlength="8"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="报警时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="timeBJ"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { alarmSave, videoDetailById } from '@/apis/tab4'
			
 
				+export default {
			
 
				+  name: 'tab4Dialog',
			
 
				+  props: {
			
 
				+    isShow: {
			
 
				+      type: Boolean,
			
 
				+      default: false
			
 
				+    }
			
 
				+  },
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTimeBJ: '',
			
 
				+      timeBJ: '',
			
 
				+      time: '',
			
 
				+      disTime: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        location: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        name: [{ required: true, message: '不能为空', trigger: 'blur' }],
			
 
				+        location: [{ required: true, message: '不能为空', trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    },
			
 
				+    timeBJ (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTimeBJ = temp
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  methods: {
			
 
				+    btnX () {
			
 
				+      this.$emit('update:isShow', false)
			
 
				+      this.$refs.ruleForm.resetFields()
			
 
				+      this.ruleForm = {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        location: ''
			
 
				+      }
			
 
				+      this.timeBJ = ''
			
 
				+    },
			
 
				+    async btnOk () {
			
 
				+      if (this.timeBJ === null) return this.$message.warning('报警时间不能为空!')
			
 
				+      if (this.time === null) return this.$message.warning('更新时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        if (this.ruleForm.id) obj.id = Number(this.ruleForm.id)
			
 
				+        obj.location = this.ruleForm.location
			
 
				+        obj.name = this.ruleForm.name
			
 
				+        obj.userCreateTime = this.disTimeBJ
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await alarmSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('操作成功')
			
 
				+          // 通知父组件刷新页面
			
 
				+          this.$emit('refresh')
			
 
				+          this.btnX()
			
 
				+        } else this.$message.warning(res.msg)
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      console.log(_this.gettime)
			
 
				+    },
			
 
				+    // 通过id获取详情---让父组件调用
			
 
				+    async videoDetailById (id) {
			
 
				+      const res = await videoDetailById(id)
			
 
				+      this.ruleForm = res.data
			
 
				+      this.timeBJ = res.data.userCreateTime
			
 
				+      // console.log(998, res)
			
 
				+      this.getCurrentTime()
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+//@import url(); 引入公共css类
			
 
				+</style>
			
--- a/houtai/src/components/tab5Dialog.vue
+++ b/houtai/src/components/tab5Dialog.vue
@@ -0,0 +1,310 @@
 
				+<template>
			
 
				+  <div class="tab5Dialog">
			
 
				+    <el-dialog :title="ruleForm.id?'修改':'新增'" :visible="isShow" @close="btnX()">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="标题：" prop="name">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.name"
			
 
				+            maxlength="25"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="经度：" prop="lon">
			
 
				+          <el-input
			
 
				+            type="number"
			
 
				+            v-model.number="ruleForm.lon"
			
 
				+            maxlength="8"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="纬度：" prop="lat">
			
 
				+          <el-input
			
 
				+            type="number"
			
 
				+            v-model.number="ruleForm.lat"
			
 
				+            maxlength="8"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <!-- 图片和附件 -->
			
 
				+        <el-form-item label="封面图片：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            class="avatar-uploader"
			
 
				+            :action="baseURL + '/cms/site/video/upload/img'"
			
 
				+            :headers="{
			
 
				+              token,
			
 
				+            }"
			
 
				+            :show-file-list="false"
			
 
				+            :before-upload="beforethumbUpload"
			
 
				+            :on-success="upload_thumb_success"
			
 
				+          >
			
 
				+            <div v-if="ruleForm.thumb" class="imgdiv">
			
 
				+              <img
			
 
				+                style="width: 100%; height: 100%"
			
 
				+                :src="baseURL + ruleForm.thumb"
			
 
				+              />
			
 
				+              <i
			
 
				+                class="el-icon-circle-close"
			
 
				+                @click.stop="ruleForm.thumb = ''"
			
 
				+              ></i>
			
 
				+            </div>
			
 
				+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
			
 
				+          </el-upload>
			
 
				+          <span>格式要求：支持png、jpg、gif和jpeg的图片格式；最大支持5M。</span>
			
 
				+        </el-form-item>
			
 
				+        <!-- 上传附件 -->
			
 
				+        <el-form-item label="视频文件：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            multiple
			
 
				+            class="upload-demo"
			
 
				+            :file-list='fileList'
			
 
				+            :action="baseURL + '/cms/site/video/upload/video'"
			
 
				+            :headers="{ token }"
			
 
				+            :before-upload="beforeFujian"
			
 
				+            :on-success="successFujian"
			
 
				+            :before-remove="beforeRemove"
			
 
				+            :on-remove="handleRemove"
			
 
				+            :limit="1"
			
 
				+            :on-exceed="handleExceed"
			
 
				+            :show-file-list="true"
			
 
				+          >
			
 
				+            <el-button size="small" type="primary">点击上传</el-button>
			
 
				+            <div class="el-upload__tip" slot="tip">
			
 
				+              支持AVI、mov、rmvb、rm、FLV、mp4、3GP等格式的视频文件，大小不超过1GB。
			
 
				+            </div>
			
 
				+          </el-upload>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { videoDetailById, siteVideoSave } from '@/apis/tab5'
			
 
				+
			
 
				+import axios from '@/utils/request'
			
 
				+export default {
			
 
				+  name: 'tab5Dialog',
			
 
				+  props: {
			
 
				+    isShow: {
			
 
				+      type: Boolean,
			
 
				+      default: false
			
 
				+    }
			
 
				+  },
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      fileList: [],
			
 
				+      // 服务器前缀地址
			
 
				+      baseURL: '',
			
 
				+      token: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        thumb: '',
			
 
				+        video: '',
			
 
				+        fileName: '',
			
 
				+        lon: '',
			
 
				+        lat: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        name: [{ required: true, message: '不能为空', trigger: 'blur' }],
			
 
				+        lon: [{ required: true, message: '不能为空', trigger: 'blur' }, { validator: validatePass, trigger: 'blur' }],
			
 
				+        lat: [{ required: true, message: '不能为空', trigger: 'blur' }, { validator: validatePass, trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  methods: {
			
 
				+    // 点击关闭
			
 
				+    btnX () {
			
 
				+      this.$emit('update:isShow', false)
			
 
				+      // 清空表单
			
 
				+      this.ruleForm = {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        thumb: '',
			
 
				+        video: '',
			
 
				+        fileName: '',
			
 
				+        lon: '',
			
 
				+        lat: ''
			
 
				+      }
			
 
				+      this.$refs.ruleForm.resetFields()
			
 
				+      this.fileList = []
			
 
				+    },
			
 
				+    // 点击确定
			
 
				+    async btnOk () {
			
 
				+      if (this.ruleForm.thumb === '') return this.$message.warning('封面图片不能为空')
			
 
				+      if (this.ruleForm.video === '') return this.$message.warning('视频文件不能为空')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = { ...this.ruleForm }
			
 
				+        const res = await siteVideoSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('操作成功')
			
 
				+          // 通知父组件刷新页面
			
 
				+          this.$emit('refresh')
			
 
				+          this.btnX()
			
 
				+        } else this.$message.warning(res.msg)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+      // console.log(998, res)
			
 
				+    },
			
 
				+    // 上传图片
			
 
				+    beforethumbUpload (file) {
			
 
				+      // console.log(998, file)
			
 
				+      // 限制图片大小和格式
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 5
			
 
				+      const typeOk =
			
 
				+        file.type === 'image/png' ||
			
 
				+        file.type === 'image/jpeg' ||
			
 
				+        file.type === 'image/gif'
			
 
				+
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (!typeOk) {
			
 
				+          this.$message.error('照片格式有误！')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('照片大小超过5M！')
			
 
				+          reject(file)
			
 
				+        } else if (file.name.length > 32) {
			
 
				+          this.$message.error('照片名字不能超过32个字！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          this.$message.success('上传成功')
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    upload_thumb_success (data) {
			
 
				+      // console.log('图片上传成功', data.data.urlPath)
			
 
				+      this.ruleForm.thumb = data.data.urlPath
			
 
				+    },
			
 
				+    // 上传附件
			
 
				+    beforeFujian (file) {
			
 
				+      // console.log('附件上传前', file)
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 1024
			
 
				+      const typeOk =
			
 
				+        file.type === 'video/mp4' ||
			
 
				+        file.type === 'video/avi' ||
			
 
				+        file.type === 'video/quicktime' || file.type === 'video/rm' || (file.type === '' && (file.name.includes('.flv') || file.name.includes('.rmvb'))) || file.type === 'video/3gpp'
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (file.name.length > 32) {
			
 
				+          this.$message.error('视频名字不能超过32个字')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('视频大小超过1GB！')
			
 
				+          reject(file)
			
 
				+        } else if (!typeOk) {
			
 
				+          this.$message.error('视频格式有误！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    successFujian (file) {
			
 
				+      console.log('上传附件成功', file)
			
 
				+      if (file.code === 0) {
			
 
				+        this.ruleForm.video = file.data.urlPath
			
 
				+        this.ruleForm.fileName = file.data.fileName
			
 
				+        this.$message.success('上传成功')
			
 
				+      } else if (file.code === -1) {
			
 
				+        this.$message.warning('上传失败，不支持的文件格式')
			
 
				+      }
			
 
				+    },
			
 
				+    beforeRemove (file, fileList) {
			
 
				+      if (file && file.status === 'success') {
			
 
				+        return this.$confirm(`确定移除 ${file.name}？`)
			
 
				+      }
			
 
				+    },
			
 
				+    handleRemove (file, fileList) {
			
 
				+      this.ruleForm.video = ''
			
 
				+      this.ruleForm.fileName = ''
			
 
				+    },
			
 
				+    handleExceed (files, fileList) {
			
 
				+      this.$message.warning('只能上传一个视频，请删除原视频后操作')
			
 
				+    },
			
 
				+    // 通过id获取详情---让父组件调用
			
 
				+    async videoDetailById (id) {
			
 
				+      const res = await videoDetailById(id)
			
 
				+      this.ruleForm = res.data
			
 
				+      this.fileList = [{ name: res.data.fileName }]
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    // 获取用户token
			
 
				+    this.token = localStorage.getItem('SZSBL_token')
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.biaoshi::before {
			
 
				+  top: 1px;
			
 
				+}
			
 
				+/deep/.el-upload-list{
			
 
				+  width: 500px;
			
 
				+}
			
 
				+/deep/.el-icon-plus {
			
 
				+  border: 1px dashed #ccc;
			
 
				+}
			
 
				+.avatar-uploader .el-upload {
			
 
				+  border-radius: 6px;
			
 
				+  cursor: pointer;
			
 
				+  position: relative;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.avatar-uploader .el-upload:hover {
			
 
				+  border-color: #3e5eb3;
			
 
				+}
			
 
				+.avatar-uploader-icon {
			
 
				+  font-size: 28px;
			
 
				+  color: #8c939d;
			
 
				+  width: 178px;
			
 
				+  height: 178px;
			
 
				+  line-height: 178px;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+/deep/.el-icon-circle-close {
			
 
				+  font-size: 20px;
			
 
				+}
			
 
				+.imgdiv {
			
 
				+  max-width: 400px;
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/components/tab6Dialog.vue
+++ b/houtai/src/components/tab6Dialog.vue
@@ -0,0 +1,271 @@
 
				+<template>
			
 
				+  <div class="Tab6Dialog">
			
 
				+    <el-dialog
			
 
				+      :title="ruleForm.id ? '修改' : '新增'"
			
 
				+      :visible="isShow"
			
 
				+      @close="btnX()"
			
 
				+    >
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="年份：" prop="year">
			
 
				+          <el-input v-model="ruleForm.year" style="width:500px"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <!-- 图片和附件 -->
			
 
				+        <el-form-item label="图片：">
			
 
				+          <i class="biaoshi biaoshi3"></i>
			
 
				+          <el-upload
			
 
				+            class="avatar-uploader"
			
 
				+            :action="baseURL + '/cms/aerial/upload'"
			
 
				+            :headers="{
			
 
				+              token,
			
 
				+            }"
			
 
				+            :show-file-list="false"
			
 
				+            :before-upload="beforethumbUpload"
			
 
				+            :on-success="upload_thumb_success"
			
 
				+          >
			
 
				+            <div v-if="ruleForm.thumb" class="imgdiv">
			
 
				+              <img
			
 
				+                style="width: 100%; height: 100%"
			
 
				+                :src="baseURL + ruleForm.thumb"
			
 
				+              />
			
 
				+              <i
			
 
				+                class="el-icon-circle-close"
			
 
				+                @click.stop="ruleForm.thumb = ''"
			
 
				+              ></i>
			
 
				+            </div>
			
 
				+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
			
 
				+          </el-upload>
			
 
				+          <span>格式要求：支持png、jpg、gif和jpeg的图片格式；最大支持5M。</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { imgDetailById, aerialImgSave } from '@/apis/tab6'
			
 
				+
			
 
				+import axios from '@/utils/request'
			
 
				+export default {
			
 
				+  name: 'Tab6Dialog',
			
 
				+  props: {
			
 
				+    isShow: {
			
 
				+      type: Boolean,
			
 
				+      default: false
			
 
				+    }
			
 
				+  },
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      time: '', // 服务器前缀地址
			
 
				+      baseURL: '',
			
 
				+      token: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        thumb: '',
			
 
				+        year: '',
			
 
				+        userUpdateTime: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        year: [{ required: true, message: '不能为空', trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.ruleForm.userUpdateTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    // 点击关闭
			
 
				+    btnX () {
			
 
				+      this.$emit('update:isShow', false)
			
 
				+      // 清空表单
			
 
				+      this.ruleForm = {
			
 
				+        id: '',
			
 
				+        thumb: '',
			
 
				+        year: '',
			
 
				+        userUpdateTime: ''
			
 
				+      }
			
 
				+      // 关闭验证
			
 
				+      this.$refs.ruleForm.resetFields()
			
 
				+    },
			
 
				+    // 点击确定
			
 
				+    async btnOk () {
			
 
				+      if (this.ruleForm.thumb === '') { return this.$message.warning('封面图片不能为空') }
			
 
				+      if (this.ruleForm.year.trim() === '') { return this.$message.warning('年份不能为空') }
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      const obj = { ...this.ruleForm }
			
 
				+      const res = await aerialImgSave(obj)
			
 
				+      if (res.code === 0) {
			
 
				+        this.$message.success('操作成功')
			
 
				+        // 通知父组件刷新页面
			
 
				+        this.$emit('refresh')
			
 
				+        this.btnX()
			
 
				+      } else return this.$message.warning(res.msg)
			
 
				+      // console.log(998, res)
			
 
				+    },
			
 
				+    // 上传图片
			
 
				+    beforethumbUpload (file) {
			
 
				+      // console.log(998, file)
			
 
				+      // 限制图片大小和格式
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 5
			
 
				+      const typeOk =
			
 
				+        file.type === 'image/png' ||
			
 
				+        file.type === 'image/jpeg' ||
			
 
				+        file.type === 'image/gif'
			
 
				+
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (!typeOk) {
			
 
				+          this.$message.error('照片格式有误！')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('照片大小超过5M！')
			
 
				+          reject(file)
			
 
				+        } else if (file.name.length > 32) {
			
 
				+          this.$message.error('照片名字不能超过32个字！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          this.$message.success('上传成功')
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    upload_thumb_success (data) {
			
 
				+      // console.log('图片上传成功', data.data.urlPath)
			
 
				+      this.ruleForm.thumb = data.data.urlPath
			
 
				+    },
			
 
				+    // 通过id获取详情---让父组件调用
			
 
				+    async imgDetailById (id) {
			
 
				+      const res = await imgDetailById(id)
			
 
				+      this.ruleForm = res.data
			
 
				+      // console.log(998, res)
			
 
				+      this.getCurrentTime()
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    // 获取用户token
			
 
				+    this.token = localStorage.getItem('SZSBL_token')
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.biaoshi::before {
			
 
				+  top: -10px;
			
 
				+}
			
 
				+.biaoshi2::before {
			
 
				+  top: -10px;
			
 
				+  left: -64px;
			
 
				+}
			
 
				+.biaoshi3::before {
			
 
				+  top: 0px;
			
 
				+  left: -64px;
			
 
				+}
			
 
				+/deep/.el-upload-list {
			
 
				+  width: 500px;
			
 
				+}
			
 
				+/deep/.el-icon-plus {
			
 
				+  border: 1px dashed #ccc;
			
 
				+}
			
 
				+.avatar-uploader .el-upload {
			
 
				+  border-radius: 6px;
			
 
				+  cursor: pointer;
			
 
				+  position: relative;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.avatar-uploader .el-upload:hover {
			
 
				+  border-color: #3e5eb3;
			
 
				+}
			
 
				+.avatar-uploader-icon {
			
 
				+  font-size: 28px;
			
 
				+  color: #8c939d;
			
 
				+  width: 178px;
			
 
				+  height: 178px;
			
 
				+  line-height: 178px;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+/deep/.el-icon-circle-close {
			
 
				+  font-size: 20px;
			
 
				+}
			
 
				+.imgdiv {
			
 
				+  max-width: 400px;
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/main.js
+++ b/houtai/src/main.js
@@ -0,0 +1,14 @@
 
				+import Vue from 'vue'
			
 
				+import ElementUI from 'element-ui'
			
 
				+import 'element-ui/lib/theme-chalk/index.css'
			
 
				+import App from './App.vue'
			
 
				+import router from './router'
			
 
				+import './assets/css/base.css'
			
 
				+import Moment from 'moment'
			
 
				+Vue.prototype.moment = Moment
			
 
				+Vue.config.productionTip = false
			
 
				+Vue.use(ElementUI)
			
 
				+new Vue({
			
 
				+  router,
			
 
				+  render: h => h(App)
			
 
				+}).$mount('#app')
			
--- a/houtai/src/router/index.js
+++ b/houtai/src/router/index.js
@@ -0,0 +1,155 @@
 
				+import Vue from 'vue'
			
 
				+import VueRouter from 'vue-router'
			
 
				+import { Message } from 'element-ui'
			
 
				+Vue.use(VueRouter)
			
 
				+
			
 
				+const routes = [
			
 
				+  {
			
 
				+    path: '/',
			
 
				+    name: 'login',
			
 
				+    component: () => import('../views/login.vue')
			
 
				+  },
			
 
				+  {
			
 
				+    path: '/layout',
			
 
				+    name: 'layout',
			
 
				+    component: () => import('../views/layout/index.vue'),
			
 
				+    children: [
			
 
				+      {
			
 
				+        path: 'tab1',
			
 
				+        name: 'tab1',
			
 
				+        meta: { myInd: 1 },
			
 
				+        component: () => import('../views/tab1/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab1Add',
			
 
				+        name: 'tab1Add',
			
 
				+        meta: { myInd: 1 },
			
 
				+        component: () => import('../views/tab1/tab1Add.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab1Edit',
			
 
				+        name: 'tab1Edit',
			
 
				+        meta: { myInd: 1 },
			
 
				+        component: () => import('../views/tab1/edit.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab2',
			
 
				+        name: 'tab2',
			
 
				+        meta: { myInd: 2 },
			
 
				+        component: () => import('../views/tab2/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab2Edit1',
			
 
				+        name: 'tab2Edit1',
			
 
				+        meta: { myInd: 2 },
			
 
				+        component: () => import('../views/tab2/edit1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab2Edit2',
			
 
				+        name: 'tab2Edit2',
			
 
				+        meta: { myInd: 2 },
			
 
				+        component: () => import('../views/tab2/edit2.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab3',
			
 
				+        name: 'tab3',
			
 
				+        meta: { myInd: 3 },
			
 
				+        component: () => import('../views/tab3/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab3Edit1',
			
 
				+        name: 'tab3Edit1',
			
 
				+        meta: { myInd: 3 },
			
 
				+        component: () => import('../views/tab3/edit1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4',
			
 
				+        name: 'tab4',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4Edit1',
			
 
				+        name: 'tab4Edit1',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/edit1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4Edit2',
			
 
				+        name: 'tab4Edit2',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/edit2.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab5',
			
 
				+        name: 'tab5',
			
 
				+        meta: { myInd: 5 },
			
 
				+        component: () => import('../views/tab5/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab5Edit1',
			
 
				+        name: 'tab5Edit1',
			
 
				+        meta: { myInd: 5 },
			
 
				+        component: () => import('../views/tab5/edit1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab6',
			
 
				+        name: 'tab6',
			
 
				+        meta: { myInd: 6 },
			
 
				+        component: () => import('../views/tab6/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab6Edit1',
			
 
				+        name: 'tab6Edit1',
			
 
				+        meta: { myInd: 6 },
			
 
				+        component: () => import('../views/tab6/edit1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab6Edit2',
			
 
				+        name: 'tab6Edit2',
			
 
				+        meta: { myInd: 6 },
			
 
				+        component: () => import('../views/tab6/edit2.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab7',
			
 
				+        name: 'tab7',
			
 
				+        meta: { myInd: 7 },
			
 
				+        component: () => import('../views/tab7/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab7Edit',
			
 
				+        name: 'tab7Edit',
			
 
				+        meta: { myInd: 7 },
			
 
				+        component: () => import('../views/tab7/edit.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab8',
			
 
				+        name: 'tab8',
			
 
				+        meta: { myInd: 8 },
			
 
				+        component: () => import('../views/tab8/index.vue')
			
 
				+      }
			
 
				+    ]
			
 
				+  }
			
 
				+]
			
 
				+
			
 
				+const router = new VueRouter({
			
 
				+  // mode: 'history',
			
 
				+  base: process.env.BASE_URL,
			
 
				+  routes
			
 
				+})
			
 
				+
			
 
				+router.beforeEach((to, from, next) => {
			
 
				+  // 如果是去登录页，不需要验证，直接下一步
			
 
				+  if (to.name === 'login') next()
			
 
				+  // 否则要有token值才能下一步，不然就返回登录页
			
 
				+  else {
			
 
				+    const token = localStorage.getItem('SZSBL_token')
			
 
				+    if (token) next()
			
 
				+    else {
			
 
				+      Message.warning('登录失效，请重新登录')
			
 
				+      next({ name: 'login' })
			
 
				+    }
			
 
				+  }
			
 
				+})
			
 
				+
			
 
				+export default router
			
--- a/houtai/src/utils/pass.js
+++ b/houtai/src/utils/pass.js
@@ -0,0 +1,106 @@
 
				+/* eslint-disable */
			
 
				+function NoToChinese (num) {
			
 
				+  num = String(num)
			
 
				+  var chnNumChar = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
			
 
				+  if (num == 0) {
			
 
				+    return chnNumChar[0]
			
 
				+  }
			
 
				+  let tmp = ''
			
 
				+  for (let i = 0; i < num.length; i++) {
			
 
				+    const ele = num.charAt(i)
			
 
				+    tmp += chnNumChar[ele]
			
 
				+  }
			
 
				+
			
 
				+  return tmp
			
 
				+}
			
 
				+
			
 
				+function randomWord (randomFlag, min, max) {
			
 
				+  let str = ''
			
 
				+  let range = min
			
 
				+  const arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
			
 
				+  // 随机产生
			
 
				+  if (randomFlag) {
			
 
				+    range = Math.round(Math.random() * (max - min)) + min
			
 
				+  }
			
 
				+  for (var i = 0; i < range; i++) {
			
 
				+    const pos = Math.round(Math.random() * (arr.length - 1))
			
 
				+    str += arr[pos]
			
 
				+  }
			
 
				+  return str
			
 
				+}
			
 
				+
			
 
				+module.exports = {
			
 
				+  formatDate: function (time) {
			
 
				+    var weekArr = ['日', '一', '二', '三', '四', '五', '六']
			
 
				+    var date = new Date(time)
			
 
				+    var year = date.getFullYear()
			
 
				+    var month = date.getMonth() + 1
			
 
				+    var day = date.getDate()
			
 
				+    var week = '星期' + weekArr[date.getDay()]
			
 
				+    if (window.innerWidth < 1700) {
			
 
				+      return (
			
 
				+        year +
			
 
				+        '年' +
			
 
				+        (String(month).length > 1 ? month : '0' + month) +
			
 
				+        '月' +
			
 
				+        (String(day).length > 1 ? day : '0' + day) +
			
 
				+        '日' +
			
 
				+        '<br/>' +
			
 
				+        week
			
 
				+      )
			
 
				+    }
			
 
				+    return (
			
 
				+      year +
			
 
				+      '年' +
			
 
				+      (String(month).length > 1 ? month : '0' + month) +
			
 
				+      '月' +
			
 
				+      (String(day).length > 1 ? day : '0' + day) +
			
 
				+      '日' +
			
 
				+      ' ' +
			
 
				+      week
			
 
				+    )
			
 
				+  },
			
 
				+  smoothscrollpos: function (domName) {
			
 
				+    if (domName == '/') {
			
 
				+      return window.scrollTo(0, 0)
			
 
				+    }
			
 
				+    const smoothscroll = () => {
			
 
				+      const dom = document.getElementById(domName)
			
 
				+      // window.scrollTo({
			
 
				+      //   top:dom.offsetTop - 100,
			
 
				+      //   left:0,
			
 
				+      //   behavior: "smooth"
			
 
				+      // })
			
 
				+      dom && window.scrollTo(0, dom.offsetTop - 120)
			
 
				+    }
			
 
				+    smoothscroll()
			
 
				+  },
			
 
				+
			
 
				+  formatTime: function (time, fan = false) {
			
 
				+    let t1 = time.split(' ')[0].split('-')
			
 
				+    if (fan) {
			
 
				+      t1 = t1.map((item) => {
			
 
				+        const t = NoToChinese(item)
			
 
				+        return t
			
 
				+      })
			
 
				+    }
			
 
				+    return t1
			
 
				+  },
			
 
				+  encodeStr: function (str, strv = '') {
			
 
				+    const NUM = 2
			
 
				+    const front = randomWord(false, 8)
			
 
				+    const middle = randomWord(false, 8)
			
 
				+    const end = randomWord(false, 8)
			
 
				+
			
 
				+    const str1 = str.substring(0, NUM)
			
 
				+    const str2 = str.substring(NUM)
			
 
				+
			
 
				+    if (strv) {
			
 
				+      const strv1 = strv.substring(0, NUM)
			
 
				+      const strv2 = strv.substring(NUM)
			
 
				+      return [front + str2 + middle + str1 + end, front + strv2 + middle + strv1 + end]
			
 
				+    }
			
 
				+
			
 
				+    return front + str2 + middle + str1 + end
			
 
				+  }
			
 
				+}
			
--- a/houtai/src/utils/request.js
+++ b/houtai/src/utils/request.js
@@ -0,0 +1,38 @@
 
				+import axios from 'axios'
			
 
				+const service = axios.create({
			
 
				+  // baseURL: 'http://192.168.0.135:8011/', // 本地调试
			
 
				+  baseURL: 'http://8.135.106.227:8012/', // 线上调试
			
 
				+  // baseURL: '', // build
			
 
				+  timeout: 5000
			
 
				+})
			
 
				+// 请求拦截器
			
 
				+service.interceptors.request.use(function (config) {
			
 
				+  // console.log('触发拦截器')
			
 
				+  // 在发送请求之前做些什么：看看有没有token，如果有通过请求头的方式传递token
			
 
				+  const token = localStorage.getItem('SZSBL_token')
			
 
				+  if (token) { // 判断是否有token,有，则
			
 
				+    // config.headers['Authorization'] = token
			
 
				+    config.headers.token = token
			
 
				+  }
			
 
				+
			
 
				+  return config
			
 
				+}, function (error) {
			
 
				+  // 对请求错误做些什么
			
 
				+  return Promise.reject(error)
			
 
				+})
			
 
				+
			
 
				+// 添加响应拦截器
			
 
				+service.interceptors.response.use(function (response) {
			
 
				+  // console.log('触发相应拦截器', response)
			
 
				+  // 对响应数据做点什么--response就是发送每个请求的返回值
			
 
				+  if (response.data.code === 5001 || response.data.code === 5002) {
			
 
				+    // Toast.fail('未登录，请先登录')
			
 
				+    localStorage.removeItem('SZSBL_token')
			
 
				+  }
			
 
				+  return response.data
			
 
				+}, function (error) {
			
 
				+  // 对响应错误做点什么
			
 
				+  return Promise.reject(error)
			
 
				+})
			
 
				+
			
 
				+export default service
			
--- a/houtai/src/views/layout/index.vue
+++ b/houtai/src/views/layout/index.vue
@@ -0,0 +1,343 @@
 
				+<template>
			
 
				+  <div class="layout">
			
 
				+    <div class="top">
			
 
				+      <img src="@/assets/img/logo.png" alt="" />
			
 
				+      <p>中国人民解放军陆军勤务学院</p>
			
 
				+      <div class="top_right">
			
 
				+        <div class="user" @click="cut = !cut">
			
 
				+          <img src="@/assets/img/user.jpg" alt="" />
			
 
				+          <span>{{userName}}</span>
			
 
				+          <!-- 下箭头 -->
			
 
				+          <div class="pull_down" v-if="cut"></div>
			
 
				+          <div class="pull_up" v-else></div>
			
 
				+        </div>
			
 
				+        <!-- 点击箭头出来的ul -->
			
 
				+        <ul class="user_handle" v-show="cut">
			
 
				+          <li @click="isShow = true">修改密码</li>
			
 
				+          <li @click="outLogin">退出登录</li>
			
 
				+        </ul>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="con">
			
 
				+      <div class="left">
			
 
				+        <div class="biaoji">内容管理</div>
			
 
				+        <ul>
			
 
				+          <li
			
 
				+            v-for="item in tab1"
			
 
				+            :key="item.id"
			
 
				+            :class="{ active: $route.meta.myInd === item.id }"
			
 
				+            @click="push(item.url)"
			
 
				+          >
			
 
				+            {{ item.name }}
			
 
				+          </li>
			
 
				+        </ul>
			
 
				+        <div class="biaoji" v-if="userName==='admin'">系统管理</div>
			
 
				+        <ul v-if="userName==='admin'">
			
 
				+          <li
			
 
				+            v-for="item in tab2"
			
 
				+            :key="item.id"
			
 
				+            :class="{ active: $route.meta.myInd === item.id }"
			
 
				+            @click="push(item.url)"
			
 
				+          >
			
 
				+            {{ item.name }}
			
 
				+          </li>
			
 
				+        </ul>
			
 
				+      </div>
			
 
				+      <!-- 右侧内容 -->
			
 
				+      <div class="right">
			
 
				+        <Router-view />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 点击修改密码出现弹窗 -->
			
 
				+    <el-dialog title="修改密码" :visible.sync="isShow"  @close="btnX()">
			
 
				+      <el-form :model="form" label-width="100px" :rules="rules" ref="ruleForm">
			
 
				+        <el-form-item label="旧密码：" prop="oldPassword">
			
 
				+          <el-input
			
 
				+            v-model="form.oldPassword"
			
 
				+            placeholder="请输入"
			
 
				+            show-password
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="新密码：" prop="newPassword">
			
 
				+          <el-input
			
 
				+            v-model="form.newPassword"
			
 
				+            placeholder="请输入"
			
 
				+            show-password
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="确定新密码：" prop="checkPass">
			
 
				+          <el-input
			
 
				+            v-model="form.checkPass"
			
 
				+            placeholder="请输入"
			
 
				+            show-password
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div slot="footer" class="dialog-footer">
			
 
				+        <el-button @click="btnX">取 消</el-button>
			
 
				+        <el-button type="primary" @click="btnOk">确 定</el-button>
			
 
				+      </div>
			
 
				+    </el-dialog>  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { encodeStr } from '../../utils/pass'
			
 
				+import { Base64 } from 'js-base64'
			
 
				+import { updatePwd } from '@/apis/login'
			
 
				+export default {
			
 
				+  name: 'layout',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass2 = (rule, value, callback) => {
			
 
				+      if (value !== this.form.newPassword) {
			
 
				+        callback(new Error('两次输入密码不一致!'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      // 修改密码
			
 
				+      form: {
			
 
				+        oldPassword: '',
			
 
				+        newPassword: '',
			
 
				+        checkPass: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        checkPass: [
			
 
				+          { validator: validatePass2, trigger: 'blur' }
			
 
				+        ],
			
 
				+        oldPassword: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' }
			
 
				+        ],
			
 
				+        newPassword: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' }, { max: 15, message: '不能超过15个字', trigger: 'blur' }
			
 
				+        ]
			
 
				+      },
			
 
				+      userName: '',
			
 
				+      cut: false,
			
 
				+      isShow: false,
			
 
				+      tab1: [
			
 
				+        { name: '文物典藏管理', id: 1, url: '/layout/tab1' },
			
 
				+        { name: '学院领导管理', id: 2, url: '/layout/tab2' },
			
 
				+        { name: '学籍管理', id: 3, url: '/layout/tab3' },
			
 
				+        { name: '学院宣传片管理', id: 4, url: '/layout/tab4' },
			
 
				+        { name: '校园图片管理', id: 5, url: '/layout/tab5' },
			
 
				+        { name: '校歌管理', id: 6, url: '/layout/tab6' }
			
 
				+      ],
			
 
				+      tab2: [
			
 
				+        { name: '用户管理', id: 7, url: '/layout/tab7' },
			
 
				+        { name: '操作日志', id: 8, url: '/layout/tab8' }
			
 
				+      ]
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+  // 修改密码点击取消
			
 
				+    btnX () {
			
 
				+      this.$refs.ruleForm.resetFields()
			
 
				+      this.cut = false
			
 
				+      this.isShow = false
			
 
				+      this.form = {
			
 
				+        oldPassword: '',
			
 
				+        newPassword: '',
			
 
				+        checkPass: ''
			
 
				+      }
			
 
				+    },
			
 
				+    // 修改密码点击确定
			
 
				+    async btnOk () {
			
 
				+      await this.$refs.ruleForm.validate()
			
 
				+      try {
			
 
				+        const data = {
			
 
				+          oldPassword: encodeStr(Base64.encode(this.form.oldPassword)),
			
 
				+          newPassword: encodeStr(Base64.encode(this.form.newPassword))
			
 
				+        }
			
 
				+        await updatePwd(data)
			
 
				+        this.$message.success('修改成功')
			
 
				+        localStorage.clear('SWKK_token')
			
 
				+        localStorage.clear('SWKK_userInfo')
			
 
				+        this.$router.push('/')
			
 
				+      } catch (error) {
			
 
				+        this.$message.error('旧密码错误')
			
 
				+      }
			
 
				+    },
			
 
				+    push (url) {
			
 
				+      this.$router.push(url).catch(() => {})
			
 
				+    },
			
 
				+    // 点击退出登录
			
 
				+    outLogin () {
			
 
				+      this.cut = false
			
 
				+      this.$confirm('确定退出吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(() => {
			
 
				+          localStorage.clear('SZSBL_token')
			
 
				+          localStorage.clear('SZSBL_userName')
			
 
				+          this.$router.push('/')
			
 
				+          this.$message.success('退出成功!')
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消')
			
 
				+        })
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取用户名
			
 
				+    const res = localStorage.getItem('SZSBL_userName')
			
 
				+    this.userName = res
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.layout {
			
 
				+  .top {
			
 
				+    position: relative;
			
 
				+    width: 100%;
			
 
				+    min-width: 1800px;
			
 
				+    box-shadow: 1px 3px 3px 3px rgb(196, 177, 177);
			
 
				+    height: 70px;
			
 
				+    background-color: #b9412e;
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    & > img {
			
 
				+      width: 50px;
			
 
				+      // height: 60px;
			
 
				+      border-radius: 50%;
			
 
				+      overflow: hidden;
			
 
				+      margin: 0 10px 0 30px;
			
 
				+    }
			
 
				+    & > P {
			
 
				+      color: #fff;
			
 
				+      font-size: 24px;
			
 
				+      font-weight: 700;
			
 
				+    }
			
 
				+    .top_right {
			
 
				+      width: 150px;
			
 
				+      position: absolute;
			
 
				+      right: 30px;
			
 
				+      top: 0;
			
 
				+      height: 100%;
			
 
				+      display: flex;
			
 
				+      align-items: center;
			
 
				+      justify-content: space-between;
			
 
				+      .user {
			
 
				+        color: #fff;
			
 
				+        cursor: pointer;
			
 
				+        position: relative;
			
 
				+        display: flex;
			
 
				+        align-items: center;
			
 
				+        img {
			
 
				+          margin-right: 15px;
			
 
				+          width: 34px;
			
 
				+          height: 34px;
			
 
				+          border-radius: 50%;
			
 
				+          overflow: hidden;
			
 
				+        }
			
 
				+        .pull_down {
			
 
				+          position: absolute;
			
 
				+          right: -25px;
			
 
				+          bottom: 10px;
			
 
				+          display: inline-block;
			
 
				+          width: 0;
			
 
				+          height: 0;
			
 
				+          border-left: 8px solid transparent;
			
 
				+          border-right: 8px solid transparent;
			
 
				+          border-bottom: 8px solid #fff;
			
 
				+        }
			
 
				+        .pull_up {
			
 
				+          cursor: pointer;
			
 
				+          position: absolute;
			
 
				+          right: -25px;
			
 
				+          bottom: 10px;
			
 
				+          display: inline-block;
			
 
				+          width: 0;
			
 
				+          height: 0;
			
 
				+          border-left: 8px solid transparent;
			
 
				+          border-right: 8px solid transparent;
			
 
				+          border-top: 8px solid #fff;
			
 
				+        }
			
 
				+      }
			
 
				+      .user_handle {
			
 
				+        z-index: 999;
			
 
				+        padding: 10px 40px;
			
 
				+        position: absolute;
			
 
				+        right: 0;
			
 
				+        bottom: -90px;
			
 
				+        background-color: #b9412e;
			
 
				+        li {
			
 
				+          color: #fff;
			
 
				+          cursor: pointer;
			
 
				+          margin: 10px 0;
			
 
				+        }
			
 
				+        li:hover {
			
 
				+          color: orange;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .con {
			
 
				+    display: flex;
			
 
				+    width: 100%;
			
 
				+    padding: 30px 30px 0;
			
 
				+    height: calc(100vh - 100px);
			
 
				+  }
			
 
				+  .left {
			
 
				+    min-width: 220px;
			
 
				+    width: 220px;
			
 
				+    height: 100%;
			
 
				+    min-height: 800px;
			
 
				+    background-color: #fff;
			
 
				+    padding-top: 15px;
			
 
				+    .biaoji {
			
 
				+      height: 40px;
			
 
				+      background-color: #b9412e;
			
 
				+      width: 90%;
			
 
				+      border-radius: 0 40px 40px 0;
			
 
				+      color: #fff;
			
 
				+      font-weight: 700;
			
 
				+      font-size: 20px;
			
 
				+      line-height: 40px;
			
 
				+      padding-left: 50px;
			
 
				+    }
			
 
				+    ul {
			
 
				+      li {
			
 
				+        cursor: pointer;
			
 
				+        padding-left: 50px;
			
 
				+        margin: 40px 0;
			
 
				+        &:hover {
			
 
				+          color: #b9412e;
			
 
				+        }
			
 
				+      }
			
 
				+      .active {
			
 
				+        color: #b9412e;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .right {
			
 
				+    position: relative;
			
 
				+    padding: 20px 0;
			
 
				+    min-width: 1500px;
			
 
				+    flex: 1;
			
 
				+    margin-left: 30px;
			
 
				+    background-color: #fff;
			
 
				+    height: 100%;
			
 
				+    min-height: 800px;
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/login.vue
+++ b/houtai/src/views/login.vue
@@ -0,0 +1,147 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+<div class='login'>
			
 
				+  <div class="top">
			
 
				+    <img src="../assets/img/logo.png" alt="">
			
 
				+    <p>中国人民解放军陆军勤务学院</p>
			
 
				+  </div>
			
 
				+  <div class="con">
			
 
				+    <div class="left">
			
 
				+      <p>中国人民解放军陆军勤务学院</p>
			
 
				+      <p>管理后台</p>
			
 
				+    </div>
			
 
				+    <div class="right">
			
 
				+      <p>欢迎登录</p>
			
 
				+      <div class="row">
			
 
				+        <el-input v-model="from.userName" placeholder="账号"></el-input>
			
 
				+      </div>
			
 
				+      <div class="row">
			
 
				+        <el-input v-model="from.passWord" placeholder="密码" show-password></el-input>
			
 
				+      </div>
			
 
				+      <div class="btn" @click="login">登 陆</div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { userLogin } from '@/apis/login'
			
 
				+export default {
			
 
				+  name: 'login',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      from: {
			
 
				+        userName: '',
			
 
				+        passWord: ''
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    async login () {
			
 
				+      if (this.from.userName.trim() === '') return this.$message.warning('账号不能为空!')
			
 
				+      if (this.from.passWord.trim() === '') return this.$message.warning('密码不能为空!')
			
 
				+      const res = await userLogin(this.from)
			
 
				+      if (res.code === 0) {
			
 
				+        localStorage.setItem('SZSBL_token', res.data.token)
			
 
				+        localStorage.setItem('SZSBL_userName', res.data.user.userName)
			
 
				+        this.$router.push('/layout/tab1')
			
 
				+        this.$message.success('登录成功')
			
 
				+      } else this.$message.warning(res.msg)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.login{
			
 
				+  .top{
			
 
				+    box-shadow: 1px 3px 3px 3px rgb(196, 177, 177);
			
 
				+    height: 70px;
			
 
				+    background-color: #b9412e;
			
 
				+    display: flex;
			
 
				+    align-items: center;
			
 
				+    &>img {
			
 
				+      width: 50px;
			
 
				+      // height: 60px;
			
 
				+      border-radius: 50%;
			
 
				+      overflow: hidden;
			
 
				+      margin: 0 10px 0 30px;
			
 
				+    }
			
 
				+    &>P {
			
 
				+      color: #fff;
			
 
				+      font-size: 24px;
			
 
				+      font-weight: 700;
			
 
				+    }
			
 
				+  }
			
 
				+  .con{
			
 
				+    display: flex;
			
 
				+    margin: 180px auto 0;
			
 
				+    width: 700px;
			
 
				+    height: 500px;
			
 
				+    border: 1px solid #ccc;
			
 
				+    .left{
			
 
				+      display: flex;
			
 
				+      flex-direction: column;
			
 
				+      justify-content: center;
			
 
				+      width: 350px;
			
 
				+      height: 100%;
			
 
				+      background-color: #b9412e;
			
 
				+      &>p{
			
 
				+        width: 80%;
			
 
				+        margin: 0 auto;
			
 
				+        margin-bottom: 30px;
			
 
				+        color: #fff;
			
 
				+        font-weight: 700;
			
 
				+        text-align: center;
			
 
				+        font-size: 30px;
			
 
				+      }
			
 
				+    }
			
 
				+    .right{
			
 
				+      width: 350px;
			
 
				+      &>p {
			
 
				+        font-size: 24px;
			
 
				+        text-align: center;
			
 
				+        margin-top: 100px;
			
 
				+      }
			
 
				+      .row{
			
 
				+        width: 90%;
			
 
				+        margin: 50px auto;
			
 
				+      }
			
 
				+      .btn {
			
 
				+        cursor: pointer;
			
 
				+        width: 90%;
			
 
				+        height: 40px;
			
 
				+        line-height: 40px;
			
 
				+        text-align: center;
			
 
				+        margin: 50px auto 0;
			
 
				+        background-color: #b9412e;
			
 
				+        border-radius: 8px;
			
 
				+        color: #fff;
			
 
				+
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+</style>
			
--- a/houtai/src/views/tab1/edit.vue
+++ b/houtai/src/views/tab1/edit.vue
@@ -0,0 +1,257 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab1Edit">
			
 
				+    <div class="top">
			
 
				+      {{ ruleForm.id === "1" ? "园区概况" : "各楼宇人数统计" }}
			
 
				+    </div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="综合大楼：" prop="complexBuilding">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.complexBuilding"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit" v-if="ruleForm.id === '1'">m<sup>2</sup></span>
			
 
				+          <span class="unit2" v-else>人</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="学术交流中心：" prop="exchangeCentre">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.exchangeCentre"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit" v-if="ruleForm.id === '1'">m<sup>2</sup></span>
			
 
				+          <span class="unit2" v-else>人</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="公寓楼：" prop="apartment">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.apartment"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit" v-if="ruleForm.id === '1'">m<sup>2</sup></span>
			
 
				+          <span class="unit2" v-else>人</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="综合服务中心：" prop="serviceCentre">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.serviceCentre"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit" v-if="ruleForm.id === '1'">m<sup>2</sup></span>
			
 
				+          <span class="unit2" v-else>人</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="科研楼：" prop="scientificBuilding">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.scientificBuilding"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit" v-if="ruleForm.id === '1'">m<sup>2</sup></span>
			
 
				+          <span class="unit2" v-else>人</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab1')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { parkSave } from '@/apis/tab1'
			
 
				+export default {
			
 
				+  name: 'tab1Edit',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      ruleForm: {
			
 
				+        complexBuilding: '', // 综合大楼
			
 
				+        exchangeCentre: '', // 学术交流中心
			
 
				+        apartment: '', // 公寓楼
			
 
				+        serviceCentre: '', // 综合服务中心
			
 
				+        scientificBuilding: '' // 科研楼
			
 
				+      },
			
 
				+      rules: {
			
 
				+        complexBuilding: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        exchangeCentre: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        apartment: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        serviceCentre: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        scientificBuilding: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        if (this.ruleForm.id === '1') {
			
 
				+          obj.type = 'park'
			
 
				+        } else if (this.ruleForm.id === '2') {
			
 
				+          obj.type = 'building'
			
 
				+        }
			
 
				+        obj.id = Number(this.ruleForm.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await parkSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab1')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.ruleForm = this.$route.query
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab1Edit {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: -5px;
			
 
				+    }
			
 
				+    .unit2 {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab1/index.vue
+++ b/houtai/src/views/tab1/index.vue
@@ -0,0 +1,274 @@
 
				+<template>
			
 
				+  <div class="tab1">
			
 
				+    <div class="insideTop">
			
 
				+      文物典藏管理
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addGood">新增文物典藏</el-button>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="obstruct"></div>
			
 
				+    <div class="conten">
			
 
				+      <div class="con_left">
			
 
				+        <div class="cutJT">
			
 
				+          <i class="el-icon-arrow-down"></i>
			
 
				+          文物典藏
			
 
				+        </div>
			
 
				+        <ul>
			
 
				+          <li
			
 
				+            v-for="item in conLeftArr"
			
 
				+            :key="item.id"
			
 
				+            :class="{ active: conLeft === item.type }"
			
 
				+            @click="cutLeft(item.type)"
			
 
				+          >
			
 
				+            {{ item.name }}
			
 
				+          </li>
			
 
				+        </ul>
			
 
				+      </div>
			
 
				+      <!-- 右侧主要内容 -->
			
 
				+      <div class="con_right">
			
 
				+        <div class="classify">全部</div>
			
 
				+        <div class="search">
			
 
				+          <span>发布时间：</span>
			
 
				+          <el-date-picker
			
 
				+            style="width: 240px"
			
 
				+            v-model="time"
			
 
				+            type="daterange"
			
 
				+            range-separator="-"
			
 
				+            start-placeholder="开始时间"
			
 
				+            end-placeholder="结束时间"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+          <span class="search_k">标题关键字：</span>
			
 
				+          <el-input
			
 
				+            v-model="formData.searchKey"
			
 
				+            placeholder="请输入"
			
 
				+            style="width: 240px"
			
 
				+          ></el-input>
			
 
				+          <span class="search_k">排序：</span>
			
 
				+          <el-select
			
 
				+            v-model="formData.type"
			
 
				+            placeholder="请选择"
			
 
				+            style="width: 240px"
			
 
				+          >
			
 
				+            <el-option label="发布时间" value="time"></el-option>
			
 
				+            <el-option label="排序编号" value="number"></el-option>
			
 
				+          </el-select>
			
 
				+          <!-- 右侧按钮 -->
			
 
				+          <div class="search_btn">
			
 
				+            <el-button type="primary">查 询</el-button>
			
 
				+            <el-button>重 置</el-button>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <!-- 表格 -->
			
 
				+        <div class="table">
			
 
				+          <el-table :data="tableData" style="width: 100%">
			
 
				+            <el-table-column label="序号" width="80">
			
 
				+              <template slot-scope="scope">
			
 
				+                {{
			
 
				+                  scope.$index + (formData.pageNum - 1) * formData.pageSize + 1
			
 
				+                }}
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+            <el-table-column label="标题" width="200">
			
 
				+              <template #default="{ row }">
			
 
				+                <span class="table_name" :title="row.name1">{{
			
 
				+                  row.name1
			
 
				+                }}</span>
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+            <el-table-column label="封面图片" width="100">
			
 
				+              <template #default>
			
 
				+                <img class="table_img" src="../../assets/img/demo.png" alt="" />
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+            <el-table-column prop="name1" label="阅读"> </el-table-column>
			
 
				+            <el-table-column prop="name1" label="发布人"> </el-table-column>
			
 
				+            <el-table-column prop="name2" label="发布时间" width="200"> </el-table-column>
			
 
				+            <el-table-column prop="address" label="排序" width="80">
			
 
				+              <template #default="{ row }">
			
 
				+                <el-input type="text" v-model="row.name1"></el-input>
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+            <el-table-column prop="name3" label="是否显示">
			
 
				+              <template #default="{ row }">
			
 
				+                <el-switch
			
 
				+                  v-model="row.name3"
			
 
				+                  active-color="#b9412e"
			
 
				+                >
			
 
				+                </el-switch>
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+            <el-table-column label="操作">
			
 
				+              <template #default>
			
 
				+                <el-button type="text">查看</el-button>
			
 
				+                <el-button type="text">编辑</el-button>
			
 
				+                <el-button type="text">删除</el-button>
			
 
				+              </template>
			
 
				+            </el-table-column>
			
 
				+          </el-table>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      conLeft: '1',
			
 
				+      time: '',
			
 
				+      conLeftArr: [
			
 
				+        { name: '实物模型', type: '1' },
			
 
				+        { name: '专题图库', type: '2' },
			
 
				+        { name: '视频档案', type: '3' }
			
 
				+      ],
			
 
				+      formData: {
			
 
				+        startTime: '',
			
 
				+        endTime: '',
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: 'time'
			
 
				+      },
			
 
				+      tableData: [
			
 
				+        { name1: '123', name2: '2013-12-26  13:33:23', name3: true },
			
 
				+        { name1: '123', name2: '123', name3: false }
			
 
				+      ]
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      this.handleSelect(val)
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击新增文物
			
 
				+    addGood () {
			
 
				+      this.$router.push('/layout/tab1Add')
			
 
				+    },
			
 
				+    // 点击左侧的tab栏
			
 
				+    cutLeft (type) {
			
 
				+      this.conLeft = type
			
 
				+    },
			
 
				+    // 时间处理----------------
			
 
				+    handleSelect (e) {
			
 
				+      const date = []
			
 
				+      for (const i in e) {
			
 
				+        date.push(this.gettime(e[i]))
			
 
				+      }
			
 
				+      this.formData.startTime = date[0]
			
 
				+      if (date[1]) {
			
 
				+        this.formData.endTime = date[1].replace('00:00:00', '23:59:59')
			
 
				+      }
			
 
				+      if (e === null) this.formData.endTime = ''
			
 
				+    },
			
 
				+    gettime (data) {
			
 
				+      const value =
			
 
				+        data.getFullYear() +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getMonth() + 1) +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getDate()) +
			
 
				+        ' ' +
			
 
				+        this.checkTime(data.getHours()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getMinutes()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getSeconds())
			
 
				+      return value
			
 
				+    },
			
 
				+    checkTime (i) {
			
 
				+      if (i < 10) {
			
 
				+        i = '0' + i
			
 
				+      }
			
 
				+      return i
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab1 {
			
 
				+  height: 100%;
			
 
				+  .conten {
			
 
				+    display: flex;
			
 
				+    height: calc(100% - 32px);
			
 
				+    .con_left {
			
 
				+      padding: 20px 0 0 15px;
			
 
				+      width: 180px;
			
 
				+      height: 100%;
			
 
				+      border: 1px solid #ccc;
			
 
				+      .cutJT {
			
 
				+        cursor: pointer;
			
 
				+        margin-bottom: 10px;
			
 
				+      }
			
 
				+      ul {
			
 
				+        li {
			
 
				+          cursor: pointer;
			
 
				+          margin-left: 20px;
			
 
				+          width: 100px;
			
 
				+          text-align: center;
			
 
				+          line-height: 30px;
			
 
				+          height: 30px;
			
 
				+          &:hover {
			
 
				+            color: #b9412e;
			
 
				+            background-color: #e6f7ff;
			
 
				+          }
			
 
				+        }
			
 
				+        .active {
			
 
				+          color: #b9412e;
			
 
				+          background-color: #e6f7ff;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    .con_right {
			
 
				+      padding: 15px 30px 0;
			
 
				+      flex: 1;
			
 
				+      .classify {
			
 
				+        text-align: center;
			
 
				+        width: 40px;
			
 
				+        padding-bottom: 10px;
			
 
				+        color: #b9412e;
			
 
				+        border-bottom: 2px solid #b9412e;
			
 
				+      }
			
 
				+      .search {
			
 
				+        margin-bottom: 20px;
			
 
				+        position: relative;
			
 
				+        margin-top: 12px;
			
 
				+        height: 40px;
			
 
				+        .search_k {
			
 
				+          margin-left: 30px;
			
 
				+        }
			
 
				+        .search_btn {
			
 
				+          display: flex;
			
 
				+          justify-content: space-between;
			
 
				+          width: 200px;
			
 
				+          position: absolute;
			
 
				+          right: 0px;
			
 
				+          top: 0;
			
 
				+        }
			
 
				+        .table {
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab1/tab1Add.vue
+++ b/houtai/src/views/tab1/tab1Add.vue
@@ -0,0 +1,279 @@
 
				+<template>
			
 
				+  <div class="tab1Add">
			
 
				+    <div class="insideTop">
			
 
				+      文物典藏管理 > 新增文物典藏
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="goBack">返 回</el-button>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="obstruct"></div>
			
 
				+    <!-- 主要内容 -->
			
 
				+    <div class="conten">
			
 
				+      <div class="con_top">基本信息</div>
			
 
				+      <!-- 表单 -->
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="140px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="标题：" prop="name">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.name"
			
 
				+            maxlength="25"
			
 
				+            show-word-limit
			
 
				+            style="width: 500px"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="精品类型：">
			
 
				+          <i class="biaoshi biaoshi2"></i>
			
 
				+          <el-radio v-model="radio" label="1">实物模型</el-radio>
			
 
				+          <el-radio v-model="radio" label="2" disabled>专题图库</el-radio>
			
 
				+          <el-radio v-model="radio" label="3" disabled>视频档案</el-radio>
			
 
				+        </el-form-item>
			
 
				+        <!-- 图片和附件 -->
			
 
				+        <el-form-item label="模型封面图片：">
			
 
				+          <i class="biaoshi biaoshi1"></i>
			
 
				+          <el-upload
			
 
				+            class="avatar-uploader"
			
 
				+            :action="baseURL + '/cms/security/video/upload/img'"
			
 
				+            :headers="{
			
 
				+              token,
			
 
				+            }"
			
 
				+            :show-file-list="false"
			
 
				+            :before-upload="beforethumbUpload"
			
 
				+            :on-success="upload_thumb_success"
			
 
				+          >
			
 
				+            <div v-if="ruleForm.thumb" class="imgdiv">
			
 
				+              <img
			
 
				+                style="width: 100%; height: 100%"
			
 
				+                :src="baseURL + ruleForm.thumb"
			
 
				+              />
			
 
				+              <i
			
 
				+                class="el-icon-circle-close"
			
 
				+                @click.stop="ruleForm.thumb = ''"
			
 
				+              ></i>
			
 
				+            </div>
			
 
				+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
			
 
				+          </el-upload>
			
 
				+          <p class="upHint">格式要求：</p>
			
 
				+          <p class="upHint">
			
 
				+            1、支持png、jpg、gif和jpeg的图片格式；最大支持20M。
			
 
				+          </p>
			
 
				+          <p class="upHint">2、用于实物模型列表中进行展示。</p>
			
 
				+        </el-form-item>
			
 
				+        <!-- 上传附件 -->
			
 
				+        <el-form-item label="模型文件：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-upload
			
 
				+            multiple
			
 
				+            class="upload-demo"
			
 
				+            :file-list="fileList"
			
 
				+            :action="baseURL + '/cms/security/video/upload/video'"
			
 
				+            :headers="{ token }"
			
 
				+            :before-upload="beforeFujian"
			
 
				+            :on-success="successFujian"
			
 
				+            :before-remove="beforeRemove"
			
 
				+            :on-remove="handleRemove"
			
 
				+            :limit="1"
			
 
				+            :on-exceed="handleExceed"
			
 
				+            :show-file-list="true"
			
 
				+          >
			
 
				+            <el-button size="small" type="primary">点击上传</el-button>
			
 
				+            <div class="el-upload__tip" slot="tip">
			
 
				+              <p class="upHint">格式要求：</p>
			
 
				+              <p class="upHint">1、仅支持.4dge格式的模型文件。</p>
			
 
				+              <p class="upHint">2、最大支持500M。</p>
			
 
				+            </div>
			
 
				+          </el-upload>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <!-- 底部按钮 -->
			
 
				+      <div class="con_btn">
			
 
				+        <el-button type="primary">保 存</el-button>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab1Add',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      radio: '1',
			
 
				+      fileList: [],
			
 
				+      // 服务器前缀地址
			
 
				+      baseURL: '',
			
 
				+      token: '',
			
 
				+      ruleForm: {
			
 
				+        id: '',
			
 
				+        name: '',
			
 
				+        thumb: '',
			
 
				+        video: '',
			
 
				+        fileName: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        name: [{ required: true, message: '不能为空', trigger: 'blur' }]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  methods: {
			
 
				+    // 点击返回
			
 
				+    goBack () {
			
 
				+      this.$confirm('点击返回后，编辑的信息将无法保存，是否继续？', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          this.$router.push('/layout/tab1')
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消')
			
 
				+        })
			
 
				+    },
			
 
				+    // 上传图片
			
 
				+    beforethumbUpload (file) {
			
 
				+      // console.log(998, file)
			
 
				+      // 限制图片大小和格式
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 5
			
 
				+      const typeOk =
			
 
				+        file.type === 'image/png' ||
			
 
				+        file.type === 'image/jpeg' ||
			
 
				+        file.type === 'image/gif'
			
 
				+
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (!typeOk) {
			
 
				+          this.$message.error('照片格式有误！')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('照片大小超过5M！')
			
 
				+          reject(file)
			
 
				+        } else if (file.name.length > 32) {
			
 
				+          this.$message.error('照片名字不能超过32个字！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          this.$message.success('上传成功')
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    upload_thumb_success (data) {
			
 
				+      // console.log('图片上传成功', data.data.urlPath)
			
 
				+      this.ruleForm.thumb = data.data.urlPath
			
 
				+    },
			
 
				+    // 上传附件
			
 
				+    beforeFujian (file) {
			
 
				+      console.log('附件上传前', file)
			
 
				+      const sizeOk = file.size / 1024 / 1024 < 1024
			
 
				+      const typeOk =
			
 
				+        file.type === 'video/mp4' ||
			
 
				+        file.type === 'video/avi' ||
			
 
				+        file.type === 'video/quicktime' ||
			
 
				+        file.type === 'video/rm' ||
			
 
				+        (file.type === '' &&
			
 
				+          (file.name.includes('.flv') || file.name.includes('.rmvb'))) ||
			
 
				+        file.type === 'video/3gpp'
			
 
				+      return new Promise((resolve, reject) => {
			
 
				+        if (file.name.length > 32) {
			
 
				+          this.$message.error('视频名字不能超过32个字')
			
 
				+          reject(file)
			
 
				+        } else if (!sizeOk) {
			
 
				+          this.$message.error('视频大小超过1GB！')
			
 
				+          reject(file)
			
 
				+        } else if (!typeOk) {
			
 
				+          this.$message.error('视频格式有误！')
			
 
				+          reject(file)
			
 
				+        } else {
			
 
				+          resolve(file)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    successFujian (file) {
			
 
				+      console.log('上传附件成功', file)
			
 
				+      if (file.code === 0) {
			
 
				+        this.ruleForm.video = file.data.urlPath
			
 
				+        this.ruleForm.fileName = file.data.fileName
			
 
				+        this.$message.success('上传成功')
			
 
				+      } else if (file.code === -1) {
			
 
				+        this.$message.warning('上传失败，不支持的文件格式')
			
 
				+      }
			
 
				+    },
			
 
				+    beforeRemove (file, fileList) {
			
 
				+      if (file && file.status === 'success') {
			
 
				+        return this.$confirm(`确定移除 ${file.name}？`)
			
 
				+      }
			
 
				+    },
			
 
				+    handleRemove (file, fileList) {
			
 
				+      this.ruleForm.video = ''
			
 
				+      this.ruleForm.fileName = ''
			
 
				+    },
			
 
				+    handleExceed (files, fileList) {
			
 
				+      this.$message.warning('只能上传一个视频，请删除原视频后操作')
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab1Add {
			
 
				+  height: 100%;
			
 
				+  .conten {
			
 
				+    position: relative;
			
 
				+    /deep/.el-icon-plus {
			
 
				+      border: 1px dashed #ccc;
			
 
				+    }
			
 
				+    height: calc(100% - 32px);
			
 
				+    .con_top {
			
 
				+      margin-bottom: 12px;
			
 
				+      height: 40px;
			
 
				+      line-height: 40px;
			
 
				+      padding-left: 20px;
			
 
				+      background-color: #fbfbfb;
			
 
				+    }
			
 
				+    .biaoshi1::before {
			
 
				+      left: -120px;
			
 
				+    }
			
 
				+    .biaoshi2::before {
			
 
				+      top: -10px;
			
 
				+    }
			
 
				+    .avatar-uploader .el-upload {
			
 
				+      border-radius: 6px;
			
 
				+      cursor: pointer;
			
 
				+      position: relative;
			
 
				+      overflow: hidden;
			
 
				+    }
			
 
				+    .avatar-uploader .el-upload:hover {
			
 
				+      border-color: #3e5eb3;
			
 
				+    }
			
 
				+    .avatar-uploader-icon {
			
 
				+      font-size: 28px;
			
 
				+      color: #8c939d;
			
 
				+      width: 178px;
			
 
				+      height: 178px;
			
 
				+      line-height: 178px;
			
 
				+      text-align: center;
			
 
				+    }
			
 
				+    .con_btn {
			
 
				+      position: absolute;
			
 
				+      left: 50%;
			
 
				+      transform: translateX(-50%);
			
 
				+      bottom: 15px;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab2/edit1.vue
+++ b/houtai/src/views/tab2/edit1.vue
@@ -0,0 +1,229 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab2Edit1">
			
 
				+    <div class="top">{{myData.type}}</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="用电总量：" prop="1">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[1]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="今日用电总量：" prop="2">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[2]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="同比节能：" prop="3">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[3]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit"> % </span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab2')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { energySave } from '@/apis/tab2'
			
 
				+export default {
			
 
				+  name: 'tab2Edit1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    const validatePass2 = (rule, value, callback) => {
			
 
				+      if (value > 9999999999.99) {
			
 
				+        callback(new Error('不能超过9999999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        1: '', // 用电总量
			
 
				+        2: '', // 今日用电总量
			
 
				+        3: '' // 同比节能
			
 
				+      },
			
 
				+      rules: {
			
 
				+        1: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass2, trigger: 'blur' }
			
 
				+        ],
			
 
				+        2: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        3: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'detail'
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await energySave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab2')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    // console.log(998, this.myData)
			
 
				+    for (const k in this.myData.data) {
			
 
				+      this.ruleForm[k] = this.myData.data[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab2Edit1 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab2/edit2.vue
+++ b/houtai/src/views/tab2/edit2.vue
@@ -0,0 +1,340 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab2Edit2">
			
 
				+    <div class="top">{{myData.type}}</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="1月：" prop="1">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[1]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="2月：" prop="2">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[2]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="3月：" prop="3">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[3]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="4月：" prop="4">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[4]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="5月：" prop="5">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[5]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="6月：" prop="6">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[6]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="7月：" prop="7">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[7]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="8月：" prop="8">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[8]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="9月：" prop="9">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[9]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="10月：" prop="10">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[10]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="11月：" prop="11">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[11]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="12月：" prop="12">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm[12]"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">kwh</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab2')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { energySave } from '@/apis/tab2'
			
 
				+export default {
			
 
				+  name: 'tab2Edit2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        1: '',
			
 
				+        2: '',
			
 
				+        3: '',
			
 
				+        4: '',
			
 
				+        5: '',
			
 
				+        6: '',
			
 
				+        7: '',
			
 
				+        8: '',
			
 
				+        9: '',
			
 
				+        10: '',
			
 
				+        11: '',
			
 
				+        12: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        1: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        2: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        3: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        4: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        5: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        6: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        7: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        8: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        9: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        10: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        11: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        12: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      },
			
 
				+      typeSwitch: {
			
 
				+        '实时用电监控-当前值': 'current',
			
 
				+        '实时用电监控-近三年均值': 'yearAvg',
			
 
				+        '月度节能情况-同比增长': 'monthUp',
			
 
				+        '月度节能情况-均值': 'monthAvg'
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = this.typeSwitch[this.myData.type]
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await energySave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab2')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    // console.log(998, this.myData)
			
 
				+    for (const k in this.myData.data) {
			
 
				+      this.ruleForm[k] = this.myData.data[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab2Edit2 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    max-height: 600px;
			
 
				+    overflow-y: auto;
			
 
				+    margin-top: 30px;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+    /deep/.el-form-item__content{
			
 
				+      width: 500px;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab2/index.vue
+++ b/houtai/src/views/tab2/index.vue
@@ -0,0 +1,98 @@
 
				+<template>
			
 
				+<div class='tab2'>
			
 
				+  <div class="table">
			
 
				+    <el-table :data="tableData" border style="width: 100%">
			
 
				+        <el-table-column prop="id" label="序列" width="80"></el-table-column>
			
 
				+        <el-table-column prop="type" label="栏目类型" width="240"></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200"> </el-table-column>
			
 
				+        <el-table-column  label="操作" width="120">
			
 
				+          <template #default='{row}'>
			
 
				+              <el-button type="text" @click="edit(row)">修 改</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+    </el-table>
			
 
				+  </div>
			
 
				+</div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { energyList } from '@/apis/tab2'
			
 
				+export default {
			
 
				+  name: 'tab2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      from: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: ''
			
 
				+      },
			
 
				+      dictionaries: {
			
 
				+        detail: '能耗详情',
			
 
				+        current: '实时用电监控-当前值',
			
 
				+        yearAvg: '实时用电监控-近三年均值',
			
 
				+        monthUp: '月度节能情况-同比增长',
			
 
				+        monthAvg: '月度节能情况-均值'
			
 
				+      },
			
 
				+      tableData: []
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 封装获取列表方法
			
 
				+    async energyList (data) {
			
 
				+      const res = await energyList(data)
			
 
				+      // console.log(999, res)
			
 
				+      res.data.forEach(v => {
			
 
				+        const temp = {}
			
 
				+        temp.id = v.id
			
 
				+        temp.type = this.dictionaries[v.type]
			
 
				+        temp.data = JSON.parse(v.data)
			
 
				+        temp.time = v.userUpdateTime
			
 
				+        if (v.id === 1) {
			
 
				+          temp.conten = `用电总量：${temp.data[1]}kwh；同比节能：${temp.data[2]}kwh；今日用电量：${temp.data[3]}kwh`
			
 
				+        } else { temp.conten = `1月：${temp.data[1]}kwh；2月：${temp.data[2]}kwh；3月：${temp.data[3]}kwh；4月：${temp.data[4]}kwh；5月：${temp.data[5]}kwh；6月：${temp.data[6]}kwh；7月：${temp.data[7]}kwh；8月：${temp.data[8]}kwh；9月：${temp.data[9]}kwh；10月：${temp.data[10]}kwh；11月：${temp.data[11]}kwh；12月：${temp.data[12]}kwh` }
			
 
				+        this.tableData.push(temp)
			
 
				+      })
			
 
				+    },
			
 
				+    // 点击修改
			
 
				+    edit (val) {
			
 
				+      // console.log(999, val)
			
 
				+      let temp = ''
			
 
				+      if (val.id === 1) {
			
 
				+        temp = '/layout/tab2Edit1'
			
 
				+      } else temp = '/layout/tab2Edit2'
			
 
				+      this.$router.push({
			
 
				+        path: temp,
			
 
				+        query: val
			
 
				+      })
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    this.energyList(this.from)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+//@import url(); 引入公共css类
			
 
				+
			
 
				+</style>
			
--- a/houtai/src/views/tab3/edit1.vue
+++ b/houtai/src/views/tab3/edit1.vue
@@ -0,0 +1,256 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab3Edit1">
			
 
				+    <div class="top">安防设备</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="摄像头总数：" prop="total">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.total"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="运行中摄像头：" prop="alive">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.alive"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="正常摄像头：" prop="normal">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.normal"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="故障摄像头：" prop="error">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.error"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="室内摄像头：" prop="indoor">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.indoor"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="室外摄像头：" prop="outdoor">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.outdoor"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab3')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { securitySave } from '@/apis/tab3'
			
 
				+export default {
			
 
				+  name: 'tab3Edit1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        total: '',
			
 
				+        alive: '',
			
 
				+        normal: '',
			
 
				+        error: '',
			
 
				+        indoor: '',
			
 
				+        outdoor: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        total: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        alive: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        normal: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        error: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        indoor: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        outdoor: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'security'
			
 
				+        obj.id = 1
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await securitySave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab3')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    console.log(998, this.myData)
			
 
				+    this.ruleForm = this.myData
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab3Edit1 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab3/index.vue
+++ b/houtai/src/views/tab3/index.vue
@@ -0,0 +1,251 @@
 
				+<template>
			
 
				+  <div class="tab3">
			
 
				+    <div class="search">
			
 
				+      <div :class="{ active: topInd === 1 }" @click="topInd = 1">安防设备</div>
			
 
				+      <div :class="{ active: topInd === 2 }" @click="topInd = 2">监控画面</div>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table" v-show="topInd === 1">
			
 
				+      <el-table :data="tableData" border style="width: 100%">
			
 
				+        <el-table-column prop="id" label="序列" width="80"></el-table-column>
			
 
				+        <el-table-column
			
 
				+          prop="type"
			
 
				+          label="栏目类型"
			
 
				+          width="240"
			
 
				+        ></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200">
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="120">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row.data, row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table" v-show="topInd === 2">
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addVideo">新 增</el-button>
			
 
				+      </div>
			
 
				+      <el-table :data="tableData2" border style="width: 100%">
			
 
				+        <el-table-column label="序列" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (from2.pageNum - 1) * from2.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="name" label="视频名称"></el-table-column>
			
 
				+        <el-table-column label="视频封面">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-image
			
 
				+              style="height: 50px"
			
 
				+              :src="baseURL + row.thumb"
			
 
				+              :preview-src-list="srcList"
			
 
				+            >
			
 
				+            </el-image>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="视频文件">
			
 
				+          <template #default="{ row }">
			
 
				+            <a
			
 
				+              :href="baseURL + row.video"
			
 
				+              target="_blank"
			
 
				+              :download="baseURL + row.video"
			
 
				+              class="mydown"
			
 
				+              >下 载</a
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="200">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="editVideo(row.id)">修 改</el-button>
			
 
				+            <el-button type="text" @click="delVideo(row.id)" style="color:#b6242b;">删 除</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 新增弹窗 -->
			
 
				+    <Tab3Dialog :isShow.sync="isShow" @refresh="securityVideoList(from2)" ref="Tab3DialogRef"/>
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging" v-show="topInd === 2">
			
 
				+      <span class="zong">共 {{total}} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import axios from '@/utils/request'
			
 
				+import Tab3Dialog from '@/components/tab3Dialog.vue'
			
 
				+import { securityList, securityVideoList, videoRemove } from '@/apis/tab3'
			
 
				+export default {
			
 
				+  name: 'tab3',
			
 
				+  components: { Tab3Dialog },
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      srcList: [], // 查看大图的图片数组合集
			
 
				+      baseURL: '',
			
 
				+      isShow: false,
			
 
				+      topInd: 1,
			
 
				+      from: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: ''
			
 
				+      },
			
 
				+      from2: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: [],
			
 
				+      tableData2: []
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.from2.pageNum = val
			
 
				+      this.securityVideoList(this.from2)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.from2.pageNum = 1
			
 
				+      this.from2.pageSize = val
			
 
				+      this.securityVideoList(this.from2)
			
 
				+    },
			
 
				+    // 点击监控画面新增
			
 
				+    addVideo () {
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 点击安防设备修改
			
 
				+    edit (val, id) {
			
 
				+      this.$router.push({
			
 
				+        path: '/layout/tab3Edit1',
			
 
				+        query: { ...val, id }
			
 
				+      })
			
 
				+    },
			
 
				+    // 点击监控画面修改
			
 
				+    editVideo (id) {
			
 
				+      this.$refs.Tab3DialogRef.videoDetailById(id)
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 点击删除
			
 
				+    delVideo (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await videoRemove(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.securityVideoList(this.from2)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async securityList (data) {
			
 
				+      const res = await securityList(data)
			
 
				+      res.data.forEach((v) => {
			
 
				+        const temp = {}
			
 
				+        temp.id = v.id
			
 
				+        temp.type = '安防设备'
			
 
				+        temp.data = JSON.parse(v.data)
			
 
				+        temp.time = v.userUpdateTime
			
 
				+        temp.conten = `摄像头总数：${temp.data.total}个；运行中摄像头：${temp.data.alive}个；正常摄像头：${temp.data.normal}个；故障摄像头：${temp.data.error}个；室内摄像头：${temp.data.indoor}个；室外摄像头：${temp.data.outdoor}个；`
			
 
				+        this.tableData.push(temp)
			
 
				+      })
			
 
				+    },
			
 
				+    // 封装获取监控画面列表方法
			
 
				+    async securityVideoList (data) {
			
 
				+      this.srcList = []
			
 
				+      const res = await securityVideoList(data)
			
 
				+      this.total = res.data.total
			
 
				+      this.tableData2 = res.data.records
			
 
				+      this.tableData2.forEach((v) => {
			
 
				+        this.srcList.push(this.baseURL + v.thumb)
			
 
				+      })
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    this.securityList(this.from)
			
 
				+    this.securityVideoList(this.from2)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab3 {
			
 
				+
			
 
				+  /deep/.el-table__body-wrapper{
			
 
				+    max-height: 600px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .search {
			
 
				+    display: flex;
			
 
				+    font-size: 24px;
			
 
				+    margin-bottom: 30px;
			
 
				+    & > div {
			
 
				+      cursor: pointer;
			
 
				+      margin-right: 40px;
			
 
				+    }
			
 
				+    .active {
			
 
				+      font-weight: 700;
			
 
				+      border-bottom: 5px solid #1482b4;
			
 
				+      padding-bottom: 10px;
			
 
				+    }
			
 
				+  }
			
 
				+  .table {
			
 
				+    position: relative;
			
 
				+    .add {
			
 
				+      position: absolute;
			
 
				+      right: 0;
			
 
				+      top: -50px;
			
 
				+    }
			
 
				+  }
			
 
				+    .paging {
			
 
				+      width: auto;
			
 
				+      display: flex;
			
 
				+      position: absolute;
			
 
				+      bottom: 40px;
			
 
				+      right: 50px;
			
 
				+      .zong{
			
 
				+        margin-right: 20px;
			
 
				+        margin-top: 4px;
			
 
				+      }
			
 
				+    }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab4/edit1.vue
+++ b/houtai/src/views/tab4/edit1.vue
@@ -0,0 +1,234 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab4Edit1">
			
 
				+    <div class="top">设备统计</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="摄像头：" prop="camera">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.camera"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="巡逻车：" prop="cruiser">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.cruiser"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">辆</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="门禁锁：" prop="door">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.door"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">个</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="无人机：" prop="aerial">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.aerial"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">辆</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab4')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { lotSave } from '@/apis/tab4'
			
 
				+export default {
			
 
				+  name: 'tab4Edit1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        camera: '',
			
 
				+        cruiser: '',
			
 
				+        door: '',
			
 
				+        aerial: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        camera: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        cruiser: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        door: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        aerial: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'count'
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await lotSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab4')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    console.log(998, this.myData)
			
 
				+    for (const k in this.myData) {
			
 
				+      this.ruleForm[k] = this.myData[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4Edit1 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab4/edit2.vue
+++ b/houtai/src/views/tab4/edit2.vue
@@ -0,0 +1,282 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab4Edit2">
			
 
				+    <div class="top">设备情况</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="监控-启用：" prop="cameraStart">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.cameraStart"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">个</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="监控-停用：" prop="cameraStop">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.cameraStop"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">个</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="消防-启用：" prop="cruiserStart">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.cruiserStart"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">辆</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="消防-停用：" prop="cruiserStop">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.cruiserStop"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">辆</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="监测-启用：" prop="doorStart">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.doorStart"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">个</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="监测-停用：" prop="doorStop">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.doorStop"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">个</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="功能-启用：" prop="aerialStart">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.aerialStart"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">辆</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="功能-停用：" prop="aerialStop">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.aerialStop"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <!-- <span class="unit">辆</span> -->
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab4')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { lotSave } from '@/apis/tab4'
			
 
				+export default {
			
 
				+  name: 'tab4Edit2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        cameraStart: '',
			
 
				+        cameraStop: '',
			
 
				+        cruiserStart: '',
			
 
				+        cruiserStop: '',
			
 
				+        doorStart: '',
			
 
				+        doorStop: '',
			
 
				+        aerialStart: '',
			
 
				+        aerialStop: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        cameraStart: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        cameraStop: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        cruiserStart: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        cruiserStop: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        doorStart: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        doorStop: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        aerialStart: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        aerialStop: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'info'
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await lotSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab4')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    console.log(998, this.myData)
			
 
				+    for (const k in this.myData) {
			
 
				+      this.ruleForm[k] = this.myData[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4Edit2 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab4/index.vue
+++ b/houtai/src/views/tab4/index.vue
@@ -0,0 +1,232 @@
 
				+<template>
			
 
				+  <div class="tab4">
			
 
				+    <div class="search">
			
 
				+      <div :class="{ active: topInd === 1 }" @click="topInd = 1">物联网设备</div>
			
 
				+      <div :class="{ active: topInd === 2 }" @click="topInd = 2">今日报警</div>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table" v-show="topInd === 1">
			
 
				+      <el-table :data="tableData" border style="width: 100%">
			
 
				+        <el-table-column prop="id" label="序列" width="80"></el-table-column>
			
 
				+        <el-table-column
			
 
				+          prop="type"
			
 
				+          label="栏目类型"
			
 
				+          width="240"
			
 
				+        ></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200">
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="120">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row.data, row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table" v-show="topInd === 2">
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addVideo">新 增</el-button>
			
 
				+      </div>
			
 
				+      <el-table :data="tableData2" border style="width: 100%">
			
 
				+        <el-table-column label="序列" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (from2.pageNum - 1) * from2.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="name" label="报警设备"></el-table-column>
			
 
				+        <el-table-column prop="location" label="设备位置"></el-table-column>
			
 
				+        <el-table-column prop="userCreateTime" label="报警时间"></el-table-column>
			
 
				+        <el-table-column prop="userUpdateTime" label="更新时间"></el-table-column>
			
 
				+        <el-table-column label="操作" width="220">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="editVideo(row.id)">修 改</el-button>
			
 
				+            <el-button type="text" @click="delAlarm(row.id)" style="color:#b6242b;">删 除</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 新增弹窗 -->
			
 
				+    <Tab4Dialog :isShow.sync="isShow" @refresh="securityVideoList(from2)" ref="Tab4DialogRef"/>
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging" v-show="topInd === 2">
			
 
				+      <span class="zong">共 {{total}} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import Tab4Dialog from '@/components/tab4Dialog.vue'
			
 
				+import { securityList, securityVideoList, alarmRemove } from '@/apis/tab4'
			
 
				+export default {
			
 
				+  name: 'tab4',
			
 
				+  components: { Tab4Dialog },
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      isShow: false,
			
 
				+      topInd: 1,
			
 
				+      from: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: ''
			
 
				+      },
			
 
				+      from2: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: [],
			
 
				+      tableData2: []
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.from2.pageNum = val
			
 
				+      this.securityVideoList(this.from2)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.from2.pageNum = 1
			
 
				+      this.from2.pageSize = val
			
 
				+      this.securityVideoList(this.from2)
			
 
				+    },
			
 
				+    // 点击监控画面新增
			
 
				+    addVideo () {
			
 
				+      this.isShow = true
			
 
				+      this.$refs.Tab4DialogRef.getCurrentTime()
			
 
				+    },
			
 
				+    // 点击安防设备修改
			
 
				+    edit (val, id) {
			
 
				+      let temp = ''
			
 
				+      if (id === 1) temp = '/layout/tab4Edit1'
			
 
				+      else temp = '/layout/tab4Edit2'
			
 
				+      this.$router.push({
			
 
				+        path: temp,
			
 
				+        query: { ...val, id }
			
 
				+      })
			
 
				+    },
			
 
				+    // 点击监控画面修改
			
 
				+    editVideo (id) {
			
 
				+      this.$refs.Tab4DialogRef.videoDetailById(id)
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 点击删除
			
 
				+    delAlarm (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await alarmRemove(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.securityVideoList(this.from2)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async securityList (data) {
			
 
				+      const res = await securityList(data)
			
 
				+      res.data.forEach((v) => {
			
 
				+        const temp = {}
			
 
				+        temp.id = v.id
			
 
				+        temp.data = JSON.parse(v.data)
			
 
				+        temp.time = v.userUpdateTime
			
 
				+        if (v.id === 1) {
			
 
				+          temp.type = '设备统计'
			
 
				+          temp.conten = `摄像头：${temp.data.camera}个；巡逻车：${temp.data.cruiser}辆；门禁锁：${temp.data.door}个；无人机：${temp.data.aerial}辆`
			
 
				+        } else {
			
 
				+          temp.type = '设备情况'
			
 
				+          temp.conten = `监控-启用：${temp.data.cameraStart}；监控-停用：${temp.data.cameraStop}；消防-启用：${temp.data.cruiserStart}；消防-停用：${temp.data.cruiserStop}；监测-启用：${temp.data.doorStart}；监测-停用：${temp.data.doorStop}；功能-启用：${temp.data.aerialStart}；功能-停用：${temp.data.aerialStop}`
			
 
				+        }
			
 
				+        this.tableData.push(temp)
			
 
				+      })
			
 
				+    },
			
 
				+    // 封装获取监控画面列表方法
			
 
				+    async securityVideoList (data) {
			
 
				+      const res = await securityVideoList(data)
			
 
				+      this.total = res.data.total
			
 
				+      this.tableData2 = res.data.records
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    this.securityList(this.from)
			
 
				+    this.securityVideoList(this.from2)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4 {
			
 
				+
			
 
				+  /deep/.el-table__body-wrapper{
			
 
				+    max-height: 600px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .search {
			
 
				+    display: flex;
			
 
				+    font-size: 24px;
			
 
				+    margin-bottom: 30px;
			
 
				+    & > div {
			
 
				+      cursor: pointer;
			
 
				+      margin-right: 40px;
			
 
				+    }
			
 
				+    .active {
			
 
				+      font-weight: 700;
			
 
				+      border-bottom: 5px solid #1482b4;
			
 
				+      padding-bottom: 10px;
			
 
				+    }
			
 
				+  }
			
 
				+  .table {
			
 
				+    position: relative;
			
 
				+    .add {
			
 
				+      position: absolute;
			
 
				+      right: 0;
			
 
				+      top: -50px;
			
 
				+    }
			
 
				+  }
			
 
				+    .paging {
			
 
				+      width: auto;
			
 
				+      display: flex;
			
 
				+      position: absolute;
			
 
				+      bottom: 40px;
			
 
				+      right: 50px;
			
 
				+      .zong{
			
 
				+        margin-right: 20px;
			
 
				+        margin-top: 4px;
			
 
				+      }
			
 
				+    }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab5/edit1.vue
+++ b/houtai/src/views/tab5/edit1.vue
@@ -0,0 +1,300 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab5Edit1">
			
 
				+    <div class="top">网点视频监控</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="温度：" prop="temp">
			
 
				+          <el-input
			
 
				+            style="width: 295px;margin-right:60px;"
			
 
				+            v-model.number="ruleForm.temp"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">°C</span>
			
 
				+          <!-- 下拉框 -->
			
 
				+          <el-select v-model="ruleForm.tempScope" placeholder="请选择状态">
			
 
				+            <el-option label="正常" value="正常"></el-option>
			
 
				+            <el-option label="偏低" value="偏低"></el-option>
			
 
				+            <el-option label="中等" value="中等"></el-option>
			
 
				+            <el-option label="超标" value="超标"></el-option>
			
 
				+          </el-select>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="湿度：" prop="humidity">
			
 
				+          <el-input
			
 
				+            style="width: 295px;margin-right:60px;"
			
 
				+            v-model.number="ruleForm.humidity"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">RH</span>
			
 
				+          <!-- 下拉框 -->
			
 
				+          <el-select v-model="ruleForm.humidityScope" placeholder="请选择状态">
			
 
				+            <el-option label="正常" value="正常"></el-option>
			
 
				+            <el-option label="偏低" value="偏低"></el-option>
			
 
				+            <el-option label="中等" value="中等"></el-option>
			
 
				+            <el-option label="超标" value="超标"></el-option>
			
 
				+          </el-select>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="PM2.5：" prop="pm25">
			
 
				+          <el-input
			
 
				+            style="width: 295px;margin-right:60px;"
			
 
				+            v-model.number="ruleForm.pm25"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">μg/m³</span>
			
 
				+          <!-- 下拉框 -->
			
 
				+          <el-select v-model="ruleForm.pm25Scope" placeholder="请选择状态">
			
 
				+            <el-option label="正常" value="正常"></el-option>
			
 
				+            <el-option label="偏低" value="偏低"></el-option>
			
 
				+            <el-option label="中等" value="中等"></el-option>
			
 
				+            <el-option label="超标" value="超标"></el-option>
			
 
				+          </el-select>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="PM10：" prop="pm10">
			
 
				+          <el-input v-model.number="ruleForm.pm10" type="number"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="噪音：" prop="noise">
			
 
				+          <el-input v-model.number="ruleForm.noise" type="number"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="风速：" prop="windSpeed">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.windSpeed"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="AIQ：" prop="aiq">
			
 
				+          <el-input v-model.number="ruleForm.aiq" type="number"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="TSP：" prop="tsp">
			
 
				+          <el-input v-model.number="ruleForm.tsp" type="number"></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab5')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { siteSave } from '@/apis/tab5'
			
 
				+export default {
			
 
				+  name: 'tab5Edit1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        temp: '',
			
 
				+        tempScope: '',
			
 
				+        humidity: '',
			
 
				+        humidityScope: '',
			
 
				+        pm25: '',
			
 
				+        pm25Scope: '',
			
 
				+        pm10: '',
			
 
				+        noise: '',
			
 
				+        windSpeed: '',
			
 
				+        aiq: '',
			
 
				+        tsp: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        temp: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        humidity: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        pm25: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        pm10: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        noise: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        windSpeed: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        aiq: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        tsp: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'info'
			
 
				+        obj.id = 1
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await siteSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab5')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    console.log(998, this.myData)
			
 
				+    this.ruleForm = this.myData
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-humidity缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab5Edit1 {
			
 
				+  /deep/.el-form-item__content {
			
 
				+    width: 655px;
			
 
				+  }
			
 
				+  .is-required{
			
 
				+    /deep/.el-input--suffix .el-input__inner{
			
 
				+      width: 300px;
			
 
				+    }
			
 
				+  }
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      width: 50px;
			
 
				+      text-align: center;
			
 
				+      position: absolute;
			
 
				+      right: 310px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab5/index.vue
+++ b/houtai/src/views/tab5/index.vue
@@ -0,0 +1,369 @@
 
				+<template>
			
 
				+  <div class="tab5">
			
 
				+    <div class="search">
			
 
				+      <div :class="{ active: topInd === 1 }" @click="topInd = 1">环境情况</div>
			
 
				+      <div :class="{ active: topInd === 2 }" @click="topInd = 2">监控画面</div>
			
 
				+      <div :class="{ active: topInd === 3 }" @click="topInd = 3">进度管理</div>
			
 
				+    </div>
			
 
				+    <!-- 表格1 -->
			
 
				+    <div class="table" v-show="topInd === 1">
			
 
				+      <el-table :data="tableData" border style="width: 100%">
			
 
				+        <el-table-column prop="id" label="序列" width="80"></el-table-column>
			
 
				+        <el-table-column
			
 
				+          prop="type"
			
 
				+          label="栏目类型"
			
 
				+          width="240"
			
 
				+        ></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200">
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="120">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row.data, row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格2 -->
			
 
				+    <div class="table" v-show="topInd === 2">
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addVideo">新 增</el-button>
			
 
				+      </div>
			
 
				+      <el-table :data="tableData2" border style="width: 100%">
			
 
				+        <el-table-column label="序列" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (from2.pageNum - 1) * from2.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="name" label="视频名称"></el-table-column>
			
 
				+        <el-table-column prop="lon" label="经度"></el-table-column>
			
 
				+        <el-table-column prop="lat" label="纬度"></el-table-column>
			
 
				+        <el-table-column label="视频封面" width="150">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-image
			
 
				+              style="height: 50px"
			
 
				+              :src="baseURL + row.thumb"
			
 
				+              :preview-src-list="srcList"
			
 
				+            >
			
 
				+            </el-image>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="视频文件" width="100">
			
 
				+          <template #default="{ row }">
			
 
				+            <a
			
 
				+              :href="baseURL + row.video"
			
 
				+              target="_blank"
			
 
				+              :download="baseURL + row.video"
			
 
				+              class="mydown"
			
 
				+              >下 载</a
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="200">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="editVideo(row.id)">修 改</el-button>
			
 
				+            <el-button type="text" @click="delTow(row.id)" style="color:#b6242b;">删 除</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格3 -->
			
 
				+    <div class="table" v-show="topInd === 3">
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addVideoThree">新 增</el-button>
			
 
				+      </div>
			
 
				+      <el-table :data="tableData3" border style="width: 100%">
			
 
				+        <el-table-column label="序列" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (from3.pageNum - 1) * from3.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="year" label="年份"></el-table-column>
			
 
				+        <el-table-column label="进度图片">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-image
			
 
				+              style="height: 50px"
			
 
				+              :src="baseURL + row.thumb"
			
 
				+              :preview-src-list="srcList3"
			
 
				+            >
			
 
				+            </el-image>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="200">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="editVideoThree(row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+            <el-button type="text" @click="delThree(row.id)" style="color:#b6242b;"
			
 
				+              >删 除</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 监控画面弹窗 -->
			
 
				+    <Tab5Dialog
			
 
				+      :isShow.sync="isShow"
			
 
				+      @refresh="siteVideoList(from2)"
			
 
				+      ref="Tab5DialogRef"
			
 
				+    />
			
 
				+    <!-- 进度管理弹窗 -->
			
 
				+    <Tab5DialogThree
			
 
				+      :isShow.sync="isShow3"
			
 
				+      @refresh="siteImgList(from3)"
			
 
				+      ref="Tab5DialogThreeRef"
			
 
				+    />
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging" v-show="topInd === 2">
			
 
				+      <span class="zong">共 {{ total }} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging" v-show="topInd === 3">
			
 
				+      <span class="zong">共 {{ total3 }} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total3"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from3.pageNum"
			
 
				+        @current-change="currentChange3"
			
 
				+        @size-change="sizeChange3"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import axios from '@/utils/request'
			
 
				+import Tab5Dialog from '@/components/tab5Dialog.vue'
			
 
				+import Tab5DialogThree from '@/components/Tab5DialogThree.vue'
			
 
				+import { siteList, siteVideoList, siteImgList, videoRemove, imgRemove } from '@/apis/tab5'
			
 
				+export default {
			
 
				+  name: 'tab5',
			
 
				+  components: { Tab5Dialog, Tab5DialogThree },
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      total3: 0,
			
 
				+      srcList: [], // 查看大图的图片数组合集
			
 
				+      srcList3: [], // 查看大图的图片数组合集
			
 
				+      baseURL: '',
			
 
				+      isShow: false,
			
 
				+      isShow3: false,
			
 
				+      topInd: 1,
			
 
				+      from: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: ''
			
 
				+      },
			
 
				+      from2: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      from3: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: [],
			
 
				+      tableData2: [],
			
 
				+      tableData3: []
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // ----------------------进度管理-----------------------------
			
 
				+    addVideoThree () {
			
 
				+      this.isShow3 = true
			
 
				+    },
			
 
				+    editVideoThree (id) {
			
 
				+      this.$refs.Tab5DialogThreeRef.videoDetailById3(id)
			
 
				+      this.isShow3 = true
			
 
				+    },
			
 
				+    delThree (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await imgRemove(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.siteImgList(this.from3)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 分页器方法
			
 
				+    currentChange3 (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.from3.pageNum = val
			
 
				+      this.siteImgList(this.from3)
			
 
				+    },
			
 
				+    sizeChange3 (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.from3.pageNum = 1
			
 
				+      this.from3.pageSize = val
			
 
				+      this.siteImgList(this.from3)
			
 
				+    },
			
 
				+    // ----------------------进度管理-----------------------------
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.from2.pageNum = val
			
 
				+      this.siteVideoList(this.from2)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.from2.pageNum = 1
			
 
				+      this.from2.pageSize = val
			
 
				+      this.siteVideoList(this.from2)
			
 
				+    },
			
 
				+    // 点击监控画面新增
			
 
				+    addVideo () {
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 点击安防设备修改
			
 
				+    edit (val, id) {
			
 
				+      this.$router.push({
			
 
				+        path: '/layout/tab5Edit1',
			
 
				+        query: { ...val, id }
			
 
				+      })
			
 
				+    },
			
 
				+    // 监控画面删除
			
 
				+    delTow (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await videoRemove(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.siteVideoList(this.from2)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 点击监控画面修改
			
 
				+    editVideo (id) {
			
 
				+      this.$refs.Tab5DialogRef.videoDetailById(id)
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async siteList (data) {
			
 
				+      const res = await siteList(data)
			
 
				+      res.data.forEach((v) => {
			
 
				+        const temp = {}
			
 
				+        temp.id = v.id
			
 
				+        temp.type = '环境情况'
			
 
				+        temp.data = JSON.parse(v.data)
			
 
				+        temp.time = v.userUpdateTime
			
 
				+        temp.conten = `温度：${temp.data.temp}℃--${temp.data.tempScope}；湿度：${temp.data.humidity}RH--${temp.data.humidityScope}；PM2.5：${temp.data.pm25}μg/m³--${temp.data.pm25Scope}；PM10：${temp.data.pm10}；噪音：${temp.data.noise}；风速：${temp.data.windSpeed}；AIQ：${temp.data.aiq}；TSP：${temp.data.tsp}`
			
 
				+        this.tableData.push(temp)
			
 
				+      })
			
 
				+    },
			
 
				+    // 封装获取监控画面列表方法
			
 
				+    async siteVideoList (data) {
			
 
				+      this.srcList = []
			
 
				+      const res = await siteVideoList(data)
			
 
				+      this.total = res.data.total
			
 
				+      this.tableData2 = res.data.records
			
 
				+      this.tableData2.forEach((v) => {
			
 
				+        this.srcList.push(this.baseURL + v.thumb)
			
 
				+      })
			
 
				+      // console.log(998, res)
			
 
				+    },
			
 
				+    // 封装获取进度管理列表方法
			
 
				+    async siteImgList (data) {
			
 
				+      this.srcList = []
			
 
				+      const res = await siteImgList(data)
			
 
				+      this.total3 = res.data.total
			
 
				+      this.tableData3 = res.data.records
			
 
				+      this.tableData3.forEach((v) => {
			
 
				+        this.srcList3.push(this.baseURL + v.thumb)
			
 
				+      })
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    this.siteList(this.from)
			
 
				+    this.siteVideoList(this.from2)
			
 
				+    this.siteImgList(this.from3)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab5 {
			
 
				+
			
 
				+  /deep/.el-table__body-wrapper {
			
 
				+    max-height: 600px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .search {
			
 
				+    display: flex;
			
 
				+    font-size: 24px;
			
 
				+    margin-bottom: 30px;
			
 
				+    & > div {
			
 
				+      cursor: pointer;
			
 
				+      margin-right: 40px;
			
 
				+    }
			
 
				+    .active {
			
 
				+      font-weight: 700;
			
 
				+      border-bottom: 5px solid #1482b4;
			
 
				+      padding-bottom: 10px;
			
 
				+    }
			
 
				+  }
			
 
				+  .table {
			
 
				+    position: relative;
			
 
				+    .add {
			
 
				+      position: absolute;
			
 
				+      right: 0;
			
 
				+      top: -50px;
			
 
				+    }
			
 
				+  }
			
 
				+  .paging {
			
 
				+    width: auto;
			
 
				+    display: flex;
			
 
				+    position: absolute;
			
 
				+    bottom: 40px;
			
 
				+    right: 50px;
			
 
				+    .zong {
			
 
				+      margin-right: 20px;
			
 
				+      margin-top: 4px;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab6/edit1.vue
+++ b/houtai/src/views/tab6/edit1.vue
@@ -0,0 +1,222 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab6Edit1">
			
 
				+    <div class="top">无人机监控</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="130px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="巡检次数：" prop="check">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.check"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="拍照次数：" prop="photo">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.photo"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="录像次数：" prop="video">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.video"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab6')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { aerialSave } from '@/apis/tab6'
			
 
				+export default {
			
 
				+  name: 'tab6Edit1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        check: '',
			
 
				+        photo: '',
			
 
				+        video: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        check: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        photo: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        video: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'count'
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await aerialSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push('/layout/tab6')
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    // console.log(998, this.myData)
			
 
				+    for (const k in this.myData) {
			
 
				+      this.ruleForm[k] = this.myData[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab6Edit1 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab6/edit2.vue
+++ b/houtai/src/views/tab6/edit2.vue
@@ -0,0 +1,225 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab6Edit2">
			
 
				+    <div class="top">巡检管理</div>
			
 
				+    <div class="from">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="140px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="可视化监拍设备：" prop="visualAerial">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.visualAerial"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="跨视频监控：" prop="crossAerial">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.crossAerial"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="螺旋式无人机：" prop="spiralAerial">
			
 
				+          <el-input
			
 
				+            v-model.number="ruleForm.spiralAerial"
			
 
				+            type="number"
			
 
				+          ></el-input>
			
 
				+          <span class="unit">次</span>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="更新时间：">
			
 
				+          <i class="biaoshi"></i>
			
 
				+          <el-date-picker
			
 
				+            v-model="time"
			
 
				+            type="datetime"
			
 
				+            placeholder="选择日期时间"
			
 
				+            align="right"
			
 
				+            :picker-options="pickerOptions"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab6')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { aerialSave } from '@/apis/tab6'
			
 
				+export default {
			
 
				+  name: 'tab6Edit2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    const validatePass = (rule, value, callback) => {
			
 
				+      if (value > 99999999.99) {
			
 
				+        callback(new Error('不能超过99999999.99'))
			
 
				+      } else {
			
 
				+        callback()
			
 
				+      }
			
 
				+    }
			
 
				+    return {
			
 
				+      pickerOptions: {
			
 
				+        shortcuts: [
			
 
				+          {
			
 
				+            text: '今天',
			
 
				+            onClick (picker) {
			
 
				+              picker.$emit('pick', new Date())
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '昨天',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          },
			
 
				+          {
			
 
				+            text: '一周前',
			
 
				+            onClick (picker) {
			
 
				+              const date = new Date()
			
 
				+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
			
 
				+              picker.$emit('pick', date)
			
 
				+            }
			
 
				+          }
			
 
				+        ]
			
 
				+      },
			
 
				+      disTime: '',
			
 
				+      time: '',
			
 
				+      myData: {},
			
 
				+      ruleForm: {
			
 
				+        visualAerial: '',
			
 
				+        crossAerial: '',
			
 
				+        spiralAerial: ''
			
 
				+      },
			
 
				+      rules: {
			
 
				+        visualAerial: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        crossAerial: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ],
			
 
				+        spiralAerial: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          { validator: validatePass, trigger: 'blur' }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      const temp = this.moment(val).format('YYYY-MM-DD HH:mm:ss')
			
 
				+      this.disTime = temp
			
 
				+    }
			
 
				+  },
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击提交
			
 
				+    async btnOk () {
			
 
				+      if (this.time === null) return this.$message.warning('时间不能为空!')
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const obj = {}
			
 
				+        obj.type = 'patrol'
			
 
				+        obj.id = Number(this.myData.id)
			
 
				+        obj.data = JSON.stringify(this.ruleForm)
			
 
				+        obj.userUpdateTime = this.disTime
			
 
				+        const res = await aerialSave(obj)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('修改成功')
			
 
				+          this.$router.push({
			
 
				+            path: '/layout/tab6',
			
 
				+            query: { num: 3 }
			
 
				+          })
			
 
				+        }
			
 
				+        // console.log(999, res)
			
 
				+        // console.log(777777777777, obj)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    },
			
 
				+    getCurrentTime () {
			
 
				+      // 获取当前时间并打印
			
 
				+      var _this = this
			
 
				+      const yy = new Date().getFullYear()
			
 
				+      const mm = new Date().getMonth() + 1
			
 
				+      const dd = new Date().getDate()
			
 
				+      const hh = new Date().getHours()
			
 
				+      const mf =
			
 
				+        new Date().getMinutes() < 10
			
 
				+          ? '0' + new Date().getMinutes()
			
 
				+          : new Date().getMinutes()
			
 
				+      const ss =
			
 
				+        new Date().getSeconds() < 10
			
 
				+          ? '0' + new Date().getSeconds()
			
 
				+          : new Date().getSeconds()
			
 
				+      _this.gettime = yy + '/' + mm + '/' + dd + ' ' + hh + ':' + mf + ':' + ss
			
 
				+      this.time = _this.gettime
			
 
				+      // console.log(_this.gettime)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  async created () {
			
 
				+    this.myData = this.$route.query
			
 
				+    // console.log(998, this.myData)
			
 
				+    for (const k in this.myData) {
			
 
				+      this.ruleForm[k] = this.myData[k]
			
 
				+    }
			
 
				+    this.getCurrentTime()
			
 
				+    // console.log(999, this.$route.query)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab6Edit2 {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .from {
			
 
				+    margin-top: 30px;
			
 
				+    width: 50%;
			
 
				+    .unit {
			
 
				+      position: absolute;
			
 
				+      right: -40px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab6/index.vue
+++ b/houtai/src/views/tab6/index.vue
@@ -0,0 +1,288 @@
 
				+<template>
			
 
				+  <div class="tab6">
			
 
				+    <div class="search">
			
 
				+      <div :class="{ active: topInd === 1 }" @click="topInd = 1">无人机监控</div>
			
 
				+      <div :class="{ active: topInd === 2 }" @click="topInd = 2">无人机监控图</div>
			
 
				+      <div :class="{ active: topInd === 3 }" @click="topInd = 3">巡检管理</div>
			
 
				+    </div>
			
 
				+    <!-- 表格1 -->
			
 
				+    <div class="table" v-show="topInd === 1">
			
 
				+      <el-table :data="tableData" border style="width: 100%">
			
 
				+        <el-table-column prop="id" label="序列" width="80"></el-table-column>
			
 
				+        <el-table-column
			
 
				+          prop="type"
			
 
				+          label="栏目类型"
			
 
				+          width="240"
			
 
				+        ></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200">
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="120">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row.data, row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格2 -->
			
 
				+    <div class="table" v-show="topInd === 2">
			
 
				+      <div class="add">
			
 
				+        <el-button type="primary" @click="addVideo">新 增</el-button>
			
 
				+      </div>
			
 
				+      <el-table :data="tableData2" border style="width: 100%">
			
 
				+        <el-table-column label="序列" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (from2.pageNum - 1) * from2.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="year" label="年份"></el-table-column>
			
 
				+        <el-table-column label="图片">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-image
			
 
				+              style="height: 50px"
			
 
				+              :src="baseURL + row.thumb"
			
 
				+              :preview-src-list="srcList"
			
 
				+            >
			
 
				+            </el-image>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="userUpdateTime" label="更新时间"></el-table-column>
			
 
				+
			
 
				+        <el-table-column label="操作" width="200">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="editVideo(row.id)">修 改</el-button>
			
 
				+            <el-button type="text" @click="delTow(row.id)" style="color:#b6242b;">删 除</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 表格3 -->
			
 
				+    <div class="table" v-show="topInd === 3">
			
 
				+      <el-table :data="tableData3" border style="width: 100%">
			
 
				+        <el-table-column  label="序列" width="80">
			
 
				+          <template #default>1</template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column
			
 
				+          prop="type"
			
 
				+          label="栏目类型"
			
 
				+          width="240"
			
 
				+        ></el-table-column>
			
 
				+        <el-table-column prop="conten" label="数据字段"></el-table-column>
			
 
				+        <el-table-column prop="time" label="更新时间" width="200">
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="120">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row.data, row.id)"
			
 
				+              >修 改</el-button
			
 
				+            >
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 监控画面弹窗 -->
			
 
				+    <Tab6Dialog
			
 
				+      :isShow.sync="isShow"
			
 
				+      @refresh="imgList(from2)"
			
 
				+      ref="Tab6DialogRef"
			
 
				+    />
			
 
				+
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging" v-show="topInd === 2">
			
 
				+      <span class="zong">共 {{ total }} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import axios from '@/utils/request'
			
 
				+import Tab6Dialog from '@/components/tab6Dialog.vue'
			
 
				+import { aerialList, imgList, imgRemove } from '@/apis/tab6'
			
 
				+export default {
			
 
				+  name: 'tab6',
			
 
				+  components: { Tab6Dialog },
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      srcList: [], // 查看大图的图片数组合集
			
 
				+      baseURL: '',
			
 
				+      isShow: false,
			
 
				+      topInd: 1,
			
 
				+      from: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 9999,
			
 
				+        searchKey: '',
			
 
				+        type: ''
			
 
				+      },
			
 
				+      from2: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: [],
			
 
				+      tableData2: [],
			
 
				+      tableData3: []
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.from2.pageNum = val
			
 
				+      this.imgList(this.from2)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.from2.pageNum = 1
			
 
				+      this.from2.pageSize = val
			
 
				+      this.imgList(this.from2)
			
 
				+    },
			
 
				+    // 点击监控画面新增
			
 
				+    addVideo () {
			
 
				+      this.isShow = true
			
 
				+      this.$refs.Tab6DialogRef.getCurrentTime()
			
 
				+    },
			
 
				+    // 点击安防设备修改
			
 
				+    edit (val, id) {
			
 
				+      let temp = ''
			
 
				+      if (id === 1) temp = '/layout/tab6Edit1'
			
 
				+      else temp = '/layout/tab6Edit2'
			
 
				+      this.$router.push({
			
 
				+        path: temp,
			
 
				+        query: { ...val, id }
			
 
				+      })
			
 
				+    },
			
 
				+    // 监控画面删除
			
 
				+    delTow (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await imgRemove(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.imgList(this.from2)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 点击监控画面修改
			
 
				+    editVideo (id) {
			
 
				+      this.$refs.Tab6DialogRef.imgDetailById(id)
			
 
				+      this.isShow = true
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async aerialList (data) {
			
 
				+      const res = await aerialList(data)
			
 
				+      res.data.forEach((v) => {
			
 
				+        const temp = {}
			
 
				+        temp.id = v.id
			
 
				+        temp.data = JSON.parse(v.data)
			
 
				+        temp.time = v.userUpdateTime
			
 
				+        if (v.id === 1) {
			
 
				+          temp.type = '无人机监控'
			
 
				+          temp.conten = `巡检次数：${temp.data.check}次；拍照次数：${temp.data.photo}次；录像次数：${temp.data.video}次`
			
 
				+          this.tableData.push(temp)
			
 
				+        } else {
			
 
				+          temp.type = '巡检管理'
			
 
				+          temp.conten = `可视化监拍设备：${temp.data.visualAerial}次；跨视频监控：${temp.data.crossAerial}次；螺旋式无人机：${temp.data.spiralAerial}次`
			
 
				+          this.tableData3.push(temp)
			
 
				+        }
			
 
				+      })
			
 
				+    },
			
 
				+    // 封装获取监控画面列表方法
			
 
				+    async imgList (data) {
			
 
				+      this.srcList = []
			
 
				+      const res = await imgList(data)
			
 
				+      this.total = res.data.total
			
 
				+      this.tableData2 = res.data.records
			
 
				+      this.tableData2.forEach((v) => {
			
 
				+        this.srcList.push(this.baseURL + v.thumb)
			
 
				+      })
			
 
				+      // console.log(998, res)
			
 
				+    }
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 判断是不是从edit3跳过来的
			
 
				+    const temp = this.$route.query.num
			
 
				+    if (temp) { this.topInd = Number(temp) }
			
 
				+
			
 
				+    // 获取服务器前缀地址
			
 
				+    this.baseURL = axios.defaults.baseURL
			
 
				+    this.aerialList(this.from)
			
 
				+    this.imgList(this.from2)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab6 {
			
 
				+
			
 
				+  /deep/.el-table__body-wrapper {
			
 
				+    max-height: 600px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .search {
			
 
				+    display: flex;
			
 
				+    font-size: 24px;
			
 
				+    margin-bottom: 30px;
			
 
				+    & > div {
			
 
				+      cursor: pointer;
			
 
				+      margin-right: 40px;
			
 
				+    }
			
 
				+    .active {
			
 
				+      font-weight: 700;
			
 
				+      border-bottom: 5px solid #1482b4;
			
 
				+      padding-bottom: 10px;
			
 
				+    }
			
 
				+  }
			
 
				+  .table {
			
 
				+    position: relative;
			
 
				+    .add {
			
 
				+      position: absolute;
			
 
				+      right: 0;
			
 
				+      top: -50px;
			
 
				+    }
			
 
				+  }
			
 
				+  .paging {
			
 
				+    width: auto;
			
 
				+    display: flex;
			
 
				+    position: absolute;
			
 
				+    bottom: 40px;
			
 
				+    right: 50px;
			
 
				+    .zong {
			
 
				+      margin-right: 20px;
			
 
				+      margin-top: 4px;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab7/edit.vue
+++ b/houtai/src/views/tab7/edit.vue
@@ -0,0 +1,153 @@
 
				+<template>
			
 
				+  <div class="tab7Edit">
			
 
				+    <div class="top">{{ruleForm.id?'编辑用户':'新增用户'}}</div>
			
 
				+    <div class="con">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        :rules="rules"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="用户账号：" prop="userName">
			
 
				+          <el-input
			
 
				+            :disabled='!!ruleForm.id'
			
 
				+            v-model="ruleForm.userName"
			
 
				+            placeholder="仅能输入数字、字母"
			
 
				+            maxlength="10"
			
 
				+            show-word-limit
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="联系电话：" prop="phone">
			
 
				+          <el-input
			
 
				+            v-model="ruleForm.phone"
			
 
				+            placeholder="请输入电话"
			
 
				+          ></el-input>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="性别：">
			
 
				+          <el-radio v-model="ruleForm.sex" :label="0">男</el-radio>
			
 
				+          <el-radio v-model="ruleForm.sex" :label="1">女</el-radio>
			
 
				+        </el-form-item>
			
 
				+        <el-form-item label="是否启用：">
			
 
				+          <el-switch
			
 
				+            v-model="ruleForm.isEnabled"
			
 
				+            :active-value='1'
			
 
				+            :inactive-value="0"
			
 
				+          >
			
 
				+          </el-switch>
			
 
				+        </el-form-item>
			
 
				+        <span class="tip">*默认密码123456</span>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 下面的按钮 -->
			
 
				+    <div class="btn">
			
 
				+      <el-button @click="$router.push('/layout/tab7')">返 回</el-button>
			
 
				+      <el-button type="primary" @click="btnOk">提 交</el-button>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { userSave } from '@/apis/tab7'
			
 
				+export default {
			
 
				+  // import引入的组件需要注入到对象中才能使用
			
 
				+  name: 'tab7Edit',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      ruleForm: {
			
 
				+        userName: '',
			
 
				+        phone: '',
			
 
				+        sex: 0,
			
 
				+        isEnabled: 1
			
 
				+      },
			
 
				+      rules: {
			
 
				+        userName: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          {
			
 
				+            pattern: /^[0-9a-zA-Z_]*$/,
			
 
				+            message: '仅能输入数字、字母',
			
 
				+            trigger: 'blur'
			
 
				+          }
			
 
				+        ],
			
 
				+        phone: [
			
 
				+          { required: true, message: '不能为空', trigger: 'blur' },
			
 
				+          {
			
 
				+            pattern: /^1[3-9]\d{9}$/,
			
 
				+            message: '请输入合法手机号',
			
 
				+            trigger: 'blur'
			
 
				+          }
			
 
				+        ]
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    async btnOk () {
			
 
				+      try {
			
 
				+        await this.$refs.ruleForm.validate()
			
 
				+        const res = await userSave(this.ruleForm)
			
 
				+        if (res.code === 0) {
			
 
				+          this.$message.success('操作成功')
			
 
				+          this.$router.push('/layout/tab7')
			
 
				+        } else this.$message.warning(res.msg)
			
 
				+      } catch (error) {
			
 
				+        console.log(error)
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    // 编辑的情况下
			
 
				+    if (this.$route.query.id) {
			
 
				+      this.ruleForm = this.$route.query
			
 
				+      this.ruleForm.sex = Number(this.ruleForm.sex)
			
 
				+      this.ruleForm.isEnabled = Number(this.ruleForm.isEnabled)
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab7Edit {
			
 
				+  height: 100%;
			
 
				+  position: relative;
			
 
				+  .top {
			
 
				+    height: 40px;
			
 
				+    line-height: 40px;
			
 
				+    background-color: #fbfbfb;
			
 
				+    padding-left: 20px;
			
 
				+  }
			
 
				+  .con {
			
 
				+    margin-top: 40px;
			
 
				+    width: 600px;
			
 
				+    .tip{
			
 
				+      color: #F56C6C;
			
 
				+      font-size: 14px;
			
 
				+      margin-left: 12px;
			
 
				+    }
			
 
				+  }
			
 
				+    .btn {
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    width: 200px;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 30px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/houtai/src/views/tab7/index.vue
+++ b/houtai/src/views/tab7/index.vue
@@ -0,0 +1,252 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab7">
			
 
				+    <div class="top">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="注册时间：">
			
 
				+          <el-date-picker
			
 
				+            style="width: 300px"
			
 
				+            v-model="time"
			
 
				+            type="daterange"
			
 
				+            range-separator="-"
			
 
				+            start-placeholder="开始日期"
			
 
				+            end-placeholder="结束日期"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+          <span class="userName">用户账号：</span>
			
 
				+          <el-input
			
 
				+            placeholder="请输入"
			
 
				+            v-model="ruleForm.searchKey"
			
 
				+            style="width: 300px; margin-right: 50px"
			
 
				+          ></el-input>
			
 
				+          <el-button @click="inquire">查 询</el-button>
			
 
				+          <el-button @click="reset">重 置</el-button>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+      <div class="addUser">
			
 
				+        <el-button type="primary" @click="$router.push('/layout/tab7Edit')"
			
 
				+          >新 增</el-button
			
 
				+        >
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table">
			
 
				+      <el-table :data="tableData" style="width: 100%">
			
 
				+        <el-table-column label="序号" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (ruleForm.pageNum - 1) * ruleForm.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="userName" label="用户账号"> </el-table-column>
			
 
				+        <el-table-column prop="phone" label="联系电话"> </el-table-column>
			
 
				+        <el-table-column prop="sexTxt" label="性别"> </el-table-column>
			
 
				+        <el-table-column prop="createTime" label="注册时间"> </el-table-column>
			
 
				+        <el-table-column label="启用状态">
			
 
				+          <template slot-scope="scope">
			
 
				+            <el-switch :disabled='scope.row.id===1' @change='change($event,scope.row.id)' v-model="tableData[scope.$index].isEnabled" :active-value='1' :inactive-value="0"></el-switch>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column label="操作" width="230">
			
 
				+          <template #default="{ row }">
			
 
				+            <el-button type="text" @click="edit(row)" v-if="row.id!==1">编 辑</el-button>
			
 
				+            <el-button type="text" style="color: #b6242b" @click="delUser(row.id)"  v-if="row.id!==1">删 除</el-button>
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging">
			
 
				+      <span class="zong">共 {{ total }} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="ruleForm.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { userList, userEditStatus, userRemoves } from '@/apis/tab7'
			
 
				+export default {
			
 
				+  name: 'tab7',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      time: '',
			
 
				+      ruleForm: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        startTime: '',
			
 
				+        endTime: '',
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: []
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      this.handleSelect(val)
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    // 点击编辑
			
 
				+    edit (val) {
			
 
				+      this.$router.push({
			
 
				+        path: '/layout/tab7Edit',
			
 
				+        query: val
			
 
				+      })
			
 
				+    },
			
 
				+    // 点击删除
			
 
				+    delUser (id) {
			
 
				+      this.$confirm('确定删除吗?', '提示', {
			
 
				+        confirmButtonText: '确定',
			
 
				+        cancelButtonText: '取消',
			
 
				+        type: 'warning'
			
 
				+      })
			
 
				+        .then(async () => {
			
 
				+          await userRemoves(id)
			
 
				+          this.$message.success('删除成功!')
			
 
				+          this.userList(this.ruleForm)
			
 
				+        })
			
 
				+        .catch(() => {
			
 
				+          this.$message.info('已取消删除')
			
 
				+        })
			
 
				+    },
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.ruleForm.pageNum = val
			
 
				+      this.userList(this.ruleForm)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.ruleForm.pageNum = 1
			
 
				+      this.ruleForm.pageSize = val
			
 
				+      this.userList(this.ruleForm)
			
 
				+    },
			
 
				+    // 点击查询
			
 
				+    inquire () {
			
 
				+      this.ruleForm.pageNum = 1
			
 
				+      this.userList(this.ruleForm)
			
 
				+    },
			
 
				+    // 点击重置
			
 
				+    reset () {
			
 
				+      this.ruleForm = {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      }
			
 
				+      this.time = ''
			
 
				+      this.userList(this.ruleForm)
			
 
				+    },
			
 
				+    // 点击启用-停用账户
			
 
				+    async change (val, id) {
			
 
				+      const res = await userEditStatus(id, val)
			
 
				+      if (res.code === 0) {
			
 
				+        this.$message.success('操作成功')
			
 
				+        this.userList(this.ruleForm)
			
 
				+      } else this.$message.warning(res.msg)
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async userList (data) {
			
 
				+      const res = await userList(data)
			
 
				+      this.tableData = res.data.records
			
 
				+      this.total = res.data.total
			
 
				+      this.tableData.forEach((v) => {
			
 
				+        if (v.sex === 0) v.sexTxt = '男'
			
 
				+        else if (v.sex === 1) v.sexTxt = '女'
			
 
				+      })
			
 
				+      // console.log(998, res.data.records)
			
 
				+    },
			
 
				+    // 时间处理----------------
			
 
				+    handleSelect (e) {
			
 
				+      const date = []
			
 
				+      for (const i in e) {
			
 
				+        date.push(this.gettime(e[i]))
			
 
				+      }
			
 
				+      this.ruleForm.startTime = date[0]
			
 
				+      if (date[1]) {
			
 
				+        this.ruleForm.endTime = date[1].replace('00:00:00', '23:59:59')
			
 
				+      }
			
 
				+      if (e === null) this.ruleForm.endTime = ''
			
 
				+    },
			
 
				+    gettime (data) {
			
 
				+      const value =
			
 
				+        data.getFullYear() +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getMonth() + 1) +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getDate()) +
			
 
				+        ' ' +
			
 
				+        this.checkTime(data.getHours()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getMinutes()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getSeconds())
			
 
				+      return value
			
 
				+    },
			
 
				+    checkTime (i) {
			
 
				+      if (i < 10) {
			
 
				+        i = '0' + i
			
 
				+      }
			
 
				+      return i
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    this.userList(this.ruleForm)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab7 {
			
 
				+  .top {
			
 
				+    position: relative;
			
 
				+    border-bottom: 1px solid black;
			
 
				+    margin-bottom: 20px;
			
 
				+    .userName {
			
 
				+      margin-left: 50px;
			
 
				+    }
			
 
				+    .addUser {
			
 
				+      position: absolute;
			
 
				+      right: 20px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  /deep/.el-table__body-wrapper{
			
 
				+    max-height: 580px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .paging {
			
 
				+    width: auto;
			
 
				+    display: flex;
			
 
				+    position: absolute;
			
 
				+    bottom: 40px;
			
 
				+    right: 50px;
			
 
				+    .zong {
			
 
				+      margin-right: 20px;
			
 
				+      margin-top: 4px;
			
 
				+    }
			
 
				+  }}
			
 
				+</style>
			
--- a/houtai/src/views/tab8/index.vue
+++ b/houtai/src/views/tab8/index.vue
@@ -0,0 +1,201 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab8">
			
 
				+    <div class="top">
			
 
				+      <el-form
			
 
				+        :model="ruleForm"
			
 
				+        ref="ruleForm"
			
 
				+        label-width="100px"
			
 
				+        class="demo-ruleForm"
			
 
				+      >
			
 
				+        <el-form-item label="操作日期：">
			
 
				+          <el-date-picker
			
 
				+            style="width: 300px"
			
 
				+            v-model="time"
			
 
				+            type="daterange"
			
 
				+            range-separator="-"
			
 
				+            start-placeholder="开始日期"
			
 
				+            end-placeholder="结束日期"
			
 
				+          >
			
 
				+          </el-date-picker>
			
 
				+          <span class="userName">操作人员：</span>
			
 
				+          <el-input
			
 
				+            placeholder="请输入"
			
 
				+            v-model="ruleForm.searchKey"
			
 
				+            style="width: 300px; margin-right: 50px"
			
 
				+          ></el-input>
			
 
				+          <el-button @click="inquire">查 询</el-button>
			
 
				+          <el-button @click="reset">重 置</el-button>
			
 
				+        </el-form-item>
			
 
				+      </el-form>
			
 
				+    </div>
			
 
				+    <!-- 表格 -->
			
 
				+    <div class="table">
			
 
				+      <el-table :data="tableData" style="width: 100%">
			
 
				+        <el-table-column label="序号" width="80">
			
 
				+          <template slot-scope="scope">
			
 
				+            {{ scope.$index + (ruleForm.pageNum - 1) * ruleForm.pageSize + 1 }}
			
 
				+          </template>
			
 
				+        </el-table-column>
			
 
				+        <el-table-column prop="userName" label="操作者"> </el-table-column>
			
 
				+        <el-table-column prop="createTime" label="操作日期"> </el-table-column>
			
 
				+        <el-table-column prop="ip" label="ip地址"> </el-table-column>
			
 
				+        <el-table-column prop="type" label="操作模块"> </el-table-column>
			
 
				+        <el-table-column prop="description" label="操作记录"> </el-table-column>
			
 
				+      </el-table>
			
 
				+    </div>
			
 
				+    <!-- 分页 -->
			
 
				+    <div class="paging">
			
 
				+      <span class="zong">共 {{ total }} 条</span>
			
 
				+      <el-pagination
			
 
				+        layout="sizes,prev,pager,next,jumper"
			
 
				+        :total="total"
			
 
				+        :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="ruleForm.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      >
			
 
				+      </el-pagination>
			
 
				+    </div>  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+import { logList } from '@/apis/tab8'
			
 
				+export default {
			
 
				+  name: 'tab8',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    return {
			
 
				+      total: 0,
			
 
				+      time: '',
			
 
				+      ruleForm: {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        startTime: '',
			
 
				+        endTime: '',
			
 
				+        searchKey: ''
			
 
				+      },
			
 
				+      tableData: []
			
 
				+    }
			
 
				+  },
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {
			
 
				+    time (val) {
			
 
				+      this.handleSelect(val)
			
 
				+    }
			
 
				+  },
			
 
				+  methods: {
			
 
				+    // 分页器方法
			
 
				+    currentChange (val) {
			
 
				+      // console.log('当前页改变了', val)
			
 
				+      this.ruleForm.pageNum = val
			
 
				+      this.logList(this.ruleForm)
			
 
				+    },
			
 
				+    sizeChange (val) {
			
 
				+      // console.log('条数改变了', val)
			
 
				+      this.ruleForm.pageNum = 1
			
 
				+      this.ruleForm.pageSize = val
			
 
				+      this.logList(this.ruleForm)
			
 
				+    },
			
 
				+    // 点击查询
			
 
				+    inquire () {
			
 
				+      this.ruleForm.pageNum = 1
			
 
				+      this.logList(this.ruleForm)
			
 
				+    },
			
 
				+    // 点击重置
			
 
				+    reset () {
			
 
				+      this.ruleForm = {
			
 
				+        pageNum: 1,
			
 
				+        pageSize: 15,
			
 
				+        searchKey: ''
			
 
				+      }
			
 
				+      this.time = ''
			
 
				+      this.logList(this.ruleForm)
			
 
				+    },
			
 
				+    // 封装获取列表方法
			
 
				+    async logList (data) {
			
 
				+      const res = await logList(data)
			
 
				+      this.tableData = res.data.records
			
 
				+      this.total = res.data.total
			
 
				+    },
			
 
				+    // 时间处理----------------
			
 
				+    handleSelect (e) {
			
 
				+      const date = []
			
 
				+      for (const i in e) {
			
 
				+        date.push(this.gettime(e[i]))
			
 
				+      }
			
 
				+      this.ruleForm.startTime = date[0]
			
 
				+      if (date[1]) {
			
 
				+        this.ruleForm.endTime = date[1].replace('00:00:00', '23:59:59')
			
 
				+      }
			
 
				+      if (e === null) this.ruleForm.endTime = ''
			
 
				+    },
			
 
				+    gettime (data) {
			
 
				+      const value =
			
 
				+        data.getFullYear() +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getMonth() + 1) +
			
 
				+        '-' +
			
 
				+        this.checkTime(data.getDate()) +
			
 
				+        ' ' +
			
 
				+        this.checkTime(data.getHours()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getMinutes()) +
			
 
				+        ':' +
			
 
				+        this.checkTime(data.getSeconds())
			
 
				+      return value
			
 
				+    },
			
 
				+    checkTime (i) {
			
 
				+      if (i < 10) {
			
 
				+        i = '0' + i
			
 
				+      }
			
 
				+      return i
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+    this.logList(this.ruleForm)
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab8 {
			
 
				+  .top {
			
 
				+    position: relative;
			
 
				+    border-bottom: 1px solid black;
			
 
				+    margin-bottom: 20px;
			
 
				+    .userName {
			
 
				+      margin-left: 50px;
			
 
				+    }
			
 
				+    .addUser {
			
 
				+      position: absolute;
			
 
				+      right: 20px;
			
 
				+      top: 0;
			
 
				+    }
			
 
				+  }
			
 
				+  /deep/.el-table__body-wrapper{
			
 
				+    max-height: 580px;
			
 
				+    overflow-y: auto;
			
 
				+  }
			
 
				+  .paging {
			
 
				+    width: auto;
			
 
				+    display: flex;
			
 
				+    position: absolute;
			
 
				+    bottom: 40px;
			
 
				+    right: 50px;
			
 
				+    .zong {
			
 
				+      margin-right: 20px;
			
 
				+      margin-top: 4px;
			
 
				+    }
			
 
				+  }}
			
 
				+</style>
			
--- a/houtai/vue.config.js
+++ b/houtai/vue.config.js
@@ -0,0 +1,3 @@
 
				+module.exports = {
			
 
				+  publicPath: './'
			
 
				+}
			
--- a/index/.editorconfig
+++ b/index/.editorconfig
@@ -0,0 +1,5 @@
 
				+[*.{js,jsx,ts,tsx,vue}]
			
 
				+indent_style = space
			
 
				+indent_size = 2
			
 
				+trim_trailing_whitespace = true
			
 
				+insert_final_newline = true
			
--- a/index/.gitignore
+++ b/index/.gitignore
@@ -0,0 +1,23 @@
 
				+.DS_Store
			
 
				+node_modules
			
 
				+/dist
			
 
				+
			
 
				+
			
 
				+# local env files
			
 
				+.env.local
			
 
				+.env.*.local
			
 
				+
			
 
				+# Log files
			
 
				+npm-debug.log*
			
 
				+yarn-debug.log*
			
 
				+yarn-error.log*
			
 
				+pnpm-debug.log*
			
 
				+
			
 
				+# Editor directories and files
			
 
				+.idea
			
 
				+.vscode
			
 
				+*.suo
			
 
				+*.ntvs*
			
 
				+*.njsproj
			
 
				+*.sln
			
 
				+*.sw?
			
--- a/index/README.md
+++ b/index/README.md
@@ -0,0 +1,24 @@
 
				+# houtai
			
 
				+
			
 
				+## Project setup
			
 
				+```
			
 
				+npm install
			
 
				+```
			
 
				+
			
 
				+### Compiles and hot-reloads for development
			
 
				+```
			
 
				+npm run serve
			
 
				+```
			
 
				+
			
 
				+### Compiles and minifies for production
			
 
				+```
			
 
				+npm run build
			
 
				+```
			
 
				+
			
 
				+### Lints and fixes files
			
 
				+```
			
 
				+npm run lint
			
 
				+```
			
 
				+
			
 
				+### Customize configuration
			
 
				+See [Configuration Reference](https://cli.vuejs.org/config/).
			
--- a/index/babel.config.js
+++ b/index/babel.config.js
@@ -0,0 +1,5 @@
 
				+module.exports = {
			
 
				+  presets: [
			
 
				+    '@vue/cli-plugin-babel/preset'
			
 
				+  ]
			
 
				+}
			
--- a/index/package-lock.json
+++ b/index/package-lock.json
--- a/index/package.json
+++ b/index/package.json
@@ -0,0 +1,64 @@
 
				+{
			
 
				+  "name": "houtai",
			
 
				+  "version": "0.1.0",
			
 
				+  "private": true,
			
 
				+  "scripts": {
			
 
				+    "serve": "vue-cli-service serve",
			
 
				+    "build": "vue-cli-service build",
			
 
				+    "lint": "vue-cli-service lint"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "core-js": "^3.6.5",
			
 
				+    "element-ui": "^2.15.6",
			
 
				+    "moment": "^2.29.1",
			
 
				+    "vue": "^2.6.11",
			
 
				+    "vue-router": "^3.2.0"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@vue/cli-plugin-babel": "~4.5.0",
			
 
				+    "@vue/cli-plugin-eslint": "~4.5.0",
			
 
				+    "@vue/cli-plugin-router": "~4.5.0",
			
 
				+    "@vue/cli-service": "~4.5.0",
			
 
				+    "@vue/eslint-config-standard": "^5.1.2",
			
 
				+    "babel-eslint": "^10.1.0",
			
 
				+    "eslint": "^6.7.2",
			
 
				+    "eslint-plugin-import": "^2.20.2",
			
 
				+    "eslint-plugin-node": "^11.1.0",
			
 
				+    "eslint-plugin-promise": "^4.2.1",
			
 
				+    "eslint-plugin-standard": "^4.0.0",
			
 
				+    "eslint-plugin-vue": "^6.2.2",
			
 
				+    "less": "^3.0.4",
			
 
				+    "less-loader": "^5.0.0",
			
 
				+    "lint-staged": "^9.5.0",
			
 
				+    "swiper": "^3.4.2",
			
 
				+    "vue-template-compiler": "^2.6.11"
			
 
				+  },
			
 
				+  "eslintConfig": {
			
 
				+    "root": true,
			
 
				+    "env": {
			
 
				+      "node": true
			
 
				+    },
			
 
				+    "extends": [
			
 
				+      "plugin:vue/essential",
			
 
				+      "@vue/standard"
			
 
				+    ],
			
 
				+    "parserOptions": {
			
 
				+      "parser": "babel-eslint"
			
 
				+    },
			
 
				+    "rules": {}
			
 
				+  },
			
 
				+  "browserslist": [
			
 
				+    "> 1%",
			
 
				+    "last 2 versions",
			
 
				+    "not dead"
			
 
				+  ],
			
 
				+  "gitHooks": {
			
 
				+    "pre-commit": "lint-staged"
			
 
				+  },
			
 
				+  "lint-staged": {
			
 
				+    "*.{js,jsx,vue}": [
			
 
				+      "vue-cli-service lint",
			
 
				+      "git add"
			
 
				+    ]
			
 
				+  }
			
 
				+}
			
--- a/index/public/favicon.ico
+++ b/index/public/favicon.ico
--- a/index/public/index.html
+++ b/index/public/index.html
@@ -0,0 +1,17 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="">
			
 
				+  <head>
			
 
				+    <meta charset="utf-8">
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
			
 
				+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
			
 
				+    <title>中国人民解放军陆军勤务学院</title>
			
 
				+  </head>
			
 
				+  <body>
			
 
				+    <noscript>
			
 
				+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
			
 
				+    </noscript>
			
 
				+    <div id="app"></div>
			
 
				+    <!-- built files will be auto injected -->
			
 
				+  </body>
			
 
				+</html>
			
--- a/index/src/App.vue
+++ b/index/src/App.vue
@@ -0,0 +1,7 @@
 
				+<template>
			
 
				+  <div id="app">
			
 
				+    <Router-view />
			
 
				+  </div>
			
 
				+</template>
			
 
				+<style lang="less">
			
 
				+</style>
			
--- a/index/src/assets/css/base.css
+++ b/index/src/assets/css/base.css
@@ -0,0 +1,47 @@
 
				+*{
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+  box-sizing: border-box;
			
 
				+}
			
 
				+ul li {
			
 
				+  list-style: none;
			
 
				+}
			
 
				+.el-input__inner{
			
 
				+  border: 1px solid #C7C7C7;
			
 
				+}
			
 
				+.el-input.is-active .el-input__inner, .el-input__inner:focus{
			
 
				+  border-color: #b9412e;
			
 
				+}
			
 
				+.el-icon-search{
			
 
				+  font-weight: 700;
			
 
				+  color: #b9412e;
			
 
				+}
			
 
				+/* 分页 */
			
 
				+.el-pagination{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+.el-pager li{
			
 
				+  font-weight: 400;
			
 
				+  min-width: 24px;
			
 
				+  width: 28px;
			
 
				+  height: 28px;
			
 
				+  padding: 0;
			
 
				+  margin: 0 8px;
			
 
				+  border: 1px solid #C7C7C7;
			
 
				+  border-radius: 50%;
			
 
				+}
			
 
				+.el-pager li:hover{
			
 
				+  color: #b9412e;
			
 
				+}
			
 
				+.el-pager li.active{
			
 
				+  background-color: #b9412e;
			
 
				+  border-radius: 50%;
			
 
				+  color: #fff;
			
 
				+}
			
 
				+.el-pager li.active+li{
			
 
				+  border: 1px solid #C7C7C7;
			
 
				+}
			
 
				+.el-pagination button:hover{
			
 
				+  color: #b9412e;
			
 
				+}
			
--- a/index/src/assets/img/demo.png
+++ b/index/src/assets/img/demo.png
--- a/index/src/assets/img/demo2.png
+++ b/index/src/assets/img/demo2.png
--- a/index/src/assets/img/logo.png
+++ b/index/src/assets/img/logo.png
--- a/index/src/assets/img/swiLeft.png
+++ b/index/src/assets/img/swiLeft.png
--- a/index/src/assets/img/swiRight.png
+++ b/index/src/assets/img/swiRight.png
--- a/index/src/assets/img/swiper.png
+++ b/index/src/assets/img/swiper.png
--- a/index/src/assets/img/swiper2.png
+++ b/index/src/assets/img/swiper2.png
--- a/index/src/assets/img/swiper3.png
+++ b/index/src/assets/img/swiper3.png
--- a/index/src/assets/img/swiper4.png
+++ b/index/src/assets/img/swiper4.png
--- a/index/src/assets/img/swiper5.png
+++ b/index/src/assets/img/swiper5.png
--- a/index/src/assets/img/tab1.png
+++ b/index/src/assets/img/tab1.png
--- a/index/src/assets/img/tab1ac.png
+++ b/index/src/assets/img/tab1ac.png
--- a/index/src/assets/img/tab2.png
+++ b/index/src/assets/img/tab2.png
--- a/index/src/assets/img/tab2ac.png
+++ b/index/src/assets/img/tab2ac.png
--- a/index/src/assets/img/tab3.png
+++ b/index/src/assets/img/tab3.png
--- a/index/src/assets/img/tab3Full.png
+++ b/index/src/assets/img/tab3Full.png
--- a/index/src/assets/img/tab3ac.png
+++ b/index/src/assets/img/tab3ac.png
--- a/index/src/assets/img/tab4-1BAC.png
+++ b/index/src/assets/img/tab4-1BAC.png
--- a/index/src/assets/img/tab4-3BAC.png
+++ b/index/src/assets/img/tab4-3BAC.png
--- a/index/src/assets/img/tab4.png
+++ b/index/src/assets/img/tab4.png
--- a/index/src/assets/img/tab4ac.png
+++ b/index/src/assets/img/tab4ac.png
--- a/index/src/assets/img/tab5-1.png
+++ b/index/src/assets/img/tab5-1.png
--- a/index/src/assets/img/tab5-2.png
+++ b/index/src/assets/img/tab5-2.png
--- a/index/src/assets/img/tab5-3.png
+++ b/index/src/assets/img/tab5-3.png
--- a/index/src/assets/img/tab5-4.png
+++ b/index/src/assets/img/tab5-4.png
--- a/index/src/assets/video/demo.mp3
+++ b/index/src/assets/video/demo.mp3
--- a/index/src/main.js
+++ b/index/src/main.js
@@ -0,0 +1,18 @@
 
				+import Vue from 'vue'
			
 
				+import ElementUI from 'element-ui'
			
 
				+import 'element-ui/lib/theme-chalk/index.css'
			
 
				+import App from './App.vue'
			
 
				+import router from './router'
			
 
				+import './assets/css/base.css'
			
 
				+import moment from 'moment'
			
 
				+import 'moment/locale/zh-cn'
			
 
				+import 'swiper/dist/css/swiper.min.css'
			
 
				+import 'swiper/dist/js/swiper.min'
			
 
				+
			
 
				+Vue.prototype.moment = moment
			
 
				+Vue.config.productionTip = false
			
 
				+Vue.use(ElementUI)
			
 
				+new Vue({
			
 
				+  router,
			
 
				+  render: h => h(App)
			
 
				+}).$mount('#app')
			
--- a/index/src/router/index.js
+++ b/index/src/router/index.js
@@ -0,0 +1,94 @@
 
				+import Vue from 'vue'
			
 
				+import VueRouter from 'vue-router'
			
 
				+
			
 
				+Vue.use(VueRouter)
			
 
				+
			
 
				+const routes = [
			
 
				+  {
			
 
				+    path: '/',
			
 
				+    name: 'layout',
			
 
				+    component: () => import('../views/layout/index.vue'),
			
 
				+    redirect: { name: 'home' },
			
 
				+    children: [
			
 
				+      {
			
 
				+        path: 'home',
			
 
				+        name: 'home',
			
 
				+        component: () => import('../views/home/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab1',
			
 
				+        name: 'tab1',
			
 
				+        meta: { myInd: 1 },
			
 
				+        component: () => import('../views/tab1/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab2',
			
 
				+        name: 'tab2',
			
 
				+        meta: { myInd: 2 },
			
 
				+        component: () => import('../views/tab2/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab3',
			
 
				+        name: 'tab3',
			
 
				+        meta: { myInd: 3 },
			
 
				+        component: () => import('../views/tab3/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4',
			
 
				+        name: 'tab4',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/index.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-1',
			
 
				+        name: 'tab4-1',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-2',
			
 
				+        name: 'tab4-2',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-2.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-3',
			
 
				+        name: 'tab4-3',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-3.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-4',
			
 
				+        name: 'tab4-4',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-4.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-4-1',
			
 
				+        name: 'tab4-4-1',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-4-1.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-5',
			
 
				+        name: 'tab4-5',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-5.vue')
			
 
				+      },
			
 
				+      {
			
 
				+        path: 'tab4-5-1',
			
 
				+        name: 'tab4-5-1',
			
 
				+        meta: { myInd: 4 },
			
 
				+        component: () => import('../views/tab4/tab4-5-1.vue')
			
 
				+      }
			
 
				+    ]
			
 
				+  }
			
 
				+]
			
 
				+
			
 
				+const router = new VueRouter({
			
 
				+  // mode: 'history',
			
 
				+  base: process.env.BASE_URL,
			
 
				+  routes
			
 
				+})
			
 
				+
			
 
				+export default router
			
--- a/index/src/views/home/index.vue
+++ b/index/src/views/home/index.vue
@@ -0,0 +1,62 @@
 
				+<template>
			
 
				+<div class='home'>
			
 
				+  <div class="btn" @click="$router.push('/tab1')">立即进入</div>
			
 
				+</div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'home',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.home{
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  background-color: rgba(0, 0, 0, .7);
			
 
				+  .btn{
			
 
				+    border-radius: 8px;
			
 
				+    cursor: pointer;
			
 
				+    background-color: #b9412e;
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 80px;
			
 
				+    transform: translateX(-50%);
			
 
				+    width: 188px;
			
 
				+    height: 44px;
			
 
				+    line-height: 44px;
			
 
				+    text-align: center;
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/layout/index.vue
+++ b/index/src/views/layout/index.vue
@@ -0,0 +1,108 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="layout">
			
 
				+    <!-- 左侧固定导航栏 -->
			
 
				+    <div class="lay_left">
			
 
				+      <div class="logo">
			
 
				+        <img src="@/assets/img/logo.png" alt="" />
			
 
				+      </div>
			
 
				+      <div class="lay_con">
			
 
				+        <div class="tab" @click="jump(item.img)" v-for="item in tabArr" :key="item.id">
			
 
				+          <img :src="require('@/assets/img/'+item.img+'ac.png')" alt="" v-if="$route.meta.myInd===item.id"/>
			
 
				+          <img :src="require('@/assets/img/'+item.img+'.png')" alt="" v-else/>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <div class="bot_time">{{moment().format('LL')}} {{moment().format('dddd')}}</div>
			
 
				+    </div>
			
 
				+    <!-- 右侧内容 -->
			
 
				+    <div class="right_con">
			
 
				+      <Router-view />
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'layout',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      tabArr: [
			
 
				+        { id: 1, img: 'tab1' },
			
 
				+        { id: 2, img: 'tab2' },
			
 
				+        { id: 3, img: 'tab3' },
			
 
				+        { id: 4, img: 'tab4' }
			
 
				+      ]
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击左侧tab栏
			
 
				+    jump (url) {
			
 
				+      this.$router.push(url).catch(() => {})
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.layout {
			
 
				+  display: flex;
			
 
				+  color: #fff;
			
 
				+  .lay_left {
			
 
				+    min-height: 875px;
			
 
				+    min-width: 164px;
			
 
				+    width: 164px;
			
 
				+    height: 100vh;
			
 
				+    background-color: #b9412e;
			
 
				+    .logo {
			
 
				+      padding-top: 20px;
			
 
				+      width: 120px;
			
 
				+      margin: 0 auto;
			
 
				+      & > img {
			
 
				+        width: 100%;
			
 
				+      }
			
 
				+    }
			
 
				+    .lay_con{
			
 
				+      padding: 20px 0;
			
 
				+      min-height: 510px;
			
 
				+      height: calc(100vh - 185px);
			
 
				+      display: flex;
			
 
				+      flex-direction: column;
			
 
				+      justify-content: space-around;
			
 
				+      .tab {
			
 
				+        cursor: pointer;
			
 
				+        margin: 0 auto;
			
 
				+        width: 91px;
			
 
				+        & > img {
			
 
				+          width: 100%;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    .bot_time {
			
 
				+      text-align: center;
			
 
				+      font-size: 14px;
			
 
				+    }
			
 
				+  }
			
 
				+  .right_con{
			
 
				+    max-width: 1756px;
			
 
				+    max-height: 973px;
			
 
				+    flex: 1;
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab1/index.vue
+++ b/index/src/views/tab1/index.vue
@@ -0,0 +1,52 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+<div class='tab1'>
			
 
				+  <iframe src="http://www.4dmodel.com/SuperTwo/index.html?m=1151" frameborder="0"></iframe>
			
 
				+</div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab1{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  iframe{
			
 
				+    width: 100%;
			
 
				+    height: 100%;
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab2/index.vue
+++ b/index/src/views/tab2/index.vue
@@ -0,0 +1,122 @@
 
				+<template>
			
 
				+  <div class="tab2">
			
 
				+    <div class="con">
			
 
				+      <div class="swiper-container">
			
 
				+        <div class="swiper-wrapper">
			
 
				+          <div class="swiper-slide">
			
 
				+            <img src="../../assets/img/swiper.png" alt="" />
			
 
				+            111111111
			
 
				+          </div>
			
 
				+          <div class="swiper-slide">
			
 
				+            <img src="../../assets/img/swiper2.png" alt="" />
			
 
				+            222222222
			
 
				+          </div>
			
 
				+          <div class="swiper-slide">
			
 
				+            <img src="../../assets/img/swiper3.png" alt="" />
			
 
				+            333333333
			
 
				+          </div>
			
 
				+          <div class="swiper-slide">
			
 
				+            <img src="../../assets/img/swiper4.png" alt="" />
			
 
				+            444444444
			
 
				+          </div>
			
 
				+          <div class="swiper-slide">
			
 
				+            <img src="../../assets/img/swiper5.png" alt="" />
			
 
				+            555555555
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <!-- 如果需要导航按钮 -->
			
 
				+      <div class="swiper-button-prev"></div>
			
 
				+      <div class="swiper-button-next"></div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {}
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {},
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+    // eslint-disable-next-line
			
 
				+    new Swiper(".swiper-container", {
			
 
				+      slidesPerView: 2,
			
 
				+      spaceBetween: 100,
			
 
				+      // centeredSlides: true,
			
 
				+      loop: true,
			
 
				+      // 如果需要前进后退按钮
			
 
				+      nextButton: '.swiper-button-next',
			
 
				+      prevButton: '.swiper-button-prev'
			
 
				+    })
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab2 {
			
 
				+  position: relative;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.con {
			
 
				+  width: 90%;
			
 
				+  height: 100%;
			
 
				+  margin: 0 auto;
			
 
				+  .swiper-container {
			
 
				+    padding-top: 100px;
			
 
				+    height: 100%;
			
 
				+    width: 100%;
			
 
				+    .swiper-wrapper {
			
 
				+      .swiper-slide {
			
 
				+        text-align: center;
			
 
				+        color: black;
			
 
				+        width: 100%;
			
 
				+        height: 500px;
			
 
				+        overflow: hidden;
			
 
				+        transform: translateX(-800px);
			
 
				+        img {
			
 
				+          opacity: 0.5;
			
 
				+          width: 100%;
			
 
				+          height: 500px;
			
 
				+          object-fit: cover;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    /deep/.swiper-slide.swiper-slide-active {
			
 
				+      transform: translate(0, 0);
			
 
				+    }
			
 
				+    /deep/.swiper-slide.swiper-slide-next {
			
 
				+      overflow: visible;
			
 
				+      transform: translate(-390px, 250px);
			
 
				+      z-index: 9999 !important;
			
 
				+      img {
			
 
				+        opacity: 1 !important;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
			
 
				+    background-image: url('../../assets/img/swiLeft.png');
			
 
				+  }
			
 
				+  .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
			
 
				+    background-image: url('../../assets/img/swiRight.png');
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab3/index.vue
+++ b/index/src/views/tab3/index.vue
@@ -0,0 +1,304 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab3">
			
 
				+    <div class="left">
			
 
				+      <ul>
			
 
				+        <li
			
 
				+          :class="{ active: listInd === item.id }"
			
 
				+          v-for="item in listData"
			
 
				+          :key="item.id"
			
 
				+          @click="cutTab(item.id)"
			
 
				+        >
			
 
				+          <span>·</span> {{ item.name }}
			
 
				+        </li>
			
 
				+      </ul>
			
 
				+      <div class="search">
			
 
				+        <el-input
			
 
				+          placeholder="搜索"
			
 
				+          suffix-icon="el-icon-search"
			
 
				+          v-model="search"
			
 
				+        >
			
 
				+        </el-input>
			
 
				+        <span class="btn" @click="mySearch"></span>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 右侧内容 -->
			
 
				+    <div class="right">
			
 
				+      <div class="row" v-for="i in 9" :key="i" @click="modelFu">
			
 
				+        <img src="../../assets/img/swiper.png" alt="" />
			
 
				+        <p>123</p>
			
 
				+      </div>
			
 
				+      <!-- 分页 -->
			
 
				+      <!-- :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+      -->
			
 
				+      <div class="paging">
			
 
				+        <el-pagination layout="prev,pager,next,jumper" :total="100">
			
 
				+        </el-pagination>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 点击文物出现的弹窗 -->
			
 
				+    <div class="model" v-if="modelShow">
			
 
				+      <div class="ifrCon" ref="ifrCon">
			
 
				+        <iframe
			
 
				+          src="https://4dscene.4dage.com/culturalrelics/ZSBWG/Model.html?m=zsbb12&v=1"
			
 
				+          frameborder="0"
			
 
				+        ></iframe>
			
 
				+        <!-- 关闭按钮 -->
			
 
				+        <div class="btnX el-icon-close" @click="modelShow = false"></div>
			
 
				+        <!-- 全屏按钮 -->
			
 
				+        <div class="full" @click="screen"></div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab3',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      fullscreen: false,
			
 
				+      modelShow: false,
			
 
				+      listData: [
			
 
				+        { id: 1, name: '实物模型', type: '' },
			
 
				+        { id: 2, name: '专题图库', type: '' },
			
 
				+        { id: 3, name: '视频档案', type: '' }
			
 
				+      ],
			
 
				+      listInd: 1,
			
 
				+      search: ''
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    // 点击模型全屏
			
 
				+    screen () {
			
 
				+      const element = this.$refs.ifrCon // 获取容器
			
 
				+      if (this.fullscreen) {
			
 
				+        // 如果已经全屏了就退出全屏
			
 
				+
			
 
				+        if (document.exitFullscreen) {
			
 
				+          document.exitFullscreen()
			
 
				+        } else if (document.webkitCancelFullScreen) {
			
 
				+          document.webkitCancelFullScreen()
			
 
				+        } else if (document.mozCancelFullScreen) {
			
 
				+          document.mozCancelFullScreen()
			
 
				+        } else if (document.msExitFullscreen) {
			
 
				+          document.msExitFullscreen()
			
 
				+        }
			
 
				+      } else {
			
 
				+        // 如果不是全屏就变成全屏
			
 
				+        if (element.requestFullscreen) {
			
 
				+          element.requestFullscreen()
			
 
				+        } else if (element.webkitRequestFullScreen) {
			
 
				+          element.webkitRequestFullScreen()
			
 
				+        } else if (element.mozRequestFullScreen) {
			
 
				+          element.mozRequestFullScreen()
			
 
				+        } else if (element.msRequestFullscreen) {
			
 
				+          // IE11
			
 
				+          element.msRequestFullscreen()
			
 
				+        }
			
 
				+      }
			
 
				+
			
 
				+      this.fullscreen = !this.fullscreen
			
 
				+    },
			
 
				+    // 点击模型
			
 
				+    modelFu () {
			
 
				+      this.modelShow = true
			
 
				+    },
			
 
				+    cutTab (id) {
			
 
				+      this.listInd = id
			
 
				+    },
			
 
				+    mySearch () {
			
 
				+      console.log('点击了搜索')
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+    // 监听esc事件
			
 
				+    document.addEventListener('webkitfullscreenchange', (e) => {
			
 
				+      if (!(e.currentTarget.webkitIsFullScreen)) {
			
 
				+        // console.log('退出啊webkitIsFullScreen11111111111')
			
 
				+        setTimeout(() => {
			
 
				+          this.fullscreen = false
			
 
				+        }, 100)
			
 
				+      } else {
			
 
				+        // console.log('进入webkitIsFullScreen')
			
 
				+      }
			
 
				+    })
			
 
				+
			
 
				+    document.addEventListener('fullscreenchange', (e) => {
			
 
				+      if (!document.fullscreenElement) {
			
 
				+        // console.log('退出啊fullscreenchange1111111111')
			
 
				+        setTimeout(() => {
			
 
				+          this.fullscreen = false
			
 
				+        }, 100)
			
 
				+      } else {
			
 
				+        // console.log('进入fullscreenchange')
			
 
				+      }
			
 
				+    })
			
 
				+
			
 
				+    document.addEventListener('MSFullscreenChange', (e) => {
			
 
				+      if (!document.msFullscreenElement) {
			
 
				+        // console.log('IE退出111111')
			
 
				+        setTimeout(() => {
			
 
				+          this.fullscreen = false
			
 
				+        }, 100)
			
 
				+      } else {
			
 
				+        // console.log('IE进')
			
 
				+      }
			
 
				+    })
			
 
				+    document.addEventListener('mozfullscreenchange', (e) => {
			
 
				+      if (!document.mozFullScreenElement) {
			
 
				+        // console.log('火狐退出1111111111111')
			
 
				+        this.$nextTick(() => {
			
 
				+          setTimeout(() => {
			
 
				+            this.fullscreen = false
			
 
				+          }, 100)
			
 
				+        })
			
 
				+      } else {
			
 
				+        // console.log('火狐进')
			
 
				+      }
			
 
				+    })
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab3 {
			
 
				+  display: flex;
			
 
				+  padding: 50px 30px 0;
			
 
				+  color: #3e3e3e;
			
 
				+  .left {
			
 
				+    width: 300px;
			
 
				+    height: 800px;
			
 
				+    ul {
			
 
				+      margin-bottom: 20px;
			
 
				+      border: 1px solid #c7c7c7;
			
 
				+      height: 120px;
			
 
				+      li {
			
 
				+        margin-left: -1px;
			
 
				+        width: 300px;
			
 
				+        cursor: pointer;
			
 
				+        display: flex;
			
 
				+        align-items: center;
			
 
				+        padding-left: 20px;
			
 
				+        height: 40px;
			
 
				+        & > span {
			
 
				+          font-size: 40px;
			
 
				+          margin-right: 10px;
			
 
				+        }
			
 
				+        &:hover {
			
 
				+          background-color: #b9412e;
			
 
				+          color: #fff;
			
 
				+        }
			
 
				+      }
			
 
				+      .active {
			
 
				+        background-color: #b9412e;
			
 
				+        color: #fff;
			
 
				+      }
			
 
				+    }
			
 
				+    .search {
			
 
				+      position: relative;
			
 
				+      .btn {
			
 
				+        cursor: pointer;
			
 
				+        position: absolute;
			
 
				+        right: 0;
			
 
				+        top: 0;
			
 
				+        height: 40px;
			
 
				+        width: 40px;
			
 
				+        background-color: transparent;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .right {
			
 
				+    position: relative;
			
 
				+    justify-content: space-between;
			
 
				+    align-content: flex-start;
			
 
				+    display: flex;
			
 
				+    flex-wrap: wrap;
			
 
				+    min-width: 1200px;
			
 
				+    margin-left: 40px;
			
 
				+    flex: 1;
			
 
				+    height: 825px;
			
 
				+    .row {
			
 
				+      margin-bottom: 20px;
			
 
				+      cursor: pointer;
			
 
				+      width: 30%;
			
 
				+      text-align: center;
			
 
				+      & > img {
			
 
				+        width: 100%;
			
 
				+        height: 200px;
			
 
				+        object-fit: cover;
			
 
				+      }
			
 
				+      & > p {
			
 
				+        margin-top: 10px;
			
 
				+      }
			
 
				+    }
			
 
				+    .paging {
			
 
				+      position: absolute;
			
 
				+      left: 50%;
			
 
				+      bottom: 0;
			
 
				+      transform: translateX(-50%);
			
 
				+    }
			
 
				+  }
			
 
				+  .model {
			
 
				+    position: fixed;
			
 
				+    top: 0;
			
 
				+    left: 0;
			
 
				+    min-width: 1000px;
			
 
				+    min-height: 600px;
			
 
				+    width: 100vw;
			
 
				+    height: 100vh;
			
 
				+    background-color: rgba(0, 0, 0, 0.5);
			
 
				+    .ifrCon {
			
 
				+      border: 10px solid #fff;
			
 
				+      position: absolute;
			
 
				+      left: 50%;
			
 
				+      top: 50%;
			
 
				+      transform: translate(-50%, -50%);
			
 
				+      width: 1000px;
			
 
				+      height: 600px;
			
 
				+      iframe {
			
 
				+        width: 100%;
			
 
				+        height: 100%;
			
 
				+      }
			
 
				+      .btnX {
			
 
				+        cursor: pointer;
			
 
				+        position: absolute;
			
 
				+        right: 10px;
			
 
				+        top: 10px;
			
 
				+        color: #fff;
			
 
				+        font-size: 40px;
			
 
				+      }
			
 
				+      .full {
			
 
				+        width: 30px;
			
 
				+        height: 30px;
			
 
				+        background: url('../../assets/img/tab3Full.png');
			
 
				+        background-size: 30px 30px;
			
 
				+        cursor: pointer;
			
 
				+        position: absolute;
			
 
				+        right: 10px;
			
 
				+        bottom: 10px;
			
 
				+        color: #fff;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab4/index.vue
+++ b/index/src/views/tab4/index.vue
@@ -0,0 +1,110 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+<div class='tab4'>
			
 
				+  <div class="conten">
			
 
				+    <div v-for="item in imgList" :key="item.id"  @click="$router.push(item.url)">
			
 
				+      <img :src="require('@/assets/img/tab5-'+item.id+'.png')" alt="">
			
 
				+      <p>{{item.name}}</p>
			
 
				+    </div>
			
 
				+    <!-- 后面的盒子 -->
			
 
				+    <div class="search" @click="$router.push('tab4-5')">
			
 
				+      <div class="sea_con">
			
 
				+        <i class="el-icon-search"></i>
			
 
				+        <div>学籍查询</div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab4',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      imgList: [
			
 
				+        { id: 1, name: '学校宣传片', url: '/tab4-1' },
			
 
				+        { id: 2, name: '美丽校园', url: '/tab4-2' },
			
 
				+        { id: 3, name: '校歌', url: '/tab4-3' },
			
 
				+        { id: 4, name: '历任学校领导', url: '/tab4-4' }
			
 
				+      ]
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4{
			
 
				+  .conten{
			
 
				+    min-width: 1740px;
			
 
				+    display: flex;
			
 
				+    flex-wrap: wrap;
			
 
				+    justify-content: center;
			
 
				+    &>div{
			
 
				+      cursor: pointer;
			
 
				+      margin:50px 40px 0;
			
 
				+      width: 500px;
			
 
				+      height: auto;
			
 
				+      &>img {
			
 
				+        width: 500px;
			
 
				+        height: 360px;
			
 
				+        object-fit: cover;
			
 
				+      }
			
 
				+      &>p{
			
 
				+        margin-top: 10px;
			
 
				+        color: black;
			
 
				+        text-align: center;
			
 
				+      }
			
 
				+    }
			
 
				+    .search{
			
 
				+      display: flex;
			
 
				+      justify-content: center;
			
 
				+      align-items: center;
			
 
				+      border: 2px dotted #ccc;
			
 
				+      height: 360px;
			
 
				+      .sea_con{
			
 
				+        width: 100px;
			
 
				+        height: 80px;
			
 
				+        text-align: center;
			
 
				+        &>i {
			
 
				+          color: #b9412e;
			
 
				+          font-size: 36px;
			
 
				+        }
			
 
				+        &>div {
			
 
				+          border-radius: 5px;
			
 
				+          margin-top: 8px;
			
 
				+          width: 100px;
			
 
				+          height: 40px;
			
 
				+          line-height: 40px;
			
 
				+          text-align: center;
			
 
				+          background-color: #b9412e;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab4/tab4-1.vue
+++ b/index/src/views/tab4/tab4-1.vue
@@ -0,0 +1,49 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+<div class='tab4-1'></div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab4-1',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {
			
 
				+
			
 
				+  },
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {
			
 
				+
			
 
				+  },
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4-1{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  min-width: 1500px;
			
 
				+  background: url("../../assets/img/tab4-1BAC.png");
			
 
				+  background-size: 100% 100%;
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab4/tab4-2.vue
+++ b/index/src/views/tab4/tab4-2.vue
@@ -0,0 +1,141 @@
 
				+<!--  -->
			
 
				+<template>
			
 
				+  <div class="tab4-2">
			
 
				+    <div class="top">
			
 
				+      美丽校园
			
 
				+      <div class="search">
			
 
				+        <el-input
			
 
				+          placeholder="搜索"
			
 
				+          suffix-icon="el-icon-search"
			
 
				+          v-model="search"
			
 
				+        >
			
 
				+        </el-input>
			
 
				+        <span class="btn" @click="mySearch"></span>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 内容 -->
			
 
				+    <div class="conten">
			
 
				+      <div
			
 
				+        class="row"
			
 
				+        v-for="i in 8"
			
 
				+        :key="i"
			
 
				+      >
			
 
				+        <el-image
			
 
				+          style="width: 380px; height: 240px"
			
 
				+          :src="url"
			
 
				+          :preview-src-list="srcList"
			
 
				+        >
			
 
				+        </el-image>
			
 
				+        <!-- <img src="../../assets/img/demo2.png" alt="" /> -->
			
 
				+        <p>图片名称</p>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 分页 -->
			
 
				+    <!-- :page-sizes="[15, 30, 45, 60]"
			
 
				+        :current-page="from2.pageNum"
			
 
				+        @current-change="currentChange"
			
 
				+        @size-change="sizeChange"
			
 
				+ -->
			
 
				+    <div class="paging">
			
 
				+      <el-pagination layout="prev,pager,next,jumper" :total="100">
			
 
				+      </el-pagination>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<script>
			
 
				+export default {
			
 
				+  name: 'tab4-2',
			
 
				+  components: {},
			
 
				+  data () {
			
 
				+    // 这里存放数据
			
 
				+    return {
			
 
				+      url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
			
 
				+      srcList: ['https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'],
			
 
				+      search: ''
			
 
				+    }
			
 
				+  },
			
 
				+  // 监听属性 类似于data概念
			
 
				+  computed: {},
			
 
				+  // 监控data中的数据变化
			
 
				+  watch: {},
			
 
				+  // 方法集合
			
 
				+  methods: {
			
 
				+    mySearch () {
			
 
				+      console.log('点击了搜索')
			
 
				+    }
			
 
				+  },
			
 
				+  // 生命周期 - 创建完成（可以访问当前this实例）
			
 
				+  created () {},
			
 
				+  // 生命周期 - 挂载完成（可以访问DOM元素）
			
 
				+  mounted () {},
			
 
				+  beforeCreate () {}, // 生命周期 - 创建之前
			
 
				+  beforeMount () {}, // 生命周期 - 挂载之前
			
 
				+  beforeUpdate () {}, // 生命周期 - 更新之前
			
 
				+  updated () {}, // 生命周期 - 更新之后
			
 
				+  beforeDestroy () {}, // 生命周期 - 销毁之前
			
 
				+  destroyed () {}, // 生命周期 - 销毁完成
			
 
				+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
			
 
				+}
			
 
				+</script>
			
 
				+<style lang='less' scoped>
			
 
				+.tab4-2 {
			
 
				+  position: relative;
			
 
				+  min-width: 1600px;
			
 
				+  height: 100%;
			
 
				+  padding: 40px 40px 0;
			
 
				+  color: black;
			
 
				+  .top {
			
 
				+    position: relative;
			
 
				+    width: 100%;
			
 
				+    text-align: center;
			
 
				+    color: #b9412e;
			
 
				+    font-size: 26px;
			
 
				+    font-weight: 700;
			
 
				+    .search {
			
 
				+      right: 50px;
			
 
				+      bottom: 0;
			
 
				+      position: absolute;
			
 
				+      .btn {
			
 
				+        cursor: pointer;
			
 
				+        position: absolute;
			
 
				+        right: 0;
			
 
				+        top: 0;
			
 
				+        height: 40px;
			
 
				+        width: 40px;
			
 
				+        background-color: transparent;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .conten {
			
 
				+    margin-top: 30px;
			
 
				+    min-width: 1650px;
			
 
				+    display: flex;
			
 
				+    justify-content: space-between;
			
 
				+    flex-wrap: wrap;
			
 
				+    .row {
			
 
				+      cursor: pointer;
			
 
				+      margin: 40px 0px;
			
 
				+      width: 380px;
			
 
				+      height: auto;
			
 
				+      /deep/.el-image__preview{
			
 
				+        object-fit: cover;
			
 
				+      }
			
 
				+      & > img {
			
 
				+        width: 380px;
			
 
				+        height: 240px;
			
 
				+      }
			
 
				+      & > p {
			
 
				+        margin-top: 8px;
			
 
				+        text-align: center;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+  .paging {
			
 
				+    position: absolute;
			
 
				+    left: 50%;
			
 
				+    bottom: 50px;
			
 
				+    transform: translateX(-50%);
			
 
				+  }
			
 
				+}
			
 
				+</style>
			
--- a/index/src/views/tab4/tab4-3.vue
+++ b/index/src/views/tab4/tab4-3.vue