计划停电 告警管理 级弹框排版

.history/src/assets/css/index_20210929090211.scss

@@ -0,0 +1,285 @@
+@import './variables.scss';
+@import './mixin.scss';
+// @import './transition.scss';
+@import './element-variables.scss';
+// @import './sidebar.scss';
+
+body {
+    height: 100%;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+    font-weight: 700;
+}
+
+html {
+    height: 100%;
+    box-sizing: border-box;
+}
+
+#app {
+    height: 100%;
+}
+
+*,
+*:before,
+*:after {
+    box-sizing: inherit;
+}
+
+a:focus,
+a:active {
+    outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+.clearfix {
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: " ";
+        clear: both;
+        height: 0;
+    }
+}
+
+// main-container global css
+.mb-20 {
+    margin-bottom: 20px
+}
+
+.mr-30 {
+    margin-right: 30px
+}
+
+.mt-20 {
+    margin-top: 20px
+}
+
+.mt-40 {
+    margin-top: 40px
+}
+
+.mt-60 {
+    margin-top: 60px
+}
+
+.font-16 {
+    font-size: 16px
+}
+
+.padding-20 {
+    padding: 20px
+}
+
+.text-center {
+    text-align: center
+}
+
+.delete-text {
+    color: #F80000
+}
+
+.remarksTxt {
+    opacity: .45;
+    line-height: 1.5;
+}
+
+.app-container {
+    padding: 20px;
+    // width: 100%;
+    width: calc(100% - 40px);
+    // height: 100%;
+    margin: 20px;
+    background: #fff;
+    min-height: calc(100vh - 140px)
+}
+
+.filter-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    vertical-align: middle;
+    .el-button+.el-button {
+        margin-left: 30px!important;
+    }
+    .filter-item {
+        margin-right: 30px;
+        display: inline-block;
+    }
+}
+
+.el-input__inner {
+    height: 36px;
+    line-height: 36px
+}
+
+.el-button {
+    padding: 10px 12px;
+}
+
+.el-table td,
+.el-table th {
+    padding: 10px 0
+}
+
+// 弹框样式start
+.el-dialog__header {
+    background: #f8f8f8;
+    padding: 16px 20px 16px;
+}
+
+// .el-form-item {
+//     width: 400px;
+//     margin: 0 auto 20px;
+// }
+
+// 弹框样式end
+// 台区列表
+.siteTitle {
+    font-size: 16px;
+    padding: 10px 20px 30px 20px;
+    text-align: center;
+    position: relative;
+    .goBack {
+        position: absolute;
+        left: 0;
+        top: 0
+    }
+}
+
+.status.el-avatar {
+    width: 14px;
+    height: 14px;
+    background: #04F21C
+}
+
+// 基本信息
+.basicInfo {
+    width: 100%;
+    height: calc(100vh - 193px);
+    // border: 1px solid pink;
+    display: block;
+    overflow-y: auto;
+}
+
+.siteManage-main {
+    padding: 20px;
+    .el-form-item.basic-info-page {
+        margin-left: 0px
+    }
+}
+
+.goArchive {
+    color: #056FFF;
+    text-decoration: underline;
+}
+
+.blockTitle {
+    font-weight: bold
+}
+
+// input长度
+.el-form-item__content {
+    width: 250px;
+}
+
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+    width: 250px;
+}
+
+.el-select {
+    width: 100%
+}
+
+// 单选框样式
+.el-radio {
+    margin-right: 24px
+}
+
+//提交:
+.sublitArea {
+    text-align: right;
+    margin-top: 40px
+}
+
+// 图片上传样式 start
+.el-upload--picture-card {
+    width: 90px;
+    height: 90px;
+}
+
+.el-upload {
+    width: 90px;
+    height: 90px;
+    line-height: 100px;
+}
+
+.el-upload-list--picture-card .el-upload-list__item {
+    width: 92px;
+    height: 92px;
+    line-height: 92px;
+    text-align: center
+}
+
+.el-upload-list--picture-card .el-upload-list__item-thumbnail {
+    width: 90px;
+    height: 90px;
+    line-height: 90px;
+}
+
+.avatar {
+    width: 90px;
+    height: 90px;
+}
+
+// 电力监测
+.watchDog,
+.variableList {
+    .el-form-item__content {
+        width: 270px
+    }
+    .el-form-item__label {
+        width: 150px!important
+    }
+    .el-form-item__content {
+        margin-left: 150px!important
+    }
+}
+
+.paginationBlock {
+    margin-top: 20px;
+    text-align: right
+}
+
+.variableList {
+    .filter-container {
+        .el-button+.el-button {
+            margin-left: 20px !important;
+        }
+        .el-input {
+            margin: 0 20px;
+        }
+    }
+}

.history/src/assets/css/index_20210929154801.scss

@@ -0,0 +1,284 @@
+@import './variables.scss';
+@import './mixin.scss';
+// @import './transition.scss';
+@import './element-variables.scss';
+// @import './sidebar.scss';
+body {
+    height: 100%;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+    font-weight: 700;
+}
+
+html {
+    height: 100%;
+    box-sizing: border-box;
+}
+
+#app {
+    height: 100%;
+}
+
+*,
+*:before,
+*:after {
+    box-sizing: inherit;
+}
+
+a:focus,
+a:active {
+    outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+.clearfix {
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: " ";
+        clear: both;
+        height: 0;
+    }
+}
+
+// main-container global css
+.mb-20 {
+    margin-bottom: 20px
+}
+
+.mr-30 {
+    margin-right: 30px
+}
+
+.mt-20 {
+    margin-top: 20px
+}
+
+.mt-40 {
+    margin-top: 40px
+}
+
+.mt-60 {
+    margin-top: 60px
+}
+
+.font-16 {
+    font-size: 16px
+}
+
+.padding-20 {
+    padding: 20px
+}
+
+.text-center {
+    text-align: center
+}
+
+.delete-text {
+    color: #F80000
+}
+
+.remarksTxt {
+    opacity: .45;
+    line-height: 1.5;
+}
+
+.app-container {
+    padding: 20px;
+    // width: 100%;
+    width: calc(100% - 40px);
+    // height: 100%;
+    margin: 20px;
+    background: #fff;
+    min-height: calc(100vh - 140px)
+}
+
+.filter-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    vertical-align: middle;
+    .el-button+.el-button {
+        margin-left: 30px!important;
+    }
+    .filter-item {
+        margin-right: 30px;
+        display: inline-block;
+    }
+}
+
+.el-input__inner {
+    height: 36px;
+    line-height: 36px
+}
+
+.el-button {
+    padding: 10px 12px;
+}
+
+.el-table td,
+.el-table th {
+    padding: 10px 0
+}
+
+// 弹框样式start
+.el-dialog__header {
+    background: #f8f8f8;
+    padding: 16px 20px 16px;
+}
+
+.el-form-item {
+    width: 400px;
+    margin: 0 auto 20px;
+}
+
+// 弹框样式end
+// 台区列表
+.siteTitle {
+    font-size: 16px;
+    padding: 10px 20px 30px 20px;
+    text-align: center;
+    position: relative;
+    .goBack {
+        position: absolute;
+        left: 0;
+        top: 0
+    }
+}
+
+.status.el-avatar {
+    width: 14px;
+    height: 14px;
+    background: #04F21C
+}
+
+// 基本信息
+.basicInfo {
+    width: 100%;
+    height: calc(100vh - 193px);
+    // border: 1px solid pink;
+    display: block;
+    overflow-y: auto;
+}
+
+.siteManage-main {
+    padding: 20px;
+    .el-form-item.basic-info-page {
+        margin-left: 0px
+    }
+}
+
+.goArchive {
+    color: #056FFF;
+    text-decoration: underline;
+}
+
+.blockTitle {
+    font-weight: bold
+}
+
+// input长度
+.el-form-item__content {
+    width: 250px;
+}
+
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+    width: 250px;
+}
+
+.el-select {
+    width: 100%
+}
+
+// 单选框样式
+.el-radio {
+    margin-right: 24px
+}
+
+//提交:
+.sublitArea {
+    text-align: right;
+    margin-top: 40px
+}
+
+// 图片上传样式 start
+.el-upload--picture-card {
+    width: 90px;
+    height: 90px;
+}
+
+.el-upload {
+    width: 90px;
+    height: 90px;
+    line-height: 100px;
+}
+
+.el-upload-list--picture-card .el-upload-list__item {
+    width: 92px;
+    height: 92px;
+    line-height: 92px;
+    text-align: center
+}
+
+.el-upload-list--picture-card .el-upload-list__item-thumbnail {
+    width: 90px;
+    height: 90px;
+    line-height: 90px;
+}
+
+.avatar {
+    width: 90px;
+    height: 90px;
+}
+
+// 电力监测
+.watchDog,
+.variableList {
+    .el-form-item__content {
+        width: 270px
+    }
+    .el-form-item__label {
+        width: 150px!important
+    }
+    .el-form-item__content {
+        margin-left: 150px!important
+    }
+}
+
+.paginationBlock {
+    margin-top: 20px;
+    text-align: right
+}
+
+.variableList {
+    .filter-container {
+        .el-button+.el-button {
+            margin-left: 20px !important;
+        }
+        .el-input {
+            margin: 0 20px;
+        }
+    }
+}

.history/src/assets/css/index_20210929154913.scss

@@ -0,0 +1,283 @@
+@import './variables.scss';
+@import './mixin.scss';
+// @import './transition.scss';
+@import './element-variables.scss';
+// @import './sidebar.scss';
+body {
+    height: 100%;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+    font-weight: 700;
+}
+
+html {
+    height: 100%;
+    box-sizing: border-box;
+}
+
+#app {
+    height: 100%;
+}
+
+*,
+*:before,
+*:after {
+    box-sizing: inherit;
+}
+
+a:focus,
+a:active {
+    outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+.clearfix {
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: " ";
+        clear: both;
+        height: 0;
+    }
+}
+
+// main-container global css
+.mb-20 {
+    margin-bottom: 20px
+}
+
+.mr-30 {
+    margin-right: 30px
+}
+
+.mt-20 {
+    margin-top: 20px
+}
+
+.mt-40 {
+    margin-top: 40px
+}
+
+.mt-60 {
+    margin-top: 60px
+}
+
+.font-16 {
+    font-size: 16px
+}
+
+.padding-20 {
+    padding: 20px
+}
+
+.text-center {
+    text-align: center
+}
+
+.delete-text {
+    color: #F80000
+}
+
+.remarksTxt {
+    opacity: .45;
+    line-height: 1.5;
+}
+
+.app-container {
+    padding: 20px;
+    // width: 100%;
+    width: calc(100% - 40px);
+    // height: 100%;
+    margin: 20px;
+    background: #fff;
+    min-height: calc(100vh - 140px)
+}
+
+.filter-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    vertical-align: middle;
+    .el-button+.el-button {
+        margin-left: 30px!important;
+    }
+    .filter-item {
+        margin-right: 30px;
+        display: inline-block;
+    }
+}
+
+.el-input__inner {
+    height: 36px;
+    line-height: 36px
+}
+
+.el-button {
+    padding: 10px 12px;
+}
+
+.el-table td,
+.el-table th {
+    padding: 10px 0
+}
+
+// 弹框样式start
+.el-dialog__header {
+    background: #f8f8f8;
+    padding: 16px 20px 16px;
+}
+
+// .el-form-item {
+//     width: 400px;
+//     margin: 0 auto 20px;
+// }
+// 弹框样式end
+// 台区列表
+.siteTitle {
+    font-size: 16px;
+    padding: 10px 20px 30px 20px;
+    text-align: center;
+    position: relative;
+    .goBack {
+        position: absolute;
+        left: 0;
+        top: 0
+    }
+}
+
+.status.el-avatar {
+    width: 14px;
+    height: 14px;
+    background: #04F21C
+}
+
+// 基本信息
+.basicInfo {
+    width: 100%;
+    height: calc(100vh - 193px);
+    // border: 1px solid pink;
+    display: block;
+    overflow-y: auto;
+}
+
+.siteManage-main {
+    padding: 20px;
+    .el-form-item.basic-info-page {
+        margin-left: 0px
+    }
+}
+
+.goArchive {
+    color: #056FFF;
+    text-decoration: underline;
+}
+
+.blockTitle {
+    font-weight: bold
+}
+
+// input长度
+.el-form-item__content {
+    width: 250px;
+}
+
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+    width: 250px;
+}
+
+.el-select {
+    width: 100%
+}
+
+// 单选框样式
+.el-radio {
+    margin-right: 24px
+}
+
+//提交:
+.sublitArea {
+    text-align: right;
+    margin-top: 40px
+}
+
+// 图片上传样式 start
+.el-upload--picture-card {
+    width: 90px;
+    height: 90px;
+}
+
+.el-upload {
+    width: 90px;
+    height: 90px;
+    line-height: 100px;
+}
+
+.el-upload-list--picture-card .el-upload-list__item {
+    width: 92px;
+    height: 92px;
+    line-height: 92px;
+    text-align: center
+}
+
+.el-upload-list--picture-card .el-upload-list__item-thumbnail {
+    width: 90px;
+    height: 90px;
+    line-height: 90px;
+}
+
+.avatar {
+    width: 90px;
+    height: 90px;
+}
+
+// 电力监测
+.watchDog,
+.variableList {
+    .el-form-item__content {
+        width: 270px
+    }
+    .el-form-item__label {
+        width: 150px!important
+    }
+    .el-form-item__content {
+        margin-left: 150px!important
+    }
+}
+
+.paginationBlock {
+    margin-top: 20px;
+    text-align: right
+}
+
+.variableList {
+    .filter-container {
+        .el-button+.el-button {
+            margin-left: 20px !important;
+        }
+        .el-input {
+            margin: 0 20px;
+        }
+    }
+}

.history/src/assets/css/index_20210929154916.scss

@@ -0,0 +1,283 @@
+@import './variables.scss';
+@import './mixin.scss';
+// @import './transition.scss';
+@import './element-variables.scss';
+// @import './sidebar.scss';
+body {
+    height: 100%;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+    font-weight: 700;
+}
+
+html {
+    height: 100%;
+    box-sizing: border-box;
+}
+
+#app {
+    height: 100%;
+}
+
+*,
+*:before,
+*:after {
+    box-sizing: inherit;
+}
+
+a:focus,
+a:active {
+    outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+.clearfix {
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: " ";
+        clear: both;
+        height: 0;
+    }
+}
+
+// main-container global css
+.mb-20 {
+    margin-bottom: 20px
+}
+
+.mr-30 {
+    margin-right: 30px
+}
+
+.mt-20 {
+    margin-top: 20px
+}
+
+.mt-40 {
+    margin-top: 40px
+}
+
+.mt-60 {
+    margin-top: 60px
+}
+
+.font-16 {
+    font-size: 16px
+}
+
+.padding-20 {
+    padding: 20px
+}
+
+.text-center {
+    text-align: center
+}
+
+.delete-text {
+    color: #F80000
+}
+
+.remarksTxt {
+    opacity: .45;
+    line-height: 1.5;
+}
+
+.app-container {
+    padding: 20px;
+    // width: 100%;
+    width: calc(100% - 40px);
+    // height: 100%;
+    margin: 20px;
+    background: #fff;
+    min-height: calc(100vh - 140px)
+}
+
+.filter-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    vertical-align: middle;
+    .el-button+.el-button {
+        margin-left: 30px!important;
+    }
+    .filter-item {
+        margin-right: 30px;
+        display: inline-block;
+    }
+}
+
+.el-input__inner {
+    height: 36px;
+    line-height: 36px
+}
+
+.el-button {
+    padding: 10px 12px;
+}
+
+.el-table td,
+.el-table th {
+    padding: 10px 0
+}
+
+// 弹框样式start
+.el-dialog__header {
+    background: #f8f8f8;
+    padding: 16px 20px 16px;
+}
+
+// .el-form-item {
+//     width: 400px;
+//     margin: 0 auto 20px;
+// }
+// 弹框样式end
+// 台区列表
+.siteTitle {
+    font-size: 16px;
+    padding: 10px 20px 30px 20px;
+    text-align: center;
+    position: relative;
+    .goBack {
+        position: absolute;
+        left: 0;
+        top: 0
+    }
+}
+
+.status.el-avatar {
+    width: 14px;
+    height: 14px;
+    background: #04F21C
+}
+
+// 基本信息
+.basicInfo {
+    width: 100%;
+    height: calc(100vh - 193px);
+    // border: 1px solid pink;
+    display: block;
+    overflow-y: auto;
+}
+
+.siteManage-main {
+    padding: 20px;
+    .el-form-item.basic-info-page {
+        margin-left: 0px
+    }
+}
+
+.goArchive {
+    color: #056FFF;
+    text-decoration: underline;
+}
+
+.blockTitle {
+    font-weight: bold
+}
+
+// input长度
+.el-form-item__content {
+    width: 250px;
+}
+
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+    width: 250px;
+}
+
+.el-select {
+    width: 100%
+}
+
+// 单选框样式
+.el-radio {
+    margin-right: 24px
+}
+
+//提交:
+.sublitArea {
+    text-align: right;
+    margin-top: 40px
+}
+
+// 图片上传样式 start
+.el-upload--picture-card {
+    width: 90px;
+    height: 90px;
+}
+
+.el-upload {
+    width: 90px;
+    height: 90px;
+    line-height: 100px;
+}
+
+.el-upload-list--picture-card .el-upload-list__item {
+    width: 92px;
+    height: 92px;
+    line-height: 92px;
+    text-align: center
+}
+
+.el-upload-list--picture-card .el-upload-list__item-thumbnail {
+    width: 90px;
+    height: 90px;
+    line-height: 90px;
+}
+
+.avatar {
+    width: 90px;
+    height: 90px;
+}
+
+// 电力监测
+.watchDog,
+.variableList {
+    .el-form-item__content {
+        width: 270px
+    }
+    .el-form-item__label {
+        width: 150px!important
+    }
+    .el-form-item__content {
+        margin-left: 150px!important
+    }
+}
+
+.paginationBlock {
+    margin-top: 20px;
+    text-align: right
+}
+
+.variableList {
+    .filter-container {
+        .el-button+.el-button {
+            margin-left: 20px !important;
+        }
+        .el-input {
+            margin: 0 20px;
+        }
+    }
+}

.history/src/assets/css/index_20210929154920.scss

@@ -0,0 +1,283 @@
+@import './variables.scss';
+@import './mixin.scss';
+// @import './transition.scss';
+@import './element-variables.scss';
+// @import './sidebar.scss';
+body {
+    height: 100%;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+    font-weight: 700;
+}
+
+html {
+    height: 100%;
+    box-sizing: border-box;
+}
+
+#app {
+    height: 100%;
+}
+
+*,
+*:before,
+*:after {
+    box-sizing: inherit;
+}
+
+a:focus,
+a:active {
+    outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+    cursor: pointer;
+    color: inherit;
+    text-decoration: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+.clearfix {
+    &:after {
+        visibility: hidden;
+        display: block;
+        font-size: 0;
+        content: " ";
+        clear: both;
+        height: 0;
+    }
+}
+
+// main-container global css
+.mb-20 {
+    margin-bottom: 20px
+}
+
+.mr-30 {
+    margin-right: 30px
+}
+
+.mt-20 {
+    margin-top: 20px
+}
+
+.mt-40 {
+    margin-top: 40px
+}
+
+.mt-60 {
+    margin-top: 60px
+}
+
+.font-16 {
+    font-size: 16px
+}
+
+.padding-20 {
+    padding: 20px
+}
+
+.text-center {
+    text-align: center
+}
+
+.delete-text {
+    color: #F80000
+}
+
+.remarksTxt {
+    opacity: .45;
+    line-height: 1.5;
+}
+
+.app-container {
+    padding: 20px;
+    // width: 100%;
+    width: calc(100% - 40px);
+    // height: 100%;
+    margin: 20px;
+    background: #fff;
+    min-height: calc(100vh - 140px)
+}
+
+.filter-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    vertical-align: middle;
+    .el-button+.el-button {
+        margin-left: 30px!important;
+    }
+    .filter-item {
+        margin-right: 30px;
+        display: inline-block;
+    }
+}
+
+.el-input__inner {
+    height: 36px;
+    line-height: 36px
+}
+
+.el-button {
+    padding: 10px 12px;
+}
+
+.el-table td,
+.el-table th {
+    padding: 10px 0
+}
+
+// 弹框样式start
+.el-dialog__header {
+    background: #f8f8f8;
+    padding: 16px 20px 16px;
+}
+
+// .el-form-item {
+//     width: 400px;
+//     margin: 0 auto 20px;
+// }
+// 弹框样式end
+// 台区列表
+.siteTitle {
+    font-size: 16px;
+    padding: 10px 20px 30px 20px;
+    text-align: center;
+    position: relative;
+    .goBack {
+        position: absolute;
+        left: 0;
+        top: 0
+    }
+}
+
+.status.el-avatar {
+    width: 14px;
+    height: 14px;
+    background: #04F21C
+}
+
+// 基本信息
+.basicInfo {
+    width: 100%;
+    height: calc(100vh - 193px);
+    // border: 1px solid pink;
+    display: block;
+    overflow-y: auto;
+}
+
+.siteManage-main {
+    padding: 20px;
+    .el-form-item.basic-info-page {
+        margin-left: 0px
+    }
+}
+
+.goArchive {
+    color: #056FFF;
+    text-decoration: underline;
+}
+
+.blockTitle {
+    font-weight: bold
+}
+
+// input长度
+.el-form-item__content {
+    width: 250px;
+}
+
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+    width: 250px;
+}
+
+.el-select {
+    width: 100%
+}
+
+// 单选框样式
+.el-radio {
+    margin-right: 24px
+}
+
+//提交:
+.sublitArea {
+    text-align: right;
+    margin-top: 40px
+}
+
+// 图片上传样式 start
+.el-upload--picture-card {
+    width: 90px;
+    height: 90px;
+}
+
+.el-upload {
+    width: 90px;
+    height: 90px;
+    line-height: 100px;
+}
+
+.el-upload-list--picture-card .el-upload-list__item {
+    width: 92px;
+    height: 92px;
+    line-height: 92px;
+    text-align: center
+}
+
+.el-upload-list--picture-card .el-upload-list__item-thumbnail {
+    width: 90px;
+    height: 90px;
+    line-height: 90px;
+}
+
+.avatar {
+    width: 90px;
+    height: 90px;
+}
+
+// 电力监测
+.watchDog,
+.variableList {
+    .el-form-item__content {
+        width: 270px
+    }
+    .el-form-item__label {
+        width: 150px!important
+    }
+    .el-form-item__content {
+        margin-left: 150px!important
+    }
+}
+
+.paginationBlock {
+    margin-top: 20px;
+    text-align: right
+}
+
+.variableList {
+    .filter-container {
+        .el-button+.el-button {
+            margin-left: 20px !important;
+        }
+        .el-input {
+            margin: 0 20px;
+        }
+    }
+}

.history/src/layouts/IndexLayout/routes_20210929165957.ts

@@ -0,0 +1,307 @@
+import settings from "@/config/settings";
+import { RoutesDataItem } from "@/utils/routes";
+import BlankLayout from '@/layouts/BlankLayout.vue';
+
+const IndexLayoutRoutes: Array<RoutesDataItem> = [
+
+  {
+    icon: 'alarmManage',
+    title: 'index-layout.menu.alarmManage',
+    path: '/alarmManage',
+    component: () => import('@/views/alarmManage/index.vue')
+  },
+  {
+    icon: 'siteManage',
+    title: 'index-layout.menu.siteManage',
+    path: '/siteManage',
+    component: () => import('@/views/siteManage/index.vue')
+  },
+
+  {
+    icon: 'stationManage',
+    title: 'index-layout.menu.stationManage',
+    path: '/stationManage',
+    redirect: '/stationManage/index',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.EditArticle',
+        path: 'siteList',
+        component: () => import('@/views/stationManage/siteList.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      },
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.Articleindex',
+        path: 'index',
+        component: () => import('@/views/stationManage/index.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      }
+    ]
+  },
+
+
+
+
+  {
+    icon: 'deviceManage',
+    title: 'index-layout.menu.deviceManage',
+    path: '/deviceManage',
+    component: BlankLayout,
+    redirect: '/deviceManage/powerEquip',
+    children: [
+      {
+        title: 'index-layout.menu.deviceManage.powerEquip',
+        path: 'powerEquip',
+        component: () => import('@/views/deviceManage/powerEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.videoEquip',
+        path: 'videoEquip',
+        component: () => import('@/views/deviceManage/videoEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.communicateEquip',
+        path: 'communicateEquip',
+        component: () => import('@/views/deviceManage/communicateEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.channelList',
+        path: 'channelList',
+        component: () => import('@/views/deviceManage/channelList/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.attribTemplate',
+        path: 'attribTemplate',
+        component: () => import('@/views/deviceManage/attribTemplate/index.vue'),
+      }
+    ]
+  },
+
+
+
+  {
+    icon: 'dataManage',
+    title: 'index-layout.menu.dataManage',
+    path: '/dataManage',
+    component: BlankLayout,
+    redirect: '/dataManage/sameAnalysis',
+    children: [
+      {
+        title: 'index-layout.menu.dataManage.sameAnalysis',
+        path: 'sameAnalysis',
+        component: () => import('@/views/dataManage/sameAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.chainAnalysis',
+        path: 'chainAnalysis',
+        component: () => import('@/views/dataManage/chainAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.handOpera',
+        path: 'handOpera',
+        component: () => import('@/views/dataManage/handOpera/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.energyReport',
+        path: 'energyReport',
+        component: () => import('@/views/dataManage/energyReport/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.demandAnalysis',
+        path: 'demandAnalysis',
+        component: () => import('@/views/dataManage/demandAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.consumConfig',
+        path: 'consumConfig',
+        component: () =>
+          import('@/views/dataManage/consumConfig/index.vue'),
+      }
+    ]
+  },
+  {
+    title: '电能质量',
+    icon: 'powerQuality',
+    path: '/powerQuality',
+    component: BlankLayout,
+    redirect: '/powerQuality/harmonicReport',
+    children: [
+      {
+        title: '谐波报表',
+        path: 'harmonicReport',
+        component: () => import('@/views/powerQuality/harmonicReport/index.vue'),
+      },
+      {
+        title: '实时监测',
+        path: 'realTimeMonitoring',
+        name: 'realTimeMonitoring',
+        component: () => import('@/views/powerQuality/realTimeMonitoring/index.vue'),
+      },
+      {
+        title: '评估报告',
+        path: 'asseReport',
+        name: 'asseReport',
+        component: () => import('@/views/powerQuality/asseReport/index.vue'),
+      },
+      {
+        title: '三相不平衡分析',
+        path: 'unbalanceAnalysis',
+        name: 'unbalanceAnalysis',
+        component: () => import('@/views/powerQuality/unbalanceAnalysis/index.vue'),
+      },
+
+    ]
+  },
+  {
+    icon: 'monthReport',
+    title: '月度报告',
+    path: '/monthReport',
+    component: () => import('@/views/monthReport/index.vue'),
+  },
+  {
+    icon: 'planOutage',
+    title: '计划停电',
+    path: '/planOutage',
+    component: () => import('@/views/planOutage/index.vue'),
+  },
+  {
+    title: '巡检管理',
+    icon: 'patrolManage',
+    path: '/patrolManage',
+    component: BlankLayout,
+    redirect: '/patrolManage/patrolPlan',
+    name: 'patrolManage',
+    children: [
+      {
+        title: '巡检计划',
+        path: 'patrolPlan',
+        name: 'patrolPlan',
+        component: () => import('@/views/patrolManage/patrolPlan/index.vue'),
+      },
+      {
+        title: '巡检记录',
+        path: 'patrolRecord',
+        name: 'patrolRecord',
+        component: () => import('@/views/patrolManage/patrolRecord/index.vue'),
+      },
+      {
+        title: '巡检内容',
+        path: 'patrolContent',
+        name: 'patrolContent',
+        component: () => import('@/views/patrolManage/patrolContent/index.vue'),
+      },
+      {
+        title: '检查条目',
+        path: 'checkEntries',
+        name: 'checkEntries',
+        component: () => import('@/views/patrolManage/checkEntries/index.vue'),
+      },
+    ]
+  },
+  {
+    title: '运维管理',
+    icon: 'operManage',
+    path: '/operManage',
+    component: BlankLayout,
+    redirect: '/operManage/siteAchives',
+    name: 'operManage',
+    children: [
+      {
+        title: '现场档案',
+        path: 'siteAchives',
+        name: 'siteAchives',
+        component: () => import('@/views/operManage/siteAchives/index.vue'),
+      },
+      {
+        title: '缺陷管理',
+        path: 'defectManage',
+        name: 'defectManage',
+        component: () =>
+          import('@/views/operManage/defectManage/index.vue'),
+      },
+      {
+        title: '工单管理',
+        path: 'workManage',
+        name: 'workManage',
+        component: () =>
+          import('@/views/operManage/workManage/index.vue'),
+      },
+      {
+        title: '运维统计',
+        path: 'operStatistics',
+        name: 'operStatistics',
+        component: () => import('@/views/operManage/operStatistics/index.vue'),
+      },
+      {
+        title: '工作量统计',
+        path: 'workStatistics',
+        name: 'workStatistics',
+        component: () => import('@/views/operManage/workStatistics/index.vue'),
+      },
+
+    ]
+  },
+
+  {
+    title: '系统管理',
+    icon: 'systemManage',
+    path: '/systemManage',
+    component: BlankLayout,
+    redirect: '/systemManage/userManage',
+    name: 'systemManage',
+    children: [
+      {
+        title: '用户管理',
+        path: 'userManage',
+        name: 'userManage',
+        component: () => import('@/views/systemManage/userManage/index.vue'),
+      },
+      {
+        title: '权限管理',
+        path: 'rolePermission',
+        name: 'rolePermission',
+        component: () => import('@/views/systemManage/rolePermission/index.vue'),
+      },
+    ]
+  },
+
+
+
+
+  {
+    icon: 'permissions',
+    title: 'index-layout.menu.roles',
+    path: '/roles',
+    redirect: '/roles/all',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'detail',
+        title: 'index-layout.menu.roles.all',
+        path: 'all',
+        component: () => import('@/views/roles/all/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['user'],
+        title: 'index-layout.menu.roles.user',
+        path: 'user',
+        component: () => import('@/views/roles/user/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['test'],
+        title: 'index-layout.menu.roles.test',
+        path: 'test',
+        component: () => import('@/views/roles/test/index.vue'),
+      },
+    ],
+  },
+
+];
+
+export default IndexLayoutRoutes;

.history/src/layouts/IndexLayout/routes_20210929170415.ts

@@ -0,0 +1,307 @@
+import settings from "@/config/settings";
+import { RoutesDataItem } from "@/utils/routes";
+import BlankLayout from '@/layouts/BlankLayout.vue';
+
+const IndexLayoutRoutes: Array<RoutesDataItem> = [
+
+  {
+    icon: 'alarmManage',
+    title: 'index-layout.menu.alarmManage',
+    path: '/alarmManage',
+    component: () => import('@/views/alarmManage/index.vue')
+  },
+  {
+    icon: 'siteManage',
+    title: 'index-layout.menu.siteManage',
+    path: '/siteManage',
+    component: () => import('@/views/siteManage/index.vue')
+  },
+
+  {
+    icon: 'stationManage',
+    title: 'index-layout.menu.stationManage',
+    path: '/stationManage',
+    redirect: '/stationManage/index',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.EditArticle',
+        path: 'siteList',
+        component: () => import('@/views/stationManage/siteList.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      },
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.Articleindex',
+        path: 'index',
+        component: () => import('@/views/stationManage/index.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      }
+    ]
+  },
+
+
+
+
+  {
+    icon: 'deviceManage',
+    title: 'index-layout.menu.deviceManage',
+    path: '/deviceManage',
+    component: BlankLayout,
+    redirect: '/deviceManage/powerEquip',
+    children: [
+      {
+        title: 'index-layout.menu.deviceManage.powerEquip',
+        path: 'powerEquip',
+        component: () => import('@/views/deviceManage/powerEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.videoEquip',
+        path: 'videoEquip',
+        component: () => import('@/views/deviceManage/videoEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.communicateEquip',
+        path: 'communicateEquip',
+        component: () => import('@/views/deviceManage/communicateEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.channelList',
+        path: 'channelList',
+        component: () => import('@/views/deviceManage/channelList/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.attribTemplate',
+        path: 'attribTemplate',
+        component: () => import('@/views/deviceManage/attribTemplate/index.vue'),
+      }
+    ]
+  },
+
+
+
+  {
+    icon: 'dataManage',
+    title: 'index-layout.menu.dataManage',
+    path: '/dataManage',
+    component: BlankLayout,
+    redirect: '/dataManage/sameAnalysis',
+    children: [
+      {
+        title: 'index-layout.menu.dataManage.sameAnalysis',
+        path: 'sameAnalysis',
+        component: () => import('@/views/dataManage/sameAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.chainAnalysis',
+        path: 'chainAnalysis',
+        component: () => import('@/views/dataManage/chainAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.handOpera',
+        path: 'handOpera',
+        component: () => import('@/views/dataManage/handOpera/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.energyReport',
+        path: 'energyReport',
+        component: () => import('@/views/dataManage/energyReport/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.demandAnalysis',
+        path: 'demandAnalysis',
+        component: () => import('@/views/dataManage/demandAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.consumConfig',
+        path: 'consumConfig',
+        component: () =>
+          import('@/views/dataManage/consumConfig/index.vue'),
+      }
+    ]
+  },
+  {
+    title: '电能质量',
+    icon: 'powerQuality',
+    path: '/powerQuality',
+    component: BlankLayout,
+    redirect: '/powerQuality/harmonicReport',
+    children: [
+      {
+        title: '谐波报表',
+        path: 'harmonicReport',
+        component: () => import('@/views/powerQuality/harmonicReport/index.vue'),
+      },
+      {
+        title: '实时监测',
+        path: 'realTimeMonitoring',
+        name: 'realTimeMonitoring',
+        component: () => import('@/views/powerQuality/realTimeMonitoring/index.vue'),
+      },
+      {
+        title: '评估报告',
+        path: 'asseReport',
+        name: 'asseReport',
+        component: () => import('@/views/powerQuality/asseReport/index.vue'),
+      },
+      {
+        title: '三相不平衡分析',
+        path: 'unbalanceAnalysis',
+        name: 'unbalanceAnalysis',
+        component: () => import('@/views/powerQuality/unbalanceAnalysis/index.vue'),
+      },
+
+    ]
+  },
+  {
+    icon: 'monthReport',
+    title: '月度报告',
+    path: '/monthReport',
+    component: () => import('@/views/monthReport/index.vue'),
+  },
+  {
+    icon: 'planOutage',
+    title: '计划停电',
+    path: '/planOutage',
+    component: () => import('@/views/planOutage/index1.vue'),
+  },
+  {
+    title: '巡检管理',
+    icon: 'patrolManage',
+    path: '/patrolManage',
+    component: BlankLayout,
+    redirect: '/patrolManage/patrolPlan',
+    name: 'patrolManage',
+    children: [
+      {
+        title: '巡检计划',
+        path: 'patrolPlan',
+        name: 'patrolPlan',
+        component: () => import('@/views/patrolManage/patrolPlan/index.vue'),
+      },
+      {
+        title: '巡检记录',
+        path: 'patrolRecord',
+        name: 'patrolRecord',
+        component: () => import('@/views/patrolManage/patrolRecord/index.vue'),
+      },
+      {
+        title: '巡检内容',
+        path: 'patrolContent',
+        name: 'patrolContent',
+        component: () => import('@/views/patrolManage/patrolContent/index.vue'),
+      },
+      {
+        title: '检查条目',
+        path: 'checkEntries',
+        name: 'checkEntries',
+        component: () => import('@/views/patrolManage/checkEntries/index.vue'),
+      },
+    ]
+  },
+  {
+    title: '运维管理',
+    icon: 'operManage',
+    path: '/operManage',
+    component: BlankLayout,
+    redirect: '/operManage/siteAchives',
+    name: 'operManage',
+    children: [
+      {
+        title: '现场档案',
+        path: 'siteAchives',
+        name: 'siteAchives',
+        component: () => import('@/views/operManage/siteAchives/index.vue'),
+      },
+      {
+        title: '缺陷管理',
+        path: 'defectManage',
+        name: 'defectManage',
+        component: () =>
+          import('@/views/operManage/defectManage/index.vue'),
+      },
+      {
+        title: '工单管理',
+        path: 'workManage',
+        name: 'workManage',
+        component: () =>
+          import('@/views/operManage/workManage/index.vue'),
+      },
+      {
+        title: '运维统计',
+        path: 'operStatistics',
+        name: 'operStatistics',
+        component: () => import('@/views/operManage/operStatistics/index.vue'),
+      },
+      {
+        title: '工作量统计',
+        path: 'workStatistics',
+        name: 'workStatistics',
+        component: () => import('@/views/operManage/workStatistics/index.vue'),
+      },
+
+    ]
+  },
+
+  {
+    title: '系统管理',
+    icon: 'systemManage',
+    path: '/systemManage',
+    component: BlankLayout,
+    redirect: '/systemManage/userManage',
+    name: 'systemManage',
+    children: [
+      {
+        title: '用户管理',
+        path: 'userManage',
+        name: 'userManage',
+        component: () => import('@/views/systemManage/userManage/index.vue'),
+      },
+      {
+        title: '权限管理',
+        path: 'rolePermission',
+        name: 'rolePermission',
+        component: () => import('@/views/systemManage/rolePermission/index.vue'),
+      },
+    ]
+  },
+
+
+
+
+  {
+    icon: 'permissions',
+    title: 'index-layout.menu.roles',
+    path: '/roles',
+    redirect: '/roles/all',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'detail',
+        title: 'index-layout.menu.roles.all',
+        path: 'all',
+        component: () => import('@/views/roles/all/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['user'],
+        title: 'index-layout.menu.roles.user',
+        path: 'user',
+        component: () => import('@/views/roles/user/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['test'],
+        title: 'index-layout.menu.roles.test',
+        path: 'test',
+        component: () => import('@/views/roles/test/index.vue'),
+      },
+    ],
+  },
+
+];
+
+export default IndexLayoutRoutes;

.history/src/layouts/IndexLayout/routes_20210929171248.ts

@@ -0,0 +1,307 @@
+import settings from "@/config/settings";
+import { RoutesDataItem } from "@/utils/routes";
+import BlankLayout from '@/layouts/BlankLayout.vue';
+
+const IndexLayoutRoutes: Array<RoutesDataItem> = [
+
+  {
+    icon: 'alarmManage',
+    title: 'index-layout.menu.alarmManage',
+    path: '/alarmManage',
+    component: () => import('@/views/alarmManage/index.vue')
+  },
+  {
+    icon: 'siteManage',
+    title: 'index-layout.menu.siteManage',
+    path: '/siteManage',
+    component: () => import('@/views/siteManage/index.vue')
+  },
+
+  {
+    icon: 'stationManage',
+    title: 'index-layout.menu.stationManage',
+    path: '/stationManage',
+    redirect: '/stationManage/index',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.EditArticle',
+        path: 'siteList',
+        component: () => import('@/views/stationManage/siteList.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      },
+      {
+        icon: 'stationManage',
+        title: 'index-layout.menu.stationManage.Articleindex',
+        path: 'index',
+        component: () => import('@/views/stationManage/index.vue'),
+        selectLeftMenu: '/stationManage',
+        hidden: true
+      }
+    ]
+  },
+
+
+
+
+  {
+    icon: 'deviceManage',
+    title: 'index-layout.menu.deviceManage',
+    path: '/deviceManage',
+    component: BlankLayout,
+    redirect: '/deviceManage/powerEquip',
+    children: [
+      {
+        title: 'index-layout.menu.deviceManage.powerEquip',
+        path: 'powerEquip',
+        component: () => import('@/views/deviceManage/powerEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.videoEquip',
+        path: 'videoEquip',
+        component: () => import('@/views/deviceManage/videoEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.communicateEquip',
+        path: 'communicateEquip',
+        component: () => import('@/views/deviceManage/communicateEquip/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.channelList',
+        path: 'channelList',
+        component: () => import('@/views/deviceManage/channelList/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.deviceManage.attribTemplate',
+        path: 'attribTemplate',
+        component: () => import('@/views/deviceManage/attribTemplate/index.vue'),
+      }
+    ]
+  },
+
+
+
+  {
+    icon: 'dataManage',
+    title: 'index-layout.menu.dataManage',
+    path: '/dataManage',
+    component: BlankLayout,
+    redirect: '/dataManage/sameAnalysis',
+    children: [
+      {
+        title: 'index-layout.menu.dataManage.sameAnalysis',
+        path: 'sameAnalysis',
+        component: () => import('@/views/dataManage/sameAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.chainAnalysis',
+        path: 'chainAnalysis',
+        component: () => import('@/views/dataManage/chainAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.handOpera',
+        path: 'handOpera',
+        component: () => import('@/views/dataManage/handOpera/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.energyReport',
+        path: 'energyReport',
+        component: () => import('@/views/dataManage/energyReport/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.demandAnalysis',
+        path: 'demandAnalysis',
+        component: () => import('@/views/dataManage/demandAnalysis/index.vue'),
+      },
+      {
+        title: 'index-layout.menu.dataManage.consumConfig',
+        path: 'consumConfig',
+        component: () =>
+          import('@/views/dataManage/consumConfig/index.vue'),
+      }
+    ]
+  },
+  {
+    title: '电能质量',
+    icon: 'powerQuality',
+    path: '/powerQuality',
+    component: BlankLayout,
+    redirect: '/powerQuality/harmonicReport',
+    children: [
+      {
+        title: '谐波报表',
+        path: 'harmonicReport',
+        component: () => import('@/views/powerQuality/harmonicReport/index.vue'),
+      },
+      {
+        title: '实时监测',
+        path: 'realTimeMonitoring',
+        name: 'realTimeMonitoring',
+        component: () => import('@/views/powerQuality/realTimeMonitoring/index.vue'),
+      },
+      {
+        title: '评估报告',
+        path: 'asseReport',
+        name: 'asseReport',
+        component: () => import('@/views/powerQuality/asseReport/index.vue'),
+      },
+      {
+        title: '三相不平衡分析',
+        path: 'unbalanceAnalysis',
+        name: 'unbalanceAnalysis',
+        component: () => import('@/views/powerQuality/unbalanceAnalysis/index.vue'),
+      },
+
+    ]
+  },
+  {
+    icon: 'monthReport',
+    title: '月度报告',
+    path: '/monthReport',
+    component: () => import('@/views/monthReport/index.vue'),
+  },
+  {
+    icon: 'planOutage',
+    title: '计划停电',
+    path: '/planOutage',
+    component: () => import('@/views/planOutage/index.vue'),
+  },
+  {
+    title: '巡检管理',
+    icon: 'patrolManage',
+    path: '/patrolManage',
+    component: BlankLayout,
+    redirect: '/patrolManage/patrolPlan',
+    name: 'patrolManage',
+    children: [
+      {
+        title: '巡检计划',
+        path: 'patrolPlan',
+        name: 'patrolPlan',
+        component: () => import('@/views/patrolManage/patrolPlan/index.vue'),
+      },
+      {
+        title: '巡检记录',
+        path: 'patrolRecord',
+        name: 'patrolRecord',
+        component: () => import('@/views/patrolManage/patrolRecord/index.vue'),
+      },
+      {
+        title: '巡检内容',
+        path: 'patrolContent',
+        name: 'patrolContent',
+        component: () => import('@/views/patrolManage/patrolContent/index.vue'),
+      },
+      {
+        title: '检查条目',
+        path: 'checkEntries',
+        name: 'checkEntries',
+        component: () => import('@/views/patrolManage/checkEntries/index.vue'),
+      },
+    ]
+  },
+  {
+    title: '运维管理',
+    icon: 'operManage',
+    path: '/operManage',
+    component: BlankLayout,
+    redirect: '/operManage/siteAchives',
+    name: 'operManage',
+    children: [
+      {
+        title: '现场档案',
+        path: 'siteAchives',
+        name: 'siteAchives',
+        component: () => import('@/views/operManage/siteAchives/index.vue'),
+      },
+      {
+        title: '缺陷管理',
+        path: 'defectManage',
+        name: 'defectManage',
+        component: () =>
+          import('@/views/operManage/defectManage/index.vue'),
+      },
+      {
+        title: '工单管理',
+        path: 'workManage',
+        name: 'workManage',
+        component: () =>
+          import('@/views/operManage/workManage/index.vue'),
+      },
+      {
+        title: '运维统计',
+        path: 'operStatistics',
+        name: 'operStatistics',
+        component: () => import('@/views/operManage/operStatistics/index.vue'),
+      },
+      {
+        title: '工作量统计',
+        path: 'workStatistics',
+        name: 'workStatistics',
+        component: () => import('@/views/operManage/workStatistics/index.vue'),
+      },
+
+    ]
+  },
+
+  {
+    title: '系统管理',
+    icon: 'systemManage',
+    path: '/systemManage',
+    component: BlankLayout,
+    redirect: '/systemManage/userManage',
+    name: 'systemManage',
+    children: [
+      {
+        title: '用户管理',
+        path: 'userManage',
+        name: 'userManage',
+        component: () => import('@/views/systemManage/userManage/index.vue'),
+      },
+      {
+        title: '权限管理',
+        path: 'rolePermission',
+        name: 'rolePermission',
+        component: () => import('@/views/systemManage/rolePermission/index.vue'),
+      },
+    ]
+  },
+
+
+
+
+  {
+    icon: 'permissions',
+    title: 'index-layout.menu.roles',
+    path: '/roles',
+    redirect: '/roles/all',
+    component: BlankLayout,
+    children: [
+      {
+        icon: 'detail',
+        title: 'index-layout.menu.roles.all',
+        path: 'all',
+        component: () => import('@/views/roles/all/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['user'],
+        title: 'index-layout.menu.roles.user',
+        path: 'user',
+        component: () => import('@/views/roles/user/index.vue'),
+      },
+      {
+        icon: 'detail',
+        roles: ['test'],
+        title: 'index-layout.menu.roles.test',
+        path: 'test',
+        component: () => import('@/views/roles/test/index.vue'),
+      },
+    ],
+  },
+
+];
+
+export default IndexLayoutRoutes;

.history/src/views/alarmManage/index_20210929174930.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template #default="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/alarmManage/index_20210929174950.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">告警管理列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template #default="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/monthReport/index_20210929165957.vue

@@ -0,0 +1,89 @@
+<template>
+  <div class="dashboard-container">
+    <div class="dashboard-text">月度报告</div>
+
+    <el-tree default-expand-all :data="data">
+      <span
+        class="custom-tree-node"
+        slot-scope="{ node, data }"
+        style="width: 100%"
+        @mouseenter="mouseenter(data)"
+        @mouseleave="mouseleave(data)"
+      >
+        <span>{{ node.label }}</span>
+        <el-link
+          v-show="data.show"
+          size="mini"
+          style="margin-left: 5px"
+          type="primary"
+          icon="el-icon-plus"
+        ></el-link>
+        <el-link
+          v-show="data.show"
+          size="mini"
+          style="margin-left: 5px"
+          type="primary"
+          icon="el-icon-delete"
+        ></el-link>
+      </span>
+    </el-tree>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  name: "Dashboard",
+  computed: {
+    ...mapGetters(["name"]),
+  },
+  data() {
+    return {
+      data: [
+        {
+          id: 0,
+          label: "水果",
+          show: false,
+          children: [
+            {
+              id: 1,
+              label: "苹果",
+              show: false,
+            },
+            {
+              id: 2,
+              label: "芒果",
+              show: false,
+            },
+          ],
+        },
+      ],
+    };
+  },
+  methods: {
+    mouseenter(data) {
+      alert(1)
+      console.log(data);
+      data.show = true;
+    },
+
+    mouseleave(data) {
+      console.log(data);
+      data.show = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dashboard {
+  &-container {
+    margin: 30px;
+  }
+  &-text {
+    font-size: 30px;
+    line-height: 46px;
+  }
+}
+</style>

.history/src/views/monthReport/index_20210929170156.vue

@@ -0,0 +1,89 @@
+<template>
+  <div class="dashboard-container">
+    <div class="dashboard-text">月度报告</div>
+
+    <el-tree default-expand-all :data="data">
+      <span
+        class="custom-tree-node"
+        :default-slot="{node,data}"
+        style="width: 100%"
+        @mouseenter="mouseenter(data)"
+        @mouseleave="mouseleave(data)"
+      >
+        <span>{{ node.label }}</span>
+        <el-link
+          v-show="data.show"
+          size="mini"
+          style="margin-left: 5px"
+          type="primary"
+          icon="el-icon-plus"
+        ></el-link>
+        <el-link
+          v-show="data.show"
+          size="mini"
+          style="margin-left: 5px"
+          type="primary"
+          icon="el-icon-delete"
+        ></el-link>
+      </span>
+    </el-tree>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  name: "Dashboard",
+  computed: {
+    ...mapGetters(["name"]),
+  },
+  data() {
+    return {
+      data: [
+        {
+          id: 0,
+          label: "水果",
+          show: false,
+          children: [
+            {
+              id: 1,
+              label: "苹果",
+              show: false,
+            },
+            {
+              id: 2,
+              label: "芒果",
+              show: false,
+            },
+          ],
+        },
+      ],
+    };
+  },
+  methods: {
+    mouseenter(data) {
+      alert(1)
+      console.log(data);
+      data.show = true;
+    },
+
+    mouseleave(data) {
+      console.log(data);
+      data.show = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dashboard {
+  &-container {
+    margin: 30px;
+  }
+  &-text {
+    font-size: 30px;
+    line-height: 46px;
+  }
+}
+</style>

.history/src/views/planOutage/dialogComponent_20210929151948.vue

@@ -0,0 +1,206 @@
+<template>
+  <transition name="dialog-fade">
+    <el-dialog
+      v-if="showDialog"
+      :title="dialogTitle"
+      class="dialog-component"
+      :visible.sync="showDialog"
+      width="640px"
+      @close="closeDialog(0)"
+    >
+      <el-form
+        ref="formInfo"
+        :model="formInfo"
+        class="demo-form-inline"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="站点名称：" prop="watchName" label-width="150px">
+          <el-input v-model="formInfo.watchName"></el-input>
+        </el-form-item>
+        <el-form-item label="开始停电时间：" prop="watchCode" label-width="150px">
+          <el-input v-model="formInfo.watchCode"></el-input >
+        </el-form-item>
+        <el-form-item label="结束停电时间:" prop="routeAddress" label-width="150px">
+          <el-select
+            v-model="formInfo.routeAddress"
+            multiple
+            filterable
+            collapse-tags
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="提交时间：" prop="ratedVoltage" label-width="150px">
+          <el-input v-model="formInfo.ratedVoltage"></el-input>
+        </el-form-item>
+        <el-form-item label="提交人：" prop="stationAddress" label-width="150px">
+          <el-input v-model="formInfo.ratedCurrent"></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="fzlMx" label-width="150px">
+          <el-input v-model="formInfo.fzlMx"></el-input>
+        </el-form-item>
+ 
+        
+        <br />
+        <br />
+        <br />
+        <div style="text-align: right">
+          <el-button @click="closeDialog(0)">取消</el-button>
+          <el-button type="primary" @click="submitForm('formInfo')"
+            >保存</el-button
+          >
+        </div>
+      </el-form>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+
+
+
+
+export default {
+  name: "DialogComponent",
+  props: {
+    dialogTitle: {
+      type: String,
+      default: "新增",
+    },
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+       checked: true,
+      showDialog: false,
+      formInfo: JSON.parse(JSON.stringify(this.itemInfo)),
+      options: [
+        {
+          value: "选项1",
+          label: "站点一",
+        },
+        {
+          value: "选项2",
+          label: "站点二",
+        },
+        {
+          value: "选项3",
+          label: "站点三",
+        },
+        {
+          value: "选项4",
+          label: "站点四",
+        },
+        {
+          value: "选项5",
+          label: "站点五",
+        },
+      ],
+
+      rules: {
+        watchName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: "请输入站点名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        watchCode: [
+          { required: true, message: "请输入开始停电时间", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        routeAddress: [
+          { required: true, message: "请选则结束停电时间", trigger: "change" },
+         
+        ],
+        ratedVoltage: [
+          { required: true, message: '请选择站点列表', trigger: 'change'}
+        
+        ],
+        ratedCurrent: [
+          { required: true, message: "请输入已选站点个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+        fzlMx: [
+          { required: true, message: "请输入挂载设备个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    roleValid(rule, value, callback) {
+      if (value.length === 0) {
+        callback(new Error("角色不能为空"));
+      } else {
+        callback();
+      }
+    },
+
+    // onSelectedDrug(event) {
+    //   this.routeAddress = event;
+    //   console.log(this.routeAddress);
+    // },
+    // 保存操作
+    submitForm(formName) {
+      const that = this;
+      const params = Object.assign(that.formInfo, {});
+      that.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 走保存请求
+          that.$message({
+            message: "操作成功！",
+            type: "success",
+          });
+          that.closeDialog(1);
+        } else {
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    closeDialog(flag) {
+      this.$refs["formInfo"].resetFields();
+      this.showDialog = false;
+      this.$emit("closeDialog", flag);
+    },
+  },
+};
+</script>
+ 
+<style scoped lang="scss">
+.el-input,
+.el-select {
+  width: 240px;
+}
+
+// label样式
+.el-form-item__label {
+    width: 150px
+}
+.el-form-item__content {
+    margin-left: 150px
+}
+</style>

.history/src/views/planOutage/dialogComponent_20210929171131.vue

@@ -0,0 +1,206 @@
+<template>
+  <transition name="dialog-fade">
+    <el-dialog
+      v-if="showDialog"
+      :title="dialogTitle"
+      class="dialog-component"
+      v-model="showDialog"
+      width="640px"
+      @close="closeDialog(0)"
+    >
+      <el-form
+        ref="formInfo"
+        :model="formInfo"
+        class="demo-form-inline"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="站点名称：" prop="watchName" label-width="150px">
+          <el-input v-model="formInfo.watchName"></el-input>
+        </el-form-item>
+        <el-form-item label="开始停电时间：" prop="watchCode" label-width="150px">
+          <el-input v-model="formInfo.watchCode"></el-input >
+        </el-form-item>
+        <el-form-item label="结束停电时间:" prop="routeAddress" label-width="150px">
+          <el-select
+            v-model="formInfo.routeAddress"
+            multiple
+            filterable
+            collapse-tags
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="提交时间：" prop="ratedVoltage" label-width="150px">
+          <el-input v-model="formInfo.ratedVoltage"></el-input>
+        </el-form-item>
+        <el-form-item label="提交人：" prop="stationAddress" label-width="150px">
+          <el-input v-model="formInfo.ratedCurrent"></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="fzlMx" label-width="150px">
+          <el-input v-model="formInfo.fzlMx"></el-input>
+        </el-form-item>
+ 
+        
+        <br />
+        <br />
+        <br />
+        <div style="text-align: right">
+          <el-button @click="closeDialog(0)">取消</el-button>
+          <el-button type="primary" @click="submitForm('formInfo')"
+            >保存</el-button
+          >
+        </div>
+      </el-form>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+
+
+
+
+export default {
+  name: "DialogComponent",
+  props: {
+    dialogTitle: {
+      type: String,
+      default: "新增",
+    },
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+       checked: true,
+      showDialog: false,
+      formInfo: JSON.parse(JSON.stringify(this.itemInfo)),
+      options: [
+        {
+          value: "选项1",
+          label: "站点一",
+        },
+        {
+          value: "选项2",
+          label: "站点二",
+        },
+        {
+          value: "选项3",
+          label: "站点三",
+        },
+        {
+          value: "选项4",
+          label: "站点四",
+        },
+        {
+          value: "选项5",
+          label: "站点五",
+        },
+      ],
+
+      rules: {
+        watchName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: "请输入站点名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        watchCode: [
+          { required: true, message: "请输入开始停电时间", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        routeAddress: [
+          { required: true, message: "请选则结束停电时间", trigger: "change" },
+         
+        ],
+        ratedVoltage: [
+          { required: true, message: '请选择站点列表', trigger: 'change'}
+        
+        ],
+        ratedCurrent: [
+          { required: true, message: "请输入已选站点个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+        fzlMx: [
+          { required: true, message: "请输入挂载设备个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    roleValid(rule, value, callback) {
+      if (value.length === 0) {
+        callback(new Error("角色不能为空"));
+      } else {
+        callback();
+      }
+    },
+
+    // onSelectedDrug(event) {
+    //   this.routeAddress = event;
+    //   console.log(this.routeAddress);
+    // },
+    // 保存操作
+    submitForm(formName) {
+      const that = this;
+      const params = Object.assign(that.formInfo, {});
+      that.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 走保存请求
+          that.$message({
+            message: "操作成功！",
+            type: "success",
+          });
+          that.closeDialog(1);
+        } else {
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    closeDialog(flag) {
+      this.$refs["formInfo"].resetFields();
+      this.showDialog = false;
+      this.$emit("closeDialog", flag);
+    },
+  },
+};
+</script>
+ 
+<style scoped lang="scss">
+.el-input,
+.el-select {
+  width: 240px;
+}
+
+// label样式
+.el-form-item__label {
+    width: 150px
+}
+.el-form-item__content {
+    margin-left: 150px
+}
+</style>

.history/src/views/planOutage/dialogComponent_20210929171322.vue

@@ -0,0 +1,205 @@
+<template>
+  <transition name="dialog-fade">
+    <el-dialog
+      v-if="showDialog"
+      :title="dialogTitle"
+      class="dialog-component"
+      v-model="showDialog"
+      width="640px"
+      @close="closeDialog(0)"
+    >
+      <el-form
+        ref="formInfo"
+        :model="formInfo"
+        class="demo-form-inline"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="站点名称：" prop="watchName" label-width="150px">
+          <el-input v-model="formInfo.watchName"></el-input>
+        </el-form-item>
+        <el-form-item label="开始停电时间：" prop="watchCode" label-width="150px">
+          <el-input v-model="formInfo.watchCode"></el-input >
+        </el-form-item>
+        <el-form-item label="结束停电时间:" prop="routeAddress" label-width="150px">
+          <el-select
+            v-model="formInfo.routeAddress"
+            multiple
+            filterable
+            collapse-tags
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="提交时间：" prop="ratedVoltage" label-width="150px">
+          <el-input v-model="formInfo.ratedVoltage"></el-input>
+        </el-form-item>
+        <el-form-item label="提交人：" prop="stationAddress" label-width="150px">
+          <el-input v-model="formInfo.ratedCurrent"></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="fzlMx" label-width="150px">
+          <el-input v-model="formInfo.fzlMx"></el-input>
+        </el-form-item>
+ 
+        
+        <br />
+        <br />
+        <br />
+        <div style="text-align: right">
+          <el-button @click="closeDialog(0)">取消</el-button>
+          <el-button type="primary" @click="submitForm('formInfo')"
+            >保存</el-button
+          >
+        </div>
+      </el-form>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+
+
+
+
+export default {
+  name: "DialogComponent",
+  props: {
+    dialogTitle: {
+      type: String,
+      default: "新增",
+    },
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+       checked: true,
+      showDialog: false,
+      formInfo: JSON.parse(JSON.stringify(this.itemInfo)),
+      options: [
+        {
+          value: "选项1",
+          label: "站点一",
+        },
+        {
+          value: "选项2",
+          label: "站点二",
+        },
+        {
+          value: "选项3",
+          label: "站点三",
+        },
+        {
+          value: "选项4",
+          label: "站点四",
+        },
+        {
+          value: "选项5",
+          label: "站点五",
+        },
+      ],
+
+      rules: {
+        watchName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: "请输入站点名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        watchCode: [
+          { required: true, message: "请输入开始停电时间", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        routeAddress: [
+          { required: true, message: "请选则结束停电时间", trigger: "change" },
+         
+        ],
+        ratedVoltage: [
+          { required: true, message: '请选择站点列表', trigger: 'change'}
+        
+        ],
+        ratedCurrent: [
+          { required: true, message: "请输入已选站点个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+        fzlMx: [
+          { required: true, message: "请输入挂载设备个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    roleValid(rule, value, callback) {
+      if (value.length === 0) {
+        callback(new Error("角色不能为空"));
+      } else {
+        callback();
+      }
+    },
+
+    // onSelectedDrug(event) {
+    //   this.routeAddress = event;
+    //   console.log(this.routeAddress);
+    // },
+    // 保存操作
+    submitForm(formName) {
+      const params = Object.assign(this.formInfo, {});
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 走保存请求
+          this.$message({
+            message: "操作成功！",
+            type: "success",
+          });
+          this.closeDialog(1);
+        } else {
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    closeDialog(flag) {
+      this.$refs["formInfo"].resetFields();
+      this.showDialog = false;
+      this.$emit("closeDialog", flag);
+    },
+  },
+};
+</script>
+ 
+<style scoped lang="scss">
+.el-input,
+.el-select {
+  width: 240px;
+}
+
+// label样式
+.el-form-item__label {
+    width: 150px
+}
+.el-form-item__content {
+    margin-left: 150px
+}
+</style>

.history/src/views/planOutage/index_20210929154148.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.native.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/planOutage/index_20210929170406.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.native.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/planOutage/index_20210929170717.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <!-- <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option> -->
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.native.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/planOutage/index_20210929170811.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.native.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

.history/src/views/planOutage/index_20210929171114.vue

@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template #default="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
+  </div>
+</template>
+
+<script>
+import DialogComponent from "./dialogComponent";
+
+export default {
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/assets/css/index.scss

@@ -3,7 +3,6 @@
 // @import './transition.scss';
 @import './element-variables.scss';
 // @import './sidebar.scss';
-
 body {
     height: 100%;
     -moz-osx-font-smoothing: grayscale;
@@ -153,7 +152,6 @@ div:focus {
 //     width: 400px;
 //     margin: 0 auto 20px;
 // }
-
 // 弹框样式end
 // 台区列表
 .siteTitle {

src/views/alarmManage/dialogComponent.vue

@@ -0,0 +1,205 @@
+<template>
+  <transition name="dialog-fade">
+    <el-dialog
+      v-if="showDialog"
+      :title="dialogTitle"
+      class="dialog-component"
+      v-model="showDialog"
+      width="640px"
+      @close="closeDialog(0)"
+    >
+      <el-form
+        ref="formInfo"
+        :model="formInfo"
+        class="demo-form-inline"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="站点名称：" prop="watchName" label-width="150px">
+          <el-input v-model="formInfo.watchName"></el-input>
+        </el-form-item>
+        <el-form-item label="开始停电时间：" prop="watchCode" label-width="150px">
+          <el-input v-model="formInfo.watchCode"></el-input >
+        </el-form-item>
+        <el-form-item label="结束停电时间:" prop="routeAddress" label-width="150px">
+          <el-select
+            v-model="formInfo.routeAddress"
+            multiple
+            filterable
+            collapse-tags
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="提交时间：" prop="ratedVoltage" label-width="150px">
+          <el-input v-model="formInfo.ratedVoltage"></el-input>
+        </el-form-item>
+        <el-form-item label="提交人：" prop="stationAddress" label-width="150px">
+          <el-input v-model="formInfo.ratedCurrent"></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="fzlMx" label-width="150px">
+          <el-input v-model="formInfo.fzlMx"></el-input>
+        </el-form-item>
+ 
+        
+        <br />
+        <br />
+        <br />
+        <div style="text-align: right">
+          <el-button @click="closeDialog(0)">取消</el-button>
+          <el-button type="primary" @click="submitForm('formInfo')"
+            >保存</el-button
+          >
+        </div>
+      </el-form>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+
+
+
+
+export default {
+  name: "DialogComponent",
+  props: {
+    dialogTitle: {
+      type: String,
+      default: "新增",
+    },
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+       checked: true,
+      showDialog: false,
+      formInfo: JSON.parse(JSON.stringify(this.itemInfo)),
+      options: [
+        {
+          value: "选项1",
+          label: "站点一",
+        },
+        {
+          value: "选项2",
+          label: "站点二",
+        },
+        {
+          value: "选项3",
+          label: "站点三",
+        },
+        {
+          value: "选项4",
+          label: "站点四",
+        },
+        {
+          value: "选项5",
+          label: "站点五",
+        },
+      ],
+
+      rules: {
+        watchName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: "请输入站点名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        watchCode: [
+          { required: true, message: "请输入开始停电时间", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        routeAddress: [
+          { required: true, message: "请选则结束停电时间", trigger: "change" },
+         
+        ],
+        ratedVoltage: [
+          { required: true, message: '请选择站点列表', trigger: 'change'}
+        
+        ],
+        ratedCurrent: [
+          { required: true, message: "请输入已选站点个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+        fzlMx: [
+          { required: true, message: "请输入挂载设备个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    roleValid(rule, value, callback) {
+      if (value.length === 0) {
+        callback(new Error("角色不能为空"));
+      } else {
+        callback();
+      }
+    },
+
+    // onSelectedDrug(event) {
+    //   this.routeAddress = event;
+    //   console.log(this.routeAddress);
+    // },
+    // 保存操作
+    submitForm(formName) {
+      const params = Object.assign(this.formInfo, {});
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 走保存请求
+          this.$message({
+            message: "操作成功！",
+            type: "success",
+          });
+          this.closeDialog(1);
+        } else {
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    closeDialog(flag) {
+      this.$refs["formInfo"].resetFields();
+      this.showDialog = false;
+      this.$emit("closeDialog", flag);
+    },
+  },
+};
+</script>
+ 
+<style scoped lang="scss">
+.el-input,
+.el-select {
+  width: 240px;
+}
+
+// label样式
+.el-form-item__label {
+    width: 150px
+}
+.el-form-item__content {
+    margin-left: 150px
+}
+</style>

src/views/alarmManage/index.vue

@@ -1,30 +1,255 @@
 <template>
   <div class="app-container">
-    <div >告警管理</div>
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">告警管理列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template #default="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
   </div>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
+import DialogComponent from "./dialogComponent";
 
 export default {
-  name: 'Dashboard',
-  computed: {
-    ...mapGetters([
-      'name'
-    ])
-  }
-}
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-.dashboard {
-  &-container {
-    margin: 30px;
-  }
-  &-text {
-    font-size: 30px;
-    line-height: 46px;
-  }
-}
 </style>

src/views/monthReport/index.vue

@@ -5,7 +5,7 @@
     <el-tree default-expand-all :data="data">
       <span
         class="custom-tree-node"
-        slot-scope="{ node, data }"
+        :default-slot="{node,data}"
         style="width: 100%"
         @mouseenter="mouseenter(data)"
         @mouseleave="mouseleave(data)"

src/views/planOutage/dialogComponent.vue

@@ -0,0 +1,205 @@
+<template>
+  <transition name="dialog-fade">
+    <el-dialog
+      v-if="showDialog"
+      :title="dialogTitle"
+      class="dialog-component"
+      v-model="showDialog"
+      width="640px"
+      @close="closeDialog(0)"
+    >
+      <el-form
+        ref="formInfo"
+        :model="formInfo"
+        class="demo-form-inline"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="站点名称：" prop="watchName" label-width="150px">
+          <el-input v-model="formInfo.watchName"></el-input>
+        </el-form-item>
+        <el-form-item label="开始停电时间：" prop="watchCode" label-width="150px">
+          <el-input v-model="formInfo.watchCode"></el-input >
+        </el-form-item>
+        <el-form-item label="结束停电时间:" prop="routeAddress" label-width="150px">
+          <el-select
+            v-model="formInfo.routeAddress"
+            multiple
+            filterable
+            collapse-tags
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="提交时间：" prop="ratedVoltage" label-width="150px">
+          <el-input v-model="formInfo.ratedVoltage"></el-input>
+        </el-form-item>
+        <el-form-item label="提交人：" prop="stationAddress" label-width="150px">
+          <el-input v-model="formInfo.ratedCurrent"></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="fzlMx" label-width="150px">
+          <el-input v-model="formInfo.fzlMx"></el-input>
+        </el-form-item>
+ 
+        
+        <br />
+        <br />
+        <br />
+        <div style="text-align: right">
+          <el-button @click="closeDialog(0)">取消</el-button>
+          <el-button type="primary" @click="submitForm('formInfo')"
+            >保存</el-button
+          >
+        </div>
+      </el-form>
+    </el-dialog>
+  </transition>
+</template>
+
+<script>
+
+
+
+
+export default {
+  name: "DialogComponent",
+  props: {
+    dialogTitle: {
+      type: String,
+      default: "新增",
+    },
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+       checked: true,
+      showDialog: false,
+      formInfo: JSON.parse(JSON.stringify(this.itemInfo)),
+      options: [
+        {
+          value: "选项1",
+          label: "站点一",
+        },
+        {
+          value: "选项2",
+          label: "站点二",
+        },
+        {
+          value: "选项3",
+          label: "站点三",
+        },
+        {
+          value: "选项4",
+          label: "站点四",
+        },
+        {
+          value: "选项5",
+          label: "站点五",
+        },
+      ],
+
+      rules: {
+        watchName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: "请输入站点名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        watchCode: [
+          { required: true, message: "请输入开始停电时间", trigger: "blur" },
+          {
+            min: 3,
+            max: 6,
+            message: "用户名长度在 3 到 6 个字符",
+            trigger: "blur",
+          },
+        ],
+        routeAddress: [
+          { required: true, message: "请选则结束停电时间", trigger: "change" },
+         
+        ],
+        ratedVoltage: [
+          { required: true, message: '请选择站点列表', trigger: 'change'}
+        
+        ],
+        ratedCurrent: [
+          { required: true, message: "请输入已选站点个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+        fzlMx: [
+          { required: true, message: "请输入挂载设备个数", trigger: "blur" },
+          { trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    roleValid(rule, value, callback) {
+      if (value.length === 0) {
+        callback(new Error("角色不能为空"));
+      } else {
+        callback();
+      }
+    },
+
+    // onSelectedDrug(event) {
+    //   this.routeAddress = event;
+    //   console.log(this.routeAddress);
+    // },
+    // 保存操作
+    submitForm(formName) {
+      const params = Object.assign(this.formInfo, {});
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 走保存请求
+          this.$message({
+            message: "操作成功！",
+            type: "success",
+          });
+          this.closeDialog(1);
+        } else {
+          return false;
+        }
+      });
+    },
+    // 关闭弹框
+    closeDialog(flag) {
+      this.$refs["formInfo"].resetFields();
+      this.showDialog = false;
+      this.$emit("closeDialog", flag);
+    },
+  },
+};
+</script>
+ 
+<style scoped lang="scss">
+.el-input,
+.el-select {
+  width: 240px;
+}
+
+// label样式
+.el-form-item__label {
+    width: 150px
+}
+.el-form-item__content {
+    margin-left: 150px
+}
+</style>

src/views/planOutage/index.vue

@@ -1,30 +1,255 @@
 <template>
-  <div class="dashboard-container">
-    <div class="dashboard-text">计划停电</div>
+  <div class="app-container">
+    <!-- 筛选start -->
+    <div class="filter-container mb-20">
+      <div class="left">
+        <div>
+          <a class="" style="margin-right: 30px">计划停电列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()"
+            >新增</el-button
+          >
+        </div>
+
+        <div style="margin-top: 20px">
+          <div class="filter-item">
+            选择时间范围：
+            <el-date-picker
+              v-model="value1"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              style="width:auto"
+            >
+            </el-date-picker>
+          </div>
+          <div class="filter-item">
+            状态:
+            <el-select
+              v-model="region"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option label="已执行" value="1"></el-option>
+              <el-option label="未执行" value="2"></el-option>
+            </el-select>
+          </div>
+          <el-button type="primary" icon="el-icon-search" class="search-button"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+
+      <div class="right">
+        <el-button type="primary">导入</el-button>
+      </div>
+    </div>
+    <!-- 筛选end -->
+
+    <!-- 表格start -->
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+  
+    >
+      <el-table-column prop="xh" label="序号" width="">
+      </el-table-column>
+      <el-table-column prop="siteName" label="站点名称" width="">
+      </el-table-column>
+      <el-table-column prop="startTime" label="开始停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="endTime" label="结束停电时间" width="">
+      </el-table-column>
+      <el-table-column prop="subTime" label="提交时间" width="">
+      </el-table-column>
+      <el-table-column prop="submitter" label="提交人" width="">
+      </el-table-column>
+      <el-table-column prop="status" label="状态" width="">
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="180">
+        <template #default="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.prevent="editRow(scope.row)"
+            >修改</el-button
+          >
+          <el-button
+            @click="handleDelete(scope.$index, scope.row)"
+            type="text"
+            size="small"
+            class="delete-text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 表格end -->
+
+    <!-- 分页start -->
+    <div class="paginationBlock">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage4"
+        :page-sizes="[100, 200, 300, 400]"
+        :page-size="100"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 分页end -->
+
+    <!--弹框组件开始-----------------------start-->
+    <dialog-component
+      v-if="showDialog"
+      ref="dialogComponent"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
+      @closeDialog="closeDialog"
+    ></dialog-component>
+    <!--弹框组件开始-----------------------end-->
   </div>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
+import DialogComponent from "./dialogComponent";
 
 export default {
-  name: 'Dashboard',
-  computed: {
-    ...mapGetters([
-      'name'
-    ])
-  }
-}
+  name: "VariableList",
+
+  components: { DialogComponent },
+
+  data() {
+    return {
+      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      select: 1,
+      currentPage4: 4,
+
+      showDialog: false,
+      tabPosition: "one",
+
+      input: "",
+      region: "",
+      tableData: [
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+        {
+           xh: "1",
+          siteName: "测试站点1",
+          startTime: "2020-02-02 12:00:00",
+          endTime: "2020-02-02 12:00:00",
+          subTime: "2020-02-02 12:00:00",
+          submitter: "张三",
+          status: "未执行",
+        },
+       
+      ],
+    };
+  },
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+
+    // 表头样式设置
+    goVariableList() {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: "../siteManage/variableList/index.vue",
+      });
+      // this.$router.push({ name:'variableList'})
+    },
+    headClass() {
+      return "background:#FAFAFA;";
+    },
+
+    // 添加操作
+    addItem() {
+      this.tableItem = {
+        id: "",
+        stationName: "",
+        xh: "",
+        siteName: "",
+        siteList: [],
+        done: "",
+        guaZai: "",
+        checked: true,
+      };
+      this.dialogTitle = "新增";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 编辑操作
+    editRow(row) {
+      console.log(row);
+      this.tableItem = row;
+      this.dialogTitle = "编辑";
+      this.showDialog = true;
+      this.$nextTick(() => {
+        this.$refs["dialogComponent"].showDialog = true;
+      });
+    },
+    // 关闭操作
+    closeDialog(flag) {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData();
+      }
+      this.showDialog = false;
+    },
+
+    //删除操作
+    handleDelete(index, row) {
+      console.log(index, row);
+      alert(index);
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-.dashboard {
-  &-container {
-    margin: 30px;
-  }
-  &-text {
-    font-size: 30px;
-    line-height: 46px;
-  }
-}
 </style>