.document-edit-page { @apply w-full; } .document-edit-page .page-header { @apply flex justify-between items-center mb-4; } .document-edit-page .page-title { @apply text-xl font-medium; } .document-edit-page .form-group { @apply mb-4; } .document-edit-page .form-label { @apply block text-sm font-medium text-gray-700 mb-1; } .document-edit-page .form-input, .document-edit-page .form-textarea, .document-edit-page .form-select { @apply w-full rounded-md border border-gray-300 shadow-sm px-3 py-2; @apply focus:outline-none focus:border-[var(--primary-color)] focus:shadow-[0_0_0_2px_rgba(0,104,74,0.2)]; } .document-edit-page .text-secondary { @apply text-gray-500; } /* 文档信息样式 */ .document-info { @apply flex items-start mb-6; } .document-icon { @apply text-3xl mr-4 p-2 bg-gray-50 rounded-lg; } .document-details { @apply flex-1; } .document-name { @apply text-lg font-medium mb-1; } .document-meta { @apply flex items-center flex-wrap gap-4 text-sm text-gray-600; } .meta-item { @apply flex items-center; } .meta-item i { @apply mr-1; } /* 状态徽章样式 */ .status-badge { @apply inline-flex items-center px-2 py-0.5 rounded-full text-xs; } .status-pending { @apply bg-blue-50 text-blue-600; } .status-processing { @apply bg-yellow-50 text-yellow-600; } .status-pass { @apply bg-green-50 text-green-600; } .status-warning { @apply bg-orange-50 text-orange-600; } .status-fail { @apply bg-red-50 text-red-600; } /* 提示框样式 */ .alert { @apply flex items-center p-3 rounded-md; } .alert-info { @apply bg-blue-50 border border-blue-100 text-blue-700; } /* 切换开关样式 */ .switch { position: relative; display: inline-block; width: 36px; height: 20px; @apply align-middle; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; transition: .4s; border-radius: 34px; } .slider:before { position: absolute; content: ""; height: 16px; width: 16px; left: 2px; bottom: 2px; background-color: white; transition: .4s; border-radius: 50%; } input:checked + .slider { @apply bg-primary-500; } input:focus + .slider { @apply ring-2 ring-offset-2 ring-primary-500; } input:checked + .slider:before { transform: translateX(16px); } /* 文档预览样式 */ .document-preview { @apply border border-gray-200 rounded-md overflow-hidden max-h-[1000px] ; } .preview-toolbar { @apply px-4 py-2 bg-gray-50 border-b border-gray-200 flex justify-between items-center; } .preview-content { @apply h-full overflow-auto p-4 bg-white; } .preview-placeholder { @apply flex flex-col justify-center items-center h-full text-gray-500; } .preview-placeholder i { @apply text-4xl mb-4 text-gray-300; } /* 历史时间线样式 */ .history-timeline { @apply relative pl-5 mt-5; } .history-timeline::before { content: ''; @apply absolute left-0 top-2 bottom-2 w-0.5 bg-gray-100; } .timeline-item { @apply relative pb-4; } .timeline-item::before { content: ''; @apply absolute w-2.5 h-2.5 rounded-full bg-primary-500 -left-6 top-1.5; } .timeline-item:last-child { @apply pb-0; } .timeline-time { @apply text-xs text-gray-500 mb-1; } .timeline-content { @apply bg-gray-50 p-2 rounded; } /* 错误容器样式 */ .error-container { @apply p-6; } .document-edit-page .form-select.error { @apply border-red-500 focus:ring-0 focus:shadow-none; }