From a6f495032e2edd41f3fed538daaa40a3287e5754 Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期五, 15 十月 2021 17:51:32 +0800 Subject: [PATCH] 10.15bug修复 --- src/pages/vindicate/views/updateSettings.vue | 70 +++++++++++++++++++++++++++++++++- 1 files changed, 67 insertions(+), 3 deletions(-) diff --git a/src/pages/vindicate/views/updateSettings.vue b/src/pages/vindicate/views/updateSettings.vue index 589f84a..aeb3ad3 100644 --- a/src/pages/vindicate/views/updateSettings.vue +++ b/src/pages/vindicate/views/updateSettings.vue @@ -17,14 +17,22 @@ </div> <div class="cluster-right"> <div class="net-set" v-if="activePage == 0"> - <el-radio-group + <!-- <el-radio-group v-model="radio2" size="medium" fill="rgba(61, 104, 225, 1)" > <el-radio-button label="妫�鏌ユ洿鏂�"></el-radio-button> <el-radio-button label="涓婁紶鏇存柊"></el-radio-button> - </el-radio-group> + </el-radio-group> --> + + <div class="button-group"> + <div class="bottom"> + <div class="top" :class="{ 'toggle':radio2 !== '妫�鏌ユ洿鏂�' }"></div> + <div class="label-left" :class="{ 'toggle':radio2 == '妫�鏌ユ洿鏂�' }" @click="radio2 = '妫�鏌ユ洿鏂�'">妫�鏌ユ洿鏂�</div> + <div class="label-right" :class="{ 'toggle':radio2 !== '妫�鏌ユ洿鏂�' }" @click="radio2 = '涓婁紶鏇存柊'">涓婁紶鏇存柊</div> + </div> + </div> <div class="update-center" v-if="radio2 == '妫�鏌ユ洿鏂�'"> <img v-if="!upgrading&&hasNewVersion||checking" @@ -464,7 +472,7 @@ justify-content: start; height: 95%; padding: 0 30px; - .el-radio-group { + /* .el-radio-group { margin-top:33px ; .el-radio-button__inner { font-size: 14px; @@ -489,6 +497,62 @@ color: white !important; } } + } */ + .button-group { + margin: 0 auto; + margin-top: 30px; + width: 168px; + height: 28px; + .bottom { + position: relative; + height: 100%; + background: #F2F2F7; + border-radius: 20px; + cursor: pointer; + .top { + position: absolute; + top: 0; + left: 0; + width: 84px; + height: 28px; + background: #4E94FF; + border-radius: 20px; + transition: all .2s linear; + &.toggle { + left: 84px; + } + } + .label-left { + position: absolute; + width: 84px; + height: 28px; + top: 0; + left: 0; + z-index: 1; + font-size: 14px; + line-height: 28px; + font-weight: 700; + color: #333333; + &.toggle { + color: #fff; + } + } + .label-right { + position: absolute; + width: 84px; + height: 28px; + top: 0; + right: 0; + z-index: 1; + font-size: 14px; + line-height: 28px; + font-weight: 700; + color: #333333; + &.toggle { + color: #fff; + } + } + } } @keyframes spin { from { -- Gitblit v1.8.0