| | |
| | | <template> |
| | | <div class="flex items-center"> |
| | | <img src="/static/images/logo/logo-mini.svg" alt="logo" class="layout-logo-medium-img" /> |
| | | <p class="set-waterTitle"><strong>WI 水务智能专家</strong>智慧水务助手</p> |
| | | <div class="flex items-center mb-8"> |
| | | <img src="/static/images/logo/logoWithNoName.png" alt="logo" class="layout-logo-medium-img" /> |
| | | <p class="set-waterTitle"><strong>WI水务智能平台</strong>智慧水务数据挖掘者</p> |
| | | </div> |
| | | <div class="flex items-center pc-roleList"> |
| | | <!-- <div v-for="(item, index) in llmList" :key="item.logicId" class="flex items-center pl-6" @click="handleClick(item)"> |
| | | <div class="modelItem cursor-pointer flex items-center" :class="{ modelItemActive: item.logicId === activeLLMId }"> |
| | | <img :src="item.icon" alt="icon" class="set-icon box-border" /> |
| | | <span>{{ item.logicTitle }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="flex items-center cursor-pointer pl-5"> |
| | | <div class="modelItem cursor-pointer flex items-center"> |
| | | <img src="/static/images/wave/More.png" alt="icon" class="set-icon-more box-border" /> |
| | | <span>更多</span> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <PlayBar v-model="inputValue" @send-click="sendClick" :is-home="true"/> |
| | | <!-- <div class="flex items-center pc-roleList"></div> --> |
| | | <PlayBar style="width: 760px" v-model="inputValue" @send-click="sendClick" :is-home="true" /> |
| | | </template> |
| | | |
| | | <script setup lang="ts"> |
| | | import { ElMessage } from 'element-plus'; |
| | | import { onMounted, ref } from 'vue'; |
| | | import { ref } from 'vue'; |
| | | import { GetLLMList, setHistoryGroupTitle } from '/@/api/ai/chat'; |
| | | import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue'; |
| | | import router from '/@/router'; |
| | | import { activeChatRoom, activeLLMId, activeSectionAId } from '/@/stores/chatRoom'; |
| | | import emitter from '/@/utils/mitt'; |
| | | import { activeChatRoom, activeLLMId } from '/@/stores/chatRoom'; |
| | | import { handleNormalAuth } from '/@/utils/request'; |
| | | |
| | | const emits = defineEmits(['sendClick']); |
| | | const inputValue = ref('你是谁?'); |
| | | const inputValue = ref(''); |
| | | |
| | | const sendClick = async (cb) => { |
| | | if (!inputValue.value) return; |
| | | if (!activeSectionAId.value) { |
| | | ElMessage.warning('请选择应用场景'); |
| | | return; |
| | | } |
| | | if (!inputValue.value.trim()) return; |
| | | |
| | | if (!handleNormalAuth()) { |
| | | return; |
| | | } |
| | |
| | | setLLm(item.logicId); |
| | | }; |
| | | |
| | | const updateChatInput = (val)=>{ |
| | | const updateChatInput = (val) => { |
| | | inputValue.value = val; |
| | | |
| | | } |
| | | }; |
| | | |
| | | defineExpose({ |
| | | updateChatInput |
| | | }) |
| | | |
| | | |
| | | updateChatInput, |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .set-waterTitle { |
| | |
| | | background-color: #1c86ff; |
| | | border-color: #1c86ff; |
| | | color: #fff; |
| | | } |
| | | .playInput { |
| | | align-items: flex-start; |
| | | width: 760px; |
| | | position: relative; |
| | | padding: 4px 4px 4px 12px; |
| | | |
| | | display: flex; |
| | | -webkit-box-align: end; |
| | | -ms-flex-align: end; |
| | | align-items: flex-end; |
| | | -webkit-box-sizing: border-box; |
| | | box-sizing: border-box; |
| | | border-radius: 22px; |
| | | border: 1px solid #00000030; |
| | | -webkit-box-shadow: 0 0 0 1px transparent, 0 3px 16px 0 #dee0f3; |
| | | box-shadow: 0 0 0 1px transparent, 0 3px 16px 0 #dee0f3; |
| | | -webkit-transition: border-color 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out; |
| | | transition: border-color 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out; |
| | | -o-transition: border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out; |
| | | transition: border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out; |
| | | transition: border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out; |
| | | background-color: #fff; |
| | | .assembly { |
| | | position: relative; |
| | | align-self: flex-end; |
| | | margin-right: 12px; |
| | | .label { |
| | | height: 38px; |
| | | } |
| | | } |
| | | .set-input { |
| | | position: relative; |
| | | vertical-align: bottom; |
| | | font-size: 14px; |
| | | display: inline-block; |
| | | width: 100%; |
| | | .set-inputAnswer { |
| | | min-height: 36px; |
| | | height: 36px; |
| | | padding: 3px 0; |
| | | line-height: 20px; |
| | | border: none; |
| | | background-color: transparent; |
| | | color: #333; |
| | | font-size: 15px; |
| | | } |
| | | :deep(.el-input__wrapper) { |
| | | box-shadow: unset; |
| | | } |
| | | } |
| | | .upload_img { |
| | | .imgbox { |
| | | height: 38px; |
| | | .set-img-icon { |
| | | width: 38px; |
| | | height: 38px; |
| | | border-radius: 5px; |
| | | transition: background-color 0.1s ease-in-out; |
| | | } |
| | | .send { |
| | | width: 36px; |
| | | height: 36px; |
| | | border-radius: 50%; |
| | | background-color: #2c1e1d; |
| | | img { |
| | | margin: 4px 0 0 -2px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | <style lang="scss"> |