diff --git a/apps/jingrow/frontend/src/core/pagetype/GenericDetailPage.vue b/apps/jingrow/frontend/src/core/pagetype/GenericDetailPage.vue
index 6d534ee..3b7d91b 100644
--- a/apps/jingrow/frontend/src/core/pagetype/GenericDetailPage.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/GenericDetailPage.vue
@@ -76,7 +76,7 @@
{{ t('Back') }}
-
+
{{ t('Save') }}
@@ -1631,6 +1631,41 @@ watch(() => route.params.entity, async (newEntity, oldEntity) => {
justify-content: center;
}
+/* 保存按钮 - 使用品牌色 */
+.save-btn-brand {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ color: white !important;
+}
+
+.save-btn-brand:hover {
+ background: #1ab85f !important;
+ border: none !important;
+ border-color: #1ab85f !important;
+}
+
+.save-btn-brand:focus {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ box-shadow: 0 0 0 2px rgba(31, 199, 111, 0.2) !important;
+}
+
+.save-btn-brand:active {
+ background: #17a955 !important;
+ border: none !important;
+ border-color: #17a955 !important;
+}
+
+.save-btn-brand:disabled {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ opacity: 0.6 !important;
+ cursor: not-allowed !important;
+}
+
/* 响应式设计 - Naive UI Layout 自动处理 */
@media (max-width: 768px) {
.generic-detail-page {
diff --git a/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue b/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
index 96626e4..a4c07f5 100644
--- a/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
@@ -1534,14 +1534,38 @@ function formatDisplayValue(value: any, fieldName: string) {
.filters { display: flex; gap: 8px; align-items: center; }
/* 视图切换按钮 */
-.view-toggle { display: flex; background: #f8fafc; border-radius: 8px; padding: 2px; border: 1px solid #e2e8f0; }
-.toggle-btn {
- width: 32px; height: 32px; border: none; Background: transparent; color: #64748b;
- cursor: pointer; display: flex; align-items: center; justify-content: center;
- border-radius: 6px; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+.view-toggle {
+ display: flex;
+ background: #f8fafc;
+ border-radius: 8px;
+ padding: 2px;
+ border: 1px solid #e2e8f0;
+}
+
+/* 切换按钮 - 使用灰色系 */
+.toggle-btn {
+ width: 32px;
+ height: 32px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 6px;
+ transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.toggle-btn:hover {
+ background: #f1f5f9;
+ color: #475569;
+}
+
+.toggle-btn.active {
+ background: #e2e8f0;
+ color: #1e293b;
}
-.toggle-btn:hover { background: #e2e8f0; color: #475569; }
-.toggle-btn.active { background: #2563eb; color: white; }
/* 刷新按钮 */
.refresh-btn {
@@ -1555,15 +1579,17 @@ function formatDisplayValue(value: any, fieldName: string) {
.refresh-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }
.refresh-btn:disabled:hover { background: #f8fafc; color: #64748b; transform: none; box-shadow: none; }
-/* 新建按钮 */
+/* 新建按钮 - 使用品牌色 */
.create-btn {
- height: 36px; padding: 0 16px; border: none; border-radius: 8px; background: #2563eb;
+ height: 36px; padding: 0 16px; border: none; border-radius: 8px; background: #1fc76f;
color: white; cursor: pointer; display: flex; align-items: center; gap: 6px;
font-size: 14px; font-weight: 500; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
position: relative; overflow: hidden;
}
-.create-btn:hover { background: #1d4ed8; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3); }
-.create-btn:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3); }
+.create-btn:hover { background: #1ab85f; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(31, 199, 111, 0.3); }
+.create-btn:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(31, 199, 111, 0.3); }
+.create-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }
+.create-btn:disabled:hover { background: #1fc76f; transform: none; box-shadow: none; }
.create-btn i { font-size: 12px; }
/* 删除选中按钮 */
diff --git a/apps/jingrow/frontend/src/core/pagetype/SinglePageDetail.vue b/apps/jingrow/frontend/src/core/pagetype/SinglePageDetail.vue
index 7756500..a5f6f72 100644
--- a/apps/jingrow/frontend/src/core/pagetype/SinglePageDetail.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/SinglePageDetail.vue
@@ -14,7 +14,7 @@
{{ t('Back') }}
-
+
{{ t('Save') }}
@@ -1143,4 +1143,39 @@ watch(() => route.params.entity, async (newEntity, oldEntity) => {
padding: 12px;
min-height: 40px;
}
+
+/* 保存按钮 - 使用品牌色 */
+.save-btn-brand {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ color: white !important;
+}
+
+.save-btn-brand:hover {
+ background: #1ab85f !important;
+ border: none !important;
+ border-color: #1ab85f !important;
+}
+
+.save-btn-brand:focus {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ box-shadow: 0 0 0 2px rgba(31, 199, 111, 0.2) !important;
+}
+
+.save-btn-brand:active {
+ background: #17a955 !important;
+ border: none !important;
+ border-color: #17a955 !important;
+}
+
+.save-btn-brand:disabled {
+ background: #1fc76f !important;
+ border: none !important;
+ border-color: #1fc76f !important;
+ opacity: 0.6 !important;
+ cursor: not-allowed !important;
+}