Browse Source

fix: 用户端分类

chenjj 2 weeks ago
parent
commit
451a3575e1

+ 34 - 0
components/NoneView/index.vue

@@ -0,0 +1,34 @@
+<template>
+    <view class="none-box">
+        <img src="/static/serverImg/list/null.png" alt="" style="width: 382rpx; height: 244rpx;">
+        <view class="none-text">{{value}}</view>
+    </view>
+</template>
+<script setup>
+
+
+const props = defineProps({
+    value: {
+        type: String,
+        default: '数据为空'
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.none-box{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-top: 100rpx;
+    .none-text {
+        font-size: 24rpx;
+        font-weight: 400;
+        letter-spacing: 0rpx;
+        line-height: 28.96rpx;
+        color: rgba(119, 119, 119, 1);
+        text-align: center;
+    }
+}
+</style>

+ 1 - 1
pages/classify.vue

@@ -6,7 +6,7 @@
 				color: 'rgba(221, 94, 69, 1)',
 				fontWeight: 'bold',
 				transform: 'scale(1.05)'
-			}" lineColor="rgba(221, 94, 69, 1)" v-model:current="tabKey">
+			}" lineColor="rgba(221, 94, 69, 1)" :current="tabKey">
 			</up-tabs>
 			<view class="list">
 				<List :data="data" v-if="data.length > 0" />

+ 3 - 1
pages/index.vue

@@ -90,7 +90,7 @@
 	const ValueZone = ref([]);
 	const hotList = ref([])
 	const userType = uni.getStorageSync('userType') //读取本地存储
-
+	const citySelector = requirePlugin('citySelector');
 	const {
 		lrr_service_category
 	} = useDict('lrr_service_category');
@@ -112,6 +112,8 @@
 		serviceCategory: '',
 		// appStatus:"2",
 	})
+
+
 	
 const cityClick = () => {
 	citySelectorNavigateTo(data.address)

+ 218 - 226
pages/login.vue

@@ -10,7 +10,7 @@
 				<up-avatar :src="src" class="avatar"></up-avatar>
 
 				<!-- 下方按钮 -->
-				<up-button type="error" shape="circle" class="button"  @click="handleLogin">获取微信授权登录</up-button>
+				<up-button type="error" shape="circle" class="button" @click="handleLogin">获取微信授权登录</up-button>
 			</view>
 			<view class="xieyi text-center">
 				<text class="text-grey1">登录即代表同意</text>
@@ -22,262 +22,254 @@
 </template>
 
 <script setup>
-	import {
-		ref,
-		reactive,
-		onMounted
-	} from 'vue';
-	import {
-		useRouter,
-		useRoute
-	} from 'vue-router'; // 根据实际情况选择路由库
-	import {
-		getCodeImg,
-		login
-	} from '@/api/login';
-
-	import store from "@/store"
-
-	const imagePath = '/static/9efd1.png';
-
-	// 获取全局配置
-	// const globalConfig = getApp().globalData.config;
-	const register = ref(false); // 用户注册开关
-	const loginForm = reactive({
-		username: "",
-		password: "",
-		code: "",
-		uuid: ''
+import {
+	ref,
+	reactive,
+	onMounted
+} from 'vue';
+import {
+	useRouter,
+	useRoute
+} from 'vue-router'; // 根据实际情况选择路由库
+import {
+	getCodeImg,
+	login
+} from '@/api/login';
+
+import store from "@/store"
+
+const imagePath = '/static/9efd1.png';
+
+// 获取全局配置
+// const globalConfig = getApp().globalData.config;
+const register = ref(false); // 用户注册开关
+const loginForm = reactive({
+	username: "",
+	password: "",
+	code: "",
+	uuid: ''
+});
+
+const codeUrl = ref("");
+const captchaEnabled = ref(true);
+
+
+const router = useRouter();
+// 创建响应式数据  
+const show = ref(false);
+
+// 定义方法  
+function open() {
+	// 打开逻辑,比如设置 show 为 true  
+	show.value = true;
+}
+
+function close() {
+	// 关闭逻辑,设置 show 为 false  
+	show.value = false;
+}
+
+// 用户注册
+const handleUserRegister = () => {
+	router.push('/pages/register'); // 替换为实际的路由跳转逻辑
+};
+
+// 隐私协议
+const handlePrivacy = () => {
+	uni.navigateTo({
+		url: '/pages_home/pages/login/index'
+	})
+};
+
+// 用户协议
+const handleUserAgrement = () => {
+	uni.navigateTo({
+		url: '/pages_home/pages/login/user'
+	})
+};
+
+// 登录方法
+const handleLogin = async () => {
+	uni.showLoading({
+		title: "登录中,请耐心等待..."
+	}); // 使用uni-app的loading方法替代$modal.loading
+	// 获取服务商信息
+	uni.getProvider({
+		service: "oauth",
+		success: (res) => {
+			console.log(res);
+		}
 	});
 
-	const codeUrl = ref("");
-	const captchaEnabled = ref(true);
-
-
-	const router = useRouter();
-	// 创建响应式数据  
-	const show = ref(false);
-
-	// 定义方法  
-	function open() {
-		// 打开逻辑,比如设置 show 为 true  
-		show.value = true;
-	}
-
-	function close() {
-		// 关闭逻辑,设置 show 为 false  
-		show.value = false;
-	}
-
-	// 用户注册
-	const handleUserRegister = () => {
-		router.push('/pages/register'); // 替换为实际的路由跳转逻辑
-	};
-
-	// 隐私协议
-	const handlePrivacy = () => {
-		uni.navigateTo({
-			url: '/pages_home/pages/login/index'
-		})
-	};
-
-	// 用户协议
-	const handleUserAgrement = () => {
-		uni.navigateTo({
-			url: '/pages_home/pages/login/user'
-		})
-	};
-
-	// 登录方法
-	const handleLogin = async () => {
-		uni.showLoading({
-			title: "登录中,请耐心等待..."
-		}); // 使用uni-app的loading方法替代$modal.loading
-		// 获取服务商信息
-		uni.getProvider({
-			service: "oauth",
-			success: (res) => {
-				console.log(res);
+	// 获取code
+	uni.login({
+		provider: 'weixin',
+		success: (res) => {
+			if (res.code == 500) {
+				uni.showLoading({
+					title: "系统暂未开发,敬请期待"
+				});
+			} else if (res.code == 400) {
+				uni.showLoading({
+					title: "系统暂未开放"
+				});
 			}
-		});
-
-		// 获取code
-		uni.login({
-			provider: 'weixin',
-			success: (res) => {
-				if (res.code == 500) {
-					uni.showLoading({
-						title: "系统暂未开发,敬请期待"
-					});
-				} else if (res.code == 400) {
-					uni.showLoading({
-						title: "系统暂未开放"
-					});
+			loginForm.code = res.code;
+			// 获取用户信息
+			uni.getUserInfo({
+				success: (res) => {
+					console.log("用户信息", res);
 				}
-				loginForm.code = res.code;
-				// 获取用户信息
-				uni.getUserInfo({
-					success: (res) => {
-						console.log("用户信息", res);
-					}
-				});
+			});
 
-				pwdLogin();
+			pwdLogin();
 
-				uni.hideLoading()
-			},
-		});
-	};
+			uni.hideLoading()
+		},
+	});
+};
 
-	// 密码登录
-	const pwdLogin = async () => {
-		if (!store) {
-			console.error("Store is not defined");
-			return;
+// 密码登录
+const pwdLogin = async () => {
+	if (!store) {
+		console.error("Store is not defined");
+		return;
+	}
+	store.dispatch('Login', loginForm).then(() => {
+		// uni.hideLoading(); // 关闭加载提示
+		loginSuccess();
+	})
+};
+
+
+// 登录成功后,处理函数
+const loginSuccess = () => {
+	store.dispatch('GetInfo').then((res) => {
+
+		console.log(store.state.user.userOrWorker, '>>>>99');
+		if (store.state.user.userOrWorker == 0) {
+			uni.reLaunch({
+				url: '/pages/UserSelection'
+			});
+			return
 		}
-		store.dispatch('Login', loginForm).then(() => {
-			// uni.hideLoading(); // 关闭加载提示
-			loginSuccess();
+		uni.setStorageSync('userType', store.state.user.userOrWorker);
+		uni.switchTab({
+			url: '/pages/index'
 		})
-	};
-
-
-	// 登录成功后,处理函数
-	const loginSuccess = () => {
-		store.dispatch('GetInfo').then((res) => {
-
-			console.log(store.state.user.userOrWorker, '>>>>99');
-
-			switch (store.state.user.userOrWorker) {
-				case 0:
-					uni.reLaunch({
-						url: '/pages/UserSelection'
-					});
-					break;
 
-				case 1: // 跳转到用户页面
-					uni.setStorageSync('userType', 1);
-				case 2: // 跳转到志愿者页
-					console.log('跳转到页面')
-					uni.setStorageSync('userType', 2);
-					uni.switchTab({
-						url: '/pages/index'
-					})
-					break;
-
-			}
-
-		});
-	};
-
-	// 页面加载时获取验证码
-	onMounted(() => {
-		open();
 	});
+};
+
+// 页面加载时获取验证码
+onMounted(() => {
+	uni.setStorageSync('userType', 0);
+	open();
+});
 </script>
 
 <style lang="scss">
-	page {
-		background-color: #ffffff;
-	}
+page {
+	background-color: #ffffff;
+}
 
-	.normal-login-container {
-		width: 100%;
+.normal-login-container {
+	width: 100%;
 
-		.logo-content {
-			width: 100%;
-			font-size: 21px;
-			text-align: center;
-			padding-top: 25%;
-
-			image {
-				border-radius: 4px;
-			}
+	.logo-content {
+		width: 100%;
+		font-size: 21px;
+		text-align: center;
+		padding-top: 25%;
 
-			.title {
-				margin-left: 10px;
-			}
+		image {
+			border-radius: 4px;
 		}
 
-		.login-form-content {
-			text-align: center;
-			margin: 20px auto;
-			margin-top: 15%;
-			width: 80%;
-
-			.input-item {
-				margin: 20px auto;
-				background-color: #f5f6f7;
-				height: 45px;
-				border-radius: 20px;
-
-				.icon {
-					font-size: 38rpx;
-					margin-left: 10px;
-					color: #999;
-				}
+		.title {
+			margin-left: 10px;
+		}
+	}
 
-				.input {
-					width: 100%;
-					font-size: 14px;
-					line-height: 20px;
-					text-align: left;
-					padding-left: 15px;
-				}
+	.login-form-content {
+		text-align: center;
+		margin: 20px auto;
+		margin-top: 15%;
+		width: 80%;
 
-			}
+		.input-item {
+			margin: 20px auto;
+			background-color: #f5f6f7;
+			height: 45px;
+			border-radius: 20px;
 
-			.login-btn {
-				margin-top: 40px;
-				height: 45px;
+			.icon {
+				font-size: 38rpx;
+				margin-left: 10px;
+				color: #999;
 			}
 
-			.reg {
-				margin-top: 15px;
+			.input {
+				width: 100%;
+				font-size: 14px;
+				line-height: 20px;
+				text-align: left;
+				padding-left: 15px;
 			}
 
-			.xieyi {
-				color: #333;
-				margin-top: 20px;
-			}
+		}
 
-			.login-code {
-				height: 38px;
-				float: right;
+		.login-btn {
+			margin-top: 40px;
+			height: 45px;
+		}
 
-				.login-code-img {
-					height: 38px;
-					position: absolute;
-					margin-left: 10px;
-					width: 200rpx;
-				}
-			}
+		.reg {
+			margin-top: 15px;
 		}
-	}
 
-	/* 弹性容器:垂直方向排列 */
-	.popup-content {
-		display: flex;
-		flex-direction: column;
-		/* 上下布局 */
-		align-items: center;
-		/* 水平居中 */
-		padding: 30rpx;
-		/* 元素间距 */
-		gap: 30rpx;
-	}
+		.xieyi {
+			color: #333;
+			margin-top: 20px;
+		}
 
-	/* 头像样式 */
-	.avatar {
-		width: 120rpx;
-		height: 160rpx;
-	}
+		.login-code {
+			height: 38px;
+			float: right;
 
-	/* 按钮样式 */
-	.button {
-		// width: 170rpx !important;
-		/* 覆盖默认宽度 */
-		margin-left: 0 !important;
-		/* 清除原代码中的 margin-left */
+			.login-code-img {
+				height: 38px;
+				position: absolute;
+				margin-left: 10px;
+				width: 200rpx;
+			}
+		}
 	}
+}
+
+/* 弹性容器:垂直方向排列 */
+.popup-content {
+	display: flex;
+	flex-direction: column;
+	/* 上下布局 */
+	align-items: center;
+	/* 水平居中 */
+	padding: 30rpx;
+	/* 元素间距 */
+	gap: 30rpx;
+}
+
+/* 头像样式 */
+.avatar {
+	width: 120rpx;
+	height: 160rpx;
+}
+
+/* 按钮样式 */
+.button {
+	// width: 170rpx !important;
+	/* 覆盖默认宽度 */
+	margin-left: 0 !important;
+	/* 清除原代码中的 margin-left */
+}
 </style>

+ 1 - 1
pages/mallMenu.vue

@@ -203,7 +203,7 @@ export default {
             // 只有第一条和第二条可以跳转
             if (key === '1' || key === '2') {
                 uni.navigateTo({
-                    url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}`
+                    url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}&id=${record.id}`
                 });
             } else {
                 // 其他条目提示“敬请期待”

+ 93 - 0
pages_home/components/tabs/index.vue

@@ -0,0 +1,93 @@
+<template>
+    <view>
+        <view>
+            <up-tabs :list="list" @change="handlTabs" :activeStyle="{
+                color: 'rgba(221, 94, 69, 1)',
+                fontWeight: 'bold',
+                transform: 'scale(1.05)'
+            }" lineColor="rgba(221, 94, 69, 1)" :current="tabKey" keyName="businessName">
+            </up-tabs>
+        </view>
+        <view>
+            <view scroll-x class="tabs-scroll">
+                <view v-for="item in childrenList" :key="item.id"
+                    :class="item.id === childrenKey ? 'childern-item item-active' : 'childern-item'"
+                    @click="childernChange(item)">
+                    {{ item.businessName }}
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script setup>
+import {
+    ref,
+    onMounted,
+    reactive,
+    nextTick
+} from 'vue';
+import {
+    onLoad,
+    onShow,
+    onReachBottom
+} from "@dcloudio/uni-app"
+
+const emits = defineEmits(['change'])
+const tabKey = ref(0);//tab的下标
+const childrenKey = ref(null);//二级的id
+const list = ref([])
+
+const childrenList = ref([]);//二级的数据
+const handlTabs = (e, index) => {
+    console.log('e,index', e, index);
+
+    childrenList.value = e.children
+    tabKey.value = index;//记录下标
+    childrenKey.value = null;
+    emits('change', e)
+}
+const childernChange = (e) => {
+    childrenKey.value = e.id;
+    emits('change', e)
+}
+
+onMounted(() => {
+})
+
+onLoad((options) => {
+    const dataList = JSON.parse(decodeURIComponent(options.dataList));
+    list.value = dataList
+    if (options.id) {
+        const tab = dataList.find(item => item.id === options.id);
+        const index = dataList.findIndex(item => item.id === options.id);
+        handlTabs(tab, index);
+    } else {
+        handlTabs(dataList[0])
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.childern-item {
+    font-size: 28rpx;
+    font-weight: 400;
+    background-color: #f9fafb;
+    padding: 12rpx 32rpx;
+    margin-right: 16rpx;
+    border-radius: 19998rpx;
+}
+
+.item-active {
+    background: rgba(251, 229, 225, 1);
+    color: rgba(221, 94, 69, 1);
+}
+
+.tabs-scroll {
+    display: flex;
+    align-items: center;
+    margin-top: 16rpx;
+    padding: 0 16rpx;
+
+}
+</style>

+ 36 - 22
pages_home/pages/client/details.vue

@@ -1,36 +1,34 @@
 <template>
 	<view style="padding-top: 20rpx; width: 100vw; height: 100vh; overflow: hidden">
 		<view style="width: 100%; height: 100%; overflow:scroll">
-			<view class="Wrapper">
+			<!-- <view class="Wrapper">
 				<image src="/static/img/Location.png" class="Wrapper-img" />
 				<span class="Wrapper-content">重庆</span>
 				<vie class="input-container">
 					<up-input v-model="value" @click.native="goToDetail" placeholder="请输入内容" prefixIcon="search"
 						:customStyle="inputStyle"></up-input>
 				</vie>
-			</view>
+			</view> -->
 			<view class="tabs-container">
-				<view class="tabs-wrapper">
-					<!-- 可滑动的 tabs 区域 -->
+				<!-- <view class="tabs-wrapper">
 					<scroll-view scroll-x class="tabs-scroll">
 						<up-tabs :list="list1" @change="handlTabs" keyName="businessName"
-							class="tabs-content"></up-tabs>
+							class="tabs-content" :current="tabKey"></up-tabs>
 					</scroll-view>
-					<!-- 固定不动的图标 -->
-					<image ref="iconRef" src="/static/img/分类or广场or其他.png" class="fixed-icon" @click="toggleDropdown" />
 				</view>
 
-				<view v-if="showDropdown" class="custom-dropdown">
+				<view  class="custom-dropdown">
 					<up-tabs :list="list2" @change="clickList2" class="tabs-content" :current="currentTabs2"
 						keyName="businessName" />
-					<!-- <up-tabs :list="list3" @click="click" class="tabs-content"  keyName="businessName" /> -->
-				</view>
+				</view> -->
+
+				<Tabs :list="list1" @change="handlTabs" ref="tabRef" />
 			</view>
 
 
 			<!-- 瀑布流 -->
 			<view v-if="userType == '1'">
-				<up-waterfall v-model="flowList">
+				<up-waterfall v-model="flowList" v-if="pages.total >0">
 					<template #left>
 						<view class="demo-warter" v-for="(item, index) in leftList" :key="index"
 							@click="goToDetail(item)">
@@ -72,10 +70,13 @@
 						</view>
 					</template>
 				</up-waterfall>
+				<view v-else>
+					<NoneView />
+				</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" />
+				:nomoreText="loadmoreInfo.nomoreText" @loadmore="handleLoadmore" v-if="userType == 1 && pages.total >0" />
 
 		</view>
 	</view>
@@ -105,6 +106,9 @@
 		volunteerinfolist
 	} from "@/api/volunteerDetailsApi/details.js"
 
+	import Tabs from "@/pages_home/components/tabs/index.vue"
+	import NoneView from '@/components/NoneView/index.vue'
+
 
 	const value1 = ref(1)
 	const value2 = ref(2)
@@ -119,6 +123,9 @@
 	const leftList = ref([])
 	const showDropdown = ref(false)
 
+	const tabRef = ref(null)
+
+	const businessManagementId =ref(null)
 
 
 	const defaultTab = ref({
@@ -133,9 +140,11 @@
 
 
 
-	function handlTabs(item, index) {
-		currentTabs2.value = 0
-		list2.value = item.children
+	function handlTabs(record) {
+		clearList();
+		serviceCategory.value = record.parentId;
+		businessManagementId.value = record.id;
+		getList();
 	}
 
 	function clickList2(item, index) {
@@ -216,7 +225,7 @@
 			const res = await volunteerinfolist({
 				pageNum: pages.value.current, // 当前页码
 				pageSize: pages.value.pageSize, // 每页大小
-				serviceCategory: serviceCategory.value
+				businessManagementId: businessManagementId.value
 			});
 
 			console.log(res, '>>>>>>>res');
@@ -236,17 +245,22 @@
 			res.rows.forEach((item, index) => {
 				index % 2 !== 0 ? leftList.value.push(item) : rightList.value.push(item);
 			});
-
+			console.log('leftList',leftList,rightList);
+			
 			pages.value.total = res.total;
 		} catch (error) {
-			leftList.value = [];
-			rightList.value = [];
-			loadmoreInfo.value.status = 'loadmore';
-			pages.value.total = 0;
+			clearList()
 			console.error('Error fetching data:', error);
 		}
 	};
 
+	const clearList = () =>{
+		leftList.value = [];
+			rightList.value = [];
+			loadmoreInfo.value.status = 'loadmore';
+			pages.value.total = 0;
+	}
+
 	onReachBottom(() => {
 		if (loadmoreInfo.value.status !== 'nomore') { // 更宽松的条件
 			loadmoreInfo.value.status = 'loading';
@@ -258,7 +272,7 @@
 
 
 	onMounted(() => {
-		getList()
+		// getList()
 	})
 </script>
 

BIN
static/serverImg/list/null.png