shunfengche-sfd/my/setting/LostandFoundadd.vue

<template>
	<view class="padding">
		<u-form labelPosition="top" :model="model1" :rules="rules" ref="uForm">
			<u-form-item label="订单号码" prop="ordersId" borderBottom ref="item1">
				<u-input v-model="model1.ordersId" border="none"></u-input>
			</u-form-item>
			<u-form-item label="联系人" prop="name" borderBottom ref="item1">
				<u-input v-model="model1.name" border="none"></u-input>
			</u-form-item>
			<u-form-item label="联系方式" prop="phone" borderBottom ref="item1">
				<u-input v-model="model1.phone" border="none"></u-input>
			</u-form-item>
			<u-form-item label="拾获时间" prop="foundTime" borderBottom ref="item1">
				<view class="flex align-center addboxs bg" style="padding: 0 30rpx; justify-content: space-between;" @click="openTime()">
					<view class="flex align-center">
						<image v-if="globalImages" :src="globalImages + 'imgs/static/upload/time.png'" style="width: 34rpx;height: 34rpx;"></image>
						<view class="add_tit margin-left-xs" v-if="!yuyueTime">选择预约时间</view>
						<view class="add_tit margin-left-xs" v-else>{{yuyueTime}}</view>
					</view>
					<view class="margin-left-xs">
						<image v-if="globalImages" :src="globalImages + 'imgs/static/image/right.png'" style="width: 12rpx;height: 20rpx;">
						</image>
					</view>
				</view>
			</u-form-item>
			<u-form-item label="其他信息" prop="description" borderBottom>
				<textarea placeholder="简要描述物品其他信息" v-model="model1.description"
						class="feedback-textare" />
			</u-form-item>
		</u-form>
		<u-picker v-model="Timeshow" mode="time" :params="params"
					@confirm="timeConfirm"></u-picker>
		<view class="">
			<view class="flex" style="justify-content: space-between;">
				<view>物品照片</view>
				<view>请上传丢失的物品照片</view>
			</view>
			<u-upload
				:action="uploadAction"
				:file-list="fileList"
				@on-success="handleUploadSuccess"
				@on-error="handleUploadError"
				:max-count="1"
				:multiple="false"
			></u-upload>
		</view>
		<view class="pay_btns" @click="submit">发布信息</view>
	</view>
</template>

<script>
	import { waitForGlobalImages } from '@/utils/globalImageLoader'
	export default {
		data() {
			return {
				model1: {
					name: '',
					ordersId: '',
					phone: '',
					description: '',
					image: '',
					loss: 2,
					foundTime: ''
				},
				// 上传组件配置
				uploadAction: 'http://192.168.50.122:8179/sqx_fast/alioss/upload', // 上传接口地址
				fileList: [], // 已上传的文件列表
				Timeshow: false,
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: false
				},
				yuyueTime: '',
				globalImages: ''
			}
		},
		onLoad() {
			waitForGlobalImages().then((path) => {
			    console.log('✅ 全局图片路径:', path)
			    this.globalImages = path
			})
		},
		methods: {
			// 上传成功回调
			handleUploadSuccess(response) {
				console.log('上传成功', response.data);
				// 将上传成功的文件添加到 fileList
				this.model1.image = response.data; // 保存图片 URL
				this.fileList = response.data
			},
			// 上传失败回调
			handleUploadError(error) {
				console.error('上传失败', error);
				uni.showToast({
					title: '上传失败，请重试',
					icon: 'none',
				});
			},
			submit() {
				this.model1.foundTime = this.yuyueTime
				this.$Request.postT("/app/lostFound/insert", this.model1).then(res => {
					if (res.code === 0) {
						uni.showToast({
							title: '新增成功',
							icon: 'success',
						});
						uni.navigateBack(); // 返回上一页
					}
				});
			},
			timeConfirm(e) {
				console.log(e, e.year);
				this.yuyueTime = e.year + '/' + e.month + '/' + e.day + '/' + '' + e.hour + ':' + e.minute
			},
			openTime() {
				this.Timeshow = true
				console.log('123123123');
			}
		}
	}
</script>

<style scoped>
	.feedback-textare {
		height: 200upx;
		font-size: 24upx;
		line-height: 50upx;
		width: 100%;
		box-sizing: border-box;
		padding: 20upx 20upx 0;
		border: #e4e7ed 1rpx solid;
		background: #fff;
		border-radius: 15rpx;
		/* margin-top: 20rpx; */
	}
	
	.pay_btns {
		width: calc(100% - 60rpx);
		margin: 0 auto 40rpx;
		text-align: center;
		background: #00c18a;
		height: 80rpx;
		border-radius: 16rpx;
		color: #ffffff;
		line-height: 80rpx;
		margin-top: 20rpx;
		position: fixed;
		bottom: 0rpx;
	}
	
	/deep/ .u-flex {
		background: #fff !important;
	}
</style>