feat: 前端UI/UX全面优化 - CSS变量系统/交互动画/按下反馈/弹窗动画/输入框聚焦增强

src/views/admin/AdminLogin.vue

@@ -120,18 +120,11 @@
 import { ref, reactive, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
-import { User, Lock, Key, Document } from '@element-plus/icons-vue'
 import { lotteryApi } from '../../api/index.js'
 import { userStore } from '../../store/user.js'
 
 export default {
   name: 'AdminLogin',
-  components: {
-    User,
-    Lock,
-    Key,
-    Document
-  },
   setup() {
     const router = useRouter()
     const loginFormRef = ref()

src/views/admin/AnnouncementManagement.vue

@@ -270,32 +270,10 @@
 <script>
 import { ref, reactive, onMounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import {
-  Bell,
-  CircleCheck,
-  Edit,
-  Close,
-  Search,
-  Refresh,
-  Plus,
-  View,
-  Delete
-} from '@element-plus/icons-vue'
 import { lotteryApi } from '../../api/index.js'
 
 export default {
   name: 'AnnouncementManagement',
-  components: {
-    Bell,
-    CircleCheck,
-    Edit,
-    Close,
-    Search,
-    Refresh,
-    Plus,
-    View,
-    Delete
-  },
   setup() {
     const loading = ref(false)
     const submitting = ref(false)

src/views/admin/Dashboard.vue

@@ -224,21 +224,6 @@
 
 <script>
 import { ref, reactive, onMounted, onUnmounted, nextTick } from 'vue'
-import { 
-  User, 
-  Key, 
-  Ticket, 
-  TrendCharts, 
-  Operation, 
-  Document, 
-  Setting, 
-  InfoFilled, 
-  Clock,
-  ArrowRight,
-  View,
-  Sunny,
-  DataLine
-} from '@element-plus/icons-vue'
 import { userStore } from '../../store/user.js'
 import { lotteryApi } from '../../api/index.js'
 import { useRouter } from 'vue-router'
@@ -246,21 +231,6 @@ import * as echarts from 'echarts'
 
 export default {
   name: 'AdminDashboard',
-  components: {
-    User,
-    Key,
-    Ticket,
-    TrendCharts,
-    Operation,
-    Document,
-    Setting,
-    InfoFilled,
-    Clock,
-    ArrowRight,
-    View,
-    Sunny,
-    DataLine
-  },
   setup() {
     const router = useRouter()
     

src/views/admin/DltExcelImportManagement.vue

@@ -218,35 +218,8 @@
 import { lotteryApi } from '../../api/index.js'
 import dltLotteryApi from '../../api/dlt/index.js'
 import { userStore } from '../../store/user.js'
-import {
-  ElCard,
-  ElRow,
-  ElCol,
-  ElButton,
-  ElIcon
-} from 'element-plus'
-import {
-  Document,
-  Warning,
-  Plus,
-  InfoFilled,
-  FolderOpened
-} from '@element-plus/icons-vue'
-
 export default {
   name: 'AdminDltExcelImportManagement',
-  components: {
-    ElCard,
-    ElRow,
-    ElCol,
-    ElButton,
-    ElIcon,
-    Document,
-    Warning,
-    Plus,
-    InfoFilled,
-    FolderOpened
-  },
   data() {
     return {
       // 权限验证
@@ -461,7 +434,7 @@ export default {
 <style scoped>
 .excel-import-management {
   min-height: 100vh;
-  background: #f5f5f5;
+  background: var(--color-bg-page, #f0f2f5);
   padding: 24px;
 }
 

src/views/admin/ExcelImportManagement.vue

@@ -217,35 +217,8 @@
 <script>
 import { lotteryApi } from '../../api/index.js'
 import { userStore } from '../../store/user.js'
-import {
-  ElCard,
-  ElRow,
-  ElCol,
-  ElButton,
-  ElIcon
-} from 'element-plus'
-import {
-  Document,
-  Warning,
-  Plus,
-  InfoFilled,
-  FolderOpened
-} from '@element-plus/icons-vue'
-
 export default {
   name: 'AdminExcelImportManagement',
-  components: {
-    ElCard,
-    ElRow,
-    ElCol,
-    ElButton,
-    ElIcon,
-    Document,
-    Warning,
-    Plus,
-    InfoFilled,
-    FolderOpened
-  },
   data() {
     return {
       // 权限验证
@@ -472,7 +445,7 @@ export default {
 <style scoped>
 .excel-import-management {
   min-height: 100vh;
-  background: #f5f5f5;
+  background: var(--color-bg-page, #f0f2f5);
   padding: 24px;
 }
 

src/views/admin/OperationHistory.vue

@@ -141,23 +141,11 @@
 <script>
 import { ref, reactive, onMounted } from 'vue'
 import { ElMessage } from 'element-plus'
-import {
-  Clock,
-  Refresh,
-  Search,
-  Filter
-} from '@element-plus/icons-vue'
 import { lotteryApi } from '../../api/index.js'
 import { userStore } from '../../store/user.js'
 
 export default {
   name: 'OperationHistory',
-  components: {
-    Clock,
-    Refresh,
-    Search,
-    Filter
-  },
   setup() {
     // 筛选表单
     const filterForm = reactive({

src/views/admin/UserList.vue

@@ -423,28 +423,12 @@
 <script>
 import { ref, reactive, computed, onMounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import {
-  Search,
-  Refresh,
-  Plus,
-  Download,
-  Edit,
-  Delete
-} from '@element-plus/icons-vue'
 import { lotteryApi } from '../../api/index.js'
 import { userStore } from '../../store/user.js'
 import { useRouter } from 'vue-router'
 
 export default {
   name: 'UserList',
-  components: {
-    Search,
-    Refresh,
-    Plus,
-    Download,
-    Edit,
-    Delete
-  },
   setup() {
     const router = useRouter()
     // 权限检查

src/views/admin/VipCodeManagement.vue

@@ -374,33 +374,11 @@
 <script>
 import { ref, reactive, computed, onMounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import {
-  Key,
-  Check,
-  User,
-  Plus,
-  Search,
-  List,
-  Refresh,
-  Download,
-  CopyDocument
-} from '@element-plus/icons-vue'
 import { lotteryApi } from '../../api/index.js'
 import { userStore } from '../../store/user.js'
 
 export default {
   name: 'VipCodeManagement',
-  components: {
-    Key,
-    Check,
-    User,
-    Plus,
-    Search,
-    List,
-    Refresh,
-    Download,
-    CopyDocument
-  },
   setup() {
     // 统计数据
     const stats = reactive({

src/views/admin/layout/AdminLayout.vue

@@ -157,47 +157,17 @@
 import { ref, computed, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import {
-  DataBoard,
-  User,
-  Key,
-  Document,
-  Fold,
-  Expand,
-  ArrowDown,
-  Refresh,
-  Setting,
-  SwitchButton,
-  Clock,
-  Bell,
-  Aim,
-  Trophy
-} from '@element-plus/icons-vue'
 import { userStore } from '../../../store/user.js'
 import { lotteryApi } from '../../../api/index.js'
 
 export default {
   name: 'AdminLayout',
-  components: {
-    DataBoard,
-    User,
-    Key,
-    Document,
-    Fold,
-    Expand,
-    ArrowDown,
-    Bell,
-    Refresh,
-    Setting,
-    SwitchButton,
-    Clock
-  },
   setup() {
     const route = useRoute()
     const router = useRouter()
     const isCollapse = ref(false)
     const userName = ref('管理员')
-    const userAvatar = ref('https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png')
+    const userAvatar = ref('/assets/home/default-avatar.svg')
     const userRole = ref('')
     
     // 当前激活的菜单项