系统维护v0

ZZJ

2021-09-28 0cfab2b97c0913d2f5ccd55760f8768316f91138

系统维护v0

 src/pages/settings/views/generalSettings.vue

@@ -1040,6 +1040,9 @@
        font-size: 16px;

        font-weight: 700;

      }

      &:hover {

        border: 1px solid var(--colorCard) !important;

      }

    }

    button:first-child {

      background-color: #e0e0e0;

@@ -1049,6 +1052,7 @@
    }

    button:last-child {

      background-color: var(--colorCard) !important;

      border: 1px solid var(--colorCard) !important;

      span { 

         color: #fff;

      }


 src/pages/vindicate/views/backUp.vue

@@ -144,6 +144,7 @@
<style lang="scss">

.all {

  width: 100%;

  background-color: #FBFAFF;

}



.backup-content {

@@ -153,6 +154,8 @@
  flex: 1;

  flex-basis: auto;

  box-sizing: border-box;

  border-top:2px solid #E1E0E6 ;

  border-left:2px solid #E1E0E6 ;

  .backup-center {

    height: 100%;

    width: 280px;


 src/pages/vindicate/views/restartSettings.vue

@@ -1,7 +1,9 @@
<template>

  <div class="restart" 

   v-loading="loading"

      :element-loading-text="loadingText"

   :element-loading-text="loadingText"

   element-loading-spinner="restart-loading"

   element-loading-background="rgba(0, 0, 0, 0.35)"

  >

    <div class="restart-set">

      <div class="t">重启设置</div>

@@ -76,6 +78,7 @@
      <div class="bar" v-if="every != 'close'">

        <div class="name">重启时间</div>

        <el-time-picker

          popper-class="restartTimePicker"

          v-model="time"

          :picker-options="{ selectableRange: '00:00:00 - 23:59:59' }"

          value-format="HH:mm"

@@ -83,6 +86,7 @@
          placeholder="任意时间点"

          size="small"

          @change="updateExpression"

          :popper-append-to-body="false"

        ></el-time-picker>

      </div>

    </div>

@@ -101,13 +105,14 @@
export default {

  data() {

    return {

      warnSpn: "\ue71c",

      time: "",

      saveBtn: false,

      timer: null,

      probeSum: 0,

      cronText: "",

      loading:false,

      loadingText:"",

      loadingText:"智能计算节点正在重启，请耐心等待......",

      cronValueObj: {

        min: "*",

        hour: "*",

@@ -195,10 +200,24 @@
      this.$router.push("/");

    },

    restart() {

      this.$confirm("确定要重启该节点吗?","提示", {

        type:"warning",

        cancelButtonClass: "comfirm-class-cancle",

        confirmButtonClass: "comfirm-class-sure",

      const h = this.$createElement;

     const icon = this.$msgbox( {

        title: "",

        message: h(

          "div",

          {

            style:

              "display: flex;  flex-direction: column; justify-content: center; align-items: center;",

          },

          [

            h("span", { class: "icon iconfont warn-icon" }, `${this.warnSpn}`),

            h("span", { class: "warn-title" }, "节点重启 "),

            h("span", { class: "warn-dec" }, "确定要重启该节点吗??"),

          ]

        ),

        showCancelButton: true,

        confirmButtonText: "确定",

        cancelButtonText: "取消",

      }).then(() => {

        this.loading = true;

        this.loadingText = "智能计算节点正在重启，请耐心等待..."

@@ -319,47 +338,57 @@
<style lang="scss">

.all {

  width: 100%;

  background-color: #FBFAFF;

}

.restart {

  margin: 0 auto;

  padding: 20px;

  padding: 10px;

  font-size: 16px;

  color: #333;

  font-weight: 700;

  vertical-align: middle;

  border-top:2px solid #E1E0E6 ;

  border-left:2px solid #E1E0E6 ;

  .t {

    height: 48px;

    background: #F2F2F7;

    box-sizing: border-box;

    text-align: left;

    width: 70%;

    margin: 0 auto;

    padding: 10px;

    font-size: 16px;

    width: 100%;

    padding: 10px 20px;

    line-height: 32px;

    border-radius:8px ;

  }

  .bar {

    height: 50px;



    width: 70%;

    background: rgba(248, 248, 248, 1);

    margin: 0 auto;

    width: 100%;

    background: #F2F2F7;

    min-width: 300px;

    display: flex;

    justify-content: space-between;

    box-sizing: border-box;

    padding: 0 20px;

    padding: 0 50px;

    align-items: center;

    border-radius: 10px;

    margin-bottom: 10px;

    border-radius: 8px;

    margin-top: 4px;

    margin-bottom: 4px;

    .reset-btn {

      width: 70px;

      height: 32px;

      border-radius: 5px;

     width: 150px;

     height: 32px;

     border-radius: 20px;

     background: rgba(78, 148, 255, 0.1) !important;

     border: 1px solid var(--colorCard);

     color: #333333;

     font-weight: bold;

     font-size: 14px;

    }

    .el-select {

      width: 100%;

    }

    
    .name {

      min-width: 150px;

      text-align: left;

      font-size: 14px;

    }

    .el-input__inner::placeholder {

      color: rgba(107, 107, 107, 1);

      color: rgba(107, 107, 107, 1) !important;

    }

    .el-input--small .el-input__inner {

      height: 32px;

@@ -375,10 +404,143 @@
    .el-date-editor.el-input__inner {

      width: 100%;

    }



    
  }

  
  .el-select {

      width: 509px;

      height: 32px;

     
      input {

         background: #FBFAFF !important;

         border-radius: 20px !important;

         text-align: center;

      }

    }

  .el-date-editor {

    width: 509px;

    height: 32px;

      input {

         background: #FBFAFF !important;

         border-radius: 20px !important;

         text-align: center;

      }



      .el-input__prefix {

        left: 215px !important;

      } 
  }

  .save-btn {

    width: 260px;

    margin-top: 50px;

    width: 251px;

    height: 40px;

    margin-top: 80px;

    background: var(--colorCard) !important;

    border: 1px solid var(--colorCard) !important;

    border-radius: 25px;

  }

}



.restartTimePicker {

    width: 509px !important;

    background-color: #FBFAFF !important;

    margin-top:8px !important;

   /*  .popper__arrow::after {

    display: none !important;

  } */

  }

</style>



<style lang="scss">

.warn-icon {

    color: #fe6d68;

    font-size: 40px;

    margin-top: 11px;

  }

  .warn-title {

    font-weight: bold;

    font-size: 16px;

    margin: 6px;

    line-height: 22px;

  }

  .warn-dec {

    font-weight: bold;

    font-size: 14px;

    color: #828282;

    line-height: 20px;

  }

   .el-message-box__headerbtn {

    top: 12px;

  }

  .el-message-box__headerbtn .el-message-box__close {

    color: #333333;

    font-weight: bold;

  }

  .el-message-box__btns {

    display: flex;

    justify-content: center;

    margin-top: 20px;

    .el-button:focus,

    .el-button:hover {

      background-color: none;

      border: none;

    }

    button {

      width: 175px;

      height: 40px;

      border-radius: 25px;

      span {

        font-size: 16px;

        font-weight: 700;

      }

      &:hover {

        border: 1px solid var(--colorCard) !important;

      }

    }

    button:first-child {

      background-color: #e0e0e0;

      span {

        color: #333333;

      }

    }

    button:last-child {

      background-color: var(--colorCard) !important;

      border: 1px solid var(--colorCard) !important;

      span { 
         color: #fff;

      }

    }

   } 


   .restart  .el-loading-mask .el-loading-spinner {

     top: 40%;

   }



 .restart  .el-loading-mask .el-loading-spinner .el-loading-text {

     font-size: 16px;

     font-weight: bold;

     color: #FFFFFF;

     margin-top:20px ;

   }



  .restart .el-loading-mask .restart-loading {

    background-image: url("/images/desktop/safari.png");

    display: block;

    width: 50px;

    height: 50px;

    margin-bottom:20px ;   
    background-size:50px ;

    margin: 0 auto;

    animation: rotate 6s linear infinite;

  }



  
@keyframes rotate{

    0%{

        transform: rotateZ(0deg);/*从0度开始*/

    }

    100%{

        transform: rotateZ(360deg);/*360度结束*/

    }

}

</style>


 src/pages/vindicate/views/sysInfo.vue

@@ -192,6 +192,8 @@
.v-sys-info {

  width: 100%;

  background-color: #FBFAFF;

  border-top:2px solid #E1E0E6 ;

  border-left:2px solid #E1E0E6 ;

  .el-dialog__header {

    padding: 15px 20px 10px;

    text-align: left;


 src/pages/vindicate/views/systemClean.vue

@@ -1,11 +1,28 @@
<template>

  <div class="clear" v-loading="loading" :element-loading-text="loadingText">

    <div class="head">

    <div class="clear-list">

        <div class="cap">

          <div class="cap-bar">

          <!-- <div class="inner-bar" :style="`width: ${100-percent}%;`"></div> -->

          <el-progress v-if="percent>25" type="circle" :percentage="100-percent" stroke-width="10"></el-progress>

          <el-progress v-if="percent<=25&&percent>0" type="circle" :percentage="100-percent" status="warning" stroke-width="10"></el-progress>

          <el-progress v-if="percent == 0" type="circle" :percentage="100-percent" status="exception" stroke-width="10"></el-progress>

        </div>

        <div class="cap-text">

            <span>磁盘可用: {{ percent }}%</span>

          </div>

       </div>



    <el-button type="primary" @click="deleteData">数据清理</el-button>

    </div>





    <div class="clear-list">

      <span class="t">请选择要清理的数据范围</span>

      <el-date-picker

        style="width: 100%"

        v-model="dataRange"

            value-format="yyyy-MM-dd"

        value-format="yyyy-MM-dd"

        type="daterange" 

        align="right"

        size="small"

@@ -14,28 +31,11 @@
        end-placeholder="结束日期"

        :picker-options="pickerOptions"

      ></el-date-picker>

    </div>

    </div>      


    <div class="desc">

      <div class="disk-img">

        <span class="icon iconfont">{{"\ue8b1"}}</span>



      </div>

      <div class="cap">

        <div class="cap-text">

          <span>磁盘可用: {{ percent }}%</span>

        </div>

        <div class="cap-bar">

          <div class="inner-bar" :style="`width: ${100-percent}%;`"></div>

        </div>

      </div>



      <el-button type="primary" @click="deleteData">数据清理</el-button>



      <div class="warm">

    <div class="warm">

        <i class="iconfont icontishi-zhuyi"></i>

        <span class="text">请注意，按以上日期范围删除的数据不可恢复，立即生效，请谨慎操作!</span>

      </div>

    </div>

  </div>

</template>

@@ -103,95 +103,72 @@
<style lang="scss">

.all {

  width: 100%;

  background-color: #FBFAFF;

}

.container {

 background-color: #FBFAFF;

}



.clear {

  margin: 0 auto;

  padding: 20px;

  .head {

    height: 50px;

    background-color: rgba(248, 248, 248, 1);

    border-radius: 10px;

  padding: 10px;

  border-top:2px solid #E1E0E6 ;

  border-left:2px solid #E1E0E6 ; 


  .clear-list {

  background: #F2F2F7;

  border-radius: 8px;

  height: 114px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0 45px;

  
  &:first-child {

    border-bottom: 1px solid #E1E0E6;

  }



  .cap {

    display: flex;

    align-items: center;

    justify-content: space-around;

    box-sizing: border-box;

    padding: 0 20px;

    width: 560px;

    margin: 0 auto;

    .t {

      font-size: 14px;

      min-width: 175px;

      text-align: left;

    }



    .el-range-editor--small.el-input__inner {

      border: none;

    .cap-bar {

    width: 70px;

    height: 70px;

    div {

      width: 100%;

      height: 100%;

      .el-progress-circle {

       width: 100% !important;

       height: 100% !important;

      }

      &::after {

        position: relative;

        top: -68%;

        content: '\e6e8';

        width: 25px;

        height: 25px;

        display: inline-block;

        margin: auto;

        font-family: "iconfont" !important;

        font-size: 25px;

        font-style: normal;

        -webkit-font-smoothing: antialiased;

        -moz-osx-font-smoothing: grayscale;

        
      }

    }

    .el-range-editor--small .el-range-separator {

      line-height: 26px;

    svg {

      width: 70px;

      height: 70px;

    }

    .el-progress__text {

      display: none !important;

    }

  }

  .desc {

    margin-top: 50px;

    .disk-img {

      height: 100px;

      width: 100px;

      margin: 0 auto;

      margin-bottom: 10px;

      // background-color: aquamarine;

      .iconfont{

        font-size: 82px;

        color: #3a8120;

      }

    }

    .cap {

      height: 50px;

      margin: 0 auto;

      width: 160px;

      margin-bottom: 20px;

      .cap-bar {

        height: 10px;

        background: rgb(239, 240, 236);

        //

        margin: 0 auto;

        border-radius: 2px;

      
        .inner-bar {

          background: #3a8120;

          height: 100%;

          border-radius: 2px;

        }

      }

      .cap-text {

        text-align: right;

        height: 25px;    
        text-align: right;

        line-height: 25px;

        font-size: 12px;

      }

    }

    .el-button--primary {

      width: 200px;

      font-size: 15px;

    }

    .warm {

      line-height: 30px;

      height: 30px;

      margin-top: 10px;

      display: flex;

      align-items: center;

      justify-content: center;

      .iconfont {

        font-size: 16px;



        color: #e99038;

        margin-right: 5px;

      }

      .text {

        color: rgb(175, 175, 175);

        font-size: 14px;

      }

    }

  }

  
}

}





</style>


 src/pages/vindicate/views/updateSettings.vue

@@ -320,6 +320,7 @@
<style lang="scss">

.all {

  width: 100%;

  background-color: #FBFAFF;

}

.update-set-content {

  height: 100%;

@@ -328,8 +329,8 @@
  flex: 1;

  flex-basis: auto;

  box-sizing: border-box;

  border-top: 4px solid #f8f8f8;

  border-left: 4px solid #f8f8f8;

  border-top:2px solid #E1E0E6 ;

  border-left:2px solid #E1E0E6 ;

  .cluster-center {

    height: 100%;

    width: 300px;