fix: expand requirements document workspace

bugfix/ai-assessment-evidence-rescore
陈沅 1 month ago
parent 3c7ddd57b0
commit dbda485c63

@ -499,7 +499,8 @@ function exportOutcome() { if (currentStep.value === 2) { exportStepTwoTable();
<style scoped> <style scoped>
.requirements-doc-page { min-height: 100vh; color: #dcebf8; background: radial-gradient(circle at 15% -10%, rgba(23, 134, 205, .22), transparent 36%), #071521; } .requirements-doc-page { min-height: 100vh; color: #dcebf8; background: radial-gradient(circle at 15% -10%, rgba(23, 134, 205, .22), transparent 36%), #071521; }
.training-core { width: min(1480px, calc(100% - 48px)); margin: 0 auto; padding: 30px 0 60px; } /* 该页处于带 AI 侧栏的双栏工作区,不能再用居中最大宽度,否则两侧会出现大面积空白。 */
.training-core { width: 100%; max-width: none; min-height: 0; margin: 0; padding: 0; }
.task-header { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }.task-badge, .step-chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 1px solid rgba(68, 203, 255, .42); border-radius: 999px; color: #8ee7ff; background: rgba(6, 86, 129, .28); font-size: 13px; }.task-title { margin: 0; color: #f1f8ff; font-size: 26px; letter-spacing: .02em; } .task-header { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }.task-badge, .step-chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 1px solid rgba(68, 203, 255, .42); border-radius: 999px; color: #8ee7ff; background: rgba(6, 86, 129, .28); font-size: 13px; }.task-title { margin: 0; color: #f1f8ff; font-size: 26px; letter-spacing: .02em; }
.task-card { padding: 26px; border: 1px solid rgba(66, 181, 237, .42); border-radius: 24px; background: rgba(4, 24, 39, .78); box-shadow: 0 18px 42px rgba(0, 0, 0, .2); }.workbench-head, .step-title-row, .purpose-bank__head, .task-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.workbench-head { padding-bottom: 18px; border-bottom: 1px solid rgba(0, 180, 255, .2); }.workbench-head h2, .step-title-row h3, .purpose-bank h4 { margin: 4px 0 0; color: #f2f9ff; }.workbench-head h2 { font-size: 24px; }.requirements-doc-toolbar { align-self: center; justify-content: flex-end; max-width: 100%; }.section-eyebrow { margin: 0; color: #55d8ff; font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; } .task-card { padding: 26px; border: 1px solid rgba(66, 181, 237, .42); border-radius: 24px; background: rgba(4, 24, 39, .78); box-shadow: 0 18px 42px rgba(0, 0, 0, .2); }.workbench-head, .step-title-row, .purpose-bank__head, .task-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.workbench-head { padding-bottom: 18px; border-bottom: 1px solid rgba(0, 180, 255, .2); }.workbench-head h2, .step-title-row h3, .purpose-bank h4 { margin: 4px 0 0; color: #f2f9ff; }.workbench-head h2 { font-size: 24px; }.requirements-doc-toolbar { align-self: center; justify-content: flex-end; max-width: 100%; }.section-eyebrow { margin: 0; color: #55d8ff; font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.workbench-actions, .task-actions { display: flex; flex-wrap: wrap; }.outline-action, .btn-nav { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 15px; border: 1px solid rgba(98, 208, 255, .48); border-radius: 9px; color: #dff6ff; background: rgba(10, 87, 126, .35); cursor: pointer; transition: .2s ease; }.outline-action:hover, .btn-nav:hover:not(:disabled) { border-color: #56dcff; background: rgba(18, 137, 190, .48); transform: translateY(-1px); }.btn-submit { border-color: #26c9ed; color: #fff; background: linear-gradient(135deg, #087baa, #18b7df); }.btn-primary { border-color: #8a72ff; background: linear-gradient(135deg, #5a4fc9, #8c6ef1); }.btn-nav:disabled { cursor: not-allowed; opacity: .48; } .workbench-actions, .task-actions { display: flex; flex-wrap: wrap; }.outline-action, .btn-nav { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 15px; border: 1px solid rgba(98, 208, 255, .48); border-radius: 9px; color: #dff6ff; background: rgba(10, 87, 126, .35); cursor: pointer; transition: .2s ease; }.outline-action:hover, .btn-nav:hover:not(:disabled) { border-color: #56dcff; background: rgba(18, 137, 190, .48); transform: translateY(-1px); }.btn-submit { border-color: #26c9ed; color: #fff; background: linear-gradient(135deg, #087baa, #18b7df); }.btn-primary { border-color: #8a72ff; background: linear-gradient(135deg, #5a4fc9, #8c6ef1); }.btn-nav:disabled { cursor: not-allowed; opacity: .48; }
@ -510,5 +511,5 @@ function exportOutcome() { if (currentStep.value === 2) { exportStepTwoTable();
.prd-detail-card { overflow: hidden; }.prd-table-wrap { overflow: auto; border: 1px solid rgba(102, 184, 223, .5); border-radius: 12px; }.prd-detail-table { width: 100%; min-width: 1000px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }.prd-detail-table th { padding: 13px; color: #effbff; background: linear-gradient(90deg, #087da9, #0b9bca); font-weight: 700; }.prd-detail-table td { padding: 12px; border-top: 1px solid rgba(115, 165, 188, .38); border-right: 1px solid rgba(115, 165, 188, .38); vertical-align: top; background: rgba(9, 38, 57, .44); }.prd-detail-table th:not(:last-child) { border-right: 1px solid rgba(212, 246, 255, .25); }.prd-detail-table td:last-child { border-right: 0; }.prd-detail-table th:nth-child(1), .module-number { width: 72px; text-align: center; }.prd-detail-table th:nth-child(2), .module-name { width: 155px; }.prd-detail-table th:nth-child(3), .submodule-name { width: 245px; }.module-number, .module-name, .submodule-name { color: #dff6ff; vertical-align: middle !important; }.module-name { background: rgba(10, 90, 122, .28) !important; font-weight: 700; }.submodule-name { background: rgba(20, 69, 92, .28) !important; }.detail-editor-cell { min-width: 480px; }.example-bar { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 9px; color: #7fa6ba; font-size: 13px; line-height: 1.6; }.example-bar button { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(96, 201, 237, .5); border-radius: 6px; color: #9deaff; background: rgba(5, 86, 124, .24); cursor: pointer; }.example-bar button:hover { color: #fff; background: rgba(12, 139, 182, .6); }.detail-editor-cell textarea { display: block; width: 100%; min-height: 92px; resize: vertical; box-sizing: border-box; padding: 10px; border: 1px solid rgba(108, 182, 215, .36); border-radius: 8px; outline: none; color: #eaf8ff; background: rgba(1, 18, 29, .62); font: inherit; line-height: 1.65; }.detail-editor-cell textarea:focus { border-color: #3ddff9; box-shadow: 0 0 0 3px rgba(55, 215, 248, .12); }.detail-editor-cell textarea::placeholder { color: #66899c; }.upcoming-card { text-align: center; }.upcoming-card h3 { margin: 8px 0; }.upcoming-card p:not(.section-eyebrow) { color: #a6c2d2; } .prd-detail-card { overflow: hidden; }.prd-table-wrap { overflow: auto; border: 1px solid rgba(102, 184, 223, .5); border-radius: 12px; }.prd-detail-table { width: 100%; min-width: 1000px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }.prd-detail-table th { padding: 13px; color: #effbff; background: linear-gradient(90deg, #087da9, #0b9bca); font-weight: 700; }.prd-detail-table td { padding: 12px; border-top: 1px solid rgba(115, 165, 188, .38); border-right: 1px solid rgba(115, 165, 188, .38); vertical-align: top; background: rgba(9, 38, 57, .44); }.prd-detail-table th:not(:last-child) { border-right: 1px solid rgba(212, 246, 255, .25); }.prd-detail-table td:last-child { border-right: 0; }.prd-detail-table th:nth-child(1), .module-number { width: 72px; text-align: center; }.prd-detail-table th:nth-child(2), .module-name { width: 155px; }.prd-detail-table th:nth-child(3), .submodule-name { width: 245px; }.module-number, .module-name, .submodule-name { color: #dff6ff; vertical-align: middle !important; }.module-name { background: rgba(10, 90, 122, .28) !important; font-weight: 700; }.submodule-name { background: rgba(20, 69, 92, .28) !important; }.detail-editor-cell { min-width: 480px; }.example-bar { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 9px; color: #7fa6ba; font-size: 13px; line-height: 1.6; }.example-bar button { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(96, 201, 237, .5); border-radius: 6px; color: #9deaff; background: rgba(5, 86, 124, .24); cursor: pointer; }.example-bar button:hover { color: #fff; background: rgba(12, 139, 182, .6); }.detail-editor-cell textarea { display: block; width: 100%; min-height: 92px; resize: vertical; box-sizing: border-box; padding: 10px; border: 1px solid rgba(108, 182, 215, .36); border-radius: 8px; outline: none; color: #eaf8ff; background: rgba(1, 18, 29, .62); font: inherit; line-height: 1.65; }.detail-editor-cell textarea:focus { border-color: #3ddff9; box-shadow: 0 0 0 3px rgba(55, 215, 248, .12); }.detail-editor-cell textarea::placeholder { color: #66899c; }.upcoming-card { text-align: center; }.upcoming-card h3 { margin: 8px 0; }.upcoming-card p:not(.section-eyebrow) { color: #a6c2d2; }
.file-input-hidden { display: none; }.prd-upload-card { overflow: hidden; }.prd-delivery-guide { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 20px 22px; border: 1px solid rgba(72, 201, 255, .2); border-radius: 16px; background: linear-gradient(135deg, rgba(20, 86, 127, .28), rgba(8, 32, 54, .2)); }.prd-delivery-guide h3 { margin: 0 0 10px; font-size: 18px; color: #eef9ff; }.prd-delivery-guide ol { margin: 0; padding-left: 20px; color: #b8d3e2; line-height: 1.8; }.document-drop-zone { display: grid; min-height: 270px; place-content: center; justify-items: center; gap: 14px; padding: 30px; margin-top: 20px; border: 1px dashed rgba(81, 207, 255, .5); border-radius: 18px; background: radial-gradient(circle at 50% 0, rgba(41, 180, 235, .16), transparent 52%), rgba(8, 33, 52, .56); text-align: center; transition: .2s ease; }.document-drop-zone:hover { border-color: #4ad4ff; background-color: rgba(14, 65, 95, .66); transform: translateY(-2px); }.document-upload-icon { font-size: 42px; color: #42d8ff; }.document-drop-zone h3 { margin: 0; color: #eefaff; font-size: 21px; }.document-drop-zone p { max-width: 560px; margin: 0; color: #a6c2d2; line-height: 1.7; }.uploaded-document-card { display: flex; align-items: center; gap: 16px; padding: 18px 20px; margin-top: 20px; border: 1px solid rgba(69, 206, 255, .3); border-radius: 16px; background: rgba(9, 45, 70, .72); }.document-file-icon { flex: 0 0 auto; font-size: 32px; color: #55dcff; }.uploaded-document-main { min-width: 0; flex: 1; }.uploaded-document-main h3 { overflow: hidden; margin: 0 0 5px; color: #f0fbff; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }.uploaded-document-main p { margin: 0; color: #9cc1d4; font-size: 13px; }.uploaded-document-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 9px; }.btn-danger { border: 1px solid rgba(255, 115, 127, .45); color: #ffacb3; background: rgba(116, 32, 48, .25); }.btn-danger:hover { border-color: #ff7884; background: rgba(150, 38, 55, .38); color: #fff; }.prd-pdf-preview { height: min(68vh, 780px); overflow: hidden; border: 1px solid #d8e4ea; border-radius: 10px; background: #fff; }.prd-pdf-preview iframe { width: 100%; height: 100%; border: 0; }.prd-text-preview { max-height: min(68vh, 780px); overflow: auto; padding: 20px; border: 1px solid #d8e4ea; border-radius: 10px; color: #263849; background: #f8fbfd; font-family: "Microsoft YaHei", sans-serif; line-height: 1.8; white-space: pre-wrap; word-break: break-word; } .file-input-hidden { display: none; }.prd-upload-card { overflow: hidden; }.prd-delivery-guide { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 20px 22px; border: 1px solid rgba(72, 201, 255, .2); border-radius: 16px; background: linear-gradient(135deg, rgba(20, 86, 127, .28), rgba(8, 32, 54, .2)); }.prd-delivery-guide h3 { margin: 0 0 10px; font-size: 18px; color: #eef9ff; }.prd-delivery-guide ol { margin: 0; padding-left: 20px; color: #b8d3e2; line-height: 1.8; }.document-drop-zone { display: grid; min-height: 270px; place-content: center; justify-items: center; gap: 14px; padding: 30px; margin-top: 20px; border: 1px dashed rgba(81, 207, 255, .5); border-radius: 18px; background: radial-gradient(circle at 50% 0, rgba(41, 180, 235, .16), transparent 52%), rgba(8, 33, 52, .56); text-align: center; transition: .2s ease; }.document-drop-zone:hover { border-color: #4ad4ff; background-color: rgba(14, 65, 95, .66); transform: translateY(-2px); }.document-upload-icon { font-size: 42px; color: #42d8ff; }.document-drop-zone h3 { margin: 0; color: #eefaff; font-size: 21px; }.document-drop-zone p { max-width: 560px; margin: 0; color: #a6c2d2; line-height: 1.7; }.uploaded-document-card { display: flex; align-items: center; gap: 16px; padding: 18px 20px; margin-top: 20px; border: 1px solid rgba(69, 206, 255, .3); border-radius: 16px; background: rgba(9, 45, 70, .72); }.document-file-icon { flex: 0 0 auto; font-size: 32px; color: #55dcff; }.uploaded-document-main { min-width: 0; flex: 1; }.uploaded-document-main h3 { overflow: hidden; margin: 0 0 5px; color: #f0fbff; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }.uploaded-document-main p { margin: 0; color: #9cc1d4; font-size: 13px; }.uploaded-document-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 9px; }.btn-danger { border: 1px solid rgba(255, 115, 127, .45); color: #ffacb3; background: rgba(116, 32, 48, .25); }.btn-danger:hover { border-color: #ff7884; background: rgba(150, 38, 55, .38); color: #fff; }.prd-pdf-preview { height: min(68vh, 780px); overflow: hidden; border: 1px solid #d8e4ea; border-radius: 10px; background: #fff; }.prd-pdf-preview iframe { width: 100%; height: 100%; border: 0; }.prd-text-preview { max-height: min(68vh, 780px); overflow: auto; padding: 20px; border: 1px solid #d8e4ea; border-radius: 10px; color: #263849; background: #f8fbfd; font-family: "Microsoft YaHei", sans-serif; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
@media (max-width: 1020px) { .matching-workspace { grid-template-columns: 1fr; }.purpose-bank { position: static; }.purpose-card-list { max-height: 360px; }.workbench-head { align-items: flex-start; flex-direction: column; }.requirements-doc-toolbar { width: 100%; justify-content: flex-start; } } @media (max-width: 1020px) { .matching-workspace { grid-template-columns: 1fr; }.purpose-bank { position: static; }.purpose-card-list { max-height: 360px; }.workbench-head { align-items: flex-start; flex-direction: column; }.requirements-doc-toolbar { width: 100%; justify-content: flex-start; } }
@media (max-width: 680px) { .training-core { width: min(100% - 24px, 1480px); padding-top: 16px; }.task-card, .step-card { padding: 15px; }.module-row { grid-template-columns: 1fr; }.module-label { border-right: 0; border-bottom: 1px solid rgba(124, 166, 189, .35); }.task-header { align-items: flex-start; flex-direction: column; }.task-title { font-size: 22px; }.step-indicator { margin: 18px 0; }.step-tab { min-width: 165px; }.workbench-actions, .task-actions { width: 100%; }.outline-action, .btn-nav { flex: 1; }.purpose-bank { padding: 14px; }.example-bar { flex-direction: column; } } @media (max-width: 680px) { .training-core { width: 100%; padding-top: 0; }.task-card, .step-card { padding: 15px; }.module-row { grid-template-columns: 1fr; }.module-label { border-right: 0; border-bottom: 1px solid rgba(124, 166, 189, .35); }.task-header { align-items: flex-start; flex-direction: column; }.task-title { font-size: 22px; }.step-indicator { margin: 18px 0; }.step-tab { min-width: 165px; }.workbench-actions, .task-actions { width: 100%; }.outline-action, .btn-nav { flex: 1; }.purpose-bank { padding: 14px; }.example-bar { flex-direction: column; } }
</style> </style>

Loading…
Cancel
Save