小助理

This commit is contained in:
liuye
2024-08-22 14:59:21 +08:00
parent 3fff92077b
commit 58a93432d9
9 changed files with 78 additions and 43 deletions

View File

@@ -14,6 +14,7 @@
</div> </div>
</AiTopFixed> --> </AiTopFixed> -->
<div class="search-content"> <div class="search-content">
<p>已切换至{{messageList[0].aiConfigName}}</p>
<u-search v-model="searchVal" :clearabled="true" placeholder="请输入搜索关键词…" :show-action="false" <u-search v-model="searchVal" :clearabled="true" placeholder="请输入搜索关键词…" :show-action="false"
bg-color="#F4F6FA" search-icon-color="#666" color="#666" height="72" @search="getSearchList" @clear="handerClear"> bg-color="#F4F6FA" search-icon-color="#666" color="#666" height="72" @search="getSearchList" @clear="handerClear">
</u-search> </u-search>
@@ -22,7 +23,7 @@
<div v-for="(item, index) in messageList" :key="index"> <div v-for="(item, index) in messageList" :key="index">
<div class="send-time">{{item.createTime.substring(5, 16)}}</div> <div class="send-time">{{item.createTime.substring(5, 16)}}</div>
<div :class="item.userType == 1 ? 'item-left' : 'item-right'"> <div :class="item.userType == 1 ? 'item-left' : 'item-right'">
<img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType == 1"> <img src="https://cdn.sinoecare.com/i/2024/08/22/66c6de5a9db60.jpg" alt="" class="user-img" v-if="item.userType == 1">
<div class="item" :class="'item'+index"> <div class="item" :class="'item'+index">
<u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon> <u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon>
<u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon> <u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon>
@@ -38,6 +39,7 @@
</div> </div>
<AiEmpty v-if="!messageList.length"/> <AiEmpty v-if="!messageList.length"/>
</div> </div>
<img src="https://cdn.sinoecare.com/i/2024/08/22/66c69f4d33eb1.png" alt="" class="bg-center">
</div> </div>
</template> </template>
@@ -199,13 +201,21 @@ page {
} }
} }
.search-content { .search-content {
padding: 32px; padding: 28px 32px;
width: 100%; width: 100%;
background-color: #fff;
box-sizing: border-box; box-sizing: border-box;
position: fixed; position: fixed;
left: 0; left: 0;
z-index: 99; z-index: 9;
p {
line-height: 34px;
font-family: PingFangSC-Regular;
font-weight: 400;
font-size: 24px;
color: #999;
text-align: center;
padding-bottom: 28px;
}
} }
@@ -213,7 +223,7 @@ page {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
padding: 144px 32px 364px; padding: 238px 32px 364px;
.send-time { .send-time {
display: block; display: block;
width: 100%; width: 100%;
@@ -290,5 +300,13 @@ page {
} }
} }
} }
.bg-center {
position: fixed;
top: 50%;
left: 50%;
width: 306px;
height: 364px;
margin: -182px 0 0 -153px;
}
} }
</style> </style>

View File

@@ -20,6 +20,7 @@
</div> </div>
<AiEmpty v-if="!messageList.length"/> <AiEmpty v-if="!messageList.length"/>
</div> </div>
<img src="https://cdn.sinoecare.com/i/2024/08/22/66c69f4d33eb1.png" alt="" class="bg-center">
</div> </div>
</template> </template>
@@ -192,5 +193,13 @@ page {
} }
} }
} }
.bg-center {
position: fixed;
top: 50%;
left: 50%;
width: 306px;
height: 364px;
margin: -182px 0 0 -153px;
}
} }
</style> </style>

View File

@@ -14,11 +14,11 @@
<div class="service-content" v-if="!messageList.length"> <div class="service-content" v-if="!messageList.length">
<div class="text-content"> <div class="text-content">
<div class="text-left"> <div class="text-left">
<div>你好呀</div> <div>我是忠小卫</div>
<p>我是您的<span>Copilot小助理</span></p> <p>你最忠诚的AI搭档</p>
<p>有什么问题都可以问我哟~</p> <p>说出你的诉求我们一起想办法</p>
</div> </div>
<img src="https://cdn.cunwuyun.cn/wechat/biaopin/residentAssistant/service.png" alt="" class="service-img"> <!-- <img src="https://cdn.sinoecare.com/i/2024/08/22/66c69f4ea77c5.png" alt="" class="service-img"> -->
</div> </div>
</div> </div>
<!-- <div class="list-bg" v-if="messageList.length"></div> --> <!-- <div class="list-bg" v-if="messageList.length"></div> -->
@@ -26,7 +26,7 @@
<div v-for="(item, index) in messageList" :key="index"> <div v-for="(item, index) in messageList" :key="index">
<div class="send-time">{{item.createTime.substring(5, 16)}}</div> <div class="send-time">{{item.createTime.substring(5, 16)}}</div>
<div :class="item.userType == 1 ? 'item-left' : 'item-right'"> <div :class="item.userType == 1 ? 'item-left' : 'item-right'">
<img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType == 1"> <img src="https://cdn.sinoecare.com/i/2024/08/22/66c6de5a9db60.jpg" alt="" class="user-img" v-if="item.userType == 1">
<div class="item" :class="'item'+index"> <div class="item" :class="'item'+index">
<u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon> <u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon>
<u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon> <u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon>
@@ -82,6 +82,7 @@
<div class="load-content" v-if="showLoad"> <div class="load-content" v-if="showLoad">
<img src="https://cdn.sinoecare.com/i/2024/08/07/66b2cfd4d220d.gif" alt=""> <img src="https://cdn.sinoecare.com/i/2024/08/07/66b2cfd4d220d.gif" alt="">
</div> </div>
<img src="https://cdn.sinoecare.com/i/2024/08/22/66c69f4d33eb1.png" alt="" class="bg-center">
</div> </div>
</template> </template>
<script> <script>
@@ -400,66 +401,66 @@ page {
font-size: 24px; font-size: 24px;
color: #708099; color: #708099;
text-align: center; text-align: center;
padding: 10px 0 8px 0; padding: 0 0 10px 0;
line-height: 34px; line-height: 34px;
} }
} }
.top-select { .top-select {
display: inline-block; display: inline-block;
line-height: 64px; line-height: 66px;
background: #026AF2; height: 68px;
border-radius: 32px; background: #fff;
text-align: center; border: 1px solid #528CFF;
padding: 0 24px; border-radius: 34px;
font-family: PingFangSC-Medium; font-family: PingFangSC-Regular;
font-weight: 500; font-weight: 400;
font-size: 28px; font-size: 28px;
color: #FFF; color: #0052F5;
padding: 0 24px;
box-sizing: border-box;
u-icon { u-icon {
margin-left: 8px; margin-left: 4px;
} }
} }
.service-content { .service-content {
width: 100%; width: 100%;
height: 420px; height: 420px;
// background-image: url("https://cdn.cunwuyun.cn/wechat/biaopin/residentAssistant/content-top-bg.png"); // background-image: url("https://cdn.sinoecare.com/i/2024/08/22/66c6b4384635e.jpg");
// background-size: 100vw; // background-size: 100% 100%;
// background-repeat: no-repeat; // background-repeat: no-repeat;
padding-top: 148px; margin-top: 144px;
box-sizing: border-box; box-sizing: border-box;
padding-top: 28px;
.text-content { .text-content {
margin: 0 0 0 32px; margin: 0 0 0 32px;
width: 686px; width: 686px;
height: 260px; height: 260px;
background-image: url("https://cdn.cunwuyun.cn/wechat/biaopin/residentAssistant/service-content-bg.png"); background-image: url("https://cdn.sinoecare.com/i/2024/08/22/66c69f4ea77c5.png");
background-size: 100vw; background-size: 100% 100%;;
background-repeat: no-repeat; background-repeat: no-repeat;
padding: 32px; padding: 32px;
box-sizing: border-box; box-sizing: border-box;
border-radius: 32px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.text-left { .text-left {
width: calc(100% - 192px); width: calc(100% - 192px);
div { div {
line-height: 54px; line-height: 56px;
font-family: SourceHanSansCN-Bold; font-family: PingFangSC-SNaNpxibold;
font-weight: 700; font-weight: 600;
font-size: 36px; font-size: 40px;
// background: linear-gradient(to bottom, #2A6EE9, #58A5F7); background-image: linear-gradient(to right, #F57A00, #FFAA00);
// -webkit-background-clip: text; background-clip: text;
// -webkit-text-fill-color: transparent; -webkit-background-clip: text;
margin-bottom: 16px; -webkit-text-fill-color: transparent;
margin-bottom: 12px;
} }
p { p {
color: #222; height: 44px;
font-family: PingFangSC-Regular;
font-weight: 400;
font-size: 28px; font-size: 28px;
font-family: SourceHanSansCN; color: #222;
line-height: 44px;
span {
display: inline-block;
font-weight: 700;
}
} }
} }
.service-img { .service-img {
@@ -473,7 +474,7 @@ page {
.list-bg { .list-bg {
width: 100%; width: 100%;
height: 420px; height: 420px;
background-image: url("https://cdn.cunwuyun.cn/wechat/biaopin/residentAssistant/content-top-bg.png"); background-image: url("https://cdn.sinoecare.com/i/2024/08/22/66c6b4384635e.jpg");
position: fixed; position: fixed;
left: 0; left: 0;
z-index: 1; z-index: 1;
@@ -726,7 +727,14 @@ page {
top: 50%; top: 50%;
margin-top: -280px; margin-top: -280px;
} }
}
.bg-center {
position: fixed;
top: 50%;
left: 50%;
width: 306px;
height: 364px;
margin: -182px 0 0 -153px;
} }
} }
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 795 B

After

Width:  |  Height:  |  Size: 808 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 806 B

After

Width:  |  Height:  |  Size: 1014 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB