From 0b238cbcce972e907fb2f6864e5f0c2772aeba0c Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期一, 15 七月 2024 14:44:51 +0800 Subject: [PATCH] Merge branch 'master' of http://47.103.154.90:83/r/WI/Web.V1.0 --- src/views/project/ch/home/component/waterRight/center.vue | 431 ++++++++++++++++++++++++++++------------------------- 1 files changed, 228 insertions(+), 203 deletions(-) diff --git a/src/views/project/ch/home/component/waterRight/center.vue b/src/views/project/ch/home/component/waterRight/center.vue index ed3b2ba..6f9f6bb 100644 --- a/src/views/project/ch/home/component/waterRight/center.vue +++ b/src/views/project/ch/home/component/waterRight/center.vue @@ -7,7 +7,7 @@ <span class="change cursor-pointer" @click="advanceExampleClick">楂樼骇绀轰緥 ></span> </div> <div class="cursor-pointer"> - <span class="mr-1 changeBatch">鎹竴鎵�</span> + <span class="mr-1 changeBatch" @click="batchChange">鎹竴鎵�</span> <i class="iconfont icon-shuaxin"></i> </div> </div> @@ -16,165 +16,165 @@ <div class="main_item flex items-center cursor-pointer" v-for="(item, index) in state.exampleContent" - :key="item.ID" - :class="{ main_item_active: item.ID === state.exampleIndex }" + :key="index" + :class="{ main_item_active: item.sample_id === activeSampleId }" @click="changeExample(item)" > <div class="left flex items-center justify-center" :class="['color' + index]"> <img :src="item.Icon" alt="" /> </div> <div class="right"> - <h4>{{ item.Title }}</h4> - <p>{{ item.Content }}</p> + <h4>{{ item.sample_title }}</h4> + <p>{{ item.sample_question }}</p> </div> </div> </div> - <el-drawer v-model="state.isShowAdvanceExample" direction="rtl" size="354"> - <div class="box-border w100 bg-[#e0e7fb] relative flex items-center justify-center" style="padding: 30px 20px 26px"> - <div - class="box-border flex w-[203px] h-[32px] rounded-md items-center justify-between cursor-pointer relative border border-solid border-[#2c2d33]" - > - <div - class="tabbar-item" - :class="state.activeName === item.ID ? 'set-tabbar-active' : ''" - @click="handleTabClick(item)" - v-for="item in state.tabNameList" - :key="item.ID" - > - {{ item.Name }} - </div> - </div> - </div> - <div class="box-border w-[354px] flex-1 min-h-0 bg-[#e0e7fb]" style="height: calc(100% - 88px)" v-show="state.activeName == 1"> - <div class="flex flex-col w100 h100 pt-0 pr-[15px] pb-0 pl-[20px] overflow-auto"> - <div class="flex items-center w100 h-[30px] border border-solid border-[#b2b2b2] transition-[border-color 1s] rounded-2xl"> - <el-input v-model="state.searchInput" placeholder="鎼滅储鏇村" class="set-input" :prefix-icon="Search"> </el-input> - </div> - <div class="mt20 w100 relative"> + <div class="custom-drawer"> + <el-drawer v-model="state.isShowAdvanceExample" direction="rtl" size="354"> + <template #header style="padding: 30px 20px 26px"> + <div class="box-border w100 bg-[#e0e7fb] relative flex items-center justify-center"> <div - class="overflow-hidden max-h-[36px] transition-[max-height 0.2s] w100 flex flex-wrap text-xs leading-[14px] m-[-5px]" - :class="{ 'set-expand-active': state.isShowExpand }" + class="box-border flex w-[203px] h-[32px] rounded-md items-center justify-between cursor-pointer relative border border-solid border-[#2c2d33]" > <div - v-for="item in state.exampleTabList" + class="tabbar-item" + :class="state.activeName === item.ID ? 'set-tabbar-active' : ''" + @click="handleTabClick(item)" + v-for="item in state.tabNameList" :key="item.ID" - :class="{ 'set-label-active': state.activeLabelName === item.ID }" - @click="handleLabelClick(item)" - class="cursor-pointer m-[5px] py-[5px] px-[10px] rounded-xl border border-solid border-[#b2b2b2] bg-[#e0e7f] text-[#4c4c4c] transition-[background-color .1s, color .1s, border-color .1s]" > - {{ item.Title }} + {{ item.Name }} </div> </div> - <div class="bg-[#e0e7fb] absolute right-0 top-0 text-[#131313] w-[30px] h-[26px] cursor-pointer flex items-center"> - <i class="iconfont icon-bolangneng" title="灞曞紑" @click="handleExpandClick(1)" v-show="!state.isShowExpand"></i> - <i class="iconfont icon-zhongduancanshu" title="鏀剁缉" @click="handleExpandClick(2)" v-show="state.isShowExpand"></i> + </div> + </template> + <div class="box-border w-[354px] flex-1 min-h-0 bg-[#e0e7fb]" v-show="state.activeName == 1"> + <div class="flex flex-col w100 h100 pt-0 pr-[15px] pb-0 pl-[20px] overflow-auto"> + <div class="flex items-center w100 h-[30px] border border-solid border-[#b2b2b2] transition-[border-color 1s] rounded-2xl"> + <el-input v-model="queryParams.sample_title" placeholder="鎼滅储鏇村" class="set-input" :prefix-icon="Search" clearable> + </el-input> </div> - <div class="mt20 w100"> - <div class="w100 pb-[20px]" v-for="item in state.exampleContentList" :key="item.ID"> - <div class="cursor-pointer flex box-border p-[12px] w100 rounded bg-[#f5f7fd] transition-[background-color .2s]"> - <i - class="iconfont icon-chazhaobiaodanliebiao pl-[2px] w-[16px] h-[16px] font12 text-[#fff] transform-[scale(.85)] rounded-[50%]" - :style="`background-color:${item.BgColor}`" - ></i> - <div class="ml-6 flex-1 min-w-0"> - <div class="text-sm text-[#000] m-0 p-0 font-bold">{{ item.Title }}</div> - <div class="mt-[6px] text-[13px] text-[#666] h-[20px] whitespace-nowrap text-ellipsis overflow-hidden"> - {{ item.Content }} - </div> - </div> + <div class="mt20 w100 relative"> + <div + class="overflow-hidden max-h-[36px] transition-[max-height 0.2s] w100 flex flex-wrap text-xs leading-[14px] m-[-5px]" + :class="{ 'set-expand-active': state.isShowExpand }" + > + <div + v-for="item in state.exampleTabList" + :key="item.ID" + :class="{ 'set-label-active': state.activeLabelName === item.ID }" + @click="handleLabelClick(item)" + class="cursor-pointer m-[5px] py-[5px] px-[10px] rounded-xl border border-solid border-[#b2b2b2] bg-[#e0e7f] text-[#4c4c4c] transition-[background-color .1s, color .1s, border-color .1s]" + > + {{ item.Title }} </div> </div> - </div> - </div> - </div> - </div> - <div class="box-border w-[354px] flex-1 min-h-0 bg-[#e0e7fb]" style="height: calc(100% - 88px)" v-show="state.activeName == 2"> - <div class="flex flex-col w100 h100 pt-0 pr-[15px] pb-0 pl-[20px] overflow-auto"> - <div class="flex items-center w100 h-[30px] border border-solid border-[#b2b2b2] transition-[border-color 1s] rounded-2xl"> - <el-input v-model="state.searchInput" placeholder="鎼滅储鏇村" class="set-input" :prefix-icon="Search"> </el-input> - </div> - <div class="mt20 w100 relative"> - <div - class="overflow-hidden max-h-[36px] transition-[max-height 0.2s] w100 flex flex-wrap text-xs leading-[14px] m-[-5px]" - :class="{ 'set-expand-active': state.isShowExpand }" - > - <div - v-for="item in state.instructList" - :key="item.ID" - :class="{ 'set-label-active': state.activeInstructName === item.ID }" - @click="handleInstructClick(item)" - class="cursor-pointer m-[5px] py-[5px] px-[10px] rounded-xl border border-solid border-[#b2b2b2] bg-[#e0e7f] text-[#4c4c4c] transition-[background-color .1s, color .1s, border-color .1s]" - > - {{ item.Title }} + <div class="bg-[#e0e7fb] absolute right-0 top-0 text-[#131313] w-[30px] h-[26px] cursor-pointer flex items-center"> + <i class="iconfont icon-bolangneng" title="灞曞紑" @click="handleExpandClick(1)" v-show="!state.isShowExpand"></i> + <i class="iconfont icon-zhongduancanshu" title="鏀剁缉" @click="handleExpandClick(2)" v-show="state.isShowExpand"></i> </div> - </div> - <div class="bg-[#e0e7fb] absolute right-0 top-0 text-[#131313] w-[30px] h-[26px] cursor-pointer flex items-center"> - <i class="iconfont icon-bolangneng" title="灞曞紑" @click="handleExpandClick(1)" v-show="!state.isShowExpand"></i> - <i class="iconfont icon-zhongduancanshu" title="鏀剁缉" @click="handleExpandClick(2)" v-show="state.isShowExpand"></i> - </div> - <div class="mt20 w100"> - <div class="w100 pb-[20px] flex overflow-auto flex-col" v-for="item in state.instructContentList" :key="item.ID"> - <div class="bg-[#f5f7fd] p-[12px] transition-[background-color .2s] flex flex-col rounded-2xl"> - <div class="flex justify-between"> - <span class="set-title">{{ item.Title }}</span> - </div> - <div class="example-body ellipsis">{{ item.Content }}</div> - <div class="example-bottom"> - <div class="flex w-[190px] items-center flex-nowrap"> - <div v-for="exampleItem in item.exampleBottomList" :key="item.ID"> - <span class="example-item">{{ exampleItem }}</span> + <div class="mt20 w100"> + <div class="w100 pb-[20px]" v-for="item in queryData" :key="item.sample_id"> + <div + class="cursor-pointer flex box-border p-[12px] w100 rounded bg-[#f5f7fd] transition-[background-color .2s]" + @click="changeExample(item)" + > + <i + class="iconfont icon-chazhaobiaodanliebiao pl-[2px] w-[16px] h-[16px] font12 text-[#fff] transform-[scale(.85)] rounded-[50%]" + :style="`background-color:${item.BgColor}`" + ></i> + <div class="ml-6 flex-1 min-w-0"> + <div class="text-sm text-[#000] m-0 p-0 font-bold">{{ item.sample_title }}</div> + <div class="mt-[6px] text-[13px] text-[#666] h-[20px] whitespace-nowrap text-ellipsis overflow-hidden"> + {{ item.sample_question }} </div> </div> - <el-button type="primary" class="set-button">浣跨敤</el-button> </div> </div> </div> </div> </div> </div> - </div> - </el-drawer> + <div class="box-border w-[354px] flex-1 min-h-0 bg-[#e0e7fb]" v-show="state.activeName == 2"> + <div class="flex flex-col w100 h100 pt-0 pr-[15px] pb-0 pl-[20px] overflow-auto"> + <div class="flex items-center w100 h-[30px] border border-solid border-[#b2b2b2] transition-[border-color 1s] rounded-2xl"> + <el-input + v-model="instructParams.template_title" + placeholder="鎼滅储鏇村" + class="set-input" + :prefix-icon="Search" + clearable + > + </el-input> + </div> + <div class="mt20 w100 relative"> + <div + class="overflow-hidden max-h-[36px] transition-[max-height 0.2s] w100 flex flex-wrap text-xs leading-[14px] m-[-5px]" + :class="{ 'set-expand-active': state.isShowExpand }" + > + <div + v-for="item in state.instructList" + :key="item.ID" + :class="{ 'set-label-active': state.activeInstructName === item.ID }" + @click="handleInstructClick(item)" + class="cursor-pointer m-[5px] py-[5px] px-[10px] rounded-xl border border-solid border-[#b2b2b2] bg-[#e0e7f] text-[#4c4c4c] transition-[background-color .1s, color .1s, border-color .1s]" + > + {{ item.Title }} + </div> + </div> + <div class="bg-[#e0e7fb] absolute right-0 top-0 text-[#131313] w-[30px] h-[26px] cursor-pointer flex items-center"> + <i class="iconfont icon-bolangneng" title="灞曞紑" @click="handleExpandClick(1)" v-show="!state.isShowExpand"></i> + <i class="iconfont icon-zhongduancanshu" title="鏀剁缉" @click="handleExpandClick(2)" v-show="state.isShowExpand"></i> + </div> + <div class="mt20 w100"> + <div class="w100 pb-[20px] flex overflow-auto flex-col" v-for="item in showInstructList" :key="item.template_id"> + <div class="bg-[#f5f7fd] p-[12px] transition-[background-color .2s] flex flex-col rounded-2xl"> + <div class="flex justify-between"> + <span class="set-title">{{ item.template_title }}</span> + </div> + <div class="example-body ellipsis">{{ item.template_value }}</div> + <div class="example-bottom"> + <span class="example-item">{{ item.template_type }}</span> + <el-button type="primary" class="set-button" @click="templateUseClick(item)">浣跨敤</el-button> + </div> + </div> + </div> + </div> + </div> + </div> + </div> + </el-drawer> + </div> + <el-dialog v-model="state.useInstructDialog" :title="state.instructInfo?.template_title" width="500" :before-close="handleClose"> + <el-input v-model="state.inputInstruct" :rows="10" type="textarea"></el-input> + <template #footer> + <div class="dialog-footer"> + <el-button @click="handleClose">鍙栨秷</el-button> + <el-button type="primary" @click="submitInstruct"> 纭 </el-button> + </div> + </template> + </el-dialog> </div> </template> <script setup lang="ts"> import { Search } from '@element-plus/icons-vue'; -import { onMounted, reactive } from 'vue'; +import { computed, onMounted, reactive, ref, watch } from 'vue'; +import { getSelectSample, getUserTemplateList } from '/@/api/ai/chat'; +import { activeRoomId, activeSampleId, roomConfig, setRoomConfig } from '/@/stores/chatRoom'; +import emitter from '/@/utils/mitt'; +import { useSearch } from '/@/hooks/useSearch'; +import { debounce, getRecentDateRange } from '/@/utils/util'; + let state = reactive({ - exampleContent: [ - { - ID: 1, - Icon: '/static/images/wave/ChatImg.png', - Title: '瑙h鏉庡洓鐨勫弽搴�', - Content: '寮犱笁鎵撲簡鏉庡洓涓�宸存帉,鏉庡洓瀵瑰紶涓夎:"浣犳槸涓嶆槸娌″悆楗�",鏉庡洓璇磋繖鍙ヨ瘽鍚箟鏄�?', - }, - { - ID: 2, - Icon: '/static/images/wave/ChatImg.png', - Title: '瑙i噴鍔姏涓庡唴鍗风殑鍖哄埆', - Content: '鎬庝箞瑙i噴鍔姏鍜屽唴鍗风殑鍖哄埆?', - }, - { - ID: 3, - Icon: '/static/images/wave/ChatImg.png', - Title: '鍏朵粬闂', - Content: '璇锋悳绱綘鎯崇煡閬撶殑闂', - }, - { - ID: 4, - Icon: '/static/images/wave/ChatImg.png', - Title: '缁欏疂瀹濆彇鏈夋枃鍖栧唴娑电殑鍚嶅瓧', - Content: '璇蜂互璇楃粡涓殑鍏告晠缁欑敺瀹濆疂鍙栧悕锛屽椤撅紝鍚嶅瓧瑕佹眰3涓瓧锛岀粰5涓悕瀛椾緵鎴戦�夋嫨銆�', - }, - ], + exampleContent: [], + exampleRandomContent: [], tabNameList: [ { ID: 1, Name: '鎻愰棶绀轰緥' }, { ID: 2, Name: '鎸囦护妯℃澘' }, ], - exampleIndex: 0, isShowAdvanceExample: false, activeName: 1, - searchInput: '', exampleTabList: [ { ID: 1, @@ -243,96 +243,62 @@ Title: '鍙戠幇鎺㈢储', }, ], - exampleContentList: [ - { - ID: 1, - Title: '濡備綍鎻愬崌鑷繁鐨勮亴鍦虹珵浜夊姏锛�', - Content: - '鑱屽満绔炰簤鍔涙槸琛¢噺涓�涓汉鏄惁鎴愬姛鐨勯噸瑕佹爣鍑嗐�傝亴鍦虹珵浜夊姏鐨勬彁鍗囷紝闇�瑕侀暱鏈熺殑鍔姏鍜屽潥鎸併�備笅闈㈡槸涓�浜涙彁鍗囪亴鍦虹珵浜夊姏鐨勬柟娉曪細1. 淇濇寔涓撴敞锛氫笓娉ㄤ簬鑷繁鐨勫伐浣滐紝涓嶆柇瀛︿範鏂版妧鑳斤紝鎻愬崌鎶�鑳芥按骞炽��2. 淇濇寔瀛︿範锛氫笉鏂涔犳柊鐭ヨ瘑锛屼笉鏂彁鍗囪嚜宸辩殑涓撲笟鐭ヨ瘑銆�3. 淇濇寔鐑儏锛氫繚鎸佺Н鏋佸悜涓婄殑蹇冩�侊紝涓嶆柇杩芥眰鏂颁簨鐗┿��4. 淇濇寔閫傚綋鐨勪紤鎭細閫傚綋鐨勪紤鎭彲浠ヨ韬綋鏇村姞鍋ュ悍锛屾彁楂樺伐浣滄晥鐜囥��5. 淇濇寔绉瀬鐨勬�佸害锛氱Н鏋佺殑鎬佸害鍙互婵�鍙戝憳宸ョ殑鍒涢�犲姏锛屾彁鍗囧伐浣滅殑绉瀬鎬с��', - }, - { - ID: 2, - Title: '鐖辨姢鍔ㄧ墿瑙嗛鍓ф湰', - Content: '璇锋媴浠荤紪鍓э紝鎴戦渶瑕佹媿鎽勪竴涓叧浜庣埍鎶ゅ姩鐗╃殑瑙嗛锛岃缁欐垜鐢熸垚鎷嶆憚鍐呭鍜岃剼鏈�', - }, - { - ID: 3, - Title: '娉㈢矑浜岃薄鎬�', - Content: '瑙i噴涓�涓嬫尝绮掍簩璞℃�х悊璁�', - }, - { - ID: 4, - Title: '濡備綍鎻愬崌鑷繁鐨勮亴鍦虹珵浜夊姏锛�', - Content: - '鑱屽満绔炰簤鍔涙槸琛¢噺涓�涓汉鏄惁鎴愬姛鐨勯噸瑕佹爣鍑嗐�傝亴鍦虹珵浜夊姏鐨勬彁鍗囷紝闇�瑕侀暱鏈熺殑鍔姏鍜屽潥鎸併�備笅闈㈡槸涓�浜涙彁鍗囪亴鍦虹珵浜夊姏鐨勬柟娉曪細1. 淇濇寔涓撴敞锛氫笓娉ㄤ簬鑷繁鐨勫伐浣滐紝涓嶆柇瀛︿範鏂版妧鑳斤紝鎻愬崌鎶�鑳芥按骞炽��2. 淇濇寔瀛︿範锛氫笉鏂涔犳柊鐭ヨ瘑锛屼笉鏂彁鍗囪嚜宸辩殑涓撲笟鐭ヨ瘑銆�3. 淇濇寔鐑儏锛氫繚鎸佺Н鏋佸悜涓婄殑蹇冩�侊紝涓嶆柇杩芥眰鏂颁簨鐗┿��4. 淇濇寔閫傚綋鐨勪紤鎭細閫傚綋鐨勪紤鎭彲浠ヨ韬綋鏇村姞鍋ュ悍锛屾彁楂樺伐浣滄晥鐜囥��5. 淇濇寔绉瀬鐨勬�佸害锛氱Н鏋佺殑鎬佸害鍙互婵�鍙戝憳宸ョ殑鍒涢�犲姏锛屾彁鍗囧伐浣滅殑绉瀬鎬с��', - }, - { - ID: 5, - Title: '鎸戦�夊悎閫傜殑绀肩墿', - Content: '璇峰コ瀹㈡埛鍚冮キ锛屽噯澶囬�佷竴涓皬绀肩墿锛岄�変粈涔堢ぜ鐗╁悎閫傚憿', - }, - { - ID: 6, - Title: '瑙f柟绋媥虏-y虏=49', - Content: '姝f暣鏁皒,y婊¤冻x^2-y^2=49锛屾眰x鍜寉鐨勫��', - }, - { - ID: 7, - Title: '璁$畻鐞冧綋浣撶Н', - Content: '璁$畻鐞冧綋浣撶Н', - }, - { - ID: 8, - Title: '鐖辨姢鍔ㄧ墿瑙嗛鍓ф湰', - Content: '璇锋媴浠荤紪鍓э紝鎴戦渶瑕佹媿鎽勪竴涓叧浜庣埍鎶ゅ姩鐗╃殑瑙嗛锛岃缁欐垜鐢熸垚鎷嶆憚鍐呭鍜岃剼鏈�', - }, - { - ID: 9, - Title: '璇楁剰缈昏瘧锛氭棩鏈堜笌鐖�', - Content: '缈昏瘧涓鸿嫳鏂囷細娴笘涓囧崈锛屽惥鐖辨湁涓夛紝鏃ャ�佹湀銆佸嵖锛屾棩涓烘湞锛屾湀涓烘毊锛屽嵖涓烘湞鏈濇毊鏆��', - }, - ], - instructContentList: [ - { - ID: 1, - Title: '璇█妫�娴嬪櫒', - Content: - '鎴戝笇鏈涗綘鍏呭綋璇█妫�娴嬪櫒銆傛垜浼氱敤浠讳綍璇█杈撳叆涓�涓彞瀛愶紝浣犱細鍥炵瓟鎴戯紝鎴戝啓鐨勫彞瀛愭槸鐢ㄥ摢绉嶈瑷�鍐欑殑銆備笉瑕佸啓浠讳綍瑙i噴鎴栧叾浠栨枃瀛楋紝鍙渶鍥炲璇█鍚嶇О鍗冲彲', - exampleBottomList: ['鏂囧鏋勬��', '璇█缈昏瘧', '楂樻晥绛栧垝'], - }, - { - ID: 2, - Title: '澶栬缁冧範', - Content: '鎴戜細鐢ㄨ嫳璇拰浣犺璇濓紝浣犱細鐢ㄨ嫳璇洖澶嶆垜鏉ョ粌涔犳垜鐨勮嫳璇彛璇�傛垜甯屾湜鎮ㄧ殑鍥炲', - exampleBottomList: ['鏂囧鏋勬��', '鑹烘湳鍒涗綔', '鍙戠幇鎺㈢储'], - }, - { - ID: 3, - Title: '鎴戞兂璁╀綘鍏呭綋鑻辫', - Content: '鎴戜細鐢ㄤ换浣曡瑷�涓庝綘浜よ皥锛屼綘浼氭娴嬭瑷�锛岀炕璇戝畠骞剁敤鎴戠殑鏂囨湰鐨勬洿姝e拰鏀硅繘鐗堟湰鐢ㄨ嫳璇洖绛斻�傛垜甯屾湜浣犵敤', - exampleBottomList: ['鏂囧鏋勬��', '椤鹃棶涓撳', '鑱屽満鍔╂墜'], - }, - { - ID: 4, - Title: '澶氳缈昏瘧', - Content: - '鎴戣姹備綘鎵紨涓�鍚嶄笓涓氱殑璇戣�呫�佹嫾鍐欑籂姝h�呮垨鏂囨湰浼樺寲鑰呯殑瑙掕壊銆傛垜灏嗙敤鍚勭璇█涓庝綘浜ゆ祦锛屼綘鍒欓渶瑕佺敤瀵瑰簲鐨勮瑷�鍦ㄦ垜鐨勬枃鏈繘琛屼慨姝e拰浼樺寲鐗堟湰銆備綘鐨勫洖绛斾粎闄愪簬淇鍜屼紭鍖栵紝涓嶅寘鎷叾浠栧唴瀹癸紝涔熶笉闇�瑕佹彁渚涜В閲娿�傚湪淇濊瘉缈昏瘧璐ㄩ噺鐨勫墠鎻愪笅锛屼綘鐨勫洖绛斿簲灏藉彲鑳界畝娲併�傛垜鐨勯鍙ヨ瘽鏄細', - exampleBottomList: ['鏂囧鏋勬��', '璇█缈昏瘧'], - }, - ], - activeLabelName: 0, activeInstructName: 0, isShowExpand: false, + useInstructDialog: false, + instructInfo: {}, + inputInstruct: '', //鍙慨鏀规寚浠� }); +const exampleList = ref([]); //妯$増鍒楄〃 +const instructContentList = ref([]); //鎸囦护鍒楄〃 + onMounted(() => { - state.exampleContentList.forEach((item) => { - item.BgColor = randomHexColor(); - }); + getSelectListSample(); + getUserTemplate(); }); +const groupedArray = computed(() => { + const groups = []; + let i = 0; + while (state.exampleRandomContent.length > i) { + groups.push(state.exampleRandomContent.slice(i, (i += 4))); + } + return groups; +}); +//鑾峰彇妯$増鍒楄〃 +const getSelectListSample = async () => { + const res = await getSelectSample({ + section_b_id: '', + }); + // console.log(res, 63); + state.exampleRandomContent = res.samples; + + const array = []; + res.samples.forEach((sample, index) => { + sample.Icon = '/static/images/wave/ChatImg.png'; + sample.BgColor = randomHexColor(); + if (index < 4) { + array.push(sample); + } + }); + exampleList.value = res.samples; + state.exampleContent = array; +}; const changeExample = (item) => { - state.exampleIndex = item.ID; + emitter.emit('updateChatInput', item.sample_question); + setRoomConfig(activeRoomId.value,'isAnswerByLLM',false); + activeSampleId.value = item.sample_id; +}; +//鑾峰彇鐢ㄦ埛妯℃澘 +const getUserTemplate = async () => { + const res = await getUserTemplateList(); + instructContentList.value = res.templates; +}; +//鎹竴鎵� +const batchChange = () => { + const index = Math.floor(Math.random() * groupedArray.value.length); + state.exampleContent = groupedArray.value[index]; }; //楂樼骇绀轰緥 const advanceExampleClick = () => { @@ -350,7 +316,7 @@ const handleInstructClick = (item) => { state.activeInstructName = item.ID; }; -//鎼滅储 + //灞曞紑鏀惰捣 const handleExpandClick = (type) => { if (type == 1) { @@ -365,6 +331,50 @@ .toString(16) .padEnd(6, '0')}`; }; +//#region ====================== templateUseClick ====================== +const templateUseClick = (row) => { + state.useInstructDialog = true; + state.instructInfo = row; + state.inputInstruct = row.template_value; +}; +const handleClose = () => { + state.useInstructDialog = false; +}; +const submitInstruct = () => { + setRoomConfig(activeRoomId.value,'isAnswerByLLM',true); + emitter.emit('updateChatInput', state.inputInstruct); + handleClose(); +}; +//#endregion +//#region ====================== 鎼滅储妯℃澘/鎸囦护 ====================== +const queryParams = ref({ + sample_title: '', +}); +const { query, queryData } = useSearch(exampleList, queryParams); + +const debounceQuery = debounce(query); + +watch( + () => queryParams.value.sample_title, + (val) => { + debounceQuery(); + } +); +//鎸囦护 +const instructParams = ref({ + template_title: '', +}); +const { query: queryInstruct, queryData: showInstructList } = useSearch(instructContentList, instructParams); + +const instructQuery = debounce(queryInstruct); + +watch( + () => instructParams.value.template_title, + (val) => { + instructQuery(); + } +); +//#endregion </script> <style scoped lang="scss"> .pc-prompts { @@ -566,4 +576,19 @@ cursor: pointer; } } +:deep(.el-drawer__header) { + padding: 30px 20px 26px !important; + box-sizing: border-box; + width: 100%; + background-color: #e0e7fb; + + position: relative; + + height: unset !important; + margin-bottom: unset !important; + border-bottom: unset !important; +} +:deep(.el-drawer__body) { + overflow-x: hidden; +} </style> -- Gitblit v1.9.3