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/maintain/index/App.vue | 1150 ++++++++++++++++++++++++++++---------------------------- 1 files changed, 579 insertions(+), 571 deletions(-) diff --git a/src/pages/maintain/index/App.vue b/src/pages/maintain/index/App.vue index 1c4e7a8..1aa87ed 100644 --- a/src/pages/maintain/index/App.vue +++ b/src/pages/maintain/index/App.vue @@ -1,610 +1,618 @@ <template> - <div class="container"> - <div class="container-left"> - <div - class="left-card" - v-for="(item, index) in menuArr" - :key="index" - @click="openMenu(item, index)" - > - <span class="icon iconfont"></span> - <span class="card-text">{{ item.name }}</span> - </div> - </div> - <systemClean v-if="activePage == '绯荤粺娓呯悊'" style="width: 100%"></systemClean> - <updateSettings v-if="activePage == '鏇存柊璁剧疆'" style="width: 100%"></updateSettings> - <back-up v-if="activePage == '澶囦唤杩樺師'" style="width: 100%"></back-up> - <restartSettings v-if="activePage == '閲嶅惎璁剧疆'" style="width: 100%"></restartSettings> + <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> </template> <script> -import { - getClockInfo, - saveClockInfo, - testNTPserver, -} from "@/api/system"; -import systemClean from "../views/systemClean"; -import updateSettings from "../views/updateSettings"; -import BackUp from "../views/backUp"; -import restartSettings from "../views/restartSettings"; +import { rebootServer, getDevInfo, getRebootTask, setRebootTask, fileUpload, doUpgrade, deleteDate } from "@/api/system" +import VueCron from "@/components/subComponents/VueCron" +import FileUploader from "@/components/subComponents/FileUpload/index" + export default { - name: "settings", components: { - systemClean, - updateSettings, - BackUp, - restartSettings, + VueCron, + FileUploader }, data() { return { - browserTimer: null, - menuArr: [ - { name: "鏇存柊璁剧疆" }, - { name: "澶囦唤杩樺師" }, - { name: "绯荤粺娓呯悊" }, - { name: "閲嶅惎璁剧疆" }, + 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") ], - jpgArr: [{}, {}, {}, {}, {}, {}, {}, {}, {}], - activePage: "鏇存柊璁剧疆", - activeIndex: 0, - clockTimer: null, + 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, }; }, - beforeDestroy() { - clearTimeout(this.clockTimer); - clearInterval(this.browserTimer); - }, mounted() { - const s = document.getElementsByClassName("left-card")[0]; - s.style.backgroundColor = "rgba(61, 104, 225, 1)"; - s.style.color = "#fff"; + 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; + } }, methods: { - openMenu(item, i) { - const old = document.getElementsByClassName("left-card")[ - this.activeIndex - ]; - old.style.backgroundColor = "initial"; - old.style.color = "rgba(81, 81, 81, 1)"; - - this.activePage = item.name; - this.activeIndex = i; - const s = document.getElementsByClassName("left-card")[i]; - s.style.backgroundColor = "rgba(61, 104, 225, 1)"; - s.style.color = "#fff"; + isShow(authority) { + if (this.isAdmin) { + return true + } else if ( + this.buttonAuthority.indexOf(',' + authority + ',') > -1 + ) { + return true + } else { + return false + } }, - }, + 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 + }) + }, + setRebootCron(value) { + debugger + 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"> -.container { - height: 100%; - display: flex; - flex-direction: row; - flex: 1; - flex-basis: auto; +.s-system-manage { + width: 100% !important; + min-width: 759px; box-sizing: border-box; - .container-left { - height: 100%; - width: 210px; - overflow: auto; + padding: 10px; + // background-color: #e9ebf2; + background-color: #fff; + .s-system-manage-breadcrumb { + height: 5%; 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: 55px; - cursor: pointer; - border-radius: 12px; - margin-bottom: 10px; - display: flex; - align-items: center; - .iconfont { - margin-left: 25px; - margin-right: 10px; - font-size: 24px; + 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; } - .card-text { + .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; } } - .left-card:hover { - background-color: rgba(61, 104, 225, 1); - color: #fff; - } } - .container-center { - height: 100%; - width: 280px; - overflow: auto; - flex-shrink: 0; - padding: 10px; - border-right: 5px solid rgba(248, 248, 248, 1); - box-sizing: border-box; - .account-left { - .add-account { - color: rgba(61, 104, 225, 1); - margin-top: 50px; - .iconfont { - cursor: pointer; - font-size: 32px; - } - } - .account-card { - height: 50px; - background-color: rgba(248, 248, 248, 1); - margin-bottom: 10px; - display: flex; - align-items: center; - padding: 0 20px; - box-sizing: border-box; - border-radius: 10px; - cursor: pointer; - .touxiang { - height: 35px; - width: 35px; - background-color: bisque; - border-radius: 17.5px; - } - .user-name { - margin-left: 10px; - font-size: 14px; - } - } - } - .datetime-left { - .time-card { - height: 105px; - background-color: rgba(248, 248, 248, 1); - margin-bottom: 30px; - border-radius: 10px; - .head { - height: 30px; - line-height: 30px; - text-align: left; - box-sizing: border-box; - padding: 0 10px; - font-size: 14px; - .icon { - margin-right: 5px; - color: rgba(61, 104, 225, 1); - } - } - .time-main { - height: 42px; - line-height: 42px; - font-family: Consolas; - font-size: 36px; - } - .date-bot { - height: 25px; - font-size: 14px; - line-height: 25px; - color: #868686; - display: flex; - justify-content: space-evenly; - } - } - .line { - display: flex; - align-items: center; - height: 50px; - padding: 0 25px; - background-color: rgba(248, 248, 248, 1); - justify-content: space-between; - border-radius: 12px; - margin-bottom: 10px; - .name { - font-size: 14px; - } - } - } + .s-table { + border: 1px solid #e8e8e9; + margin-top: 40px; } - .container-right { - flex: 1; - flex-basis: auto; - overflow: auto; - box-sizing: border-box; + + .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; + } - padding: 20px 40px; - .account-right { - .account-content { - .content-top { - height: 120px; - width: 350px; - margin: 0 auto; - display: flex; - align-items: center; - justify-content: center; - margin-bottom: 20px; - .touxiang-big { - width: 100px; - height: 100px; - background-color: bisque; - border-radius: 50px; - } - .user-desc { - height: 100px; - display: flex; - flex-direction: column; - align-items: baseline; - min-width: 200px; - .username { - margin: 5px 15px; - height: 30px; - line-height: 30px; - width: 90px; - text-align: left; - font-size: 15px; - display: flex; - align-items: center; - } - .nickname { - margin: 5px 15px; - font-size: 14px; - .input-nick { - width: 50px; - margin-right: 5px; - } - .iconfont { - font-size: 14px; - margin-left: 5px; - } - } - } - } - .list-btn { - display: flex; + .ui-top-title:before { + content: " "; + border-left: 4px solid #f53d3d; + display: inline-block; + height: 16px; + position: absolute; + top: 50%; + left: 0; + margin-top: -13px; + } - flex-direction: column; - align-items: center; - .item-btn { - width: 500px; - height: 45px; - background-color: #f0f0f0; - margin-bottom: 15px; - border-radius: 10px; - line-height: 45px; - font-size: 15px; - cursor: pointer; - } - .item-btn:hover { - color: rgba(255, 153, 102, 1); - } - } - } - .title { - height: 30px; - line-height: 30px; - /* background-color: aliceblue; */ - margin-bottom: 10px; - font-size: 16px; - font-weight: 600; - } - .change-pw { - .p-title { - text-align: left; - font-size: 15px; - margin-top: 5px; - } - } - .el-form-item { - margin-bottom: 0; - .el-input__inner { - background-color: rgba(240, 240, 240, 1); - border: none; - border-radius: 12px; - height: 45px; - padding: 0 20px; - font-size: 15px; - } - .el-input__clear { - color: dimgray; - font-size: 17px; - line-height: 45px; - } - .el-input__suffix { - right: 1px; - top: -0.5px; - width: 45px; - // background-color: rgba(61, 104, 225, 1); - /* color: white; */ - border-radius: 12px; - } - } - .permission { - .line { - display: flex; - align-items: center; - height: 50px; - padding: 0 25px; - background-color: rgba(248, 248, 248, 1); - justify-content: space-between; - border-radius: 12px; - margin-bottom: 10px; - .name { - font-size: 14px; - } - } - } - - .add-account-page { - // background-color: lightcyan; - // padding: 10px 50px; - .upload-group { - height: 120px; - width: 350px; - margin: 0 auto; - overflow: hidden; - .upload-jpg { - height: 50px; - width: 50px; - float: left; - margin: 0 10px; - background-color: antiquewhite; - margin-bottom: 20px; - border-radius: 25px; - } - } - .fill-group { - .p-title { - text-align: left; - } - } + .el-button--text { + color: #3d68e1; + text-decoration: underline; + } +} +.s-system-maintenance { + width: 100%; + 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; } } - .datetime-right { - .el-form-item.is-required:not(.is-no-asterisk) - > .el-form-item__label:before, - .el-form-item.is-required:not(.is-no-asterisk) - .el-form-item__label-wrap - > .el-form-item__label:before { - display: none; - } - .el-form-item { - margin-bottom: 10px; - height: 50px; - background: #f8f8f8; - padding: 4px 20px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - .el-form-item__label { - text-align: left; - line-height: 42px; - } - } - .el-form-item__content { - line-height: 40px; - position: relative; - font-size: 14px; - } - .ip-input-container { - max-width: none !important; - } - .ntp-time { - .right { - display: flex; - align-items: baseline; - .el-input-number--small { - width: 100%; - } - .el-button--text { - margin-left: 10px; - text-decoration: underline; - } - } - .ntp-bar { - height: 40px; - background-color: rgba(248, 248, 248, 1); - display: flex; - align-items: center; - justify-content: space-between; - padding: 0 10px; - border-radius: 10px; - margin-bottom: 10px; - .title { - min-width: 70px; - } - .input-area { - width: 450px; - height: 30px; - background-color: rgba(240, 240, 240, 1); - border-radius: 10px; - line-height: 30px; - font-size: 14px; - } - } - .int-bar { - height: 40px; - background-color: rgba(248, 248, 248, 1); - display: flex; - align-items: center; - justify-content: space-between; - padding: 0 10px; - border-radius: 10px; - margin-bottom: 10px; - .title { - min-width: 130px; - } - .right { - width: 450px; - display: flex; - align-items: center; - height: 30px; + } - .input-area { - // width: 410px; - background-color: rgba(240, 240, 240, 1); - border-radius: 10px; - line-height: 30px; - width: -webkit-fill-available; - - font-size: 14px; - } - .test { - width: 40px; - } - } - } - } - .manual-time { - .clock-wrap { - height: 75px; - - background-color: #f8f8f8; - display: flex; - justify-content: center; - align-items: center; - margin-bottom: 10px; - border-radius: 10px; - .clock { - display: flex; - align-items: center; - height: 90px; - justify-content: space-evenly; - .iconfont { - cursor: pointer; - color: rgba(134, 134, 134, 1); - } - .iconfont:hover { - background-color: gainsboro; - } - .hour { - background-color: rgba(240, 240, 240, 1); - display: flex; - align-items: center; - width: 100px; - height: 50px; - justify-content: space-evenly; - border-radius: 10px; - } - .dnum { - width: 40px; - height: 40px; - line-height: 40px; - font-size: 34px; - font-family: Consolas; - display: flex; - align-items: center; - .input-box { - width: inherit; - border: none; - border-radius: 5px; - height: 35px; - font-size: 28px; - text-align: center; - } - - .input-box:focus { - outline: none; - } - } - .control { - width: 20px; - .fanzhuan { - display: inline-block; - -moz-transform: scaleY(-1); - -webkit-transform: scaleY(-1); - -o-transform: scaleY(-1); - transform: scaleY(-1); - } - } - .sep { - font-family: Consolas; - width: 40px; - font-size: 34px; - height: 40px; - line-height: 40px; - } - .mins { - background-color: #f0f0f0; - display: flex; - align-items: center; - width: 110px; - height: 50px; - justify-content: space-evenly; - border-radius: 10px; - } - } - } - .adjust-bar { - display: flex; - justify-content: space-between; - align-items: center; - margin-bottom: 10px; - border-radius: 10px; - height: 50px; - background-color: rgba(248, 248, 248, 1); - .middle { - font-size: 14px; - } - .input-box { - width: 80px; - border: none; - border-radius: 5px; - height: 25px; - font-size: 18px; - text-align: center; - } - - .input-box:focus { - outline: none; - } - .minus { - width: 50px; - height: 50px; - background-color: #f0f0f0; - font-size: 35px; - border-radius: 10px; - cursor: pointer; - line-height: 50px; - color: rgba(134, 134, 134, 1); - } - .plus { - width: 50px; - height: 50px; - cursor: pointer; - background-color: #f0f0f0; - font-size: 35px; - border-radius: 10px; - line-height: 50px; - color: rgba(134, 134, 134, 1); - } - } - } - } - .btns { - display: flex; - justify-content: space-between; - margin-top: 20px; - - .cancel { - height: 40px; - width: 48%; - cursor: pointer; - border-radius: 8px; - background-color: rgba(240, 240, 240, 1); - line-height: 40px; - font-size: 14px; - } - .ok { - height: 40px; - width: 48%; - cursor: pointer; - border-radius: 8px; - background-color: rgba(61, 104, 225, 1); - color: #fff; - line-height: 40px; - font-size: 14px; - } + .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; + height: 50px; + font-family: PingFangSC-Regular; + font-size: 14px; + color: #222222; + text-align: center; + border: 0px solid transparent; + } + .el-tabs__item:nth-child(2) { + padding-left: 50px; + } + .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; + } + } + .el-tabs__active-bar { + background-color: #ff7733; + } + .el-tabs__content { + padding-left: 15px !important; + } +} </style> - - -- Gitblit v1.8.0