.receipt-folder-page { height: 100%; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr); animation: fadeUp 220ms var(--ease) both; overflow: hidden; } .receipt-folder-list, .receipt-folder-detail { min-height: 0; overflow: hidden; } .receipt-folder-list { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; padding: 16px 18px; } .receipt-folder-list th:first-child, .receipt-folder-list td:first-child { text-align: left; } .receipt-folder-list td:first-child .doc-id { display: block; overflow: hidden; text-overflow: ellipsis; } .col-file { width: 22%; } .col-kind { width: 13%; } .col-scene { width: 13%; } .col-money { width: 10%; } .col-date { width: 12%; } .col-score { width: 10%; } .col-status { width: 10%; } .col-updated { width: 14%; } .receipt-field-list-head { display: flex; align-items: center; } .receipt-key-grid input, .receipt-edit-field-row input { width: 100%; border: 1px solid #d7e0ea; border-radius: 4px; background: #fff; color: #0f172a; font-size: 13px; transition: border-color 160ms ease, box-shadow 160ms ease; } .receipt-key-grid input, .receipt-edit-field-row input { height: 36px; padding: 0 10px; } .receipt-key-grid input:focus, .receipt-edit-field-row input:focus { border-color: var(--theme-primary); box-shadow: 0 0 0 3px rgba(58, 124, 165, 0.14); outline: none; } .apply-btn, .ghost-btn { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 4px; font-size: 13px; font-weight: 750; white-space: nowrap; } .ghost-btn { padding: 0 13px; border: 1px solid #d7e0ea; background: #fff; color: #334155; } .apply-btn { padding: 0 14px; border: 1px solid var(--theme-primary); background: var(--theme-primary); color: #fff; } .apply-btn:disabled, .ghost-btn:disabled { opacity: .55; cursor: not-allowed; } .receipt-folder-detail { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 12px; padding: 0; } .receipt-folder-detail :deep(.detail-scroll) { min-height: 0; display: grid; align-content: start; gap: 16px; padding-right: 4px; overflow: auto; } .receipt-folder-detail :deep(.detail-actions) { margin-top: 10px; padding-top: 10px; } .receipt-folder-detail :deep(.detail-grid) { min-height: 0; display: grid; grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr); gap: 16px; align-items: stretch; overflow: visible; } .receipt-folder-detail :deep(.detail-main), .receipt-folder-detail :deep(.detail-side) { min-height: 0; display: grid; } .receipt-folder-detail :deep(.enterprise-detail-card .card-head) { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .receipt-folder-detail :deep(.enterprise-detail-card .card-head h3) { margin: 0; color: #0f172a; font-size: 15px; font-weight: 850; } .receipt-folder-detail :deep(.enterprise-detail-card .card-head p) { margin: 4px 0 0; color: #64748b; font-size: 12px; } .receipt-basic-panel, .receipt-preview-panel { min-height: 0; overflow: hidden; border: 1px solid #dbe4ee; border-radius: 4px; background: #fff; } .receipt-basic-panel { display: block; padding: 14px; overflow-y: auto; } .receipt-field-list-head { justify-content: space-between; gap: 12px; } .receipt-field-list-head strong { color: #0f172a; font-size: 15px; } .receipt-field-list-head small { color: #64748b; font-size: 12px; font-weight: 750; } .receipt-key-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; } .receipt-key-field, .receipt-edit-field-row label { display: grid; gap: 6px; } .receipt-key-field span, .receipt-edit-field-row label span { color: #64748b; font-size: 12px; font-weight: 750; } .receipt-other-info { margin-top: 18px; } .receipt-other-collapse { border-top: 1px solid #e5edf5; border-bottom: 0; } .receipt-other-collapse :deep(.el-collapse-item__header) { min-height: 42px; height: auto; border-bottom: 1px solid #e5edf5; background: #fff; color: #0f172a; } .receipt-other-collapse :deep(.el-collapse-item__wrap) { border-bottom: 0; } .receipt-other-collapse :deep(.el-collapse-item__content) { padding: 12px 0 0; } .receipt-collapse-title { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-right: 10px; } .receipt-collapse-title strong { color: #0f172a; font-size: 15px; } .receipt-collapse-title small { color: #64748b; font-size: 12px; font-weight: 750; } .receipt-other-scroll { max-height: 320px; display: grid; gap: 10px; overflow-y: auto; padding-right: 4px; } .receipt-edit-field-row { display: grid; grid-template-columns: minmax(120px, .72fr) minmax(180px, 1.28fr); gap: 10px; padding: 10px; border: 1px solid #e1e8f0; border-radius: 4px; background: #f8fafc; } .receipt-field-empty { min-height: 64px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px dashed #d7e0ea; border-radius: 4px; background: #f8fafc; color: #64748b; font-size: 13px; font-weight: 700; } .receipt-preview-panel { display: grid; grid-template-rows: auto minmax(0, 1fr); } .receipt-preview-box { min-height: 0; display: grid; place-items: center; overflow: auto; background: #f8fafc; } .receipt-preview-box img { max-width: 100%; max-height: 100%; object-fit: contain; } .receipt-preview-box iframe { width: 100%; height: 100%; border: 0; background: #fff; } .preview-empty { display: grid; gap: 8px; justify-items: center; color: #64748b; text-align: center; } .preview-empty .mdi { color: var(--theme-primary); font-size: 34px; } .associate-step { display: grid; gap: 12px; } .associate-hint { margin: 0; color: #64748b; font-size: 13px; } .receipt-checkbox-list, .draft-choice-list { max-height: 360px; display: grid; gap: 8px; overflow-y: auto; } .receipt-checkbox-list :deep(.el-checkbox), .draft-choice { min-height: 50px; align-items: center; margin-right: 0; padding: 9px 10px; border: 1px solid #dbe4ee; border-radius: 4px; background: #fff; } .receipt-checkbox-list :deep(.el-checkbox__label) { display: grid; gap: 3px; color: #0f172a; font-weight: 750; } .receipt-checkbox-list small, .draft-choice small { color: #64748b; font-size: 12px; font-weight: 650; } .draft-choice { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 9px; cursor: pointer; } .draft-choice.active { border-color: rgba(58, 124, 165, .42); background: rgba(58, 124, 165, .07); } .draft-choice span { display: grid; gap: 3px; } @media (max-width: 1120px) { .receipt-folder-detail :deep(.detail-grid) { grid-template-columns: 1fr; overflow-y: auto; } .receipt-preview-panel { min-height: 520px; } } @media (max-width: 760px) { .receipt-folder-list { padding: 12px; } .receipt-key-grid, .receipt-edit-field-row { grid-template-columns: 1fr; } }