From d600bbc25fb2e306d92cffafe2d7aa601daa536b Mon Sep 17 00:00:00 2001
From: Junjie <DELL@qq.com>
Date: 星期五, 12 十二月 2025 11:02:30 +0800
Subject: [PATCH] #AI
---
src/main/webapp/views/ai/diagnosis.html | 72 +----------------
src/main/webapp/views/index.html | 68 ----------------
src/main/webapp/static/js/common.js | 54 +++++++++++++
3 files changed, 62 insertions(+), 132 deletions(-)
diff --git a/src/main/webapp/static/js/common.js b/src/main/webapp/static/js/common.js
index 2a45d7e..f2f0be2 100644
--- a/src/main/webapp/static/js/common.js
+++ b/src/main/webapp/static/js/common.js
@@ -193,3 +193,57 @@
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}
+
+/**
+ * 鑾峰彇AI鍔╂墜SVG鍥炬爣HTML
+ * @param {number} width 瀹藉害锛岄粯璁�48
+ * @param {number} height 楂樺害锛岄粯璁�48
+ * @returns {string} SVG HTML瀛楃涓�
+ */
+function getAiIconHtml(width, height) {
+ width = width || 48;
+ height = height || 48;
+ // 鐢熸垚鍞竴ID闃叉鍐茬獊
+ var uniqueId = 'ai_icon_' + Math.random().toString(36).substr(2, 9);
+ var textGradientId = 'textGradient_' + uniqueId;
+ var glowId = 'glow_' + uniqueId;
+ var spinName = 'spin_' + uniqueId;
+
+ return '<svg width="' + width + '" height="' + height + '" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" fill="none">' +
+ '<defs>' +
+ '<linearGradient id="' + textGradientId + '" gradientUnits="userSpaceOnUse" x1="25" y1="50" x2="75" y2="50">' +
+ '<stop offset="0%" stop-color="#8b5cf6"/>' +
+ '<stop offset="20%" stop-color="#f472b6"/>' +
+ '<stop offset="40%" stop-color="#fb923c"/>' +
+ '<stop offset="60%" stop-color="#fbbf24"/>' +
+ '<stop offset="80%" stop-color="#22d3ee"/>' +
+ '<stop offset="100%" stop-color="#3b82f6"/>' +
+ '<animateTransform attributeName="gradientTransform" type="rotate" from="0 50 50" to="360 50 50" dur="5s" repeatCount="indefinite" />' +
+ '</linearGradient>' +
+ '<filter id="' + glowId + '" x="-50%" y="-50%" width="200%" height="200%">' +
+ '<feGaussianBlur stdDeviation="1.6" result="blur"/>' +
+ '<feMerge>' +
+ '<feMergeNode in="blur"/>' +
+ '<feMergeNode in="SourceGraphic"/>' +
+ '</feMerge>' +
+ '</filter>' +
+ '<style>' +
+ '.' + spinName + ' { animation: ' + spinName + ' 5s linear infinite; transform-origin: 50px 50px; }' +
+ '@keyframes ' + spinName + ' { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }' +
+ '.geo-text-' + uniqueId + ' { fill: url(#' + textGradientId + '); stroke: rgba(0,0,0,0.40); stroke-width: 0.45; paint-order: stroke fill; }' +
+ '</style>' +
+ '</defs>' +
+ '<g class="' + spinName + '" filter="url(#' + glowId + ')">' +
+ '<g transform="rotate(0 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#8b5cf6"/></g>' +
+ '<g transform="rotate(60 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#f472b6"/></g>' +
+ '<g transform="rotate(120 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#fb923c"/></g>' +
+ '<g transform="rotate(180 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#fbbf24"/></g>' +
+ '<g transform="rotate(240 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#22d3ee"/></g>' +
+ '<g transform="rotate(300 50 50)"><rect x="48" y="18" width="4.5" height="10" rx="2" fill="#3b82f6"/></g>' +
+ '</g>' +
+ '<g transform="translate(50 50) scale(0.35) translate(-32.5 -20)" class="geo-text-' + uniqueId + '">' +
+ '<path d="M0 40 L20 0 L40 40 Z"/><rect x="12" y="22" width="16" height="4" rx="1"/>' +
+ '<rect x="50" y="0" width="15" height="4" rx="1"/><rect x="55" y="4" width="5" height="32" rx="1.5"/><rect x="50" y="36" width="15" height="4" rx="1"/>' +
+ '</g>' +
+ '</svg>';
+}
diff --git a/src/main/webapp/views/ai/diagnosis.html b/src/main/webapp/views/ai/diagnosis.html
index 3c9c037..a396fa1 100644
--- a/src/main/webapp/views/ai/diagnosis.html
+++ b/src/main/webapp/views/ai/diagnosis.html
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <title>WCS AI 璇婃柇</title>
+ <title>WCS AI 鍔╂墜</title>
<link rel="stylesheet" href="../../static/vue/element/element.css" />
<style>
body { background: #f5f7fa; }
@@ -16,81 +16,18 @@
.markdown-body h1, .markdown-body h2, .markdown-body h3 { margin-top: 8px; }
.markdown-body pre { background: #f6f8fa; padding: 12px; border-radius: 6px; overflow: auto; }
.status { color: #909399; }
-
- /* 鏁翠釜鍥炬爣鏃嬭浆鍔ㄧ敾 */
- .spinner {
- animation: spin 2.8s linear infinite;
- transform-origin: 50% 50%;
- }
-
- @keyframes spin {
- from { transform: rotate(0deg); }
- to { transform: rotate(360deg); }
- }
</style>
</head>
<body>
<div id="app" class="container">
<el-card shadow="hover">
<div slot="header" class="clearfix" style="display: flex; align-items: center;">
- <svg
- width="32"
- height="32"
- viewBox="0 0 64 64"
- style="margin-right: 10px;"
- xmlns="http://www.w3.org/2000/svg">
-
- <!-- 閫忔槑鑳屾櫙锛氫笉鐢讳换浣曞簳鑹插嵆鍙� -->
-
- <!-- 涓�鐐规煍鍜屽彂鍏夋晥鏋� -->
- <defs>
- <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
- <feGaussianBlur stdDeviation="2.5" result="blur"/>
- <feMerge>
- <feMergeNode in="blur"/>
- <feMergeNode in="SourceGraphic"/>
- </feMerge>
- </filter>
- </defs>
-
- <!-- 鏃嬭浆缁� -->
- <g class="spinner" filter="url(#glow)">
- <!-- 姣忎竴鏉″僵鑹层�屽皬寮潯銆� -->
- <!-- 鍙互閫氳繃璋冩暣 rx/ry銆亀idth/height 鏉ユ敼绮楃粏鍜屽集搴� -->
- <!-- 1. 绱壊 -->
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#8b5cf6" />
-
- <!-- 2. 绮夎壊锛堥『鏃堕拡鏃嬭浆60掳锛� -->
- <g transform="rotate(60 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#f472b6" />
- </g>
-
- <!-- 3. 姗欒壊 -->
- <g transform="rotate(120 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#fb923c" />
- </g>
-
- <!-- 4. 閲戦粍 -->
- <g transform="rotate(180 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#fbbf24" />
- </g>
-
- <!-- 5. 闈掕壊 -->
- <g transform="rotate(240 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#22d3ee" />
- </g>
-
- <!-- 6. 钃濊壊 -->
- <g transform="rotate(300 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#3b82f6" />
- </g>
- </g>
- </svg>
- <span>WCS AI 璇婃柇</span>
+ <div v-html="headerIcon" style="margin-right: 10px; display: flex;"></div>
+ <span>WCS AI 鍔╂墜</span>
</div>
<div class="actions">
- <el-button type="primary" :loading="loading" :disabled="streaming" @click="start">寮�濮嬭瘖鏂�</el-button>
+ <el-button type="primary" :loading="loading" :disabled="streaming" @click="start">涓�閿瘖鏂郴缁�</el-button>
<el-button type="warning" :disabled="!streaming" @click="stop">鍋滄</el-button>
<el-button @click="clear">娓呯┖</el-button>
<span class="status">{{ statusText }}</span>
@@ -119,6 +56,7 @@
el: '#app',
data: function() {
return {
+ headerIcon: getAiIconHtml(50, 50),
loading: false,
streaming: false,
source: null,
diff --git a/src/main/webapp/views/index.html b/src/main/webapp/views/index.html
index e9ea1c7..86a8ab5 100644
--- a/src/main/webapp/views/index.html
+++ b/src/main/webapp/views/index.html
@@ -146,71 +146,6 @@
<!-- 鍙充笅瑙扴VG鍔ㄧ敾 -->
<div id="ai-assistant-btn" style="position: fixed; bottom: 40px; right: 20px; z-index: 9999; cursor: pointer;">
- <svg
- width="48"
- height="48"
- viewBox="0 0 64 64"
- xmlns="http://www.w3.org/2000/svg">
-
- <!-- 閫忔槑鑳屾櫙锛氫笉鐢讳换浣曞簳鑹插嵆鍙� -->
-
- <!-- 涓�鐐规煍鍜屽彂鍏夋晥鏋� -->
- <defs>
- <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
- <feGaussianBlur stdDeviation="2.5" result="blur"/>
- <feMerge>
- <feMergeNode in="blur"/>
- <feMergeNode in="SourceGraphic"/>
- </feMerge>
- </filter>
-
- <style>
- /* 鏁翠釜鍥炬爣鏃嬭浆鍔ㄧ敾 */
- .spinner {
- animation: spin 2.8s linear infinite;
- transform-origin: 50% 50%;
- }
-
- @keyframes spin {
- from { transform: rotate(0deg); }
- to { transform: rotate(360deg); }
- }
- </style>
- </defs>
-
- <!-- 鏃嬭浆缁� -->
- <g class="spinner" filter="url(#glow)">
- <!-- 姣忎竴鏉″僵鑹层�屽皬寮潯銆� -->
- <!-- 鍙互閫氳繃璋冩暣 rx/ry銆亀idth/height 鏉ユ敼绮楃粏鍜屽集搴� -->
- <!-- 1. 绱壊 -->
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#8b5cf6" />
-
- <!-- 2. 绮夎壊锛堥『鏃堕拡鏃嬭浆60掳锛� -->
- <g transform="rotate(60 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#f472b6" />
- </g>
-
- <!-- 3. 姗欒壊 -->
- <g transform="rotate(120 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#fb923c" />
- </g>
-
- <!-- 4. 閲戦粍 -->
- <g transform="rotate(180 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#fbbf24" />
- </g>
-
- <!-- 5. 闈掕壊 -->
- <g transform="rotate(240 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#22d3ee" />
- </g>
-
- <!-- 6. 钃濊壊 -->
- <g transform="rotate(300 32 32)">
- <rect x="30" y="10" width="6" height="14" rx="3" ry="3" fill="#3b82f6" />
- </g>
- </g>
- </svg>
</div>
<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
@@ -220,6 +155,9 @@
<script>
console.log('%c 涓壃绔嬪簱骞冲彴 %c 1.0.0','background-color:rgb(53,73,94);color: #fff;border-radius:2px 0 0 2px;padding:2px 4px;','background-color:rgb(25,190,107);color: #fff;border-radius:0 2px 2px 0;padding:2px 4px;font: 9pt "Apercu Regular", Georgia, "Times New Roman", Times, serif;');
$(function () {
+ // 娉ㄥ叆AI鍔╂墜鍥炬爣
+ $('#ai-assistant-btn').html(getAiIconHtml(60, 60));
+
if ("" === localStorage.getItem('token')) {
top.location.href = baseUrl + "/login";
}
--
Gitblit v1.9.1