zy-wcs.git - Gitblit

			@@ -40,6 +40,28 @@
			box-shadow: 0px 0px 20px rgba(0,0,0,0.3);
			text-align: center;
			}

			/* AI助手抽屉动画 */
			@keyframes slideInRight {
			from { transform: translate3d(100%, 0, 0); opacity: 0; }
			to { transform: translate3d(0, 0, 0); opacity: 1; }
			}

			@keyframes slideOutRight {
			from { transform: translate3d(0, 0, 0); opacity: 1; }
			to { transform: translate3d(100%, 0, 0); opacity: 0; }
			}

			.ai-drawer-layer {
			box-shadow: -8px 0 24px rgba(0, 0, 0, 0.15) !important;
			border-radius: 8px 0 0 8px !important;
			overflow: hidden;
			animation: slideInRight 0.5s cubic-bezier(0.16, 1, 0.3, 1);
			}

			.ai-drawer-layer-close {
			animation: slideOutRight 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
			}
			</style>
			</head>
			<body class="layui-layout-body">
			@@ -120,6 +142,75 @@
			<div id="popup-text" style="font-size: 28px;color: red"></div>
			<button style="background-color: #007bff;color: #fff;border: none;padding: 10px 20px;border-radius: 5px;cursor: pointer;font-size: 16px;" onclick="hidePopup()">关闭</button>
			</div>
			</div>

			<!-- 右下角SVG动画 -->
			<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、width/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>
			@@ -306,6 +397,48 @@
			var url = logout.getAttribute('href');
			logout.setAttribute('href', baseUrl + "/login");

			// AI助手图标悬浮提示
			$('#ai-assistant-btn').on('mouseenter', function(){
			this.index = layer.tips('AI助手', this, {
			tips: [1, '#333'], // 上方显示，深色背景
			time: -1 // 不自动关闭
			});
			}).on('mouseleave', function(){
			layer.close(this.index);
			}).on('click', function () {
			layer.open({
			type: 2,
			title: false, // 隐藏默认标题栏，更简洁
			closeBtn: 0, // 隐藏关闭按钮，点击遮罩关闭
			shadeClose: false, // 改为手动控制关闭，以便播放动画
			shade: 0.1,
			area: ['600px', '100%'],
			offset: 'r', // 右侧悬浮
			anim: -1, // 禁用默认动画，使用CSS动画
			isOutAnim: false,
			skin: 'ai-drawer-layer', // 自定义皮肤
			content: 'ai/diagnosis.html',
			success: function(layero, index){
			// 背景模糊效果
			var shadeId = layero.attr('id').replace('layui-layer', 'layui-layer-shade');
			var $shade = $('#' + shadeId);
			$shade.css({
			'backdrop-filter': 'blur(3px)',
			'transition': 'opacity 0.8s'
			});

			// 点击遮罩关闭（带动画）
			$shade.on('click', function() {
			layero.addClass('ai-drawer-layer-close');
			$shade.css('opacity', 0);
			setTimeout(function(){
			layer.close(index);
			}, 400);
			});
			}
			});
			});

			});
			</script>
			<script type="text/html" id="menuTpl">