update:替换网站图标为新设计的 logo.svg,删除旧的 vite.svg 文件,调整聊天界面样式以增强移动端适配,修改聊天模式选择器的布局和样式,优化主布局以隐藏侧边栏组件

This commit is contained in:
Lexcubia 2025-04-21 19:12:10 +08:00
parent fcd3cbdee4
commit ca8532815a
9 changed files with 139 additions and 21 deletions

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/logo.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>对话</title> <title>对话</title>
</head> </head>

6
public/lgogo.svg Normal file
View File

@ -0,0 +1,6 @@
<svg width="169" height="51" viewBox="0 0 169 51" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M81.76 17.5466C79.9529 15.6083 77.7663 14.0627 75.3361 13.0059C72.906 11.9491 70.2844 11.4037 67.6344 11.4037C64.9844 11.4037 62.3628 11.9491 59.9327 13.0059C57.5025 14.0627 55.3159 15.6083 53.5088 17.5466C50.1929 21.2167 48.3801 26.0007 48.4312 30.9467C48.4823 35.8926 50.3936 40.6381 53.7847 44.2389C55.5931 46.0736 57.7481 47.5306 60.1245 48.525C62.501 49.5195 65.0514 50.0316 67.6275 50.0316C70.2036 50.0316 72.754 49.5195 75.1304 48.525C77.5069 47.5306 79.6619 46.0736 81.4703 44.2389C84.8662 40.633 86.7812 35.8815 86.8349 30.9286C86.8885 25.9757 85.0769 21.1838 81.76 17.5052V17.5466ZM67.6206 18.5536C69.1876 18.5355 70.7408 18.848 72.1788 19.4707C73.6169 20.0935 74.9074 21.0125 75.9663 22.1677C77.1207 23.3101 78.0294 24.6765 78.6366 26.1828C79.2439 27.6891 79.5369 29.3036 79.4977 30.9272C79.5096 33.0868 78.9581 35.2121 77.8975 37.0934C76.8989 38.9229 75.4143 40.441 73.6074 41.48C71.7797 42.4933 69.7242 43.025 67.6344 43.025C65.5446 43.025 63.4891 42.4933 61.6614 41.48C59.8361 40.4511 58.3356 38.9315 57.3299 37.0934C56.2651 35.2138 55.7132 33.0874 55.7297 30.9272C55.6917 29.3062 55.9826 27.6943 56.5848 26.1887C57.187 24.6832 58.0881 23.3154 59.2335 22.1677C60.297 21.0072 61.5943 20.0852 63.0399 19.4622C64.4855 18.8393 66.0467 18.5296 67.6206 18.5536V18.5536Z" fill="#A4CE8A"/>
<path d="M160.596 35.7139C159.687 37.375 158.528 38.887 157.161 40.1971C156.059 41.1327 154.791 41.8533 153.423 42.3214C151.967 42.8683 150.425 43.1487 148.87 43.1491C147.374 43.1859 145.886 42.9063 144.505 42.3287C143.124 41.7511 141.881 40.8884 140.856 39.797C138.949 37.8115 137.785 35.2295 137.559 32.486H168.114V31.1065C168.193 26.5874 166.733 22.1756 163.975 18.5949C162.215 16.2968 159.934 14.4503 157.32 13.2078C154.705 11.9654 151.833 11.3626 148.939 11.4494C146.119 11.3651 143.32 11.9558 140.774 13.1723C138.228 14.3888 136.01 16.1959 134.303 18.4432C131.398 22.1416 129.882 26.7426 130.02 31.444C130.159 36.1455 131.943 40.6491 135.062 44.1699C136.822 46.1556 139.004 47.7216 141.449 48.7529C143.893 49.7841 146.538 50.2544 149.188 50.1291C151.662 50.1596 154.121 49.7389 156.444 48.8876C158.592 48.0633 160.563 46.8366 162.251 45.2734C164.11 43.503 165.637 41.4148 166.762 39.1073L167.41 37.8382L161.244 34.5965L160.596 35.7139ZM159.892 25.8508H138.469C139.101 24.1268 140.132 22.5765 141.477 21.3262C143.566 19.4332 146.3 18.4115 149.119 18.4707C150.915 18.4687 152.69 18.8594 154.319 19.6157C155.833 20.2951 157.169 21.3148 158.223 22.5953C158.955 23.581 159.519 24.681 159.892 25.8508V25.8508Z" fill="#A4CE8A"/>
<path d="M123.405 20.2917C122.394 17.8965 120.689 15.8593 118.508 14.4428C116.26 12.983 113.629 12.2243 110.949 12.2633C108.289 12.2483 105.67 12.908 103.334 14.1807C101.981 14.9318 100.733 15.8596 99.6237 16.9396V0H92.354V50.074H99.6237V36.1416C99.5151 33.1638 99.7092 30.1827 100.203 27.2441C100.766 24.9664 102.054 22.9331 103.872 21.4504C105.587 19.955 107.791 19.1403 110.066 19.1605C111.75 19.0711 113.414 19.5576 114.784 20.54C116.057 21.6551 116.917 23.1664 117.225 24.8301C117.627 27.3147 117.775 29.8336 117.667 32.3481V50.074H124.923V31.1066C124.923 26.2233 124.44 22.6781 123.405 20.2917Z" fill="#45886C"/>
<path d="M26.0716 1.15869H23.1196L0 50.074H8.33187L24.568 15.7671L40.7351 50.074H48.8877L26.0716 1.15869Z" fill="#45886C"/>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

8
public/lgoo.svg Normal file
View File

@ -0,0 +1,8 @@
<svg width="1931" height="978" viewBox="0 0 1931 978" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M355.325 541.386H318.177C282.033 387.562 263.966 230.046 264.34 72.034C264.34 66.758 264.34 61.2666 264.34 56.4213L272.524 21.5348L247.651 0L221.809 21.5348L229.562 56.4213C229.562 61.5896 229.562 67.1887 229.562 72.034C229.936 230.046 211.868 387.562 175.724 541.386H139.115L148.483 588.009H164.526C160.327 603.298 156.128 618.48 151.713 633.447H215.349C217.825 618.373 220.302 603.191 222.563 588.009H272.631C274.892 603.191 277.369 618.373 279.845 633.447H343.05C338.635 618.48 334.436 603.298 330.345 588.009H346.28L355.325 541.386ZM228.7 541.386C237.745 471.074 243.99 398.394 247.651 324.207C250.773 398.502 257.018 471.074 266.171 541.386H228.7Z" fill="#A4CE8A"/>
<path d="M367.169 977.143H494.332C462.616 926.646 434.654 873.887 410.669 819.293H442.218L452.232 762.333H387.627C373.091 725.401 359.632 686.961 347.465 647.014H282.86C289.751 686.315 297.504 724.862 306.118 762.333H189.184C197.905 724.862 205.658 686.315 212.549 647.014H147.944C135.777 686.853 122.318 725.401 107.782 762.333H42.3159L52.1143 819.293H83.7705C59.7079 873.869 31.7107 926.625 0 977.143H127.271C145.073 926.895 161.116 874.278 175.401 819.293H318.931C333.287 874.206 349.367 926.823 367.169 977.143Z" fill="#45886C"/>
<path d="M1256.67 723.247C1242.56 708.118 1225.49 696.054 1206.52 687.805C1187.56 679.556 1167.09 675.299 1146.41 675.299C1125.72 675.299 1105.26 679.556 1086.29 687.805C1067.32 696.054 1050.25 708.118 1036.15 723.247C1010.27 751.895 996.116 789.237 996.515 827.843C996.914 866.449 1011.83 903.491 1038.3 931.597C1052.42 945.918 1069.24 957.29 1087.79 965.053C1106.34 972.815 1126.25 976.812 1146.35 976.812C1166.46 976.812 1186.37 972.815 1204.92 965.053C1223.47 957.29 1240.29 945.918 1254.4 931.597C1280.91 903.451 1295.86 866.363 1296.28 827.702C1296.7 789.042 1282.56 751.638 1256.67 722.924V723.247ZM1146.3 731.108C1158.53 730.966 1170.65 733.406 1181.88 738.267C1193.1 743.128 1203.18 750.301 1211.44 759.318C1220.45 768.236 1227.55 778.9 1232.29 790.658C1237.03 802.416 1239.31 815.018 1239.01 827.691C1239.1 844.548 1234.8 861.138 1226.52 875.822C1218.72 890.102 1207.13 901.952 1193.03 910.062C1178.76 917.972 1162.72 922.122 1146.41 922.122C1130.09 922.122 1114.05 917.972 1099.78 910.062C1085.54 902.031 1073.82 890.169 1065.97 875.822C1057.66 861.151 1053.36 844.553 1053.48 827.691C1053.19 815.038 1055.46 802.456 1060.16 790.705C1064.86 778.953 1071.89 768.276 1080.83 759.318C1089.13 750.26 1099.26 743.063 1110.54 738.2C1121.83 733.338 1134.01 730.921 1146.3 731.108Z" fill="#A4CE8A"/>
<path d="M1872.02 865.054C1864.93 878.02 1855.88 889.822 1845.21 900.048C1836.61 907.352 1826.71 912.976 1816.03 916.63C1804.67 920.899 1792.64 923.087 1780.5 923.091C1768.82 923.378 1757.21 921.195 1746.43 916.687C1735.65 912.178 1725.94 905.444 1717.94 896.926C1703.06 881.427 1693.97 861.273 1692.21 839.858H1930.71V829.091C1931.32 793.817 1919.93 759.38 1898.4 731.43C1884.67 713.492 1866.86 699.079 1846.45 689.381C1826.04 679.683 1803.62 674.978 1781.04 675.655C1759.02 674.998 1737.17 679.608 1717.3 689.104C1697.43 698.6 1680.11 712.705 1666.8 730.246C1644.11 759.115 1632.28 795.028 1633.36 831.725C1634.45 868.423 1648.37 903.577 1672.72 931.058C1686.45 946.558 1703.49 958.781 1722.57 966.831C1741.65 974.881 1762.29 978.552 1782.98 977.574C1802.29 977.811 1821.48 974.527 1839.61 967.883C1856.38 961.449 1871.77 951.874 1884.94 939.672C1899.45 925.853 1911.38 909.553 1920.15 891.542L1925.21 881.636L1877.08 856.333L1872.02 865.054ZM1866.53 788.067H1699.31C1704.25 774.61 1712.29 762.509 1722.79 752.75C1739.09 737.974 1760.44 729.999 1782.44 730.461C1796.46 730.445 1810.31 733.495 1823.03 739.398C1834.84 744.702 1845.27 752.661 1853.5 762.656C1859.22 770.35 1863.62 778.936 1866.53 788.067Z" fill="#A4CE8A"/>
<path d="M1581.73 744.675C1573.84 725.979 1560.53 710.077 1543.51 699.021C1525.96 687.626 1505.42 681.704 1484.5 682.008C1463.74 681.891 1443.3 687.04 1425.07 696.975C1414.5 702.838 1404.76 710.079 1396.1 718.51V586.286H1339.36V977.143H1396.1V868.392C1395.26 845.149 1396.77 821.879 1400.63 798.942C1405.02 781.163 1415.07 765.293 1429.27 753.719C1442.65 742.046 1459.85 735.687 1477.61 735.845C1490.75 735.147 1503.74 738.945 1514.44 746.613C1524.37 755.317 1531.08 767.113 1533.5 780.099C1536.63 799.493 1537.78 819.155 1536.94 838.782V977.143H1593.58V829.091C1593.58 790.974 1589.81 763.302 1581.73 744.675Z" fill="#45886C"/>
<path d="M821.985 595.33H798.942L618.48 977.143H683.516L810.248 709.357L936.442 977.143H1000.08L821.985 595.33Z" fill="#45886C"/>
</svg>

After

Width:  |  Height:  |  Size: 4.5 KiB

27
public/logo.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 676 KiB

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="main-layout"> <div class="main-layout">
<Sidebar class="sidebar" /> <!-- <Sidebar class="sidebar" /> -->
<main class="content-area"> <main class="content-area">
<!-- 路由视图将渲染在这里 --> <!-- 路由视图将渲染在这里 -->
<router-view /> <router-view />

View File

@ -3,13 +3,14 @@
<div class="header-content"> <div class="header-content">
<div class="title"> <div class="title">
<el-button <el-button
class="mobile-sidebar-toggle" v-if="isMobile || settingsStore.sidebarCollapsed"
class="desktop-sidebar-toggle"
:icon="Expand" :icon="Expand"
@click="settingsStore.toggleSidebar" @click="settingsStore.toggleSidebar"
text text
v-if="isMobile"
/> />
<span class="title-text">{{ title }}</span> <span class="title-text">{{ title }}</span>
<el-tag v-if="chatStore.currentConversation?.conversationStatus === 'typing'" <el-tag v-if="chatStore.currentConversation?.conversationStatus === 'typing'"
size="small" size="small"
class="status-tag" class="status-tag"
@ -29,7 +30,7 @@
> >
</el-button> </el-button>
</el-tooltip> </el-tooltip>
<el-tooltip content="设置" placement="bottom"> <!-- <el-tooltip content="设置" placement="bottom">
<el-button <el-button
class="action-btn" class="action-btn"
:icon="Setting" :icon="Setting"
@ -37,7 +38,7 @@
text text
> >
</el-button> </el-button>
</el-tooltip> </el-tooltip> -->
<el-tooltip :content="hasBackground ? '客户背景' : '暂无客户背景信息'" placement="bottom" v-if="hasBackground"> <el-tooltip :content="hasBackground ? '客户背景' : '暂无客户背景信息'" placement="bottom" v-if="hasBackground">
<el-button <el-button
class="action-btn" class="action-btn"
@ -186,6 +187,34 @@ onUnmounted(() => {
padding-top: 1px; padding-top: 1px;
} }
.desktop-sidebar-toggle {
height: 24px;
width: 24px;
padding: 0;
color: #666;
transition: all 0.3s ease;
border: none;
background: transparent !important;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
&:hover {
color: #07c160;
background: transparent !important;
}
&:focus {
outline: none;
box-shadow: none;
}
:deep(.el-icon) {
font-size: 18px;
margin-top: 1px;
}
}
.status-tag { .status-tag {
font-weight: normal; font-weight: normal;
flex-shrink: 0; flex-shrink: 0;

View File

@ -552,7 +552,7 @@ onUnmounted(() => {
line-height: 1.5; line-height: 1.5;
font-size: 16px; font-size: 16px;
padding: 8px 12px; padding: 8px 12px;
border-radius: 4px; border-radius: 6px;
white-space: pre-wrap; white-space: pre-wrap;
position: relative; position: relative;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);

View File

@ -8,12 +8,26 @@
></div> ></div>
<div class="mode-selector" :class="{ 'collapsed': settingsStore.sidebarCollapsed }"> <div class="mode-selector" :class="{ 'collapsed': settingsStore.sidebarCollapsed }">
<div class="mode-header"> <div class="mode-header">
<h3 class="mode-title">对话场景</h3> <div class="mode-title" v-if="!settingsStore.sidebarCollapsed">
<div class="header-actions"> <img
<HistoryButton v-if="!settingsStore.sidebarCollapsed" :icon-only="true" /> src="/lgogo.svg"
alt="Logo"
class="lgoo-icon"
/>
</div>
<div class="collapsed-logo" v-else>
<img
src="/logo.svg"
alt="Collapsed Logo"
class="lgoo-icon-small"
/>
</div>
<div v-if="!settingsStore.sidebarCollapsed" class="header-actions">
<!-- <HistoryButton v-if="!settingsStore.sidebarCollapsed" :icon-only="true" /> -->
<el-button <el-button
class="collapse-btn" class="collapse-btn"
:icon="settingsStore.sidebarCollapsed ? Expand : Fold" :icon="Fold"
text text
bg bg
@click="settingsStore.toggleSidebar" @click="settingsStore.toggleSidebar"
@ -146,7 +160,7 @@ onUnmounted(() => {
$primary-color: #4CAF50; $primary-color: #4CAF50;
$text-color: #333; $text-color: #333;
$text-color-dark: #fff; $text-color-dark: #fff;
$background-color: #ffffff; $background-color: #F7F7F7;
$background-color-dark: #1e1e1e; $background-color-dark: #1e1e1e;
$border-color: #e0e0e0; $border-color: #e0e0e0;
$border-color-dark: #333; $border-color-dark: #333;
@ -169,19 +183,25 @@ $hover-color-dark: #2d2d2d;
width: 64px; width: 64px;
min-width: 64px; min-width: 64px;
.mode-title { .mode-header {
display: none; justify-content: center;
padding: 0;
} }
.mode-item { .mode-item {
padding: 15px; padding: 15px 0;
justify-content: center; justify-content: center;
.mode-name { .mode-name {
display: none; display: none;
} }
}
.emoji-icon {
font-size: 24px;
width: 32px;
}
}
.header-actions { .header-actions {
width: 100%; width: 100%;
justify-content: center; justify-content: center;
@ -189,14 +209,13 @@ $hover-color-dark: #2d2d2d;
} }
.mode-header { .mode-header {
padding: 0 20px; padding: 0 10px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: 10px;
height: 60px; height: 60px;
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;
.header-actions { .header-actions {
display: flex; display: flex;
align-items: center; align-items: center;
@ -211,6 +230,28 @@ $hover-color-dark: #2d2d2d;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: flex;
align-items: center;
justify-content: center;
.lgoo-icon {
vertical-align: middle;
transition: all 0.3s ease;
height: 36px;
width: auto;
}
}
.collapsed-logo {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
.lgoo-icon-small {
height: 36px;
width: auto;
}
} }
.history-btn { .history-btn {
@ -264,6 +305,7 @@ $hover-color-dark: #2d2d2d;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 5px; gap: 5px;
margin-top: 10px;
} }
.mode-item { .mode-item {
@ -293,6 +335,7 @@ $hover-color-dark: #2d2d2d;
.emoji-icon { .emoji-icon {
font-size: 20px; font-size: 20px;
width: 24px; width: 24px;
height: 24px;
text-align: center; text-align: center;
line-height: 1; line-height: 1;
display: inline-flex; display: inline-flex;
@ -385,7 +428,13 @@ $hover-color-dark: #2d2d2d;
z-index: 1000; z-index: 1000;
&.collapsed { &.collapsed {
transform: translateX(-240px); transform: translateX(-100%);
width: 64px;
min-width: 64px;
.collapsed-logo {
padding: 0 5px;
}
} }
&:not(.collapsed) { &:not(.collapsed) {