gubersail-app/pages/home/claim/details.vue

<template>
	<view class="">
		<uni-section title="基本信息" style="padding: 0 62rpx;" titleColor="5F5F5F" titleFontSize="28rpx">
			<template v-slot:right>
				<text style="color: #5F5F5F;">
					{{form.claimNo}}
				</text>
			</template>
			<uni-forms ref="form1" :modelValue="form" :border="true" label-width="80">
				<uni-forms-item name="consumerName" label="联系人">
					<uni-easyinput v-model="form.consumerName" class="right-align" placeholder-class="placeholder-right"
						placeholder="请输入联系人" :inputBorder="false" :disabled="form.auditStatus>0||form.claimSourceType>1"
						:clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="consumerPhone" label="电话" required>
					<uni-easyinput v-model="form.consumerPhone" class="right-align" type="number"
						placeholder-class="placeholder-right" placeholder="请输入电话" :inputBorder="false"
						:disabled="form.auditStatus>0||form.claimSourceType>1" :clearable="false" maxlength="11"
						@change="photoChange"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="vehicleNumber" label="车牌号">
					<view style="display: flex;align-items: center;">
						<!-- <uni-easyinput v-model="form.vehicleNumber" class="right-align"
							placeholder-class="placeholder-right" placeholder="请输入车牌号" :inputBorder="false"
							:disabled="true" :clearable="false" @change="carNoVerify" maxlength="8"
							@click="handleInputFocus"></uni-easyinput> -->
						<view style="display: flex;align-items: center;height: 36px;width: 100%;">
							<view @click="handleInputFocus()" style="width: 100%;text-align: right;padding: 0 20rpx;"
								:style="form.vehicleNumber?'color:#000;':'color:#B5B4B4;font-size: 24rpx;'">
								{{form.vehicleNumber||(form.auditStatus>0||form.claimSourceType>1?' ':'请输入车牌号')}}
							</view>
						</view>
						<uni-icons v-if="!(form.auditStatus>0||form.claimSourceType>1)" type="camera" size="24"
							color='#03803B' @click="allClick('识别车牌号')"></uni-icons>
					</view>
				</uni-forms-item>
				<uni-forms-item name="tyreNo" label="胎号">
					<view style="display: flex;align-items: center;">
						<uni-easyinput v-model="form.tyreNo" class="right-align" placeholder-class="placeholder-right"
							:placeholder="form.auditStatus>0||form.claimSourceType>1?' ':'请输入胎号'" :inputBorder="false"
							:disabled="form.auditStatus>0||form.claimSourceType>1" :clearable="false"
							@change="getMaterialDetail"></uni-easyinput>
						<uni-icons v-if="!(form.auditStatus>0||form.claimSourceType>1)" type="scan" size="24"
							color='#03803B' @click="allClick('识别胎号')"></uni-icons>
					</view>
				</uni-forms-item>
				<uni-forms-item name="tyreSpecs" label="规格型号">
					<uni-easyinput v-model="form.tyreSpecs" class="right-align" placeholder-class="placeholder-right"
						placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="brandItem" label="花纹">
					<uni-easyinput v-model="form.brandItem" class="right-align" placeholder-class="placeholder-right"
						placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="brandName" label="品牌">
					<uni-easyinput v-model="form.brandName" class="right-align" placeholder-class="placeholder-right"
						placeholder="" :inputBorder="false" :disabled="true" :clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="tireQuantity" label="轮胎数量">
					<uni-easyinput v-model="form.tireQuantity" class="right-align" placeholder-class="placeholder-right"
						placeholder="请输入数量" :inputBorder="false" :disabled="true" type="number"
						@blur="intBlur('tireQuantity',form.tireQuantity)" :clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="claimAmount" label="索赔金额">
					<uni-easyinput v-model="form.claimAmount" class="right-align" placeholder-class="placeholder-right"
						placeholder="" :inputBorder="false" :disabled="true" type="number"
						@blur="handleBlur(form.claimAmount)" :clearable="false"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item name="claimReason" label="理赔原因">
					<uni-easyinput v-model="form.claimReason" class="right-align" type="textarea"
						placeholder-class="placeholder-right"
						:placeholder="form.auditStatus>0||form.claimSourceType>1?' ':'请输入内容'" :inputBorder="false"
						:del-icon="!(form.auditStatus>0||form.claimSourceType>1)"
						:disabled="form.auditStatus>0||form.claimSourceType>1"></uni-easyinput>
				</uni-forms-item>
			</uni-forms>
		</uni-section>
		<uni-section title="相应图片信息" style="padding: 0 62rpx 60rpx 62rpx;margin-top: 30rpx;" titleColor="5F5F5F"
			titleFontSize="28rpx">
			<view class="photo-upload">
				<view>
					<view class="photo-upload-text">示例照片</view>
					<view>
						<image class="photo-upload-img" src="@/static/images/home/claim/em4.png" />
					</view>
				</view>
				<view>
					<view class="photo-upload-text" style="color: #03803B;">病象</view>
					<view class="photo-upload-upload">
						<uni-file-picker v-model="form.file1" return-type="object" limit="1" :imageStyles="imageStyles"
							file-mediatype="image" @select="fileSelect1" @delete="fileDelete"
							:del-icon="!(form.auditStatus>0||form.claimSourceType>1)" :sourceType="['camera']">
							<image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
						</uni-file-picker>
					</view>
				</view>
			</view>
			<view class="photo-upload">
				<view>
					<view class="photo-upload-text">示例照片</view>
					<view>
						<image class="photo-upload-img" src="@/static/images/home/claim/em2.png" />
					</view>
				</view>
				<view>
					<view class="photo-upload-text" style="color: #03803B;">轮胎DOT</view>
					<view class="photo-upload-upload">
						<uni-file-picker v-model="form.file2" return-type="object" limit="1" :imageStyles="imageStyles"
							file-mediatype="image" @select="fileSelect2" @delete="fileDelete"
							:del-icon="!(form.auditStatus>0||form.claimSourceType>1)" :sourceType="['camera']">
							<image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
						</uni-file-picker>
					</view>
				</view>
			</view>
			<view class="photo-upload">
				<view>
					<view class="photo-upload-text">示例照片</view>
					<view>
						<image class="photo-upload-img" src="@/static/images/home/claim/em3.png" />
					</view>
				</view>
				<view>
					<view class="photo-upload-text" style="color: #03803B;">花纹深度</view>
					<view class="photo-upload-upload">
						<uni-file-picker v-model="form.file3" return-type="object" limit="1" :imageStyles="imageStyles"
							file-mediatype="image" @select="fileSelect3" @delete="fileDelete"
							:del-icon="!(form.auditStatus>0||form.claimSourceType>1)" :sourceType="['camera']">
							<image class="photo-upload-img2" src="@/static/images/home/claim/upload.png" />
						</uni-file-picker>
					</view>
				</view>
			</view>
		</uni-section>
		<u-keyboard ref="uKeyboard" mode="car" :show="carShow" @change="carChange" @backspace="backspace"
			:showCancel="false" :showConfirm="false" @close="carShow=false" :safeAreaInsetBottom="true"
			:autoChange="true"></u-keyboard>
		<!--<view v-if="form.claimSourceType==1" style="padding:30rpx 20rpx;">
			<debounce-button v-if="!form.id" bgColor="#03803B" @click="submit">保存</debounce-button>
			<view v-if="form.auditStatus==0" style="display: flex;">
				<debounce-button bgColor="#03803B" style="width: 260rpx;" @click="submit">保存</debounce-button>
				<debounce-button type="warn" v-if="form.auditStatus==0" style="width: 260rpx;"
					@click="approval">提交</debounce-button>
			</view>
			<debounce-button type="warn" v-if="form.auditStatus==1" @click="revoke">撤销审核</debounce-button>
		</view> -->
		<view v-if="form.claimSourceType==1" class="nav-bottom-height">
		</view>
		<view v-if="form.claimSourceType==1" class="goods-nav-bottom">
			<uni-goods-nav v-if="!form.id" :fill="true" :options="[]" :buttonGroup="buttonGroup"
				@buttonClick="buttonClick" />
			<uni-goods-nav v-if="form.auditStatus==0" :fill="true" :options="[]" :buttonGroup="buttonGroup2"
				@buttonClick="buttonClick2" />
			<uni-goods-nav v-if="form.auditStatus==1" :fill="true" :options="[]" :buttonGroup="buttonGroup3"
				@buttonClick="buttonClick3" />
		</view>
	</view>
</template>

<script>
	import http from '@/http/api.js'
	import {
		clientId,
		clientSecret
	} from '@/common/setting'
	import {
		submit,
		getDetail,
		fileRemove,
		submitApproval,
		revokeApproval,
		getMaterialDetail
	} from '@/api/home/claim.js'
	export default {
		data() {
			return {
				buttonGroup: [{
					text: '保存',
					backgroundColor: '#03803B',
					color: '#fff'
				}],
				buttonGroup2: [{
						text: '保存',
						backgroundColor: '#03803B',
						color: '#fff'
					},
					{
						text: '提交',
						backgroundColor: '#e64340',
						color: '#fff'
					}
				],
				buttonGroup3: [{
					text: '撤销审核',
					backgroundColor: '#e64340',
					color: '#fff'
				}],
				carShow: false,
				form: {
					file1: null,
					file2: null,
					file3: null,
					file4: null,
					vehicleNumber: '',
					tyreNo: null,
					tyreSpecs: null,
					claimSourceType: 1,
					tireQuantity: 1,
					claimAmount: null,
					claimType: 1,
					claimAttachmentList: [],
				},
				imageStyles: {
					width: 145,
					height: 145,
					border: false,
				},
				mapObject: {
					text: 'name',
					value: 'code',
					children: 'children'
				},
				addressData: [],
				labelList: [],
				corpsTypeList: [],
				storeAttributesList: [],
				chainAttributeList: [],
				signingLevelList: [],
			}
		},
		onLoad(option) {
			this.addressData = JSON.parse(uni.getStorageSync("addressData"))
			if (option && option.id) {
				this.getDetail(option.id)
			}
		},
		methods: {
			buttonClick(e) {
				if (e.index == 0) {
					this.submit()
				}
			},
			buttonClick2(e) {
				if (e.index == 0) {
					this.submit()
				}
				if (e.index == 1) {
					this.approval()
				}
			},
			buttonClick3(e) {
				if (e.index == 0) {
					this.revoke()
				}
			},
			// 处理输入框聚焦事件
			handleInputFocus() {
				if (this.form.auditStatus > 0 || this.form.claimSourceType > 1) return
				this.carShow = true;
			},
			// 按键被点击(点击退格键不会触发此事件)
			carChange(val) {
				// 将每次按键的值拼接到value变量中，注意+=写法
				if (this.form.vehicleNumber.length < 8) {
					this.form.vehicleNumber += val;
				}
			},
			// 退格键被点击
			backspace() {
				if (this.form.vehicleNumber.length) this.form.vehicleNumber = this.form.vehicleNumber.substr(0, this.form
					.vehicleNumber.length - 1);
			},
			photoChange(val) {
				if (val) {
					if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(val)) {
						uni.showToast({
							title: '请输入正确电话',
							icon: 'none'
						});
						return;
					}
				}
			},
			carNoVerify(plateNumber) {
				if (plateNumber) {
					const PROVINCES = [
						'京', '津', '冀', '晋', '蒙', '辽', '吉', '黑',
						'沪', '苏', '浙', '皖', '闽', '赣', '鲁', '豫',
						'鄂', '湘', '粤', '桂', '琼', '川', '贵', '云',
						'渝', '藏', '陕', '甘', '青', '宁', '新', '台',
						'港', '澳'
					]
					const AGENCY_PATTERN = /^[A-HJ-NP-Z]$/
					const BLUE_PLATE_PATTERN = /^[0-9A-HJ-NP-Z]{5}$/
					// 绿牌能源类型标识
					const ENERGY_TYPES = {
						'D': '纯电动',
						'F': '非纯电动'
					}
					const GREEN_PLATE_PATTERN = /^[0-9A-HJ-NP-Z]{6}$/
					const plate = plateNumber.toUpperCase().trim()

					// 长度检查
					if (plate.length !== 7 && plate.length !== 8) {
						uni.showToast({
							title: '请输入有效的车牌号！',
							icon: 'none'
						});
						return false
					}

					// 省份简称检查
					if (!PROVINCES.includes(plate.charAt(0))) {
						uni.showToast({
							title: '请输入有效的车牌号！',
							icon: 'none'
						});
						return false
					}

					// 发牌机关代号检查
					if (!AGENCY_PATTERN.test(plate.charAt(1))) {
						return uni.showToast({
							title: '请输入有效的车牌号！',
							icon: 'none'
						});
					}

					// 蓝牌检查
					if (plate.length === 7) {
						const serial = plate.substring(2)
						if (!(BLUE_PLATE_PATTERN.test(serial) && !/[IO]/.test(serial))) {
							uni.showToast({
								title: '请输入有效的车牌号！',
								icon: 'none'
							});
							return false
						}

					}

					// 绿牌检查
					if (plate.length === 8) {
						const energyType = plate.charAt(2)
						const serial = plate.substring(2)
						if (!((energyType === 'D' || energyType === 'F'))) {
							uni.showToast({
								title: '请输入有效的车牌号！',
								icon: 'none'
							});
							return false
						}
						if (!(GREEN_PLATE_PATTERN.test(serial) && !/[IO]/.test(serial))) {
							uni.showToast({
								title: '请输入有效的车牌号！',
								icon: 'none'
							});
							return false
						}
					}
				}
				return true
			},
			allClick(name) {
				if (!(this.form.auditStatus > 0 || this.form.claimSourceType > 1)) {
					if (name == '识别车牌号') {
						let _this = this
						uni.chooseImage({
							count: 1, //默认9
							sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
							sourceType: ['camera'],
							success: function(file) {
								uni.showLoading({
									title: '加载中',
									mask: true
								});
								uni.uploadFile({
									url: http.config.baseURL +
										'/gubersail-app/appClaim/recognizeLicensePlateNumber', // 仅为示例，非真实的接口地址
									filePath: file.tempFilePaths[0],
									header: {
										// 客户端认证参数
										'Authorization': 'Basic ' + Base64.encode(clientId + ':' +
											clientSecret),
										'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
									},
									name: 'file',
									success: (res) => {
										const data = JSON.parse(res.data)
										console.log(data)
										_this.form.vehicleNumber = data.data
										uni.showToast({
											title: data.msg,
											icon: 'none',
											duration: 2000
										});
									},
									fail: (err) => {
										uni.showToast({
											title: err,
											icon: 'none',
											duration: 2000
										});
									},
									complete: () => {
										uni.hideLoading()
									}
								})
							}
						});
					}
					if (name == '识别胎号') {
						let _this = this
						uni.scanCode({
							scanType: ['barCode'],
							onlyFromCamera: true,
							success: function(res) {
								_this.form.tyreNo = res.result
								_this.getMaterialDetail(res.result)
							}
						});
					}
				}
			},
			getMaterialDetail(val) {
				if (val) {
					let obj = {
						tireNumber: val
					}
					getMaterialDetail(obj).then(res => {
						console.log(res.data)
						if (res.data) {
							this.form.tyreSpecs = res.data.sizeId
							this.form.brandItem = res.data.pattern
							this.form.brandName = res.data.brand
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
							this.form.tyreSpecs = null
							this.form.brandItem = null
							this.form.brandName = null
						}

					})
				} else {
					this.form.tyreSpecs = null
					this.form.brandItem = null
					this.form.brandName = null
				}
			},
			removeByIdFilter(arr, id) {
				return arr.filter(item => item.id !== id);
			},
			// handleInput(value) {
			// 	const decimalRegex = /^-?\d+\.\d+$/ // 小数正则
			// 	if (decimalRegex.test(value)) {
			// 		uni.showToast({
			// 			title: '请输入整数',
			// 			icon: 'none'
			// 		});
			// 	}

			// },
			intBlur(name, value) {
				if (!this.form[name]) return
				// 使用toFixed处理小数位
				try {
					const num = parseFloat(this.form[name])
					if (!isNaN(num)) {
						this.form[name] = Math.floor(num)
					}
				} catch (e) {
					console.error('格式化错误', e)
				}
			},
			handleBlur(value) {
				if (!this.form.claimAmount) return

				// 使用toFixed处理小数位
				try {
					const num = parseFloat(this.form.claimAmount)
					if (!isNaN(num)) {
						this.form.claimAmount = num.toFixed(4)
					}
				} catch (e) {
					console.error('格式化错误', e)
				}
			},
			fileDelete(row) {
				if (row.tempFile.id) {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					fileRemove(row.tempFile.id).then(res => {
						uni.showToast({
							title: '删除成功',
							icon: 'none'
						});
						this.form.claimAttachmentList = this.removeByIdFilter(this.form.claimAttachmentList, row
							.tempFile.id);
					}).finally(() => {
						uni.hideLoading()
					});
				}
			},

			getFileExtension(filename) {
				return filename.slice(((filename.lastIndexOf(".") - 1) >>> 0) + 2);
			},
			fileSelect1(files) {
				files.tempFiles.forEach(file => {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.uploadFile({
						url: http.config.baseURL +
							'/blade-resource/oss/endpoint/put-file', // 仅为示例，非真实的接口地址
						filePath: file.path,
						header: {
							// 客户端认证参数
							'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
							'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
						},
						name: 'file',
						success: (res) => {
							const data = JSON.parse(res.data).data
							this.form.file1 = {
								...this.form.file1,
								url: data.link,
								name: data.originalName,
								extname: this.getFileExtension(data.originalName),
								size: file.size,
							}
							uni.showToast({
								title: '上传成功',
								icon: 'none'
							});
						},
						fail: (err) => {
							uni.showToast({
								title: '上传失败',
								icon: 'none'
							});
						},
						complete: () => {
							uni.hideLoading()
						}
					})
				})
			},
			fileSelect2(files) {
				files.tempFiles.forEach(file => {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.uploadFile({
						url: http.config.baseURL +
							'/blade-resource/oss/endpoint/put-file', // 仅为示例，非真实的接口地址
						filePath: file.path,
						header: {
							// 客户端认证参数
							'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
							'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
						},
						name: 'file',
						success: (res) => {
							const data = JSON.parse(res.data).data
							this.form.file2 = {
								...this.form.file2,
								url: data.link,
								name: data.originalName,
								extname: this.getFileExtension(data.originalName),
								size: file.size,
							}
							uni.showToast({
								title: '上传成功',
								icon: 'none'
							});
						},
						fail: (err) => {
							uni.showToast({
								title: '上传失败',
								icon: 'none'
							});
						},
						complete: () => {
							uni.hideLoading()
						}
					})
				})
			},
			fileSelect3(files) {
				files.tempFiles.forEach(file => {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.uploadFile({
						url: http.config.baseURL +
							'/blade-resource/oss/endpoint/put-file', // 仅为示例，非真实的接口地址
						filePath: file.path,
						header: {
							// 客户端认证参数
							'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
							'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
						},
						name: 'file',
						success: (res) => {
							const data = JSON.parse(res.data).data
							this.form.file3 = {
								...this.form.file3,
								url: data.link,
								name: data.originalName,
								extname: this.getFileExtension(data.originalName),
								size: file.size,
							}
							uni.showToast({
								title: '上传成功',
								icon: 'none'
							});
						},
						fail: (err) => {
							uni.showToast({
								title: '上传失败',
								icon: 'none'
							});
						},
						complete: () => {
							uni.hideLoading()
						}
					})
				})
			},
			fileSelect4(files) {
				files.tempFiles.forEach(file => {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.uploadFile({
						url: http.config.baseURL +
							'/blade-resource/oss/endpoint/put-file', // 仅为示例，非真实的接口地址
						filePath: file.path,
						header: {
							// 客户端认证参数
							'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
							'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
						},
						name: 'file',
						success: (res) => {
							const data = JSON.parse(res.data).data
							this.form.file4 = {
								...this.form.file4,
								url: data.link,
								name: data.originalName,
								extname: this.getFileExtension(data.originalName),
								size: file.size,
							}
							uni.showToast({
								title: '上传成功',
								icon: 'none'
							});
						},
						fail: (err) => {
							uni.showToast({
								title: '上传失败',
								icon: 'none'
							});
						},
						complete: () => {
							uni.hideLoading()
						}
					})
				})
			},
			async submit() {
				if (!this.form.consumerPhone) {
					uni.showToast({
						title: '请输入电话',
						icon: 'none'
					});
					return
				}
				if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.form.consumerPhone)) {
					uni.showToast({
						title: '请输入正确电话',
						icon: 'none'
					});
					return;
				}
				if (!this.carNoVerify(this.form.vehicleNumber)) {
					return
				}
				if (!this.form.file1) {
					uni.showToast({
						title: '请上传病象',
						icon: 'none'
					});
					return
				}
				if (!this.form.file2) {
					uni.showToast({
						title: '请上传轮胎DOT',
						icon: 'none'
					});
					return
				}
				if (!this.form.file3) {
					uni.showToast({
						title: '请上传花纹深度',
						icon: 'none'
					});
					return
				}
				// if (!this.form.file4) {
				// 	uni.showToast({
				// 		title: '请上传鼓包处照片',
				// 		icon: 'none'
				// 	});
				// 	return
				// }
				let obj = await this.convertData(this.$deepClone(this.form))
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				submit(obj).then(res => {
						setTimeout(() => {
							uni.showToast({
								title: '保存成功',
								icon: 'none',
							});
						}, 10);
						uni.setStorageSync('isUpdate', true)
						this.getDetail(res.data.id)
					})
					.catch(() => {
						uni.hideLoading()
					});
			},
			async approval() {
				if (!this.form.consumerPhone) {
					uni.showToast({
						title: '请输入电话',
						icon: 'none'
					});
					return
				}
				if (!this.carNoVerify(this.form.vehicleNumber)) {
					return
				}
				if (!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.form.consumerPhone)) {
					uni.showToast({
						title: '请输入正确电话',
						icon: 'none'
					});
					return;
				}
				if (!this.form.file1) {
					uni.showToast({
						title: '请上传病象',
						icon: 'none'
					});
					return
				}
				if (!this.form.file2) {
					uni.showToast({
						title: '请上传轮胎DOT',
						icon: 'none'
					});
					return
				}
				if (!this.form.file3) {
					uni.showToast({
						title: '请上传花纹深度',
						icon: 'none'
					});
					return
				}
				// if (!this.form.file4) {
				// 	uni.showToast({
				// 		title: '请上传鼓包处照片',
				// 		icon: 'none'
				// 	});
				// 	return
				// }
				let form = await this.convertData(this.$deepClone(this.form))
				let obj = {
					id: this.form.id
				}
				let _this = this
				uni.showModal({
					title: '提示',
					content: '是否提交审核？',
					success: function(res) {
						if (res.confirm) {
							uni.showLoading({
								title: '加载中',
								mask: true
							});
							submit(form).then(res => {
									submitApproval(obj).then(res => {
											setTimeout(() => {
												uni.showToast({
													title: '操作成功',
													icon: 'none',
													duration: 2000
												});
											}, 10);
											_this.getDetail(_this.form.id)
										})
										.catch(() => {
											uni.hideLoading()
										});
								})
								.catch(() => {
									uni.hideLoading()
								});

						}
					}
				});
			},
			revoke() {
				let obj = {
					id: this.form.id
				}
				let _this = this
				uni.showModal({
					title: '提示',
					content: '是否撤销审核？',
					success: function(res) {
						if (res.confirm) {
							uni.showLoading({
								title: '加载中',
								mask: true
							});
							revokeApproval(obj).then(res => {
									setTimeout(() => {
										uni.showToast({
											title: '操作成功',
											icon: 'none',
											duration: 2000
										});
									}, 10);
									_this.getDetail(_this.form.id)
								})
								.catch(() => {
									uni.hideLoading()
								});
						}
					}
				});
			},
			getDetail(id) {
				let obj = {
					id: id
				}
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				getDetail(obj).then(res => {
						res.data.claimAttachmentList.forEach(item => {
							if (item.fileProperties == 1) {
								res.data.file1 = {
									...item,
									url: item.fileUrl,
									name: item.fileName,
									extname: item.fileType,
									size: item.fileSize,
								}
							}
							if (item.fileProperties == 2) {
								res.data.file2 = {
									...item,
									url: item.fileUrl,
									name: item.fileName,
									extname: item.fileType,
									size: item.fileSize,
								}
							}
							if (item.fileProperties == 3) {
								res.data.file3 = {
									...item,
									url: item.fileUrl,
									name: item.fileName,
									extname: item.fileType,
									size: item.fileSize,
								}
							}
							// if (item.fileProperties == 4) {
							// 	res.data.file4 = {
							// 		...item,
							// 		url: item.fileUrl,
							// 		name: item.fileName,
							// 		extname: item.fileType,
							// 		size: item.fileSize,
							// 	}
							// }
						})
						this.form = res.data
					})
					.finally(() => {
						uni.hideLoading()
					});
			},
			async convertData(obj) {
				let fileList = []
				if (obj.file1 && Object.keys(obj.file1).length) {
					fileList.push({
						...obj.file1,
						fileProperties: 1,
					})
				}
				if (obj.file2 && Object.keys(obj.file2).length) {
					fileList.push({
						...obj.file2,
						fileProperties: 2,
					})
				}
				if (obj.file3 && Object.keys(obj.file3).length) {
					fileList.push({
						...obj.file3,
						fileProperties: 3,

					})
				}
				// if (obj.file4 && Object.keys(obj.file4).length) {
				// 	fileList.push({
				// 		...obj.file4,
				// 		fileProperties: 4
				// 	})
				// }
				//附件明细为空时直接赋值
				if (obj.claimAttachmentList.length == 0) {
					fileList.forEach(item => {
						obj.claimAttachmentList.push({
							fileProperties: item.fileProperties,
							fileUrl: item.url,
							fileName: item.name,
							fileType: item.extname,
							fileSize: item.size,
						})
					})
				} else {
					//附件明细有明细区分赋值
					fileList.forEach(item => {
						if (obj.claimAttachmentList.filter(row => row.fileProperties == item.fileProperties)
							.length == 0) {
							//原附件明细不存在,直接push新元素
							obj.claimAttachmentList.push({
								fileProperties: item.fileProperties,
								fileUrl: item.url,
								fileName: item.name,
								fileType: item.extname,
								fileSize: item.size,
							})
						} else {
							//原附件存在明细时，对应赋值
							obj.claimAttachmentList.forEach(row => {
								if (item.fileProperties == row.fileProperties) {
									row.fileUrl = item.url
									row.fileName = item.name
									row.fileType = item.extname
									row.fileSize = item.size
								}
							})
						}
					})
				}
				console.log(obj)
				return obj
			}

		}
	}
</script>

<style lang="scss" scoped>
	.right-align {
		text-align: right;
	}

	.photo {
		margin-left: 20rpx;
		width: 38rpx;
		height: 32rpx;
	}

	.photo-upload {
		display: flex;
		justify-content: space-around;
		margin-top: 45rpx;

		.photo-upload-text {
			font-weight: 400;
			font-size: 28rpx;
			color: #5F5F5F;
			line-height: 32rpx;
			text-align: center;
			margin-bottom: 15rpx;
		}

		.photo-upload-img {
			width: 280rpx;
			height: 280rpx;
			background: #D13B34;
			border-radius: 7rpx;
		}

		.photo-upload-upload {
			width: 280rpx;
			height: 280rpx;
			background: #F6F6F6;
			border-radius: 7rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.photo-upload-img2 {
				width: 219rpx;
				height: 219rpx;
			}
		}
	}

	::v-deep .uni-file-picker__container {
		margin: 0 !important;
	}

	::v-deep .file-picker__box-content {
		margin: 0 !important;
	}

	::v-deep .file-picker__progress {
		display: none;
	}

	::v-deep .uni-section .uni-section-header {
		font-weight: bold !important;
		padding: 12px 0px !important;
		border-bottom: 2px solid #F6F6F6;
	}

	::v-deep .file-picker__box {
		width: 280rpx !important;
		height: 280rpx !important;
	}

	.slot-content-item {
		border-radius: 13rpx;
		border: 2rpx solid #03803B;
		padding: 1rpx 5rpx;
		color: #03803B;
	}

	.slot-content-item-placeholder {
		font-weight: 400 !important;
		font-size: 28rpx !important;
		height: 38rpx !important;
		color: #B5B4B4 !important;
	}

	.slot-box {
		gap: 5px;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
</style>