页面调整

pages.json

@@ -21,43 +21,43 @@
 		"navigationBarTextStyle": "black",
 		"navigationBarTitleText": "Aidex",
 		"navigationBarBackgroundColor": "#ffffff"
-	},
-	"tabBar": {
-		"color": "#333333",
-		"selectedColor": "#4094ff",
-		"backgroundColor": "#ffffff",
-		"borderStyle": "white",
-		"list": [
-			 {
-				"pagePath": "pages/sys/msg/index",
-				"iconPath": "static/aidex/tabbar/msg_1.png",
-				"selectedIconPath": "static/aidex/tabbar/msg_2.png",
-				"text": "访客等级"
-			},
-			// {
-			// 	"pagePath": "pages/sys/home/index",
-			// 	"iconPath": "static/aidex/tabbar/home_1.png",
-			// 	"selectedIconPath": "static/aidex/tabbar/home_2.png",
-			// 	"text": "首页"
-			// },
-			{
-				"pagePath": "pages/sys/work/work",
-				"iconPath": "static/aidex/tabbar/apply_1.png",
-				"selectedIconPath": "static/aidex/tabbar/apply_2.png",
-				"text": "到访确认"
-			},
-			{
-				"pagePath": "pages/sys/qrpage/qrpage",
-				"iconPath": "static/aidex/tabbar/book_1.png",
-				"selectedIconPath": "static/aidex/tabbar/book_2.png",
-				"text": "扫码登记"
-			},
-			{
-				"pagePath": "pages/sys/camera/camera",
-				"iconPath": "static/aidex/tabbar/my_1.png",
-				"selectedIconPath": "static/aidex/tabbar/my_2.png",
-				"text": "我的"
-			}
-		]
 	}
+	// "tabBar": {
+	// 	"color": "#333333",
+	// 	"selectedColor": "#4094ff",
+	// 	"backgroundColor": "#ffffff",
+	// 	"borderStyle": "white",
+	// 	"list": [
+	// 		 {
+	// 			"pagePath": "pages/sys/msg/index",
+	// 			"iconPath": "static/aidex/tabbar/msg_1.png",
+	// 			"selectedIconPath": "static/aidex/tabbar/msg_2.png",
+	// 			"text": "访客等级"
+	// 		},
+	// 		// {
+	// 		// 	"pagePath": "pages/sys/home/index",
+	// 		// 	"iconPath": "static/aidex/tabbar/home_1.png",
+	// 		// 	"selectedIconPath": "static/aidex/tabbar/home_2.png",
+	// 		// 	"text": "首页"
+	// 		// },
+	// 		{
+	// 			"pagePath": "pages/sys/work/work",
+	// 			"iconPath": "static/aidex/tabbar/apply_1.png",
+	// 			"selectedIconPath": "static/aidex/tabbar/apply_2.png",
+	// 			"text": "到访确认"
+	// 		},
+	// 		{
+	// 			"pagePath": "pages/sys/qrpage/qrpage",
+	// 			"iconPath": "static/aidex/tabbar/book_1.png",
+	// 			"selectedIconPath": "static/aidex/tabbar/book_2.png",
+	// 			"text": "扫码登记"
+	// 		},
+	// 		{
+	// 			"pagePath": "pages/sys/camera/camera",
+	// 			"iconPath": "static/aidex/tabbar/my_1.png",
+	// 			"selectedIconPath": "static/aidex/tabbar/my_2.png",
+	// 			"text": "我的"
+	// 		}
+	// 	]
+	// }
 }

pages/sys/msg/index.vue

@@ -13,7 +13,7 @@
 			</view>
 
 			<view class="form-item">
-				<text class="label required">所属公司</text>
+				<text class="label">所属公司</text>
 				<view class="input-wrapper">
 					<input type="text" placeholder="请输入您的公司名称" v-model="formData.visitorUnit" />
 				</view>
@@ -28,15 +28,29 @@
 
 			<view class="form-item">
 				<text class="label required">拜访事由</text>
-				<view class="input-wrapper">
+				<!-- <view class="input-wrapper">
 					<input type="text" placeholder="请简要描述拜访目的" v-model="formData.visitingReason" />
+				</view> -->
+				<view class="select-wrapper" @click.stop="showTypeDialog = true">
+					<text>{{ formData.visitingReason || '请选择拜访事由' }}</text>
+					<image class="filter-img" src="/static/ic_down_arrow_g.png" />
+					<view v-if="showTypeDialog" class="dropdown">
+						<view class="dropdown-list">
+							<view v-for="(item, index) in typeList" :key="index" class="dropdown-item"
+								@click.stop="selectVisitingReason(item)">
+								{{ item }}
+							</view>
+						</view>
+					</view>
 				</view>
 			</view>
 			
+		
+
 			<!-- 被访人信息 -->
 			<view class="section-title">被访人信息</view>
 			<view class="form-item">
-				<text class="label required">被访人姓名</text>
+				<text class="label">被访人姓名</text>
 				<view class="input-wrapper">
 					<input type="text" placeholder="请输入被访人姓名" v-model="formData.interviewedPerson" />
 				</view>
@@ -89,7 +103,7 @@
 			</view>
 
 			<!-- 预约信息 -->
-			<view class="section-title">预约信息</view>
+<!-- 			<view class="section-title">预约信息</view>
 			<view class="form-item">
 				<text class="label">预约车位</text>
 				<view class="picker-wrapper">
@@ -97,15 +111,15 @@
 						<view class="picker-value">{{formData.bookingParkingSpace ? '需要' : '不需要'}}</view>
 					</picker>
 				</view>
-			</view>
+			</view> -->
 
 			<!-- 条件显示：预约车位时显示车牌号 -->
-			<view class="form-item" v-if="formData.bookingParkingSpace">
+<!-- 			<view class="form-item" v-if="formData.bookingParkingSpace">
 				<text class="label required">车牌号</text>
 				<view class="input-wrapper">
 					<input type="text" placeholder="请输入车牌号" v-model="formData.licensePlate" />
 				</view>
-			</view>
+			</view> -->
 
 			<view class="form-item">
 				<text class="label required">人脸照片</text>
@@ -151,7 +165,7 @@
 					visitorName: '1',
 					visitorUnit: '1',
 					visitorPhone: '15555555555',
-					visitingReason: '1',
+					visitingReason: '',
 					interviewedPerson: '1',
 					interviewedUnit: '1',
 					interviewedPhone: '15555555555',
@@ -171,7 +185,9 @@
 					1: '已确认',
 					2: '已取消',
 					3: '已完成'
-				}
+				},
+				typeList:['业务洽谈','会议参与','面试应聘','技术支持','办事咨询','调研考察'],
+				showTypeDialog:false
 			}
 		},
 		onLoad(options) {
@@ -201,7 +217,19 @@
 			plus.screen.lockOrientation('landscape-primary');
 			// #endif
 		},
+
 		methods: {
+			// 添加选择拜访事由方法
+			selectVisitingReason(reason) {
+				this.formData.visitingReason = reason;
+				this.showTypeDialog = false;
+			},
+			
+			// 点击外部关闭下拉菜单
+			handleClickOutside() {
+				this.showTypeDialog = false;
+			},
+			
 			// 处理日期时间选择
 			onBeginDateChange(e) {
 				this.formData.visitingBeginDate = e.detail.value;
@@ -217,12 +245,12 @@
 			},
 
 			// 处理车位预约选择
-			handleParkingChange(e) {
+			// handleParkingChange(e) {
-				this.formData.bookingParkingSpace = e.detail.value === 1;
+			// 	this.formData.bookingParkingSpace = e.detail.value === 1;
-				if (!this.formData.bookingParkingSpace) {
+			// 	if (!this.formData.bookingParkingSpace) {
-					this.formData.licensePlate = '';
+			// 		this.formData.licensePlate = '';
-				}
+			// 	}
-			},
+			// },
 
 			// 处理状态选择
 			handleStatusChange(e) {
@@ -296,9 +324,9 @@
 				}
 
 				// 验证车牌号（如果需要预约车位）
-				if (bookingParkingSpace && !licensePlate) {
+				// if (bookingParkingSpace && !licensePlate) {
-					return '请输入车牌号';
+				// 	return '请输入车牌号';
-				}
+				// }
 
 
 				if (!facePictures) {
@@ -539,6 +567,63 @@
 		padding: 0 12px;
 		display: flex;
 		align-items: center;
+		position: relative;
+	}
+
+	.select-wrapper {
+		flex: 1;
+		height: 40px;
+		border: 1px solid #e5e6eb;
+		border-radius: 6px;
+		padding: 0 12px;
+		display: flex;
+		align-items: center;
+		position: relative;
+		cursor: pointer;
+	}
+	
+	.select-wrapper text {
+		flex: 1;
+		font-size: 14px;
+		color: #333;
+	}
+	
+	u-icon {
+		transition: transform 0.3s;
+	}
+	
+	.select-wrapper.active u-icon {
+		transform: rotate(180deg);
+	}
+	
+	.dropdown {
+		position: absolute;
+		top: calc(100% + 5px);
+		left: 0;
+		right: 0;
+		background: #fff;
+		border-radius: 6px;
+		box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
+		z-index: 999;
+		max-height: 200px;
+		overflow-y: auto;
+	}
+	
+	.dropdown-item {
+		padding: 12px;
+		font-size: 14px;
+		color: #333;
+		border-bottom: 1rpx solid #eee;
+		text-align: left;
+		cursor: pointer;
+	}
+	
+	.dropdown-item:last-child {
+		border-bottom: none;
+	}
+	
+	.dropdown-item:hover {
+		background-color: #f5f7fa;
 	}
 
 	.input-wrapper input {
@@ -548,6 +633,15 @@
 		color: #333;
 	}
 	
+	.filter-img {
+		position: absolute;
+		right: 12px;
+		top: 50%;
+		transform: translateY(-50%);
+		width: 18px; /* Adjust based on your image size */
+		height: 10px; /* Adjust based on your image size */
+	}
+
 	.picker-wrapper {
 		flex: 1;
 		height: 40px;
@@ -635,4 +729,34 @@
 		align-items: center;
 		justify-content: center;
 	}
+	
+	.dropdown {
+		position: absolute;
+		top: calc(100% + 5px);
+		left: 0;
+		right: 0;
+		background: #fff;
+		border-radius: 6px;
+		box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
+		z-index: 999;
+		max-height: 200px;
+		overflow-y: auto;
+	}
+	
+	.dropdown-item {
+		padding: 12px;
+		font-size: 14px;
+		color: #333;
+		border-bottom: 1rpx solid #eee;
+		text-align: left;
+		cursor: pointer;
+	}
+	
+	.dropdown-item:last-child {
+		border-bottom: none;
+	}
+	
+	.dropdown-item:hover {
+		background-color: #f5f7fa;
+	}
 </style>