家长附件上传

pages/dormitory/outsideAccommodation/applicationForm.vue

@@ -24,7 +24,8 @@
 						<text class="tab-text">地址信息</text>
 					</view>
 					<view class="tab-item" :class="{ active: activeTab === 3 }" @click="switchTab(3)">
-						<uni-icons type="person-filled" size="16" :color="activeTab === 3 ? '#409EFF' : '#666'"></uni-icons>
+						<uni-icons type="person-filled" size="16"
+							:color="activeTab === 3 ? '#409EFF' : '#666'"></uni-icons>
 						<text class="tab-text">家长信息</text>
 					</view>
 					<view class="tab-item" :class="{ active: activeTab === 4 }" @click="switchTab(4)">
@@ -192,10 +193,13 @@
 
 							<view class="form-item">
 								<label class="form-label">家长签字附件</label>
-								<button type="default" size="mini" @click="chooseParentSignFile"
-									class="upload-btn">选择图片</button>
-								<image v-if="parentSignFiles.length" :src="parentSignFiles[0].url"
-									class="signature-preview" mode="widthFix"></image>
+								<view class="upload-btn" @click="handleUpload">
+									<text class="upload-icon">+</text>
+									<text>上传图片</text>
+								</view>
+								<view class="upload-preview" v-if="parentSignFiles">
+									<image :src="parentSignFiles" mode="aspectFill" />
+								</view>
 								<view class="upload-tip">只能上传jpg/png文件，且不超过2M</view>
 							</view>
 
@@ -375,6 +379,10 @@
 	} from '@/api/system/user'
 	import area from '@/components/complex-picker-region/area.js'
 	import config from '@/config'
+	import {
+		checkPic
+	} from "@/utils/checkPic.js";
+	import uploadFile from "@/plugins/upload.js";
 	export default {
 		name: 'OutsideAccommodationApply',
 		data() {
@@ -459,7 +467,7 @@
 				],
 				// 文件上传相关
 				affixFiles: [],
-				parentSignFiles: [],
+				parentSignFiles: "",
 				reasonFileList: [],
 				// 页面状态
 				currentId: null,
@@ -860,16 +868,28 @@
 					});
 				});
 			},
-			chooseParentSignFile() {
+			// 家长附件上传
+			handleUpload() {
 				uni.chooseImage({
-					count: 1,
-					sizeType: ['compressed'],
-					sourceType: ['album', 'camera'],
-					success: (res) => {
-						this.parentSignFiles = res.tempFiles;
-						this.form.parentSignAttachment = res.tempFilePaths[0];
+					count: 3,
+					success: async (img) => {
+						let bool = await checkPic(img.tempFiles[0]);
+						if (bool) {
+							uploadFile('/common/upload', img.tempFilePaths[0]).then((res) => {
+								// if (this.form.photo !== "") {
+								// 	this.form.photo = this.form.photo + "," + JSON.parse(res)
+								// 		.fileName;
+								// } else {
+								// 	this.form.photo = JSON.parse(res).fileName;
+								// }
+								this.parentSignFiles = img.tempFilePaths[0];
+								this.form.parentSignAttachment = JSON.parse(res).fileName;
+							})
 						}
-				});
+			
+					}
+				})
+			
 			},
 			previewImage(url) {
 				uni.previewImage({
@@ -892,12 +912,12 @@
 					this.areaText = res.data.address || '';
 					this.parentAreaText = res.data.parentAddress || '';
 
-					if (this.form.parentSignAttachment) {
-						this.parentSignFiles = [{
-							name: this.form.parentSignAttachment.split('/').pop(),
-							url: this.baseUrl + this.form.parentSignAttachment
-						}];
-					}
+					// if (this.form.parentSignAttachment) {
+					// 	this.parentSignFiles = [{
+					// 		name: this.form.parentSignAttachment.split('/').pop(),
+					// 		url: this.baseUrl + this.form.parentSignAttachment
+					// 	}];
+					// }
 
 					this.loading = false;
 				}).catch(() => {
@@ -1131,7 +1151,7 @@
 					};
 
 					this.affixFiles = [];
-					this.parentSignFiles = [];
+					this.parentSignFiles = "";
 					this.reasonFileList = [];
 					this.areaText = '';
 					this.parentAreaText = '';
@@ -1356,6 +1376,43 @@
 		border-color: #409EFF;
 		box-shadow: 0 0 0 4rpx rgba(64, 158, 255, 0.1);
 	}
+	// 图片上传样式
+	.upload-btn {
+		width: 200rpx;
+		height: 80rpx;
+		border: 1px dashed #ccc;
+		border-radius: 8rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		gap: 10rpx;
+		font-size: 28rpx;
+		color: #666;
+		margin-bottom: 20rpx;
+	}
+	
+	.upload-icon {
+		font-size: 40rpx;
+		font-weight: bold;
+	}
+	
+	.upload-tip {
+		font-size: 22rpx;
+		color: #999;
+		margin-bottom: 20rpx;
+	}
+	
+	.upload-preview {
+		width: 200rpx;
+		height: 200rpx;
+		border-radius: 8rpx;
+		overflow: hidden;
+	}
+	
+	.upload-preview image {
+		width: 100%;
+		height: 100%;
+	}
 
 	/* 选择器样式 */
 	.picker-input {

pages/dormitory/outsideAccommodation/index.vue

@@ -55,7 +55,7 @@
 			<view class="empty-state" v-if="!loading && !hasData">
 				<uni-icons type="empty" size="80" color="#c0c4cc"></uni-icons>
 				<text class="empty-text">暂无外宿申请数据</text>
-				<text class="empty-tip" v-if="roleGroup.includes('学生')">点击"外宿申请"按钮提交新申请</text>
+				<text class="empty-tip" v-if="roleGroup.includes('学生')">点击右下角"+号"按钮提交新申请</text>
 			</view>
 
 			<!-- 数据列表 -->
@@ -112,6 +112,8 @@
 										</view>
 									</text>
 								</view>
+								<view class="info-item"><text class="label">宿费交纳：</text><text
+										class="value">{{ getSafeValue(item, 'accommodationFee', '-') }}</text></view>
 							</view>
 						</uni-collapse-item>