style: 更新对话框样式,调整按钮尺寸和间距,增强用户界面一致性

(cherry picked from commit b2395fd3a2)
This commit is contained in:
huweihang
2025-12-17 11:38:36 +08:00
parent a6c389b80b
commit be730deef2
4 changed files with 42 additions and 90 deletions

View File

@@ -402,7 +402,7 @@ li{
.el-message-box__header {
// padding: 0 0 16px 0;
padding: 2px 8px 2px 16px;
padding: 8px 8px 2px 16px;
display: block;
.el-message-box__title {
@@ -412,7 +412,7 @@ li{
}
.el-message-box__headerbtn {
top: 8px;
top: 14px;
right: 10px;
.el-message-box__close {
font-size: 22px;
@@ -461,17 +461,47 @@ li{
display: flex;
justify-content: flex-end;
padding-right: 20px;
margin-top: 0px;
padding-bottom: 20px;
margin-top: 8px;
.el-button {
width: 70px;
width: 78px;
height: 32px;
font-size: 14px;
border-radius: 6px;
padding: 0 18px;
&:nth-child(2){
margin-left: 10px !important;
}
}
.el-button--default {
color: rgba(0, 0, 0, .3);
border-color: rgba(0, 0, 0, .3);
background-color: #FFFFFF;
}
.el-button--primary {
background-color: #3b7cff;
border-color: #3b7cff;
color: #fff;
}
}
}
.common-course-dialog {
.el-dialog__footer {
padding: 10px 20px 16px;
.el-button {
width: 78px;
height: 32px;
font-size: 14px;
border-radius: 6px;
padding: 0 18px;
&:nth-child(2){
margin-left: 10px !important;
}
}
.el-button--default {
color: rgba(0, 0, 0, .3);
border-color: rgba(0, 0, 0, .3);

View File

@@ -1,8 +1,8 @@
<template>
<el-dialog
class="common-course-dialog"
title="置顶排序"
:visible.sync="dialogVisible"
custom-class="g-dialog top-course-sorter-dialog"
width="820px"
:close-on-click-modal="false"
@closed="handleClosed"
@@ -13,10 +13,9 @@
v-if="topList.length"
ref="sortTable"
:data="topList"
class="top-course-sorter__table"
class="top-course-sorter__table use-table"
row-key="id"
:row-class-name="getRowClassName"
:header-cell-style="{ background: '#f5f7fa', color: '#303133', fontWeight: '600' }"
>
<el-table-column width="60" align="center">
<template slot-scope="scope">
@@ -262,39 +261,8 @@ export default {
min-height: 200px;
padding-top: 8px;
}
.top-course-sorter__table {
::v-deep .el-table__row {
cursor: move;
transition: background-color 0.2s ease;
&:hover {
background-color: #f9fbff;
}
&.is-dragging {
opacity: 0.7;
background-color: #ecf5ff;
}
&.drag-over {
border-top: 2px solid #409eff;
}
}
::v-deep .el-table__body-wrapper {
.el-table__row {
&:last-child {
.el-table__cell {
border-bottom: none;
}
}
}
}
::v-deep .el-table__cell {
padding: 12px 0;
}
::v-deep .el-dialog__body {
padding: 10px 20px 20px;
}
.drag-handle {

View File

@@ -1,5 +1,5 @@
<template>
<el-dialog title="添加报名" :visible.sync="visibleSync" width="1200px" top="8vh" append-to-body @close="handleClose">
<el-dialog title="添加报名" class="common-course-dialog" :visible.sync="visibleSync" width="1000px" top="8vh" append-to-body @close="handleClose">
<el-tabs v-model="activeTab">
<el-tab-pane label="从受众中选择" name="quick">
</el-tab-pane>
@@ -181,29 +181,5 @@ export default {
left: 12px;
}
}
::v-deep .el-dialog__footer {
.el-button {
min-width: 120px;
height: 40px;
font-size: 16px;
border-radius: 6px;
padding: 0 18px;
}
.el-button--default {
color: rgba(0, 0, 0, 0.3);
border-color: rgba(0, 0, 0, 0.3);
background-color: #ffffff;
}
.el-button--primary {
background-color: #3b7cff;
border-color: #3b7cff;
color: #fff;
}
}
</style>

View File

@@ -1,7 +1,7 @@
<template>
<div v-if="visible">
<el-dialog :visible="visible" :title="dialogTitle" width="1200px" top="8vh" append-to-body destroy-on-close
class="signup-dialog" @close="handleClose">
<el-dialog class="signup-dialog common-course-dialog" :visible="visible" :title="dialogTitle" width="1200px" top="8vh" append-to-body destroy-on-close
@close="handleClose">
<div class="signup-wrap">
<el-tabs v-model="activeTab">
<!-- <el-tab-pane v-if="infoType" label="项目内学员" name="project">
@@ -524,28 +524,6 @@ export default {
background-color: #3b7cff;
}
}
.signup-dialog ::v-deep .el-dialog__footer {
.el-button {
min-width: 120px;
height: 40px;
font-size: 16px;
border-radius: 6px;
padding: 0 18px;
}
.el-button--default {
color: rgba(0, 0, 0, 0.3);
border-color: rgba(0, 0, 0, 0.3);
background-color: #ffffff;
}
.el-button--primary {
background-color: #3b7cff;
border-color: #3b7cff;
color: #fff;
}
}
.signup-wrap {
display: flex;