/* ===== CSS Variables — per design.md ===== */ :root { --brand-50: #E8F5E9; --brand-500: #4CAF50; --brand-600: #388E3C; --brand-700: #2E7D32; --secondary-50: #E3F2FD; --secondary-500: #1E88E5; --secondary-600: #1565C0; --gray-50: #F9FAFB; --gray-100: #F3F4F6; --gray-200: #E5E7EB; --gray-300: #D1D5DB; --gray-400: #9CA3AF; --gray-500: #6B7280; --gray-600: #4B5563; --gray-700: #374151; --gray-900: #111827; --warning: #FFC107; --warning-light: #FFF8E1; --primary-gradient: linear-gradient(135deg, #4CAF50, #388E3C); --bg: var(--gray-50); --card-bg: #fff; --text: var(--gray-900); --text-secondary: var(--gray-500); --text-light: var(--gray-700); --text-hint: var(--gray-400); --border: var(--gray-300); --border-light: var(--gray-200); --border-lighter: var(--gray-100); --radius: 8px; --radius-sm: 8px; --radius-lg: 12px; --radius-xl: 16px; --shadow-sm: 0 1px 2px rgba(0,0,0,0.05); --shadow-md: 0 4px 16px rgba(0,0,0,0.10); --shadow-xl: 0 20px 25px rgba(0,0,0,0.10); --role-designer:#6366F1; --role-designer-light:#EEF2FF; --role-budget:#F59E0B; --role-budget-light:#FFFBEB; --role-pm:#3B82F6; --role-pm-light:#EFF6FF; --role-finance:#10B981; --role-finance-light:#ECFDF5; --role-legal:#8B5CF6; --role-legal-light:#F5F3FF; --role-seal:#EC4899; --role-seal-light:#FDF2F8; --role-production:#F97316; --role-production-light:#FFF7ED; --role-cost:#14B8A6; --role-cost-light:#F0FDFA; --role-engineering:#0EA5E9; --role-engineering-light:#F0F9FF; } * { margin:0; padding:0; box-sizing:border-box; } html,body { height:100%; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif; font-size:18px; line-height:28px; color:var(--text); background:var(--bg); -webkit-font-smoothing:antialiased; } img { max-width:100%; } /* ===== Page Header ===== */ .page-header { background:var(--card-bg); border-bottom:1px solid var(--gray-100); padding:0 24px; height:56px; display:flex; align-items:center; box-shadow:0 1px 2px rgba(0,0,0,0.05); position:sticky; top:0; z-index:40; } .page-header .logo { font-size:18px; line-height:26px; font-weight:600; color:var(--text); display:flex; align-items:center; gap:10px; } .page-header .logo i { font-size:22px; color:var(--brand-500); } .page-header .subtitle { font-size:14px; line-height:22px; color:var(--text-secondary); margin-left:16px; padding-left:16px; border-left:2px solid var(--gray-200); } .page-header .back-btn { width:32px; height:32px; border-radius:var(--radius); border:none; background:transparent; cursor:pointer; display:none; align-items:center; justify-content:center; font-size:18px; color:var(--gray-600); margin-right:4px; } .page-header .back-btn:hover { background:var(--gray-100); color:var(--text); } /* ===== Main Container ===== */ .main-container { max-width:1550px; margin:0 auto; padding:32px; } /* ===== Page Title Area ===== */ .title-area { text-align:center; margin-bottom:32px; } .title-area h1 { font-size:28px; line-height:36px; font-weight:700; color:var(--text); margin-bottom:6px; } .title-area p { font-size:16px; line-height:24px; color:var(--text-secondary); } /* ===== Role Cards Grid ===== */ .role-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; } @media (max-width:1200px) { .role-grid { grid-template-columns:repeat(2, 1fr); } } @media (max-width:768px) { .role-grid { grid-template-columns:1fr; } .main-container { padding:16px; } } .role-card { background:var(--card-bg); border-radius:var(--radius); border:1px solid var(--gray-200); box-shadow:var(--shadow-sm); overflow:hidden; transition:all 300ms ease-in-out; display:flex; flex-direction:column; } .role-card:hover { box-shadow:0 4px 16px rgba(76,175,80,0.15); border-color:var(--brand-500); transform:translateY(-2px); } .role-card-header { padding:20px 24px 16px; display:flex; align-items:center; gap:14px; border-bottom:3px solid transparent; } .role-card-header .role-icon { width:48px; height:48px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; } .role-card-header .role-info { flex:1; min-width:0; } .role-card-header .role-name { font-size:18px; line-height:26px; font-weight:600; color:var(--text); } .role-card-header .role-count { font-size:14px; line-height:22px; color:var(--text-secondary); margin-top:2px; } .role-card-header .role-count span { font-weight:600; } .role-designer .role-card-header { border-bottom-color:var(--role-designer); } .role-designer .role-card-header .role-icon { background:var(--role-designer-light); color:var(--role-designer); } .role-budget .role-card-header { border-bottom-color:var(--role-budget); } .role-budget .role-card-header .role-icon { background:var(--role-budget-light); color:var(--role-budget); } .role-pm .role-card-header { border-bottom-color:var(--role-pm); } .role-pm .role-card-header .role-icon { background:var(--role-pm-light); color:var(--role-pm); } .role-finance .role-card-header { border-bottom-color:var(--role-finance); } .role-finance .role-card-header .role-icon { background:var(--role-finance-light); color:var(--role-finance); } .role-legal .role-card-header { border-bottom-color:var(--role-legal); } .role-legal .role-card-header .role-icon { background:var(--role-legal-light); color:var(--role-legal); } .role-seal .role-card-header { border-bottom-color:var(--role-seal); } .role-seal .role-card-header .role-icon { background:var(--role-seal-light); color:var(--role-seal); } .role-production .role-card-header { border-bottom-color:var(--role-production); } .role-production .role-card-header .role-icon { background:var(--role-production-light); color:var(--role-production); } .role-cost .role-card-header { border-bottom-color:var(--role-cost); } .role-cost .role-card-header .role-icon { background:var(--role-cost-light); color:var(--role-cost); } .role-engineering .role-card-header { border-bottom-color:var(--role-engineering); } .role-engineering .role-card-header .role-icon { background:var(--role-engineering-light); color:var(--role-engineering); } .role-card-body { padding:24px; flex:1; display:flex; flex-direction:column; gap:16px; } .module-title { font-size:14px; line-height:22px; font-weight:500; color:var(--text-hint); margin-bottom:8px; padding-left:2px; display:flex; align-items:center; gap:6px; } .module-title::before { content:''; display:inline-block; width:4px; height:4px; border-radius:50%; background:var(--text-hint); flex-shrink:0; } .module-buttons { display:flex; flex-direction:column; gap:8px; } .func-btn { display:flex; align-items:center; gap:8px; padding:0 16px; height:40px; border-radius:var(--radius); border:1px solid var(--gray-200); background:var(--card-bg); color:var(--text-light); cursor:pointer; font-size:16px; line-height:24px; font-weight:400; transition:all 150ms ease-in-out; text-align:left; width:100%; } .func-btn:hover { border-color:var(--brand-500); color:var(--brand-600); background:var(--brand-50); } .func-btn:active { background:var(--brand-50); } .func-btn .func-icon { width:20px; height:20px; border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; } .func-btn:hover .func-icon { background:var(--brand-50); color:var(--brand-500); } .func-btn .func-text { flex:1; } .func-btn .func-arrow { font-size:16px; flex-shrink:0; opacity:0.3; transition:opacity 150ms; } .func-btn:hover .func-arrow { opacity:1; color:var(--brand-500); } /* ===== Modal ===== */ .modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:9998; display:flex; align-items:center; justify-content:center; animation:fadeIn .2s ease-out; } @keyframes fadeIn { from{opacity:0} to{opacity:1} } .modal-dialog { background:#fff; border-radius:var(--radius-xl); padding:24px; text-align:center; max-width:360px; width:90%; box-shadow:var(--shadow-xl); animation:scaleIn .2s ease-out; } @keyframes scaleIn { from{opacity:0;transform:translateY(-8px) scale(0.95)} to{opacity:1;transform:translateY(0) scale(1)} } .modal-dialog .modal-icon { font-size:48px; margin-bottom:12px; } .modal-dialog .modal-title { font-size:18px; line-height:26px; font-weight:600; color:var(--text); margin-bottom:4px; } .modal-dialog .modal-desc { font-size:16px; line-height:24px; color:var(--text-secondary); margin-bottom:20px; } .modal-dialog .modal-role { display:inline-block; padding:2px 12px; border-radius:9999px; font-size:14px; line-height:22px; font-weight:500; color:var(--brand-600); background:var(--brand-50); margin-bottom:8px; } .modal-dialog .btn-close { padding:0 24px; height:40px; border-radius:var(--radius); border:none; background:var(--brand-500); color:#fff; cursor:pointer; font-size:16px; line-height:24px; font-weight:500; transition:all 150ms ease-in-out; } .modal-dialog .btn-close:hover { background:var(--brand-600); box-shadow:0 4px 12px rgba(76,175,80,0.3); transform:translateY(-1px); } .modal-dialog .btn-close:active { background:var(--brand-700); } /* ===== Designer Report View (inline page) ===== */ #designerReportView { display:none; } #designerReportView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #designerReportView .dr-inner { padding:16px; } } /* report card list */ .dr-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:0; cursor:pointer; overflow:hidden; margin-bottom:10px; transition:all .15s; box-shadow:var(--shadow-sm); } .dr-card:hover { box-shadow:0 2px 12px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } .dr-card-header { display:flex; align-items:center; gap:12px; padding:14px 16px 10px; } .dr-card-icon { width:40px; height:40px; border-radius:8px; background:var(--primary-gradient); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .dr-card-icon i { font-size:18px; color:#fff; } /* ===== Generic Card（与售后专员 card 对齐） ===== */ .card { background:var(--card-bg); border-radius:var(--radius); border:1px solid var(--border-light); padding:16px; margin-bottom:12px; box-shadow:0 1px 2px rgba(0,0,0,0.05); transition:all .2s ease-in-out; } .card:hover { box-shadow:0 4px 16px rgba(0,0,0,0.1); border-color:var(--gray-300); transform:translateY(-1px); } .dr-card-info { flex:1; min-width:0; } .dr-card-name { font-size:16px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dr-card-meta { display:flex; gap:12px; margin-top:3px; font-size:14px; color:var(--text-secondary); } .dr-card-summary { padding:0 16px 14px; font-size:16px; color:var(--text-light); line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } /* tags */ .tag { display:inline-flex; align-items:center; padding:2px 10px; border-radius:9999px; font-size:14px; font-weight:500; } .tag-warning { background:var(--warning-light); color:#B45309; } .tag-success { background:var(--brand-50); color:var(--brand-600); } .tag-blue { background:#E3F2FD; color:var(--secondary-600); } .tag-purple { background:#F3E8FF; color:#7C3AED; } .tag-default { background:#F3F4F6; color:var(--text-secondary); } .tag-info { background:#E8F4FD; color:#2563EB; } .fee-amount { font-size:16px; font-weight:600; color:var(--brand-500); } /* buttons */ .btn-success { background:var(--success); color:#fff; border-color:var(--success); } .btn-success:hover { background:#16A34A; border-color:#16A34A; color:#fff; } .btn-ghost { background:transparent; border-color:transparent; color:var(--text-secondary); } .btn-ghost:hover { background:var(--gray-50); color:var(--text); } /* toggle */ .toggle-wrap { display:flex; align-items:center; gap:10px; } .toggle { position:relative; width:44px; height:24px; background:var(--border); border-radius:12px; cursor:pointer; transition:background .2s; } .toggle.on { background:var(--brand-500); } .toggle .knob { position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%; background:#fff; transition:left .2s; } .toggle.on .knob { left:22px; } .toggle-label { font-size:16px; color:var(--text-light); } /* radio / checkbox */ .radio-group,.checkbox-group { display:flex; flex-wrap:wrap; gap:8px; } .radio-item,.checkbox-item { display:flex; align-items:center; gap:4px; cursor:pointer; padding:6px 14px; border:1px solid var(--border); border-radius:var(--radius); font-size:16px; background:#fff; transition:all .15s; } .radio-item:hover,.checkbox-item:hover { border-color:var(--brand-500); color:var(--brand-500); } .radio-item.selected,.checkbox-item.selected { border-color:var(--brand-500); background:var(--brand-50); color:var(--brand-500); } /* section title */ .section-title { font-size:16px; font-weight:600; margin:20px 0 10px; padding-left:0; color:var(--text); } .section-title:first-child { margin-top:0; } /* form hint */ .form-hint { font-size:16px; color:var(--text-secondary); margin-top:4px; } /* buttons */ .btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:0 20px; height:40px; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); cursor:pointer; font-size:16px; font-weight:500; transition:all 150ms ease-in-out; white-space:nowrap; } .btn:hover { border-color:var(--brand-500); color:var(--brand-600); } .btn-primary { background:var(--brand-500); color:#fff; border-color:var(--brand-500); } .btn-primary:hover { background:var(--brand-600); border-color:var(--brand-600); color:#fff; box-shadow:0 4px 12px rgba(76,175,80,0.3); transform:translateY(-1px); } .btn-outline { background:transparent; border-color:var(--brand-500); color:var(--brand-500); } .btn-outline:hover { background:var(--brand-50); color:var(--brand-600); } .btn-ghost { background:transparent; border-color:var(--gray-300); color:var(--text-secondary); } .btn-ghost:hover { background:var(--gray-50); color:var(--text-light); } .btn-sm { padding:0 14px; height:34px; font-size:14px; } .btn-lg { padding:0 28px; height:44px; font-size:16px; } .btn-block { display:flex; width:100%; } /* report banner */ .dr-banner { background:var(--primary-gradient); border-radius:var(--radius); padding:18px 16px; margin-bottom:10px; color:#fff; } .dr-banner-top { display:flex; align-items:center; margin-bottom:10px; } .dr-banner-type { font-size:16px; font-weight:500; opacity:.9; } .dr-banner-title { font-size:18px; font-weight:600; margin-bottom:6px; } .dr-banner-meta { display:flex; gap:16px; font-size:14px; opacity:.8; } /* report sections */ .dr-body { display:flex; flex-direction:column; gap:10px; } .dr-section { background:#fff; border-radius:var(--radius); padding:16px; border:1px solid var(--gray-200); } .dr-sec-header { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; } .dr-sec-num { width:32px; height:32px; border-radius:8px; background:var(--primary-gradient); color:#fff; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:600; flex-shrink:0; } .dr-sec-title { font-size:16px; font-weight:600; color:var(--text); } .dr-sec-desc { font-size:14px; color:var(--text-secondary); margin-top:2px; } .dr-sec-body p { font-size:16px; line-height:1.9; color:var(--text-light); } .dr-tip { display:flex; align-items:flex-start; gap:6px; padding:8px 12px; border-radius:var(--radius); background:#FFF8EB; border:1px solid #F5E6C8; margin-bottom:10px; font-size:14px; color:#A07000; line-height:1.6; } .dr-tip i { font-size:14px; flex-shrink:0; margin-top:2px; } .dr-actions { display:flex; gap:10px; justify-content:center; padding:16px 0; flex-wrap:wrap; margin-top:10px; } .form-textarea { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; line-height:1.8; color:var(--text); outline:none; resize:vertical; min-height:100px; font-family:inherit; } .form-textarea:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } /* designer report diff */ .dr-sec-badge { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:9999px; font-size:12px; font-weight:500; background:var(--secondary-50); color:var(--secondary-600); margin-left:auto; } .dr-added { background:#FEF3C7; padding:1px 2px; border-radius:3px; } .dr-original-block { margin-top:12px; padding:12px; border-radius:var(--radius); background:var(--gray-50); border-left:3px solid var(--gray-300); } .dr-original-label { font-size:12px; color:var(--text-secondary); margin-bottom:6px; display:flex; align-items:center; gap:4px; } .dr-original-block p { font-size:15px; color:var(--gray-500); line-height:1.8; margin:0; } .dr-edit-hint { font-size:13px; color:var(--text-secondary); margin-bottom:8px; display:flex; gap:12px; } /* toast */ .toast { position:fixed; top:16px; left:50%; transform:translateX(-50%); z-index:9999; background:#1F2937; color:#fff; padding:12px 24px; border-radius:var(--radius); font-size:16px; display:none; animation:fadeIn .2s ease-out; } /* ===== Designer Task View ===== */ #designerTaskView { display:none; } #designerTaskView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #designerTaskView .dr-inner { padding:16px; } } /* task list card */ .dt-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:0; cursor:pointer; overflow:hidden; margin-bottom:10px; transition:all .15s; box-shadow:var(--shadow-sm); } .dt-card:hover { box-shadow:0 2px 12px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } .dt-card-header { display:flex; align-items:center; gap:12px; padding:14px 16px 10px; } .dt-card-icon { width:40px; height:40px; border-radius:8px; background:var(--role-designer); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .dt-card-icon i { font-size:18px; color:#fff; } .dt-card-info { flex:1; min-width:0; } .dt-card-name { font-size:16px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dt-card-meta { display:flex; gap:12px; margin-top:3px; font-size:14px; color:var(--text-secondary); } .dt-card-footer { padding:0 16px 14px; display:flex; align-items:center; justify-content:space-between; } .dt-card-task-count { font-size:14px; color:var(--text-secondary); } .dt-card-task-count b { color:var(--role-designer); } /* task detail sections */ .dt-section { background:#fff; border-radius:var(--radius); padding:16px; border:1px solid var(--gray-200); margin-bottom:10px; } .dt-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .dt-section-title i { color:var(--role-designer); font-size:18px; } .dt-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .dt-info-label { width:120px; flex-shrink:0; color:var(--text-secondary); } .dt-info-value { flex:1; color:var(--text); } /* highlight designer row in team card */ .dt-designer-highlight { background:var(--role-designer-light); border-radius:4px; padding:2px 6px; margin:-2px -6px; } /* task table */ .dt-table-wrap { overflow-x:auto; } .dt-table { width:100%; border-collapse:collapse; font-size:16px; } .dt-table th { background:var(--gray-50); padding:12px 14px; text-align:left; font-weight:600; color:var(--text-secondary); border-bottom:2px solid var(--gray-200); white-space:nowrap; position:sticky; top:0; z-index:1; } .dt-table td { padding:12px 14px; border-bottom:1px solid var(--gray-100); vertical-align:top; } .dt-table tr:hover td { background:var(--gray-50); } /* ===== Generic Table (复用大队长 data-table 样式) ===== */ .table-wrap { overflow-x:auto; background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); box-shadow:0 1px 2px rgba(0,0,0,0.05); } .data-table { width:100%; border-collapse:collapse; } .data-table th,.data-table td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--gray-100); font-size:16px; } .data-table th { background:#F9FAFB; font-weight:500; color:var(--text-secondary); white-space:nowrap; font-size:16px; } .data-table td { color:var(--text); } .data-table tr:hover td { background:#F9FAFB; } .data-table tr:last-child td { border-bottom:none; } /* 表格卡片包裹器 — 给表格加白底圆角容器 */ .dt-card-table { background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); } .dt-card-table .dt-table { font-size:15px; } .dt-card-table .dt-table th { background:#FAFBFC; font-size:13px; letter-spacing:0.02em; } .dt-card-table .dt-table td { font-size:15px; } /* 未读行 */ .dt-table tr.row-unread td { background:#FEF5F5; } .dt-table tr.row-unread td:first-child { box-shadow:inset 3px 0 0 #EF4444; } /* 表格内辅助文字 */ .dt-table .cell-sub { font-size:13px; color:var(--text-secondary); display:block; margin-top:2px; } /* 表格内标签组 */ .dt-table .cell-tags { display:flex; flex-wrap:wrap; gap:4px; } /* 表格内省略文本 */ .dt-table .cell-ellipsis { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; } /* PM 售后信息提醒 — 分类标签按钮组 */ .pa-cat-tab { display:inline-flex; align-items:center; gap:6px; padding:8px 18px; border-radius:8px; border:1px solid var(--gray-200); background:#fff; color:var(--text-secondary); cursor:pointer; font-size:15px; font-weight:500; transition:all 150ms ease; white-space:nowrap; } .pa-cat-tab:hover { border-color:var(--role-pm); color:var(--role-pm); background:var(--role-pm-light); } .pa-cat-tab.active { background:var(--role-pm); color:#fff; border-color:var(--role-pm); font-weight:600; } .pa-cat-tab.active:hover { background:#2563EB; border-color:#2563EB; color:#fff; } .pa-cat-badge { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; border-radius:10px; background:#EF4444; color:#fff; font-size:12px; font-weight:700; padding:0 6px; } .pa-cat-tab.active .pa-cat-badge { background:#fff; color:#EF4444; } /* file upload area */ .dt-file-upload { display:inline-flex; align-items:center; gap:6px; } .dt-file-name { font-size:14px; color:var(--brand-600); max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dt-file-actions { display:flex; gap:4px; flex-wrap:wrap; align-items:center; } /* mini buttons */ .btn-mini { padding:2px 8px; font-size:14px; height:28px; border-radius:4px; border:1px solid var(--gray-300); background:#fff; cursor:pointer; display:inline-flex; align-items:center; gap:3px; transition:all 150ms; white-space:nowrap; } .btn-mini:hover { border-color:var(--brand-500); color:var(--brand-600); } .btn-mini-primary { background:var(--brand-500); color:#fff; border-color:var(--brand-500); } .btn-mini-primary:hover { background:var(--brand-600); color:#fff; } .btn-mini-warning { background:var(--warning); color:#92400E; border-color:var(--warning); } .btn-mini-warning:hover { background:#F59E0B; color:#fff; } .btn-mini-danger { background:#EF4444; color:#fff; border-color:#EF4444; } .btn-mini-danger:hover { background:#DC2626; } /* Designer task completion form */ #designerTaskView .dt-form-group { margin-bottom:16px; } #designerTaskView .dt-form-label { display:block; font-size:16px; font-weight:500; color:var(--text); margin-bottom:8px; } #designerTaskView .dt-form-textarea { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; line-height:1.8; color:var(--text); outline:none; resize:vertical; min-height:100px; font-family:inherit; } #designerTaskView .dt-form-textarea:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #designerTaskView .dt-form-input { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); outline:none; font-family:inherit; } #designerTaskView .dt-form-input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #designerTaskView .dt-upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } #designerTaskView .dt-upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } #designerTaskView .dt-upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } #designerTaskView .dt-upload-text { font-size:14px; color:var(--text-secondary); } #designerTaskView .dt-upload-preview { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; } #designerTaskView .dt-preview-item { display:flex; align-items:center; gap:6px; padding:6px 10px; background:var(--brand-50); border-radius:4px; font-size:14px; } #designerTaskView .dt-preview-item button { width:20px; height:20px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; } #designerTaskView .dt-preview-item button:hover { background:#EF4444; color:#fff; } /* PM task completion form */ #pmTaskView .pt-form-group { margin-bottom:16px; } #pmTaskView .pt-form-label { display:block; font-size:16px; font-weight:500; color:var(--text); margin-bottom:8px; } #pmTaskView .pt-form-textarea { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; line-height:1.8; color:var(--text); outline:none; resize:vertical; min-height:100px; font-family:inherit; } #pmTaskView .pt-form-textarea:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #pmTaskView .pt-form-input { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); outline:none; font-family:inherit; } #pmTaskView .pt-form-input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #pmTaskView .pt-upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } #pmTaskView .pt-upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } #pmTaskView .pt-upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } #pmTaskView .pt-upload-text { font-size:14px; color:var(--text-secondary); } #pmTaskView .pt-upload-preview { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; } #pmTaskView .pt-preview-item { display:flex; align-items:center; gap:6px; padding:6px 10px; background:var(--brand-50); border-radius:4px; font-size:14px; } #pmTaskView .pt-preview-item button { width:20px; height:20px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; } #pmTaskView .pt-preview-item button:hover { background:#EF4444; color:#fff; } /* status dot */ .dt-status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:4px; } .dt-status-dot.active { background:var(--brand-500); } .dt-status-dot.warning { background:var(--warning); } /* ===== Designer Review View (内部设计方案评审) ===== */ #designerReviewView { display:none; } #designerReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #designerReviewView .dr-inner { padding:16px; } } /* ===== Designer Negotiation View (现场洽商) ===== */ #designerNegotiationView { display:none; } #designerNegotiationView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #designerNegotiationView .dr-inner { padding:16px; } } .dn-list-card { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius); padding:14px 16px; margin-bottom:8px; cursor:pointer; transition:all .15s; display:flex; align-items:center; justify-content:space-between; } .dn-list-card:hover { box-shadow:0 2px 8px rgba(0,0,0,0.08); } .dn-list-card .dn-list-info { flex:1; min-width:0; } .dn-list-card .dn-list-title { font-size:18px; font-weight:500; color:var(--text); margin-bottom:4px; } .dn-list-card .dn-list-desc { font-size:16px; color:var(--text-secondary); margin-bottom:4px; } .dn-list-card .dn-list-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:16px; } .dn-empty { text-align:center; padding:64px 20px; } .dn-empty i { font-size:56px; color:var(--gray-300); display:block; margin-bottom:16px; } .dn-empty .dn-empty-text { font-size:16px; color:var(--text-secondary); } .dn-section { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius); padding:16px; margin-bottom:12px; } .dn-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .dn-section-title i { color:var(--role-designer); font-size:18px; } .dn-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .dn-info-row .dn-info-label { color:var(--text-secondary); min-width:120px; flex-shrink:0; } .dn-info-row .dn-info-value { color:var(--text); word-break:break-word; } .dn-upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } .dn-upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } .dn-upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } .dn-upload-text { font-size:14px; color:var(--text-secondary); } .dn-upload-preview { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; } .dn-preview-item { display:flex; align-items:center; gap:6px; padding:6px 10px; background:var(--brand-50); border-radius:4px; font-size:14px; } .dn-preview-item button { width:20px; height:20px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; } .dn-preview-item button:hover { background:#EF4444; color:#fff; } .dn-form-group { margin-bottom:16px; } .dn-form-label { display:block; font-size:16px; font-weight:500; color:var(--text); margin-bottom:8px; } .dn-plan-block { font-size:16px; line-height:1.8; color:var(--text); background:var(--brand-50); border-radius:var(--radius); padding:12px; border-left:3px solid var(--brand-500); } .review-filter-bar { display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; } .review-filter-bar .form-select { padding:6px 12px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); background:#fff; outline:none; min-width:200px; } .review-filter-bar .form-select:focus { border-color:var(--brand-500); } .rv-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:0; cursor:pointer; overflow:hidden; margin-bottom:10px; transition:all .15s; box-shadow:var(--shadow-sm); } .rv-card:hover { box-shadow:0 2px 12px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } .rv-card-header { display:flex; align-items:center; gap:12px; padding:14px 16px 10px; } .rv-card-icon { width:40px; height:40px; border-radius:8px; background:var(--role-designer); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .rv-card-icon i { font-size:18px; color:#fff; } .rv-card-info { flex:1; min-width:0; } .rv-card-name { font-size:16px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .rv-card-meta { display:flex; gap:12px; margin-top:3px; font-size:14px; color:var(--text-secondary); } .rv-form-group { margin-bottom:14px; } .rv-form-label { display:block; font-size:14px; font-weight:500; color:var(--text-secondary); margin-bottom:4px; } .rv-form-label .required { color:#EF4444; margin-right:2px; } .form-input { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); outline:none; font-family:inherit; } .form-input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } .form-select { padding:8px 12px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); background:#fff; outline:none; } .form-select:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } .form-input-number { width:100px; padding:8px 12px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); outline:none; text-align:center; } /* -- Multi-select dropdown for participants -- */ .rv-multi-select { position:relative; } .rv-multi-select-trigger { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; transition:border-color .15s; } .rv-multi-select-trigger:hover { border-color:var(--brand-500); } .rv-multi-select-trigger .placeholder { color:var(--text-hint); } .rv-multi-select-trigger .arrow { font-size:14px; color:var(--text-hint); transition:transform .15s; } .rv-multi-select.open .rv-multi-select-trigger { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } .rv-multi-select.open .rv-multi-select-trigger .arrow { transform:rotate(180deg); } .rv-multi-select-dropdown { position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid var(--gray-300); border-radius:var(--radius); box-shadow:var(--shadow-md); z-index:100; max-height:220px; overflow-y:auto; display:none; margin-top:2px; } .rv-multi-select.open .rv-multi-select-dropdown { display:block; } .rv-multi-select-item { display:flex; align-items:center; gap:8px; padding:10px 14px; cursor:pointer; font-size:16px; transition:background .1s; } .rv-multi-select-item:hover { background:var(--brand-50); } .rv-multi-select-item input[type=checkbox] { width:16px; height:16px; accent-color:var(--brand-500); cursor:pointer; } .rv-multi-select-item label { cursor:pointer; flex:1; } /* -- end multi-select -- */ .rv-upload-zone { border:2px dashed var(--gray-300); border-radius:var(--radius); padding:24px; text-align:center; cursor:pointer; transition:all .15s; background:var(--gray-50); } .rv-upload-zone:hover { border-color:var(--brand-500); background:var(--brand-50); } .rv-upload-zone i { font-size:32px; color:var(--gray-400); display:block; margin-bottom:8px; } .rv-upload-zone .upload-text { font-size:14px; color:var(--text-secondary); } .rv-file-list { margin-top:12px; } .rv-file-item { display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--gray-50); border-radius:var(--radius); margin-bottom:6px; font-size:14px; } .rv-file-item .file-name { flex:1; color:var(--brand-600); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .rv-file-item .file-size { color:var(--text-secondary); font-size:13px; } .rv-file-item .file-remove { width:24px; height:24px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; } .rv-file-item .file-remove:hover { background:#EF4444; color:#fff; } .tag-primary { background:var(--secondary-50); color:var(--secondary-600); } .tag-danger { background:#FEF0F0; color:#DC2626; } .rv-empty { text-align:center; padding:64px 20px; } .rv-empty i { font-size:56px; color:var(--gray-300); display:block; margin-bottom:16px; } .rv-empty .empty-title { font-size:16px; color:var(--text-secondary); } .rv-empty .empty-desc { color:var(--text-secondary); font-size:14px; margin-top:4px; } .rv-section { background:#fff; border-radius:var(--radius); padding:16px; border:1px solid var(--gray-200); margin-bottom:10px; } .rv-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .rv-section-title i { color:var(--role-designer); font-size:18px; } .rv-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .rv-info-label { width:120px; flex-shrink:0; color:var(--text-secondary); } .rv-info-value { flex:1; color:var(--text); } .rv-past-toggle, .pmr-past-toggle { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; cursor:pointer; transition:background .15s; } .rv-past-toggle:hover, .pmr-past-toggle:hover { background:var(--gray-50); } .rv-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media (max-width:768px) { .rv-form-grid { grid-template-columns:1fr; } } /* ===== PM Task View (项目经理跟进立项) ===== */ #pmTaskView { display:none; } #pmTaskView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmTaskView .dr-inner { padding:16px; } } .pt-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:0; cursor:pointer; overflow:hidden; margin-bottom:10px; transition:all .15s; box-shadow:var(--shadow-sm); } .pt-card:hover { box-shadow:0 2px 12px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } .pt-card-header { display:flex; align-items:center; gap:12px; padding:14px 16px 10px; } .pt-card-icon { width:40px; height:40px; border-radius:8px; background:var(--role-pm); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .pt-card-icon i { font-size:18px; color:#fff; } .pt-card-info { flex:1; min-width:0; } .pt-card-name { font-size:16px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pt-card-meta { display:flex; gap:12px; margin-top:3px; font-size:14px; color:var(--text-secondary); } .pt-card-footer { padding:0 16px 14px; display:flex; align-items:center; justify-content:space-between; } .pt-card-task-count { font-size:14px; color:var(--text-secondary); } .pt-card-task-count b { color:var(--role-pm); } .pt-section { background:#fff; border-radius:var(--radius); padding:16px; border:1px solid var(--gray-200); margin-bottom:10px; } .pt-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .pt-section-title i { color:var(--role-pm); font-size:18px; } .pt-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .pt-info-label { width:120px; flex-shrink:0; color:var(--text-secondary); } .pt-info-value { flex:1; color:var(--text); } .pt-pm-highlight { background:var(--role-pm-light); border-radius:4px; padding:2px 6px; margin:-2px -6px; } /* ===== PM Tech Review View (内部技术方案评审) ===== */ #pmReviewView { display:none; } #pmReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmReviewView .dr-inner { padding:16px; } } .pmr-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:0; cursor:pointer; overflow:hidden; margin-bottom:10px; transition:all .15s; box-shadow:var(--shadow-sm); } .pmr-card:hover { box-shadow:0 2px 12px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } .pmr-card-header { display:flex; align-items:center; gap:12px; padding:14px 16px 10px; } .pmr-card-icon { width:40px; height:40px; border-radius:8px; background:var(--role-pm); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .pmr-card-icon i { font-size:18px; color:#fff; } .pmr-card-info { flex:1; min-width:0; } .pmr-card-name { font-size:16px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pmr-card-meta { display:flex; gap:12px; margin-top:3px; font-size:14px; color:var(--text-secondary); } .pmr-section { background:#fff; border-radius:var(--radius); padding:16px; border:1px solid var(--gray-200); margin-bottom:10px; } .pmr-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .pmr-section-title i { color:var(--role-pm); font-size:18px; } .pmr-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .pmr-info-label { width:120px; flex-shrink:0; color:var(--text-secondary); } .pmr-info-value { flex:1; color:var(--text); } /* === PMR Score Card — 评分结果 === */ .pmr-score-block { padding:12px 0; } .pmr-score-block + .pmr-score-block { border-top:1px solid var(--gray-100); } .pmr-score-reviewer { font-size:16px; font-weight:600; color:var(--text); margin-bottom:8px; display:flex; align-items:center; gap:6px; } .pmr-score-reviewer::before { content:''; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--role-pm); flex-shrink:0; } .pmr-score-overall { font-size:16px; color:var(--text-light); padding-left:18px; margin-bottom:6px; display:flex; align-items:center; gap:8px; } .pmr-score-overall strong { color:var(--brand-600); font-size:18px; } .pmr-score-parts-label { font-size:14px; color:var(--text-hint); padding-left:18px; margin-bottom:4px; } .pmr-score-parts { padding-left:36px; margin-bottom:6px; } .pmr-score-part-row { display:flex; align-items:center; padding:3px 0; font-size:15px; color:var(--text-light); } .pmr-score-part-name { flex:1; } .pmr-score-part-score { font-weight:600; color:var(--brand-600); min-width:60px; text-align:right; } .pmr-score-reason { margin:4px 0 0 18px; padding:8px 12px; background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--radius); font-size:14px; display:flex; gap:6px; } .pmr-score-reason .reason-label { color:var(--text-secondary); font-weight:500; flex-shrink:0; } .pmr-score-reason .reason-text { color:var(--text-light); } .pmr-score-reason .reason-empty { color:var(--text-hint); } .pmr-score-divider { border:none; border-top:1px solid var(--gray-200); margin:12px 0; } .pmr-score-avg-title { font-size:15px; font-weight:600; color:var(--text); margin-bottom:6px; display:flex; align-items:center; gap:6px; } .pmr-score-avg-title i { color:var(--role-pm); font-size:16px; } .pmr-score-avg-parts { margin-bottom:8px; } .pmr-score-avg-total { display:flex; align-items:center; padding-top:10px; border-top:1px solid var(--gray-200); font-size:16px; } .pmr-score-avg-total .avg-label { font-weight:600; color:var(--text); } .pmr-score-avg-total .avg-value { font-size:20px; font-weight:700; color:var(--brand-600); margin-left:8px; } .pmr-score-avg-total .avg-unit { font-size:14px; color:var(--text-secondary); font-weight:400; margin-left:4px; } .pmr-filter-bar { display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; } .pmr-filter-bar .form-select { padding:6px 12px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:16px; color:var(--text); background:#fff; outline:none; min-width:200px; } .pmr-filter-bar .form-select:focus { border-color:var(--brand-500); } .pmr-empty { text-align:center; padding:64px 20px; } .pmr-empty i { font-size:56px; color:var(--gray-300); display:block; margin-bottom:16px; } .pmr-empty .empty-title { font-size:16px; color:var(--text-secondary); } .pmr-empty .empty-desc { color:var(--text-secondary); font-size:14px; margin-top:4px; } .pmr-form-group { margin-bottom:14px; } .pmr-form-label { display:block; font-size:14px; font-weight:500; color:var(--text-secondary); margin-bottom:4px; } .pmr-form-label .required { color:#EF4444; margin-right:2px; } .pmr-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media (max-width:768px) { .pmr-form-grid { grid-template-columns:1fr; } } .pmrec-form-group { margin-bottom:14px; } .pmrec-form-label { display:block; font-size:14px; font-weight:500; color:var(--text-secondary); margin-bottom:4px; } .pmrec-form-label .required { color:#EF4444; margin-right:2px; } .pmr-upload-zone { border:2px dashed var(--gray-300); border-radius:var(--radius); padding:24px; text-align:center; cursor:pointer; transition:all .15s; background:var(--gray-50); } .pmr-upload-zone:hover { border-color:var(--brand-500); background:var(--brand-50); } .pmr-upload-zone i { font-size:32px; color:var(--gray-400); display:block; margin-bottom:8px; } .pmr-upload-zone .upload-text { font-size:14px; color:var(--text-secondary); } .pmr-file-list { margin-top:12px; } .pmr-file-item { display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--gray-50); border-radius:var(--radius); margin-bottom:6px; font-size:14px; } .pmr-file-item .file-name { flex:1; color:var(--brand-600); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pmr-file-item .file-size { color:var(--text-secondary); font-size:13px; } .pmr-file-item .file-remove { width:24px; height:24px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; } .pmr-file-item .file-remove:hover { background:#EF4444; color:#fff; } /* ===== EC Tech Review View (工程中心-内部技术方案审核：技术方案审核与评分) — 复用 pmr 样式，仅工程中心色调点缀 ===== */ #ecReviewView { display:none; } #ecReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecReviewView .dr-inner { padding:16px; } } #ecReviewView .pmr-card-icon { background:var(--role-engineering); } #ecReviewView .ecr-score-row { display:flex; flex-wrap:wrap; gap:8px; } #ecReviewView .ecr-score-num { width:42px; height:42px; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); font-size:16px; font-weight:600; cursor:pointer; transition:all 150ms; display:flex; align-items:center; justify-content:center; padding:0; } #ecReviewView .ecr-score-num:hover { border-color:var(--role-engineering); color:var(--role-engineering); background:var(--role-engineering-light); } #ecReviewView .ecr-score-num.selected { background:var(--role-engineering); border-color:var(--role-engineering); color:#fff; box-shadow:0 2px 8px rgba(14,165,233,0.3); } /* ===== EC Repair View (工程中心-维修过程记录：维修记录查看与追溯) — 复用 pr-photo 网格样式 ===== */ #ecRepairView { display:none; } #ecRepairView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecRepairView .dr-inner { padding:16px; } } #ecRepairView .pr-photo-grid { grid-template-columns:repeat(4,1fr); max-width:540px; } #ecRepairView .pr-photo-placeholder { aspect-ratio:auto; height:80px; } @media (max-width:768px) { #ecRepairView .pr-photo-grid { grid-template-columns:repeat(2,1fr); } } /* ===== PM Repair Record View (生产经理-维修过程记录：维修工单处理/填写维修过程记录) — 表单类独有，生产经理橙色点缀 ===== */ #pmRepairRecView { display:none; } #pmRepairRecView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmRepairRecView .dr-inner { padding:16px; } } #pmRepairRecView .pt-section-title i { color:var(--role-production); } #pmRepairRecView .form-group { margin-bottom:16px; } #pmRepairRecView .form-label { display:block; font-size:16px; font-weight:500; color:var(--text); margin-bottom:8px; } #pmRepairRecView .required { color:#DC2626; margin-right:2px; } #pmRepairRecView .radio-group { display:flex; gap:8px; flex-wrap:wrap; } #pmRepairRecView .radio-item { flex:1; min-width:120px; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); background:#fff; color:var(--text-light); font-size:16px; cursor:pointer; text-align:center; transition:all 150ms; } #pmRepairRecView .radio-item:hover { border-color:var(--role-production); color:var(--role-production); background:var(--role-production-light); } #pmRepairRecView .radio-item.selected { background:var(--brand-500); border-color:var(--brand-500); color:#fff; } #pmRepairRecView .upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } #pmRepairRecView .upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } #pmRepairRecView .upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } #pmRepairRecView .upload-text { font-size:14px; color:var(--text-secondary); } #pmRepairRecView .upload-preview { display:flex; flex-wrap:wrap; gap:8px; } #pmRepairRecView .dynamic-list { display:flex; flex-direction:column; gap:8px; } #pmRepairRecView .dl-item { display:flex; gap:6px; align-items:center; flex-wrap:wrap; } #pmRepairRecView .dl-item input { padding:8px 10px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:15px; color:var(--text); outline:none; font-family:inherit; } #pmRepairRecView .dl-item input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #pmRepairRecView .dl-remove { width:34px; height:34px; flex-shrink:0; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:16px; } #pmRepairRecView .dl-remove:hover { border-color:#DC2626; color:#DC2626; } #pmRepairRecView .dl-add { margin-top:8px; padding:10px; border:1px dashed var(--gray-300); border-radius:var(--radius); text-align:center; color:var(--brand-500); cursor:pointer; font-size:15px; } #pmRepairRecView .dl-add:hover { border-color:var(--brand-500); background:var(--brand-50); } /* 待审批状态标签（生产经理橙色调） */ .tag-approval { background:#FFF7ED; color:#C2410C; border:1px solid #FDBA74; } /* ===== EC Fee Review View (工程中心-维修费用确认：维修费用内部审核) — 复用 pmr 样式，工程中心色调点缀 ===== */ #ecFeeReviewView { display:none; } #ecFeeReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecFeeReviewView .dr-inner { padding:16px; } } #ecFeeReviewView .pmr-card-icon { background:var(--role-engineering); } #ecFeeReviewView .ecf-approval-row { display:flex; flex-wrap:wrap; gap:10px; } #ecFeeReviewView .ecf-approval-btn { display:inline-flex; align-items:center; gap:6px; min-width:112px; justify-content:center; padding:10px 18px; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); font-size:14px; font-weight:500; cursor:pointer; transition:all 150ms; } #ecFeeReviewView .ecf-approval-btn:hover { border-color:var(--role-engineering); color:var(--role-engineering); background:var(--role-engineering-light); } #ecFeeReviewView .ecf-approval-btn.selected-pass { background:var(--brand-500); border-color:var(--brand-500); color:#fff; } #ecFeeReviewView .ecf-approval-btn.selected-reject { background:#DC2626; border-color:#DC2626; color:#fff; } #ecFeeReviewView .ecf-flow { display:flex; align-items:center; overflow-x:auto; padding:10px 0; gap:4px; } #ecFeeReviewView .ecf-flow-node { text-align:center; min-width:76px; } #ecFeeReviewView .ecf-flow-circle { width:30px; height:30px; border-radius:50%; margin:0 auto 4px; display:flex; align-items:center; justify-content:center; font-size:16px; color:#fff; } #ecFeeReviewView .ecf-flow-arrow { flex-shrink:0; color:var(--text-secondary); } #ecFeeReviewView .upload-area { border:2px dashed var(--gray-300); border-radius:var(--radius); padding:24px; text-align:center; cursor:pointer; transition:border-color .15s; background:#FAFAFA; } #ecFeeReviewView .upload-area:hover { border-color:var(--brand-500); } #ecFeeReviewView .upload-area .upload-icon { font-size:24px; margin-bottom:6px; color:var(--text-secondary); } #ecFeeReviewView .upload-area .upload-text { font-size:16px; color:var(--text-secondary); } #ecFeeReviewView .data-table { width:100%; border-collapse:collapse; } #ecFeeReviewView .data-table th, #ecFeeReviewView .data-table td { padding:10px 14px; text-align:left; border-bottom:1px solid var(--gray-100); font-size:16px; } #ecFeeReviewView .data-table th { background:#F9FAFB; font-weight:500; color:var(--text-secondary); white-space:nowrap; } #ecFeeReviewView .data-table td { color:var(--text); } #ecFeeReviewView .data-table tr:last-child td { border-bottom:none; } /* EC Fee Review — card-based list styles (参考售后专员 fee-confirm-list) */ #ecFeeReviewView .ecf-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); padding:18px 20px; margin-bottom:10px; cursor:pointer; transition:all .2s; box-shadow:0 1px 2px rgba(0,0,0,0.04); } #ecFeeReviewView .ecf-card:hover { box-shadow:0 4px 16px rgba(0,0,0,0.08); transform:translateY(-1px); border-color:var(--brand-500); } #ecFeeReviewView .ecf-card.pending { border-left:3px solid #F59E0B; } #ecFeeReviewView .ecf-card.approved { border-left:3px solid var(--brand-500); } #ecFeeReviewView .ecf-card.rejected { border-left:3px solid #DC2626; } #ecFeeReviewView .ecf-stat-card { background:#fff; border-radius:var(--radius); padding:14px 18px; border:1px solid var(--gray-200); flex:1; min-width:140px; } #ecFeeReviewView .ecf-stat-label { font-size:14px; color:var(--text-secondary); } #ecFeeReviewView .ecf-stat-num { font-size:28px; font-weight:600; margin-top:2px; } #ecFeeReviewView .ecf-empty { text-align:center; padding:64px 20px; } #ecFeeReviewView .ecf-empty i { font-size:48px; color:var(--gray-300); display:block; margin-bottom:12px; } #ecFeeReviewView .ecf-empty-title { font-size:16px; color:var(--text-secondary); } #ecFeeReviewView .ecf-empty-desc { color:var(--text-secondary); font-size:14px; margin-top:4px; } /* ===== EC Callback View (工程中心-维修回访（电话）：维修回访记录查看) — 复用 pmr 样式，工程中心色调点缀 ===== */ #ecCallbackView { display:none; } #ecCallbackView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecCallbackView .dr-inner { padding:16px; } } #ecCallbackView .pmr-card-icon { background:var(--role-engineering); } /* ===== EC AfterSale View (工程中心-售后信息提醒：合并售后工单异常监控+维修工单处理+售后回访+售后评分+不满意二次整改) ===== */ #ecAfterSaleView { display:none; } #ecAfterSaleView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecAfterSaleView .dr-inner { padding:16px; } } /* ===== Cost Review View (成本中心-内部报价评审：报价评审) — 复用 pmr 样式，成本中心色调点缀 ===== */ #costReviewView { display:none; } #costReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #costReviewView .dr-inner { padding:16px; } } #costReviewView .pmr-card-icon { background:var(--role-cost); } #costReviewView .ccr-approval-row { display:flex; flex-wrap:wrap; gap:10px; } #costReviewView .ccr-approval-btn { display:inline-flex; align-items:center; gap:6px; min-width:112px; justify-content:center; padding:10px 18px; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); font-size:14px; font-weight:500; cursor:pointer; transition:all 150ms; } #costReviewView .ccr-approval-btn:hover { border-color:var(--role-cost); color:var(--role-cost); background:var(--role-cost-light); } #costReviewView .ccr-approval-btn.selected-pass { background:var(--brand-500); border-color:var(--brand-500); color:#fff; } #costReviewView .ccr-approval-btn.selected-reject { background:#DC2626; border-color:#DC2626; color:#fff; } #costReviewView .ccr-score-row { display:flex; flex-wrap:wrap; gap:8px; } #costReviewView .ccr-score-num { width:42px; height:42px; border-radius:var(--radius); border:1px solid var(--gray-300); background:#fff; color:var(--text-light); font-size:16px; font-weight:600; cursor:pointer; transition:all 150ms; display:flex; align-items:center; justify-content:center; padding:0; } #costReviewView .ccr-score-num:hover { border-color:var(--role-cost); color:var(--role-cost); background:var(--role-cost-light); } #costReviewView .ccr-score-num.selected { background:var(--role-cost); border-color:var(--role-cost); color:#fff; box-shadow:0 2px 8px rgba(20,184,166,0.3); } #costReviewView .ccr-flow { display:flex; align-items:center; overflow-x:auto; padding:10px 0; gap:4px; } #costReviewView .ccr-flow-node { text-align:center; min-width:76px; } #costReviewView .ccr-flow-circle { width:30px; height:30px; border-radius:50%; margin:0 auto 4px; display:flex; align-items:center; justify-content:center; font-size:16px; color:#fff; } #costReviewView .ccr-flow-arrow { flex-shrink:0; color:var(--text-secondary); } /* ===== Cost Review dedicated modal（不改动通用 #modalOverlay） ===== */ #ccrModalOverlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:none; align-items:center; justify-content:center; z-index:1000; padding:16px; } #ccrModalOverlay .ccr-modal-dialog { background:#fff; border-radius:12px; max-width:460px; width:100%; padding:20px 24px; box-shadow:0 12px 40px rgba(0,0,0,0.2); } #ccrModalOverlay .ccr-modal-title { font-size:18px; font-weight:600; margin-bottom:12px; } #ccrModalOverlay .ccr-modal-body { font-size:14px; color:var(--text); } #ccrModalOverlay .ccr-modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; } #ccrModalOverlay .info-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid var(--gray-100); } #ccrModalOverlay .info-label { font-size:14px; color:var(--text-secondary); } #ccrModalOverlay .info-value { font-size:14px; font-weight:500; } /* ===== Legal Contract View (法务-合同审核-盖章：合同法律审核) — 复用 pmr 样式，法务紫色点缀 ===== */ /* 数据来源：business-specialist.html「工作台-结果管理-合同审核-盖章」(mockSealRecords / showSealDetail)，字段一致、内容可替换 */ /* 完整审批流程：发起人 → 法务 → 大队长 → 经营中心 → 盖章管理员；法务核对调整风险点提醒内容后点击「发送审核建议」流转至大队长 */ #legalContractView { display:none; } #legalContractView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #legalContractView .dr-inner { padding:16px; } } #legalContractView .pmr-card-icon { background:var(--role-legal); } #legalContractView .pmr-section-title i { color:var(--role-legal); } /* ===== Seal Contract Review View (盖章管理员-合同审核-盖章：合同审批-盖章) — 复用 pmr 样式，盖章管理员粉色点缀 ===== */ /* 数据来源：management-center.html「审批台-合同审批-盖章」中"合同审批-盖章"项目（SP202604003，非初稿），字段一致、内容可替换 */ /* 完整审批流程：项目总监（发起） → 法务 → 大队长 → 经营中心 → 盖章管理员；流转至盖章管理员时前序节点均已审批通过，盖章管理员点击「确认已盖章」 */ #sealContractReviewView { display:none; } #sealContractReviewView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #sealContractReviewView .dr-inner { padding:16px; } } #sealContractReviewView .pmr-card-icon { background:var(--role-seal); } #sealContractReviewView .pmr-section-title i { color:var(--role-seal); } /* Finance views (财务：费用报销 / 保证金汇款) — 默认隐藏，与其它视图一致 */ /* 注：#financeExpenseView 此前缺失 display:none，初始加载会留空盒，此处一并补齐（不影响进入视图后的展示） */ #financeExpenseView { display:none; } #financeDepositView { display:none; } #financeDepositView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeDepositView .dr-inner { padding:16px; } } /* Finance Lead Fee（财务-客户线索信息费确认：信息费操作）— 默认隐藏，与其它视图一致 */ #financeLeadFeeView { display:none; } #financeLeadFeeView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeLeadFeeView .dr-inner { padding:16px; } } /* Finance Repair Fee（财务-维修费用确认：维修回款与结算）— 默认隐藏，与其它视图一致 */ #financeRepairFeeView { display:none; } #financeRepairFeeView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeRepairFeeView .dr-inner { padding:16px; } } /* 补齐：售后工单异常协调 / 售后服务评分 / 工单接收 / 标书盖章 / 模板合同 — 默认隐藏 + dr-inner 内容层宽度 */ #pmCoordView { display:none; } #pmCoordView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmCoordView .dr-inner { padding:16px; } } #pmScoreView { display:none; } #pmScoreView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmScoreView .dr-inner { padding:16px; } } #pmAfterSaleView { display:none; } #pmAfterSaleView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmAfterSaleView .dr-inner { padding:16px; } } /* ===== PM Negotiation View (现场洽商) ===== */ #pmNegotiationView { display:none; } #pmNegotiationView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmNegotiationView .dr-inner { padding:16px; } } .pn-list-card { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius); padding:14px 16px; margin-bottom:8px; cursor:pointer; transition:all .15s; display:flex; align-items:center; justify-content:space-between; } .pn-list-card:hover { box-shadow:0 2px 8px rgba(0,0,0,0.08); } .pn-list-card .pn-list-info { flex:1; min-width:0; } .pn-list-card .pn-list-title { font-size:18px; font-weight:500; color:var(--text); margin-bottom:4px; } .pn-list-card .pn-list-desc { font-size:16px; color:var(--text-secondary); margin-bottom:4px; } .pn-list-card .pn-list-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:16px; } .pn-empty { text-align:center; padding:64px 20px; } .pn-empty i { font-size:56px; color:var(--gray-300); display:block; margin-bottom:16px; } .pn-empty .pn-empty-text { font-size:16px; color:var(--text-secondary); } .pn-section { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius); padding:16px; margin-bottom:12px; } .pn-section-title { font-size:16px; font-weight:600; color:var(--text); margin-bottom:12px; display:flex; align-items:center; gap:8px; } .pn-section-title i { color:var(--role-pm); font-size:18px; } .pn-info-row { display:flex; padding:6px 0; font-size:16px; line-height:24px; } .pn-info-row .pn-info-label { color:var(--text-secondary); min-width:120px; flex-shrink:0; } .pn-info-row .pn-info-value { color:var(--text); word-break:break-word; } .pn-upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } .pn-upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } .pn-upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } .pn-upload-text { font-size:14px; color:var(--text-secondary); } .pn-upload-preview { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; } .pn-preview-item { display:flex; align-items:center; gap:6px; padding:6px 10px; background:var(--brand-50); border-radius:4px; font-size:14px; } .pn-preview-item button { width:20px; height:20px; border:none; background:#FEF0F0; color:#EF4444; border-radius:4px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; } .pn-preview-item button:hover { background:#EF4444; color:#fff; } .pn-form-group { margin-bottom:16px; } .pn-form-label { display:block; font-size:16px; font-weight:500; color:var(--text); margin-bottom:8px; } .pn-plan-block { font-size:16px; line-height:1.8; color:var(--text); background:var(--brand-50); border-radius:var(--radius); padding:12px; border-left:3px solid var(--brand-500); } #pmReceiveView { display:none; } #pmReceiveView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmReceiveView .dr-inner { padding:16px; } } /* PM Warranty Notice（生产经理-质保金扣除提醒） */ #pmWarrantyNoticeView { display:none; } #pmWarrantyNoticeView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmWarrantyNoticeView .dr-inner { padding:16px; } } /* PM Fee Confirm（生产经理-维修费用确认） */ #pmFeeConfirmView { display:none; } #pmFeeConfirmView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmFeeConfirmView .dr-inner { padding:16px; } } #pmFeeConfirmView .tab-group { display:flex; gap:0; border-bottom:2px solid var(--gray-200); } #pmFeeConfirmView .tab-item { flex:1; text-align:center; padding:10px 12px; font-size:14px; color:var(--text-secondary); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:all .15s; display:flex; align-items:center; justify-content:center; gap:4px; } #pmFeeConfirmView .tab-item:hover { color:var(--text); background:var(--gray-50); } #pmFeeConfirmView .tab-item.active { color:var(--brand-500); border-bottom-color:var(--brand-500); font-weight:500; } #pmFeeConfirmView .tab-item i { font-size:14px; } #pmFeeConfirmView .radio-group { display:flex; gap:8px; flex-wrap:wrap; } #pmFeeConfirmView .radio-item { flex:1; min-width:120px; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); background:#fff; color:var(--text-light); font-size:14px; cursor:pointer; text-align:center; transition:all 150ms; } #pmFeeConfirmView .radio-item:hover { border-color:var(--brand-500); color:var(--brand-500); background:var(--brand-50); } #pmFeeConfirmView .radio-item.selected { background:var(--brand-500); border-color:var(--brand-600); color:#fff; } #pmFeeConfirmView .upload-area { border:1px dashed var(--gray-300); border-radius:var(--radius); padding:16px; text-align:center; cursor:pointer; background:var(--gray-50); transition:all 150ms; } #pmFeeConfirmView .upload-area:hover { border-color:var(--brand-500); background:var(--brand-50); } #pmFeeConfirmView .upload-icon { font-size:28px; color:var(--gray-400); margin-bottom:6px; } #pmFeeConfirmView .upload-text { font-size:14px; color:var(--text-secondary); } #pmFeeConfirmView .form-group { margin-bottom:16px; } #pmFeeConfirmView .form-label { display:block; font-size:14px; font-weight:500; color:var(--text); margin-bottom:8px; } #pmFeeConfirmView .required { color:#DC2626; margin-right:2px; } #pmFeeConfirmView .form-textarea { width:100%; padding:8px 12px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:14px; line-height:1.6; color:var(--text); outline:none; resize:vertical; min-height:80px; font-family:inherit; } #pmFeeConfirmView .form-textarea:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #pmFeeConfirmView .form-input { width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:14px; color:var(--text); outline:none; font-family:inherit; } #pmFeeConfirmView .form-input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(76,175,80,0.1); } #pmFeeConfirmView .form-bottom-bar { display:flex; gap:10px; padding:12px 0; position:sticky; bottom:0; background:var(--bg); } /* ===== PM Receive dedicated modal ===== */ #pmrecModalOverlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:none; align-items:center; justify-content:center; z-index:1000; padding:16px; } #pmrecModalOverlay .pmrec-modal-dialog { background:#fff; border-radius:12px; max-width:480px; width:100%; padding:20px 24px; box-shadow:0 12px 40px rgba(0,0,0,0.2); } #pmrecModalOverlay .pmrec-modal-title { font-size:18px; font-weight:600; margin-bottom:12px; } #pmrecModalOverlay .pmrec-modal-body { font-size:14px; color:var(--text); } #pmrecModalOverlay .pmrec-modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; } #pmrecModalOverlay .pmrec-staff-tag { display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:var(--brand-50);color:var(--brand-600);border-radius:20px;font-size:16px; } #pmrecModalOverlay .form-group { margin-bottom:12px; } #pmrecModalOverlay .form-label { display:block; font-size:14px; font-weight:500; color:var(--text); margin-bottom:4px; } #pmrecModalOverlay .form-label .required { color:#DC2626; margin-right:2px; } #pmrecModalOverlay .form-input, #pmrecModalOverlay .form-textarea { width:100%; padding:8px 12px; border:1px solid var(--border-light); border-radius:6px; font-size:14px; box-sizing:border-box; } #sealBidView { display:none; } #sealBidView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #sealBidView .dr-inner { padding:16px; } } /* Accordion styles */ .sb-accordion { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); margin-bottom:10px; overflow:hidden; } .sb-accordion-header { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; cursor:pointer; user-select:none; transition:background 0.15s; } .sb-accordion-header:hover { background:var(--gray-50); } .sb-accordion-header .sb-accordion-title { font-size:14px; font-weight:600; color:var(--text); display:flex; align-items:center; gap:8px; } .sb-accordion-header .sb-accordion-summary { font-size:12px; color:var(--text-secondary); font-weight:400; margin-left:4px; } .sb-accordion-header .sb-accordion-arrow { font-size:18px; color:var(--text-light); transition:transform 0.2s; } .sb-accordion.open .sb-accordion-header .sb-accordion-arrow { transform:rotate(180deg); } .sb-accordion-body { display:none; padding:0 16px 14px; border-top:1px solid var(--gray-100); } .sb-accordion.open .sb-accordion-body { display:block; } .sb-core-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); margin-bottom:10px; overflow:hidden; } .sb-core-card .sb-applicant-row { display:flex; align-items:center; gap:12px; padding:16px; background:linear-gradient(135deg,var(--role-seal-light),#FDF2F8); border-bottom:1px solid #FBCFE8; } .sb-core-card .sb-applicant-avatar { width:44px;height:44px;border-radius:50%;background:var(--role-seal);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0; } .sb-core-card .sb-applicant-name { font-size:16px;font-weight:600;color:var(--text); } .sb-core-card .sb-applicant-team { display:inline-flex;align-items:center;gap:4px;padding:3px 10px;background:var(--role-seal);color:#fff;border-radius:999px;font-size:12px;font-weight:500;margin-left:8px; } .sb-core-card .sb-info-grid { display:grid;grid-template-columns:1fr 1fr;gap:0; } .sb-core-card .sb-info-item { display:flex;padding:12px 16px;border-bottom:1px solid var(--gray-100); } .sb-core-card .sb-info-item:last-child { border-bottom:none; } .sb-core-card .sb-info-item.full-width { grid-column:1/-1; } .sb-core-card .sb-info-label { font-size:13px;color:var(--text-secondary);min-width:80px;flex-shrink:0; } .sb-core-card .sb-info-value { font-size:14px;color:var(--text);font-weight:500; } .sb-core-card .sb-seal-files { display:flex;flex-direction:column;gap:4px; } .sb-core-card .sb-seal-file-row { display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text);padding:4px 10px;background:var(--gray-50);border-radius:6px; } .sb-core-card .sb-approval-status { display:flex;gap:16px;flex-wrap:wrap; } .sb-core-card .sb-approval-status .sb-approval-item { display:inline-flex;align-items:center;gap:4px;font-size:13px;color:#15803D; } .sb-core-card .sb-approval-status .sb-approval-item i { font-size:16px; } @media (max-width:768px) { .sb-core-card .sb-info-grid { grid-template-columns:1fr; } } /* 折叠面板（accordion）—— 盖章管理员标书盖章确认 */ .sb-accordion { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); margin-bottom:10px; overflow:hidden; } .sb-accordion-header { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; cursor:pointer; user-select:none; transition:background 0.15s; } .sb-accordion-header:hover { background:var(--gray-50); } .sb-accordion-header .sb-accordion-title { font-size:14px; font-weight:600; color:var(--text); display:flex; align-items:center; gap:8px; } .sb-accordion-header .sb-accordion-summary { font-size:12px; color:var(--text-secondary); font-weight:400; margin-left:4px; } .sb-accordion-header .sb-accordion-arrow { font-size:18px; color:var(--text-light); transition:transform 0.2s; } .sb-accordion.open .sb-accordion-header .sb-accordion-arrow { transform:rotate(180deg); } .sb-accordion-body { display:none; padding:0 16px 14px; border-top:1px solid var(--gray-100); } .sb-accordion.open .sb-accordion-body { display:block; } /* 核心信息卡 */ .sb-core-card { background:#fff; border-radius:var(--radius); border:1px solid var(--gray-200); margin-bottom:10px; overflow:hidden; } .sb-core-card .sb-applicant-row { display:flex; align-items:center; gap:12px; padding:16px; background:linear-gradient(135deg,var(--role-seal-light),#FDF2F8); border-bottom:1px solid #FBCFE8; } .sb-core-card .sb-applicant-avatar { width:44px;height:44px;border-radius:50%;background:var(--role-seal);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0; } .sb-core-card .sb-applicant-name { font-size:16px;font-weight:600;color:var(--text); } .sb-core-card .sb-applicant-team { display:inline-flex;align-items:center;gap:4px;padding:3px 10px;background:var(--role-seal);color:#fff;border-radius:999px;font-size:12px;font-weight:500;margin-left:8px; } .sb-core-card .sb-info-grid { display:grid;grid-template-columns:1fr 1fr;gap:0; } .sb-core-card .sb-info-item { display:flex;padding:12px 16px;border-bottom:1px solid var(--gray-100); } .sb-core-card .sb-info-item:last-child { border-bottom:none; } .sb-core-card .sb-info-item.full-width { grid-column:1/-1; } .sb-core-card .sb-info-label { font-size:13px;color:var(--text-secondary);min-width:80px;flex-shrink:0; } .sb-core-card .sb-info-value { font-size:14px;color:var(--text);font-weight:500; } .sb-core-card .sb-seal-files { display:flex;flex-direction:column;gap:4px; } .sb-core-card .sb-seal-file-row { display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text);padding:4px 10px;background:var(--gray-50);border-radius:6px; } .sb-core-card .sb-approval-status { display:flex;gap:16px;flex-wrap:wrap; } .sb-core-card .sb-approval-status .sb-approval-item { display:inline-flex;align-items:center;gap:4px;font-size:13px;color:#15803D; } .sb-core-card .sb-approval-status .sb-approval-item i { font-size:16px; } @media (max-width:768px) { .sb-core-card .sb-info-grid { grid-template-columns:1fr; } } #sealContractView { display:none; } #sealContractView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #sealContractView .dr-inner { padding:16px; } } /* 0728 新增功能视图 — 默认隐藏 + dr-inner 内容层宽度 */ #financeAgreementPayView { display:none; } #financeAgreementPayView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeAgreementPayView .dr-inner { padding:16px; } } #financeLostRewardView { display:none; } #financeLostRewardView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeLostRewardView .dr-inner { padding:16px; } } /* Finance Agreement（财务-居间费用协议签署/费用变更签署）— 默认隐藏 */ #financeAgreementView { display:none; } #financeAgreementView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeAgreementView .dr-inner { padding:16px; } } /* 财务居间费用协议签署/费用变更签署 — 顶级tab按钮组 */ .fa-tab { display:inline-flex; align-items:center; gap:10px; padding:16px 32px; border-radius:10px; border:1px solid var(--gray-200); background:#fff; color:var(--text-secondary); cursor:pointer; font-size:18px; font-weight:500; transition:all 150ms ease; white-space:nowrap; } .fa-tab:hover { border-color:var(--role-finance); color:var(--role-finance); background:var(--role-finance-light); } .fa-tab.active { background:var(--role-finance); color:#fff; border-color:var(--role-finance); font-weight:600; } .fa-tab.active:hover { background:#059669; border-color:#059669; color:#fff; } .fa-tab .fa-tab-badge { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; border-radius:10px; background:#EF4444; color:#fff; font-size:12px; font-weight:700; padding:0 6px; } .fa-tab.active .fa-tab-badge { background:#fff; color:#EF4444; } /* 财务-居间费用支付 — 状态卡片tab按钮组 */ .fap-tab { display:inline-flex; align-items:center; gap:6px; padding:8px 18px; border-radius:8px; border:1px solid var(--gray-200); background:#fff; color:var(--text-secondary); cursor:pointer; font-size:15px; font-weight:500; transition:all 150ms ease; white-space:nowrap; } .fap-tab:hover { border-color:var(--role-finance); color:var(--role-finance); background:var(--role-finance-light); } .fap-tab.active { background:var(--role-finance); color:#fff; border-color:var(--role-finance); font-weight:600; } .fap-tab.active:hover { background:#059669; border-color:#059669; color:#fff; } .fap-tab .fap-tab-badge { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; border-radius:10px; background:#EF4444; color:#fff; font-size:12px; font-weight:700; padding:0 6px; } .fap-tab.active .fap-tab-badge { background:#fff; color:#059669; } #pmRectifyView { display:none; } #pmRectifyView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #pmRectifyView .dr-inner { padding:16px; } } #ecRectifyView { display:none; } #ecRectifyView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #ecRectifyView .dr-inner { padding:16px; } } /* financeExpense 已有 display:none，此处仅补齐 dr-inner 宽度规则 */ #financeExpenseView .dr-inner { max-width:1400px; margin:0 auto; padding:16px 24px; } @media (max-width:768px) { #financeExpenseView .dr-inner { padding:16px; } } /* 风险点提醒（法务可逐条编辑建议内容） */ #legalContractView .lc-risk { background:#FFFBEB; border-radius:var(--radius); padding:12px; margin-bottom:10px; border-left:3px solid var(--warning); } #legalContractView .lc-risk-title { font-size:14px; font-weight:600; color:#B45309; margin-bottom:8px; } #legalContractView .lc-risk-cmp { display:flex; gap:8px; margin-bottom:8px; } #legalContractView .lc-risk-cmp > div { flex:1; padding:6px 10px; border-radius:6px; font-size:13px; } #legalContractView .lc-cmp-label { font-size:12px; color:var(--text-secondary); margin-bottom:2px; } #legalContractView .lc-risk-std { background:#E8F5E9; } #legalContractView .lc-risk-std .lc-cmp-val { color:var(--brand-600); font-weight:500; } #legalContractView .lc-risk-cur { background:#FEF0F0; } #legalContractView .lc-risk-cur .lc-cmp-val { color:#DC2626; font-weight:500; } #legalContractView .lc-risk-edit { width:100%; padding:8px 10px; border:1px solid var(--gray-300); border-radius:var(--radius); font-size:13px; line-height:1.6; color:var(--text); outline:none; resize:vertical; min-height:64px; font-family:inherit; background:#fff; } #legalContractView .lc-risk-edit:focus { border-color:var(--role-legal); box-shadow:0 0 0 3px rgba(139,92,246,0.12); } #legalContractView .lc-risk-edit.modified { border-color:var(--role-legal); background:#F5F3FF; transition:border-color 200ms, background 200ms, box-shadow 200ms; } #legalContractView .lc-risk-edit.modified:focus { border-color:#7C3AED; box-shadow:0 0 0 3px rgba(139,92,246,0.18); } #legalContractView .lc-risk-modified-badge { display:inline-block; font-size:11px; line-height:18px; padding:0 6px; border-radius:9999px; margin-left:6px; font-weight:500; vertical-align:middle; transition:all 200ms; } #legalContractView .lc-risk-modified-badge.changed { background:var(--role-legal-light); color:var(--role-legal); } #legalContractView .lc-risk-modified-badge.unchanged { background:var(--gray-100); color:var(--text-hint); } #legalContractView .lc-risk-readonly { font-size:13px; line-height:1.6; color:var(--text-light); padding:8px 10px; background:#FAFAFA; border-radius:var(--radius); white-space:pre-wrap; } /* 审批流程（复用 cost-review ccr-flow 结构，法务视图独立作用域） */ #legalContractView .lc-flow { display:flex; align-items:center; overflow-x:auto; padding:10px 0; gap:4px; } #legalContractView .lc-flow-node { text-align:center; min-width:84px; } #legalContractView .lc-flow-circle { width:30px; height:30px; border-radius:50%; margin:0 auto 4px; display:flex; align-items:center; justify-content:center; font-size:16px; color:#fff; } #legalContractView .lc-flow-label { font-size:13px; font-weight:500; color:var(--text); } #legalContractView .lc-flow-sub { font-size:12px; color:var(--text-secondary); } #legalContractView .lc-flow-arrow { flex-shrink:0; color:var(--text-secondary); } #legalContractView .lc-key-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; } @media (max-width:768px) { #legalContractView .lc-key-grid { grid-template-columns:1fr; } } #legalContractView .lc-key-item { background:var(--gray-50); border-radius:var(--radius); padding:10px 12px; } #legalContractView .lc-key-item-wide { grid-column:1 / -1; } #legalContractView .lc-key-label { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text-secondary); margin-bottom:4px; } #legalContractView .lc-key-label i { font-size:14px; color:var(--role-legal); } #legalContractView .lc-key-val { font-size:14px; font-weight:500; color:var(--text); line-height:1.5; } /* 历史合同记录行（字段对齐 business-specialist .contract-record） */ #legalContractView .lc-hist { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid var(--gray-100); } #legalContractView .lc-hist:last-child { border-bottom:none; } #legalContractView .lc-hist-info { display:flex; align-items:center; gap:10px; min-width:0; flex:1; } #legalContractView .lc-hist-icon { font-size:22px; flex-shrink:0; } #legalContractView .lc-hist-name { font-size:14px; font-weight:500; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } #legalContractView .lc-hist-meta { font-size:13px; color:var(--text-secondary); margin-top:2px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; } #legalContractView .lc-hist-actions { display:flex; gap:6px; flex-shrink:0; } /* ===== Legal Contract dedicated modal（不改动通用 #modalOverlay / #ccrModalOverlay） ===== */ #lcModalOverlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:none; align-items:center; justify-content:center; z-index:1000; padding:16px; } #lcModalOverlay .lc-modal-dialog { background:#fff; border-radius:12px; max-width:480px; width:100%; padding:20px 24px; box-shadow:0 12px 40px rgba(0,0,0,0.2); max-height:85vh; overflow-y:auto; } #lcModalOverlay .lc-modal-title { font-size:18px; font-weight:600; margin-bottom:12px; } #lcModalOverlay .lc-modal-body { font-size:14px; color:var(--text); } #lcModalOverlay .lc-modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; } #lcModalOverlay .info-row { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:6px 0; border-bottom:1px solid var(--gray-100); } #lcModalOverlay .info-label { font-size:14px; color:var(--text-secondary); flex-shrink:0; } #lcModalOverlay .info-value { font-size:14px; font-weight:500; text-align:right; } #sbModalOverlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:none; align-items:center; justify-content:center; z-index:1000; padding:16px; } .modal-overlay .sb-modal-dialog { background:#fff; border-radius:12px; max-width:480px; width:100%; padding:20px 24px; box-shadow:0 12px 40px rgba(0,0,0,0.2); max-height:85vh; overflow-y:auto; } .modal-overlay .sb-modal-title { font-size:18px; font-weight:600; margin-bottom:12px; } .modal-overlay .sb-modal-body { font-size:14px; color:var(--text); } .modal-overlay .sb-modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; } .modal-overlay .info-row { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:6px 0; border-bottom:1px solid var(--gray-100); } .modal-overlay .info-label { font-size:14px; color:var(--text-secondary); flex-shrink:0; } .modal-overlay .info-value { font-size:14px; font-weight:500; text-align:right; }