¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="home"> |
| | | <div style="background: white;color: black;font-size: 30px;" class="logo"> |
| | | <div class="logo-one" style="font-weight: bold"> |
| | | <!-- <img src="/src/assets/img/logo.png" style="width: 50px;height: 50px;margin: 0 10px" />--> |
| | | <div><i>大模åAIå°æºæ£å¨ä¸ºæ¨æå¡</i></div> |
| | | </div> |
| | | <div class="input"> |
| | | <input type="text" v-model="keyWord" class="input-text" placeholder="ç»å°æºåéæ¶æ¯" @keyup.enter="sendMsg" /> |
| | | <div style="font-size: 13px;color: #808080;display: flex;justify-content: space-between;padding: 10px;"> |
| | | <div style="display: flex;justify-content: center;align-items: center;"> |
| | | <!-- <div style="display: flex;justify-content: center;align-items: center;">--> |
| | | <!-- <img src="/src/assets/img/logo.png" style="width: 15px;height: 15px;margin: 0 5px" />--> |
| | | <!-- <span>深度æè(R1)</span>--> |
| | | <!-- </div>--> |
| | | <!-- <div style="display: flex;justify-content: center;align-items: center;">--> |
| | | <!-- <img src="/src/assets/img/logo.png" style="width: 15px;height: 15px;margin: 0 5px" />--> |
| | | <!-- <span>èç½æç´¢</span>--> |
| | | <!-- </div>--> |
| | | </div> |
| | | <div style="display: flex;justify-content: center;align-items: center;margin-right: 5px;"> |
| | | <!-- <img src="/src/assets/img/logo.png" style="width: 25px;height: 25px;margin: 0 5px" />--> |
| | | <img src="@/assets/img/emoji/rocket.png" style="width: 25px;height: 25px;margin: 0 5px" @click="sendMsg"/> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div style="width: 780px;"> |
| | | <div style="font-weight: bold;margin: 30px 0;">ç鍿¨è</div> |
| | | <div class="keywords"> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordOne)"> |
| | | <p class="fontSize aaa">{{keyWordOne}}</p> |
| | | <p class="fontSize">éé¨ã管éæå®¹å¨å¯å°å¤±æå¯¼è´æ°ä½æ³æ¼ï¼å¦æ°¯æ°ãæ°¨æ°ï¼ã</p> |
| | | <p class="fontSize">åæï¼ä¸æ¯ãçç¸ãç¯å¢æ±¡æã</p> |
| | | </div> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordTwo)"> |
| | | <p class="fontSize aaa">{{keyWordTwo}}</p> |
| | | <p class="fontSize">é¢ç¶æç½ä½å ææç²å³ãè
èæè¶
åç ´è£</p> |
| | | <p class="fontSize">åå ï¼æªå®ææ£æµãè¿è§å
è£
æå¤é¨æå»ãã</p> |
| | | </div> |
| | | </div> |
| | | <div class="keywords"> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordFive)"> |
| | | <p class="fontSize aaa">{{keyWordFive}}</p> |
| | | <p class="fontSize">è£
å¸è¿ç¨ä¸è¿è§æä½ï¼å¦éè®æ¬è¿ãæ··è£
ç¦å¿ç©è´¨ï¼ã</p> |
| | | <p class="fontSize">è¿è¾é䏿ªåºå®å®¹å¨ï¼å¯¼è´ç¢°ææå¾åã</p> |
| | | </div> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordSix)"> |
| | | <p class="fontSize aaa">{{keyWordSix}}</p> |
| | | <p class="fontSize">ç¼ºä¹æ³æ¼åºæ¥é¢æ¡ï¼äººåå¹è®ä¸è¶³ã</p> |
| | | <p class="fontSize">ææ´è®¾å¤ï¼å¦é²æ¯é¢å
·ãå µæ¼å·¥å
·ï¼ç¼ºå¤±æå¤±æã</p> |
| | | </div> |
| | | </div> |
| | | <div class="keywords"> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordServen)"> |
| | | <p class="fontSize aaa">{{keyWordServen}}</p> |
| | | <p class="fontSize">æªåå¾è¿è¾èµè´¨ï¼å¦ADR/RIDçå½é
è§èï¼ã</p> |
| | | <p class="fontSize">路线è§åä¸åè§ï¼å¦ç©¿è¶äººå£å¯éåºï¼ã</p> |
| | | </div> |
| | | <div class="keywordss" @click="sendMsgDefault(keyWordEight)"> |
| | | <p class="fontSize aaa">{{keyWordEight}}</p> |
| | | <p class="fontSize">ä¼ æå¨é¨ç½²ï¼å¦çº¢å¤æ°ä½æ¢æµå¨ãçµåå¦ä¼ æå¨ï¼ã</p> |
| | | <p class="fontSize">宿¶æ°æ®ä¼ è¾è³çæ§å¹³å°ï¼è§¦åæ¥è¦ã</p> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div></div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref,onMounted } from "vue"; |
| | | import {useRoute,useRouter} from "vue-router" |
| | | const route = useRoute(); |
| | | const router = useRouter(); |
| | | const keyWord = ref(''); |
| | | const keyWordOne = ref('å±é©æ°ä½æ³æ¼æä¹å'); |
| | | const keyWordTwo = ref('è¿è¾å®¹å¨å¤±ææä¹å'); |
| | | const keyWordFive = ref('æä½ä¸å½æä¹å'); |
| | | const keyWordSix = ref('åºæ¥ååºä¸è¶³æä¹å'); |
| | | const keyWordServen = ref('åè§æ§é®é¢'); |
| | | const keyWordEight = ref('æ³æ¼çæµææ¯æåªäº'); |
| | | |
| | | const sendMsg = () => { |
| | | router.push({ path: '/main/MobileChat',query:{ keyWord: keyWord.value} }) |
| | | } |
| | | |
| | | const sendMsgDefault = (value) => { |
| | | router.push({ path: '/main/MobileChat',query:{ keyWord: value} }) |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .home { |
| | | width: 100%; |
| | | height: 91vh; |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | |
| | | .logo { |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | flex-direction: column; |
| | | z-index: 99; |
| | | width: 100%; |
| | | height: 100%; |
| | | color: #fff; |
| | | cursor: pointer; |
| | | overflow: hidden; |
| | | background-color: #F0F6F9; |
| | | |
| | | .keywords { |
| | | display: flex; |
| | | width: 100%; |
| | | height: 90px; |
| | | line-height: 80px; |
| | | justify-content: space-between; |
| | | margin: 10px 0; |
| | | |
| | | .keywordss { |
| | | box-shadow: 0px 2px 5px #b8b8b8; |
| | | width: 48%; |
| | | background: #e0edfc; |
| | | border-radius: 10px; |
| | | |
| | | .aaa { |
| | | font-weight: bold; |
| | | font-size: 15px !important; |
| | | } |
| | | |
| | | .fontSize { |
| | | font-size: 13px; |
| | | height: 20px; |
| | | line-height: 20px; |
| | | margin: 6px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .logo-one { |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .input { |
| | | width: 780px; |
| | | height: 150px; |
| | | background: #f5f4f4; |
| | | border-radius: 20px; |
| | | |
| | | .input-text { |
| | | font-size: 18px; |
| | | width: 568px; |
| | | border-radius: 20px 20px 0 0; |
| | | height: 90px; |
| | | padding-left: 10px; |
| | | border: none; |
| | | color: black; |
| | | background-color: #f5f4f4; |
| | | } |
| | | |
| | | .input-text:focus { |
| | | outline: none; |
| | | border: none; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |