鍟嗕紮浼?路宸ヤ綔鍙?/title>  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <script src="assets/page-helper.js?v=2"></script> <script src="assets/modules/list-helper.js?v=4"></script> <script src="assets/modules/prop-qf.js?v=49"></script> <script src="assets/modules/customer.js?v=7"></script> <script src="assets/modules/prop-valid.js?v=2"></script> <script src="assets/modules/cust-valid.js?v=2"></script> <style> /* ========== Reset & Base ========== */ *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } :root { --primary: #1677FF; --primary-light: #E6F4FF; --primary-dark: #0958d9; --sidebar-bg: #001529; --sidebar-width: 220px; --sidebar-collapsed: 60px; --topbar-height: 56px; --bg-body: #F0F2F5; --bg-card: #FFFFFF; --text-primary: #1D2129; --text-secondary: #86909C; --text-muted: #C9CDD4; --border-color: #E5E6EB; --success: #52C41A; --warning: #FAAD14; --danger: #F53F3F; --shadow-sm: 0 1px 2px rgba(0,0,0,0.06); --shadow-md: 0 4px 12px rgba(0,0,0,0.08); --radius: 8px; --radius-lg: 12px; } html, body { height: 100%; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif; font-size: 14px; color: var(--text-primary); background: var(--bg-body); overflow: hidden; } a { text-decoration: none; color: inherit; } ul { list-style: none; } /* ========== Layout ========== */ .app { display: flex; height: 100vh; } /* ========== Sidebar ========== */ .sidebar { width: var(--sidebar-width); background: var(--sidebar-bg); color: rgba(255,255,255,0.85); display: flex; flex-direction: column; flex-shrink: 0; transition: width 0.25s ease; overflow: hidden; z-index: 100; } .sidebar.collapsed { width: var(--sidebar-collapsed); } .sidebar-logo { height: var(--topbar-height); display: flex; align-items: center; padding: 0 16px; gap: 10px; border-bottom: 1px solid rgba(255,255,255,0.08); flex-shrink: 0; } .sidebar-logo .logo-icon { width: 32px; height: 32px; background: linear-gradient(135deg, var(--primary), #69B1FF); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #fff; font-weight: 700; flex-shrink: 0; } .sidebar-logo .logo-text { font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; } .sidebar.collapsed .logo-text, .sidebar.collapsed .menu-text, .sidebar.collapsed .menu-badge, .sidebar.collapsed .submenu-arrow { display: none; } /* Menu Scroll */ .sidebar-menu-wrap { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 8px 0; } .sidebar-menu-wrap::-webkit-scrollbar { width: 4px; } .sidebar-menu-wrap::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 2px; } .menu-item { display: flex; align-items: center; padding: 10px 16px; cursor: pointer; transition: all 0.15s; white-space: nowrap; position: relative; gap: 10px; border-left: 3px solid transparent; color: rgba(255,255,255,0.65); } .menu-item:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.85); } .menu-item.active { background: var(--primary); color: #fff; border-left-color: #fff; } .menu-item .fa { width: 18px; text-align: center; font-size: 15px; flex-shrink: 0; } .menu-text { flex: 1; font-size: 13px; overflow: hidden; text-overflow: ellipsis; } .menu-badge { background: var(--danger); color: #fff; font-size: 11px; padding: 0 6px; border-radius: 10px; line-height: 16px; min-width: 16px; text-align: center; } .submenu-arrow { font-size: 12px; transition: transform 0.2s; } .submenu-arrow.open { transform: rotate(90deg); } .submenu { overflow: hidden; max-height: 0; transition: max-height 0.25s ease; background: rgba(0,0,0,0.2); } .submenu.open { max-height: 500px; } .submenu .menu-item { padding-left: 40px; font-size: 13px; } /* Sidebar footer - collapse toggle */ .sidebar-footer { border-top: 1px solid rgba(255,255,255,0.08); padding: 8px 16px; flex-shrink: 0; } .sidebar-footer .menu-item { padding: 8px 0; } .sidebar-footer .menu-item .fa { font-size: 14px; } /* ========== Main Content ========== */ .main-wrap { flex: 1; display: flex; flex-direction: column; min-width: 0; } /* ========== Topbar ========== */ .topbar { height: var(--topbar-height); background: var(--bg-card); border-bottom: 1px solid var(--border-color); display: flex; align-items: center; padding: 0 20px; gap: 16px; flex-shrink: 0; box-shadow: var(--shadow-sm); z-index: 50; } .topbar-left { display: flex; align-items: center; gap: 12px; } .topbar-left .collapse-btn { background: none; border: none; font-size: 18px; color: var(--text-secondary); cursor: pointer; padding: 4px; border-radius: 4px; transition: all 0.15s; } .topbar-left .collapse-btn:hover { background: var(--bg-body); color: var(--text-primary); } .topbar-center { flex: 1; max-width: 480px; position: relative; } .search-box { width: 100%; height: 34px; border: 1px solid var(--border-color); border-radius: 20px; padding: 0 14px 0 36px; font-size: 13px; color: var(--text-primary); background: var(--bg-body); outline: none; transition: all 0.2s; } .search-box:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 2px var(--primary-light); } .search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--text-muted); font-size: 13px; pointer-events: none; } .topbar-right { display: flex; align-items: center; gap: 8px; margin-left: auto; } .topbar-right .icon-btn { width: 34px; height: 34px; border: none; background: none; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--text-secondary); font-size: 16px; position: relative; transition: all 0.15s; } .topbar-right .icon-btn:hover { background: var(--bg-body); color: var(--text-primary); } .topbar-right .icon-btn .badge { position: absolute; top: 2px; right: 2px; background: var(--danger); color: #fff; font-size: 10px; min-width: 16px; height: 16px; line-height: 16px; text-align: center; border-radius: 8px; padding: 0 4px; } .user-dropdown { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 4px 8px; border-radius: 6px; transition: all 0.15s; position: relative; } .user-dropdown:hover { background: var(--bg-body); } .user-avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; flex-shrink: 0; } .user-info { line-height: 1.3; } .user-info .name { font-size: 13px; font-weight: 500; } .user-info .dept { font-size: 11px; color: var(--text-secondary); } .user-menu { display: none; position: absolute; top: 100%; right: 0; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius); box-shadow: var(--shadow-md); min-width: 160px; padding: 4px 0; z-index: 200; } .user-menu.open { display: block; } .user-menu a { display: block; padding: 8px 16px; color: var(--text-primary); font-size: 13px; transition: background 0.15s; } .user-menu a:hover { background: var(--bg-body); } .user-menu a .fa { width: 18px; color: var(--text-secondary); } /* ========== Content Area ========== */ .content-area { flex: 1; padding: 20px; overflow-y: auto; overflow-x: hidden; } /* ========== Dashboard Cards ========== */ .stat-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; margin-bottom: 24px; } .stat-card { background: var(--bg-card); border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow-sm); transition: all 0.2s; cursor: pointer; } .stat-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); } .stat-card .stat-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 18px; margin-bottom: 12px; color: #fff; } .stat-card .stat-value { font-size: 28px; font-weight: 700; line-height: 1.2; } .stat-card .stat-label { font-size: 13px; color: var(--text-secondary); margin-top: 4px; } .stat-card .stat-change { font-size: 12px; margin-top: 8px; display: flex; align-items: center; gap: 4px; } .stat-card .stat-change.up { color: var(--success); } .stat-card .stat-change.down { color: var(--danger); } /* Section Headers */ .section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; } .section-header h3 { font-size: 16px; font-weight: 600; } .section-header .more { font-size: 13px; color: var(--primary); cursor: pointer; } .section-header .more:hover { text-decoration: underline; } /* Quick Action Grid */ .quick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 12px; margin-bottom: 24px; } .quick-item { background: var(--bg-card); border-radius: var(--radius); padding: 16px 8px; text-align: center; box-shadow: var(--shadow-sm); cursor: pointer; transition: all 0.2s; border: 1px solid transparent; } .quick-item:hover { border-color: var(--primary); box-shadow: var(--shadow-md); } .quick-item .quick-icon { font-size: 24px; margin-bottom: 6px; } .quick-item .quick-label { font-size: 12px; color: var(--text-secondary); } /* Timeline / Activity */ .timeline { margin-bottom: 24px; } .timeline-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-color); position: relative; } .timeline-item:last-child { border-bottom: none; } .timeline-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; flex-shrink: 0; } .timeline-dot.view { background: var(--primary); } .timeline-dot.sign { background: var(--success); } .timeline-dot.prop { background: var(--warning); } .timeline-dot.client { background: var(--danger); } .timeline-body { flex: 1; min-width: 0; } .timeline-body .tl-title { font-size: 14px; font-weight: 500; } .timeline-body .tl-desc { font-size: 13px; color: var(--text-secondary); margin-top: 2px; } .timeline-body .tl-time { font-size: 12px; color: var(--text-muted); margin-top: 4px; } /* Responsive */ @media (max-width: 768px) { .sidebar { position: fixed; left: -220px; height: 100%; } .sidebar.open { left: 0; } .sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 99; } .sidebar-overlay.open { display: block; } .content-area { padding: 16px; } .stat-row { grid-template-columns: repeat(2, 1fr); } } /* Loading skeleton */ .skeleton { background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; border-radius: 4px; } @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* ========== 绛涢€夋爮 ========== */ .filter-bar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; background: #fff; padding: 10px 16px; border-radius: 8px; border: 1px solid var(--border-color); } .filter-item { display: flex; align-items: center; gap: 4px; white-space: nowrap; } .filter-item label { font-size: 12px; color: var(--text-secondary); min-width: 24px; white-space: nowrap; } .filter-input { height: 32px; border: 1px solid var(--border-color); border-radius: 6px; padding: 0 8px; font-size: 13px; outline: none; transition: border-color 0.2s; } .filter-input:focus { border-color: var(--primary); } .filter-select { height: 32px; border: 1px solid var(--border-color); border-radius: 6px; padding: 0 6px; font-size: 13px; outline: none; background: #fff; cursor: pointer; transition: border-color 0.2s; } .filter-select:focus { border-color: var(--primary); } .filter-btn { height: 32px; padding: 0 16px; border: none; border-radius: 6px; font-size: 13px; cursor: pointer; transition: all 0.2s; } .filter-btn.primary { background: var(--primary); color: #fff; } .filter-btn.primary:hover { background: var(--primary-dark); } .filter-btn.default { background: #fff; border: 1px solid var(--border-color); color: var(--text-primary); } .filter-btn.default:hover { border-color: var(--primary); color: var(--primary); } /* ========== 鏁版嵁琛ㄦ牸 ========== */ .data-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; border-radius: 8px; overflow: hidden; } .data-table th { background: #FAFBFC; border-bottom: 1px solid var(--border-color); padding: 10px 8px; text-align: left; font-weight: 600; color: var(--text-primary); white-space: nowrap; cursor: pointer; user-select: none; } .data-table th:hover { background: #F0F2F5; } .data-table td { padding: 8px; border-bottom: 1px solid #F0F0F0; color: var(--text-primary); white-space: nowrap; } .data-table tr:hover td { background: #FAFBFC; } /* ========== 鍒嗛〉鎺т欢 ========== */ .pagination { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 16px 0; font-size: 13px; color: var(--text-secondary); } .page-btn { min-width: 32px; height: 32px; border: 1px solid var(--border-color); border-radius: 6px; background: #fff; color: var(--text-primary); font-size: 13px; cursor: pointer; transition: all 0.2s; } .page-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); } .page-btn:disabled { opacity: 0.4; cursor: not-allowed; } .page-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); } .page-size-select { height: 32px; border: 1px solid var(--border-color); border-radius: 6px; padding: 0 8px; font-size: 13px; outline: none; background: #fff; cursor: pointer; } </style> </head> <body> <div class="app">  <div class="sidebar-overlay" id="sidebarOverlay"></div>  <div class="sidebar" id="sidebar"> <div class="sidebar-logo"> <div class="logo-icon">鍟?/div> <span class="logo-text">鍟嗕紮浼?/span> </div> <div class="sidebar-menu-wrap" id="sidebarMenu">  </div> <div class="sidebar-footer"> <div class="menu-item" onclick="toggleSidebar()"> <i class="fa fa-angle-left"></i> <span class="menu-text">鏀惰捣渚ф爮</span> </div> </div> </div>  <div class="main-wrap">  <div class="topbar"> <div class="topbar-left"> <button class="collapse-btn" onclick="toggleSidebar()" title="灞曞紑/鏀惰捣鑿滃崟"> <i class="fa fa-bars"></i> </button> </div> <div class="topbar-center"> <i class="fa fa-search search-icon"></i> <input class="search-box" type="text" placeholder="鎼滅储鎴挎簮缂栧彿銆佸鎴峰悕绉般€佹墜鏈哄彿鈥? id="globalSearch" onkeydown="if(event.key==='Enter')globalSearchFunc()"> </div> <div class="topbar-right"> <button class="icon-btn" onclick="loadPage('dashboard')" title="鍒锋柊"> <i class="fa fa-refresh"></i> </button> <button class="icon-btn" onclick="alert('娑堟伅閫氱煡鍔熻兘寮€鍙戜腑')" title="娑堟伅"> <i class="fa fa-bell"></i> <span class="badge" id="msgBadge">0</span> </button> <div class="user-dropdown" onclick="toggleUserMenu()" id="userDropdown"> <div class="user-avatar" id="userAvatar">?</div> <div class="user-info"> <div class="name" id="userName">鍔犺浇涓?/div> <div class="dept" id="userDept">--</div> </div> <div class="user-menu" id="userMenu"> <a href="javascript:void(0)" onclick="alert('涓汉璁剧疆寮€鍙戜腑')"><i class="fa fa-user"></i> 涓汉璁剧疆</a> <a href="javascript:void(0)" onclick="alert('淇敼瀵嗙爜寮€鍙戜腑')"><i class="fa fa-lock"></i> 淇敼瀵嗙爜</a> <a href="shb_web.php?s=/Home/Shb/logout"><i class="fa fa-sign-out"></i> 閫€鍑虹櫥褰?/a> </div> </div> </div> </div>  <div class="content-area" id="contentArea">  <div style="display:flex;align-items:center;justify-content:center;padding:60px 0;color:var(--text-secondary)"> <i class="fa fa-spinner fa-spin" style="margin-right:8px"></i> 鍔犺浇涓€? </div> </div> </div> </div> <script> // ========== 鍏ㄥ眬鐘舵€?========== let menuData = []; let employeeData = {}; let userMenuOpen = false; // ========== 渚ф爮鎶樺彔 ========== function toggleSidebar() { document.getElementById('sidebar').classList.toggle('collapsed'); } function toggleMobileSidebar() { const s = document.getElementById('sidebar'); const o = document.getElementById('sidebarOverlay'); s.classList.toggle('open'); o.classList.toggle('open'); } document.getElementById('sidebarOverlay')?.addEventListener('click', toggleMobileSidebar); // ========== 鐢ㄦ埛鑿滃崟 ========== function toggleUserMenu() { userMenuOpen = !userMenuOpen; document.getElementById('userMenu').classList.toggle('open', userMenuOpen); } document.addEventListener('click', (e) => { if (!document.getElementById('userDropdown').contains(e.target)) { document.getElementById('userMenu').classList.remove('open'); userMenuOpen = false; } }); // ========== 鑿滃崟娓叉煋 ========== function renderMenu(menus) { const container = document.getElementById('sidebarMenu'); container.innerHTML = ''; menus.forEach((item, idx) => { const hasSub = item.children && item.children.length > 0; const div = document.createElement('div'); div.className = `menu-item${idx === 0 ? ' active' : ''}`; div.dataset.key = item.key || item.name; div.innerHTML = ` <i class="fa ${item.icon || 'fa-circle-o'}"></i> <span class="menu-text">${item.name}</span> ${item.badge ? `<span class="menu-badge">${item.badge}</span>` : ''} ${hasSub ? `<i class="fa fa-chevron-right submenu-arrow"></i>` : ''} `; div.onclick = function(e) { e.stopPropagation(); if (item.click) { item.click(); return; } if (hasSub) { const arrow = this.querySelector('.submenu-arrow'); const sub = this.nextElementSibling; if (arrow) arrow.classList.toggle('open'); if (sub) sub.classList.toggle('open'); } else { loadPage(item.id || item.name); // 楂樹寒 container.querySelectorAll('.menu-item').forEach(el => el.classList.remove('active')); this.classList.add('active'); } }; container.appendChild(div); // 瀛愯彍鍗? if (hasSub) { const subWrap = document.createElement('div'); subWrap.className = 'submenu'; item.children.forEach(child => { const cd = document.createElement('div'); cd.className = 'menu-item'; cd.dataset.key = child.key || child.name; cd.innerHTML = `<span class="menu-text">${child.name}</span>`; cd.onclick = function(e) { e.stopPropagation(); container.querySelectorAll('.menu-item').forEach(el => el.classList.remove('active')); this.classList.add('active'); // 鐖剁骇涔熼珮浜? div.classList.add('active'); loadPage(child.id || child.name); }; subWrap.appendChild(cd); }); container.appendChild(subWrap); } }); } // ========== 椤甸潰鍔犺浇 ========== function loadPage(page) { // 鏇存柊 URL 鍙傛暟 var url = new URL(location.href); if (page && page !== 'dashboard') { url.searchParams.set('page', page); } else { url.searchParams.delete('page'); } history.replaceState(null, '', url.href); const area = document.getElementById("contentArea"); if (page === "dashboard") { renderDashboard(); return; } // 妫€鏌ユ槸鍚︽湁宸叉敞鍐岀殑椤甸潰妯″潡 if (window.pageModules && window.pageModules[page]) { window.pageModules[page].init(); return; } // 澶勭悊鐗规畩璺敱锛堣烦杞被锛? if (page === "demand_form") { window.location.href = "shb_web.php?s=/Home/Shb/demandForm"; return; } // 榛樿銆屽紑鍙戜腑銆嶆彁绀? area.innerHTML = `<div style="text-align:center;padding:60px 0;color:var(--text-secondary)"> <i class="fa fa-cubes" style="font-size:48px;margin-bottom:16px;display:block"></i> <div>銆?{page}銆嶆ā鍧楀紑鍙戜腑锛屾暚璇锋湡寰?/div> </div>`; } // ========== 宸ヤ綔鍙版覆鏌?========== function renderDashboard() { const area = document.getElementById('contentArea'); const e = employeeData; area.innerHTML = `  <div class="stat-row" id="statRow"> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#1677FF,#69B1FF)"><i class="fa fa-home"></i></div> <div class="stat-value">${e.todayProp || 0}</div> <div class="stat-label">浠婃棩鏂板鎴挎簮</div> <div class="stat-change up">${e.propRank || '-'}</div> </div> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#52C41A,#95DE64)"><i class="fa fa-users"></i></div> <div class="stat-value">${e.todayCustomer || 0}</div> <div class="stat-label">浠婃棩鏂板瀹㈡簮</div> <div class="stat-change up">${e.custRank || '-'}</div> </div> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#FAAD14,#FFD666)"><i class="fa fa-eye"></i></div> <div class="stat-value">${e.todayView || 0}</div> <div class="stat-label">浠婃棩甯︾湅</div> <div class="stat-change">${e.viewRank || '-'}</div> </div> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#F53F3F,#FF7D7D)"><i class="fa fa-file-text"></i></div> <div class="stat-value">${e.todayCommit || 0}</div> <div class="stat-label">浠婃棩绛惧崟</div> <div class="stat-change">${e.commitRank || '-'}</div> </div> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#722ED1,#B37FEB)"><i class="fa fa-trophy"></i></div> <div class="stat-value">楼${formatMoney(e.monthPerformance || 0)}</div> <div class="stat-label">鏈湀涓氱哗</div> <div class="stat-change up">${e.perfRank || '-'}</div> </div> <div class="stat-card"> <div class="stat-icon" style="background:linear-gradient(135deg,#13C2C2,#5CDBD3)"><i class="fa fa-star"></i></div> <div class="stat-value">${e.monthPoint || 0}</div> <div class="stat-label">鏈湀绉垎</div> <div class="stat-change">${e.pointRank || '-'}</div> </div> </div>  <div class="section-header"> <h3>蹇嵎鎿嶄綔</h3> <span class="more" onclick="loadPage('allQuick')">鏇村</span> </div> <div class="quick-grid" id="quickGrid"> <div class="quick-item" onclick="alert('鏂板鎴挎簮鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃彔</div> <div class="quick-label">鏂板鎴挎簮</div> </div> <div class="quick-item" onclick="alert('鏂板瀹㈡簮鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃懁</div> <div class="quick-label">鏂板瀹㈡簮</div> </div> <div class="quick-item" onclick="alert('鏂板甯︾湅鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃憗锔?/div> <div class="quick-label">鏂板甯︾湅</div> </div> <div class="quick-item" onclick="location.href='shb_web.php?s=/Home/Shb/demandForm'"> <div class="quick-icon">馃搵</div> <div class="quick-label">闇€姹傜櫥璁?/div> </div> <div class="quick-item" onclick="alert('鏂板濮旀墭鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃摑</div> <div class="quick-label">鏂板濮旀墭</div> </div> <div class="quick-item" onclick="alert('鏂板绗旇鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃摀</div> <div class="quick-label">鏂板绗旇</div> </div> <div class="quick-item" onclick="alert('鏂板灞曚笟鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃毝</div> <div class="quick-label">鏂板灞曚笟</div> </div> <div class="quick-item" onclick="alert('鏂板绛惧崟鍔熻兘寮€鍙戜腑')"> <div class="quick-icon">馃搼</div> <div class="quick-label">鏂板绛惧崟</div> </div> </div>  <div class="section-header"> <h3>涓氬姟鍔ㄦ€?/h3> <span class="more" onclick="alert('鏌ョ湅鏇村鍔熻兘寮€鍙戜腑')">鏌ョ湅鏇村</span> </div> <div class="timeline" id="activityTimeline"> <div style="text-align:center;padding:24px;color:var(--text-secondary)"> <i class="fa fa-spinner fa-spin"></i> 鍔犺浇涓€? </div> </div> `; // 鍔犺浇涓氬姟鍔ㄦ€? loadActivity(); } // ========== 涓氬姟鍔ㄦ€?========== function loadActivity() { fetch(window.API_BASE + 'activity') .then(r => r.json()) .then(data => { const container = document.getElementById('activityTimeline'); if (!data || !data.list || data.list.length === 0) { container.innerHTML = '<div style="text-align:center;padding:24px;color:var(--text-secondary)">鏆傛棤鍔ㄦ€?/div>'; return; } container.innerHTML = data.list.map(item => { const dotClass = item.type === 'view' ? 'view' : item.type === 'sign' ? 'sign' : item.type === 'prop' ? 'prop' : 'client'; return ` <div class="timeline-item"> <div class="timeline-dot ${dotClass}"></div> <div class="timeline-body"> <div class="tl-title">${item.title}</div> <div class="tl-desc">${item.desc}</div> <div class="tl-time">${item.time}</div> </div> </div> `; }).join(''); }) .catch(() => { const container = document.getElementById('activityTimeline'); if (container) container.innerHTML = '<div style="text-align:center;padding:24px;color:var(--text-secondary)">鏆傛棤鍔ㄦ€?/div>'; }); } // ========== 宸ュ叿鍑芥暟 ========== function formatMoney(n) { if (n >= 10000) return (n/10000).toFixed(1) + '涓?; if (n >= 1000) return (n/1000).toFixed(1) + 'k'; return n.toString(); } function globalSearchFunc() { const val = document.getElementById('globalSearch').value.trim(); if (!val) return; alert('鍏ㄥ眬鎼滅储鍔熻兘寮€鍙戜腑锛屽叧閿瘝锛? + val); } // ========== 鍒濆鍖栧姞杞?========== window.API_BASE = 'shb_web.php?s=/Home/ShbApi/'; // 鍔犺浇鑿滃崟 function loadMenu() { return fetch(API_BASE + 'menus') .then(r => r.json()) .then(data => { menuData = data.data || []; document.getElementById('msgBadge').textContent = data.badge || '0'; renderMenu(menuData); }); } // 鍔犺浇鍛樺伐淇℃伅 function loadEmployee() { return fetch(API_BASE + 'employee') .then(r => r.json()) .then(data => { employeeData = data; const name = data.empName || '鏈煡'; document.getElementById('userName').textContent = name; document.getElementById('userDept').textContent = data.deptName || ''; document.getElementById('userAvatar').textContent = name.charAt(0); }); } // 鍒濆鍖?document.addEventListener('DOMContentLoaded', function() { Promise.all([loadMenu(), loadEmployee()]) .then(() => { // 妫€鏌?URL 鍙傛暟锛岃嫢鏈?page 鍒欏姞杞藉搴旀ā鍧楋紝鍚﹀垯榛樿 dashboard var params = new URLSearchParams(location.search); var initPage = params.get('page'); if (initPage) { loadPage(initPage); } else { renderDashboard(); } }) .catch(() => { document.getElementById('contentArea').innerHTML = ` <div style="text-align:center;padding:60px;color:var(--text-secondary)"> <i class="fa fa-exclamation-triangle" style="font-size:36px;margin-bottom:12px;display:block;color:var(--warning)"></i> <div>鍔犺浇澶辫触锛岃妫€鏌ョ綉缁滃悗<a href="javascript:location.reload()" style="color:var(--primary)">鍒锋柊</a></div> </div> `; }); }); </script> </body> </html>