From 0ab17d54eb9ae04f18ee528b97e9bddd2ddc7644 Mon Sep 17 00:00:00 2001 From: "hangyu.tao" Date: Wed, 4 Feb 2026 12:53:49 +0800 Subject: [PATCH] =?UTF-8?q?feat:=E6=9B=B4=E6=8D=A2=E5=AE=A2=E6=88=B7?= =?UTF-8?q?=E6=84=8F=E5=90=91=E4=BA=A7=E5=93=81=E5=AD=97=E4=BD=93=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/css/style.css | 56 +++++++++++++++++++++++++++---- frontend/index.html | 16 ++++++--- frontend/js/trial-periods-page.js | 45 +++++++++++++++++++------ 3 files changed, 97 insertions(+), 20 deletions(-) diff --git a/frontend/css/style.css b/frontend/css/style.css index 17e2d78..6d6e4dc 100644 --- a/frontend/css/style.css +++ b/frontend/css/style.css @@ -748,11 +748,13 @@ td { cursor: pointer; position: relative; vertical-align: middle; - height: inherit; /* Ensure td takes full height of tr */ + height: inherit; + /* Ensure td takes full height of tr */ } #customerTable td { - display: table-cell; /* Force correct display mode */ + display: table-cell; + /* Force correct display mode */ } tr:hover td { @@ -1546,6 +1548,38 @@ td.overflow-cell { font-size: 0.75rem; } +.product-badge { + display: inline-flex; + align-items: center; + padding: 2px 10px; + border-radius: 4px; + font-size: 0.8rem; + font-weight: 500; + background-color: #e6f7ed; + color: #23a059; + border: 1px solid #b7ebc6; + margin: 2px; + line-height: 1.6; +} + +.product-badge-blue { + background-color: #e6f7ff; + color: #1890ff; + border-color: #91d5ff; +} + +.product-badge-purple { + background-color: #f9f0ff; + color: #722ed1; + border-color: #d3adf7; +} + +.product-badge-orange { + background-color: #fff7e6; + color: #fa8c16; + border-color: #ffd591; +} + .status-active { background-color: #d4edda; color: #155724; @@ -2872,11 +2906,21 @@ tr:hover .action-cell { } @keyframes fadeIn { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + + to { + opacity: 1; + } } @keyframes zoomIn { - from { transform: scale(0.9); } - to { transform: scale(1); } + from { + transform: scale(0.9); + } + + to { + transform: scale(1); + } } \ No newline at end of file diff --git a/frontend/index.html b/frontend/index.html index dd6dcef..3ebe1fe 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -317,8 +317,8 @@
@@ -625,6 +625,14 @@ +
+ +
@@ -1180,9 +1188,9 @@ - + - + \ No newline at end of file diff --git a/frontend/js/trial-periods-page.js b/frontend/js/trial-periods-page.js index 2f96d70..83ad789 100644 --- a/frontend/js/trial-periods-page.js +++ b/frontend/js/trial-periods-page.js @@ -10,7 +10,7 @@ let trialTotalPages = 0; let customersMap = {}; // Map of customer ID to customer name let trialStartDateFilter = ''; let trialEndDateFilter = ''; -let trialSortOrder = 'desc'; +let trialSortOrder = 'createdAtDesc'; // Initialize trial periods page function initTrialPeriodsPage() { @@ -83,7 +83,7 @@ function initTrialPeriodsPage() { // 为编辑弹窗的意向产品复选框添加监听器，控制时间字段显示 const editIntendedProductCheckboxes = document.querySelectorAll('input[name="editIntendedProduct"]'); editIntendedProductCheckboxes.forEach(checkbox => { - checkbox.addEventListener('change', function() { + checkbox.addEventListener('change', function () { updateEditTrialTimeFieldsVisibility(); }); }); @@ -362,11 +362,18 @@ function applyTrialFiltersAndSort() { }); } - // Sort by end time + // Sorting logic filtered.sort((a, b) => { - const dateA = new Date(a.endTime); - const dateB = new Date(b.endTime); - return trialSortOrder === 'asc' ? dateA - dateB : dateB - dateA; + if (trialSortOrder === 'createdAtDesc') { + const dateA = new Date(a.createdAt || 0); + const dateB = new Date(b.createdAt || 0); + return dateB - dateA; // Default: Created time descending + } else if (trialSortOrder === 'endTimeDesc') { + const dateA = new Date(a.endTime || 0); + const dateB = new Date(b.endTime || 0); + return dateB - dateA; // End time descending + } + return 0; }); filteredTrialPeriodsData = filtered; @@ -522,16 +529,34 @@ function renderTrialPeriodsTable() { // 检查意向产品是否包含"数据闭环" // 如果只包含 robogo 或其他，则不显示试用相关信息 const hasDataLoop = intendedProduct.includes('数据闭环'); - + // 根据是否有数据闭环来决定显示内容 const statusCell = hasDataLoop ? statusBadge : '-'; const startTimeCell = hasDataLoop ? startTime : '-'; const endTimeCell = hasDataLoop ? endTime : '-'; + // 生成意向产品标签 + const productBadges = (period.intendedProduct || '').split(',') + .map(p => p.trim()) + .filter(p => p) + .map(p => { + let colorClass = ''; + if (p.includes('数据闭环')) { + colorClass = ''; // 保持默认绿色 + } else if (p.toLowerCase().includes('robogo')) { + colorClass = 'product-badge-blue'; + } else if (p.includes('数据生成')) { + colorClass = 'product-badge-orange'; + } else { + colorClass = 'product-badge-purple'; // 其他类型用紫色 + } + return `${p}`; + }).join(''); + row.innerHTML = ` ${customerName} ${source} - ${intendedProduct} + ${productBadges} ${statusCell} ${startTimeCell} ${endTimeCell} @@ -659,11 +684,11 @@ function openEditTrialModal(periodId) { function updateEditTrialTimeFieldsVisibility() { const intendedProduct = getIntendedProductValue('editTrialIntendedProduct', 'editTrialIntendedProductOther'); const hasDataLoop = intendedProduct.includes('数据闭环'); - + const startTimeGroup = document.getElementById('editTrialStartTimeGroup'); const endTimeGroup = document.getElementById('editTrialEndTimeGroup'); const isTrialGroup = document.getElementById('editTrialIsTrialGroup'); - + if (startTimeGroup && endTimeGroup && isTrialGroup) { if (hasDataLoop) { startTimeGroup.style.display = 'block';