mirror of
https://github.com/xinnan-tech/xiaozhi-esp32-server.git
synced 2026-07-24 08:03:53 +08:00
update: 系统功能配置页面适配调整
This commit is contained in:
@@ -8,13 +8,13 @@
|
||||
<div class="config-header">
|
||||
<h2 class="page-title">{{ $t('header.featureManagement') }}</h2>
|
||||
<div class="header-actions">
|
||||
<CustomButton size="small" @click="!isSaving && toggleSelectAll()" :disabled="isSaving">
|
||||
<CustomButton :icon="isAllSelected ? 'el-icon-circle-close' : 'el-icon-circle-check'" size="medium" @click="!isSaving && toggleSelectAll()" :disabled="isSaving">
|
||||
{{ isAllSelected ? $t('featureManagement.deselectAll') : $t('featureManagement.selectAll') }}
|
||||
</CustomButton>
|
||||
<CustomButton size="small" @click="handleReset" :disabled="isSaving">
|
||||
<CustomButton icon="el-icon-refresh" size="medium" @click="handleReset" :disabled="isSaving">
|
||||
{{ $t('featureManagement.reset') }}
|
||||
</CustomButton>
|
||||
<CustomButton size="small" type="confirm" @click="handleSave" :disabled="isSaving">
|
||||
<CustomButton icon="el-icon-setting" size="medium" type="confirm" @click="handleSave" :disabled="isSaving">
|
||||
{{ isSaving ? $t('featureManagement.saving') : $t('featureManagement.save') }}
|
||||
</CustomButton>
|
||||
</div>
|
||||
@@ -45,19 +45,17 @@
|
||||
<div class="feature-content">
|
||||
<div class="feature-header">
|
||||
<h3 class="feature-name">{{ $t(`feature.${feature.id}.name`) }}</h3>
|
||||
<span v-if="feature.enabled" class="feature-enabled-tag">{{ $t('featureManagement.enabled') }}</span>
|
||||
<span v-else class="feature-disabled-tag">{{ $t('featureManagement.disabled') }}</span>
|
||||
<div class="feature-checkbox-container">
|
||||
<el-checkbox
|
||||
v-model="feature.enabled"
|
||||
@change="!isSaving && toggleFeature(feature)"
|
||||
class="feature-checkbox"
|
||||
:disabled="isSaving"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<p class="feature-description">{{ $t(`feature.${feature.id}.description`) }}</p>
|
||||
</div>
|
||||
<div class="feature-checkbox-container">
|
||||
<el-checkbox
|
||||
v-model="feature.enabled"
|
||||
@change="!isSaving && toggleFeature(feature)"
|
||||
class="feature-checkbox"
|
||||
:disabled="isSaving"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -84,19 +82,17 @@
|
||||
<div class="feature-content">
|
||||
<div class="feature-header">
|
||||
<h3 class="feature-name">{{ $t(`feature.${feature.id}.name`) }}</h3>
|
||||
<span v-if="feature.enabled" class="feature-enabled-tag">{{ $t('featureManagement.enabled') }}</span>
|
||||
<span v-else class="feature-disabled-tag">{{ $t('featureManagement.disabled') }}</span>
|
||||
<div class="feature-checkbox-container">
|
||||
<el-checkbox
|
||||
v-model="feature.enabled"
|
||||
@change="!isSaving && toggleFeature(feature)"
|
||||
class="feature-checkbox"
|
||||
:disabled="isSaving"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<p class="feature-description">{{ $t(`feature.${feature.id}.description`) }}</p>
|
||||
</div>
|
||||
<div class="feature-checkbox-container">
|
||||
<el-checkbox
|
||||
v-model="feature.enabled"
|
||||
@change="!isSaving && toggleFeature(feature)"
|
||||
class="feature-checkbox"
|
||||
:disabled="isSaving"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -504,15 +500,18 @@ export default {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
.feature-content {
|
||||
width: 100%;
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.feature-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.feature-checkbox-container {
|
||||
margin-top: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30px;
|
||||
@@ -531,36 +530,18 @@ export default {
|
||||
color: #5778ff;
|
||||
}
|
||||
|
||||
.feature-enabled-tag {
|
||||
background: #5778ff;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
padding: 4px 8px;
|
||||
border-radius: 10px;
|
||||
margin-left: 10px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.feature-disabled-tag {
|
||||
background: #DCDFE6;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
padding: 4px 8px;
|
||||
border-radius: 10px;
|
||||
margin-left: 10px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.feature-name {
|
||||
white-space: normal;
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
font-size: 18px;
|
||||
line-height: 18px;
|
||||
line-height: 1.4;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin: 0;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
|
||||
.feature-description {
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
@@ -570,7 +551,6 @@ export default {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
/* 功能分组容器 - 左右布局 */
|
||||
.feature-groups-container {
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user