|
|
@@ -21,15 +21,19 @@
|
|
|
<Client />
|
|
|
</view>
|
|
|
|
|
|
- <!-- <view class="home-grid hot-box">
|
|
|
- <view v-for="item in hotList" :key="item.key" class="hot-item">
|
|
|
- <view>
|
|
|
- <view>{{item.name}}</view>
|
|
|
- <view>{{item.text}}</view>
|
|
|
- </view>
|
|
|
- <up-icon :name="listItem.iconName" :size="22"></up-icon>
|
|
|
+ <view class="home-grid hot-box">
|
|
|
+ <view v-for="(item, index) in hotList" :key="index + 'hot'" class="hot-item">
|
|
|
+ <img :src="item" alt=""
|
|
|
+ style="width: 100%;height: 160rpx;">
|
|
|
</view>
|
|
|
- </view> -->
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="home-grid">
|
|
|
+ <view class="serve-title hot-box-title">超值专区</view>
|
|
|
+ <view class="hot-swiper">
|
|
|
+ <up-swiper :list="ValueZone" indicator indicatorMode="line" circular></up-swiper>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
<view class="home-ranking">
|
|
|
<ServIces :leftList="leftList" :rightList="rightList" v-if="userType == 1"></ServIces>
|
|
|
@@ -50,76 +54,38 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
- import {
|
|
|
- ref,
|
|
|
- reactive,
|
|
|
- onMounted
|
|
|
- } from 'vue';
|
|
|
- import {
|
|
|
- onLoad,
|
|
|
- onShow
|
|
|
- } from "@dcloudio/uni-app";
|
|
|
- import RankingList from '@/pages/common/rankingList/index.vue';
|
|
|
- import ServIces from "@/components/Services/services.vue"
|
|
|
- import {
|
|
|
- Client
|
|
|
- } from "@/components/Client/new_file.vue"
|
|
|
- import {
|
|
|
- volunteerinfolist,
|
|
|
- } from "@/api/volunteerDetailsApi/details.js"
|
|
|
- import { slideshow } from '@/api/home.js'
|
|
|
-
|
|
|
- const listData = ref([])
|
|
|
- const leftList = ref([])
|
|
|
- const rightList = ref([])
|
|
|
- const userType = uni.getStorageSync('userType') //读取本地存储
|
|
|
-
|
|
|
- const data = reactive({
|
|
|
- address: '重庆市永川区',
|
|
|
- queryValue: ''
|
|
|
- })
|
|
|
- const list3 = ref([]);
|
|
|
-
|
|
|
- const hotList = [
|
|
|
- {
|
|
|
- key: 1,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '专业辅导',
|
|
|
- text:'与家长协同制定成长计划',
|
|
|
- },
|
|
|
- {
|
|
|
- key: 2,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '暖心陪护',
|
|
|
- text:'倾听烦恼、缓解孤独感',
|
|
|
- },
|
|
|
- ]
|
|
|
- const hotList2 = [
|
|
|
- {
|
|
|
- key: 1,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '专业辅导',
|
|
|
- text:'与家长协同制定成长计划',
|
|
|
- },
|
|
|
- {
|
|
|
- key: 2,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '暖心陪护',
|
|
|
- text:'倾听烦恼、缓解孤独感',
|
|
|
- },
|
|
|
- {
|
|
|
- key: 3,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '专业辅导',
|
|
|
- text:'与家长协同制定成长计划',
|
|
|
- },
|
|
|
- {
|
|
|
- key: 4,
|
|
|
- icon: '/static/img/构建.png',
|
|
|
- name: '暖心陪护',
|
|
|
- text:'倾听烦恼、缓解孤独感',
|
|
|
- },
|
|
|
- ]
|
|
|
+import {
|
|
|
+ ref,
|
|
|
+ reactive,
|
|
|
+ onMounted
|
|
|
+} from 'vue';
|
|
|
+import {
|
|
|
+ onLoad,
|
|
|
+ onShow
|
|
|
+} from "@dcloudio/uni-app";
|
|
|
+import RankingList from '@/pages/common/rankingList/index.vue';
|
|
|
+import ServIces from "@/components/Services/services.vue"
|
|
|
+import {
|
|
|
+ Client
|
|
|
+} from "@/components/Client/new_file.vue"
|
|
|
+import {
|
|
|
+ volunteerinfolist,
|
|
|
+} from "@/api/volunteerDetailsApi/details.js"
|
|
|
+import { slideshow } from '@/api/home.js'
|
|
|
+
|
|
|
+const total = ref(0)
|
|
|
+const listData = ref([])
|
|
|
+const rightList = ref([])
|
|
|
+const leftList = ref([])
|
|
|
+const userType = uni.getStorageSync('userType') //读取本地存储
|
|
|
+
|
|
|
+const data = reactive({
|
|
|
+ address: '重庆市永川区',
|
|
|
+ queryValue: ''
|
|
|
+})
|
|
|
+const list3 = ref([]);
|
|
|
+const ValueZone = ref([]);
|
|
|
+const hotList = ref([])
|
|
|
|
|
|
// 分页
|
|
|
const pages = ref({
|
|
|
@@ -174,71 +140,88 @@
|
|
|
} finally {
|
|
|
loadmoreInfo.value.status = 'loadmore'
|
|
|
}
|
|
|
- };
|
|
|
-
|
|
|
- const getBanners = async() => {
|
|
|
- try {
|
|
|
- const res =await slideshow(7);
|
|
|
- if(res.code === 200 && res.data.picture){
|
|
|
- list3.value = res.data.picture.split(',');
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- console.log('error',error);
|
|
|
-
|
|
|
- }
|
|
|
}
|
|
|
|
|
|
- onShow(() => {
|
|
|
- getList()
|
|
|
- getBanners();
|
|
|
- })
|
|
|
-</script>
|
|
|
|
|
|
-<style scoped lang="scss">
|
|
|
- .main-content {
|
|
|
- .home-banner {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- background: rgba(255, 255, 255, 1);
|
|
|
- box-shadow: 0rpx 0rpx 0rpx rgba(0, 0, 0, 0), 0rpx 0rpx 0rpx rgba(0, 0, 0, 0), 0rpx 2.08rpx 4.17rpx rgba(0, 0, 0, 0.05);
|
|
|
- padding: 20rpx 16rpx;
|
|
|
+
|
|
|
+const getBanners = async () => {
|
|
|
+ try {
|
|
|
+ const res = await slideshow(7);
|
|
|
+ if (res.code === 200 && res.data.picture) {
|
|
|
+ list3.value = res.data.picture.split(',');
|
|
|
}
|
|
|
|
|
|
- .home-banner-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ const value_res = await slideshow(8);
|
|
|
+ if (value_res.code === 200 && value_res.data.picture) {
|
|
|
+ ValueZone.value = value_res.data.picture.split(',');
|
|
|
+ }
|
|
|
|
|
|
+ const hot_res = await slideshow(11);
|
|
|
+ if (hot_res.code === 200 && hot_res.data.picture) {
|
|
|
+ hotList.value = hot_res.data.picture.split(',');
|
|
|
}
|
|
|
+ } catch (error) {
|
|
|
+ console.log('error', error);
|
|
|
|
|
|
- .home-main {
|
|
|
- padding: 12px 16px;
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .custom-swiper {}
|
|
|
+onShow(() => {
|
|
|
+ getList()
|
|
|
+ getBanners();
|
|
|
+})
|
|
|
+</script>
|
|
|
|
|
|
- .home-grid {
|
|
|
- margin-bottom: 32px;
|
|
|
- }
|
|
|
+<style scoped lang="scss">
|
|
|
+.main-content {
|
|
|
+ .home-banner {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ box-shadow: 0rpx 0rpx 0rpx rgba(0, 0, 0, 0), 0rpx 0rpx 0rpx rgba(0, 0, 0, 0), 0rpx 2.08rpx 4.17rpx rgba(0, 0, 0, 0.05);
|
|
|
+ padding: 20rpx 16rpx;
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
+ .home-banner-left {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
|
|
|
- .home-ranking {
|
|
|
- padding: 12px 16px;
|
|
|
- }
|
|
|
}
|
|
|
|
|
|
- .hot-box {
|
|
|
+ .home-main {
|
|
|
padding: 12px 16px;
|
|
|
- display: grid;
|
|
|
- grid-template-columns: repeat(2, 1fr);
|
|
|
- /* 3 列，每列等宽 */
|
|
|
- gap: 32rpx;
|
|
|
- .hot-item {
|
|
|
- .hot-item {
|
|
|
- padding: 12px 16px;
|
|
|
- }
|
|
|
+
|
|
|
+ .custom-swiper {}
|
|
|
+
|
|
|
+ .home-grid {
|
|
|
+ margin-bottom: 32px;
|
|
|
}
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .home-ranking {
|
|
|
+ padding: 24rpx 16px;
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.hot-box-title {
|
|
|
+ padding: 0 32rpx;
|
|
|
+}
|
|
|
+.hot-swiper {
|
|
|
+ padding: 24rpx 32rpx 0;
|
|
|
+}
|
|
|
|
|
|
+.hot-box {
|
|
|
+ padding: 24rpx 32rpx;
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+ gap: 8rpx;
|
|
|
|
|
|
+
|
|
|
+ .hot-item {
|
|
|
+ // padding: 32rpx 16rpx;
|
|
|
+ // border-radius: 10rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
chenjj