update
This commit is contained in:
parent
64d4e5acdb
commit
d246486068
@ -455,7 +455,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>
|
||||
<script>
|
||||
const { createApp } = Vue;
|
||||
|
||||
|
||||
@ -32,6 +32,7 @@ html, body {
|
||||
|
||||
#app {
|
||||
height: 100vh;
|
||||
height: 100dvh; /* iOS Safari 动态视口高度 */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -43,7 +44,7 @@ html, body {
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
height: 100%;
|
||||
max-height: 900px;
|
||||
max-height: min(900px, calc(100vh - 40px));
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--bg-secondary);
|
||||
@ -157,10 +158,10 @@ html, body {
|
||||
border-radius: 50%;
|
||||
background: var(--accent);
|
||||
box-shadow: 0 0 8px var(--accent);
|
||||
animation: pulse 2s ease-in-out infinite;
|
||||
animation: statusPulse 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
@keyframes statusPulse {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.4; }
|
||||
}
|
||||
@ -185,7 +186,7 @@ html, body {
|
||||
|
||||
.welcome-icon {
|
||||
margin-bottom: 20px;
|
||||
opacity: 0.3;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.welcome-icon svg {
|
||||
@ -224,7 +225,7 @@ html, body {
|
||||
padding: 10px 16px;
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 6px;
|
||||
border-radius: 4px;
|
||||
color: var(--text-secondary);
|
||||
font-size: 13px;
|
||||
cursor: pointer;
|
||||
@ -427,7 +428,7 @@ html, body {
|
||||
padding: 16px 20px;
|
||||
background: rgba(0, 255, 65, 0.05);
|
||||
border: 1px solid rgba(0, 255, 65, 0.2);
|
||||
border-radius: 6px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.share-image-question-label {
|
||||
@ -670,7 +671,7 @@ html, body {
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
padding: 4px 8px;
|
||||
border-radius: 4px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.contact-link:hover {
|
||||
@ -759,6 +760,8 @@ html, body {
|
||||
@media (max-width: 768px) {
|
||||
#app {
|
||||
padding: 0;
|
||||
height: 100vh;
|
||||
height: 100dvh;
|
||||
}
|
||||
|
||||
.container {
|
||||
@ -820,10 +823,10 @@ html, body {
|
||||
justify-content: center;
|
||||
z-index: 10000;
|
||||
padding: 20px;
|
||||
animation: fadeIn 0.2s ease;
|
||||
animation: modalFadeIn 0.2s ease;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
@keyframes modalFadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
@ -896,14 +899,14 @@ html, body {
|
||||
justify-content: center;
|
||||
z-index: 10000;
|
||||
padding: 20px;
|
||||
animation: fadeIn 0.2s ease;
|
||||
animation: modalFadeIn 0.2s ease;
|
||||
}
|
||||
|
||||
.contact-modal-content {
|
||||
position: relative;
|
||||
background: var(--bg-primary);
|
||||
border: 1px solid var(--border-bright);
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
padding: 32px;
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
@ -918,7 +921,7 @@ html, body {
|
||||
height: 32px;
|
||||
background: transparent;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 4px;
|
||||
border-radius: 2px;
|
||||
color: var(--text-secondary);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -955,7 +958,7 @@ html, body {
|
||||
padding: 12px;
|
||||
background: var(--bg-secondary);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
border-radius: 4px;
|
||||
color: var(--text-secondary);
|
||||
font-size: 14px;
|
||||
}
|
||||
@ -976,7 +979,7 @@ html, body {
|
||||
padding: 12px;
|
||||
background: var(--accent-dim);
|
||||
border: 1px solid var(--accent);
|
||||
border-radius: 6px;
|
||||
border-radius: 4px;
|
||||
color: var(--accent);
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
|
||||
@ -38,7 +38,7 @@
|
||||
<span class="model-name">{{ currentModel.name }}</span>
|
||||
</div>
|
||||
<!-- Logout Button -->
|
||||
<button class="logout-btn" @click="logout" title="登出">
|
||||
<button class="logout-btn" @click="logout" title="登出" aria-label="登出">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/>
|
||||
<polyline points="16 17 21 12 16 7"/>
|
||||
@ -87,14 +87,14 @@
|
||||
|
||||
<!-- Action Buttons for AI Messages (只在流式输出完成后显示) -->
|
||||
<div v-if="!msg.streaming" class="message-actions">
|
||||
<button class="action-btn" @click.stop="copyMessage(msg.content)" title="复制内容">
|
||||
<button class="action-btn" @click.stop="copyMessage(msg.content)" title="复制内容" aria-label="复制内容">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"/>
|
||||
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
|
||||
</svg>
|
||||
<span>复制</span>
|
||||
</button>
|
||||
<button class="action-btn" @click.stop="generateShareImage(msg.content, index)" title="生成分享图">
|
||||
<button class="action-btn" @click.stop="generateShareImage(msg.content, index)" title="生成分享图" aria-label="生成分享图">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
|
||||
<circle cx="8.5" cy="8.5" r="1.5"/>
|
||||
@ -153,9 +153,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Image Modal -->
|
||||
<div v-if="showImageModal" class="image-modal" @click="closeImageModal">
|
||||
<div v-if="showImageModal" class="image-modal" @click="closeImageModal" role="dialog" aria-modal="true" aria-label="分享图预览">
|
||||
<div class="image-modal-content" @click.stop>
|
||||
<button class="modal-close-btn" @click="closeImageModal" title="关闭">
|
||||
<button class="modal-close-btn" @click="closeImageModal" title="关闭" aria-label="关闭分享图">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="18" y1="6" x2="6" y2="18"/>
|
||||
<line x1="6" y1="6" x2="18" y2="18"/>
|
||||
@ -167,9 +167,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Contact Modal -->
|
||||
<div v-if="showContactModal" class="contact-modal" @click="showContactModal = false">
|
||||
<div v-if="showContactModal" class="contact-modal" @click="showContactModal = false" role="dialog" aria-modal="true" aria-label="联系作者">
|
||||
<div class="contact-modal-content" @click.stop>
|
||||
<button class="modal-close-btn" @click="showContactModal = false" title="关闭">
|
||||
<button class="modal-close-btn" @click="showContactModal = false" title="关闭" aria-label="关闭联系方式">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="18" y1="6" x2="6" y2="18"/>
|
||||
<line x1="6" y1="6" x2="18" y2="18"/>
|
||||
@ -197,10 +197,10 @@
|
||||
</div>
|
||||
|
||||
<!-- Vue 3 -->
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>
|
||||
|
||||
<!-- Lightweight Charts -->
|
||||
<script src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/lightweight-charts/dist/lightweight-charts.standalone.production.js"></script>
|
||||
|
||||
<!-- html2canvas for generating share images -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"></script>
|
||||
|
||||
@ -25,6 +25,13 @@ createApp({
|
||||
this.sessionId = this.generateSessionId();
|
||||
this.autoResizeTextarea();
|
||||
this.loadModels();
|
||||
|
||||
// 键盘 Escape 关闭模态框
|
||||
document.addEventListener('keydown', this.handleKeydown);
|
||||
},
|
||||
|
||||
beforeUnmount() {
|
||||
document.removeEventListener('keydown', this.handleKeydown);
|
||||
},
|
||||
methods: {
|
||||
checkAuth() {
|
||||
@ -40,6 +47,13 @@ createApp({
|
||||
}
|
||||
},
|
||||
|
||||
handleKeydown(e) {
|
||||
if (e.key === 'Escape') {
|
||||
if (this.showImageModal) this.closeImageModal();
|
||||
else if (this.showContactModal) this.showContactModal = false;
|
||||
}
|
||||
},
|
||||
|
||||
logout() {
|
||||
localStorage.removeItem('token');
|
||||
window.location.href = '/static/login.html';
|
||||
|
||||
@ -221,7 +221,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>
|
||||
<script>
|
||||
const { createApp } = Vue;
|
||||
|
||||
|
||||
@ -633,8 +633,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
|
||||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
|
||||
<script>
|
||||
console.log('[DEBUG] Vue global:', typeof Vue);
|
||||
console.log('[DEBUG] Vue.createApp:', typeof Vue?.createApp);
|
||||
|
||||
@ -657,7 +657,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>
|
||||
<script>
|
||||
const { createApp } = Vue;
|
||||
|
||||
|
||||
@ -1689,8 +1689,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns@3.0.0/dist/chartjs-adapter-date-fns.bundle.min.js"></script>
|
||||
<script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user