update: 按钮样式风格统一

This commit is contained in:
zhuoqinglian
2026-06-23 14:54:45 +08:00
parent 9d78ea29c3
commit 04bfddf457
11 changed files with 75 additions and 72 deletions
@@ -27,12 +27,12 @@ export default {
background: #4998ff;
color: #ffffff;
border: none;
border-radius: 6px;
border-radius: 4px;
transition: all 0.3s ease;
&.el-button--small {
padding: 10px;
font-size: 14px;
padding: 9px 14px;
font-size: 12px;
}
&.el-button--medium {
padding: 12px 20px;
@@ -62,11 +62,12 @@ export default {
background: linear-gradient(to right, #4a7cfd, #8154fc);
color: white;
border: none;
border-radius: 6px;
border-radius: 4px;
transition: all 0.3s ease;
&.el-button--small {
font-size: 14px;
padding: 9px 14px;
font-size: 12px;
}
&.el-button--medium {
padding: 12px 20px;
@@ -95,11 +96,12 @@ export default {
background: #ff6b6b;
color: white;
border: none;
border-radius: 6px;
border-radius: 4px;
transition: all 0.3s ease;
&.el-button--small {
font-size: 14px;
padding: 9px 14px;
font-size: 12px;
}
&.el-button--medium {
padding: 12px 20px;
@@ -128,11 +130,12 @@ export default {
background: #52c41a;
color: white;
border: none;
border-radius: 6px;
border-radius: 4px;
transition: all 0.3s ease;
&.el-button--small {
font-size: 14px;
padding: 9px 14px;
font-size: 12px;
}
&.el-button--medium {
padding: 12px 20px;
@@ -141,11 +141,9 @@
<p class="section-desc">{{ $t('addressBookManagement.setPermissionDesc', { count: selectedPermissions.length }) }}</p>
</div>
<div class="section-actions">
<el-button size="small" @click="handleCancel">{{ $t('common.cancel') }}</el-button>
<el-button size="small" @click="handleToggleSelectAll">
{{ isAllSelected ? $t('addressBookManagement.deselectAll') : $t('addressBookManagement.selectAll') }}
</el-button>
<el-button type="primary" size="small" @click="handleSavePermissions">{{ $t('addressBookManagement.save') }}</el-button>
<CustomButton size="small" @click="handleCancel">{{ $t('common.cancel') }}</CustomButton>
<CustomButton size="small" @click="handleToggleSelectAll">{{ isAllSelected ? $t('addressBookManagement.deselectAll') : $t('addressBookManagement.selectAll') }}</CustomButton>
<CustomButton type="confirm" size="small" @click="handleSavePermissions">{{ $t('addressBookManagement.save') }}</CustomButton>
</div>
</div>
@@ -208,10 +206,11 @@ import VersionFooter from "@/components/VersionFooter.vue";
import Api from "@/apis/api.js";
import AddressBookApi from "@/apis/module/addressBook.js";
import MacAddressMask from "@/components/MacAddressMask.vue";
import CustomButton from "@/components/CustomButton.vue";
export default {
name: "AddressBookManagement",
components: { HeaderBar, VersionFooter, MacAddressMask },
components: { HeaderBar, VersionFooter, MacAddressMask, CustomButton },
data() {
return {
searchKeyword: "",
@@ -946,8 +945,8 @@ export default {
}
.section-actions {
margin-top: 4px;
display: flex;
gap: 8px;
}
}
}
@@ -54,7 +54,7 @@
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" size="small" @click="handleSelectAll">
{{ isAllSelected ? $t("agentTemplateManagement.deselectAll") : $t("agentTemplateManagement.selectAll") }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="showAddTemplateDialog">
<CustomButton type="add" icon="el-icon-plus" size="small" @click="showAddTemplateDialog">
{{ $t("agentTemplateManagement.createTemplate") }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="batchDeleteTemplate">
@@ -65,7 +65,7 @@
size="small" @click="selectAllDictData">
{{ isAllDictDataSelected ? $t('dictManagement.deselectAll') : $t('dictManagement.selectAll') }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="showAddDictDataDialog">
<CustomButton type="add" icon="el-icon-plus" size="small" @click="showAddDictDataDialog">
{{ $t('dictManagement.addDictData') }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="batchDeleteDictData">
@@ -14,9 +14,9 @@
prefix-icon="el-icon-search"
clearable
/>
<el-button size="small" @click="handleSearch">{{ $t('knowledgeBaseManagement.search') }}</el-button>
<el-button size="small" @click="handleUpload">{{ $t('knowledgeBaseManagement.add') }}</el-button>
<el-button size="small" @click="handleRetrievalTest">{{ $t('knowledgeFileUpload.retrievalTest') }}</el-button>
<CustomButton size="small" @click="handleSearch">{{ $t('knowledgeBaseManagement.search') }}</CustomButton>
<CustomButton type="add" size="small" @click="handleUpload">{{ $t('knowledgeBaseManagement.add') }}</CustomButton>
<CustomButton type="confirm" size="small" @click="handleRetrievalTest">{{ $t('knowledgeFileUpload.retrievalTest') }}</CustomButton>
</div>
</div>
<div class="doc-grid" v-loading="docLoading" :element-loading-text="$t('knowledgeBaseManagement.loading')">
@@ -85,6 +85,7 @@
<script>
import Api from "@/apis/api";
import CustomButton from "@/components/CustomButton.vue";
import CustomPagination from "@/components/CustomPagination.vue";
const iconMap = {
@@ -101,7 +102,7 @@ const iconMap = {
export default {
name: 'LibraryItem',
components: { CustomPagination },
components: { CustomPagination, CustomButton },
props: {
kb: {
type: Object,
+43 -43
View File
@@ -187,19 +187,19 @@
</el-table>
<div class="table-footer">
<div class="batch-actions">
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" type="default" size="mini" @click="selectAll">
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" type="default" size="small" @click="selectAll">
{{
isAllSelected
? $t("modelConfig.deselectAll")
: $t("modelConfig.selectAll")
}}
</CustomButton>
<CustomButton icon="el-icon-plus" type="add" size="mini" @click="addModel">
<CustomButton icon="el-icon-plus" type="add" size="small" @click="addModel">
{{ $t("modelConfig.add") }}
</CustomButton>
<CustomButton
type="delete"
size="mini"
size="small"
icon="el-icon-delete"
@click="batchDelete"
>
@@ -747,53 +747,53 @@ export default {
background: white;
}
.batch-actions {
display: flex;
gap: 8px;
}
// .batch-actions {
// display: flex;
// gap: 8px;
// }
.batch-actions .el-button {
min-width: 72px;
height: 32px;
padding: 7px 12px 7px 10px;
font-size: 12px;
border-radius: 4px;
line-height: 1;
font-weight: 500;
border: none;
transition: all 0.3s ease;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
// .batch-actions .el-button {
// min-width: 72px;
// height: 32px;
// padding: 7px 12px 7px 10px;
// font-size: 12px;
// border-radius: 4px;
// line-height: 1;
// font-weight: 500;
// border: none;
// transition: all 0.3s ease;
// box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
// }
.batch-actions .el-button:hover {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
// .batch-actions .el-button:hover {
// transform: translateY(-1px);
// box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
// }
.batch-actions .el-button--primary {
background: #5f70f3 !important;
color: white;
}
// .batch-actions .el-button--primary {
// background: #5f70f3 !important;
// color: white;
// }
.batch-actions .el-button--success {
background: #5bc98c;
color: white;
}
// .batch-actions .el-button--success {
// background: #5bc98c;
// color: white;
// }
.batch-actions .el-button--danger {
background: #fd5b63;
color: white;
}
// .batch-actions .el-button--danger {
// background: #fd5b63;
// color: white;
// }
.batch-actions .el-button:first-child {
background: linear-gradient(135deg, #409eff, #6b8cff);
border: none;
color: white;
}
// .batch-actions .el-button:first-child {
// background: linear-gradient(135deg, #409eff, #6b8cff);
// border: none;
// color: white;
// }
.batch-actions .el-button:first-child:hover {
background: linear-gradient(135deg, #3a8ee6, #5a7cff);
}
// .batch-actions .el-button:first-child:hover {
// background: linear-gradient(135deg, #3a8ee6, #5a7cff);
// }
.el-table th ::v-deep .el-table__cell {
overflow: hidden;
+1 -1
View File
@@ -52,7 +52,7 @@
size="small" @click="handleSelectAll">
{{ isAllSelected ? $t('otaManagement.deselectAll') : $t('otaManagement.selectAll') }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="showAddDialog">
<CustomButton type="add" icon="el-icon-plus" size="small" @click="showAddDialog">
{{ $t('otaManagement.addNew') }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete"
@@ -60,7 +60,7 @@
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" size="small" @click="handleSelectAll">
{{ isAllSelected ? $t('paramManagement.deselectAll') : $t('paramManagement.selectAll') }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="showAddDialog">
<CustomButton icon="el-icon-plus" type="add" size="small" @click="showAddDialog">
{{ $t('paramManagement.add') }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="deleteSelectedParams">
@@ -67,7 +67,7 @@
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" size="small" @click="handleSelectAll">
{{ isAllSelected ? $t('common.deselectAll') : $t('common.selectAll') }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="showAddDialog">
<CustomButton type="add" icon="el-icon-plus" size="small" @click="showAddDialog">
{{ $t('common.add') }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="deleteSelectedProviders">
@@ -70,7 +70,7 @@
>
{{ allSelected ? $t('user.deselectAll') : $t('user.selectAll') }}
</CustomButton>
<CustomButton icon="el-icon-plus" size="small" @click="handleAdd">
<CustomButton type="add" icon="el-icon-plus" size="small" @click="handleAdd">
{{ $t('replacementWordManagement.addFile') }}
</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="handleBatchDelete">
@@ -52,12 +52,12 @@
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" size="small" @click="handleSelectAll">
{{ isAllSelected ? $t('user.deselectAll') : $t('user.selectAll') }}
</CustomButton>
<CustomButton size="small" icon="el-icon-circle-check" @click="batchEnable">{{
$t('user.enable')
}}</CustomButton>
<CustomButton size="small" icon="el-icon-remove-outline" @click="batchDisable">
{{$t('user.disable') }}
</CustomButton>
<CustomButton size="small" type="add" icon="el-icon-circle-check" @click="batchEnable">{{
$t('user.enable')
}}</CustomButton>
<CustomButton size="small" type="delete" icon="el-icon-delete" @click="batchDelete">{{ $t('user.delete')
}}</CustomButton>
</div>