diff --git a/src/api/request.js b/src/api/request.js
index b0c4ae38..97a9fb43 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -8,7 +8,7 @@ const ENV = import.meta.env
export const get_base_url = url => {
if (ENV.MODE === 'development') { // 开发环境
- return ENV.VITE_APP_BASE_API_Url
+ return ENV.VITE_APP_BASE_API_Url
// H5必须用非https，手机端必须用https
// #ifdef H5
const baseUrl = ENV.VITE_APP_BASE_API_Url
diff --git a/src/pages/mascot/mascot_select_list.vue b/src/pages/mascot/mascot_select_list.vue
index 54038adb..09e0bdc3 100644
--- a/src/pages/mascot/mascot_select_list.vue
+++ b/src/pages/mascot/mascot_select_list.vue
@@ -13,12 +13,13 @@
-
+
-
+
@@ -41,15 +42,17 @@
-->
-
+
-
-
+
+
@@ -60,7 +63,8 @@
onMounted,
onUnmounted,
ref,
- reactive
+ reactive,
+ computed
} from 'vue';
import {
queryValidTraMascotInfo,
@@ -74,28 +78,68 @@
import {
onLoad
} from '@dcloudio/uni-app';
+
const mascotList = reactive([])
- onLoad(() => {
- common.loading()
- queryValidTraMascotInfo().then(({
- body
- }) => {
- Object.assign(mascotList, {
- ...body
- })
- console.log(mascotList);
- common.hideLoading()
- })
- })
- const swiperCount = 4; // 总共有4个轮播项
+ const windowsInfo = uni.getWindowInfo()
+ const nowWidth = ref(0);
+ const swiperCount = 4; // 总轮播项数量
+ const TRANSITION_RATIO = 0.3;
+ // 计算过渡起点（像素值，取整）：屏幕宽度的20%位置
+ const TRANSITION_SUM = computed(() => Math.floor(windowsInfo.screenWidth * TRANSITION_RATIO));
+ const TRANSITION_START = computed(() => Math.floor(windowsInfo.screenWidth * (1 - TRANSITION_RATIO)));
+ // 计算过渡终点（像素值，取整）：屏幕宽度的80%位置
+ const TRANSITION_END = computed(() => Math.floor(windowsInfo.screenWidth * TRANSITION_RATIO));
+ // 第一张图透明度（0、2索引显示）
+ const btn1Opacity = computed(() => {
+
+ if (initialIndex % 2 === 1) { // 淡入
+ console.log('111我淡入淡入');
+ 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.value) {
+ return 1;
+ } else {
+ return Math.max(0, 1 - (TRANSITION_END.value - nowWidth.value) / TRANSITION_SUM.value);
+ }
+ }
+ });
+
+ const btn2Opacity = computed(() => {
+ return 0;
+ const initialIndex = swiperIndex.value;
+ if (initialIndex % 2 === 0) { // 淡入
+ console.log('222我淡入');
+ if (nowWidth.value <= TRANSITION_START.value) {
+ return 1;
+ } else {
+ return Math.max(0, 1 - (TRANSITION_END.value - nowWidth.value) / TRANSITION_SUM.value);
+
+ }
+ } else { // 淡出
+ console.log('222我淡出');
+ if (nowWidth.value >= TRANSITION_END.value) {
+ return 0;
+ } else {
+ return Math.min(1, (nowWidth.value - TRANSITION_START.value) / TRANSITION_SUM.value);
+ }
+ }
+ });
+
let swiperIndex = ref(0); // 当前显示第1个（索引0）
const isAnimating = ref(false); // 标记动画是否进行中
- const animationfinish = () => {
- console.log("动画结束，允许下次点击");
+ const animationfinish = ({
+ detail
+ }) => {
+ swiperIndex.value = detail.current
isAnimating.value = false; // 动画结束后重置状态
};
-
+ // 点击左右切换按钮
const doct_click = (num) => {
if (isAnimating.value) return; // 1. 如果动画正在进行，直接忽略点击
isAnimating.value = true;
@@ -103,7 +147,13 @@
swiperIndex.value = newIndex; // 更新当前索引
};
- // 选择他
+ // 当前宽度
+ const transition = ({
+ detail
+ }) => {
+ nowWidth.value = Math.abs(detail.dx)
+ }
+
const select_it = () => {
const item = mascotList[swiperIndex.value]
common.loading()
@@ -130,7 +180,18 @@
common.hideLoading()
})
}
-
+ onLoad(() => {
+ common.loading()
+ queryValidTraMascotInfo().then(({
+ body
+ }) => {
+ Object.assign(mascotList, {
+ ...body
+ })
+ console.log(mascotList);
+ common.hideLoading()
+ })
+ })
onMounted(() => {
})
@@ -234,8 +295,10 @@
margin-top: 20rpx;
width: 80%;
height: 120rpx;
+ position: relative;
.img {
+ position: absolute;
width: 100%;
height: 100%;
}
diff --git a/src/pages/me/index.vue b/src/pages/me/index.vue
index b1a5feb4..49b0eeae 100644
--- a/src/pages/me/index.vue
+++ b/src/pages/me/index.vue
@@ -25,7 +25,7 @@
- 工号：{{ user_info.userId }}
+ 工号：{{ user_info.loginName }}