新增文件上传页面，新增文件上传的公共组件（进度条，步骤条，上传区域）

2025-03-31 19:53:26 +08:00
parent 65da73071d
commit 8fe88c1d15
19 changed files with 1492 additions and 32 deletions
@@ -0,0 +1,57 @@
+/**
+ * 文件上传区域组件样式
+ */
+
+:root {
+  --primary-color: var(--color-primary, #00684a);
+  --primary-hover: var(--color-primary-hover, #005a40);
+  --primary-light: rgba(0, 104, 74, 0.1);
+  --success-color: var(--color-success, #52c41a);
+  --warning-color: var(--color-warning, #faad14);
+  --error-color: var(--color-error, #ff4d4f);
+  --text-color: rgba(0, 0, 0, 0.85);
+  --text-secondary: rgba(0, 0, 0, 0.45);
+  --border-color: #f0f0f0;
+  --bg-gray: #f5f5f5;
+}
+
+/* 上传区域样式 */
+.upload-area {
+  @apply border-2 border-dashed border-gray-300 rounded-lg p-10 text-center bg-gray-50 cursor-pointer transition-all duration-300;
+}
+
+.upload-area:hover, 
+.upload-area.dragover {
+  @apply border-[var(--primary-color)] bg-[var(--primary-light)];
+}
+
+.upload-area.disabled {
+  @apply opacity-50 cursor-not-allowed;
+}
+
+.upload-icon {
+  @apply text-5xl text-gray-400 mb-4;
+}
+
+.upload-text {
+  @apply text-gray-500 mb-2 font-medium;
+}
+
+.upload-tip {
+  @apply text-xs text-gray-500;
+}
+
+/* 响应式调整 */
+@screen sm {
+  .upload-area {
+    @apply p-6;
+  }
+  
+  .upload-icon {
+    @apply text-4xl mb-2;
+  }
+  
+  .upload-text {
+    @apply text-sm;
+  }
+}