选型助手
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, “Segoe UI”, sans-serif;
}
/* 跑马灯外层 + 彩色流动阴影 */
.ai-runlight-wrap {
width: 100%;
max-width: 680px;
position: relative;
border-radius: 28px;
background: linear-gradient(90deg,
#007AFF, #34C759, #5856D6, #FF2D55, #FF9500, #007AFF);
background-size: 400% 400%;
padding: 2px;
animation: runLight 4s linear infinite;
}
@keyframes runLight {
0% {
background-position: 0% 50%;
box-shadow: 0 0 18px rgba(0,122,255,0.45),
0 0 35px rgba(88,86,214,0.25);
}
25% {
background-position: 50% 50%;
box-shadow: 0 0 18px rgba(52,199,89,0.45),
0 0 35px rgba(255,149,0,0.25);
}
50% {
background-position: 100% 50%;
box-shadow: 0 0 18px rgba(255,45,85,0.45),
0 0 35px rgba(0,122,255,0.25);
}
75% {
background-position: 50% 50%;
box-shadow: 0 0 18px rgba(255,149,0,0.45),
0 0 35px rgba(52,199,89,0.25);
}
100% {
background-position: 0% 50%;
box-shadow: 0 0 18px rgba(0,122,255,0.45),
0 0 35px rgba(88,86,214,0.25);
}
}
.ai-input-inner {
border-radius: 26px;
background: #f5f5f7;
position: relative;
overflow: hidden;
}
.ai-textarea {
width: 100%;
min-height: 56px;
max-height: 160px;
padding: 16px 60px 16px 20px;
background: transparent;
border: none;
outline: none;
font-size: 16px;
color: #1d1d1f;
border-radius: 26px;
resize: none;
white-space: pre-wrap;
word-wrap: break-word;
overflow: hidden;
display: flex;
align-items: center;
}
/* 隐藏滚动条 */
.ai-textarea::-webkit-scrollbar { display: none; }
.ai-textarea { -ms-overflow-style: none; scrollbar-width: none; }
.ai-textarea::placeholder {
color: #8e8e93;
font-weight: 400;
}
/* 发送按钮 */
.ai-send-btn {
position: absolute;
right: 12px;
bottom: 10px;
width: 36px;
height: 36px;
border-radius: 50%;
border: none;
background: #007AFF;
color: #fff;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.25s ease;
z-index: 2;
}
/* 箭头固定尺寸，不拉伸 */
.ai-send-btn svg {
width: 16px;
height: 16px;
flex-shrink: 0;
}
.ai-send-btn:hover {
background: #0066CC;
transform: scale(0.96);
}
.ai-send-btn:active {
transform: scale(0.92);
}
const input = document.getElementById(‘aiInput’);
const sendBtn = document.getElementById(‘sendBtn’);
function autoResize() {
input.style.height = ‘auto’;
input.style.height = Math.min(input.scrollHeight, 160) + ‘px’;
}
function sendMessage() {
const text = input.value.trim();
if (text) {
ssq.push(‘chatOpen’);
ssq.push(‘sendTextMessage’, `${text}`);
// console.log(‘选型需求：’, text);
input.value = ”;
autoResize();
}
}
input.addEventListener(‘input’, autoResize);
sendBtn.addEventListener(‘click’, sendMessage);
input.addEventListener(‘keydown’, (e) => {
if (e.key === ‘Enter’ && !e.shiftKey) {
e.preventDefault();
sendMessage();
}
});
autoResize();
