From 8364714effe41c220244b4fea441fca025d5fc14 Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期一, 27 九月 2021 17:34:17 +0800 Subject: [PATCH] 系统设置v1.0 --- src/pages/settings/views/generalSettings.vue | 150 ++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 134 insertions(+), 16 deletions(-) diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue index cea9bb3..1dbf000 100644 --- a/src/pages/settings/views/generalSettings.vue +++ b/src/pages/settings/views/generalSettings.vue @@ -58,7 +58,7 @@ <span class="desc">{{ deviceInfo.runningTime }}</span> </div> </div> --> - <div class="lang" v-if="activePage == 0"> + <div class="lang videoTime" v-if="activePage == 0"> <div class="min-dur"> <div class="title">鎶撴媿鍓嶅綍鍍忔椂闀�</div> <div class="entity"> @@ -73,10 +73,11 @@ @input="min_len = min_video_len" show-stops :show-tooltip="true" + tooltip-class="toolClass" :format-tooltip="formatTooltip" ></el-slider> </div> - <el-input-number + <!-- <el-input-number v-model="min_len" @change="fakeObj.min = +(min_len / 1.2)" controls-position="right" @@ -86,7 +87,17 @@ step-strictly size="small" ></el-input-number - > s + > s --> + + <el-input-number + v-model="min_len" + @change="fakeObj.min = +(min_len / 1.2)" + :min="5" + :step="5" + :max="120" + step-strictly + size="small" + ></el-input-number> s </div> </div> <div class="min-dur"> @@ -109,7 +120,6 @@ <el-input-number v-model="max_len" @change="fakeObj.max = +(max_len / 1.2)" - controls-position="right" :min="5" :step="5" step-strictly @@ -117,6 +127,7 @@ size="small" ></el-input-number > s + </div> </div> @@ -713,24 +724,25 @@ .min-dur { box-sizing: border-box; padding: 0 20px; - background-color: rgba(248, 248, 248, 1); + background-color: #F2F2F7; height: 105px; - margin-bottom: 20px; + margin-bottom: 4px; border-radius: 15px; .title { + color: #333; height: 45px; line-height: 45px; - text-align: left; box-sizing: border-box; padding: 0 6px; - font-size: 14px; + font-size: 16px; + font-weight: 700; } } - .min-dur:hover { + /* .min-dur:hover { background-color: rgba(233, 233, 233, 1); - } + } */ .entity { display: flex; @@ -741,8 +753,8 @@ min-width: 30px; line-height: 80px; margin-right: 10px; - color: rgba(120, 120, 120, 1); - font-size: 14px; + color:#333 ; + font-size: 8px; } .block { flex: 1; @@ -781,15 +793,16 @@ } .save-btn { background-color: var(--colorCard); - width: 240px; + width: 180px; height: 40px; margin: 0 auto; - border-radius: 10px; + border-radius: 25px; color: #fff; line-height: 40px; cursor: pointer; - font-size: 14px; - margin-top: 20px; + font-size: 16px; + font-weight: 700; + margin-top: 55px; } .self-setting { .top-title { @@ -1012,3 +1025,108 @@ } } </style> + +<style> + +.videoTime .el-slider__button { + margin-top: -25px !important; + border: none !important; + background-image: url(/images/gengeralSettings/鍒诲害鏍�.png); +} + +.videoTime .el-tooltip { +background-color: #F2F2F7 !important; + border: none !important; +} + +.videoTime .el-slider__runway { + background-color: #fff !important; + height: 3px !important; +} + +.videoTime .el-slider__stop { + background-color: #C4C4C4 !important; + height: 3px !important; + width: 8px !important; + border-radius:0 !important; +} + +.videoTime .el-slider__bar { + z-index: 999999999 !important; + background-color: var(--colorCard) !important; +} + +.videoTime .el-input-number.el-input-number--small { + width: 90px; + height: 24px; + border-radius: 4px; + line-height: 24px !important; + font-weight: 700 !important; +} + + +.videoTime .el-input-number.el-input-number--small .el-input__inner { +font-size: 12px !important; +} + +.el-input-number__decrease { +color: #333 !important; +/* top: 4px !important; */ + height: 22px !important; + width: 20px !important; + line-height: 22px !important; +} + +/* .el-input-number__decrease:hover i{ + color: var(--colorCard); +} */ + +.el-input-number__increase { +color: #333 !important; + /* top: 4px !important; */ + height: 22px !important; + width: 24px !important; + line-height: 22px !important; +} + +.el-input-number__increase:hover i{ + /* color: var(--colorCard); */ + color: #4E94FF; +} + +.el-input__inner { + height: 24px !important; +} + + +/* .el-tooltip__popper { + font-size: 12px !important; + background-color: transparent !important; + color:var(--colorCard) !important; +} + +.popper__arrow::after { + border-color: transparent !important; + border: none !important; +} + +.popper__arrow:after { + border-bottom-color: green !important; +} + +.popper__arrow:after { + border-top-color: pink !important; +} + +.toolClass { + border: none !important; +} + +.toolClass { + border: none !important; +} + +.el-slider__button::after { + border: none !important; +} */ +</style> -- Gitblit v1.8.0