Feat(云灵AI):界面初始化
This commit is contained in:
lifizer
@@ -26,4 +26,5 @@ export default {
|
||||
@import "./assets/css/reset.less";
|
||||
@import "./assets/css/style.less";
|
||||
@import "./assets/css/v12-style.less";
|
||||
@import "./assets/css/aiChat.less";
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function getSseConfigV1(data) {
|
||||
return request.post('/v1/chat/sse/message', data, { login: true })
|
||||
}
|
||||
|
||||
export function getCompletions(params) {
|
||||
return request.get('/v1/chat/sse/message', params, { login: true })
|
||||
}
|
||||
+7
-2
@@ -9,7 +9,7 @@ export function getSplashScreen() {
|
||||
* @returns {*}
|
||||
*/
|
||||
export function getHomeData(params) {
|
||||
return request.get("index", params, {
|
||||
return request.get("/index", params, {
|
||||
login: false
|
||||
});
|
||||
}
|
||||
@@ -211,4 +211,9 @@ export function getXiaoZhi() {
|
||||
|
||||
export function pushSystemStatic(data) {
|
||||
return request.post("/systemStats/push", data, { login: false })
|
||||
}
|
||||
}
|
||||
|
||||
// 获取AI系统设置
|
||||
export function getAiSystemInfoSetting() {
|
||||
return request.get('/ai/systemInfo', {}, { login: false })
|
||||
}
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
import {
|
||||
postAction
|
||||
} from '@/api/http.js'
|
||||
|
||||
export function makeFileTransTask(data) {
|
||||
return postAction('/app/voiceToText/makeFileTransTask', data)
|
||||
}
|
||||
|
||||
export function getFileTransResult(data) {
|
||||
return postAction('/app/voiceToText/getFileTransResult', data)
|
||||
}
|
||||
@@ -0,0 +1,699 @@
|
||||
page {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.flex-center-between {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.fix-tabbar-page {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
background-color: #fff;
|
||||
.fix-tabbar-header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 44px;
|
||||
padding-left: 24rpx;
|
||||
// background-color: #fff;
|
||||
transition: all 0.15s;
|
||||
.my-icon {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 54rpx;
|
||||
height: 54rpx;
|
||||
}
|
||||
}
|
||||
.tabbar-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 0 0 20rpx;
|
||||
.tabbar-item {
|
||||
position: relative;
|
||||
margin: 0 0 0 20rpx;
|
||||
.txt {
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
width: 112rpx;
|
||||
font-size: 40rpx;
|
||||
line-height: 48rpx;
|
||||
color: #707070;
|
||||
}
|
||||
.bg {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
right: 0;
|
||||
bottom: -8rpx;
|
||||
opacity: 0;
|
||||
.img {
|
||||
display: block;
|
||||
width: 112rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
&.curr {
|
||||
.txt {
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
font-size: 48rpx;
|
||||
}
|
||||
.bg {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.new-chat-btn {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 54rpx;
|
||||
height: 54rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.fix-tabbar-body {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
background: linear-gradient(180deg, #FFF0DC 0%, rgba(255,234,216,0.67) 57%, rgba(255,255,255,0) 100%);
|
||||
}
|
||||
.page-to-bottom {
|
||||
position: fixed;
|
||||
bottom: 180rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 8;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
}
|
||||
}
|
||||
.fix-page-bottom {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 9;
|
||||
padding: 24rpx 24rpx 48rpx 24rpx;
|
||||
background-color: #fff;
|
||||
box-shadow: 0rpx -20rpx 30rpx rgba(176,186,206,0.16);
|
||||
transition: all 0.2s;
|
||||
&.focus {
|
||||
transform: translateY(-48rpx);
|
||||
}
|
||||
.bottom-body {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
min-height: 100rpx;
|
||||
.input-model {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
}
|
||||
}
|
||||
.input-wrap {
|
||||
position: relative;
|
||||
width: calc(100% - 160rpx);
|
||||
.inp {
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
width: 100%;
|
||||
max-height: 50vh;
|
||||
padding: 15rpx;
|
||||
margin: 0 24rpx;
|
||||
border: 0;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
line-height: 50rpx;
|
||||
color: #333;
|
||||
font-size: 30rpx;
|
||||
overflow-y: auto;
|
||||
box-shadow: 0rpx 6rpx 20rpx rgba(19,27,65,0.16);
|
||||
}
|
||||
.placeholder-txt {
|
||||
position: absolute;
|
||||
left: 40rpx;
|
||||
top: 50%;
|
||||
z-index: 2;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
.send-btn {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
}
|
||||
.sound-input-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
height: 100rpx;
|
||||
margin: 0 0 0 24rpx;
|
||||
border-radius: 40rpx;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
background: linear-gradient(360deg, #FA9108 0%, #FFA734 100%);
|
||||
box-shadow: 0rpx 6rpx 12rpx rgba(0,0,0,0.16);
|
||||
.icon {
|
||||
display: block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 12rpx 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.has-bg-body {
|
||||
position: relative;
|
||||
.bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
.cont {
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
}
|
||||
}
|
||||
.page-fff {
|
||||
.fix-tabbar-header {
|
||||
background-color: #fff;
|
||||
}
|
||||
.fix-tabbar-body {
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
.page-scroll {
|
||||
.fix-tabbar-header {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
.page-fff-linear-fff {
|
||||
.fix-tabbar-header {
|
||||
background-color: #fff;
|
||||
}
|
||||
.fix-tabbar-body {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,234,216,0.67) 75%, rgba(255,255,255,0) 100%);
|
||||
}
|
||||
}
|
||||
.fix-page-back {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
z-index: 8;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 12rpx 24rpx;
|
||||
border-radius: 0 28rpx 28rpx 0;
|
||||
background-color: #fff;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
&.bg {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
.article-back-wrap {
|
||||
display: flex;
|
||||
}
|
||||
.article-back-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 80rpx;
|
||||
padding: 0 24rpx;
|
||||
border-radius: 40rpx 40rpx 40rpx 0;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
line-height: 80rpx;
|
||||
background: linear-gradient(45deg, #FA9108 0%, #FFC25C 100%);
|
||||
box-shadow: 0rpx 6rpx 12rpx rgba(0,0,0,0.16);
|
||||
.icon {
|
||||
display: block;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
.chat-list-wrap {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
padding: 24rpx;
|
||||
.chat-message-item + .chat-message-item {
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.chat-message-item {
|
||||
.res-time {
|
||||
text-align: center;
|
||||
padding: 12rpx 0;
|
||||
color: #BEBEBE;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.chat-message-body {
|
||||
.chat-avatar {
|
||||
display: block;
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin: 0 0 8rpx 0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.item-left {
|
||||
display: flex;
|
||||
.txt {
|
||||
max-width: 100%;
|
||||
padding: 32rpx;
|
||||
border-radius: 0 40rpx 40rpx 40rpx;
|
||||
box-sizing: border-box;
|
||||
color: #333;
|
||||
font-size: 30rpx;
|
||||
line-height: 48rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0rpx 6rpx 12rpx rgba(0,0,0,0.16);
|
||||
}
|
||||
}
|
||||
.web-info-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 0 24rpx 0;
|
||||
.info-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
.icon {
|
||||
margin: 0 8rpx 0 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
display: block;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
.info-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.img-list {
|
||||
display: flex;
|
||||
margin: 0 8rpx 0 0;
|
||||
.web-logo {
|
||||
display: block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
margin: 0 -6rpx 0 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.web-info-body {
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s;
|
||||
.web-item + .web-item {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.web-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.web-logo {
|
||||
display: block;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.web-txt {
|
||||
width: calc(100% - 50rpx);
|
||||
margin: 0 0 0 14rpx;
|
||||
font-size: 24rpx;
|
||||
color: #1F37DC;
|
||||
line-height: 36rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
&.show-web-body {
|
||||
height: auto;
|
||||
padding: 12rpx 0 20rpx 0;
|
||||
margin: 0 0 20rpx 0;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
}
|
||||
.suggestion-wrap {
|
||||
.title {
|
||||
padding: 24rpx 0 0 0;
|
||||
color: #999;
|
||||
font-size: 26rpx;
|
||||
line-height: 38rpx;
|
||||
}
|
||||
.suggestion-list {
|
||||
.item {
|
||||
display: inline-flex;
|
||||
min-height: 44rpx;
|
||||
padding: 12rpx 12rpx 12rpx 18rpx;
|
||||
border-radius: 30rpx;
|
||||
margin: 24rpx 24rpx 0 0;
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
line-height: 38rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
background-color: #fff;
|
||||
.label {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
margin: 0 16rpx 0 0;
|
||||
border-radius: 16rpx;
|
||||
background: rgba(249,248,246,0.39);
|
||||
.pic {
|
||||
display: block;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.item-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
.txt {
|
||||
max-width: 100%;
|
||||
padding: 20rpx 32rpx;
|
||||
border-radius: 40rpx 40rpx 0 40rpx;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
line-height: 48rpx;
|
||||
background: linear-gradient(270deg, #FA9108 0%, #FFC25C 100%);
|
||||
box-shadow: 0rpx 6rpx 12rpx rgba(0,0,0,0.16);
|
||||
.copy-btn {
|
||||
display: inline-block;
|
||||
margin: -6rpx 0 0 12rpx;
|
||||
vertical-align: middle;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom-btns {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20rpx 0 0 0;
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 0 0 48rpx;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
background-color: #fff;
|
||||
box-shadow: none;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin: 0 6rpx 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.info-list-wrap {
|
||||
padding: 24rpx 12rpx 80rpx 12rpx;
|
||||
margin: 24rpx 0 0 0;
|
||||
border-radius: 40rpx;
|
||||
background: linear-gradient(180deg, #FEF1D4 0%, rgba(255,234,216,0.67) 57%, rgba(255,255,255,0) 100%);
|
||||
.info-header {
|
||||
padding: 0 24rpx;
|
||||
.total {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
.num {
|
||||
margin: 0 8rpx;
|
||||
color: #FA9108;
|
||||
}
|
||||
}
|
||||
.sub-header {
|
||||
padding: 12rpx 0 0 0;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
.blue {
|
||||
color: #1634FF;
|
||||
}
|
||||
.date {
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info-new-item {
|
||||
padding: 24rpx;
|
||||
margin: 16rpx 0 0 0;
|
||||
border-radius: 30rpx;
|
||||
background-color: #fff;
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.desc {
|
||||
padding: 24rpx 0 12rpx 0;
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
.orgin {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin: 0 6rpx 0 20rpx;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.date {
|
||||
.icon {
|
||||
display: block;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.relate-wrap {
|
||||
padding: 20rpx;
|
||||
margin: 0 12rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 0;
|
||||
background-color: #fff;
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
line-height: 40rpx;
|
||||
color: #1634FF;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
.list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 20rpx 20rpx 0 20rpx;
|
||||
.item {
|
||||
margin: 0 24rpx 24rpx 0;
|
||||
color: #151E5D;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.article-body {
|
||||
padding: 24rpx;
|
||||
}
|
||||
.article-html-wrap {
|
||||
padding: 24rpx;
|
||||
margin: 24rpx 0 0 0;
|
||||
border-radius: 40rpx;
|
||||
background-color: #fff;
|
||||
.article-title {
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.article-time {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
.icon {
|
||||
display: block;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin: 0 0 0 40rpx;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom-postion {
|
||||
width: 100%;
|
||||
height: 60rpx;
|
||||
}
|
||||
.rich-text-box {
|
||||
max-width: 100%;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
word-break: normal;
|
||||
white-space: initial;
|
||||
.cursor {
|
||||
color: #FA9108;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.show-cursor {
|
||||
.cursor {
|
||||
color: #FA9108;
|
||||
opacity: 1;
|
||||
animation: blinking 1s infinite;
|
||||
}
|
||||
}
|
||||
@keyframes blinking {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0.0;
|
||||
}
|
||||
}
|
||||
.loader-wrap {
|
||||
transform: scale(1);
|
||||
}
|
||||
.loader {
|
||||
width: 25px;
|
||||
aspect-ratio: 1;
|
||||
display: grid;
|
||||
border: 2px solid #0000;
|
||||
border-radius: 50%;
|
||||
border-color: #ccc #0000;
|
||||
animation: l16 1s infinite linear;
|
||||
}
|
||||
.loader::before,
|
||||
.loader::after {
|
||||
content: "";
|
||||
grid-area: 1/1;
|
||||
margin: 2px;
|
||||
border: inherit;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.loader::before {
|
||||
border-color: #FA9108 #0000;
|
||||
animation: inherit;
|
||||
animation-duration: .5s;
|
||||
animation-direction: reverse;
|
||||
}
|
||||
.loader::after {
|
||||
margin: 8px;
|
||||
}
|
||||
@keyframes l16 {
|
||||
100%{transform: rotate(1turn)}
|
||||
}
|
||||
|
||||
.music-wrap {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: -148rpx;
|
||||
z-index: 5;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100rpx;
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
.item {
|
||||
width: 8px;
|
||||
margin: 0 24rpx;
|
||||
border-radius: 6px;
|
||||
background-color: #FA9108;
|
||||
}
|
||||
.one {
|
||||
height: 86rpx;
|
||||
animation: radius-animation .58s infinite linear;
|
||||
}
|
||||
.two {
|
||||
height: 50rpx;
|
||||
animation: radius-animation .6s infinite linear;
|
||||
}
|
||||
.three {
|
||||
height: 76rpx;
|
||||
animation: radius-animation .57s infinite linear;
|
||||
}
|
||||
.four {
|
||||
height: 100rpx;
|
||||
animation: radius-animation .52s infinite linear;
|
||||
}
|
||||
.five {
|
||||
height: 76rpx;
|
||||
animation: radius-animation .4s infinite linear;
|
||||
}
|
||||
.six {
|
||||
height: 50rpx;
|
||||
animation: radius-animation .45s infinite linear;
|
||||
}
|
||||
.seven {
|
||||
height: 86rpx;
|
||||
animation: radius-animation .7s infinite linear;
|
||||
}
|
||||
}
|
||||
@keyframes radius-animation {
|
||||
100% {
|
||||
height: 20rpx;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,268 @@
|
||||
<template>
|
||||
<view
|
||||
:class="{
|
||||
'focus': inputOnFocus
|
||||
}"
|
||||
class="fix-page-bottom"
|
||||
>
|
||||
<view v-if="startTaskFlag" class="music-wrap">
|
||||
<view class="item one" />
|
||||
<view class="item two" />
|
||||
<view class="item three" />
|
||||
<view class="item four" />
|
||||
<view class="item five" />
|
||||
<view class="item six" />
|
||||
<view class="item seven" />
|
||||
</view>
|
||||
<view class="bottom-body flex-center-between">
|
||||
<!-- 输入模式切换 -->
|
||||
<view
|
||||
class="input-model"
|
||||
@click="toggleInputModel"
|
||||
>
|
||||
输入模式
|
||||
</view>
|
||||
<!-- 输入框 -->
|
||||
<view
|
||||
v-if="inputModel === 'input'"
|
||||
class="input-wrap flex-center-between"
|
||||
>
|
||||
<input
|
||||
v-model.trim="prompt"
|
||||
:show-confirm-bar="false"
|
||||
:disabled="loading"
|
||||
:maxlength="-1"
|
||||
class="inp"
|
||||
@confirm="sendHandle"
|
||||
@focus="promptInputFocusHandle"
|
||||
@blur="promptInputBlurHandle"
|
||||
/>
|
||||
<view v-if="!prompt && !inputOnFocus" class="placeholder-txt">请输入关键字...</view>
|
||||
</view>
|
||||
<view
|
||||
v-if="inputModel === 'input'"
|
||||
class="send-btn"
|
||||
>
|
||||
<view
|
||||
@click="sendHandle"
|
||||
>
|
||||
发送
|
||||
</view>
|
||||
</view>
|
||||
<!-- 语音输入 -->
|
||||
<view
|
||||
v-if="inputModel === 'sound'"
|
||||
class="sound-input-wrap"
|
||||
@touchstart="startRecord"
|
||||
@touchend="stopRecord"
|
||||
>
|
||||
<image
|
||||
:src="webUrl + '/icon-20.png'"
|
||||
class="icon"
|
||||
mode="widthFix"
|
||||
/>
|
||||
按住说话
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
makeFileTransTask,
|
||||
getFileTransResult
|
||||
} from '@/api/voiceToText/index'
|
||||
import { VUE_APP_API_URL } from '@/config'
|
||||
import settings from '@/config/baseSetting.js'
|
||||
import cookie from '@/utils/store/cookie'
|
||||
export default {
|
||||
name: 'BottomSend',
|
||||
props: {
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
token: cookie.get('login_status'),
|
||||
userInfo: cookie.get('userInfo'),
|
||||
webUrl: this.$webUrl,
|
||||
// 输入模式:input-键盘，sound-语音
|
||||
inputModel: 'input',
|
||||
prompt: '今天天气',
|
||||
recordManager: null,
|
||||
// 录音权限是否开通
|
||||
recordPermission: false,
|
||||
taskId: '',
|
||||
taskTimer: null,
|
||||
startTaskFlag: false,
|
||||
// 输入框是否聚焦
|
||||
inputOnFocus: false
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.clearIntervalFn()
|
||||
},
|
||||
created() {
|
||||
uni.getSetting({
|
||||
success: res => {
|
||||
if (res.authSetting['scope.record']) {
|
||||
this.recordPermission = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
promptInputFocusHandle() {
|
||||
this.inputOnFocus = true
|
||||
},
|
||||
promptInputBlurHandle() {
|
||||
this.inputOnFocus = false
|
||||
},
|
||||
toggleInputModel() {
|
||||
if (!this.token) {
|
||||
uni.reLaunch({ url: '/pages/auth/login' })
|
||||
return
|
||||
}
|
||||
if (this.loading) return
|
||||
if (this.inputModel === 'input') {
|
||||
uni.getSetting({
|
||||
success: res => {
|
||||
if (!res.authSetting['scope.record']) {
|
||||
uni.authorize({
|
||||
scope: 'scope.record',
|
||||
success: () => {
|
||||
console.log('获取录音权限成功')
|
||||
this.recordPermission = true
|
||||
this.inputModel = 'sound'
|
||||
},
|
||||
fail: () => {
|
||||
console.log('获取录音权限失败')
|
||||
this.recordPermission = false
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.recordPermission = true
|
||||
this.inputModel = 'sound'
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.inputModel === 'sound') {
|
||||
this.clearIntervalFn()
|
||||
this.inputModel = 'input'
|
||||
return
|
||||
}
|
||||
},
|
||||
startRecord() {
|
||||
if (this.loading) {
|
||||
this.$toast('正在检索')
|
||||
return
|
||||
}
|
||||
// 正在识别，不触发相关动作
|
||||
if (this.startTaskFlag || this.taskTimer) {
|
||||
return
|
||||
}
|
||||
this.recordManager = uni.getRecorderManager()
|
||||
console.log('启动录音')
|
||||
this.startTaskFlag = true
|
||||
this.recordManager.start({
|
||||
duration: 60 * 1000,
|
||||
frameSize: 1,
|
||||
sampleRate: 16000,
|
||||
format: 'wav'
|
||||
})
|
||||
},
|
||||
stopRecord() {
|
||||
const _this = this
|
||||
// 正在识别，不触发相关动作
|
||||
if (this.taskTimer) {
|
||||
return
|
||||
}
|
||||
if (_this.recordManager) {
|
||||
_this.recordManager.stop()
|
||||
console.log('停止录音')
|
||||
_this.startTaskFlag = false
|
||||
_this.recordManager.onStop((res) => {
|
||||
console.log('录音结束------------')
|
||||
console.log(res)
|
||||
const { tempFilePath, fileSize, duration } = res
|
||||
if (tempFilePath && fileSize && duration) {
|
||||
_this.taskId = ''
|
||||
_this.clearIntervalFn()
|
||||
uni.uploadFile({
|
||||
url: `${VUE_APP_API_URL + settings.sysPrefix}/common/file/local/upload`,
|
||||
filePath: tempFilePath,
|
||||
header: {
|
||||
'client-id': 'app',
|
||||
Authorization: 'Bearer ' + (_this.token || '')
|
||||
},
|
||||
name: 'file',
|
||||
success: uploadRes => {
|
||||
console.log(JSON.parse(uploadRes.data))
|
||||
_this.renderTransTask(uploadRes)
|
||||
},
|
||||
fail: err => {
|
||||
console.log(err)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
renderTransTask(uploadRes) {
|
||||
const _this = this
|
||||
makeFileTransTask({
|
||||
file: `${VUE_APP_API_URL + settings.sysPrefix}` + JSON.parse(uploadRes.data).data.fileUrl
|
||||
}).then(taskRes => {
|
||||
_this.taskId = taskRes.data
|
||||
_this.getTransResultReq()
|
||||
})
|
||||
},
|
||||
getTransResultReq() {
|
||||
const _this = this
|
||||
uni.showLoading({ title: '识别中...' })
|
||||
_this.taskTimer = setInterval(() => {
|
||||
getFileTransResult({
|
||||
taskId: _this.taskId
|
||||
}).then(res => {
|
||||
const { success, data = [] } = res
|
||||
if (success && data) {
|
||||
uni.hideLoading()
|
||||
_this.clearIntervalFn()
|
||||
if (data === '__NULL__') {
|
||||
_this.$toast('豁然没有听清您说了什么，请再说一遍')
|
||||
} else {
|
||||
if (data.length > 0) {
|
||||
const prompt = data[0].Text
|
||||
if (prompt) {
|
||||
_this.$emit('send', { prompt: prompt.replace('。', '') })
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}, 1000)
|
||||
},
|
||||
clearIntervalFn() {
|
||||
this.taskTimer && clearInterval(this.taskTimer)
|
||||
this.taskTimer = null
|
||||
setTimeout(() => {
|
||||
this.startTaskFlag = false
|
||||
}, 300)
|
||||
},
|
||||
sendHandle() {
|
||||
if (this.loading) return
|
||||
if (!this.prompt) {
|
||||
this.$toast('请输入您想问的内容')
|
||||
return
|
||||
}
|
||||
this.$emit('send', { prompt: this.prompt })
|
||||
this.prompt = ''
|
||||
this.inputOnFocus = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<view v-if="showImg" class="ai-entrance">
|
||||
<image
|
||||
:src="settingInfo.mainImage"
|
||||
mode="widthFix"
|
||||
class="img"
|
||||
@click="enterAiChat()"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getAiSystemInfoSetting
|
||||
} from '@/api/public'
|
||||
export default {
|
||||
name: 'AiEntrance',
|
||||
data() {
|
||||
return {
|
||||
showImg: false,
|
||||
settingInfo: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
getAiSystemInfoSetting().then(res => {
|
||||
const { success, data } = res
|
||||
if (success) {
|
||||
this.settingInfo = data
|
||||
this.showImg = data.showOnAppIndex === 1
|
||||
}
|
||||
})
|
||||
},
|
||||
enterAiChat() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/aiChat/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.ai-entrance {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
z-index: 5;
|
||||
transform: translateY(-50%);
|
||||
.img {
|
||||
width: 88rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,18 @@
|
||||
const baseStr = 'edc_epro_prod:'
|
||||
const settings = {
|
||||
storage: {
|
||||
systemInfo: `${baseStr}systemInfo`,
|
||||
firstLaunch: `${baseStr}firstLaunch`,
|
||||
token: `${baseStr}token`,
|
||||
userInfo: `${baseStr}userInfo`,
|
||||
webInfo: `${baseStr}webInfo`
|
||||
},
|
||||
/* 拦截器超时时长 */
|
||||
timeout: 120 * 1000,
|
||||
/* 系统接口前缀，没有统一的填空字符串 */
|
||||
sysPrefix: '/',
|
||||
/* 是否收集错误日志 */
|
||||
collectRequestError: false
|
||||
}
|
||||
|
||||
export default settings
|
||||
@@ -17,9 +17,11 @@ import {
|
||||
import uView from "uview-ui";
|
||||
import GooSkeleton from '@/components/GooSkeleton/index.vue'
|
||||
import { pageToWatchData } from '@/config/page'
|
||||
import BottomSend from '@/components/aiChat/bottomSend.vue'
|
||||
|
||||
Vue.use(uView)
|
||||
Vue.component('GooSkeleton', GooSkeleton)
|
||||
Vue.component('BottomSend', BottomSend)
|
||||
Vue.mixin(mixin)
|
||||
|
||||
// 注册全局组件
|
||||
|
||||
@@ -0,0 +1,281 @@
|
||||
import {
|
||||
getSseConfigV1,
|
||||
getCompletions
|
||||
} from '@/api/chat/index'
|
||||
import { VUE_APP_API_URL } from '@/config'
|
||||
import settings from '@/config/baseSetting.js'
|
||||
import { formatAiMsgContent } from '@/utils/aiChat'
|
||||
import cookie from '@/utils/store/cookie'
|
||||
import { handleLoginFailure } from '@/utils'
|
||||
export const chatMixins = {
|
||||
data() {
|
||||
return {
|
||||
token: cookie.get('login_status'),
|
||||
userInfo: cookie.get('userInfo'),
|
||||
webUrl: this.$webUrl,
|
||||
scrollTop: 0,
|
||||
isScrollToBottom: false,
|
||||
// 状态栏高度
|
||||
statusBarHeight: 20,
|
||||
fileHttpStr: Object.freeze(VUE_APP_API_URL + settings.sysPrefix),
|
||||
optionsFrom: '',
|
||||
loading: false,
|
||||
chatNumber: '',
|
||||
infoResData: {},
|
||||
chatMessageList: [
|
||||
/*
|
||||
{
|
||||
type: -2,
|
||||
isError: false,
|
||||
showCursor: false,
|
||||
conversationId: '',
|
||||
prompt: '',
|
||||
nodes: '-------------监听 WebSocket 接受到服务器的消息事件',
|
||||
content: '-------------监听 WebSocket 接受到服务器的消息事件',
|
||||
listQuestion: [
|
||||
'监听 WebSocket 接受到服务器的消息事件',
|
||||
'监听 WebSocket 接受到服务器的消息事件',
|
||||
'监听 WebSocket 接受到服务器的消息事件'
|
||||
]
|
||||
}
|
||||
*/
|
||||
],
|
||||
errorMsg: Object.freeze('您提的问题未能理解，云灵思想跑偏啦，重新整理一下问题或者重新提问，让云灵再试试！')
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
chatMessageListLength() {
|
||||
return this.chatMessageList.length
|
||||
}
|
||||
},
|
||||
onPageScroll(e) {
|
||||
const scrollTop = e.scrollTop
|
||||
this.scrollTop = scrollTop
|
||||
const query = wx.createSelectorQuery().in(this)
|
||||
query.select('#fixTbabarBody').boundingClientRect(function(rect) {
|
||||
const contentHeight = rect.height
|
||||
const windowInfo = wx.getWindowInfo()
|
||||
const windowHeight = windowInfo.windowHeight
|
||||
if (scrollTop + windowHeight + 30 >= contentHeight) {
|
||||
this.isScrollToBottom = true
|
||||
} else {
|
||||
this.isScrollToBottom = false
|
||||
}
|
||||
}.bind(this)).exec()
|
||||
},
|
||||
created() {
|
||||
const _this = this
|
||||
uni.getSystemInfo({
|
||||
success: (e) => {
|
||||
let statusBar = 0
|
||||
// #ifdef MP-WEIXIN
|
||||
statusBar = e.statusBarHeight
|
||||
const custom = uni.getMenuButtonBoundingClientRect()
|
||||
_this.rightDistance = e.windowWidth - custom.left + 10
|
||||
// #endif
|
||||
// 状态栏高度
|
||||
_this.statusBarHeight = statusBar
|
||||
}
|
||||
})
|
||||
console.log(this.token)
|
||||
console.log(this.userInfo)
|
||||
_this.createdCallbak()
|
||||
},
|
||||
methods: {
|
||||
createdCallbak() {
|
||||
console.log('页面初始话回调')
|
||||
},
|
||||
copyContentHandle(data) {
|
||||
uni.setClipboardData({
|
||||
data,
|
||||
success: () =>
|
||||
uni.showToast({
|
||||
title: '已复制'
|
||||
})
|
||||
})
|
||||
},
|
||||
shareHandle() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline'],
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
},
|
||||
fail: err => {
|
||||
console.log(err)
|
||||
}
|
||||
})
|
||||
},
|
||||
scrollToBottomHandle() {
|
||||
uni.pageScrollTo({
|
||||
duration: 100,
|
||||
selector: '#bottom_postion'
|
||||
})
|
||||
this.isScrollToBottom = true
|
||||
},
|
||||
// 重新生成
|
||||
regenerateHandle(item) {
|
||||
deleteChatItemByConversationId(item.conversationId).then(res => {
|
||||
const { success } = res
|
||||
if (success) {
|
||||
this.chatMessageList.splice(this.chatMessageListLength - 1, 1)
|
||||
this.streamReq({
|
||||
prompt: item.prompt,
|
||||
init: 1
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 建议提问
|
||||
suggestionItemClickHandle(question) {
|
||||
this.streamReq({
|
||||
prompt: question,
|
||||
init: 0
|
||||
})
|
||||
},
|
||||
streamReq(params) {
|
||||
const _this = this
|
||||
// 需要校验登录状态
|
||||
if (!_this.token) {
|
||||
handleLoginFailure()
|
||||
return
|
||||
}
|
||||
_this.initWebSocket(() => {
|
||||
const prompt = params.prompt
|
||||
if (params.init !== 1) {
|
||||
_this.chatMessageList.push({
|
||||
prompt,
|
||||
type: -1
|
||||
})
|
||||
}
|
||||
_this.$nextTick(() => {
|
||||
_this.scrollToBottomHandle()
|
||||
})
|
||||
_this.chatMessageList.push({
|
||||
content: '',
|
||||
nodes: '',
|
||||
isError: false,
|
||||
showCursor: false,
|
||||
conversationId: '',
|
||||
prompt,
|
||||
listQuestion: [],
|
||||
type: -2
|
||||
})
|
||||
_this.loading = true
|
||||
_this.showCursor = false
|
||||
getSseConfigV1({
|
||||
'chatNumber': _this.chatNumber,
|
||||
prompt
|
||||
}).then(resConfig => {
|
||||
const conversationId = resConfig.data.conversationId
|
||||
_this.chatNumber = resConfig.data.chatNumber || ''
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].showCursor = true
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].conversationId = conversationId
|
||||
getCompletions({
|
||||
conversationId,
|
||||
ws: true,
|
||||
isNoNeedPublicErrorNotification: 1
|
||||
}).then(sseRes => {
|
||||
console.log(sseRes)
|
||||
// _this.closeWsFn()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].isError = true
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].content = _this.errorMsg
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].nodes = _this.errorMsg
|
||||
_this.closeWsFn()
|
||||
})
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].isError = true
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].content = _this.errorMsg
|
||||
_this.chatMessageList[_this.chatMessageListLength - 1].nodes = _this.errorMsg
|
||||
_this.closeWsFn()
|
||||
})
|
||||
})
|
||||
},
|
||||
closeWsFn() {
|
||||
this.loading = false
|
||||
this.chatMessageList[this.chatMessageListLength - 1].showCursor = false
|
||||
uni.closeSocket({
|
||||
success: () => {
|
||||
console.log('-----关闭连接')
|
||||
}
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.scrollToBottomHandle()
|
||||
})
|
||||
},
|
||||
initWebSocket(cb) {
|
||||
const _this = this
|
||||
console.log('------------------创建连接')
|
||||
uni.connectSocket({
|
||||
url: VUE_APP_API_URL.replace('https', 'wss') + settings.sysPrefix + `v1/chat/websocket/${_this.userInfo.unionId}`,
|
||||
header: {
|
||||
'content-type': 'application/json'
|
||||
},
|
||||
timeout: 10 * 1000,
|
||||
success: () => {
|
||||
console.log('------------WebSocket初始化成功')
|
||||
},
|
||||
fail: (err) => {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
content: err
|
||||
})
|
||||
}
|
||||
})
|
||||
uni.onSocketMessage(res => {
|
||||
_this.websocketOnmessage(res)
|
||||
})
|
||||
uni.onSocketOpen(() => {
|
||||
cb && cb()
|
||||
_this.websocketOnopen()
|
||||
})
|
||||
uni.onSocketError(err => {
|
||||
_this.websocketOnerror(err)
|
||||
})
|
||||
},
|
||||
websocketOnmessage(res) {
|
||||
console.log('-------------监听 WebSocket 接受到服务器的消息事件')
|
||||
const resData = JSON.parse(res.data)
|
||||
if (resData) {
|
||||
const message = resData.message
|
||||
if (message && this.chatMessageListLength > 1) {
|
||||
const mesContent = message.content
|
||||
this.chatMessageList[this.chatMessageListLength - 1].nodes = formatAiMsgContent(mesContent)
|
||||
this.chatMessageList[this.chatMessageListLength - 1].content = mesContent
|
||||
this.chatMessageList[this.chatMessageListLength - 1].listQuestion = message.listQuestion || []
|
||||
this.$forceUpdate()
|
||||
this.$nextTick(() => {
|
||||
this.scrollToBottomHandle()
|
||||
if (message.finish) {
|
||||
this.closeWsFn()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
websocketOnopen() {
|
||||
console.log('------------------监听 WebSocket 连接打开事件')
|
||||
// this.websocketSend(JSON.stringify({ msg: '1' }))
|
||||
},
|
||||
websocketOnerror(e) {
|
||||
console.log('-----------------监听 WebSocket 错误事件')
|
||||
console.log(e)
|
||||
},
|
||||
websocketSend(msg) {
|
||||
// 数据发送
|
||||
try {
|
||||
uni.sendSocketMessage({
|
||||
data: msg,
|
||||
success: () => {
|
||||
console.log('-----------发送消息成功了')
|
||||
}
|
||||
})
|
||||
} catch (err) {
|
||||
console.log('send failed (' + err.code + ')')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -36,6 +36,14 @@
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/aiChat/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "云灵AI智能助手",
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/home/landMark",
|
||||
"style": {
|
||||
|
||||
@@ -0,0 +1,197 @@
|
||||
<template>
|
||||
<view
|
||||
:class="scrollTop > 0 ? 'page-scroll' : ''"
|
||||
class="fix-tabbar-page"
|
||||
>
|
||||
<hx-navbar
|
||||
:back="true"
|
||||
:fixed="true"
|
||||
color="#333"
|
||||
:statusBar="true"
|
||||
transparent="hidden"
|
||||
barPlaceholder="hidden"
|
||||
title="云灵AI智能助手"
|
||||
/>
|
||||
<view
|
||||
id="fixTbabarBody"
|
||||
:style="{
|
||||
'padding-top': (44 + statusBarHeight) + 'px'
|
||||
}"
|
||||
class="fix-tabbar-body"
|
||||
>
|
||||
<view class="chat-wrap">
|
||||
<view v-if="chatMessageListLength > 0" class="chat-list-wrap">
|
||||
<view
|
||||
v-for="(item, index) in chatMessageList"
|
||||
:key="index"
|
||||
class="chat-message-item"
|
||||
>
|
||||
<view v-if="item.type === -1" class="chat-message-body">
|
||||
<view class="item-right">
|
||||
<view class="txt">
|
||||
{{ item.prompt }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="item.type === -2" class="chat-message-body">
|
||||
<view class="avatar">
|
||||
<image
|
||||
:src="'http://resource.xdd618.com/v1ppYx3WizxJ72a1af114c9931828888d959066fa3e7-20240314125834.png'"
|
||||
class="chat-avatar"
|
||||
mode="widthFix"
|
||||
/>
|
||||
</view>
|
||||
<view class="item-left">
|
||||
<view class="txt">
|
||||
<view
|
||||
ref="rich-text-box"
|
||||
:class="{
|
||||
'show-cursor': item.showCursor
|
||||
}"
|
||||
class="rich-text-box"
|
||||
>
|
||||
<rich-text
|
||||
v-if="item.nodes && item.nodes.length"
|
||||
:nodes="item.nodes"
|
||||
space="nbsp"
|
||||
/>
|
||||
<view v-if="!(item.nodes && item.nodes.length) && loading" class="loader-wrap">
|
||||
<div class="loader" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-if="index === (chatMessageListLength - 1) && item.listQuestion.length > 0"
|
||||
class="suggestion-wrap"
|
||||
>
|
||||
<view class="suggestion-list">
|
||||
<view
|
||||
v-for="(question, questionIndex) in item.listQuestion"
|
||||
:key="questionIndex"
|
||||
class="item"
|
||||
@click="suggestionItemClickHandle(question)"
|
||||
>
|
||||
<view class="label">
|
||||
<image
|
||||
:src="webUrl + '/icon-30.png'"
|
||||
class="pic"
|
||||
mode="widthFix"
|
||||
/>
|
||||
</view>
|
||||
{{ question }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view id="bottom_postion" class="bottom-postion" />
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-if="chatMessageListLength > 0 && !isScrollToBottom && !loading"
|
||||
class="page-to-bottom"
|
||||
>
|
||||
<image
|
||||
:src="webUrl + '/icon-29.png'"
|
||||
class="icon"
|
||||
mode="widthFix"
|
||||
@click="scrollToBottomHandle"
|
||||
/>
|
||||
</view>
|
||||
<bottom-send
|
||||
ref="bottomSend"
|
||||
:loading="loading"
|
||||
@send="streamReq"
|
||||
@add="createNewHandle"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { chatMixins } from '@/mixins/chatMixins.js'
|
||||
export default {
|
||||
name: 'AiChatIndexPage',
|
||||
mixins: [chatMixins],
|
||||
methods: {
|
||||
createdCallbak() {
|
||||
this.$nextTick(() => {
|
||||
this.scrollToBottomHandle()
|
||||
})
|
||||
},
|
||||
// 创建新会话
|
||||
createNewHandle() {
|
||||
if (!this.chatNumber) return
|
||||
this.chatNumber = ''
|
||||
this.showCursor = false
|
||||
this.loading = false
|
||||
this.getConfigLoading = false
|
||||
this.infoResData = {}
|
||||
this.chatMessageList = []
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.guide-wrap {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 706rpx;
|
||||
padding: 24rpx 0 0 0;
|
||||
margin: 0 auto;
|
||||
.pic {
|
||||
display: block;
|
||||
width: 706rpx;
|
||||
}
|
||||
.pic2 {
|
||||
position: absolute;
|
||||
top: 42rpx;
|
||||
left: 68rpx;
|
||||
display: block;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
}
|
||||
.chat-wrap {
|
||||
padding: 0 0 180rpx 0;
|
||||
.chat-info-wrap {
|
||||
padding: 24rpx;
|
||||
.chat-list-wrap2 {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.no-info-list {
|
||||
height: 240rpx;
|
||||
line-height: 240rpx;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
.loading-wrap {
|
||||
text-align: center;
|
||||
color: #666;
|
||||
line-height: 120rpx;
|
||||
}
|
||||
.rich-text-box {
|
||||
max-width: 100%;
|
||||
}
|
||||
.show-cursor .cursor {
|
||||
display: inline-block;
|
||||
color: #FA9108;
|
||||
font-weight: bold;
|
||||
animation: blinking 1s infinite;
|
||||
}
|
||||
|
||||
@keyframes blinking {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0.0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
+315
-307
@@ -1,9 +1,19 @@
|
||||
<template>
|
||||
<view class="cloud-page">
|
||||
<view class="search-box">
|
||||
<uni-search-bar placeholder="输入搜索关键词" @confirm="search" @clear="clearName"></uni-search-bar>
|
||||
<view class="search-box flex">
|
||||
<view class="city-box" @click="goCity('cloud')">
|
||||
<image
|
||||
:src="webUrl+'/20220903142929759087.png'"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<text>{{ cityName }}</text>
|
||||
</view>
|
||||
<uni-search-bar
|
||||
placeholder="输入搜索关键词"
|
||||
@confirm="search"
|
||||
@clear="clearName"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="nav-box">
|
||||
<view
|
||||
v-for="(item, index) in typeList"
|
||||
@@ -12,370 +22,368 @@
|
||||
@click="changeType(index)"
|
||||
>
|
||||
<image :src="item.icon" mode="scaleToFill"></image>
|
||||
<view class="nav">{{item.name}}</view>
|
||||
<view class="nav">{{ item.name }}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="list-box">
|
||||
<text class="type-name">{{typeList[type]['name']}}</text>
|
||||
|
||||
<view class="city-box" @click="goCity('cloud')">
|
||||
<image :src="webUrl+'/20220903142929759087.png'" mode="scaleToFill"></image>
|
||||
<text>{{cityName}}</text>
|
||||
</view>
|
||||
|
||||
<view class="list" v-if="hotelList.length">
|
||||
<view
|
||||
v-if="hotelList.length"
|
||||
class="list"
|
||||
>
|
||||
<custom-waterfalls-flow :value="hotelList" imageKey="cover">
|
||||
<view class="item" v-for="(item,index) in hotelList" :key="index" slot="slot{{index}}"
|
||||
@click="goInnDetail(item)">
|
||||
<view
|
||||
v-for="(item,index) in hotelList"
|
||||
:key="index"
|
||||
slot="slot{{index}}"
|
||||
class="item"
|
||||
@click="goInnDetail(item)"
|
||||
>
|
||||
<view class="cover-box">
|
||||
<image class="cover" :src="item.cover" mode="scaleToFill"></image>
|
||||
<image
|
||||
:src="item.cover"
|
||||
mode="scaleToFill"
|
||||
class="cover"
|
||||
/>
|
||||
<view class="my-mask">
|
||||
<image class="icon" :src="webUrl+'/20220510142728577618.png'" mode="scaleToFill"></image>
|
||||
<text>{{item.cityName}}</text>
|
||||
<image
|
||||
class="icon"
|
||||
:src="webUrl+'/20220510142728577618.png'"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<text>{{ item.cityName }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="more-t">{{item.content}}</view>
|
||||
<view class="more-t">{{ item.content }}</view>
|
||||
<view class="flex ai-center" style="margin-bottom: 18rpx;">
|
||||
<image class="logo" :src="item.logo" mode="scaleToFill"></image>
|
||||
<text class="one-t">{{item.name}}</text>
|
||||
<image
|
||||
class="logo"
|
||||
:src="item.logo"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<text class="one-t">{{ item.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</custom-waterfalls-flow>
|
||||
</view>
|
||||
|
||||
<view class="v4-nodata" v-else>
|
||||
<image src="@/static/images/img_nodata.png" mode="scaleToFill" />
|
||||
<view class="text">暂无数据</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from '@/utils/mapConfig';
|
||||
import {
|
||||
getHotelTypeList,
|
||||
getHotelList
|
||||
} from "@/api/inn.js";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
typeList: [],
|
||||
name: "",
|
||||
page: 1,
|
||||
type: 0,
|
||||
tabName: "", // 跳转初始分类名
|
||||
hotelList: [],
|
||||
cityName: "丽江市",
|
||||
paramCity: ""
|
||||
}
|
||||
import config from '@/utils/mapConfig'
|
||||
import {
|
||||
getHotelTypeList,
|
||||
getHotelList
|
||||
} from '@/api/inn.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
typeList: [],
|
||||
name: '',
|
||||
page: 1,
|
||||
type: 0,
|
||||
// 跳转初始分类名
|
||||
tabName: '',
|
||||
hotelList: [],
|
||||
cityName: '丽江市',
|
||||
paramCity: ''
|
||||
}
|
||||
},
|
||||
onLoad(){
|
||||
this.fetchTypeList()
|
||||
},
|
||||
onShow() {
|
||||
const name = uni.getStorageSync('name')
|
||||
if (name) {
|
||||
this.tabName = name
|
||||
uni.removeStorageSync('name')
|
||||
}
|
||||
const memCityName = uni.getStorageSync('cityName')
|
||||
if (memCityName.length) {
|
||||
this.cityName = memCityName
|
||||
this.paramCity = memCityName
|
||||
this.page = 1
|
||||
this.hotelList = []
|
||||
this.fetchList()
|
||||
uni.removeStorageSync('cityName')
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.page++
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
goCity() {
|
||||
uni.navigateTo({
|
||||
url:`/pages/chose-city/chose-city?type=2&city=${this.cityName}`
|
||||
})
|
||||
},
|
||||
onLoad(){
|
||||
this.fetchTypeList()
|
||||
},
|
||||
onShow() {
|
||||
let name = uni.getStorageSync("name");
|
||||
if (name) {
|
||||
this.tabName = name;
|
||||
uni.removeStorageSync("name");
|
||||
}
|
||||
//获取当前定位地址
|
||||
getCurAddress() {
|
||||
const that = this
|
||||
//定位
|
||||
uni.showLoading({
|
||||
title: '定位中...'
|
||||
})
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function(res) {
|
||||
let latitude = res.latitude
|
||||
let longitude = res.longitude
|
||||
// #ifdef H5
|
||||
Vue.jsonp(
|
||||
'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude + '&key=' +
|
||||
config.key, {
|
||||
output: 'jsonp',
|
||||
}).then(json => {
|
||||
// Success.
|
||||
uni.hideLoading();
|
||||
that.cityName = json.result.ad_info.city
|
||||
that.paramCity = json.result.ad_info.city
|
||||
//定位成功刷新数据
|
||||
that.fetchList()
|
||||
}).catch(err => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
// #endif
|
||||
|
||||
let memCityName = uni.getStorageSync("cityName")
|
||||
if (memCityName.length) {
|
||||
this.cityName = memCityName;
|
||||
this.paramCity = memCityName;
|
||||
this.page = 1;
|
||||
this.hotelList = [];
|
||||
this.fetchList();
|
||||
|
||||
uni.removeStorageSync("cityName")
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.page++;
|
||||
this.fetchList();
|
||||
},
|
||||
methods: {
|
||||
goCity() {
|
||||
uni.navigateTo({
|
||||
url:`/pages/chose-city/chose-city?type=2&city=${this.cityName}`
|
||||
})
|
||||
},
|
||||
//获取当前定位地址
|
||||
getCurAddress() {
|
||||
var that = this;
|
||||
//定位
|
||||
uni.showLoading({
|
||||
title: '定位中...'
|
||||
});
|
||||
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function(res) {
|
||||
let latitude = res.latitude;
|
||||
let longitude = res.longitude;
|
||||
|
||||
// #ifdef H5
|
||||
Vue.jsonp(
|
||||
'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude + '&key=' +
|
||||
config.key, {
|
||||
output: 'jsonp',
|
||||
}).then(json => {
|
||||
// Success.
|
||||
// #ifndef H5
|
||||
uni.request({
|
||||
url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude +
|
||||
'&key=' + config.key,
|
||||
success: function(res) {
|
||||
uni.hideLoading();
|
||||
that.cityName = json.result.ad_info.city;
|
||||
that.paramCity = json.result.ad_info.city;
|
||||
|
||||
that.cityName = res.data.result.ad_info.city
|
||||
that.paramCity = res.data.result.ad_info.city
|
||||
//定位成功刷新数据
|
||||
that.fetchList()
|
||||
}).catch(err => {
|
||||
uni.hideLoading();
|
||||
})
|
||||
// #endif
|
||||
|
||||
// #ifndef H5
|
||||
uni.request({
|
||||
url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude +
|
||||
'&key=' + config.key,
|
||||
success: function(res) {
|
||||
uni.hideLoading();
|
||||
|
||||
that.cityName = res.data.result.ad_info.city;
|
||||
that.paramCity = res.data.result.ad_info.city;
|
||||
//定位成功刷新数据
|
||||
that.fetchList()
|
||||
},
|
||||
fail: function(res) {
|
||||
uni.hideLoading();
|
||||
},
|
||||
complete: function() {}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
fail: function(res) {
|
||||
uni.hideLoading();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
fetchTypeList() {
|
||||
this.hotelList = []
|
||||
getHotelTypeList().then(res => {
|
||||
if (res.status === 200) {
|
||||
for (let i = 0; i < res.data.length; i++) {
|
||||
if (this.tabName == res.data[i].name) this.type = i;
|
||||
},
|
||||
fail: function(res) {
|
||||
uni.hideLoading()
|
||||
}
|
||||
|
||||
this.typeList = res.data
|
||||
|
||||
let memCityName = uni.getStorageSync("cityName")
|
||||
if (memCityName.length) {
|
||||
this.cityName = memCityName;
|
||||
this.paramCity = memCityName;
|
||||
this.page = 1;
|
||||
this.list = [];
|
||||
this.fetchList();
|
||||
|
||||
uni.removeStorageSync("cityName")
|
||||
} else {
|
||||
this.getCurAddress();
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
fail: function(res) {
|
||||
uni.hideLoading()
|
||||
}
|
||||
})
|
||||
},
|
||||
fetchTypeList() {
|
||||
this.hotelList = []
|
||||
getHotelTypeList().then(res => {
|
||||
const { status, data } = res
|
||||
if (status === 200) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
if (this.tabName == data[i].name) {
|
||||
this.type = i
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
search(e) {
|
||||
this.name = e.value;
|
||||
this.page = 1;
|
||||
this.hotelList = [];
|
||||
this.fetchList();
|
||||
},
|
||||
|
||||
clearName() {
|
||||
this.name = "";
|
||||
this.page = 1;
|
||||
this.hotelList = [];
|
||||
this.fetchList();
|
||||
},
|
||||
|
||||
changeType(index) {
|
||||
this.type = index;
|
||||
this.page = 1;
|
||||
this.hotelList = [];
|
||||
this.fetchList();
|
||||
},
|
||||
|
||||
fetchList() {
|
||||
getHotelList({
|
||||
name: this.name,
|
||||
page: this.page,
|
||||
type: this.typeList[this.type].id,
|
||||
cityName: this.paramCity
|
||||
}).then(res => {
|
||||
if (res.status === 200) {
|
||||
this.paramCity = this.cityName;
|
||||
|
||||
for (let i = 0; i < res.data.length; i++) {
|
||||
res.data[i].hide = true;
|
||||
this.hotelList.push(res.data[i])
|
||||
}
|
||||
this.typeList = data
|
||||
const memCityName = uni.getStorageSync('cityName')
|
||||
if (memCityName.length) {
|
||||
this.cityName = memCityName
|
||||
this.paramCity = memCityName
|
||||
this.page = 1
|
||||
this.list = []
|
||||
this.fetchList()
|
||||
uni.removeStorageSync('cityName')
|
||||
} else {
|
||||
this.getCurAddress()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
goInnDetail: function(item) {
|
||||
//跳转到客栈详情
|
||||
this.$yrouter.push({
|
||||
path: "/pagesInn/inn/innHome",
|
||||
query: {
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
},
|
||||
search(e) {
|
||||
this.name = e.value
|
||||
this.page = 1
|
||||
this.hotelList = []
|
||||
this.fetchList()
|
||||
},
|
||||
clearName() {
|
||||
this.name = ''
|
||||
this.page = 1
|
||||
this.hotelList = []
|
||||
this.fetchList()
|
||||
},
|
||||
changeType(index) {
|
||||
this.type = index
|
||||
this.page = 1
|
||||
this.hotelList = []
|
||||
this.fetchList()
|
||||
},
|
||||
fetchList() {
|
||||
getHotelList({
|
||||
name: this.name,
|
||||
page: this.page,
|
||||
type: this.typeList[this.type].id,
|
||||
cityName: this.paramCity
|
||||
}).then(res => {
|
||||
if (res.status === 200) {
|
||||
this.paramCity = this.cityName
|
||||
for (let i = 0; i < res.data.length; i++) {
|
||||
res.data[i].hide = true
|
||||
this.hotelList.push(res.data[i])
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
})
|
||||
},
|
||||
goInnDetail(item) {
|
||||
//跳转到客栈详情
|
||||
this.$yrouter.push({
|
||||
path: '/pagesInn/inn/innHome',
|
||||
query: {
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.cloud-page {
|
||||
.search-box {
|
||||
padding: 0 12rpx;
|
||||
background: #fff;
|
||||
.cloud-page {
|
||||
.search-box {
|
||||
padding: 0 12rpx;
|
||||
background: #fff;
|
||||
|
||||
/deep/.uni-searchbar__box {
|
||||
border-radius: 44rpx !important;
|
||||
}
|
||||
/deep/.uni-searchbar__box {
|
||||
border-radius: 44rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
.city-box {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
margin-left: 32rpx;
|
||||
padding: 8rpx 18rpx 8rpx 16rpx;
|
||||
border-radius: 30px;
|
||||
background: #fff;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
|
||||
.city-box {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
display: inline-flex;
|
||||
text {
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 16rpx 36rpx 24rpx;
|
||||
background: #fff;
|
||||
overflow-x: auto;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-left: 32rpx;
|
||||
padding: 8rpx 18rpx 8rpx 16rpx;
|
||||
border-radius: 30px;
|
||||
background: #fff;
|
||||
margin-left: 70rpx;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 4rpx;
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
.nav {
|
||||
color: #666;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 16rpx 36rpx 24rpx;
|
||||
background: #fff;
|
||||
overflow-x: auto;
|
||||
.item:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-left: 70rpx;
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
.list-box {
|
||||
padding: 20rpx 32rpx;
|
||||
|
||||
.nav {
|
||||
color: #666;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.item:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
.type-name {
|
||||
position: relative;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #080F1A;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
.type-name::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 10rpx;
|
||||
background: rgba(253, 104, 93, 0.39);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.list-box {
|
||||
padding: 20rpx 32rpx;
|
||||
.list {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.type-name {
|
||||
.cover {
|
||||
width: 332rpx;
|
||||
height: 332rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-right: 10rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
vertical-align: middle;
|
||||
margin: 0 8rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.cover-box {
|
||||
position: relative;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #080F1A;
|
||||
height: auto;
|
||||
|
||||
.my-mask {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 24rpx;
|
||||
background: linear-gradient(rgba(51, 51, 51, 0), rgba(0, 0, 0, 1));
|
||||
color: #fff;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type-name::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 10rpx;
|
||||
background: rgba(253, 104, 93, 0.39);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.list {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.cover {
|
||||
width: 332rpx;
|
||||
height: 332rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-right: 10rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
vertical-align: middle;
|
||||
margin: 0 8rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.cover-box {
|
||||
position: relative;
|
||||
height: auto;
|
||||
|
||||
.my-mask {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 24rpx;
|
||||
background: linear-gradient(rgba(51, 51, 51, 0), rgba(0, 0, 0, 1));
|
||||
color: #fff;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.more-t {
|
||||
margin: 10rpx;
|
||||
}
|
||||
.more-t {
|
||||
margin: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -353,6 +353,7 @@
|
||||
paddingBottom="200rpx"
|
||||
/>
|
||||
<FunctionGuide :maxStep="15" @hide="setGuide('index')" :guideData="functionGuideData" ref="FunctionGuide"></FunctionGuide>
|
||||
<AiEntrance />
|
||||
<xdd-tabbar :curr-index="0" @getElementData="elementData" @getIcon="getIcon"/>
|
||||
</view>
|
||||
</template>
|
||||
@@ -368,6 +369,7 @@ import ProductWindow from '@/components/ProductWindow'
|
||||
import goCartMixin from '@/mixins/goCartMixins'
|
||||
import FunctionGuide from '@/components/FunctionGuide'
|
||||
import GuideMixins from '@/mixins/GuideMixins'
|
||||
import AiEntrance from '@/components/aiChat/entrance'
|
||||
import {
|
||||
getSearchPageConfig
|
||||
} from '@/api/search'
|
||||
@@ -383,7 +385,8 @@ export default {
|
||||
XddTabbar,
|
||||
XddProductItem,
|
||||
ProductWindow,
|
||||
FunctionGuide
|
||||
FunctionGuide,
|
||||
AiEntrance
|
||||
},
|
||||
mixins: [pageListenMixins, goCartMixin, GuideMixins],
|
||||
data() {
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 316 KiB |
@@ -0,0 +1,92 @@
|
||||
// 引入markdown-it库
|
||||
import MarkdownIt from '@/utils/markdown-it.min.js'
|
||||
// hljs是由 Highlight.js 经兼容性修改后的文件，请勿直接升级。否则会造成uni-app-vue3-Android下有兼容问题
|
||||
import hljs from '@/utils/highlight/highlight-uni.min.js'
|
||||
// 引入html-parser.js库
|
||||
// import parseHtml from '@/utils/html-parser.js'
|
||||
|
||||
// 初始化 MarkdownIt库
|
||||
const markdownIt = MarkdownIt({
|
||||
// 在源码中启用 HTML 标签
|
||||
html: true,
|
||||
// 如果结果以 <pre ... 开头，内部包装器则会跳过。
|
||||
highlight: function(str, lang) {
|
||||
// if (lang && hljs.getLanguage(lang)) {
|
||||
// console.error('lang', lang)
|
||||
// try {
|
||||
// return '<pre class="hljs" style="padding: 5px 8px;margin: 5px 0;overflow: auto;display: block;"><code>' +
|
||||
// hljs.highlight('lang', str, true).value +
|
||||
// '</code></pre>';
|
||||
// } catch (__) {}
|
||||
// }
|
||||
// 经过highlight.js处理后的html
|
||||
let preCode = ''
|
||||
try {
|
||||
preCode = hljs.highlightAuto(str).value
|
||||
} catch (err) {
|
||||
preCode = markdownIt.utils.escapeHtml(str)
|
||||
}
|
||||
|
||||
// 以换行进行分割
|
||||
const lines = preCode.split(/\n/).slice(0, -1)
|
||||
// 添加自定义行号
|
||||
let html = lines.map((item, index) => {
|
||||
// 去掉空行
|
||||
if (item === '') {
|
||||
return ''
|
||||
}
|
||||
return '<li><span class="line-num" data-line="' + (index + 1) + '"></span>' + item + '</li>'
|
||||
}).join('')
|
||||
html = '<ol style="padding: 0px 30px;">' + html + '</ol>'
|
||||
let htmlCode = `<div style="background:#0d1117;margin-top: 5px;color: #888;padding:5px 0;border-radius: 5px;">`
|
||||
htmlCode += `<pre class="hljs" style="padding:0 8px;margin-bottom:5px;overflow: auto;display: block;border-radius: 5px;"><code>${html}</code></pre>`
|
||||
htmlCode += '</div>'
|
||||
return htmlCode
|
||||
}
|
||||
})
|
||||
|
||||
export function formatAiMsgContent(val) {
|
||||
if (!val) {
|
||||
return ''
|
||||
}
|
||||
let htmlString = ''
|
||||
// 修改转换结果的htmlString值 用于正确给界面增加鼠标闪烁的效果
|
||||
// 判断markdown中代码块标识符的数量是否为偶数
|
||||
if (val.split('```').length % 2) {
|
||||
let msgContent = val
|
||||
if (msgContent[msgContent.length - 1] !== '\n') {
|
||||
msgContent += '\n'
|
||||
}
|
||||
msgContent += ' <span class="cursor">|</span>'
|
||||
htmlString = markdownIt.render(msgContent)
|
||||
} else {
|
||||
htmlString = markdownIt.render(val)
|
||||
htmlString = markdownIt.render(val) + ' \n <span class="cursor">|</span>'
|
||||
}
|
||||
// console.log(htmlString)
|
||||
return htmlString
|
||||
}
|
||||
|
||||
/**
|
||||
* 简单实现防抖方法
|
||||
*
|
||||
* 防抖(debounce)函数在第一次触发给定的函数时，不立即执行函数，而是给出一个期限值(delay)，比如100ms。
|
||||
* 如果100ms内再次执行函数，就重新开始计时，直到计时结束后再真正执行函数。
|
||||
* 这样做的好处是如果短时间内大量触发同一事件，只会执行一次函数。
|
||||
*
|
||||
* @param fn 要防抖的函数
|
||||
* @param delay 防抖的毫秒数
|
||||
* @returns {Function}
|
||||
*/
|
||||
export function simpleDebounce(fn, delay = 100) {
|
||||
let timer = null
|
||||
return function() {
|
||||
const args = arguments
|
||||
if (timer) {
|
||||
clearTimeout(timer)
|
||||
}
|
||||
timer = setTimeout(() => {
|
||||
fn.apply(null, args)
|
||||
}, delay)
|
||||
}
|
||||
}
|
||||
Vendored
+10
@@ -0,0 +1,10 @@
|
||||
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
|
||||
Theme: GitHub Dark
|
||||
Description: Dark theme as seen on github.com
|
||||
Author: github.com
|
||||
Maintainer: @Hirse
|
||||
Updated: 2021-05-15
|
||||
|
||||
Outdated base version: https://github.com/primer/github-syntax-dark
|
||||
Current colors taken from GitHub's CSS
|
||||
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}
|
||||
Vendored
+5256
File diff suppressed because one or more lines are too long
Vendored
+2
File diff suppressed because one or more lines are too long
@@ -74,9 +74,6 @@ function baseRequest(options) {
|
||||
|
||||
// 结构请求需要的参数
|
||||
const {url, params, data, login, ...option} = options
|
||||
console.log(params, '=====params');
|
||||
console.log(params, '=====data');
|
||||
console.log(option, '=======option');
|
||||
let _params = {}
|
||||
if(['get', 'GET'].includes(options.method)) {
|
||||
_params = {
|
||||
|
||||
+3
-3
@@ -155,7 +155,7 @@ function pushSysBySecondsHandle() {
|
||||
}
|
||||
}
|
||||
if (statsData.length < 1) {
|
||||
console.log('*************没有页面埋点数据则不用上报，节约网络请求')
|
||||
// console.log('*************没有页面埋点数据则不用上报，节约网络请求')
|
||||
return
|
||||
}
|
||||
// 设备类型phone、pad、pc、unknow
|
||||
@@ -169,7 +169,7 @@ function pushSysBySecondsHandle() {
|
||||
deviceType: deviceType === 'phone' ? osName : 'unknown',
|
||||
statsData
|
||||
}
|
||||
console.log('开始上报数据-------------------')
|
||||
// console.log('开始上报数据-------------------')
|
||||
pushSystemStatic(postData).then(res => {
|
||||
const { success } = res
|
||||
if (success) {
|
||||
@@ -177,7 +177,7 @@ function pushSysBySecondsHandle() {
|
||||
for (const key in Vue.prototype.$pageToWatchData) {
|
||||
Vue.prototype.$pageToWatchData[key] = []
|
||||
}
|
||||
console.log('*************清除上次未登录缓存的页面埋点数据')
|
||||
// console.log('*************清除上次未登录缓存的页面埋点数据')
|
||||
uni.removeStorageSync(pageViewDataCacheKey)
|
||||
}
|
||||
}).catch(err => {
|
||||
|
||||
Reference in New Issue
Block a user