diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index e06a711ad528b05d0d77253779f7ca33926a7b14..e6911d00ba61de35387947de50487b40f4f8bd8e 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -1,116 +1,96 @@
 [v-cloak] {
-    display: none;
+  display: none;
 }
 
-
 /* 新增按钮颜色 */
-
 .form-group .el-button--primary {
-    background-color: #264dd9 !important;
-    border-color: #264dd9 !important;
+  background-color: #264dd9 !important;
+  border-color: #264dd9 !important;
 }
 
-
 /* 返回按钮颜色 */
-
 .from_return>.el-button--primary {
-    background-color: #edf0ff !important;
-    border-color: #edf0ff !important;
-    color: #264dd9 !important;
+  background-color: #edf0ff !important;
+  border-color: #edf0ff !important;
+  color: #264dd9 !important;
 }
 
-
 /* 取消按钮颜色 */
-
 .form_c {
-    background-color: #dde4ff !important;
-    border-color: #dde4ff !important;
-    color: #264dd9 !important;
+  background-color: #dde4ff !important;
+  border-color: #dde4ff !important;
+  color: #264dd9 !important;
 }
 
-
 /* 确定按钮颜色 */
-
 .form_t {
-    background-color: #264dd9 !important;
-    border-color: #264dd9 !important;
-    color: #f4f7fc !important;
+  background-color: #264dd9 !important;
+  border-color: #264dd9 !important;
+  color: #f4f7fc !important;
 }
 
-
 /* 搜索框颜色 */
-
 .form-group .el-input__inner {
-    border-radius: 28px !important;
-    border: 1px solid #bcc1d0 !important;
-    background: #f4f7fc !important;
-    color: #8890a7 !important;
+  border-radius: 28px !important;
+  border: 1px solid #bcc1d0 !important;
+  background: #f4f7fc !important;
+  color: #8890a7 !important;
 }
 
 .drawer_return .el-input__inner {
-    border-radius: 28px !important;
-    border: 1px solid #bcc1d0 !important;
-    background: #f4f7fc !important;
-    color: #8890a7 !important;
+  border-radius: 28px !important;
+  border: 1px solid #bcc1d0 !important;
+  background: #f4f7fc !important;
+  color: #8890a7 !important;
 }
 
-
 /* 多行文本框样式 */
-
 .jbxx_desc textarea {
-    height: 150px !important;
-    border-radius: 8px !important;
-    border-color: #bcc1d0 !important;
-    outline: none !important;
-    resize: none !important;
+  height: 150px !important;
+  border-radius: 8px !important;
+  border-color: #bcc1d0 !important;
+  outline: none !important;
+  resize: none !important;
 }
 
-
 /* 面包屑文字大小 */
-
 .el-breadcrumb {
-    font-size: 14px;
-    color: #898d9e;
+  font-size: 14px;
+  color: #898d9e;
 }
 
-
 /* 编辑颜色*/
-
 .primary-edit {
-    color: #264dd9;
-    cursor: pointer;
+  color: #264dd9;
+  cursor: pointer;
 }
 
-
 /* 删除颜色 */
-
 .primary-del {
-    color: #264dd9;
-    cursor: pointer;
+  color: #264dd9;
+  cursor: pointer;
 }
 
 .space_bet {}
 
-
 /* reset */
-
 html {}
 
 html,
 body {
-    margin: 0;
-    font-family: Microsoft YaHei, sans-serif;
-    /* font-size: 17px; */
+  margin: 0;
+  font-family: Microsoft YaHei, sans-serif;
+  /* font-size: 17px; */
 }
 
 ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
+  list-style: none;
+  padding: 0;
+  margin: 0;
 }
 
 p {
-    margin: 0;
+  margin: 0;
 }
 
 h1,
@@ -118,264 +98,249 @@ h2,
 h3,
 h4,
 h5 {
-    margin: 0;
-    font-weight: normal;
+  margin: 0;
+  font-weight: normal;
 }
 
 h1 {
-    font-size: 32px;
+  font-size: 32px;
 }
 
 h2 {
-    font-size: 24px;
+  font-size: 24px;
 }
 
 h3 {
-    font-size: 18.7px;
+  font-size: 18.7px;
 }
 
 h4 {
-    font-size: 16px;
+  font-size: 16px;
 }
 
 div {
-    box-sizing: border-box;
+  box-sizing: border-box;
 }
 
-
 /* reset end */
 
-
 /* common */
-
-
 /* #app {
   height: 100%;
   overflow: hidden;
 } */
 
 .text_clip {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
+  white-space: nowrap;
 }
 
 .text_clip_2 {
-    text-overflow: -o-ellipsis-lastline;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    line-clamp: 2;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  line-clamp: 2;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
 }
 
 .map_container {
-    background-color: #eee;
+  background-color: #eee;
 }
 
 .ss_card {
-    padding: 1.2rem;
-    display: flex;
-    justify-content: flex-start;
-    align-items: flex-start;
+  padding: 1.2rem;
+  display: flex;
+  justify-content: flex-start;
+  align-items: flex-start;
 }
 
 .ss_card>.sc_left_container {
-    width: 6rem;
-    height: 6rem;
-    flex-shrink: 0;
-    border-radius: 0.5rem;
-    overflow: hidden;
-    font-size: 0;
+  width: 6rem;
+  height: 6rem;
+  flex-shrink: 0;
+  border-radius: 0.5rem;
+  overflow: hidden;
+  font-size: 0;
 }
 
 .ss_card>.sc_right_container {
-    width: calc(100% - 7rem);
-    flex-grow: 1;
-    margin-left: 1.2rem;
+  width: calc(100% - 7rem);
+  flex-grow: 1;
+  margin-left: 1.2rem;
 }
 
 .ss_card>.sc_right_container>.sc_title {
-    font-size: 1.6rem;
-    font-weight: bold;
-    line-height: 2.6rem;
+  font-size: 1.6rem;
+  font-weight: bold;
+  line-height: 2.6rem;
 }
 
 .ss_card>.sc_right_container>.sc_info {
-    display: flex;
-    justify-content: space-between;
+  display: flex;
+  justify-content: space-between;
 }
 
 .form-group {
-    padding: 20px 20px 15px;
-    box-sizing: border-box;
-    border-bottom: 1px solid #edf0ff;
+  padding: 20px 20px 15px;
+  box-sizing: border-box;
+  border-bottom: 1px solid #edf0ff;
 }
 
 .padding_table {
-    padding: 0 20px;
+  padding: 0 20px;
 }
 
-
 /* 设置抽屉的样式 */
-
 .el-drawer__header {
-    display: none;
+  display: none;
 }
 
 .from_return {
-    text-align: center;
-    padding: 18px 20px 10px;
-    border-bottom: 1px solid #edf0ff;
-    position: relative;
+  text-align: center;
+  padding: 18px 20px 10px;
+  border-bottom: 1px solid #edf0ff;
+  position: relative;
 }
 
 .from_return>.el-button--primary {
-    position: absolute;
-    top: 15px;
-    left: 20px;
+  position: absolute;
+  top: 15px;
+  left: 20px;
 }
 
 .from_return>span {
-    color: #1a2236;
-    font-size: 16px;
+  color: #1a2236;
+  font-size: 16px;
 }
 
 .demo-drawer__content .el-form-item__label {
-    color: #242c43;
+  color: #242c43;
 }
 
 .demo-drawer__content .el-input__inner {
-    border: 1px solid #bcc1d0;
-    border-radius: 17px;
-    color: #58617a;
-    background: #fff;
+  border: 1px solid #bcc1d0;
+  border-radius: 17px;
+  color: #58617a;
+  background: #fff;
 }
 
 .demo-drawer__footer {
-    text-align: right;
-    padding-right: 40px;
-    margin-top: 40px;
+  text-align: right;
+  padding-right: 40px;
+  margin-top: 40px;
 }
 
 .el-form-item__error {
-    font-size: 11px;
+  font-size: 11px;
 }
 
-
 /* 设置提示弹窗的样式 */
-
 .el-dialog {
-    border-radius: 6px;
-    margin-top: 240px;
+  border-radius: 6px;
+  margin-top: 240px;
 }
 
 .el-dialog__header {
-    border-bottom: 1px solid #edf0ff;
-    padding: 16px;
-    margin-right: 0;
+  border-bottom: 1px solid #edf0ff;
+  padding: 16px;
+  margin-right: 0;
 }
 
 .el-dialog__title {
-    font-size: 18px;
-    font-weight: 700;
-    color: #1d1e20;
-    padding-left: 12px;
-    position: relative;
+  font-size: 18px;
+  font-weight: 700;
+  color: #1d1e20;
+  padding-left: 12px;
+  position: relative;
 }
 
 .el-dialog__title::before {
-    content: "";
-    position: absolute;
-    width: 4px;
-    height: 16px;
-    border-radius: 2px;
-    background-color: #515fe7;
-    left: 0;
-    top: 5px;
+  content: "";
+  position: absolute;
+  width: 4px;
+  height: 16px;
+  border-radius: 2px;
+  background-color: #515fe7;
+  left: 0;
+  top: 5px;
 }
 
 .el-dialog__headerbtn .el-dialog__close {
-    color: #8890a7;
+  color: #8890a7;
 }
 
 .el-dialog__headerbtn:focus .el-dialog__close,
 .el-dialog__headerbtn:hover .el-dialog__close {
-    color: #515fe7;
+  color: #515fe7;
 }
 
 .el-dialog__body {
-    font-size: 16px;
-    color: #404a62;
-    text-align: center;
-    padding: 0 16px;
-    line-height: 1;
+  font-size: 16px;
+  color: #404a62;
+  text-align: center;
+  padding: 0 20px;
+  line-height: 1;
 }
 
 .dialog_box .el-dialog__body {
-    padding: 24px;
+  padding: 24px;
 }
 
 .dialog_box .el-dialog__footer {
-    padding: 16px;
+  padding: 16px;
 }
 
 .dialog_box1 .el-dialog__body {
-    padding: 16px;
+  padding: 16px;
 }
 
-
 /* 设置tab切换的样式 */
-
 .el-tabs__item.is-disabled {
-    color: #8890a7 !important;
+  color: #8890a7 !important;
 }
 
 .el-tabs__item {
-    font-size: 14px;
-    color: #404a62;
-    line-height: 14px !important;
+  font-size: 14px;
+  color: #404a62;
+  line-height: 14px !important;
 }
 
-
 /* .el-tabs__nav-scroll {
   height: 35px;
 } */
-
 .el-tabs__nav-scroll .el-tabs__nav {
-    height: 40px;
+  height: 40px;
 }
 
 .el-tabs__nav-scroll .el-tabs__item {
-    line-height: 14px !important;
-    height: 40px !important;
+  line-height: 14px !important;
+  height: 40px !important;
 }
 
 .el-tabs__item:hover {
-    color: #404a62;
+  color: #404a62;
 }
 
 .el-tabs__item.is-active {
-    color: #3759be !important;
+  color: #3759be !important;
 }
 
 .el-tabs__active-bar {
-    height: 3px;
-    border-radius: 1px;
-    background-color: #2b4695 !important;
+  height: 3px;
+  border-radius: 1px;
+  background-color: #2b4695 !important;
 }
 
 .el-tabs__nav-wrap::after {
-    height: 1px;
-    background-color: #edf0ff;
+  height: 1px;
+  background-color: #edf0ff;
 }
 
-
 /* 设置tree的样式 */
-
-
 /* .el-tree {
   position: static!important;
 }
@@ -384,11 +349,9 @@ div {
 }
 .el-tree-node__content:hover {
   background-image: linear-gradient(90deg,
-		rgba(255, 255, 255, 0.05) 83%,
-		rgba(0, 0, 0, 0.05) 86%);
+        rgba(255, 255, 255, 0.05) 83%,
+        rgba(0, 0, 0, 0.05) 86%);
 } */
-
-
 /* .usrrole .el-tree-node:focus>.el-tree-node__content{
   background: rgb(248, 249, 253) !important;
 }
@@ -430,164 +393,151 @@ border-radius:8px;
   border-bottom-left-radius:0;
   border-bottom-right-radius:0;
 } */
-
-
 /* 左右布局 */
-
 .flex {
-    height: 100%;
-    display: -webkit-box;
-    /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
-    display: -moz-box;
-    /* Firefox 17- */
-    display: -webkit-flex;
-    /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
-    display: -moz-flex;
-    /* Firefox 18+ */
-    display: -ms-flexbox;
-    /* IE 10 */
-    display: flex;
-    /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
+  height: 100%;
+  display: -webkit-box;
+  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
+  display: -moz-box;
+  /* Firefox 17- */
+  display: -webkit-flex;
+  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
+  display: -moz-flex;
+  /* Firefox 18+ */
+  display: -ms-flexbox;
+  /* IE 10 */
+  display: flex;
+  /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
 }
 
 .flex-left {
-    width: 178px;
-    background-color: #1a2236;
-    height: 100%;
+  width: 178px;
+  background-color: #1a2236;
+  height: 100%;
 }
 
 .flex-right {
-    padding: 0 20px 20px;
-    box-sizing: border-box;
-    -webkit-box-flex: auto;
-    -ms-flex: auto;
-    -webkit-flex: auto;
-    flex: 1;
-    overflow-y: auto;
+  padding: 0 20px 20px;
+  box-sizing: border-box;
+  -webkit-box-flex: auto;
+  -ms-flex: auto;
+  -webkit-flex: auto;
+  flex: 1;
+  overflow-y: auto;
 }
 
 .flex-right-box {
-    width: 100%;
-    height: 100%;
-    position: relative;
+  width: 100%;
+  height: 100%;
+  position: relative;
 }
 
 .ces-main {
-    position: absolute;
-    width: 100%;
+  position: absolute;
+  width: 100%;
 }
 
 .v-modal {
-    background: #000a2b !important;
+  background: #000a2b !important;
 }
 
 .drawer600 {
-    width: 600px !important;
+  width: 600px !important;
 }
 
 .drawer620 {
-    width: 620px !important;
+  width: 620px !important;
 }
 
 .drawer1202 {
-    width: 1202px !important;
+  width: 1202px !important;
 }
 
-
 /* .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before,
 .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before {
   content: "";
 } */
 
-
 /* 设置switch的样式 */
-
 .switchStyle1 .el-switch__label {
-    position: absolute;
-    display: none;
-    color: #fff;
+  position: absolute;
+  display: none;
+  color: #fff;
 }
 
-
 /*打开时文字位置设置*/
-
 .switchStyle1 .el-switch__label--right {
-    z-index: 1;
-    right: -10px;
-    top: 1px;
+  z-index: 1;
+  right: -10px;
+  top: 1px;
 }
 
-
 /*关闭时文字位置设置*/
-
 .switchStyle1 .el-switch__label--left {
-    z-index: 1;
-    left: 28px;
-    top: 1px;
+  z-index: 1;
+  left: 28px;
+  top: 1px;
 }
 
 .switchStyle1 .el-switch__label.is-active {
-    display: block;
+  display: block;
 }
 
 .switchStyle1.el-switch .el-switch__core,
 .switchStyle1.el-switch .el-switch__label {
-    width: 62px !important;
-    height: 28px !important;
-    border-radius: 28px !important;
+  width: 62px !important;
+  height: 28px !important;
+  border-radius: 28px !important;
 }
 
 .switchStyle1 .el-switch__core {
-    background: #f8f9fd !important;
-    border: 1px solid #8890a7 !important;
+  background: #f8f9fd !important;
+  border: 1px solid #8890a7 !important;
 }
 
 .switchStyle1 .el-switch__core:after {
-    background: #8890a7 !important;
-    width: 22px;
-    height: 22px;
-    left: 2px;
-    top: 2.1px;
+  background: #8890a7 !important;
+  width: 22px;
+  height: 22px;
+  left: 2px;
+  top: 2.1px;
 }
 
 .switchStyle1.el-switch.is-checked .el-switch__core {
-    background: #f8f9fd !important;
-    border: 1px solid #5c82ff !important;
+  background: #f8f9fd !important;
+  border: 1px solid #5c82ff !important;
 }
 
 .switchStyle1.el-switch.is-checked .el-switch__core:after {
-    background: #5c82ff !important;
-    width: 22px;
-    height: 22px;
-    right: 0;
-    top: 2.1px;
+  background: #5c82ff !important;
+  width: 22px;
+  height: 22px;
+  right: 0;
+  top: 2.1px;
 }
 
 .switchStyle1.el-switch.is-checked .el-switch__core::after {
-    margin-left: -25px;
+  margin-left: -25px;
 }
 
 .switchStyle1 .el-switch__label * {
-    font-size: 14px !important;
-    font-weight: 800;
+  font-size: 14px !important;
+  font-weight: 800;
 }
 
 .switchStyle1.el-switch .el-switch__label {
-    color: #8890a7 !important;
+  color: #8890a7 !important;
 }
 
 .switchStyle1.el-switch.is-checked .el-switch__label {
-    color: #5c82ff !important;
+  color: #5c82ff !important;
 }
 
 .switchStyle1.el-switch:hover {
-    opacity: 0.8;
+  opacity: 0.8;
 }
 
-
 /* 自定义图表提示框小三角 */
-
-
 /* .div-tip-warp {
   position: relative;
   line-height: 22px;
@@ -608,516 +558,501 @@ border-radius:8px;
 .triangle-position {
   margin-left: 35px;
 } */
-
 .el-input__inner {
-    border-radius: 6px;
+  border-radius: 6px;
 }
 
 .el-input-group__append,
 .el-input-group__prepend {
-    border-radius: 8px;
+  border-radius: 8px;
 }
 
 .el-button {
-    border-radius: 4px;
-    height: 36px;
-    line-height: 36px;
+  border-radius: 4px;
+  height: 36px;
+  line-height: 36px;
 }
 
 .el-select-dropdown {
-    z-index: 20000 !important;
+  z-index: 20000 !important;
 }
 
-
 /*
     下拉选样式
     此处勿删，apaasV3下拉选择样式统一用这个
  */
-
 .el-select-dropdown {
-    border-radius: 8px;
+  border-radius: 8px;
 }
 
 .el-select-dropdown__empty {
-    color: #f4f7fc;
-    border-radius: 8px;
+  color: #f4f7fc;
+  border-radius: 8px;
 }
 
 .el-select-dropdown__list {
-    padding: 0;
-    top: 10px;
-    border-radius: 4px;
+  padding: 0;
+  top: 10px;
+  border-radius: 4px;
 }
 
 .el-select-dropdown__item {
-    font-size: 12px;
-    padding: 0 20px;
-    height: 34px;
-    line-height: 34px;
+  font-size: 12px;
+  padding: 0 20px;
+  height: 34px;
+  line-height: 34px;
 }
 
 .el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
-    background-color: transparent;
-    color: #2b4695;
+  background-color: transparent;
+  color: #2b4695;
 }
 
 .el-scrollbar {
-    border-radius: 8px;
+  border-radius: 8px;
 }
 
 .el-popper[x-placement^="bottom"] .popper__arrow::after {
-    border-bottom-color: transparent;
+  border-bottom-color: transparent;
 }
 
 .el-popper[x-placement^="top"] .popper__arrow::after {
-    border-top-color: transparent;
+  border-top-color: transparent;
 }
 
-
 /* 单选激活样式 */
-
 .el-radio__input .el-radio__inner {
-    border-color: #dadee7;
-    background-color: #fff;
-    width: 16px;
-    height: 16px;
+  border-color: #dadee7;
+  background-color: #fff;
+  width: 16px;
+  height: 16px;
 }
 
 .el-radio__input.is-checked .el-radio__inner {
-    border-color: #dadee7;
-    background-color: #fff;
+  border-color: #dadee7;
+  background-color: #fff;
 }
 
 .el-radio__input.is-checked+.el-radio__label {
-    color: #1a2236;
-    font-weight: 700;
+  color: #1a2236;
+  font-weight: 700;
 }
 
 .el-radio__inner::after {
-    width: 8px;
-    height: 8px;
+  width: 8px;
+  height: 8px;
 }
 
 .el-radio__input.is-checked .el-radio__inner::after {
-    background-color: #2b4695;
+  background-color: #2b4695;
 }
 
 .el-radio__inner:hover {
-    border-color: #2b4695;
+  border-color: #2b4695;
 }
 
-
 /* 面包屑样式 */
-
 .bread_crumb {
-    margin: 20px;
-    font-size: 14px;
+  margin: 20px;
+  font-size: 14px;
 }
 
 .bread_crumb .el-breadcrumb__inner {
-    color: #b4c0f5 !important;
+  color: #b4c0f5 !important;
 }
 
 .bread_crumb .is-link {
-    color: #626de9 !important;
+  color: #626de9 !important;
 }
 
 .bread_crumb1 {
-    margin: 20px;
-    font-size: 14px;
+  margin: 20px;
+  font-size: 14px;
 }
 
 .bread_crumb1 .el-breadcrumb__inner {
-    color: #242c43 !important;
+  color: #242c43 !important;
 }
 
 .bread_crumb1 .is-link {
-    color: #898d9e !important;
+  color: #898d9e !important;
 }
 
-
 /* 应用超市详情页公共样式 */
-
 .sevice_detail {
-    max-width: 1340px;
-    padding-top: 1px;
-    margin: 0 auto;
+  max-width: 1340px;
+  padding-top: 1px;
+  margin: 0 auto;
 }
 
-
 /* common */
-
 .apass_breadcrumb>.el-breadcrumb {
-    padding: 10px 0;
+  padding: 10px 0;
 }
 
 .apass_breadcrumb>.el-breadcrumb .el-breadcrumb__inner {
-    font-size: 14px;
-    font-weight: 400;
-    color: #898d9e;
-    line-height: 23px;
+  font-size: 14px;
+  font-weight: 400;
+  color: #898d9e;
+  line-height: 23px;
 }
 
 .apass_breadcrumb>.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner {
-    color: #242c43;
-    font-weight: normal;
+  color: #242c43;
+  font-weight: normal;
 }
 
 .apaas_button .el-button {
-    /* min-width: 90px; */
-    color: #404a62;
+  /* min-width: 90px; */
+  color: #404a62;
 }
 
 .apaas_button .el-button--mini,
 .apaas_button .el-button--mini.is-round {
-    padding: 10px 15px;
+  padding: 10px 15px;
 }
 
 .apaas_button .el-button--primary {
-    color: #fff;
-    background-color: #2b4695;
-    border-color: #2b4695;
+  color: #fff;
+  background-color: #2b4695;
+  border-color: #2b4695;
 }
 
 .apaas_button .el-button--primary.is-plain {
-    color: #2b4695;
-    background-color: #e1e4fb;
-    border-color: #e1e4fb;
+  color: #2b4695;
+  background-color: #e1e4fb;
+  border-color: #e1e4fb;
 }
 
 .apaas_button .el-button--info {
-    color: #fff;
-    background-color: #404a62;
-    border-color: #404a62;
+  color: #fff;
+  background-color: #404a62;
+  border-color: #404a62;
 }
 
 .apaas_button .el-button--info:hover {
-    background-color: #5c6579;
-    border-color: #5c6579;
+  background-color: #5c6579;
+  border-color: #5c6579;
 }
 
 .apaas_button .el-button--info:active {
-    background-color: #363f53;
-    border-color: #363f53;
+  background-color: #363f53;
+  border-color: #363f53;
 }
 
 .apaas_button .el-button--danger {
-    color: #fff;
-    background-color: #ad3a4a;
-    border-color: #ad3a4a;
+  color: #fff;
+  background-color: #ad3a4a;
+  border-color: #ad3a4a;
 }
 
 .apaas_button .el-button.is-disabled,
 .apaas_button .el-button.is-disabled:focus,
 .apaas_button .el-button.is-disabled:hover {
-    cursor: not-allowed;
+  cursor: not-allowed;
 }
 
 .apaas_button .el-button--warning.is-plain {
-    background-color: #fcefd6;
-    border-color: #fac266;
-    color: #e56600;
+  background-color: #fcefd6;
+  border-color: #fac266;
+  color: #e56600;
 }
 
 .apaas_button .el-button--warning {
-    background-color: #e56600;
-    border-color: #e56600;
-    color: #fcefd6;
+  background-color: #e56600;
+  border-color: #e56600;
+  color: #fcefd6;
 }
 
 .apaas_button .el-button--success {
-    background-color: #429e8a;
-    border-color: #429e8a;
-    color: #fff;
+  background-color: #429e8a;
+  border-color: #429e8a;
+  color: #fff;
 }
 
 .apaas_button .gray-button {
-    color: #fff;
-    background-color: #404a62;
-    border-color: #404a62;
+  color: #fff;
+  background-color: #404a62;
+  border-color: #404a62;
 }
 
 .apaas_button .el-button.is-disabled,
 .apaas_button .el-button.is-disabled:focus,
 .apaas_button .el-button.is-disabled:hover {
-    color: #c0c4cc;
-    cursor: not-allowed;
-    background-image: none;
-    background-color: #fff;
-    border-color: #ebeef5;
+  color: #c0c4cc;
+  cursor: not-allowed;
+  background-image: none;
+  background-color: #fff;
+  border-color: #ebeef5;
 }
 
 .apass_table .el-table th>.cell {
-    color: #1a2236;
+  color: #1a2236;
 }
 
 .apass_table .el-table td,
 .apass_table .el-table th.is-leaf {
-    border: none !important;
-    line-height: 23px;
+  border: none !important;
+  line-height: 23px;
 }
 
 .apass_table .el-table::before {
-    display: none;
+  display: none;
 }
 
 .apass_table .el-table {
-    width: 100%;
+  width: 100%;
 }
 
 .apass_table .el-table__row:nth-child(odd) td {
-    background-color: #f7f7f9;
+  background-color: #f7f7f9;
 }
 
 .apass_table .table_html a {
-    font-size: 14px;
-    color: #2b4695;
-    cursor: pointer;
+  font-size: 14px;
+  color: #2b4695;
+  cursor: pointer;
 }
 
 .apass_table .row_action {
-    user-select: none;
+  user-select: none;
 }
 
 .apass_table .row_action .btn {
-    font-size: 14px;
-    color: #3759be;
-    cursor: pointer;
+  font-size: 14px;
+  color: #3759be;
+  cursor: pointer;
 }
 
 .apass_table .row_action .btn.warn {
-    color: #830f53;
+  color: #830f53;
 }
 
 .apass_table .row_action .btn.disabled {
-    color: #999;
-    cursor: not-allowed;
+  color: #999;
+  cursor: not-allowed;
 }
 
 .apass_table .row_action .disabled.hide {
-    opacity: 0;
-    cursor: auto;
+  opacity: 0;
+  cursor: auto;
 }
 
 .apass_table .row_action .interval_line {
-    font-size: 14px;
-    color: #c1c7d7;
-    margin: 0 20px;
+  font-size: 14px;
+  color: #c1c7d7;
+  margin: 0 20px;
 }
 
 .apass_table .border-active td {
-    padding: 10px 0;
-    background-color: #e6ebfe;
-    border-top: 2px solid #515fe7 !important;
-    border-bottom: 2px solid #515fe7 !important;
+  padding: 10px 0;
+  background-color: #e6ebfe;
+  border-top: 2px solid #515fe7 !important;
+  border-bottom: 2px solid #515fe7 !important;
 }
 
 .apass_table .border-active td:first-child {
-    border-left: 2px solid #515fe7 !important;
+  border-left: 2px solid #515fe7 !important;
 }
 
 .apass_table .border-active td:last-child {
-    border-right: 2px solid #515fe7 !important;
+  border-right: 2px solid #515fe7 !important;
 }
 
 .apass_checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
 .apass_checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
-    background-color: #3759be;
-    border-color: #515fe7;
+  background-color: #3759be;
+  border-color: #515fe7;
 }
 
 .apass_checkbox .el-checkbox__input.is-checked+.el-checkbox__label {
-    color: #58617a;
+  color: #58617a;
 }
 
 .apaas_scroll::-webkit-scrollbar {
-    width: 16px;
-    height: 1px;
+  width: 16px;
+  height: 1px;
 }
 
 .apaas_scroll::-webkit-scrollbar-thumb {
-    border-radius: 8px;
-    /* background: #dde4ff; */
-    box-shadow: 8px 0 0 #a5adb7 inset;
-    border: 4px solid rgba(0, 0, 0, 0);
+  border-radius: 8px;
+  /* background: #dde4ff; */
+  box-shadow: 8px 0 0 #a5adb7 inset;
+  border: 4px solid rgba(0, 0, 0, 0);
 }
 
 .apaas_scroll::-webkit-scrollbar-track {
-    border-radius: 8px;
-    /* background: #f4f4f4; */
-    box-shadow: 8px 0 0 #f4f4f4 inset;
-    border: 4px solid rgba(0, 0, 0, 0);
+  border-radius: 8px;
+  /* background: #f4f4f4; */
+  box-shadow: 8px 0 0 #f4f4f4 inset;
+  border: 4px solid rgba(0, 0, 0, 0);
 }
 
 .apaas_scroll_nor::-webkit-scrollbar {
-    width: 0px;
-    height: 0px;
+  width: 0px;
+  height: 0px;
 }
 
 .apaas_scroll_min::-webkit-scrollbar {
-    width: 6px;
-    height: 1px;
+  width: 6px;
+  height: 1px;
 }
 
 .apaas_scroll_min::-webkit-scrollbar-thumb {
-    border-radius: 3px;
-    background: #e6e9ef;
-    box-shadow: 8px 0 0 #e6e9ef inset;
-    border: 4px solid rgba(0, 0, 0, 0);
+  border-radius: 3px;
+  background: #e6e9ef;
+  box-shadow: 8px 0 0 #e6e9ef inset;
+  border: 4px solid rgba(0, 0, 0, 0);
 }
 
 .apaas_scroll_min::-webkit-scrollbar-track {
-    border-radius: 3px;
-    background: #fff;
-    box-shadow: 8px 0 0 #fff inset;
-    border: 4px solid rgba(0, 0, 0, 0);
+  border-radius: 3px;
+  background: #fff;
+  box-shadow: 8px 0 0 #fff inset;
+  border: 4px solid rgba(0, 0, 0, 0);
 }
 
-
 /* 详情页公共样式 by xuyiming */
-
 .apaas_detail_container {
-    padding: 0 20px;
+  padding: 0 20px;
 }
 
 .apaas_detail_container .main_contaner {
-    min-height: calc(100vh - 32px - 83px);
-    flex-grow: 1;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: stretch;
-    padding: 30px;
-    background-color: #fff;
-    border-radius: 10px;
-    margin-bottom: 14px;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
+  min-height: calc(100vh - 32px - 83px);
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  padding: 30px;
+  background-color: #fff;
+  border-radius: 10px;
+  margin-bottom: 14px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }
 
 .apaas_detail_container .main_contaner.locked_height {
-    height: calc(100vh - 58px - 83px);
-    min-height: 400px;
+  height: calc(100vh - 58px - 83px);
+  min-height: 400px;
 }
 
 .apaas_detail_container .main_contaner.locked_height_900 {
-    height: calc(100vh - 58px - 83px);
-    min-height: 900px;
+  height: calc(100vh - 58px - 83px);
+  min-height: 900px;
 }
 
 .apaas_detail_container .detail_action {
-    text-align: right;
-    margin-top: 50px;
+  text-align: right;
+  margin-top: 50px;
 }
 
 .apaas_detail_container .detail_action .el-button+.el-button {
-    margin-left: 30px;
+  margin-left: 30px;
 }
 
 .apaas_detail_form {
-    max-width: 970px;
+  max-width: 970px;
 }
 
 .apaas_detail_form .el-input__inner,
 .apaas_detail_form .el-textarea__inner {
-    width: 100%;
-    background-color: #f7f8f9;
+  width: 100%;
+  background-color: #f7f8f9;
 }
 
 .apaas_detail_form .el-select {
-    width: 100%;
+  width: 100%;
 }
 
 .apaas_detail_form.el-form--label-top .el-form-item__label {
-    padding: 0 0 15px;
-    font-size: 14px;
-    line-height: 1;
-    color: #58617a;
+  padding: 0 0 15px;
+  font-size: 14px;
+  line-height: 1;
+  color: #58617a;
 }
 
 .apaas_detail_form .el-form-item {
-    margin-bottom: 30px;
+  margin-bottom: 30px;
 }
 
 .apaas_detail_form .textarea_count {
-    font-size: 14px;
-    line-height: 1;
-    color: #a9aec0;
-    text-align: right;
-    margin-top: 10px;
+  font-size: 14px;
+  line-height: 1;
+  color: #a9aec0;
+  text-align: right;
+  margin-top: 10px;
 }
 
 .apaas_steps {
-    height: 100%;
+  height: 100%;
 }
 
 .apaas_steps .apaas_step {
-    height: 100%;
-    position: relative;
+  height: 100%;
+  position: relative;
 }
 
 .apaas_steps .apaas_step .apaas_step_content {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: calc(100% - 64px);
-    border-bottom: 1px solid #f4f7fc;
-    /* overflow: hidden; */
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: calc(100% - 64px);
+  border-bottom: 1px solid #f4f7fc;
+  /* overflow: hidden; */
 }
 
 .apaas_steps .apaas_step .apaas_step_action {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
 }
 
 .apaas_steps .apaas_step .apaas_step_action .el-button {
-    height: 44px;
-    width: 124px;
+  height: 44px;
+  width: 124px;
 }
 
 .apaas_steps .apaas_step .apaas_step_action .el-button+.el-button {
-    margin-left: 20px;
+  margin-left: 20px;
 }
 
 .top_fliter {
-    display: flex;
+  display: flex;
 }
 
 .filter_list {
-    flex-grow: 1;
-    font-size: 0;
+  flex-grow: 1;
+  font-size: 0;
 }
 
 .filter_list>.filter_item {
-    display: flex;
-    align-items: center;
-    margin: 0 34px 16px 0;
+  display: flex;
+  align-items: center;
+  margin: 0 34px 16px 0;
 }
 
-
 /* .filter_list>.filter_item>* {
   display: inline-block;
   vertical-align: middle;
 } */
 
 .filter_list>.filter_item>.filter_title {
-    text-align: right;
-    font-size: 14px;
-    color: #242c43;
-    margin-right: 10px;
-    width: 84px;
-    white-space: pre-wrap;
-    font-weight: normal;
+  text-align: right;
+  font-size: 14px;
+  color: #242c43;
+  margin-right: 10px;
+  width: 84px;
+  white-space: pre-wrap;
+  font-weight: normal;
 }
 
-
 /* .filter_list>.filter_item>.filter_title+* {
   width: 300px;
 }
@@ -1133,443 +1068,575 @@ border-radius:8px;
 } */
 
 .top_fliter .filter_action {
-    flex-shrink: 0;
-    margin-left: 25px;
-    text-align: right;
+  flex-shrink: 0;
+  margin-left: 25px;
+  text-align: right;
 }
 
 .filter_action>.el-button {
-    /* min-width: 90px; */
-    height: 36px;
-    margin-top: 16px;
-    padding: 12px 17px;
+  /* min-width: 90px; */
+  height: 36px;
+  margin-top: 16px;
+  padding: 12px 17px;
 }
 
 .filter_action>.el-button+.el-button {
-    margin-left: 10px;
+  margin-left: 10px;
 }
 
 .meassage_detail_dialog {
-    display: flex;
-    flex-wrap: wrap;
-    text-align: left;
+  display: flex;
+  flex-wrap: wrap;
+  text-align: left;
 }
 
 .meassage_detail_dialog .detail_item {
-    flex: 1 1 auto;
-    width: 50%;
-    margin-top: 20px;
+  flex: 1 1 auto;
+  width: 50%;
+  margin-top: 20px;
 }
 
 .meassage_detail_dialog .detail_item.full_line {
-    width: 100%;
+  width: 100%;
 }
 
 .meassage_detail_dialog .detail_item p {
-    padding: 0 15px;
-    font-size: 14px;
-    line-height: 22px;
-    color: #8890a7;
+  padding: 0 15px;
+  font-size: 14px;
+  line-height: 22px;
+  color: #8890a7;
 }
 
 .meassage_detail_dialog .detail_item .item_content {
-    color: #000;
-    margin-top: 10px;
+  color: #000;
+  margin-top: 10px;
 }
 
 .meassage_detail_dialog .detail_item .full_content {
-    padding: 10px 0;
-    border-radius: 8px;
-    background-color: #f8f9fd;
-    margin-top: 5px;
+  padding: 10px 0;
+  border-radius: 8px;
+  background-color: #f8f9fd;
+  margin-top: 5px;
 }
 
 .meassage_detail_dialog .detail_item .full_content>.apaas_scroll {
-    height: 176px;
-    overflow: auto;
+  height: 176px;
+  overflow: auto;
 }
 
 .meassage_detail_dialog .detail_item .full_content .item_content {
-    margin: 0;
+  margin: 0;
 }
 
 .no_wrap .apass_table td .cell {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
+  white-space: nowrap;
 }
 
-
 /* 详情页公共样式 by xuyiming ~~~end */
 
-
 /*
     form_content
 */
-
 .from_content1 {
-    width: calc(100% - 40px);
-    background-color: rgba(255, 255, 255, 1);
-    overflow: hidden;
-    margin: 0 20px 20px;
-    position: relative;
-    box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
-    border-radius: 12px;
-    padding-top: 20px;
+  width: calc(100% - 40px);
+  background-color: rgba(255, 255, 255, 1);
+  overflow: hidden;
+  margin: 0 20px 20px;
+  position: relative;
+  box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
+  border-radius: 12px;
+  padding-top: 20px;
 }
 
 .from_content {
-    width: calc(100% - 40px);
-    background-color: rgba(255, 255, 255, 1);
-    /* flex: 1 0 auto; */
-    position: relative;
-    box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
-    border-radius: 12px;
-    margin: 0 20px;
-    padding: 20px 20px 30px;
+  width: calc(100% - 40px);
+  background-color: rgba(255, 255, 255, 1);
+  /* flex: 1 0 auto; */
+  position: relative;
+  box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
+  border-radius: 12px;
+  margin: 0 20px;
+  padding: 20px 20px 30px;
 }
 
 .from_content_table {
-    height: calc(100% - 90px);
+  height: calc(100% - 90px);
 }
 
 .from_content_table_app {
-    height: calc(100% - 170px);
+  height: calc(100% - 170px);
 }
 
 .from_content_table_auth {
-    height: calc(100% - 100px);
+  height: calc(100% - 100px);
 }
 
 .from_content_btn {
-    height: 40px;
-    margin-bottom: 20px;
+  height: 40px;
+  margin-bottom: 20px;
 }
 
-
 /* 时间控件样式 */
-
 .el-picker-panel {
-    background-color: #fff !important;
-    border-radius: 8px !important;
-    font-size: 12px !important;
-    color: #202531 !important;
-    box-shadow: 0 !important;
-    border: none !important;
+  background-color: #fff !important;
+  border-radius: 8px !important;
+  font-size: 12px !important;
+  color: #202531 !important;
+  box-shadow: 0 !important;
+  border: none !important;
 }
 
 .el-date-editor.el-input__wrapper {
-    background-color: #fff;
+  background-color: #fff;
 }
 
-
-/* 
-.el-picker-panel__footer {
-    border-top: 1px solid #3f4864 !important;
-    background-color: #242c43 !important;
+/* .el-picker-panel__footer {
+  border-top: 1px solid #3f4864 !important;
+  background-color: #242c43 !important;
 } */
 
 .el-picker-panel__icon-btn {
-    color: #202531;
+  color: #202531;
 }
 
 .el-date-table th {
-    border-bottom: 1px solid #e6e9ef !important;
-    color: #202531 !important;
+  border-bottom: 1px solid #e6e9ef !important;
+  color: #202531 !important;
 }
 
 .el-date-table td.current:not(.disabled) span {
-    color: #e3e5ef !important;
-    background-color: #315efc !important;
+  color: #e3e5ef !important;
+  background-color: #315efc !important;
 }
 
 .el-date-table td.next-month,
 .el-date-table td.prev-month {
-    color: #a9b1c7 !important;
+  color: #a9b1c7 !important;
 }
 
 .el-date-picker__time-header {
-    border-bottom: 1px solid #3f4864 !important;
+  border-bottom: 1px solid #3f4864 !important;
 }
 
 .el-picker-panel__body .el-input__inner {
-    height: 24px !important;
-    line-height: 24px !important;
-    border-radius: 12px !important;
-    font-size: 12px;
+  height: 24px !important;
+  line-height: 24px !important;
+  border-radius: 12px !important;
+  font-size: 12px;
 }
 
 .el-picker-panel__footer .el-button {
-    background-color: #264dd9;
-    border-radius: 12px;
-    padding: 5px 12px;
-    color: #f4f7fc;
-    font-size: 12px;
-    border: none !important;
+  background-color: #264dd9;
+  border-radius: 12px;
+  padding: 5px 12px;
+  color: #f4f7fc;
+  font-size: 12px;
+  border: none !important;
 }
 
 .el-picker-panel__footer .el-button--text {
-    background-color: #dde4ff;
-    border-radius: 12px;
-    padding: 5px 12px;
-    color: #264dd9;
-    font-size: 12px;
+  background-color: #dde4ff;
+  border-radius: 12px;
+  padding: 5px 12px;
+  color: #264dd9;
+  font-size: 12px;
 }
 
 .el-button.is-plain:focus,
 .el-button.is-plain:hover {
-    background-color: #264dd9;
-    color: #f4f7fc;
+  background-color: #264dd9;
+  color: #f4f7fc;
 }
 
 .el-button--text:focus,
 .el-button--text:hover {
-    color: #264dd9;
+  color: #264dd9;
 }
 
 .el-time-panel {
-    border-radius: 8px !important;
-    /* border: 1px solid #3f4864 !important;
-    background-color: #242c43 !important; */
+  border-radius: 8px !important;
+  /* border: 1px solid #3f4864 !important;
+  background-color: #242c43 !important; */
 }
 
 .el-time-panel__footer {
-    /* border: 1px solid #3f4864 !important; */
+  /* border: 1px solid #3f4864 !important; */
 }
 
 .el-time-panel__btn.confirm {
-    background-color: #264dd9;
-    border-radius: 12px !important;
-    padding: 0px 12px;
-    color: #f4f7fc !important;
-    font-size: 12px !important;
+  background-color: #264dd9;
+  border-radius: 12px !important;
+  padding: 0px 12px;
+  color: #f4f7fc !important;
+  font-size: 12px !important;
 }
 
 .el-time-panel__btn {
-    line-height: 22px !important;
-    height: 22px !important;
+  line-height: 22px !important;
+  height: 22px !important;
 }
 
 .el-time-spinner__item:hover:not(.disabled):not(.active) {
-    /* background-color: #264dd9 !important; */
-    /* border-radius: 12px !important; */
-    color: #f4f7fc;
+  /* background-color: #264dd9 !important;
+  border-radius: 12px !important; */
+  color: #f4f7fc;
 }
 
 .el-time-spinner__item {
-    color: #58617a !important;
+  color: #58617a !important;
 }
 
 .el-date-table td.in-range div,
 .el-date-table td.in-range div:hover,
 .el-date-table.is-week-mode .el-date-table__row.current div,
 .el-date-table.is-week-mode .el-date-table__row:hover div {
-    background-color: #eff2fa !important;
+  background-color: #eff2fa !important;
 }
 
 .el-date-table td.end-date .el-date-table-cell__text,
 .el-date-table td.start-date .el-date-table-cell__text {
-    background-color: #3759be !important;
+  background-color: #3759be !important;
 }
 
 .el-date-table td.end-date span,
 .el-date-table td.start-date span {
-    background-color: #264dd9;
+  background-color: #264dd9;
 }
 
 .el-date-table td.today span {
-    color: #0c3ff7;
+  color: #0c3ff7;
 }
 
 .el-date-editor .el-range-separator {
-    width: 15%;
-    line-height: 28px;
-    color: #202531;
+  width: 15%;
+  line-height: 28px;
+  color: #202531;
 }
 
-
 /* table select window */
-
 .el-checkbox__input.is-checked .el-checkbox__inner,
 .el-checkbox__input.is-indeterminate .el-checkbox__inner {
-    background-color: #3759be;
-    border-color: #2b4695;
+  background-color: #3759be;
+  border-color: #2b4695;
 }
 
 .el-checkbox__input.is-focus .el-checkbox__inner {
-    border-color: #2b4695;
+  border-color: #2b4695;
 }
 
 .el-checkbox__input:hover .el-checkbox__inner {
-    border-color: #2b4695;
+  border-color: #2b4695;
 }
 
 .el-date-editor .el-range-input {
-    width: 36%;
+  width: 36%;
 }
 
 .el-input__inner:focus {
-    border-color: #515fe7;
+  border-color: #515fe7;
 }
 
 .el-textarea__inner:focus {
-    border-color: #515fe7;
+  border-color: #515fe7;
 }
 
 .el-select .el-input .el-select__caret {
-    color: #515fe7;
+  color: #909bb6;
 }
 
 .el-input-number__decrease,
 .el-input-number__increase {
-    color: #515fe7;
+  color: #515fe7;
 }
 
 .el-input__inner::-webkit-input-placeholder,
 .el-textarea__inner::-webkit-input-placeholder {
-    color: #a9aec0;
+  color: #a9aec0;
 }
 
 .el-input__inner:-moz-placeholder,
 .el-textarea__inner:-moz-placeholder {
-    /* Firefox 18- */
-    color: #a9aec0;
+  /* Firefox 18- */
+  color: #a9aec0;
 }
 
 .el-input__inner::-moz-placeholder,
 .el-textarea__inner::-moz-placeholder {
-    /* Firefox 19+ */
-    color: #a9aec0;
+  /* Firefox 19+ */
+  color: #a9aec0;
 }
 
 .el-input__inner:-ms-input-placeholder,
 .el-textarea__inner:-ms-input-placeholder {
-    color: #a9aec0;
+  color: #a9aec0;
 }
 
 [class*=" el-icon-"],
 [class^="el-icon-"] {
-    font-weight: 700;
+  font-weight: 700;
 }
 
 .el-rate__item .el-rate__icon {
-    font-size: 18px;
-    margin-right: 0;
+  font-size: 18px;
+  margin-right: 0;
 }
 
 .detai_form .el-input__inner,
 .detai_form .el-textarea__inner {
-    background-color: #f7f7f9;
-    border-radius: 4px;
-    border: solid 1px #dadee7;
+  background-color: #f7f7f9;
+  border-radius: 4px;
+  border: solid 1px #dadee7;
 }
 
 .detai_form .el-input.is-disabled .el-input__inner {
-    background-color: #e6e9ef;
+  background-color: #e6e9ef;
 }
 
 .tip-box-popper {
-    background: #242c43 !important;
+  background: #242c43 !important;
 }
 
 .p-1 {
-    padding: 5px;
+  padding: 5px;
 }
 
 .source_table .el-table thead tr {
-    background-color: #dfe5f6 !important;
+  background-color: #dfe5f6 !important;
 }
 
 .source_table .el-table th {
-    background-color: transparent;
+  background-color: transparent;
 }
 
 .source_table .el-table td {
-    border-bottom: 1px solid #dadee7 !important;
+  border-bottom: 1px solid #dadee7 !important;
 }
 
 .source_table .el-table__header {
-    border: 1px solid #b0bee8;
+  border: 1px solid #b0bee8;
 }
 
 .source_table .el-table__body-wrapper {
-    border-left: 1px solid #dadee7 !important;
-    border-right: 1px solid #dadee7 !important;
+  border-left: 1px solid #dadee7 !important;
+  border-right: 1px solid #dadee7 !important;
 }
 
 .source_table .el-table__empty-block {
-    border-bottom: 1px solid #dadee7 !important;
+  border-bottom: 1px solid #dadee7 !important;
 }
 
 .source_footer {
-    margin-top: 15px;
-    text-align: center;
+  margin-top: 15px;
+  text-align: center;
 }
 
 .source_title {
-    font-size: 14px;
-    padding: 10px 0;
-    text-align: left;
+  font-size: 14px;
+  padding: 10px 0;
+  text-align: left;
 }
 
 .headerBox {
-    font-size: 18px;
-    line-height: 18px;
-    font-weight: 700;
-    font-stretch: normal;
-    letter-spacing: 0px;
-    color: #1a1a1a;
+  font-size: 18px;
+  line-height: 18px;
+  font-weight: 700;
+  font-stretch: normal;
+  letter-spacing: 0px;
+  color: #1a1a1a;
 }
 
 .headerBox span:first-child {
-    display: inline-block;
-    width: 4px;
-    height: 16px;
-    background-color: #3759be;
-    border-radius: 2px;
-    margin-right: 10px;
-    vertical-align: bottom;
+  display: inline-block;
+  width: 4px;
+  height: 16px;
+  background-color: #3759be;
+  border-radius: 2px;
+  margin-right: 10px;
+  vertical-align: bottom;
 }
 
 .row_text {
-    -webkit-line-clamp: 2;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
+  -webkit-line-clamp: 2;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
 }
 
 .close_reason {
-    padding: 2px 5px;
-    background-color: #dedede;
-    display: inline-block;
-    margin-top: 10px;
+  padding: 2px 5px;
+  background-color: #dedede;
+  display: inline-block;
+  margin-top: 10px;
 }
 
 .pointer {
-    cursor: pointer;
+  cursor: pointer;
 }
 
 .pr-1 {
-    padding-right: 10px;
+  padding-right: 10px;
 }
 
 .page_container {
-    width: 100%;
-    padding: 0 24px;
-    /* min-height: 100%; */
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: stretch;
+  width: 100%;
+  padding: 0 24px;
+  /* min-height: 100%; */
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
 }
 
 .page_content {
-    background-color: #fff;
-    height: calc(100% - 46px - 20px);
-    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
-    border-radius: 6px;
+  background-color: #fff;
+  height: calc(100% - 46px - 20px);
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  border-radius: 6px;
+}
+
+.flex_row {
+  display: flex;
+  height: 100%;
+  overflow: hidden;
+}
+
+.flex_left {
+  height: calc(100% - 16px);
+  width: 320px;
+  margin-right: 10px;
+  overflow: hidden;
+}
+
+.flex_right {
+  height: calc(100% - 16px);
+  flex: 1;
+
+  overflow: hidden;
+}
+
+.bgc_white {
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  border-radius: 6px;
+  background-color: #fff;
+}
+
+.tree::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+.tree::-webkit-scrollbar-thumb {
+  background: #bcc1d0;
+  border-radius: 10px;
+  height: 6px;
+}
+
+.tree::-webkit-scrollbar-track {
+  background: transparent;
+  border-radius: 2px;
+}
+
+.font_bold {
+  font-size: 18px;
+  color: #202531;
+  font-weight: bold;
+  margin-bottom: 20px;
+}
+
+.header_info {
+  font-size: 14px;
+  color: #404a62;
+  padding-left: 20px;
+}
+
+.fr {
+  float: right;
+}
+
+.pl-1 {
+  padding-left: 1rem;
+}
+
+.label-text {
+  font-size: 14px;
+  color: #404a62;
+}
+
+.icon_eye {
+  font-size: 12px;
+  color: #a9b1c7;
+  margin-right: 8px;
+  vertical-align: baseline;
+  cursor: pointer;
+}
+
+/* 可点击文字颜色、指针样式 */
+.can_click_text {
+  cursor: pointer;
+  color: #3759be;
+}
+
+.can_click_text:hover {
+  color: #738bd2;
+}
+
+.can_click_text:active {
+  color: #2c4798;
+}
+
+.warning_info {
+  background-color: #f7f7f9;
+  font-size: 14px;
+  color: #404a62;
+  padding: 0 8px;
+  text-align: left;
+  margin: 16px 0;
+  line-height: 38px;
+  border-radius: 4px;
+}
+
+.danger_info {
+  color: #d75138;
+}
+
+.register_btn {
+  display: flex;
+  align-items: center;
+  background-color: #eff2fa;
+  border-radius: 4px;
+  border: solid 1px #b0bee8;
+  color: #3759be;
+}
+
+.register_btn .icon-arrow-right {
+  margin-left: 39px;
+}
+
+.forget_psd {
+  font-size: 14px;
+  color: #3759be;
+  cursor: pointer;
+}
+
+.select-empty {
+  color: #616f94;
+  text-align: center;
+  padding: 20px;
+}
+
+.tip-image {
+  position: absolute;
+  right: -24px;
+  bottom: 9px;
+  width: 16px;
+  height: 16px;
+  margin-left: 8px;
+  background-image: url("../imgs/ic_tips.png");
+  background-size: contain;
 }
\ No newline at end of file
diff --git a/src/bg-ui/bg-code-editor.vue b/src/bg-ui/bg-code-editor.vue
index 4683c9c12a347748c00b7c4fd38a921c01cd7e84..827c959a8affdfe8d5b0a563b98b3caaeb921b89 100644
--- a/src/bg-ui/bg-code-editor.vue
+++ b/src/bg-ui/bg-code-editor.vue
@@ -3,14 +3,14 @@
     v-model:value="states.content"
     class="vue-ace-editor"
     :class="{ 'vue-ace-editor-disable': props.disabled }"
-    @input="codeChange"
     :lang="props.lang"
     :theme="props.theme"
     :options="{
       useWorker: true,
       readOnly: props.disabled,
       wrap: true,
-    }" />
+    }"
+    @input="codeChange" />
 </template>
 <script setup>
 import { reactive, toRefs, watch, onMounted } from "vue";
@@ -85,6 +85,7 @@ const codeChange = () => {
 
 onMounted(() => {
   let obj = "";
+  // console.log(typeof JSON.parse(this.datas));
   try {
     if (typeof JSON.parse(props.modelValue) == "object") {
       obj = JSON.stringify(JSON.parse(props.modelValue), null, "\t");
@@ -128,9 +129,10 @@ const { content } = toRefs(states);
   width: 0;
 }
 .vue-ace-editor :deep() .ace_scroller {
-  background-color: #1a1a1a;
-  color: #fff;
+  background-color: #fff;
+  color: #495266;
   caret-color: #fff;
+  right: 0 !important;
 }
 /* 光标颜色 */
 .vue-ace-editor :deep() .ace_cursor {
@@ -138,6 +140,20 @@ const { content } = toRefs(states);
 }
 .vue-ace-editor-disable :deep() .ace_scrollbar-v {
   width: 6px !important;
+  right: 2px;
+}
+
+.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar {
+  height: 6px;
+  width: 6px;
+}
+.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar-track {
+  background-color: #f7f7f9; /* Matches ace monokai */
+  border-radius: 3px;
+}
+.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar-thumb {
+  background-color: #c1c7d7;
+  border-radius: 3px;
 }
 .vue-ace-editor-disable :deep() .ace_gutter {
   background-color: #202531;
diff --git a/src/bg-ui/bg-form-gap.vue b/src/bg-ui/bg-form-gap.vue
index 1379940732a191c58dffc9a052d6cdc6a54c93ab..ec0d021058ffa0863112b5117f083bdb2c034897 100644
--- a/src/bg-ui/bg-form-gap.vue
+++ b/src/bg-ui/bg-form-gap.vue
@@ -34,10 +34,10 @@ const props = defineProps({
   background-color: #3759be;
   border-radius: 2px;
 }
-/* .gap-title::after {
+.gap-title::after {
   content: "";
   display: inline-block;
   flex: 1;
   border-top: 1px dashed #dadee7;
-} */
+}
 </style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/base-info.vue b/src/page/main/auto-maintenance/task-manage/add/base-info.vue
new file mode 100644
index 0000000000000000000000000000000000000000..5135d362be9aecee1678fd256c8a039366128298
--- /dev/null
+++ b/src/page/main/auto-maintenance/task-manage/add/base-info.vue
@@ -0,0 +1,57 @@
+<template>
+  <div>
+    <el-form ref="ruleFormRef" :model="state.ruleForm" :rules="state.rules" label-position="top" label-width="120px">
+      <el-form-item label="任务名称" prop="name">
+        <el-input v-model="state.ruleForm.name" maxlength="20" placeholder="请输入任务名称" show-word-limit />
+      </el-form-item>
+      <el-form-item label="任务描述" prop="desc">
+        <el-input
+          v-model="state.ruleForm.desc"
+          type="textarea"
+          maxlength="200"
+          placeholder="请输入任务描述"
+          :autosize="{
+            minRows: 4,
+          }"
+          show-word-limit />
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+const router = useRouter();
+const route = useRoute();
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+});
+
+const state = reactive({
+  ruleForm: {
+    name: props.data?.name,
+    desc: props.data?.desc,
+  },
+  rules: {
+    name: [
+      { required: true, message: "请输入任务名称", trigger: "blur" },
+      { max: 20, message: "最大长度20", trigger: "blur" },
+    ],
+    desc: [{ max: 200, message: "最大长度200", trigger: "blur" }],
+  },
+});
+
+const save = () => {};
+
+defineExpose({
+  save,
+});
+</script>
+
+<style scoped></style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/finish.vue b/src/page/main/auto-maintenance/task-manage/add/finish.vue
new file mode 100644
index 0000000000000000000000000000000000000000..4fd7fd6ff29b7bcfb020b6d6aca986f99180e49d
--- /dev/null
+++ b/src/page/main/auto-maintenance/task-manage/add/finish.vue
@@ -0,0 +1,49 @@
+<template>
+  <div class="step-container">
+    <div class="step-base">
+      <img src="@/assets/imgs/img_data-complete.png" />
+      <p class="tips">新增成功</p>
+      <div class="apaas_button btns">
+        <el-button type="default" @click="goStepOne"> 返回列表 </el-button>
+        <el-button type="primary" @click="putawayAction"> 继续新增 </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+const router = useRouter();
+const route = useRoute();
+const state = reactive({ data: 1 });
+const { data } = toRefs(state);
+</script>
+
+<style scoped>
+.step-container {
+  position: relative;
+  height: 100%;
+}
+.step-base {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 300px;
+}
+.tips {
+  margin: 60px 0;
+  text-align: center;
+  font-size: 18px;
+  color: #202531;
+  font-weight: 600;
+}
+.btns {
+  width: 208px;
+  margin: 0 auto;
+  display: flex;
+  justify-content: space-around;
+}
+</style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/index.vue b/src/page/main/auto-maintenance/task-manage/add/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..844f92094c37c51cb90861b2432805d991e27050
--- /dev/null
+++ b/src/page/main/auto-maintenance/task-manage/add/index.vue
@@ -0,0 +1,166 @@
+<template>
+  <div class="detail_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <div class="content_process">
+        <div>
+          <el-steps :active="step">
+            <el-step title="" :class="{ process_complete: step > 1 }">
+              <template #icon>
+                <span class="process_desc">
+                  <span class="icon_box" v-if="step > 0"
+                    ><bg-icon class="step_icon" icon="#bg-ic-file-editing"></bg-icon
+                  ></span>
+                  <span class="circle" v-else></span>
+                  基本信息
+                </span>
+              </template>
+            </el-step>
+            <el-step title="" :class="{ process_complete: step > 2 }">
+              <template #icon>
+                <span class="process_desc">
+                  <span class="icon_box" v-if="step > 1"
+                    ><bg-icon class="step_icon" icon="#bg-ic-file-lock"></bg-icon
+                  ></span>
+                  <span class="circle" v-else></span>
+                  执行内容
+                </span>
+              </template>
+            </el-step>
+            <el-step title="">
+              <template #icon>
+                <span class="process_desc">
+                  <span class="icon_box" v-if="step > 2"
+                    ><bg-icon class="step_icon" icon="#bg-ic-file-success"></bg-icon
+                  ></span>
+                  <span class="circle" v-else></span>
+                  完成
+                </span>
+              </template>
+            </el-step>
+          </el-steps>
+        </div>
+      </div>
+      <div class="content_main log_content_nor" :style="step == 3 ? { height: 'calc(100vh - 234px)' } : {}">
+        <base-info v-show="step == 1"></base-info>
+        <use-content v-show="step == 2"></use-content>
+        <finish v-show="step == 3"></finish>
+      </div>
+      <div class="content_foot apaas_button" v-if="step == 1 || step == 2">
+        <el-button type="default" @click="cancel"> 取消 </el-button>
+        <el-button type="default" v-if="step == 2" @click="confirm(-1)"> 上一步 </el-button>
+        <el-button type="primary" v-if="step == 1" @click="confirm(1)"> 下一步 </el-button>
+        <el-button type="primary" v-if="step == 2" @click="confirm(1)"> 保存 </el-button>
+        <el-button type="success" v-if="step == 2" @click="useScript"> 立即执行 </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+import axios from "@/request/http.js";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import baseInfo from "./base-info.vue";
+import useContent from "./use-content.vue";
+import finish from "./finish.vue";
+const router = useRouter();
+const route = useRoute();
+
+const step = ref(1);
+
+const state = reactive({ data: 1 });
+
+const cancel = () => {
+  router.back();
+};
+
+const confirm = (val) => {
+  step.value = step.value + val;
+};
+
+const useScript = () => {};
+</script>
+
+<style scoped>
+.content_process {
+  border-bottom: 1px solid #e6e9ef;
+  padding: 38px 16%;
+}
+.content_main {
+  height: calc(100vh - 287px);
+  padding: 30px;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  box-sizing: border-box;
+}
+.content_foot {
+  border-top: 1px solid #e6e9ef;
+  padding: 16px 16px 0 16px;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.process_desc {
+  background-color: #fff;
+  display: inline-block;
+  position: absolute;
+  padding: 0 5px;
+  font-size: 18px;
+  color: #202531;
+  font-weight: bold;
+}
+.process_desc img {
+  height: 25px;
+  width: 25px;
+  vertical-align: middle;
+}
+.process_end {
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.process_end div {
+  text-align: center;
+}
+.step_icon {
+  color: #fff;
+  font-weight: 600;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.icon_box {
+  display: inline-block;
+  background-color: #2b4695;
+  width: 48px;
+  height: 48px;
+  border-radius: 99px;
+  position: relative;
+  border: 3px solid #b0bee8;
+  vertical-align: middle;
+}
+.circle {
+  display: inline-block;
+  background-color: #a9b1c7;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  position: relative;
+  border: 6px solid #e6e9ef;
+  vertical-align: middle;
+}
+.content_process :deep(.el-step.is-horizontal .el-step__line) {
+  height: 4px;
+}
+.content_process :deep(.el-step__head.is-finish .el-step__line) {
+  background: linear-gradient(to right, #2b4695 50%, #e6e9ef 50%);
+}
+.process_complete :deep(.el-step__head.is-finish .el-step__line) {
+  background: linear-gradient(to right, #2b4695 100%, #e6e9ef 0%);
+}
+</style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/use-content.vue b/src/page/main/auto-maintenance/task-manage/add/use-content.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c9078f26e78299b9bea34a6eaeca85b8f5b7bbb5
--- /dev/null
+++ b/src/page/main/auto-maintenance/task-manage/add/use-content.vue
@@ -0,0 +1,69 @@
+<template>
+  <div>
+    <bg-form-gap title="执行脚本"></bg-form-gap>
+    <bg-inner-tabs v-model="state.useType" :data="state.useData"></bg-inner-tabs>
+    <div style="height: 493px; margin-bottom: 23px" v-show="state.useType == 0">
+      <bg-code-editor v-model="state.useText"></bg-code-editor>
+    </div>
+    <div v-show="state.useType == 1" class="file-box">
+      <p>上传文件</p>
+      <bg-upload v-model="state.doc_file" custom-tips :file-types="['yaml', 'yml']" :file-max-size="20" :limit="1">
+        <span>将文件拖到此处，或 点击上传</span><br />
+        <span>支持上传一个后缀为.yaml或.yml的文件</span><br />
+        <span>文件大小不超过20M</span>
+      </bg-upload>
+    </div>
+    <bg-form-gap title="执行主机"></bg-form-gap>
+    <el-form ref="ruleFormRef" :model="state.ruleForm" :rules="state.rules" label-position="top" label-width="120px">
+      <el-form-item label="主机分组名称" prop="name" style="width: 1100px">
+        <el-select v-model="state.ruleForm.name" style="width: 1020px" clearable placeholder="请选择">
+          <el-option v-for="item in state.options" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <span class="add-pc can_click_text">去创建</span>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+const router = useRouter();
+const route = useRoute();
+const state = reactive({
+  useType: 0,
+  useData: ["文本执行", "文件执行"],
+  useText: "",
+  doc_file: [],
+  ruleForm: {
+    name: "",
+  },
+  rules: {
+    name: [{ required: true, message: "请选择主机分组", trigger: "change" }],
+  },
+  options: [
+    {
+      label: "12",
+      value: "qwqw",
+    },
+  ],
+});
+</script>
+
+<style lang="scss" scoped>
+.add-pc {
+  font-size: 14px;
+  margin-left: 10px;
+}
+
+.file-box {
+  margin-top: 20px;
+  margin-bottom: 20px;
+  p {
+    color: #202531;
+    font-size: 14px;
+    margin-bottom: 10px;
+  }
+}
+</style>
diff --git a/src/page/main/auto-maintenance/task-manage/index.vue b/src/page/main/auto-maintenance/task-manage/index.vue
index 40604116af5ccf2141ad1ce558bea9f359bd9c8f..b920fc23092981f0e073026e0cdcd19977a01699 100644
--- a/src/page/main/auto-maintenance/task-manage/index.vue
+++ b/src/page/main/auto-maintenance/task-manage/index.vue
@@ -153,6 +153,10 @@ import { ElMessage } from "element-plus";
 import axios from "@/request/http.js";
 import { Search } from "@element-plus/icons-vue";
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import { useRouter, useRoute } from "vue-router";
+const router = useRouter();
+const route = useRoute();
+
 const bgForm = ref(null);
 const dataTable = ref(null);
 const headers = [
@@ -343,24 +347,8 @@ const changeSize = (size) => {
 }; // 改变每页条数
 
 const register = () => {
-  state.formData = {
-    name: "",
-    describe: "",
-    state: 1,
-    p_dict_id: state.fatherRow ? state.fatherRow.dict_id : "",
-  };
-  if (state.bgForm) {
-    nextTick().then(() => {
-      state.bgForm.validate((valid) => {
-        if (!valid) {
-          state.bgForm.clearValidate();
-        }
-      });
-    });
-  }
-  state.addType = 1;
-  state.addDialog = true;
-}; // 新增字典按钮
+  router.push(`/auto-maintenance/task-manage/add`);
+};
 
 onBeforeMount(() => {
   getTypeList();
diff --git a/src/page/main/forewarning/list/index.vue b/src/page/main/forewarning/list/index.vue
index a3133cc869236ddeec611f4ff0c127524740f7a5..9ccecf8e4c596f2787c291c179b068d2a4122a83 100644
--- a/src/page/main/forewarning/list/index.vue
+++ b/src/page/main/forewarning/list/index.vue
@@ -123,75 +123,59 @@
       </div>
     </div>
     <!-- todo: 推送提醒 -->
-    <!-- <el-dialog
-      class="dialog_box"
-      :title="addType == 1 ? '新增' : '编辑'"
-      v-model="addDialog"
-      width="758px">
-      <el-form ref="bgForm" :model="formData" :rules="rules" label-width="80px" class="bg_form">
-        <el-form-item label="名称" prop="name">
-          <el-input
-            v-model.trim="formData.name"
-            show-word-limit
-            :maxlength="
-              nodeClassifyId == 'eb9c7d70-c123-42b7-8e61-dde1b022b669'
-                ? 6
-                : nodeClassifyId == 'efd9ec3b-7f18-49e2-9d88-bcca022243bb'
-                ? 4
-                : nodeClassifyId == '949a1138-4995-464e-97a9-424d097eb271'
-                ? 2
-                : 20
-            "
-            placeholder="请输入名称"></el-input>
-        </el-form-item>
-        <el-form-item label="描述" prop="describe">
-          <el-input
-            v-model="formData.describe"
-            type="textarea"
-            :autosize="{ minRows: 5 }"
-            show-word-limit
-            maxlength="200"
-            resize="vertical"
-            placeholder="请输入描述"></el-input>
-        </el-form-item>
-        <el-form-item label="是否启用" prop="state" style="margin-bottom: 0px">
-          <el-switch
-            class="bg-switch-ele"
-            v-model="formData.state"
-            :active-value="1"
-            :inactive-value="0"
-            inline-prompt
-            active-text="是"
-            inactive-text="否" />
+    <el-dialog title="推送提醒" v-model="pushDialog" width="780px" :before-close="cancelPushDialog">
+      <div class="warning_info">
+        <bg-icon
+          style="font-size: 12px; color: #a9b1c7; margin-right: 8px; vertical-align: middle"
+          icon="#bg-ic-s-circle-tips"></bg-icon
+        >该推送为临时推送，可调整推送人员，仅本次有效！如固定通知人员，则前往【预警规则设置】调整预警内容
+      </div>
+      <el-form ref="pushForm" :model="pushFormData" :rules="pushRules" label-width="120px" class="bg_form">
+        <el-form-item label="预警工单推送" prop="method" style="margin-bottom: 24px">
+          <el-checkbox-group v-model="pushFormData.method">
+            <el-checkbox :label="1">钉钉</el-checkbox>
+            <el-checkbox :label="2">短信</el-checkbox>
+          </el-checkbox-group>
         </el-form-item>
       </el-form>
+      <user-input-table v-if="userTableFlag" ref="userTable" :data="userData" @change="changeData" />
       <template v-slot:footer>
         <div class="apaas_button">
-          <el-button type="default" @click="addDialog = false">取 消</el-button>
-          <el-button type="primary" @click="addConfirm">保 存</el-button>
+          <el-button type="default" @click="cancelPushDialog">取消</el-button>
+          <el-button type="primary" @click="pushConfirm">确定</el-button>
         </div>
       </template>
-    </el-dialog> -->
+    </el-dialog>
 
-    <!-- todo：关闭提醒 -->
-    <!-- <el-dialog
+    <!-- 关闭提醒 -->
+    <el-dialog
       class="dialog_box"
-      title="提示"
-      v-model="dialogDelete"
+      title="关闭预警"
+      v-model="closeWarningDialog"
       width="400px"
-      :before-close="
-        () => {
-          dialogDelete = false;
-        }
-      ">
-      <div>确定要删除此字典值吗？</div>
+      :before-close="cancelCloseWarningDialog">
+      <el-form ref="closeForm" :model="closeFormData" :rules="closeRules" label-width="80px" class="bg_form">
+        <el-form-item label="关闭备注" prop="close_notes">
+          <el-input
+            v-model="closeFormData.close_notes"
+            type="textarea"
+            :autosize="{ minRows: 2 }"
+            show-word-limit
+            maxlength="30"
+            resize="vertical"
+            placeholder="请输入内容"></el-input>
+        </el-form-item>
+        <el-form-item label="" prop="close_remind" style="margin-bottom: 0px">
+          <el-checkbox v-model="closeFormData.close_remind" label="三天内将不再推送该预警信息" />
+        </el-form-item>
+      </el-form>
       <template v-slot:footer>
         <div class="apaas_button">
-          <el-button type="default" @click="dialogDelete = false">取 消</el-button>
-          <el-button type="primary" @click="deleteData">确 定</el-button>
+          <el-button type="default" @click="cancelCloseWarningDialog">取消</el-button>
+          <el-button type="primary" @click="confirmClose">确定</el-button>
         </div>
       </template>
-    </el-dialog> -->
+    </el-dialog>
   </div>
 </template>
 
@@ -201,11 +185,14 @@ import { ElMessage } from "element-plus";
 import axios from "@/request/http.js";
 import { Search } from "@element-plus/icons-vue";
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import userInputTable from "./user-input-table.vue";
 const bgForm = ref(null);
 const dataTable = ref(null);
+const closeForm = ref(null);
+const userTable = ref(null);
+const pushForm = ref(null);
 
 const state = reactive({
-  bgForm,
   warningTypes: [
     {
       name: "全部",
@@ -338,25 +325,28 @@ const state = reactive({
     limit: 10,
   }, // 表格筛选项
   actionRow: null, // 当前操作的数据
-  dialogDelete: false, // 删除弹窗
-  addType: 0, //
-  addDialog: false,
-  formData: {
-    name: "",
-    describe: "",
-    state: 1,
-    p_dict_id: "",
+  closeWarningDialog: false, // 删除弹窗
+  closeFormData: {
+    close_notes: "",
+    close_remind: false,
+  },
+  closeRules: {
+    close_notes: [{ required: true, message: "请输入关闭备注", trigger: "blur" }],
+  },
+  pushDialog: false,
+  userData: [],
+  pushFormData: {
+    method: [],
   },
-  rules: {
-    name: [{ required: true, message: "请输入名称", trigger: "blur" }],
-    describe: [
-      { required: true, message: "请输入描述", trigger: "blur" },
-      { max: 200, message: "描述最大为200字", trigger: "blur" },
-    ],
-    state: [{ required: true, message: "请选择是否启用", trigger: "change" }],
+  pushRules: {
+    method: [{ type: "array", required: true, message: "请最少选择一种推送方式", trigger: "change" }],
   },
 });
 
+const userTableFlag = computed(() => {
+  return !!state.pushDialog;
+});
+
 const selectRows = (data) => {
   state.selected = data.selection;
 };
@@ -424,7 +414,7 @@ const getTableRows = () => {
       notice_people_num: 2,
       push_times: 2,
       last_push_time: "2020-01-01 00:00:00",
-      state: 1,
+      state: 0,
     },
     {
       id: 2,
@@ -474,19 +464,87 @@ const batchPush = () => {
 const pushWarning = (row) => {
   state.actionRow = row;
   console.log("推送提醒");
+  state.userData = [
+    {
+      account: 1,
+      name: "张一",
+      mobile: "13111111111",
+    },
+    {
+      account: 2,
+      name: "张二二",
+      mobile: "13222222222",
+    },
+    {
+      account: 4,
+      name: "张四三",
+      mobile: "13443434344",
+    },
+  ];
+  state.pushDialog = true;
 }; // 推送提醒
 
+const changeData = (data) => {
+  state.userData = data.data;
+};
+
+const cancelPushDialog = () => {
+  pushForm.value.resetFields();
+  state.pushDialog = false;
+}; // 预警推送弹窗取消按钮：重置表单
+
+const pushConfirm = () => {
+  pushForm.value.validate((valid) => {
+    if (valid) {
+      console.log(state.actionRow.id, state.userData);
+      console.log(state.pushFormData);
+      cancelPushDialog();
+    }
+  });
+};
+
 const closeWarning = (row) => {
   state.actionRow = row;
+  state.closeWarningDialog = true;
   console.log("关闭预警");
 }; // 关闭预警
 
+const cancelCloseWarningDialog = () => {
+  closeForm.value.resetFields();
+  state.closeWarningDialog = false;
+}; // 关闭预警弹窗取消按钮：重置表单
+
+const confirmClose = () => {
+  closeForm.value.validate((valid) => {
+    if (valid) {
+      console.log(state.actionRow.id);
+      console.log(state.closeFormData);
+      cancelCloseWarningDialog();
+    }
+  });
+}; // 关闭预警弹窗确定按钮：提交表单
+
 onBeforeMount(() => {
   getTableRows();
 });
 
-const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, riskLevels, stateOptions } =
-  toRefs(state);
+const {
+  headers,
+  tableRows,
+  tableTotal,
+  filter,
+  warningTypes,
+  warningTargets,
+  riskLevels,
+  stateOptions,
+  closeWarningDialog,
+  closeFormData,
+  closeRules,
+  pushDialog,
+  userData,
+  pushFormData,
+  pushRules,
+} = toRefs(state);
 </script>
 
 <style lang="scss" scoped>
@@ -548,7 +606,7 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri
     width: 100%;
     box-sizing: border-box;
     .el-form-item {
-      margin-bottom: 24px;
+      margin-bottom: 16px;
       :deep().el-form-item__label {
         line-height: 36px;
         height: 36px;
@@ -557,26 +615,19 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri
         width: 100%;
         .el-textarea {
           :deep().el-input__count {
-            bottom: -16px;
+            bottom: 6px;
             right: 4px;
             font-family: Roboto-Regular;
             color: #a9b1c7;
           }
         }
-        .bg-switch-ele {
-          width: 52px;
-          height: 24px;
-          :deep().el-switch__core {
-            width: 100%;
-            height: 24px;
-            .el-switch__inner,
-            .el-switch__action {
-              top: 3px;
-            }
-          }
-        }
       }
     }
   }
+  :deep().dialog_box {
+    .el-dialog__body {
+      padding-bottom: 0;
+    }
+  }
 }
 </style>
diff --git a/src/page/main/forewarning/list/user-input-table.vue b/src/page/main/forewarning/list/user-input-table.vue
new file mode 100644
index 0000000000000000000000000000000000000000..86288fcac84fe99da0f7c0c58fe1892070894155
--- /dev/null
+++ b/src/page/main/forewarning/list/user-input-table.vue
@@ -0,0 +1,269 @@
+<template>
+  <el-form ref="ruleFormRef" class="ruleForm" :model="tableRows" :size="formSize" :rules="formRules">
+    <bg-table-pro showIndex :headers="headers" :data="tableRows" ref="input-table" :border="true" :stripe="false">
+      <template v-slot:account="{ row, index }">
+        <el-form-item :prop="`[${index}].account`" :rules="formRules.account" style="width: 100%">
+          <el-select
+            v-model="row.account"
+            placeholder="请选择帐号"
+            style="width: 100%"
+            @change="changeAccount(row)"
+            :disabled="disabled">
+            <el-option
+              v-for="(item, index) in userLists"
+              :key="'userItem' + index"
+              :disabled="item.disabled"
+              :label="item.account"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <template v-slot:name="{ row, index }">
+        <el-form-item :prop="`[${index}].name`" :rules="formRules.name" style="width: 100%">
+          <el-input @change="changeName" placeholder="请输入姓名" :disabled="disabled" v-model.trim="row.name" />
+        </el-form-item>
+      </template>
+      <template v-slot:mobile="{ row, index }">
+        <el-form-item :prop="`[${index}].mobile`" :rules="formRules.mobile" style="width: 100%">
+          <el-input
+            @change="changeMobile"
+            placeholder="请输入联系方式"
+            :disabled="disabled"
+            v-model.trim="row.mobile" />
+        </el-form-item>
+      </template>
+
+      <template v-slot:action="{ row, index }">
+        <bg-table-btn
+          :disabled="disabled || !canAdd"
+          :click="
+            () => {
+              addParam(index);
+            }
+          "
+          >增加</bg-table-btn
+        >
+        <bg-table-btn
+          :disabled="disabled"
+          :click="
+            () => {
+              removeParam(row, index);
+            }
+          ">
+          删除
+        </bg-table-btn>
+      </template>
+    </bg-table-pro>
+  </el-form>
+</template>
+
+<script setup>
+import { reactive, toRefs, onBeforeMount, onMounted, ref, getCurrentInstance, watch, computed } from "vue";
+import { v4 as uuidv4 } from "uuid";
+import { validatePhone } from "@/services/rules.js";
+const props = defineProps({
+  data: {
+    type: Array,
+    default: () => [],
+  },
+  disabled: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const emit = defineEmits(["change"]);
+const formSize = ref("default");
+const ruleFormRef = ref(null);
+
+const formRules = reactive({
+  name: [
+    {
+      required: true,
+      message: "请输入键",
+      trigger: "blur",
+    },
+    {
+      max: 50,
+      message: "最多50个字符",
+      trigger: "blur",
+    },
+  ],
+  account: [
+    {
+      required: true,
+      message: "请选择帐号",
+      trigger: "change",
+    },
+  ],
+  mobile: [
+    {
+      required: true,
+      message: "请输入联系方式",
+      trigger: "blur",
+    },
+    { validator: validatePhone, trigger: "blur" },
+  ],
+});
+
+const headers = reactive([
+  {
+    label: "帐号",
+    prop: "account",
+    required: true,
+  },
+  {
+    label: "姓名",
+    prop: "name",
+    required: true,
+  },
+  {
+    label: "联系方式",
+    prop: "mobile",
+    required: true,
+  },
+  {
+    label: "操作",
+    prop: "action",
+    width: 120,
+  },
+]);
+
+const state = reactive({
+  tableRows: [],
+  userLists: [
+    {
+      account: "admin",
+      id: 1,
+      name: "张一",
+      mobile: "13111111111",
+    },
+    {
+      account: "ys-admin",
+      id: 2,
+      name: "张二",
+      mobile: "13222222222",
+    },
+    {
+      account: "yf-user",
+      id: 3,
+      name: "张三",
+      mobile: "13333333333",
+    },
+    {
+      account: "putong",
+      id: 4,
+      name: "张四",
+      mobile: "13444444444",
+    },
+  ],
+});
+
+watch(
+  () => state.tableRows,
+  (n, o) => {
+    let list = state.tableRows.map((e) => {
+      return e.account;
+    });
+    state.userLists.forEach((e) => {
+      if (list.indexOf(e.id) > -1) {
+        e.disabled = true;
+      } else {
+        e.disabled = false;
+      }
+    });
+  },
+  {
+    deep: true,
+  }
+);
+
+const canAdd = computed(() => {
+  return state.tableRows.length >= 5 ? false : true;
+}); // 最多五条数据，控制下新增按钮的禁用
+
+onBeforeMount(() => {
+  initTable();
+});
+
+var initTable = () => {
+  if (props.data && props.data.length >= 1) {
+    state.tableRows = props.data;
+  } else {
+    state.tableRows = [];
+    addParam(0);
+  }
+};
+
+var createRow = () => {
+  return {
+    id: uuidv4(),
+    account: "",
+    name: "",
+    mobile: "",
+  };
+};
+
+var addParam = (index) => {
+  state.tableRows.splice(index + 1, 0, createRow());
+};
+
+var removeParam = (row, index) => {
+  state.tableRows.splice(index, 1);
+  if (state.tableRows.length === 0) {
+    addParam(0);
+  }
+};
+
+const changeAccount = (row) => {
+  state.userLists.forEach((e) => {
+    if (e.id == row.account) {
+      row.name = e.name;
+      row.mobile = e.mobile;
+    }
+  });
+  emit("change", {
+    type: "account",
+    data: state.tableRows,
+  });
+};
+
+const changeName = () => {
+  emit("change", {
+    type: "name",
+    data: state.tableRows,
+  });
+};
+
+const changeMobile = () => {
+  emit("change", {
+    type: "mobile",
+    data: state.tableRows,
+  });
+};
+
+var getInputData = () => {
+  let lastData = [];
+  let tempObj = {};
+  state.tableRows.forEach((e) => {
+    tempObj[e.name] = e;
+  });
+  for (const key in tempObj) {
+    if (key && tempObj[key].value) {
+      lastData.push(tempObj[key]);
+    }
+  }
+  return lastData;
+};
+
+const { tableRows, userLists } = toRefs(state);
+
+//暴露获取数据方法
+defineExpose({
+  getInputData,
+  initTable,
+});
+</script>
+
+<style scoped></style>
diff --git a/src/router/index.js b/src/router/index.js
index c0dd1870579f14058e9b7a2c0982722d24f43ee7..69bf7d9c88c2ebff31b2ae641a00ab1917a16ce5 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -3,98 +3,84 @@
 import { createRouter, createWebHashHistory } from "vue-router";
 import store from "../store";
 
-
 //写入初始必须有的路由
 //或者隐藏式路由，不会表现在菜单上，但是需要存在的路由
-const routes = [{
-        path: "/login",
-        name: "login",
-        show: true,
-        component: () =>
-            import ("../page/login/index.vue"),
-    },
-    {
-        path: "/register",
-        name: "register",
-        show: true,
-        component: () =>
-            import ("../page/register/index.vue"),
-    },
-    {
-        path: "/password",
-        name: "password",
-        show: true,
-        component: () =>
-            import ("../page/password/index.vue"),
-    },
-    {
-        path: "/",
-        name: "index",
-        component: () =>
-            import ("../page/welcom.vue"),
-    },
-    {
-        path: "/404",
-        show: true,
-        component: () =>
-            import ("../page/404.vue"),
-    },
+const routes = [
+  {
+    path: "/login",
+    name: "login",
+    show: true,
+    component: () => import("../page/login/index.vue"),
+  },
+  {
+    path: "/register",
+    name: "register",
+    show: true,
+    component: () => import("../page/register/index.vue"),
+  },
+  {
+    path: "/",
+    name: "index",
+    component: () => import("../page/welcom.vue"),
+  },
+  {
+    path: "/404",
+    show: true,
+    component: () => import("../page/404.vue"),
+  },
 ];
 
 //重新创建router
 function newRouterFunc() {
-    return createRouter({
-        history: createWebHashHistory(),
-        routes,
-    });
+  return createRouter({
+    history: createWebHashHistory(),
+    routes,
+  });
 }
 
 const router = newRouterFunc();
 
 function inWhiteList(toPath) {
-    //配置白名单
-    const whiteList = ['/login']
-    const path = whiteList.find((value) => {
-        // 使用正则匹配
-        const reg = new RegExp('^' + value)
-        return reg.test(toPath)
-    })
-    return !!path
+  //配置白名单
+  const whiteList = ["/login"];
+  const path = whiteList.find((value) => {
+    // 使用正则匹配
+    const reg = new RegExp("^" + value);
+    return reg.test(toPath);
+  });
+  return !!path;
 }
 
 router.beforeEach((to, from, next) => {
-
-    const userInfo = store.state.userInfo
-
-    //已登录不可跳转登陆页
-    if (userInfo && to.path == '/login') {
-        next({ path: from.path })
-    }
-
-    // 检查to.path是否存在于免登陆白名单
-    if (inWhiteList(to.path)) {
-        next()
-    } else {
-        // 判断是否已经登录，未登录则重定向到首页或其他页面（通过query传参记录原来的路径）
-        // 根据配置判断是否跳转第三方登录，跳转第三方登录则不跳login
-        // axios封装中也需要对是否登录过期进行判断，如果登录过期，则跳转登录页，具体跳转地址根据配置来·
-        // if (!userInfo) {
-        //     next({
-        //         path: '/login',
-        //     })
-        // } else {
-
-        // }
-    }
-
-    //判读是否匹配，否则跳转404
-    if (to.matched.length !== 0) {
-        next()
-    } else {
-        return next({ path: '/404' })
-    }
-})
-
+  const userInfo = store.state.userInfo;
+
+  //已登录不可跳转登陆页
+  if (userInfo && to.path == "/login") {
+    next({ path: from.path });
+  }
+
+  // 检查to.path是否存在于免登陆白名单
+  if (inWhiteList(to.path)) {
+    next();
+  } else {
+    // 判断是否已经登录，未登录则重定向到首页或其他页面（通过query传参记录原来的路径）
+    // 根据配置判断是否跳转第三方登录，跳转第三方登录则不跳login
+    // axios封装中也需要对是否登录过期进行判断，如果登录过期，则跳转登录页，具体跳转地址根据配置来·
+    // if (!userInfo) {
+    //     next({
+    //         path: '/login',
+    //     })
+    // } else {
+    // }
+  }
+
+  //判读是否匹配，否则跳转404
+  if (to.matched.length !== 0) {
+    next();
+  } else {
+    return next({ path: "/404" });
+  }
+});
 
 // 在路由完成初始导航时调用，如果有异步操作放置到这里
 // 请求相应的角色和菜单
@@ -102,38 +88,33 @@ router.beforeEach((to, from, next) => {
 //   generateRoutes()
 // })
 function addRoute(router, routers) {
-    routers.forEach(e => {
-        router.addRoute(e)
-        if (e.children && e.children.length) {
-            addRoute(router, e.children)
-        }
-    });
+  routers.forEach((e) => {
+    router.addRoute(e);
+    if (e.children && e.children.length) {
+      addRoute(router, e.children);
+    }
+  });
 }
 
 export function generateRoutes() {
-    const _asyncRoutes = store.state.route
-
-    if (_asyncRoutes) {
-        //动态添加路由
-
-        addRoute(router, _asyncRoutes)
-    }
+  const _asyncRoutes = store.state.route;
 
-    router.addRoute({
-        path: '/:pathMatch(.*)',
-        redirect: '/404'
-    })
+  if (_asyncRoutes) {
+    //动态添加路由
 
+    addRoute(router, _asyncRoutes);
+  }
 
+  router.addRoute({
+    path: "/:pathMatch(.*)",
+    redirect: "/404",
+  });
 }
 
 //新创建一个router替代之前的router，并把matcher方法替换成新的router的matcher
 export function resetRouter() {
-    const newRouter = newRouterFunc()
-    router.matcher = newRouter.matcher
+  const newRouter = newRouterFunc();
+  router.matcher = newRouter.matcher;
 }
 
-
-
-
-export default router
\ No newline at end of file
+export default router;