用户首页优化

components/Client/new_file.vue

@@ -6,12 +6,12 @@
         <up-grid :border="false" col="3">
           <up-grid-item v-for="(item, index) in serveiceList" :key="index" @click="handleGridClick(item)">
             <view class="grid-box">
-              <view class="grid-icon">
+              <view class="grid-image">
                 <image :src="item.businessIcon" class="service-img" mode="aspectFit" />
               </view>
               <view class="grid-content">
                 <text class="grid-text">{{ item.businessName }}</text>
-                <text>{{ item.businessDescribe }}</text>
+                <text class="grid-text-bone">{{ item.businessDescribe }}</text>
               </view>
             </view>
           </up-grid-item>
@@ -34,20 +34,20 @@
 
 <script setup>
 import {
-	ref,
-	onMounted,
-	watch,
-	computed,
-	provide
+  ref,
+  onMounted,
+  watch,
+  computed,
+  provide
 } from 'vue';
 import {
-	workDate,
-	getDataTime,
-	getVolunteerInfo
+  workDate,
+  getDataTime,
+  getVolunteerInfo
 } from '@/api/volunteer.js'
 import {
-	volunteerSeachgetTreeList,
-	volunteerDataList
+  volunteerSeachgetTreeList,
+  volunteerDataList
 } from "@/api/volunteerDetailsApi/details.js"
 import { getTreeList } from '@/api/volunteer'
 import Calendar from '../../components/uni-calendar/components/uni-calendar/uni-calendar.vue'
@@ -62,9 +62,9 @@ const userOrWorker = uni.getStorageSync('storage_data').vuex_userOrWorker //读
 
 const calendar = ref(null)
 const info = ref({
-	lunar: true,
-	range: true,
-	insert: false,
+  lunar: true,
+  range: true,
+  insert: false,
 })
 const selected = ref([])
 
@@ -74,213 +74,201 @@ const serveiceList = ref([]);
 
 // 宫格点击事件
 const handleGridClick = async (service) => {
-	// 用户
-	if (userType == 1) {
-
-		// 动态获取 parentId
-		const params = {
-			parentId: service.id,
-		}
-		const res = await volunteerSeachgetTreeList(params)
-		uni.navigateTo({
-			url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}&serviceCategory=${service.id}`
-		});
-	}
-	// 志愿者
-	if (userType == 2) {
-		const res = await getVolunteerInfo({
-			serviceCategory: service.id
-		});
-		if (res.code === 200 && res.data) {
-			//已有注册，跳转详情页面
-			uni.navigateTo({
-				url: `/pages_home/pages/details/index?data=${encodeURIComponent(JSON.stringify({...service,key: service.id}))}`
-			})
-			return
-		}
-
-		uni.navigateTo({
-			url: `/pages_home/pages/register/index?data=${encodeURIComponent(JSON.stringify({...service,key: service.id}))}`
-		})
-
-	}
+  // 用户
+  if (userType == 1) {
+
+    // 动态获取 parentId
+    const params = {
+      parentId: service.id,
+    }
+    const res = await volunteerSeachgetTreeList(params)
+    uni.navigateTo({
+      url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}&serviceCategory=${service.id}`
+    });
+  }
+  // 志愿者
+  if (userType == 2) {
+    const res = await getVolunteerInfo({
+      serviceCategory: service.id
+    });
+    if (res.code === 200 && res.data) {
+      //已有注册，跳转详情页面
+      uni.navigateTo({
+        url: `/pages_home/pages/details/index?data=${encodeURIComponent(JSON.stringify({ ...service, key: service.id }))}`
+      })
+      return
+    }
+
+    uni.navigateTo({
+      url: `/pages_home/pages/register/index?data=${encodeURIComponent(JSON.stringify({ ...service, key: service.id }))}`
+    })
+
+  }
 };
 
 const change = (e) => {
-	console.log('change', e);
-	let dates = [{
-		date: e.fulldate,
-		info: `${e.time.startTime}~${e.time.endTime}`,
-		time: e.time
-	}]
-	if (e.range.before && e.range.after) {
-		dates = e.range.data.map(item => {
-			return {
-				date: item,
-				info: `${e.time.startTime}~${e.time.endTime}`,
-				time: e.time
-			}
-		})
-	}
-	selected.value = [...selected.value, ...dates]
+  console.log('change', e);
+  let dates = [{
+    date: e.fulldate,
+    info: `${e.time.startTime}~${e.time.endTime}`,
+    time: e.time
+  }]
+  if (e.range.before && e.range.after) {
+    dates = e.range.data.map(item => {
+      return {
+        date: item,
+        info: `${e.time.startTime}~${e.time.endTime}`,
+        time: e.time
+      }
+    })
+  }
+  selected.value = [...selected.value, ...dates]
 }
 
 const onDelete = (e) => {
-	selected.value = selected.value.filter(item => {
-		console.log('item.fulldate !== e.date', item.date, e.fulldate);
+  selected.value = selected.value.filter(item => {
+    console.log('item.fulldate !== e.date', item.date, e.fulldate);
 
-		return item.date !== e.fulldate
-	})
-	console.log(e, selected.value);
+    return item.date !== e.fulldate
+  })
+  console.log(e, selected.value);
 }
 
 
 //排班时间去重处理
 const handleDates = computed(() => {
-	const parmas = selected.value.map(item => {
-		return {
-			workDate: item.date,
-			workStartTime: item.time.startTime,
-			workEndTime: item.time.endTime
-		}
-	})
-	return parmas.reduce((acc, current) => {
-		const existing = acc.find(item => item.workDate === current.workDate);
-		if (existing) {
-			Object.assign(existing, current);
-		} else {
-			acc.push(current);
-		}
-		return acc;
-	}, []);
+  const parmas = selected.value.map(item => {
+    return {
+      workDate: item.date,
+      workStartTime: item.time.startTime,
+      workEndTime: item.time.endTime
+    }
+  })
+  return parmas.reduce((acc, current) => {
+    const existing = acc.find(item => item.workDate === current.workDate);
+    if (existing) {
+      Object.assign(existing, current);
+    } else {
+      acc.push(current);
+    }
+    return acc;
+  }, []);
 });
 const confirm = (e) => {
-	const parmas = handleDates.value;
-	console.log('确定', parmas);
-	workDate(parmas).then(res => {
-		if (res.code == 200) {
-			uni.showToast({
-				title: '修改成功',
-				icon: 'success',
-				success: () => {
-					setTimeout(() => {
-						close();
-					}, 1000)
-				}
-			})
-
-			return;
-		}
-		uni.showToast({
-			title: res.msg,
-			icon: 'none'
-		})
-	})
+  const parmas = handleDates.value;
+  console.log('确定', parmas);
+  workDate(parmas).then(res => {
+    if (res.code == 200) {
+      uni.showToast({
+        title: '修改成功',
+        icon: 'success',
+        success: () => {
+          setTimeout(() => {
+            close();
+          }, 1000)
+        }
+      })
+
+      return;
+    }
+    uni.showToast({
+      title: res.msg,
+      icon: 'none'
+    })
+  })
 };
 const close = () => {
-	calendar.value.close();
+  calendar.value.close();
 }
 
 const init = () => {
-	getTreeList({ parentId: '0' }).then(res => {
-		console.log("TCL: init -> res", res)
-		serveiceList.value = res.data;
-	})
+  getTreeList({ parentId: '0' }).then(res => {
+    console.log("TCL: init -> res", res)
+    serveiceList.value = res.data;
+  })
 }
 
 const DataInit = () => {
-	getDataTime().then(res => {
-		console.log('res', res);
-		if (res.code === 200) {
-			selected.value = res.data.map(item => {
-				return {
-					date: item.workDate,
-					info: `${item.workStartTime}~${item.workEndTime}`,
-					time: {
-						startTime: item.workStartTime,
-						endTime: item.workEndTime
-					}
-				}
-			})
-			calendar.value.open();
-		}
-
-
-	})
+  getDataTime().then(res => {
+    console.log('res', res);
+    if (res.code === 200) {
+      selected.value = res.data.map(item => {
+        return {
+          date: item.workDate,
+          info: `${item.workStartTime}~${item.workEndTime}`,
+          time: {
+            startTime: item.workStartTime,
+            endTime: item.workEndTime
+          }
+        }
+      })
+      calendar.value.open();
+    }
+
+
+  })
 }
 
 
 
 onMounted(() => {
-	init();
+  init();
 });
 </script>
 
-<style scoped>
-.Wrapper-grid {
-	margin-top: 36rpx;
-}
-
-/* 图标样式 */
-.service-img {}
-
-/* 文本样式 */
-.grid-text {
-	font-size: 24rpx;
-	color: #333;
-	text-align: center;
-	/* margin-top: 18rpx; */
-}
-
+<style scoped lang="scss">
 .grid-box {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	/* flex-direction: column; */
-	margin-bottom: 12rpx;
-}
-
-.grid-icon {
-	width: 100rpx;
-	height: 100rpx;
-	opacity: 1;
-	border-radius: 12rpx;
-	/* background: rgba(251, 229, 225, 1); */
-	display: flex;
-	align-items: center;
-	justify-content: center;
+  width: 226rpx;
+    height: 116rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-start;
+  margin-right: 5rpx;
+  margin-left: 5rpx;
+  background: #fff;
+  border-radius: 14rpx;
+  // background: red;
+  background: linear-gradient(180deg, #FFF9F3 0%, #FFFFFF 100%);
+  box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
+  margin-top: 10rpx;
+
+  .grid-image {
+    width: 64rpx;
+    height: 68rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 }
 
-.grid-content{
+.grid-content {
   display: flex;
-  justify-content: center;
   flex-direction: column;
-}
-
-.service-img {
-	width: 78rpx;
-	height: 78rpx;
-}
-
-.swiper {
-	height: 340rpx;
-}
-
-.grid-text {
-	font-size: 14px;
-	color: #909399;
-	/* padding: 10rpx 0 0 0rpx; */
-}
-
-.client-title {
-	padding: 0 32rpx;
-}
-
-.paiban-sty {
-	display: flex;
-	align-items: center;
-	/* justify-content: center; */
-	margin: 20rpx 0;
-	padding: 0 20rpx;
+  align-items: flex-start;
+  justify-content: center;
+  .grid-text {
+    width: 112rpx;
+    height: 36rpx;
+    font-family: PingFang SC;
+    font-size: 28rpx;
+    font-weight: 500;
+    line-height: 36rpx;
+    letter-spacing: normal;
+    color: #313131;
+  }
+
+  .grid-text-bone {
+    width: 130rpx;
+    height: 28rpx;
+    font-family: PingFang SC;
+    font-size: 22rpx;
+    font-weight: normal;
+    line-height: 28rpx;
+    letter-spacing: -0.02em;
+    color: #818181;
+    margin-left: 6rpx;
+    margin-top: 10rpx;
+  }
 }
 </style>

components/Services/services.vue

@@ -1,47 +1,51 @@
 <template>
-	<view>
-		<up-waterfall>
-			<template #left>
-				<view class="demo-warter" v-for="(item, index) in props.leftList" :key="index"
-					@click="goToDetail(item)">
-					<up-lazy-load threshold="50" border-radius="10" :image="item.volunteerPicture" :index="index"
-						mode="aspectFill"></up-lazy-load>
-					<view class="demo-title">
-						{{ item.businessTierName }}
-					</view>
-					<view class="demo-skillDescribe">
-						{{ item.skillDescribe }}
-					</view>
-					<view class="demo-PriceDome">
-						<view class="demo-price">
-							<image :src="item.volunteerPicture" class="name-image"></image>
-							{{ item.name }}
-						</view>
-					</view>
-				</view>
-			</template>
-
-			<template #right>
-				<view class="demo-warter" v-for="(item, index) in props.rightList" :key="index"
-					@click="goToDetail(item)">
-					<up-lazy-load threshold="50" border-radius="10" :image="item.volunteerPicture" :index="index"
-						mode="aspectFill"></up-lazy-load>
-					<view class="demo-title">
-						{{ item.businessTierName }}
-					</view>
-					<view class="demo-skillDescribe">
-						{{ item.skillDescribe }}
-					</view>
-					<view class="demo-PriceDome">
-						<view class="demo-price">
-							<image :src="item.volunteerPicture" class="name-image"></image>
-							{{ item.name }}
-						</view>
-					</view>
-				</view>
-			</template>
-		</up-waterfall>
-	</view>
+  <view>
+
+    <!-- <view class="home-swiper">
+      <view v-if="ValueZoneSwiper.length > 0">
+        <up-swiper :list="ValueZoneSwiper" :indicator="false" indicatorMode="line" circular></up-swiper>
+      </view>
+    </view> -->
+    <up-waterfall>
+      <template #left>
+        <view class="demo-warter" v-for="(item, index) in props.leftList" :key="index" @click="goToDetail(item)">
+          <up-lazy-load threshold="50" border-radius="10" :image="item.volunteerPicture" :index="index"
+            mode="aspectFill"></up-lazy-load>
+          <view class="demo-title">
+            {{ item.businessTierName }}
+          </view>
+          <view class="demo-skillDescribe">
+            {{ item.skillDescribe }}
+          </view>
+          <view class="demo-PriceDome">
+            <view class="demo-price">
+              <image :src="item.volunteerPicture" class="name-image"></image>
+              {{ item.name }}
+            </view>
+          </view>
+        </view>
+      </template>
+
+      <template #right>
+        <view class="demo-warter" v-for="(item, index) in props.rightList" :key="index" @click="goToDetail(item)">
+          <up-lazy-load threshold="50" border-radius="10" :image="item.volunteerPicture" :index="index"
+            mode="aspectFill"></up-lazy-load>
+          <view class="demo-title">
+            {{ item.businessTierName }}
+          </view>
+          <view class="demo-skillDescribe">
+            {{ item.skillDescribe }}
+          </view>
+          <view class="demo-PriceDome">
+            <view class="demo-price">
+              <image :src="item.volunteerPicture" class="name-image"></image>
+              {{ item.name }}
+            </view>
+          </view>
+        </view>
+      </template>
+    </up-waterfall>
+  </view>
 </template>
 
 <script setup>
@@ -53,7 +57,11 @@
 		rightList: {
 			type: Array,
 			default: () => []
-		}
+    },
+    ValueZoneSwiper: {
+      type: Array,
+      default: () => []
+    }
 	});
 
 	const goToDetail = async (item) => {
@@ -71,11 +79,21 @@
 </script>
 
 <style scoped>
+
+/* 轮播图片 */
+.home-swiper{
+  width: 340rpx;
+    height: 516rpx;
+  margin-top: 25rpx;
+  /* margin-left: 10rpx; */
+  margin-right: 25rpx;
+}
+
 	.demo-warter {
 		border-radius: 8px;
 		margin: 5px;
 		background-color: #ffffff;
-		padding: 5px;
+		/* padding: 5px; */
 	}
 
 	.u-close {

pages/index.vue

@@ -1,24 +1,34 @@
 <template>
-  <view class="main-content">
-    <view class="home-banner" :style="`height: ${globalData.navBarHeight}px `">
+  <view>
+    <!-- 首页顶部定位区域 -->
+    <view class="home-banner">
       <view class="home-banner-left" @click="cityClick">
-        <up-icon name="map" color="#000" size="25"></up-icon>
+        <img src="@/static/uview/common/map-pin-fill@1x.png" alt="" class="map-pin-fill">
         <text class="address-text">{{ data.address.name }}</text>
       </view>
     </view>
 
-    <view class="home-box" :style="`margin-top: ${globalData.navBarHeight}px `">
-      <view class="home-main">
-        <view class="custom-swiper" v-if="list3.length > 0">
-          <up-swiper :list="list3" indicator indicatorMode="line" circular :height="'554rpx'"></up-swiper>
-        </view>
+    <!-- 首页顶部区域-轮播图 -->
+    <view class="home-main">
+      <view class="custom-swiper" v-if="list3.length > 0">
+        <up-swiper :list="list3" indicator indicatorMode="line" circular :height="'554rpx'"></up-swiper>
       </view>
+    </view>
 
+    <!-- 首页顶部区域-服务分类 -->
+    <view class="Wrapper-Top">
       <view class="home-grid">
         <Client />
       </view>
+    </view>
+
+    <view class="home-swiper">
+      <view v-if="ValueZone.length > 0">
+        <up-swiper :list="ValueZone" :indicator="false" indicatorMode="line" circular></up-swiper>
+      </view>
+    </view>
 
-      <view class="home-grid hot-box" v-if="userType === 1">
+    <!-- <view class="home-grid hot-box" v-if="userType === 1">
         <view
           v-for="(item, index) in hotList"
           :key="index + 'hot'"
@@ -27,63 +37,37 @@
           <img :src="item" alt="" style="width: 100%; height: 160rpx" />
         </view>
        
-      </view>
-       <view>
-          <up-notice-bar :text="text1"></up-notice-bar>
-        </view>
-
-      <view class="home-g-bgc">
-        <view class="home-grid2">
-          <view class="serve-title hot-box-title" v-if="userType === 1"
-            >超值专区</view
-          >
-          <view class="hot-swiper" v-if="ValueZone.length > 0">
-            <up-swiper
-              :list="ValueZone"
-              :indicator="false"
-              indicatorMode="line"
-              circular
-            ></up-swiper>
-          </view>
-        </view>
+      </view> -->
 
-        <view class="home-ranking home-grid2">
-      
-          <ServIces
-            :leftList="leftList"
-            :rightList="rightList"
-            v-if="userType === 1"
-          ></ServIces>
-          <RankingList v-if="userType === 2" />
-        </view>
+    <!-- <view class="hot-swiper">
+      <view v-if="ValueZone.length > 0">
+        <up-swiper :list="ValueZone" :indicator="false" indicatorMode="line" circular></up-swiper>
       </view>
+    </view> -->
 
-      <up-loadmore
-        style="margin-top: 40rpx"
-        :status="loadmoreInfo.status"
-        :loadmoreText="loadmoreInfo.loadingText"
-        :loadingText="loadmoreInfo.loadmoreText"
-        :nomoreText="loadmoreInfo.nomoreText"
-        @loadmore="handleLoadmore"
-        v-if="userType == 1"
-      />
+
+    <view class="home-ranking">
+      <ServIces :leftList="leftList" :rightList="rightList" :ValueZoneSwiper="ValueZoneSwiper" v-if="userType == 1"></ServIces>
+      <!-- <RankingList v-if="userType === 2" /> -->
     </view>
 
-    <view class="Wrapper">
+    <!-- <up-loadmore style="margin-top: 40rpx" :status="loadmoreInfo.status" :loadmoreText="loadmoreInfo.loadingText"
+      :loadingText="loadmoreInfo.loadmoreText" :nomoreText="loadmoreInfo.nomoreText" @loadmore="handleLoadmore"
+      v-if="userType == 1" /> -->
+
+    <!-- <view class="Wrapper">
       <view class="home-g-bgc">
         <Client />
-      </view>
-
+      </view> -->
+    <!-- 
       <view class="hot-swiper" v-if="ValueZone.length > 0">
         <up-swiper :list="ValueZone" :indicator="false" indicatorMode="line" circular></up-swiper>
-      </view>
+      </view> -->
 
-      <view class="home-ranking">
+    <!-- <view class="home-ranking">
         <ServIces :leftList="leftList" :rightList="rightList" v-if="userType == 1"></ServIces>
         <RankingList v-if="userType === 2" />
-      </view>
-
-    </view>
+      </view> -->
     <custom-tab-bar page="home" class="customTabBar" />
   </view>
 </template>
@@ -108,10 +92,9 @@ const leftList = ref([])
 const list3 = ref(['']) // Initialize with at least one empty item
 const ValueZone = ref(['']) // Initialize with at least one empty item
 const hotList = ref([])
+const ValueZoneSwiper = ref([''])
 const userType = uni.getStorageSync('userType'); //读取本地存储
-const text1 = ref(
-  '热烈祝贺：于5月20日上午9:00点钟召开"金邻助家"平台项目的首次发布会！'
-)
+
 const globalData = ref({
   statusBarHeight: 47,
   navBarHeight: 91,
@@ -202,8 +185,8 @@ const getList = async () => {
     res.rows.forEach((item, index) => {
       index % 2 !== 0 ? leftList.value.push(item) : rightList.value.push(item)
     })
-    console.log('home',leftList.value,rightList.value);
-    
+    console.log('home', leftList.value, rightList.value);
+
     pages.value.total = res.total
     if (pages.value.current >= Math.ceil(res.total / pages.value.pageSize)) {
       loadmoreInfo.value.status = 'nomore'
@@ -245,6 +228,10 @@ const getBanners = async () => {
     if (hot_res.code === 200 && hot_res.data.picture) {
       hotList.value = hot_res.data.picture.split(',')
     }
+    const hot_node = await slideshow(22)
+    if (hot_node.code === 200 && hot_node.data.picture) {
+      ValueZoneSwiper.value = hot_node.data.picture.split(',')
+    }
   } catch (error) {
     console.log('error', error)
   }
@@ -270,7 +257,7 @@ const settingAddress = async () => {
       latitude,
       longitude,
     }
-			console.log("TCL: settingAddress -> parmas", parmas);
+    console.log("TCL: settingAddress -> parmas", parmas);
     const res = await settingHomeAddress(parmas)
     userType === 1 && getList()
   } catch (error) {
@@ -296,26 +283,26 @@ onShow(() => {
 const addresstree = ref([])
 
 onMounted(async () => {
-  
-  const token  = getToken();
-	console.log("TCL: token", token ||'null')
-  if(token){
+
+  const token = getToken();
+  console.log("TCL: token", token || 'null')
+  if (token) {
     const res_dara = await regionAddresstree()
     addresstree.value = res_dara.data
     locateTheCurrentAddress(res_dara.data)
-    .then((res) => {
-      console.log('locateTheCurrentAddress', res)
-      data.address = res
-      settingAddress()
-    })
-    .catch((error) => {
-      console.log('获取地址失败!', error)
-      getList()
-    })
-  }else{
-      //设置默认角色
-      uni.setStorageSync('userType', 1);
-      getList();
+      .then((res) => {
+        console.log('locateTheCurrentAddress', res)
+        data.address = res
+        settingAddress()
+      })
+      .catch((error) => {
+        console.log('获取地址失败!', error)
+        getList()
+      })
+  } else {
+    //设置默认角色
+    uni.setStorageSync('userType', 1);
+    getList();
   }
 })
 
@@ -323,118 +310,54 @@ onUnload(() => { })
 </script>
 
 <style scoped lang="scss">
-.customTabBar {
-  position: fixed;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 9999;
-}
-
+// 首页顶部区域-轮播图
 .home-banner {
-  display: flex;
-  align-items: flex-end;
-  justify-content: space-between;
-  padding: 20rpx 16rpx;
-  color: #fff;
-  // position: fixed;
-  // top: 0px;
-  // left: 0px;
-  // right: 0;
-  z-index: 99;
-  // bottom: 150rpx;
-}
-
-.home-box {
-  padding-bottom: 150rpx;
-}
-
-.home-banner-left {
-  display: flex;
-  align-items: center;
-  width: 30%;
-  z-index: 110;
-}
-
-.Wrapper {
-  background: rgba(255, 255, 255, 1);
-  // background: red;
   position: absolute;
-  top: 309px;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  border-radius: 20rpx 20rpx 0rpx 0rpx;
   z-index: 130;
-}
 
-.home-main {
-  padding: 12px 16px 0;
-  z-index: 99;
-}
+  // top: 110rpx;
+  .home-banner-left {
+    display: flex;
+    align-items: center;
+    justify-content: center;
 
-.home-ranking {
-  padding: 24rpx 16px;
-}
+    .map-pin-fill {
+      width: 34rpx;
+      height: 34rpx;
+    }
 
-.hot-box-title {
-  margin-top: 24rpx;
-  padding: 0 32rpx;
+    .address-text {
+      width: 178rpx;
+      height: 42rpx;
+      font-family: PingFang SC;
+      font-size: 28rpx;
+      font-weight: normal;
+      line-height: 40rpx;
+      letter-spacing: normal;
+      color: #000000;
+      max-width: 120rpx;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
 }
 
-.hot-swiper {
-  // padding: 24rpx 32rpx 0;
+// 分类下轮播图
+.home-swiper {
+  margin-top: 40rpx;
+  margin-right: 23rpx;
+  margin-left: 23rpx;
   width: 704rpx;
   height: 180rpx;
   border-radius: 16rpx;
   background: linear-gradient(180deg, #FEF9ED 0%, #FFF9F3 100%);
-  margin-top: 40rpx;
-  margin-right: 23rpx;
-  margin-left: 23rpx;
-}
-
-.hot-box {
-  padding: 24rpx 32rpx;
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 8rpx;
-
-  .hot-item {
-    // padding: 32rpx 16rpx;
-    // border-radius: 10rpx;
-  }
-}
-
-.home-grid {
-  margin-top: 220rpx;
 }
 
-
-
-.home-g-bgc {
-  background: rgba(255, 255, 255, 1);
-  padding: -2rpx;
-}
-
-.custom-swiper {
-  width: 750rpx;
-  height: 554rpx;
-  // position: fixed;
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  right: 0;
-  z-index: 99;
-  // background: red; // 移除测试色
-}
-
-.address-text {
-  white-space: nowrap;
-  /* 禁止换行 */
-  overflow: hidden;
-  /* 隐藏溢出内容 */
-  text-overflow: ellipsis;
-  /* 超出部分显示省略号 */
-  color: #000;
+// 瀑布流
+.home-ranking {
+  margin-top: 80rpx;
+  margin-left: 25rpx;
+  margin-right: 25rpx;
 }
 </style>

pages_mine/pages/integral/index.vue

@@ -41,7 +41,7 @@
             {{ dictSortMap[item.changeType] || item.changeType }}
           </view>
           <view class="integral-detail-date">{{ item.createTime }}</view>
-          <view class="integral-detail-value add">{{ item.changePoint }}积分</view>
+          <view class="integral-detail-value" :style="{ color: item.isPointUsable === 0 ? '#53c21d' : '#e81a1a' }">{{ item.changePoint }}积分</view>
         </view>
         <!-- 可循环渲染多条明细 -->
       </view>