|
@@ -3,7 +3,7 @@
|
|
|
<view class="home-banner" :style="`height: ${globalData.navBarHeight}px `">
|
|
|
<view class="home-banner-left" @click="cityClick">
|
|
|
<up-icon name="map" color="#fff" size="25"></up-icon>
|
|
|
- <text>{{ data.address }}</text>
|
|
|
+ <text class="address-text">{{ data.address.name }}</text>
|
|
|
</view>
|
|
|
<view class="home-banner-cente">金邻助家</view>
|
|
|
<view class="home-banner-rigth">
|
|
@@ -48,287 +48,337 @@
|
|
|
|
|
|
</view>
|
|
|
|
|
|
- <custom-tab-bar :page="0"/>
|
|
|
+ <custom-tab-bar :page="0" />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
- import {
|
|
|
- ref,
|
|
|
- reactive,
|
|
|
- onMounted
|
|
|
- } from 'vue';
|
|
|
- import {
|
|
|
- provide
|
|
|
- } from 'vue';
|
|
|
- import {
|
|
|
- onLoad,
|
|
|
- onShow,
|
|
|
- onReachBottom,
|
|
|
- onUnload
|
|
|
- } 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'
|
|
|
- import {
|
|
|
- useDict
|
|
|
- } from '@/utils/dict.js';
|
|
|
- import { citySelectorNavigateTo } from '@/utils/adress'
|
|
|
- import CustomTabBar from '@/components/CustomTabBar/index.vue'
|
|
|
-
|
|
|
- const total = ref(0)
|
|
|
- const listData = ref([])
|
|
|
- const rightList = ref([])
|
|
|
- const leftList = ref([])
|
|
|
- const list3 = ref([]);
|
|
|
- const ValueZone = ref([]);
|
|
|
- const hotList = ref([])
|
|
|
- const userType = uni.getStorageSync('userType') //读取本地存储
|
|
|
- const citySelector = requirePlugin('citySelector');
|
|
|
- const {
|
|
|
- lrr_service_category
|
|
|
- } = useDict('lrr_service_category');
|
|
|
-
|
|
|
- const globalData = ref({
|
|
|
- statusBarHeight: 47,
|
|
|
- navBarHeight: 91
|
|
|
- });
|
|
|
- const data = reactive({
|
|
|
- address: '重庆市',
|
|
|
- queryValue: ''
|
|
|
- })
|
|
|
-
|
|
|
- // 分页
|
|
|
- const pages = ref({
|
|
|
- current: 1,
|
|
|
- pageSize: 10,
|
|
|
- total: 0,
|
|
|
- serviceCategory: '',
|
|
|
- // appStatus:"2",
|
|
|
- })
|
|
|
-
|
|
|
+import {
|
|
|
+ ref,
|
|
|
+ reactive,
|
|
|
+ onMounted
|
|
|
+} from 'vue';
|
|
|
+import {
|
|
|
+ provide
|
|
|
+} from 'vue';
|
|
|
+import {
|
|
|
+ onLoad,
|
|
|
+ onShow,
|
|
|
+ onReachBottom,
|
|
|
+ onUnload
|
|
|
+} 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,
|
|
|
+ settingHomeAddress
|
|
|
+} from '@/api/home.js'
|
|
|
+import {
|
|
|
+ useDict
|
|
|
+} from '@/utils/dict.js';
|
|
|
+import { chooseLocationInit,locateTheCurrentAddress } from '@/utils/adress'
|
|
|
+import CustomTabBar from '@/components/CustomTabBar/index.vue'
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+const rightList = ref([])
|
|
|
+const leftList = ref([])
|
|
|
+const list3 = ref([]);
|
|
|
+const ValueZone = ref([]);
|
|
|
+const hotList = ref([])
|
|
|
+const userType = uni.getStorageSync('userType') //读取本地存储
|
|
|
+
|
|
|
+
|
|
|
+const globalData = ref({
|
|
|
+ statusBarHeight: 47,
|
|
|
+ navBarHeight: 91
|
|
|
+});
|
|
|
+const data = reactive({
|
|
|
+ address: {
|
|
|
+ name: '重庆市',
|
|
|
+ latitude: 29.333000000000002,
|
|
|
+ longitude: 105.94909000000001,
|
|
|
+ cityCode:{
|
|
|
+ code:[500000, 500100, 500118],
|
|
|
+ data:["重庆市", "重庆市", "永川区"],
|
|
|
+ index: [21, 0, 17]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ queryValue: ''
|
|
|
+})
|
|
|
+
|
|
|
+// 分页
|
|
|
+const pages = ref({
|
|
|
+ current: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 0,
|
|
|
+ serviceCategory: '',
|
|
|
+ // appStatus:"2",
|
|
|
+})
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+const cityClick = async () => {
|
|
|
+ const {latitude,longitude} = data.address;
|
|
|
+ const address = await chooseLocationInit({latitude,longitude});
|
|
|
+ data.address = address;
|
|
|
+ settingAddress();
|
|
|
+ console.log('address', address);
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+const loadmoreInfo = ref({
|
|
|
+ status: 'loadmore',
|
|
|
+ loadingText: '努力加载中...',
|
|
|
+ loadmoreText: '点击加载更多~',
|
|
|
+ nomoreText: '已经到底啦~'
|
|
|
+})
|
|
|
+
|
|
|
+// 加载更多
|
|
|
+async function handleLoadmore(e) {
|
|
|
+ if (pages.value.current < Math.ceil(pages.value.total / pages.value.pageSize)) {
|
|
|
+ pages.value.current += 1;
|
|
|
+ loadmoreInfo.value.status = 'loading';
|
|
|
+ await getList();
|
|
|
+ } else {
|
|
|
+ loadmoreInfo.value.status = 'nomore';
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
|
|
|
- const cityClick = () => {
|
|
|
- citySelectorNavigateTo(data.address)
|
|
|
- }
|
|
|
+const getList = async () => {
|
|
|
+ try {
|
|
|
+ loadmoreInfo.value.status = 'loading';
|
|
|
|
|
|
+ const params = {
|
|
|
+ pageNum: pages.value.current,
|
|
|
+ pageSize: pages.value.pageSize,
|
|
|
+ serviceCategory: pages.value.serviceCategory || '',
|
|
|
+ businessManagementId: 0,
|
|
|
+ // appStatus:pages.value.appStatus,
|
|
|
+ };
|
|
|
+ const res = await volunteerinfolist(params);
|
|
|
|
|
|
- const loadmoreInfo = ref({
|
|
|
- status: 'loadmore',
|
|
|
- loadingText: '努力加载中...',
|
|
|
- loadmoreText: '点击加载更多~',
|
|
|
- nomoreText: '已经到底啦~'
|
|
|
- })
|
|
|
+ if (!res || !res.rows) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
|
|
|
- // 加载更多
|
|
|
- async function handleLoadmore(e) {
|
|
|
- if (pages.value.current < Math.ceil(pages.value.total / pages.value.pageSize)) {
|
|
|
- pages.value.current += 1;
|
|
|
- loadmoreInfo.value.status = 'loading';
|
|
|
- await getList();
|
|
|
- } else {
|
|
|
+ // 判断是否已经到了最后一页
|
|
|
+ if (pages.value.current >= Math.ceil(res.total / pages.value.pageSize)) {
|
|
|
loadmoreInfo.value.status = 'nomore';
|
|
|
+ } else {
|
|
|
+ loadmoreInfo.value.status = 'loadmore';
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
+ // 将数据分成左右两列
|
|
|
+ res.rows.forEach((item, index) => {
|
|
|
+ index % 2 !== 0 ? leftList.value.push(item) : rightList.value.push(item);
|
|
|
+ });
|
|
|
|
|
|
- const getList = async () => {
|
|
|
- try {
|
|
|
- loadmoreInfo.value.status = 'loading';
|
|
|
-
|
|
|
- const params = {
|
|
|
- pageNum: pages.value.current,
|
|
|
- pageSize: pages.value.pageSize,
|
|
|
- serviceCategory: pages.value.serviceCategory || '',
|
|
|
- businessManagementId: 0,
|
|
|
- // appStatus:pages.value.appStatus,
|
|
|
- };
|
|
|
- const res = await volunteerinfolist(params);
|
|
|
-
|
|
|
- if (!res || !res.rows) {
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- // 判断是否已经到了最后一页
|
|
|
- if (pages.value.current >= Math.ceil(res.total / pages.value.pageSize)) {
|
|
|
- loadmoreInfo.value.status = 'nomore';
|
|
|
- } else {
|
|
|
- loadmoreInfo.value.status = 'loadmore';
|
|
|
- }
|
|
|
-
|
|
|
- // 将数据分成左右两列
|
|
|
- res.rows.forEach((item, index) => {
|
|
|
- index % 2 !== 0 ? leftList.value.push(item) : rightList.value.push(item);
|
|
|
- });
|
|
|
-
|
|
|
- pages.value.total = res.total;
|
|
|
- } catch (error) {
|
|
|
- leftList.value = [];
|
|
|
- rightList.value = [];
|
|
|
- loadmoreInfo.value.status = 'loadmore';
|
|
|
- pages.value.total = 0;
|
|
|
- console.error('Error fetching data:', error);
|
|
|
- }
|
|
|
- };
|
|
|
+ pages.value.total = res.total;
|
|
|
+ } catch (error) {
|
|
|
+ leftList.value = [];
|
|
|
+ rightList.value = [];
|
|
|
+ loadmoreInfo.value.status = 'loadmore';
|
|
|
+ pages.value.total = 0;
|
|
|
+ console.error('Error fetching data:', error);
|
|
|
+ }
|
|
|
+};
|
|
|
|
|
|
|
|
|
- onReachBottom(() => {
|
|
|
- if (pages.value.current < Math.ceil(pages.value.total / pages.value.pageSize)) {
|
|
|
- pages.value.current = pages.value.current + 1
|
|
|
- loadmoreInfo.value.status = 'nomore'
|
|
|
- getList()
|
|
|
- }
|
|
|
- })
|
|
|
+onReachBottom(() => {
|
|
|
+ if (pages.value.current < Math.ceil(pages.value.total / pages.value.pageSize)) {
|
|
|
+ pages.value.current = pages.value.current + 1
|
|
|
+ loadmoreInfo.value.status = 'nomore'
|
|
|
+ getList()
|
|
|
+ }
|
|
|
+})
|
|
|
|
|
|
|
|
|
|
|
|
- const getBanners = async () => {
|
|
|
- try {
|
|
|
- const res = await slideshow(7);
|
|
|
- if (res.code === 200 && res.data.picture) {
|
|
|
- list3.value = res.data.picture.split(',');
|
|
|
- }
|
|
|
+const getBanners = async () => {
|
|
|
+ try {
|
|
|
+ const res = await slideshow(7);
|
|
|
+ if (res.code === 200 && res.data.picture) {
|
|
|
+ list3.value = res.data.picture.split(',');
|
|
|
+ }
|
|
|
|
|
|
- const value_res = await slideshow(8);
|
|
|
- if (value_res.code === 200 && value_res.data.picture) {
|
|
|
- ValueZone.value = value_res.data.picture.split(',');
|
|
|
- }
|
|
|
+ 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);
|
|
|
+ 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);
|
|
|
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const settingAddress = async() => {
|
|
|
+ try {
|
|
|
+ const {address}=data;
|
|
|
+ const {cityCode,latitude,longitude} = address;
|
|
|
+ const parmas = {
|
|
|
+ provinceName: cityCode.data[0], // 省
|
|
|
+ provinceCode: cityCode.code[0],
|
|
|
+ provinceInd: cityCode.index[0],
|
|
|
+ cityName: cityCode.data[1], // 市
|
|
|
+ cityCode: cityCode.code[1],
|
|
|
+ cityInd: cityCode.index[1],
|
|
|
+ districtName: cityCode.data[2],
|
|
|
+ districtCode: cityCode.code[2],
|
|
|
+ districtInd: cityCode.index[2],
|
|
|
+ address: address.name,
|
|
|
+ latitude,
|
|
|
+ longitude
|
|
|
}
|
|
|
+ const res = await settingHomeAddress(parmas);
|
|
|
+ console.log('res',res);
|
|
|
+
|
|
|
+ } catch (error) {
|
|
|
+ console.log('设置地址失败',error);
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
- onShow(() => {
|
|
|
- getBanners();
|
|
|
+onShow(() => {
|
|
|
+ getBanners();
|
|
|
|
|
|
// 在 App.vue 中初始化
|
|
|
uni.getSystemInfo({
|
|
|
success: (res) => {
|
|
|
const statusBarHeight = res.statusBarHeight;
|
|
|
- console.log('res',res);
|
|
|
-
|
|
|
+ console.log('res', res);
|
|
|
+
|
|
|
const navBarHeight = res.platform === 'android' ? 48 : 44 + res.statusBarHeight;
|
|
|
globalData.value = { statusBarHeight, navBarHeight };
|
|
|
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
- if (citySelector) {
|
|
|
- const selectedCity = citySelector.getCity(); // 如果点击确认选点按钮,则返回选点结果对象,否则返回null
|
|
|
- data.address = selectedCity.name;
|
|
|
}
|
|
|
+ });
|
|
|
|
|
|
- })
|
|
|
+
|
|
|
|
|
|
- onMounted(() => {
|
|
|
- getList()
|
|
|
+})
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ getList()
|
|
|
+ locateTheCurrentAddress().then(res => {
|
|
|
+ console.log('locateTheCurrentAddress',res);
|
|
|
+ data.address = res;
|
|
|
+ settingAddress();
|
|
|
+ }).catch(error => {
|
|
|
+ console.log('获取地址失败!',error);
|
|
|
+
|
|
|
})
|
|
|
|
|
|
- onUnload(() => {
|
|
|
- if (citySelector) {
|
|
|
- // 页面卸载时设置插件选点数据为null,防止再次进入页面,geLocation返回的是上次选点结果
|
|
|
- citySelector.setLocation(null);
|
|
|
- }
|
|
|
+})
|
|
|
|
|
|
- })
|
|
|
+onUnload(() => {
|
|
|
+
|
|
|
+})
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
- .main-content {
|
|
|
- background: rgba(255, 255, 255, 1);
|
|
|
-
|
|
|
- .home-banner {
|
|
|
- display: flex;
|
|
|
- align-items: flex-end;
|
|
|
- justify-content: space-between;
|
|
|
- // background: rgba(255, 255, 255, 1);
|
|
|
- // background-color: #ED806A;
|
|
|
- background-color: rgba(221, 60, 62, 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;
|
|
|
- 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%;
|
|
|
- }
|
|
|
+.main-content {
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+
|
|
|
+ .home-banner {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ justify-content: space-between;
|
|
|
+ // background: rgba(255, 255, 255, 1);
|
|
|
+ // background-color: #ED806A;
|
|
|
+ background-color: rgba(221, 60, 62, 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;
|
|
|
+ color: #fff;
|
|
|
+ position: fixed;
|
|
|
+ top: 0px;
|
|
|
+ left: 0px;
|
|
|
+ right: 0;
|
|
|
+ z-index: 99;
|
|
|
+ bottom: 150rpx;
|
|
|
+ }
|
|
|
|
|
|
- .home-banner-center {
|
|
|
- flex: 1;
|
|
|
- font-size: 38rpx;
|
|
|
- }
|
|
|
+ .home-box {
|
|
|
+ padding-bottom: 150rpx;
|
|
|
+ }
|
|
|
|
|
|
- .home-banner-rigth {
|
|
|
- width: 30%;
|
|
|
- }
|
|
|
+ .home-banner-left {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 30%;
|
|
|
+ }
|
|
|
|
|
|
- .home-main {
|
|
|
- padding: 12px 16px 0;
|
|
|
+ .home-banner-center {
|
|
|
+ flex: 1;
|
|
|
+ font-size: 38rpx;
|
|
|
+ }
|
|
|
|
|
|
+ .home-banner-rigth {
|
|
|
+ width: 30%;
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
+ .home-main {
|
|
|
+ padding: 12px 16px 0;
|
|
|
|
|
|
- .home-ranking {
|
|
|
- padding: 24rpx 16px;
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
- .hot-box-title {
|
|
|
- padding: 0 32rpx;
|
|
|
}
|
|
|
|
|
|
- .hot-swiper {
|
|
|
- padding: 24rpx 32rpx 0;
|
|
|
+ .home-ranking {
|
|
|
+ padding: 24rpx 16px;
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
- .hot-box {
|
|
|
- padding: 24rpx 32rpx;
|
|
|
- display: grid;
|
|
|
- grid-template-columns: repeat(2, 1fr);
|
|
|
- gap: 8rpx;
|
|
|
+.hot-box-title {
|
|
|
+ padding: 0 32rpx;
|
|
|
+}
|
|
|
|
|
|
+.hot-swiper {
|
|
|
+ padding: 24rpx 32rpx 0;
|
|
|
+}
|
|
|
|
|
|
- .hot-item {
|
|
|
- // padding: 32rpx 16rpx;
|
|
|
- // border-radius: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
+.hot-box {
|
|
|
+ padding: 24rpx 32rpx;
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+ gap: 8rpx;
|
|
|
|
|
|
- .home-grid2 {
|
|
|
- margin-bottom: 32rpx;
|
|
|
- background: #fff;
|
|
|
- padding: 12px 0;
|
|
|
- border-radius: 8px;
|
|
|
- }
|
|
|
|
|
|
- .home-g-bgc {
|
|
|
- background: #f7f7f7;
|
|
|
- padding: 24rpx;
|
|
|
+ .hot-item {
|
|
|
+ // padding: 32rpx 16rpx;
|
|
|
+ // border-radius: 10rpx;
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.home-grid2 {
|
|
|
+ margin-bottom: 32rpx;
|
|
|
+ background: #fff;
|
|
|
+ padding: 12px 0;
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+
|
|
|
+.home-g-bgc {
|
|
|
+ background: #f7f7f7;
|
|
|
+ padding: 24rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.address-text {
|
|
|
+ white-space: nowrap;
|
|
|
+ /* 禁止换行 */
|
|
|
+ overflow: hidden;
|
|
|
+ /* 隐藏溢出内容 */
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ /* 超出部分显示省略号 */
|
|
|
+}
|
|
|
</style>
|