feat: 功能优化

frontend/app/web-gold/src/views/system/StyleSettings.vue

@@ -3,10 +3,8 @@ import { ref, onMounted, reactive, h } from 'vue'
 import { message, Modal } from 'ant-design-vue'
 import { EditOutlined, DeleteOutlined, PlusOutlined } from '@ant-design/icons-vue'
 import { UserPromptApi } from '@/api/userPrompt'
-import { useUserStore } from '@/stores/user'
 import dayjs from 'dayjs'
 
-const userStore = useUserStore()
 
 // 表格数据
 const dataSource = ref([])
@@ -105,10 +103,11 @@ const columns = [
     width: 150,
     fixed: 'right',
     customRender: ({ record }) => {
-      return h('div', { style: { display: 'flex', gap: '8px' } }, [
+      return h('div', { class: 'action-buttons' }, [
         h('a-button', {
           type: 'link',
           size: 'small',
+          class: 'action-btn action-btn-edit',
           onClick: () => handleEdit(record),
         }, [
           h(EditOutlined),
@@ -118,6 +117,7 @@ const columns = [
           type: 'link',
           size: 'small',
           danger: true,
+          class: 'action-btn action-btn-delete',
           onClick: () => handleDelete(record),
         }, [
           h(DeleteOutlined),
@@ -199,7 +199,7 @@ async function handleSave() {
   try {
     await editFormRef.value.validate()
   } catch (error) {
-    return
+    console.error('保存提示词失败:', error)
   }
 
   loading.value = true
@@ -485,5 +485,36 @@ onMounted(() => {
 :deep(.ant-pagination) {
   margin: 16px;
 }
+
+/* 操作按钮样式 */
+.action-buttons {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+/* 使用 :deep() 穿透 Ant Design 的样式 */
+:deep(.action-btn) {
+  transition: all 0.2s ease;
+  border-radius: 4px;
+  padding: 4px 8px;
+  cursor: pointer;
+}
+
+:deep(.action-btn-edit:hover),
+:deep(.action-btn-edit:hover .anticon) {
+  background: rgba(24, 144, 255, 0.1) !important;
+  color: #1890FF !important;
+}
+
+:deep(.action-btn-delete:hover),
+:deep(.action-btn-delete:hover .anticon) {
+  background: rgba(24, 144, 255, 0.1) !important;
+  color: #1890FF !important;
+}
+
+:deep(.action-btn:hover) {
+  transform: translateY(-1px);
+}
 </style>