提交: 优化 站点管理中 启用https 属性 组件添加 开启/关闭 提示字样

This commit is contained in:
23688nl 2022-09-15 16:15:31 +08:00
parent 2614cb8e46
commit aee5ea2518
3 changed files with 47 additions and 1 deletions

View File

@ -0,0 +1,33 @@
/* switch按钮样式 自定义 */
.e-switch-c .el-switch__label {
position: absolute;
display: none;
color: #fff !important;
}
/*打开时文字位置设置*/
.e-switch-c .el-switch__label--right {
z-index: 1;
}
/* 调整打开时文字的显示位子 */
.e-switch-c .el-switch__label--right span{
margin-left: 10px;
}
/*关闭时文字位置设置*/
.e-switch-c .el-switch__label--left {
z-index: 1;
}
/* 调整关闭时文字的显示位子 */
.e-switch-c .el-switch__label--left span{
margin-left: 20px;
}
/*显示文字*/
.e-switch-c .el-switch__label.is-active {
display: block;
}
/* 调整按钮的宽度 */
.e-switch-c.el-switch .el-switch__core,
.el-switch .el-switch__label {
width: 60px !important;
margin: 0;
}

View File

@ -4,6 +4,7 @@
@import './element-ui.scss';
@import './sidebar.scss';
@import './btn.scss';
@import './e-custom-style.scss';
body {
height: 100%;

View File

@ -193,13 +193,25 @@
<el-row :gutter="20" v-show="tempType !== 'distri'">
<el-col :span="12">
<el-form-item label="启用https" prop="https">
<el-switch
<!-- <el-switch
v-model="form.https"
active-color="#13ce66"
inactive-color="#ff4949"
:active-value="true"
:inactive-value="false"
>
</el-switch> -->
<el-switch
size="mini"
v-model="form.https"
active-text="启用"
inactive-text="关闭"
:active-value="true"
:inactive-value="false"
active-color="#13ce66"
inactive-color="#dcdfe6"
class="e-switch-c"
>
</el-switch>
</el-form-item>
</el-col>