diff --git a/assets/css/custom.css b/assets/css/custom.css index 50e0502..401e521 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -1,302 +1,199 @@ -body { - background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); - background-size: 400% 400%; - animation: gradient 15s ease infinite; - color: #212529; - font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; - font-size: 14px; - margin: 0; - min-height: 100vh; +:root { + --primary-gold: #ffc107; + --dark-gold: #e0a800; + --light-gold: #ffdf7e; + --bg-light: #f4f7f6; + --text-dark: #1a202c; + --text-muted: #718096; + --white: #ffffff; + --dark-bg: #111827; } -.main-wrapper { +body { + background-color: var(--bg-light); + color: var(--text-dark); + font-family: 'Noto Sans SC', 'Inter', -apple-system, sans-serif; + font-size: 15px; + margin: 0; + -webkit-font-smoothing: antialiased; +} + +/* Navbar */ +.navbar { + padding: 0.8rem 0; + background-color: var(--dark-bg) !important; +} + +.logo-wrapper { + width: 52px; + height: 52px; + border-radius: 50%; + overflow: hidden; + border: 2px solid var(--primary-gold); display: flex; align-items: center; justify-content: center; - min-height: 100vh; - width: 100%; - padding: 20px; - box-sizing: border-box; - position: relative; - z-index: 1; + background: #fff; + box-shadow: 0 0 15px rgba(255, 193, 7, 0.4); } -@keyframes gradient { - 0% { - background-position: 0% 50%; - } - 50% { - background-position: 100% 50%; - } - 100% { - background-position: 0% 50%; - } +.logo-img { + width: 100%; + height: 100%; + object-fit: cover; } -.chat-container { - width: 100%; - max-width: 600px; - background: rgba(255, 255, 255, 0.85); - border: 1px solid rgba(255, 255, 255, 0.3); +.brand-text { + font-size: 1.45rem; + font-weight: 800 !important; + letter-spacing: -0.01em; + color: var(--white); + background: linear-gradient(135deg, #fff 30%, var(--primary-gold) 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +/* Animations */ +@keyframes rotating { + from { transform: rotate(0deg); } + to { transform: rotate(360deg); } +} + +.rotating { + animation: rotating 8s linear infinite; +} + +/* Carousel Hero - Reduced Height */ +#mainCarousel { border-radius: 20px; - display: flex; - flex-direction: column; - height: 85vh; - box-shadow: 0 20px 40px rgba(0,0,0,0.2); - backdrop-filter: blur(15px); - -webkit-backdrop-filter: blur(15px); overflow: hidden; } -.chat-header { - padding: 1.5rem; - border-bottom: 1px solid rgba(0, 0, 0, 0.05); - background: rgba(255, 255, 255, 0.5); - font-weight: 700; - font-size: 1.1rem; - display: flex; - justify-content: space-between; - align-items: center; +.hero-img { + height: 220px; /* Reduced to roughly half */ + object-fit: cover; + filter: brightness(0.55) contrast(1.1); } -.chat-messages { - flex: 1; - overflow-y: auto; - padding: 1.5rem; - display: flex; - flex-direction: column; - gap: 1.25rem; -} - -/* Custom Scrollbar */ -::-webkit-scrollbar { - width: 6px; -} - -::-webkit-scrollbar-track { - background: transparent; -} - -::-webkit-scrollbar-thumb { - background: rgba(255, 255, 255, 0.3); - border-radius: 10px; -} - -::-webkit-scrollbar-thumb:hover { - background: rgba(255, 255, 255, 0.5); -} - -.message { - max-width: 85%; - padding: 0.85rem 1.1rem; - border-radius: 16px; - line-height: 1.5; - font-size: 0.95rem; - box-shadow: 0 4px 15px rgba(0,0,0,0.05); - animation: fadeIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); -} - -@keyframes fadeIn { - from { opacity: 0; transform: translateY(20px) scale(0.95); } - to { opacity: 1; transform: translateY(0) scale(1); } -} - -.message.visitor { - align-self: flex-end; - background: linear-gradient(135deg, #212529 0%, #343a40 100%); - color: #fff; - border-bottom-right-radius: 4px; -} - -.message.bot { - align-self: flex-start; - background: #ffffff; - color: #212529; - border-bottom-left-radius: 4px; -} - -.chat-input-area { - padding: 1.25rem; - background: rgba(255, 255, 255, 0.5); - border-top: 1px solid rgba(0, 0, 0, 0.05); -} - -.chat-input-area form { - display: flex; - gap: 0.75rem; -} - -.chat-input-area input { - flex: 1; - border: 1px solid rgba(0, 0, 0, 0.1); - border-radius: 12px; - padding: 0.75rem 1rem; - outline: none; - background: rgba(255, 255, 255, 0.9); - transition: all 0.3s ease; -} - -.chat-input-area input:focus { - border-color: #23a6d5; - box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.2); -} - -.chat-input-area button { - background: #212529; - color: #fff; - border: none; - padding: 0.75rem 1.5rem; - border-radius: 12px; - cursor: pointer; - font-weight: 600; - transition: all 0.3s ease; -} - -.chat-input-area button:hover { - background: #000; - transform: translateY(-2px); - box-shadow: 0 5px 15px rgba(0,0,0,0.2); -} - -/* Background Animations */ -.bg-animations { - position: fixed; +.carousel-overlay { + position: absolute; top: 0; left: 0; width: 100%; height: 100%; - z-index: 0; - overflow: hidden; - pointer-events: none; + background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.75) 100%); } -.blob { - position: absolute; - width: 500px; - height: 500px; - background: rgba(255, 255, 255, 0.2); - border-radius: 50%; - filter: blur(80px); - animation: move 20s infinite alternate cubic-bezier(0.45, 0, 0.55, 1); +.carousel-caption { + bottom: 10%; + text-shadow: 0 2px 12px rgba(0,0,0,0.8); } -.blob-1 { - top: -10%; - left: -10%; - background: rgba(238, 119, 82, 0.4); +.carousel-caption h2 { + font-size: 2rem !important; + margin-bottom: 0.25rem !important; } -.blob-2 { - bottom: -10%; - right: -10%; - background: rgba(35, 166, 213, 0.4); - animation-delay: -7s; - width: 600px; - height: 600px; +.slogan-text { + font-weight: 400; + font-size: 1.1rem; + opacity: 0.95; + letter-spacing: 0.02em; } -.blob-3 { - top: 40%; - left: 30%; - background: rgba(231, 60, 126, 0.3); - animation-delay: -14s; - width: 450px; - height: 450px; +/* Cards */ +.main-card { + border-radius: 16px !important; + border: 1px solid rgba(0,0,0,0.05) !important; + transition: transform 0.3s ease, box-shadow 0.3s ease; } -@keyframes move { - 0% { transform: translate(0, 0) rotate(0deg) scale(1); } - 33% { transform: translate(150px, 100px) rotate(120deg) scale(1.1); } - 66% { transform: translate(-50px, 200px) rotate(240deg) scale(0.9); } - 100% { transform: translate(0, 0) rotate(360deg) scale(1); } +.main-card:hover { + box-shadow: 0 20px 40px rgba(0,0,0,0.08) !important; } -.admin-link { - font-size: 14px; - color: #fff; - text-decoration: none; - background: rgba(0, 0, 0, 0.2); - padding: 0.5rem 1rem; - border-radius: 8px; - transition: all 0.3s ease; -} - -.admin-link:hover { - background: rgba(0, 0, 0, 0.4); - text-decoration: none; -} - -/* Admin Styles */ -.admin-container { - max-width: 900px; - margin: 3rem auto; - padding: 2.5rem; - background: rgba(255, 255, 255, 0.85); - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px); - border-radius: 24px; - box-shadow: 0 20px 50px rgba(0,0,0,0.15); - border: 1px solid rgba(255, 255, 255, 0.4); - position: relative; - z-index: 1; -} - -.admin-container h1 { - margin-top: 0; - color: #212529; - font-weight: 800; -} - -.table { - width: 100%; - border-collapse: separate; - border-spacing: 0 8px; - margin-top: 1.5rem; -} - -.table th { - background: transparent; - border: none; - padding: 1rem; - color: #6c757d; - font-weight: 600; - text-transform: uppercase; - font-size: 0.75rem; - letter-spacing: 1px; -} - -.table td { - background: #fff; - padding: 1rem; - border: none; -} - -.table tr td:first-child { border-radius: 12px 0 0 12px; } -.table tr td:last-child { border-radius: 0 12px 12px 0; } - -.form-group { - margin-bottom: 1.25rem; -} - -.form-group label { - display: block; - margin-bottom: 0.5rem; - font-weight: 600; - font-size: 0.9rem; -} - -.form-control { - width: 100%; - padding: 0.75rem 1rem; - border: 1px solid rgba(0, 0, 0, 0.1); +.icon-circle { + width: 45px; + height: 45px; border-radius: 12px; - background: #fff; - transition: all 0.3s ease; - box-sizing: border-box; + display: flex; + align-items: center; + justify-content: center; + font-size: 1.2rem; } -.form-control:focus { +/* Inputs & Outputs */ +textarea.form-control { + background-color: #fcfdfe; + border: 2px solid #edf2f7; + border-radius: 12px; + padding: 1.25rem; + font-size: 0.95rem; + line-height: 1.7; + resize: none; + color: #2d3748; + transition: all 0.2s ease; +} + +textarea.form-control:focus { + background-color: #fff; + border-color: var(--primary-gold); + box-shadow: 0 0 0 4px rgba(255, 193, 7, 0.1); outline: none; - border-color: #23a6d5; - box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.1); -} \ No newline at end of file +} + +.result-container { + background-color: #f8fafc; + border: 2px dashed #e2e8f0 !important; + font-family: 'Inter', monospace; + white-space: pre-wrap; + line-height: 1.8; + font-size: 0.95rem; + color: #1a202c; +} + +/* Buttons */ +.btn-gold { + background: linear-gradient(135deg, var(--primary-gold) 0%, var(--dark-gold) 100%); + border: none; + color: #333; + box-shadow: 0 8px 20px rgba(255, 193, 7, 0.3); + transition: all 0.3s ease; +} + +.btn-gold:hover { + background: linear-gradient(135deg, #ffca2c 0%, #d39e00 100%); + transform: translateY(-2px); + box-shadow: 0 10px 25px rgba(255, 193, 7, 0.45); + color: #000; +} + +.btn-outline-danger { + border-width: 2px; + font-weight: 600; +} + +/* Footer */ +.footer { + border-top: 4px solid var(--primary-gold); +} + +.footer-logo { + width: 60px; + height: 60px; + border-radius: 50%; + border: 2px solid var(--primary-gold); +} + +/* Toast */ +.toast { + background-color: #111827 !important; +} + +/* Responsive fixes */ +@media (max-width: 768px) { + .hero-img { height: 180px; } + .carousel-caption h2 { font-size: 1.4rem !important; } + .slogan-text { font-size: 0.9rem; } + .display-5 { font-size: 1.8rem; } +} diff --git a/assets/js/main.js b/assets/js/main.js index d349598..1a07a9d 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,39 +1,144 @@ document.addEventListener('DOMContentLoaded', () => { - const chatForm = document.getElementById('chat-form'); - const chatInput = document.getElementById('chat-input'); - const chatMessages = document.getElementById('chat-messages'); + // Elements + const clockEl = document.getElementById('real-time-clock'); + const inputEl = document.getElementById('reportInput'); + const outputEl = document.getElementById('reportOutput'); + const btnParse = document.getElementById('btnParse'); + const btnClear = document.getElementById('btnClear'); + const btnCopy = document.getElementById('btnCopy'); + const toastMessage = document.getElementById('toastMessage'); + const toastEl = document.getElementById('liveToast'); + const toast = new bootstrap.Toast(toastEl); - const appendMessage = (text, sender) => { - const msgDiv = document.createElement('div'); - msgDiv.classList.add('message', sender); - msgDiv.textContent = text; - chatMessages.appendChild(msgDiv); - chatMessages.scrollTop = chatMessages.scrollHeight; + // Initialize Real-time Clock + const updateClock = () => { + const now = new Date(); + const options = { + year: 'numeric', month: '2-digit', day: '2-digit', + hour: '2-digit', minute: '2-digit', second: '2-digit', + hour12: false + }; + // Format to YYYY-MM-DD HH:mm:ss + const formatted = now.toLocaleString('zh-CN', options).replace(/\//g, '-'); + clockEl.textContent = formatted; + }; + setInterval(updateClock, 1000); + updateClock(); + + // Show Toast Helper + const showToast = (msg, isError = false) => { + toastMessage.textContent = msg; + const icon = isError ? 'fa-circle-xmark text-danger' : 'fa-circle-check text-success'; + toastMessage.previousElementSibling.className = `fa-solid ${icon} me-2`; + toast.show(); }; - chatForm.addEventListener('submit', async (e) => { - e.preventDefault(); - const message = chatInput.value.trim(); - if (!message) return; + // Parsing Logic + const parseReports = () => { + const text = inputEl.value.trim(); + if (!text) { + showToast('请在左侧粘贴报表内容！', true); + return; + } - appendMessage(message, 'visitor'); - chatInput.value = ''; + // Define stats object to hold sums + const stats = { + '总WS数量': 0, + 'WS今日封号': 0, + '总永封WS': 0, + '总XHS数量': 0, + '总SMS数量': 0, + 'XHS': 0, + 'XHS回复': 0, + 'WS': 0, + 'WS回复': 0, + 'SMS': 0, + 'SMS回复': 0, + '总招呼量': 0, + '总回复': 0, + '再聊': 0, + '引流': 0, + '语音': 0 + }; - try { - const response = await fetch('api/chat.php', { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ message }) + // Standard single value patterns + const singlePatterns = { + '总WS数量': /总WS数量[:：]\s*(\d+)/g, + 'WS今日封号': /WS今日封号[:：]\s*(\d+)/g, + '总永封WS': /总永封WS[:：]\s*(\d+)/g, + '总XHS数量': /总XHS数量[:：]\s*(\d+)/g, + '总SMS数量': /总SMS数量[:：]\s*(\d+)/g, + '总招呼量': /总招呼量[:：]\s*(\d+)/g, + '总回复': /总回复[:：]\s*(\d+)/g, + '再聊': /再聊[:：]\s*(\d+)/g, + '引流': /引流[:：]\s*(\d+)/g, + '语音': /语音[:：]\s*(\d+)/g + }; + + // Dual value patterns (e.g., XHS: 10 回复: 5) + const dualPatterns = { + 'XHS': /XHS[:：]\s*(\d+)\s*回复[:：]\s*(\d+)/g, + 'WS': /WS[:：]\s*(\d+)\s*回复[:：]\s*(\d+)/g, + 'SMS': /SMS[:：]\s*(\d+)\s*回复[:：]\s*(\d+)/g + }; + + // Sum single fields + for (const [key, regex] of Object.entries(singlePatterns)) { + let match; + while ((match = regex.exec(text)) !== null) { + stats[key] += parseInt(match[1], 10) || 0; + } + } + + // Sum dual fields + for (const [key, regex] of Object.entries(dualPatterns)) { + let match; + while ((match = regex.exec(text)) !== null) { + stats[key] += parseInt(match[1], 10) || 0; + stats[key + '回复'] += parseInt(match[2], 10) || 0; + } + } + + // Format the output string exactly like the requested report structure + const result = +`总WS数量： ${stats['总WS数量']} +WS今日封号： ${stats['WS今日封号']} +总永封WS： ${stats['总永封WS']} +总XHS数量： ${stats['总XHS数量']} +总SMS数量： ${stats['总SMS数量']} +XHS： ${stats['XHS']} 回复： ${stats['XHS回复']} +WS： ${stats['WS']} 回复： ${stats['WS回复']} +SMS： ${stats['SMS']} 回复： ${stats['SMS回复']} +总招呼量： ${stats['总招呼量']} +总回复： ${stats['总回复']} +再聊： ${stats['再聊']} +引流： ${stats['引流']} +语音： ${stats['语音']}`; + + outputEl.textContent = result; + btnCopy.disabled = false; + showToast('解析统计成功，数据已汇总！'); + }; + + // Events + btnParse.addEventListener('click', parseReports); + + btnClear.addEventListener('click', () => { + inputEl.value = ''; + outputEl.textContent = '汇总结果将实时显示在此处...'; + btnCopy.disabled = true; + showToast('已清空所有内容'); + }); + + btnCopy.addEventListener('click', () => { + const text = outputEl.textContent; + if (text && !text.includes('实时显示在此处')) { + navigator.clipboard.writeText(text).then(() => { + showToast('汇总报表已复制到剪贴板！'); + }).catch(err => { + console.error('Copy failed', err); + showToast('复制失败，请手动选择复制', true); }); - const data = await response.json(); - - // Artificial delay for realism - setTimeout(() => { - appendMessage(data.reply, 'bot'); - }, 500); - } catch (error) { - console.error('Error:', error); - appendMessage("Sorry, something went wrong. Please try again.", 'bot'); } }); -}); +}); \ No newline at end of file diff --git a/assets/pasted-20260224-085211-bb97e8b6.jpg b/assets/pasted-20260224-085211-bb97e8b6.jpg new file mode 100644 index 0000000..f870959 Binary files /dev/null and b/assets/pasted-20260224-085211-bb97e8b6.jpg differ diff --git a/index.php b/index.php index 7205f3d..19eaf8d 100644 --- a/index.php +++ b/index.php @@ -1,150 +1,173 @@ - + - New Style - - - - - - - - - - - - - - - - - - - + <?= htmlspecialchars($projectName) ?> + + + + + + + + + + + -
-
-

Analyzing your requirements and generating your website…

-
- Loading… + + + + +
+ + + + +
+ +
+
+
+
+ +
+
+
报表内容粘贴区
+

在此粘贴多份待汇总的原始数据报表

+
+
+
+ +
+
+ + +
+
+
+ + +
+
+
+
+
+ +
+
+
汇总结果
+

解析后的合并报表数据

+
+
+ +
+
+
汇总结果将实时显示在此处...
+
+
-

AI is collecting your requirements and applying the first changes.

-

This page will update automatically as the plan is implemented.

-

Runtime: PHP — UTC

-