From b5e2e236828b7fbc0e8f2bdbf66651ad8907e3b1 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期三, 21 七月 2021 16:40:17 +0800
Subject: [PATCH] all

---
 src/pages/vindicate/index/App.vue |  671 +++++++------------------------------------------------
 1 files changed, 85 insertions(+), 586 deletions(-)

diff --git a/src/pages/vindicate/index/App.vue b/src/pages/vindicate/index/App.vue
index 7f0e417..d6af057 100644
--- a/src/pages/vindicate/index/App.vue
+++ b/src/pages/vindicate/index/App.vue
@@ -1,617 +1,116 @@
 <template>
-  <div class="s-system-manage">
-    <el-tabs
-      id="systemMaintenance"
-      v-model="activeName"
-      v-loading="loading"
-      :element-loading-text="loadingText"
-    >
-      <el-tab-pane label="璁惧缁存姢" name="device" v-if="isShow('vindicate:device')">
-        <div class="s-system-maintenance">
-          <div class="box-card">
-            <div class="ui-top-view">
-              <div class="ui-top-title">閲嶅惎</div>
-            </div>
-            <el-divider></el-divider>
-
-            <div class="box-card-content">
-              <el-button type="primary" size="small" style="width:80px" @click="reboot">閲嶅惎</el-button>
-
-              <b class="card-text">閲嶅惎鑺傜偣</b>
-
-              <el-row style="margin-top:20px">
-                <el-col>
-                  <vue-cron :expression="rebootCron" @update="setRebootCron" />
-                </el-col>
-              </el-row>
-            </div>
-          </div>
-          <!--
-          <div class="box-card">
-            <div class="ui-top-view">
-              <div class="ui-top-title">鎭㈠榛樿鍊�</div>
-            </div>
-            <el-divider></el-divider>
-
-            <div class="box-card-content">
-              <el-row>
-                <el-col :span="1">
-                  <el-button type="primary" size="small">绠�鍗曟仮澶�</el-button>
-                </el-col>
-                <el-col :span="23">
-                  <b class="card-text">绠�鍗曟仮澶嶈澶囧弬鏁�</b>
-                </el-col>
-              </el-row>
-              <el-row style="margin-top:20px">
-                <el-col :span="1">
-                  <el-button type="primary" size="small">瀹屽叏鎭㈠</el-button>
-                </el-col>
-                <el-col :span="23">
-                  <b class="card-text">瀹屽叏鎭㈠璁惧鍙傛暟鍒板嚭鍘傝缃�</b>
-                </el-col>
-              </el-row>
-            </div>
-          </div>
-          
-          <div class="box-card">
-            <div class="ui-top-view">
-              <div class="ui-top-title">鍙傛暟瀵煎叆瀵煎嚭</div>
-            </div>
-            <el-divider></el-divider>
-
-            <div class="box-card-content">
-              <el-row :gutter="4">
-                <el-col :span="1">
-                  <el-button type="info" size="small" style="width:80px">瀵煎叆</el-button>
-                </el-col>
-                <el-col :span="3" style="padding-left:30px">
-                  <el-input placeholder="涓婁紶鍙傛暟鏂囦欢" size="small" :readonly="true">
-                    <el-upload slot="suffix" action="https://jsonplaceholder.typicode.com/posts/">
-                      <el-button
-                        type="text"
-                        icon="el-icon-upload2"
-                        size="small"
-                        style="font-size:18px; color:#0088ff"
-                      ></el-button>
-                    </el-upload>
-                  </el-input>
-                </el-col>
-              </el-row>
-              <el-row style="margin-top:20px">
-                <el-col :span="1">
-                  <el-button type="primary" size="small">璁惧鍙傛暟</el-button>
-                </el-col>
-                <el-col :span="23">
-                  <b class="card-text">鍙傛暟瀵煎嚭</b>
-                </el-col>
-              </el-row>
-            </div>
-          </div>
-          -->
-          <div class="box-card">
-            <div class="ui-top-view">
-              <div class="ui-top-title">鍗囩骇</div>
-            </div>
-          </div>
-          <el-divider></el-divider>
-          <div class="box-card-content">
-            <el-row :gutter="4">
-              <el-col :span="12">
-                <file-uploader
-                  single
-                  uploadPlaceholder="涓婁紶鍗囩骇鏂囦欢"
-                  url="/data/api-v/sysset/patchUpdate"
-                  @complete="onFileUpload"
-                  @file-added="onFileAdded"
-                />
-              </el-col>
-              <el-col :span="2">
-                <el-button
-                  type="primary"
-                  size="small"
-                  style="width:80px"
-                  @click="upgrade"
-                  :disabled="!fileAdded"
-                  :loading="upgrading"
-                >鍗囩骇</el-button>
-              </el-col>
-              <el-col :span="16" class="upload-msg">
-                <span v-html="patchUpdateStatus"></span>
-              </el-col>
-            </el-row>
-          </div>
-        </div>
-      </el-tab-pane>
-      <el-tab-pane label="鏁版嵁搴撶淮鎶�" name="dbvdc" v-if="isShow('vindicate:db')">
-        <div class="box">
-          <p class="title">
-            <label>鏁版嵁娓呯悊</label>
-          </p>
-          <div class="range">
-            <div class="left">
-              <p>閫夋嫨鏁版嵁鑼冨洿锛�</p>
-            </div>
-            <div class="middle">
-              <el-date-picker
-                v-model="dataRange"
-                type="daterange"
-                range-separator="鑷�"
-                start-placeholder="寮�濮嬫棩鏈�"
-                end-placeholder="缁撴潫鏃ユ湡"
-                style="height:38px"
-                :picker-options="pickerOptions"
-              ></el-date-picker>
-            </div>
-            <div class="right">
-              <el-button @click="deleteData" style="height:38px;background:#ff0000;color:white">鍒犻櫎鏁版嵁</el-button>
-            </div>
-          </div>
-          <div class="tip">
-            <i class="iconfont icontishi-zhuyi"></i>
-            <p class="zhuyi">璇锋敞鎰忥紝鎸変互涓婃棩鏈熻寖鍥村垹闄ょ殑鏁版嵁涓嶅彲鎭㈠锛岀珛鍗崇敓鏁堬紝璇疯皑鎱庢搷浣�</p>
-          </div>
-        </div>
-      </el-tab-pane>
-    </el-tabs>
+  <div class="container">
+    <div class="container-left">
+      <div
+        class="left-card"
+        v-for="(item, i) in menuArr"
+        :key="i"
+        :class="activePage == i ? 'left-card-active' : ''"
+        @click="openMenu(item, i)"
+      >
+        <span class="icon iconfont">{{item.icon}}</span>
+        <span class="card-text">{{ item.name }}</span>
+      </div>
+    </div>
+    <systemClean v-if="activePage == 1" style="width: 100%" :percent="storagePercent"></systemClean>
+    <updateSettings v-if="activePage == 0" style="width: 100%"></updateSettings>
+    <back-up v-if="activePage == 3" style="width: 100%"></back-up>
+    <restartSettings v-if="activePage == 2" style="width: 100%"></restartSettings>
   </div>
 </template>
 
 <script>
-import { rebootServer, getDevInfo, getRebootTask, setRebootTask, fileUpload, doUpgrade, deleteDate } from "@/api/system"
-import VueCron from "@/components/subComponents/VueCron"
-import FileUploader from "@/components/subComponents/FileUpload/index"
-
+import {
+  getClockInfo,
+  saveClockInfo,
+  testNTPserver,freedisk
+} from "@/api/system";
+import systemClean from "../views/systemClean";
+import updateSettings from "../views/updateSettings";
+import BackUp from "../views/backUp";
+import restartSettings from "../views/restartSettings";
 export default {
+  name: "settings",
   components: {
-    VueCron,
-    FileUploader
+    systemClean,
+    updateSettings,
+    BackUp,
+    restartSettings,
   },
   data() {
     return {
-      timer: null,
-      buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
-      rebootCron: "",
-      activeName: "device",
-      restartValue: "涓嶉噸鍚�",
-      restartTimeValue: new Date(2019, 9, 10, 18, 40),
-      loading: false,
-      loadingText: '',
-      probeSum: 0,
-      patchUpdateStatus: "",
-      dataRange: [
-        this.$moment().format("YYYY-MM-DD HH:mm:ss"),
-        this.$moment().format("YYYY-MM-DD HH:mm:ss")
+      menuArr: [
+        { name: "鏇存柊璁剧疆" ,icon:"\ue60f" },
+        // { name: "澶囦唤杩樺師",icon:""  },
+        { name: "绯荤粺娓呯悊" ,icon:"\ue6e0" },
+        { name: "閲嶅惎璁剧疆" ,icon:"" },
       ],
-      fileUploadUrl: fileUpload,
-      patchFile: {},
-      pickerOptions: {
-        disabledDate(time) {
-          var day = new Date()
-          day.setTime(day.getTime() - 24 * 60 * 60 * 1000)
-          return time.getTime() > day;
-        },
-      },
-      upgrading: false,
-      fileAdded: false,
+      activePage: 0,
+      storagePercent: 0,
     };
   },
   mounted() {
-    this.getRebootCron()
-    if (!this.isShow('vindicate:device')) {
-      this.activeName = "dbvdc"
-    }
-  },
-  computed: {
-    isAdmin() {
-      if (
-        sessionStorage.getItem('userInfo') &&
-        sessionStorage.getItem('userInfo') !== ''
-      ) {
-        let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
-        return (
-          loginName === 'superadmin' || loginName === 'basic'
-        )
-      }
-      return false;
-    }
+     this.getLeftPer()
   },
   methods: {
-    isShow(authority) {
-      if (this.isAdmin) {
-        return true
-      } else if (
-        this.buttonAuthority.indexOf(',' + authority + ',') > -1
-      ) {
-        return true
-      } else {
-        return false
-      }
+    openMenu(item, i) {
+      this.activePage = i;
     },
-    format(array) {
-      return [
-        this.$moment(array[0]).format("YYYY-MM-DD"),
-        this.$moment(array[1]).format("YYYY-MM-DD")
-      ];
-    },
-    getRebootCron() {
-      getRebootTask().then(rsp => {
-        this.rebootCron = rsp.data
+    getLeftPer(){
+      freedisk().then((res) => {
+        this.storagePercent = Math.round(res.data.free/ res.data.all *100)
       })
     },
-    setRebootCron(value) {
-      this.rebootCron = value
-      setRebootTask({ task: value }).then(rsp => {
-        if (rsp && rsp.success) {
-          this.$notify({
-            type: "success",
-            message: "閰嶇疆鎴愬姛"
-          })
-        }
-      }).catch(err => {
-        this.$notify({
-          type: "error",
-          message: "閰嶇疆澶辫触"
-        })
-      })
-    },
-    reboot() {
-      this.$confirm('纭畾瑕侀噸鍚鑺傜偣鍚�?', {
-        center: true,
-        cancelButtonClass: 'comfirm-class-cancle',
-        confirmButtonClass: 'comfirm-class-sure'
-      }).then(() => {
-        this.loading = true;
-        this.loadingText = "鏅鸿兘璁$畻鑺傜偣姝e湪閲嶅惎锛岃鑰愬績绛夊緟..."
-        rebootServer().then(rsp => {
-          this.probeServer(this.reLogin)
-        }).catch(err => {
-          if (err.status == 400) {
-            this.loading = false;
-            this.$notify({
-              type: "error",
-              message: "閲嶅惎璁$畻鑺傜偣澶辫触"
-            })
-          } else {
-            this.probeServer(this.reLogin)
-          }
-        })
-      })
-    },
-    deleteData() {
-      var timeRange = this.format(this.dataRange);
-      var showStartTime = timeRange[0]
-      var showEndTime = timeRange[1]
-      console.log("鏃堕棿锛�", showStartTime, showEndTime)
-      this.$confirm("鎻愮ず锛�" + showStartTime + " 鑷� " + showEndTime + " 浜х敓鐨勫叏閮ㄦ暟鎹皢琚垹闄わ紝姝ゆ搷浣滅珛鍗崇敓鏁堬紝涓嶅彲鎭㈠锛屾槸鍚﹀垹闄わ紵", {
-        center: true,
-        cancelButtonClass: "comfirm-class-cancle",
-        confirmButtonClass: "comfirm-class-sure"
-      }).then(() => {
-        this.loading = true
-        this.loadingText = "姝e湪鍒犻櫎鏁版嵁锛岃绋嶅�欙紒"
-        var param = {
-          startTime: showStartTime,
-          endTime: showEndTime
-        }
-        deleteDate(param).then(resp => {
-          if (resp.success) {
-            this.$message({
-              type: "success",
-              message: "鍒犻櫎鏁版嵁鎴愬姛"
-            })
-            this.loading = false
-          }
-        }).catch(err => {
-          this.$message({
-            type: "error",
-            message: "鍒犻櫎鏁版嵁澶辫触锛�"
-          })
-          this.loading = false
-        })
-
-      }).catch(() => {
-        console.log("鍙栨秷浜嗭紒")
-      })
-    },
-    reLogin() {
-      this.$router.push("/")
-    },
-    probeServer(callback) {
-      this.probeSum++;
-      let _this = this
-      if (this.probeSum > 60) {
-        this.$confirm('杩炴帴鏈嶅姟鍣ㄥけ璐�, 璇峰埛鏂伴〉闈㈡垨鑱旂郴绠$悊鍛�', '澶辫触', {
-          type: 'error',
-          cancelButtonClass: 'comfirm-class-cancle',
-          confirmButtonClass: 'comfirm-class-sure'
-        }).then(() => {
-          // _this.$router.push("/")
-          callback()
-        })
-        return
-      }
-
-      this.timer = setTimeout(() => {
-        getDevInfo().then(() => {
-          // _this.$router.push("/")
-          callback()
-        }).catch(err => {
-          _this.probeServer(callback)
-        })
-      }, 10000)
-    },
-    onFileUpload(file) {
-      this.patchUpdateStatus = `<span style="color:green">涓婁紶鎴愬姛, 鐐瑰嚮鍗囩骇鎸夐挳寮�濮嬪崌绾�</span>`
-      this.patchFile = { ...file }
-      this.fileAdded = true
-    },
-    onFileAdded() {
-      this.patchUpdateStatus = ""
-    },
-    upgrade() {
-      this.upgrading = true
-      this.patchUpdateStatus = `<span style="color:red">姝e湪鍗囩骇...</span>`
-      doUpgrade(this.patchFile).then(rsp => {
-        this.upgrading = false
-
-        if (rsp && rsp.success) {
-          clearTimeout(this.timer)
-          this.doneUpgrade()
-        }
-      }).catch(err => {
-        if (err.code) {
-          this.upgrading = false
-          this.patchUpdateStatus = `<span style="color:red">${err.data}</span>`
-          clearTimeout(this.timer)
-        } else {
-          this.probeServer(this.doneUpgrade)
-        }
-      })
-    },
-    doneUpgrade() {
-      this.upgrading = false
-      this.patchUpdateStatus = `<span style="color:green">鍗囩骇鎴愬姛</span>`
-      let _this = this
-      this.$confirm('鍗囩骇鎴愬姛, 璇烽噸鏂扮櫥褰曠郴缁�', '鎴愬姛', {
-        type: 'success',
-        cancelButtonClass: 'comfirm-class-cancle',
-        confirmButtonClass: 'comfirm-class-sure'
-      }).then(() => {
-        _this.reLogin()
-      })
-    }
-  }
+  },
 };
 </script>
 <style lang="scss">
-.s-system-manage {
-  width: 100% !important;
-  min-width: 759px;
-  box-sizing: border-box;
-  padding: 10px;
-  // background-color: #e9ebf2;
-  background-color: #fff;
-  .s-system-manage-breadcrumb {
-    height: 5%;
-    box-sizing: border-box;
-    border: 1px solid #e4e7ed;
-    box-shadow: #e4e7ed 0px 0px 9px inset;
-    box-shadow: #e4e7ed 0px 0px 9px inset;
-    border-radius: 5px;
-  }
-
-  .el-tabs--border-card {
-    border: 0px solid #dcdfe6;
-    -webkit-box-shadow: none;
-    box-shadow: none;
-    .el-tabs__header {
-      border: 0px solid #dcdfe6;
-      .el-tabs__item {
-        padding: 5px 50px;
-        height: 50px;
-        font-family: PingFangSC-Regular;
-        font-size: 15px;
-        color: #222222;
-        text-align: center;
-        border: 0px solid transparent;
-      }
-      .el-tabs__item:nth-child(2) {
-        padding-left: 50px !important;
-      }
-      .el-tabs__item:last-child {
-        padding-right: 50px !important;
-      }
-      .el-tabs__item.is-active {
-        color: #3d68e1;
-        font-weight: bold;
-        // border-right-color: #fff;
-        // border-left-color: #fff;
-      }
-      .el-tabs__item:not(.is-disabled):hover {
-        color: #3d68e1;
-      }
-    }
-  }
-  .el-tabs__content {
-    height: calc(100% - 64px);
-    width: calc(100% - 20px);
-    box-sizing: border-box;
-    overflow-y: auto;
-    padding: 10px 40px !important;
-    .el-tab-pane {
-      width: 100%;
-      .s-title {
-        text-align: left;
-        padding: 15px 0px;
-        font-size: 16px;
-      }
-    }
-  }
-
-  .s-table {
-    border: 1px solid #e8e8e9;
-    margin-top: 40px;
-  }
-
-  .ui-top-title {
-    padding-bottom: 10px;
-    /* border-bottom: 1px solid #ebebeb; */
-    position: relative;
-    text-align: left;
-    padding-left: 15px;
-    font-size: 16px;
-    font-weight: bold;
-  }
-
-  .ui-top-title:before {
-    content: " ";
-    border-left: 4px solid #f53d3d;
-    display: inline-block;
-    height: 16px;
-    position: absolute;
-    top: 50%;
-    left: 0;
-    margin-top: -13px;
-  }
-
-  .el-button--text {
-    color: #3d68e1;
-    text-decoration: underline;
-  }
-}
-.s-system-maintenance {
-  width: 100%;
+.container {
   height: 100%;
-  .el-button--primary {
-    color: #ffffff;
-    background-color: #3d68e1;
-    border-color: #3d68e1;
-  }
-  .el-button--primary.is-disabled,
-  .el-button--primary.is-disabled:hover,
-  .el-button--primary.is-disabled:focus,
-  .el-button--primary.is-disabled:active {
-    color: #ffffff;
-    background-color: #9eb4f0;
-    border-color: #9eb4f0;
-  }
-  .box-card {
-    text-align: left;
-    height: auto;
-    margin: 10px 0px;
-    .box-card-content {
-      padding-bottom: 40px;
-      .card-text {
-        padding: 0 30px;
-        line-height: 32px;
-      }
-    }
-  }
+  display: flex;
+  flex-direction: row;
+  flex: 1;
+  flex-basis: auto;
+  box-sizing: border-box;
+  .container-left {
+    height: 100%;
+      width: 240px;
 
-  .upload-icon {
-    font-size: 18px;
-    color: #0088ff;
-  }
-  .upload-msg {
-    padding-left: 10px;
-    text-align: left;
-    span {
-      line-height: 32px;
-      font-size: 13px;
-    }
-  }
-}
-.box {
-  width: 50%;
-  min-width: 700px;
-  height: 270px;
-  border: 1px solid #eee;
-  .title {
-    font-size: 20px;
-    font-weight: bold;
-    text-align: left;
-    padding: 20px;
-    border-bottom: 1px solid #eee;
-  }
-  .range {
-    width: 100%;
-    padding-top: 30px;
-    height: 38px;
-    .left {
-      width: 120px;
-      float: left;
-      text-align: right;
-      font-size: 14px;
-      p {
-        height: 38px;
-        line-height: 38px;
-        margin: 0;
-      }
-    }
-    .middle {
-      width: 50%;
-      min-width: 400px;
-      height: 38px;
-      float: left;
-    }
-    .right {
-      width: 20%;
-      height: 38px;
-      float: left;
-    }
-  }
-  .tip {
-    width: 100%;
-    padding: 30px 0px 0px 30px;
-    height: 34px;
-
-    .zhuyi {
-      font-size: 14px;
-      height: 34px;
-      line-height: 34px;
-      margin-left: 20px;
-      float: left;
-    }
-    i {
-      font-size: 32px;
-      color: #e99038;
-      float: left;
-    }
-  }
-}
-#systemMaintenance {
-  .el-tabs__header {
-    border: 0px solid #dcdfe6;
-    .el-tabs__item {
-      padding: 5px 50px;
+    overflow: auto;
+    box-sizing: border-box;
+    flex-shrink: 0;
+    padding: 10px;
+    border-right: 5px solid rgba(248, 248, 248, 1);
+    box-sizing: border-box;
+    .left-card {
       height: 50px;
-      font-family: PingFangSC-Regular;
-      font-size: 14px;
-      color: #222222;
-      text-align: center;
-      border: 0px solid transparent;
+      cursor: pointer;
+      border-radius: 10px;
+      margin-bottom: 10px;
+      display: flex;    background-color: #f8f8f8;
+
+      align-items: center;
+      .iconfont {
+        margin-left: 15px;
+        margin-right: 10px;
+        font-size: 18px;
+      }
+      .card-text {
+        font-size: 15px;
+      }
     }
-    .el-tabs__item:nth-child(2) {
-      padding-left: 50px;
+    .left-card-active {
+      color: #fff;
+      background-color: rgba(61, 104, 225, 1);
     }
-    .el-tabs__item:last-child {
-      padding-right: 50px;
-    }
-    .el-tabs__item.is-active {
-      color: #ff7733;
-      font-weight: bold;
-      // border-right-color: #fff;
-      // border-left-color: #fff;
-    }
-    .el-tabs__item:not(.is-disabled):hover {
-      color: #ff7733;
+   
+    .left-card:hover {
+      background-color: rgba(61, 104, 225, 1);
+      color: #fff;
     }
   }
-  .el-tabs__active-bar {
-    background-color: #ff7733;
-  }
-  .el-tabs__content {
-    padding-left: 15px !important;
-  }
+
 }
 </style>
+
+

--
Gitblit v1.8.0