lunhan/water/water-drinking-uniapp.git

			@@ -9,8 +9,40 @@
			describe:'',
			url:'',
			})
			const test = ref()
			//校验
			const formRef = ref()
			const rules = ref({
			facilityCode: {
			rules:[
			{required: true,errorMessage: '请扫描设备二维码获取'}]
			},
			userPhone: {
			rules:[
			{required: true,errorMessage: '请输入您的手机号'},
			{pattern: /^1[3-9]\d{9}$/, errorMessage: '手机号格式不正确'}
			]
			},
			type: {
			rules:[
			{required: true,errorMessage: '请选择设备类型'}]
			},
			describe: {
			rules:[
			{required: true,errorMessage: '请输入故障内容'},
			{maxLength:200,errorMessage: '请输入故障内容'},
			]
			},
			})
			const typeList = ref([
			{text:'温度',value:1},
			{text:'水压',value:2},
			{text:'网络',value:3},
			{text:'缺液',value:4},
			{text:'流量计',value:5},
			{text:'其他',value:6},
			])
			const uploadList = ref(['','',''])
			const uploadListForm = ref(['','',''])
			function uploadImg(val){
			uni.chooseImage({
			success: async(res) =>{
			@@ -28,6 +60,7 @@
			console.log('success',success);
			let dataObj = JSON.parse(success.data)
			uploadList.value[val]= BASE_URL + '/upload' + dataObj.data.newFileName
			uploadListForm.value[val]= dataObj.data.newFileName
			console.log('uploadList.value',uploadList.value)
			},
			fail: (err) => {
			@@ -42,27 +75,41 @@
			}
			});
			}
			async function submit(){
			form.value.url = uploadList.value
			//去掉数组中空字符串，数组转字符串
			form.value.url = form.value.url.filter(str => str !== '').join()
			await infoBreakdownApi(form.value).then((res) =>{
			if(res.code == 200){
			uni.showToast({
			title: '上报成功',
			duration: 2000,
			});
			setTimeout(()=>{
			form.value = {
			facilityCode:'',
			userPhone:'',
			type:'',
			describe:'',
			url:'',
			}
			uni.navigateBack()
			},1000)

			function toScan(){
			// 调用二维码扫描接口
			uni.scanCode({
			scanType: ['qrCode'],
			success: function (res) {
			let code = res.result.split('=')[1]
			form.value.facilityCode = code
			console.log('条码内容：' + res.result,'code',code);
			}
			});
			}
			async function submit(){
			formRef.value.validate().then(async() =>{
			form.value.url = uploadListForm.value
			//去掉数组中空字符串，数组转字符串
			form.value.url = form.value.url.filter(str => str !== '').join()
			await infoBreakdownApi(form.value).then((res) =>{
			if(res.code == 200){
			uni.showToast({
			title: '上报成功',
			duration: 2000,
			});
			setTimeout(()=>{
			form.value = {
			facilityCode:'',
			userPhone:'',
			type:'',
			describe:'',
			url:'',
			}
			uni.navigateBack()
			},1000)
			}
			})
			})
			}
			</script>
			@@ -71,35 +118,34 @@
			<navbar title="故障上报"></navbar>
			<view class="content">
			<view class="main">
			<view class="title">请填写故障信息{{test}}</view>
			<view class="title">请填写故障信息</view>
			<view class="info-box">
			<view class="form-box">
			<form>
			<view class="form-item">
			<view class="label">设备号：</view>
			<input class="item-input" v-model="form.facilityCode" name="input" placeholder="请扫描水机站牌二维码或输入设备号" />
			<image src="../../static/images/addCard/code.png" alt=""></image>
			</view>
			<view class="form-item">
			<view class="label">联系方式：</view>
			<input class="item-input" v-model="form.userPhone" name="input" placeholder="请输入您的手机号" />
			</view>
			<view class="form-item">
			<view class="label">问题类型：</view>
			<input class="item-input" name="input" v-model="form.type" placeholder="请选择问题类型" />
			</view>
			<view class="form-item">
			<view class="label">问题描述：</view>
			<input class="item-input" name="input" v-model="form.describe" placeholder="请输入故障内容" />
			</view>
			</form>
			<uni-forms ref="formRef" :model="form" :rules="rules" label-width=100>
			<uni-forms-item label="设备号：" name="facilityCode">
			<view class="form-item">
			<input v-model="form.facilityCode" placeholder="请扫描设备二维码获取" />
			<image class="scan-img" @click="toScan()" src="../../static/images/addCard/code.svg" alt=""></image>
			</view>
			</uni-forms-item>
			<uni-forms-item label="联系方式：" name="userPhone">
			<input v-model="form.userPhone" placeholder="请输入您的手机号" />
			</uni-forms-item>
			<uni-forms-item label="问题类型：" name="type">
			<uni-data-select v-model="form.type" :localdata="typeList"></uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="问题描述：" name="describe">
			<input type="textarea" v-model="form.describe" placeholder="请输入故障内容" />
			</uni-forms-item>
			</uni-forms>
			</view>
			<view class="upload-box">
			<view class="upload-title">选择照片</view>
			<view class="upload-img">
			<block v-for="(item,index) in uploadList">
			<view @click="uploadImg(index)" class="upload-img-item">
			<image v-if="item" :src="item"></image>
			<image v-if="item" :src="item" mode="aspectFit"></image>
			<image v-else class="default-img" src="../../static/images/other/img-add.png" alt=""></image>
			</view>
			</block>
			</view>
			@@ -145,22 +191,26 @@
			.form-box{
			height:500rpx;
			border-bottom:1rpx solid rgba(90, 128, 218, 0.4);
			input{
			height:100%;
			line-height:100%;
			}
			.form-item{
			height:100%;
			line-height:100%;
			display: flex;
			align-items: center;
			border-bottom: 1rpx solid rgba(111, 111, 111, 0.1);
			height:100rpx;
			image{
			margin-left:60rpx;
			width:50rpx;
			height:50rpx;
			justify-content: space-around;
			.scan-img{
			width:56rpx;
			height:56rpx;
			}
			}
			}
			.upload-box{
			.upload-title{
			color: #5b93dc;
			margin: 10rpx 20rpx 0;
			color: #6a717e;
			margin-top: 10rpx;
			}
			.upload-img{
			display: flex;
			@@ -174,9 +224,16 @@
			border-radius:20rpx;
			border:1rpx dashed #b7d4ff;
			margin-bottom: 10rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			image{
			width:180rpx;
			height:180rpx;
			width:170rpx;
			height:170rpx;
			}
			.default-img{
			width:120rpx;
			height:120rpx;
			}
			}
			}
			@@ -192,6 +249,8 @@
			left: calc(50% - 35%);
			text-align: center;
			border-radius:50rpx;
			color: #5b93dc;
			letter-spacing:5rpx;
			}
			}
			}