完成宠物小程序基础功能开发

✨ 新功能:
- 创建了4个主要Tab页面:宠物、助手、领养、我的
- 集成uview-ui-next UI框架
- 添加可爱的宠物主题图标
- 实现宠物列表展示和管理功能
- 配置微信小程序登录功能

🎨 界面优化:
- 使用uView组件美化界面
- 统一的设计风格和配色方案
- 响应式布局适配

📦 技术栈:
- uni-app + Vue3
- uview-ui-next UI框架
- 微信小程序平台
This commit is contained in:
2025-08-12 10:30:31 +08:00
parent dfdd118952
commit 3c7238a45c
19 changed files with 630 additions and 5 deletions
+105
View File
@@ -0,0 +1,105 @@
<template>
<view class="assistant-container">
<view class="header">
<text class="title">AI助手</text>
</view>
<view class="chat-area">
<view class="welcome-message">
<text class="welcome-text">您好!我是您的宠物AI助手</text>
<text class="welcome-desc">可以为您解答宠物饲养、健康、训练等问题</text>
</view>
</view>
<view class="input-area">
<input class="message-input" placeholder="请输入您的问题..." />
<view class="send-btn">
<text class="send-text">发送</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
}
}
</script>
<style lang="scss" scoped>
.assistant-container {
display: flex;
flex-direction: column;
height: 100vh;
background-color: #f8f9fa;
}
.header {
padding: 20rpx 30rpx;
background-color: white;
border-bottom: 1rpx solid #eee;
.title {
font-size: 36rpx;
font-weight: bold;
color: #333;
}
}
.chat-area {
flex: 1;
padding: 40rpx;
display: flex;
align-items: center;
justify-content: center;
}
.welcome-message {
text-align: center;
.welcome-text {
font-size: 32rpx;
color: #333;
display: block;
margin-bottom: 20rpx;
}
.welcome-desc {
font-size: 26rpx;
color: #666;
display: block;
}
}
.input-area {
background-color: white;
padding: 20rpx 30rpx;
border-top: 1rpx solid #eee;
display: flex;
align-items: center;
.message-input {
flex: 1;
background-color: #f5f5f5;
border-radius: 30rpx;
padding: 20rpx 30rpx;
font-size: 28rpx;
margin-right: 20rpx;
}
.send-btn {
background-color: #4ecdc4;
padding: 20rpx 40rpx;
border-radius: 30rpx;
.send-text {
color: white;
font-size: 28rpx;
}
}
}
</style>