tianyan/tra-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

设置首页吉祥物

Browse Source
This commit is contained in:
田岩
2025-07-21 16:51:50 +08:00
parent 2fe3ae7ee4
commit 569dcd896e
18 changed files with 97 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+7 -1
View File
@@ -1,7 +1,13 @@
<script>
export default {
onLaunch: function () {
// console.log('App Launch')
uni.onTabBarMidButtonTap(() => {
uni.navigateTo({
url: '/pages/index/dialog',
animationType: 'slide-in-bottom'
});
})
console.log('App Launch')
},
onShow: function () {
// console.log('App Show')
src/api/login.js
+1
View File
@@ -61,6 +61,7 @@ export const useAccountLoginApp = (data) => request({
...userInfo,
'mascotInfo': mascotInfo
})
console.log(mascotInfo);
return {
mascotState:!mascotInfo.mascotId
}
src/api/request.js
+1 -2
View File
@@ -6,10 +6,10 @@ import common from '@/common/common.js'
const ENV = import.meta.env
export const get_base_url = url => {
if (ENV.MODE === 'development') { // 开发环境
// H5必须用非https，手机端必须用https
// #ifdef H5
return ENV.VITE_APP_BASE_H5_API_Url || ENV.VITE_APP_BASE_API_Url
const baseUrl = ENV.VITE_APP_BASE_API_Url
if (baseUrl.startsWith('https')) {
return baseUrl.replace('https', 'http')
@@ -67,7 +67,6 @@ export default function request({
headers_base['summary'] = token // 让每个请求携带令牌
}
let that = this
console.log('base_url', base_url, url);
return new Promise((resolve, reject) => {
uni.request({
url: `${baseUrl || base_url}${url}`,
src/common/mascot.js
+23
View File
@@ -0,0 +1,23 @@
// 设置科技鹿
import {getUserInfo} from "@/common/common.js"
import common from "@/common/common.js"
export const setMascot = () => {
const mascotState = common.getValue('mascotState') || false
console.log('设置科技鹿', mascotState);
if (!mascotState) {
const userInfo = getUserInfo()
const mascotInfo = userInfo['mascotInfo']
uni.setTabBarStyle({
midButton: {
iconPath: "/static/images/icon/fawn-" + (mascotInfo?.mascotNo || '1') + ".png",
width: "86px",
height: "86px",
iconWidth: "90px"
},
success: () => {
common.setValue('mascotState', true)
}
})
}
return mascotState
}
src/pages.json
+1 -1
View File
@@ -190,7 +190,7 @@
"height": "70px",
"spacing": "10px",
"midButton": {
"iconPath": "/static/images/icon/fawn.png",
"iconPath": "/static/images/icon/fawn-1.png",
"width": "86px",
"height": "86px",
"iconWidth": "90px"
src/pages/courseDetail/submit.vue
+1 -1
View File
@@ -86,7 +86,7 @@
publishCrsEvaluation(formData).then(res => {
common.msg('发表成功')
setTimeout(() => {
uni.$emit('refresh_comment_data')
uni.$emit('setMascot')
if(from.value === 'study'){
} else {
}
src/pages/index/index.vue
+44 -14
View File
@@ -46,7 +46,8 @@
<view class="study_duration_and_profile_div">
<!-- 飞天兔子 -->
<view class="profile_div">
<image src="/static/images/index/fttz.png" class="profile"></image>
<image-preview :src="mascotInfo?.imgAddr ||''" alt="" class="profile"></image-preview>
<!-- <image src="/static/images/index/fttz.png" class="profile"></image> -->
</view>
<!-- 学习时长 -->
<view class="study_duration_div">
@@ -82,12 +83,13 @@
<image class="icon" src="@/static/images/index/navigation_course.png"></image>
<view class="title">课程中心</view>
</view>
<view class="item" @click="common.navigateTo('/pages/index/dialog',{ animationType: 'slide-in-bottom'})">
<view class="item"
@click="common.navigateTo('/pages/index/dialog',{ animationType: 'slide-in-bottom'})">
<image class="icon" src="@/static/images/index/navigation_question_answering.png"></image>
<view class="title">AI问答</view>
</view>
<view class="item">
<image class="icon" src="@/static/images/index/navigation_ai.png"></image>
<image class="icon" src="@/static/images/index/navigation_ai.png" @click="ai_test()"></image>
<view class="title">AI陪练</view>
</view>
<view class="item">
@@ -129,7 +131,8 @@
<uv-skeleton :loading="!item.crsNum" :rows="3" avatar avatar-shape="square" :title="false">
<view class="item" @click="goto_course_detail(item.crsNum)">
<view class="left">
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill" :isCache="true" :width="240" :height="240"></image-preview>
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill"
:isCache="true" :width="240" :height="240"></image-preview>
</view>
<view class="right">
<view class="title ellipsis-text">{{item.crsName}}</view>
@@ -161,8 +164,9 @@
<view class="item_div">
<uv-skeleton :loading="!item.crsNum" :rows="3" avatar avatar-shape="square" :title="false">
<view class="item" @click="goto_course_detail(item.crsNum)">
<view class="left">
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill" :isCache="true" :width="240" :height="240"></image-preview>
<view class="left">
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill"
:isCache="true" :width="240" :height="240"></image-preview>
</view>
<view class="right">
<view class="title ellipsis-text">{{item.crsName}}</view>
@@ -194,7 +198,8 @@
<uv-skeleton :loading="!item.crsNum" :rows="3" avatar avatar-shape="square" :title="false">
<view class="item" @click="goto_course_detail(item.crsNum)">
<view class="left">
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill" :isCache="true" :width="240" :height="240"></image-preview>
<image-preview class="img-box img" :imgId="item.imgId" mode="aspectFill"
:isCache="true" :width="240" :height="240"></image-preview>
</view>
<view class="right">
<view class="title ellipsis-text">{{item.crsName}}</view>
@@ -215,7 +220,6 @@
<uv-divider text='我是有底线的' lineColor="#9cB0DC" :hairline="true"></uv-divider>
</view>
</view>
<tabbar-shadow></tabbar-shadow>
</view>
</template>
@@ -239,7 +243,12 @@
placeholderStyle,
suffixIconStyle
} from './index.js'
import {
getUserInfo
} from '@/common/common';
import common from '@/common/common'
import {setMascot} from "@/common/mascot.js"
import {
getStatisticsData,
queryCrsInfoByLastnew,
@@ -257,9 +266,11 @@
if (scrollTop.value <= 130) return 0;
return Math.min(3, (scrollTop.value - 130) / 30);
});
const bgOpacity = computed(() => {
return `rgba(246,248,255,${opacity.value})`;
});
// 首页滑动事件监听
onPageScroll((e) => {
scrollTop.value = e.scrollTop
@@ -283,7 +294,7 @@
const hot_class_list = ref([...init_class_data])
const new_class_list = ref([...init_class_data])
const recommend_class_list = ref([...init_class_data])
const mascotInfo = ref({})
const statistics_data = reactive({
'stdtTmLen': 0, // 学习
'accmPracticeCnt': 0, // 训练
@@ -337,6 +348,21 @@
}
});
const index = ref(0)
const ai_test = () => {
index.value++
if (index.value == 4) {
index.value = 1
}
uni.setTabBarStyle({
midButton: {
iconPath: "/static/images/icon/fawn-" + index.value + ".png",
width: "86px",
height: "86px",
iconWidth: "90px"
},
})
}
// 进入搜索页
const goto_search_page = () => {
common.navigateTo('/pages/search/search')
@@ -345,8 +371,14 @@
const goto_course_detail = (crsNum) => {
common.navigateTo('/pages/courseDetail/index?crsNum=' + crsNum)
}
const scrolltolower = () => {
common.navigateTo('/pages/index/dialog', {
animationType: 'slide-in-bottom'
})
}
onShow(() => {
console.log('onShow');
setMascot()
mascotInfo.value = getUserInfo('mascotInfo')
if (!common.isLogin()) {
common.navigateTo('/pages/login/login')
return
@@ -363,9 +395,6 @@
recommend_class_list.value = res.body
})
})
onLoad(async () => {
})
</script>
@@ -381,7 +410,7 @@
width: 146rpx !important;
border-radius: 16rpx;
}
// 底线样式
.bottom_line {
margin: 0 auto;
@@ -488,6 +517,7 @@
position: relative;
z-index: 0;
overflow-x: hidden;
// 背景图
.bg_img {
position: absolute;
src/pages/login/login.vue
+4 -2
View File
@@ -105,10 +105,11 @@ const login_fun = (): void => {
account: account.value,
password: password.value
});
// res['mascotState']
if (false) { // 判断是否跳转到选科技鹿页面
if (res['mascotState']) { // 判断是否跳转到选科技鹿页面
common.redirectTo('/pages/mascot/mascot_select_list');
} else {
common.setValue('mascotState', false) // 清空科技鹿设置
common.msg('登录成功');
const pages = getCurrentPages();
if (pages.length >= 2) {
@@ -142,6 +143,7 @@ onMounted(() => {
password.value = loginAccountData.password;
}
back_state.value = true;
});
// 跳进了登录页，禁止返回操作
onBackPress(() => back_state.value);
src/pages/mascot/mascot_select_list.vue
+6 -77
View File
@@ -18,8 +18,7 @@
<image src="/src/static/images/mascot/btn_left.png" class="img" mode="widthFix"></image>
</view>
</view>
<swiper class="swiper" circular :current="swiperIndex" @animationfinish='animationfinish'
@transition="transition">
<swiper class="swiper" circular :current="swiperIndex" @animationfinish='animationfinish'>
<swiper-item class="" v-for="(item, index) in mascotList" :key="index">
<view class="swiper-item-div">
<!-- <image src="@/static/images/mascot/ma_1.png" class="img" mode="widthFix"></image> -->
@@ -49,10 +48,10 @@
</view>
</view>
<view class="button_div">
<image src="@/static/images/mascot/btn_1.png" class="img" mode="aspectFit"
<image v-show="swiperIndex % 2" src="@/static/images/mascot/btn_1.png" class="img" mode="aspectFit"
@click="select_it()"></image>
<image v-show="(swiperIndex+1) % 2" src="@/static/images/mascot/btn_2.png" class="img" mode="aspectFit"
@click="select_it()"></image>
<!-- <image :style="{ opacity: btn2Opacity }" src="@/static/images/mascot/btn_2.png" class="img" mode="aspectFit"
@click="select_it()"></image> -->
</view>
<view class="fl1"></view>
</view>
@@ -78,74 +77,12 @@
import {
onLoad
} from '@dcloudio/uni-app';
const mascotList = reactive([])
const windowsInfo = uni.getWindowInfo()
const nowWidth = ref(0);
let initialIndex = 0; // 总轮播项数量
const swiperCount = 4; // 总轮播项数量
const TRANSITION_RATIO = 0.3;
const aa = computed(() => Math.floor(nowWidth.value / windowsInfo.screenWidth ));
// 计算过渡起点（像素值，取整）：屏幕宽度的20%位置
const TRANSITION_SUM = windowsInfo.screenWidth
const TRANSITION_START = Math.floor(windowsInfo.screenWidth * TRANSITION_RATIO)
// 计算过渡终点（像素值，取整）：屏幕宽度的80%位置
const TRANSITION_END = Math.floor(windowsInfo.screenWidth * (1 - TRANSITION_RATIO))
// 第一张图透明度（0、2索引显示）
console.log(TRANSITION_SUM, TRANSITION_START, TRANSITION_END);
const btn1Opacity = computed(() => {
return 0;
if (initialIndex % 2 === 0) { // 淡入
if (nowWidth.value <= TRANSITION_START.value) {
return 0;
} else {
return Math.min(1, (nowWidth.value - TRANSITION_START.value) / TRANSITION_SUM.value);
}
} else { // 淡出
// console.log('111我淡出');
if (nowWidth.value >= TRANSITION_END) {
return 0;
} else {
return Math.max(0, 1 - (TRANSITION_END.value - nowWidth.value) / TRANSITION_SUM.value);
}
}
});
const btn2Opacity = computed(() => {
const aa = initialIndex
if (nowWidth.value === windowsInfo.screenWidth) {
initialIndex++
console.log('嘻嘻切换。initialIndex');
}
if (aa % 2 === 1) { // 淡入
// if (nowWidth.value <= TRANSITION_START) {
// console.log(1);
// return 1;
// } else {
// console.log(Math.max(0, 1 - (TRANSITION_END - nowWidth.value) / TRANSITION_SUM));
// return Math.max(0, 1 - (TRANSITION_END - nowWidth.value) / TRANSITION_SUM);
// }
} else { // 淡出
// console.log('222我淡出');
if (nowWidth.value >= TRANSITION_END) {
console.log('淡入1', nowWidth.value, TRANSITION_END);
return 1;
} else {
console.log('淡入2', nowWidth.value / TRANSITION_SUM);
console.log('淡入2', Math.min(1, nowWidth.value / TRANSITION_SUM));
return Math.min(0, nowWidth.value / TRANSITION_SUM);
}
}
});
let swiperIndex = ref(0); // 当前显示第1个（索引0）
const isAnimating = ref(false); // 标记动画是否进行中
@@ -162,15 +99,6 @@
let newIndex = (swiperIndex.value + num + swiperCount) % swiperCount;
swiperIndex.value = newIndex; // 更新当前索引
};
// 当前宽度
const transition = ({
detail
}) => {
nowWidth.value = Math.abs(detail.dx)
console.log('宽度', nowWidth.value);
}
const select_it = () => {
const item = mascotList[swiperIndex.value]
common.loading()
@@ -184,6 +112,7 @@
})
common.hideLoading()
common.msg('设置成功')
common.setValue('mascotState', false)
setTimeout(() => {
const pages = getCurrentPages();
if (pages.length >= 2) {
@@ -313,7 +242,7 @@
width: 80%;
height: 120rpx;
position: relative;
.img {
position: absolute;
width: 100%;
src/pages/me/index.vue
+3 -10
View File
@@ -133,6 +133,7 @@
import {
uploadFile
} from '@/api/common'
import {setMascot} from "@/common/mascot.js"
import { queryCurrentUser} from '@/api/login.js';
const socketStore = useSocketStore()
const accmTaskCntRef = ref(null);
@@ -202,16 +203,6 @@
const goTest = () => {
console.log('goTest');
common.navigateTo('/pages/test/index');
// const now = Date.now();
// if (now - lastClickTime.value > 500) {
// clickCount.value = 0;
// }
// clickCount.value++;
// lastClickTime.value = now;
// if (clickCount.value == 6) {
// common.navigateTo('/pages/test/index');
// clickCount.value = 0;
// }
};
@@ -230,6 +221,8 @@
});
};
onShow(() => {
setMascot()
const user_info_cache = getUserInfo();
Object.assign(user_info, user_info_cache);
console.log('user_info', user_info);
src/pagesOther.json
+1 -1
View File
@@ -81,7 +81,7 @@
"height": "70px",
"spacing": "10px",
"midButton": {
"iconPath": "/static/images/icon/fawn.png",
"iconPath": "/static/images/icon/fawn-1.png",
"width": "86px",
"height": "86px",
"iconWidth": "90px"
src/static/images/icon/fawn-1.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 372 KiB

src/static/images/icon/fawn-2.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 361 KiB

src/static/images/icon/fawn-3.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 299 KiB

src/static/images/icon/fawn-4.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 292 KiB

src/static/images/icon/fawn.png → src/static/images/icon/fawn-x.png
View File
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 52 KiB

After

Width:  |  Height:  |  Size: 52 KiB