risk-wx/pages/particulars/claimExpense/index.vue

<template>
	<view class="content">
		<u-sticky>
			<view class="head" style="background-color: #3c9cff; color: #fff;">
				<!-- <text>订单号: {{formData.orderNo}}</text> -->
				<view>
					<text>{{ formData.carRegNo == null ? '' : formData.carRegNo }}</text>
				</view>
				<view>
					<text>{{ formData.goodsCName == null ? '' : formData.goodsCName }}</text>
				</view>
			</view>
			<view class="head-no-addr">
				<view>
					<text>{{formData.loadAddr}}</text>
				</view>
				<!-- <span class="icon iconfont" style="font-size: 100rpx; color: #fcbd71; height: 80rpx;">&#xe6fb;</span> -->
				<view><text>【到】</text></view>
				<view>
					<text>{{formData.unLoadAddr}}</text>
				</view>
			</view>
		</u-sticky>
		<view class="striping"></view>
		<!-- <view class="head" @click="telFun">
			<text>驾驶员: {{formData.driver1Name == null ? '' : formData.driver1Name}}&nbsp;电话:&nbsp;{{formData.driver1mobile == null ? '' : formData.driver1mobile}}</text>
		</view> -->

		<u-tabs :list="tabs" @change="change" :activeStyle="{
				width: '180rpx',
				height: '60rpx',
				color: '#fff',
				backgroundColor: '#3c9cff',
				borderRadius: '80rpx',
				lineHeight: '60rpx',
				textAlign: 'center'
				}" :inactiveStyle="{
				width: '180rpx',
				height: '60rpx',
				color: '#3c9cff',
				backgroundColor: '#f0f0f0f0',
				borderRadius: '80rpx',
				lineHeight: '60rpx',
				textAlign: 'center'
				}"></u-tabs>
		<view v-if="isTabs == '行程费用'">
			<view class="box-box">
				<view class="box">
					<view class="data">
						<text class="key">ETC金额</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnLoadetc" v-model="formData.loadetc" />
					</view>
					<view class="data">
						<text class="key">现金过路费</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnLoadtoll" v-model="formData.loadtoll" />
					</view>
				</view>

				<view class="box">
					<view class="data">
						<text class="key">公司加油(升)</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilhomeQty" v-model="formData.oilhomeQty" />
					</view>
					<view class="data">
						<text class="key">加油金额</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilhomeAmt" v-model="formData.oilhomeAmt" />
					</view>
				</view>
				<view class="box">
					<view class="data-two">
						<text class="key">定点加油1</text>
						<view class="list">
							<uni-data-select :disabled="disabled" :localdata="gasStationList"
								v-model="formData.gasstation1" @change="gasstation1Change"></uni-data-select>
						</view>
					</view>
				</view>
				<view class="box">
					<view class="data">
						<text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint1Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint1Qty" />
					</view>
					<view class="data">
						<text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>

						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint1Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint1Amt" />
					</view>
				</view>

				<view class="box">
					<view class="data-two">
						<text class="key">定点加油2</text>
						<view class="list">
							<uni-data-select :disabled="disabled" :localdata="gasStationList"
								v-model="formData.gasstation2" @change="gasstation2Change"></uni-data-select>
						</view>
					</view>
				</view>
				<view class="box">
					<view class="data">
						<text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint2Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint2Qty" />
					</view>
					<view class="data">
						<text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>

						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint2Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint2Amt" />
					</view>
				</view>

				<view class="box">
					<view class="data-two">
						<text class="key">定点加油3</text>
						<view class="list">
							<uni-data-select :disabled="disabled" :localdata="gasStationList"
								v-model="formData.gasstation3" @change="gasstation3Change"></uni-data-select>
						</view>
					</view>
				</view>
				<view class="box">
					<view class="data">
						<text class="key">升&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint3Qty" placeholder-style="font-size:24rpx" placeholder="请输入升数" v-model="formData.oilappoint3Qty" />
					</view>
					<view class="data">
						<text class="key">金&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额</text>

						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilappoint3Amt" placeholder-style="font-size:24rpx" placeholder="请输入金额" v-model="formData.oilappoint3Amt" />
					</view>
				</view>

				<view class="box">
					<view class="data">
						<text class="key">现金加油(升)</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilcash1Qty" v-model="formData.oilcash1Qty" />
					</view>
					<view class="data">
						<text class="key">加油金额</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilcash1Amt" v-model="formData.oilcash1Amt" />
					</view>
				</view>


				<view class="box">
					<view class="data">
						<text class="key">油卡加油(升)</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilcardQty" v-model="formData.oilcardQty" />
					</view>
					<view class="data">
						<text class="key">加油金额</text>
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnOilcardAmt" v-model="formData.oilcardAmt" />
					</view>
				</view>

				<view class="box-two">
					<text class="key">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</text>
					<input class="value" selection-start="0" selection-end="9999" :disabled="disabled"
						v-model="formData.driverassdesc" />
				</view>
				<!-- </u-collapse-item> -->
			</view>

			<view class="box-box" style="margin-top: 40rpx;">
				<view style="margin-bottom: 20rpx;">
					<text style="color: #3c9cff;">单据拍照存档</text>
				</view>
				<u-upload :fileList="fileList1" accept="image" :sizeType="['compressed']" capture="camera"
					@afterRead="imgUploading" @delete="deletePic" name="1" multiple :disabled="disabled"
					:previewFullImage="true"></u-upload>
			</view>

		</view>

		<view v-if="isTabs == '其他费用'">
			<view class="table">
				<view class="data vertical-layout" v-for="(item, index) in itemsList" :key="index">
					<view class="name">
						<text style="color: #3c9cff;">{{ item.cname }}</text>
					</view>
					<view class="sum">
						<input class="value" selection-start="0" selection-end="9999" :disabled="disabled" type="digit"
							@input="checkUnAmt(item.amt, index)" @click="inputHeight" cursor-spacing="30"
							:always-embed="true" :adjust-position="true" v-model="item.amt" />
					</view>

					<view class="remarks" style="border-bottom: 2rpx dotted #000;">
						<input v-model="item.remarks" placeholder-style="font-size:24rpx" placeholder="请输入备注">
					</view>
				</view>
			</view>
		</view>

		<view class="cushion">
		</view>

		<!-- <view class="bottom vertical-layout" style="z-index: 4;" v-if="status376 == 2 || status376 == 0">
			<view class="bottom-bottom">
				<view class="money">
					<text>报销:</text> {{' '}}
					<text style="color: #ff9f1c;">¥ {{money}}</text>
				</view>

				<view class="button">
					<view class="button-button">
						<u-button iconColor="#3c9cff" shape="circle" type="primary" @click="submitShow = true"
							:disabled="disabled" text="提交费用"></u-button>
					</view>
				</view>
			</view>
		</view> -->



		
		<view v-if="formData.ifStarted && formData.ifStarted != 'A'">
			<!-- 驾驶员 -->
			<view v-if="button" class="bottom" style="z-index: 4;">
				<view class="row">
					<view class="button">
						<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="saveDisabled"
							@click="submitShow = true" text="保存数据"></u-button>
					</view>
					<view class="button">
						<u-button iconColor="#fe8c00;" color="#fe8c00" shape="circle" type="primary" :disabled="upDisabled"
							@click="upButtonClick('TJ')" text="提交报账单"></u-button>
					</view>
				</view>
			</view>
			
			<!-- 队长 -->
			<view v-else class="bottom" style="z-index: 4;">
				<view class="row">
					<view class="button">
						<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="sDisabled"
							@click="auditTClick" text="通过"></u-button>
					</view>
					<view class="button">
						<u-button iconColor="#3c9cff" shape="circle" type="primary" :disabled="sDisabled"
							@click="auditFClick" text="驳回"></u-button>
					</view>
				</view>
			</view>
		</view>

		<!-- 遮盖罩 -->
		<u-loading-page :loading="loading" style="z-index: 20000;"></u-loading-page>

		<!-- 消息提示 -->
		<u-toast ref="uToast"></u-toast>

		<u-modal :show="submitShow" title="提示" showCancelButton @confirm="submit" @cancel="submitShow = false">
			<view class="slot-content">
				<rich-text nodes="确定要保存数据吗?"></rich-text>
			</view>
		</u-modal>

		<u-modal :show="upAuditShow" confirmColor="#fe8c00" title="提示" showCancelButton @confirm="upReview" @cancel="upAuditShow = false">
			<view class="slot-content">
				<rich-text nodes="点击确认后该业务将锁定，无法添加修改费用报销！确定要提交吗？"></rich-text>
			</view>
		</u-modal>

		<u-modal :show="deleteShow" title="提示" showCancelButton @confirm="deleteImg" @cancel="deleteShow = false">
			<view class="slot-content">
				<rich-text nodes="确定删除这张图片吗?"></rich-text>
			</view>
		</u-modal>

		<u-modal :show="auditTShow" title="提示" showCancelButton @confirm="check('T')" @cancel="auditTShow = false">
			<view class="slot-content" style="display: flex; flex-direction: column; align-items: center;">
				<rich-text nodes="确定要审核通过吗?"></rich-text>
				<input style="margin-top: 20rpx;"
					selection-start="0"
					selection-end="9999"
					placeholder="请输入通过意见"
					placeholder-style="font-size: 28rpx"
					v-model="formData.audit2Desc"
				/>
			</view>
		</u-modal>
		<u-modal :show="auditFShow" title="提示" showCancelButton @confirm="check('F')" @cancel="auditFShow = false">
			<view class="slot-content" style="display: flex; flex-direction: column; align-items: center;">
				<rich-text nodes="确定要驳回吗?"></rich-text>
				<input style="margin-top: 20rpx;"
					selection-start="0"
					selection-end="9999"
					placeholder="请输入驳回意见"
					placeholder-style="font-size: 28rpx"
					v-model="formData.audit2Desc"
				/>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import {
		getGasStations,
		getItems,
		insertLoadFeeItems,
		getLoadFeeItems,
		isMileage
	} from "@/api/reimbursement"

	import {
		getOrderBillsPlansByid,
		putOrderBillsPlansByid,
		insertTmsAttachMngs,
		pictureUploading,
		deleteTmsAttachMngs,
		submitAudit,
		audit
	} from "@/api/particulars"
	export default {
		data() {
			return {
				orderNo: '',
				// 遮盖罩
				loading: true,
				formData: {
					// itemsVoList: [],
					// oilappoint1Qty: 1,
					// oilappoint2Qty: 1
				},
				// 报销费用list
				gasStationList: [],
				// 其他费用list
				itemsList: [],
				// 其他费用被选中
				selectedIndexs: [],
				radioValueOne: '', // 当前 radio 的值
				numOne: 0, //用于区分是否是重复选中
				radioValueTwo: '', // 当前 radio 的值
				numTwo: 0, //用于区分是否是重复选中
				// 输入框禁用
				disabled: false,
				// 保存数据按钮
				saveDisabled: false,
				// 提交数据按钮
				upDisabled: false,
				// 审核按钮禁用
				sDisabled: true,
				// 底部按钮
				button: null,
				status376: 0,
				selectionLength: 0,
				fileList1: [],
				// 删除弹框
				deleteShow: false,
				// 提交费用弹窗
				submitShow: false,
				// 提交审核弹框
				upAuditShow: false,
				// 审核通过弹框
				auditTShow: false,
				// 审核驳回弹框
				auditFShow: false,
				event: {},
				vHeight: 0,
				tabs: [{
					name: '行程费用'
				}, {
					name: '其他费用'
				}],
				isTabs: '行程费用',
				// 报销金额
				money: 0

			}
		},
		onUnload() {
			this.formData = {};
			this.loading = true;
		},
		onLoad: function(option) {
			this.status376 = option.status;
			this.orderNo = option.orderNo;
			if (this.status376 == 6) {
				this.disabled = true;
			}
			this.getData();
			this.getLoadFeeItemsfun()
		},
		methods: {
			change(item) {
				this.isTabs = item.name;
			},
			auditTClick() {
				this.formData.audit2Desc = "审核通过"
				this.auditTShow = true
			},
			auditFClick() {
				this.formData.audit2Desc = null
				this.auditFShow = true
			},
			getData() {
				// 报销费用下拉选
				getGasStations().then(res => {
					// this.gasStationList = res.data

					for (var item in res.data) {
						var data = {
							text: res.data[item].cname,
							value: res.data[item].cname
						};
						this.gasStationList.push(data);
					}
					getItems().then(res => {
						this.itemsList = res.data
					})
				})
			},
			getLoadFeeItemsfun(){
				getLoadFeeItems(this.orderNo).then(res => {
					res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
					res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
					res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
					res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
					res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
					res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
					res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
					res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
					res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
					res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
					res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
					res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
					res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
					res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
						
						for (let item of this.itemsList) {
							if (item == 0) {
								item.amt = null
							}
						}
				
					// // 角色
					for (let role of res.data.roleList) {
						if (role == 'DZ') {
							this.button = false;
							this.disabled = true;
						}
						if (role == 'JSY') {
							this.button = true;
							this.disabled = false;
						}
					}
				
					// 审核中
					if (
						res.data.ifStarted == "S") {
						this.disabled = true;
						this.saveDisabled = true;
						this.upDisabled = true;
						this.sDisabled = false;
					}
					// 审核完成
					if (
						res.data.ifStarted == "A") {
						this.disabled = true;
						this.saveDisabled = true;
						this.upDisabled = true;
					}
				
					// 未提交
					// if (res.data.ifLoaded != "T" ||
					// 	res.data.ifUnLoaded != "T") {
					// 	this.disabled = false;
					// 	this.saveDisabled = false;
					// 	this.upDisabled = true;
					// }
				
					this.formData = res.data;
					var costBreakdownList = res.data.loadFeeItemsList;
					this.itemsList = costBreakdownList;
				
					for (const key in this.itemsList) {
						if (this.itemsList[key].amt == 0) {
							this.itemsList[key].amt = null;
						}
					}
				
					this.fileList1 = res.data.fileList1;
					this.loading = false;
				
					// isMileage(this.orderNo).then(res => {
					// 	if (res.msg == 410) {
					// 		// this.disabled = true;
					// 		// this.upDisabled = true;
					// 		// this.$refs.uToast.show({
					// 		// 	type: 'warning',
					// 		// 	icon: false,
					// 		// 	message: "当前报单有待提交里程!",
					// 		// 	iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					// 		// })
					// 	}
					// })
				
					// this.calculatMoney();
				})
			},
			// 事件审核按钮
			upButtonClick(type) {
				if(this.formData.loadQty == null) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "没有装车吨位!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if(this.formData.loadDate == null) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "没有装车时间!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if(this.formData.unLoadQty == null) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "没有卸车吨位!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if(this.formData.unLoadDate == null) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "没有卸车时间!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if (this.formData.ifOrder2ed == 'F') {
					this.upAuditShow = false;
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "装卸信息提交后才能报账!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if (this.formData.ifOrder2ed != 'O' && this.formData.ifOrder2ed != 'S') {
					this.upAuditShow = false;
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "请先提交卸车信息!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					}) 
				} else {
					if (type == 'BX') {
						this.submitShow = true
					} else if (type == 'TJ') {
						this.upAuditShow = true
					}
					
				}
				
			},
			// 保存内容
			submit() {
				if (this.status376 == 6) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "不允许保存!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if (this.status376 == 2 || this.status376 == 0) {

					let isMo = false;

					for (const key in this.itemsList) {
						if (this.itemsList[key].amt == null) {
							this.itemsList[key].amt = 0;
						}
					}
					if (this.formData.loadetc == null) {
						this.formData.loadetc = 0;
					}
					if (this.formData.loadtoll == null) {
						this.formData.loadtoll = 0;
					}
					if (this.formData.oilhomeQty == null) {
						this.formData.oilhomeQty = 0;
					}
					if (this.formData.oilhomeAmt == null) {
						this.formData.oilhomeAmt = 0;
					}
					if (this.formData.oilappoint1Qty == null) {
						this.formData.oilappoint1Qty = 0;
					}
					if (this.formData.oilappoint1Amt == null) {
						this.formData.oilappoint1Amt = 0;
					}
					if (this.formData.oilappoint2Qty == null) {
						this.formData.oilappoint2Qty = 0;
					}
					if (this.formData.oilappoint2Amt == null) {
						this.formData.oilappoint2Amt = 0;
					}
					if (this.formData.oilappoint3Qty == null) {
						this.formData.oilappoint3Qty = 0;
					}
					if (this.formData.oilappoint3Amt == null) {
						this.formData.oilappoint3Amt = 0;
					}
					if (this.formData.oilcash1Qty == null) {
						this.formData.oilcash1Qty = 0;
					}
					if (this.formData.oilcash1Amt == null) {
						this.formData.oilcash1Amt = 0;
					}
					if (this.formData.oilcardQty == null) {
						this.formData.oilcardQty = 0;
					}
					if (this.formData.oilcardAmt == null) {
						this.formData.oilcardAmt = 0;
					}
					if (this.formData.gasstation1 == null) {
						this.formData.gasstation1 = 0;
					}
					if (this.formData.gasstation2 == null) {
						this.formData.gasstation2 = 0;
					}
					if (this.formData.gasstation3 == null) {
						this.formData.gasstation3 = 0;
					}

					this.loading = true;
					// var list = [];
					// for (var item in this.itemsList) {
					// 	var amt = this.itemsList[item].amt;
					// 	if (amt != null) {
					// 		var items = this.itemsList[item];
					// 		list.push(items);
					// 	}
					// }
					
					// for (let item of this.itemsList) {
					// 	if (item == 0) {
					// 		item.amt = null
					// 	}
					// }
					// this.formData.itemsVoList = list;
					this.formData.itemsVoList = this.itemsList;
					insertLoadFeeItems(this.formData).then(res => {
						this.submitShow = false;
						if (res.code == 200) {
							// 报销费用下拉选
							getGasStations().then(res => {
								// this.gasStationList = res.data
								for (var item in res.data) {
									var data = {
										text: res.data[item].cname,
										value: res.data[item].cname
									};
									this.gasStationList.push(data);
								}
								getItems().then(res => {
									this.itemsList = res.data
									getLoadFeeItems(this.orderNo).then(res => {
										res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
										res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
										res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
										res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
										res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
										res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
										res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
										res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
										res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
										res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
										res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
										res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
										res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
										res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
											for (let item of this.itemsList) {
												if (item == 0) {
													item.amt = null
												}
											}
										// 角色
										for (let role of res.data.roleList) {
											if (role == 'DZ') {
												this.button = false;
											}
										}
							
										// 审核中
										if (
											res.data.ifStarted == "S") {
											this.disabled = true;
											this.saveDisabled = true;
											this.upDisabled = true;
											this.sDisabled = false;
										}
										// 审核完成
										if (
											res.data.ifStarted == "A") {
											this.disabled = true;
											this.saveDisabled = true;
											this.upDisabled = true;
										}
							
										// 未提交
										// if (res.data.ifLoaded != "T" ||
										// 	res.data.ifUnLoaded != "T") {
										// 	this.disabled = false;
										// 	this.saveDisabled = false;
										// 	this.upDisabled = true;
										// }
							
										this.formData = res.data;
										var costBreakdownList = res.data.loadFeeItemsList;
										this.itemsList = costBreakdownList;
							
										for (const key in this.itemsList) {
											if (this.itemsList[key].amt == 0) {
												this.itemsList[key].amt = null;
											}
										}
										this.fileList1 = res.data.fileList1;
										
										this.$refs.uToast.show({
											type: 'success',
											message: "保存成功!",
											iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
										})
										this.loading = false;
									})
								})
							})
								
							// this.getData();
							// 保存成功弹窗提示
							// this.$refs.uToast.show({
							// 	type: 'success',
							// 	message: "保存成功!",
							// 	iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
							// })
						} else {
							// 保存失败消息
							this.$refs.uToast.show({
								icon: false,
								message: "保存失败请重试!",
								iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
							})
						}
					})
				}
			},

			// 提交审核
			upReview() {
				// if (this.status376 == 6) {
				// 	this.upAuditShow = false;
				// 	this.$refs.uToast.show({
				// 		type: 'warning',
				// 		icon: false,
				// 		message: "不允许保存!",
				// 		iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
				// 	})
				// } else if (this.status376 == 2 || this.status376 == 0) {
					
				if (this.formData.ifOrder2ed != 'O' && this.formData.ifOrder2ed != 'S') {
					this.upAuditShow = false;
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "请先提交报账单!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else if (this.formData.ifOrder2ed == 'O' || this.formData.ifOrder2ed == 'S') {

					let isMo = false;

					for (const key in this.itemsList) {
						if (this.itemsList[key].amt == null) {
							this.itemsList[key].amt = 0;
						}
					}
					if (this.formData.loadetc == null) {
						this.formData.loadetc = 0;
					}
					if (this.formData.loadtoll == null) {
						this.formData.loadtoll = 0;
					}
					if (this.formData.oilhomeQty == null) {
						this.formData.oilhomeQty = 0;
					}
					if (this.formData.oilhomeAmt == null) {
						this.formData.oilhomeAmt = 0;
					}
					if (this.formData.oilappoint1Qty == null) {
						this.formData.oilappoint1Qty = 0;
					}
					if (this.formData.oilappoint1Amt == null) {
						this.formData.oilappoint1Amt = 0;
					}
					if (this.formData.oilappoint2Qty == null) {
						this.formData.oilappoint2Qty = 0;
					}
					if (this.formData.oilappoint2Amt == null) {
						this.formData.oilappoint2Amt = 0;
					}
					if (this.formData.oilappoint3Qty == null) {
						this.formData.oilappoint3Qty = 0;
					}
					if (this.formData.oilappoint3Amt == null) {
						this.formData.oilappoint3Amt = 0;
					}
					if (this.formData.oilcash1Qty == null) {
						this.formData.oilcash1Qty = 0;
					}
					if (this.formData.oilcash1Amt == null) {
						this.formData.oilcash1Amt = 0;
					}
					if (this.formData.oilcardQty == null) {
						this.formData.oilcardQty = 0;
					}
					if (this.formData.oilcardAmt == null) {
						this.formData.oilcardAmt = 0;
					}
					if (this.formData.gasstation1 == null) {
						this.formData.gasstation1 = 0;
					}
					if (this.formData.gasstation2 == null) {
						this.formData.gasstation2 = 0;
					}
					if (this.formData.gasstation3 == null) {
						this.formData.gasstation3 = 0;
					}
					this.loading = true;
					// var list = [];
					// for (var item in this.itemsList) {
					// 	var amt = this.itemsList[item].amt;
					// 	if (amt != null) {
					// 		var items = this.itemsList[item];
					// 		list.push(items);
					// 	}
					// }
					this.formData.itemsVoList = this.itemsList;
					submitAudit(this.formData).then(res => {
						this.submitShow = false
						this.upAuditShow = false;
						if (res.msg == 'ok') {
								getGasStations().then(res => {
									for (var item in res.data) {
										var data = {
											text: res.data[item].cname,
											value: res.data[item].cname
										};
										this.gasStationList.push(data);
									}
									getItems().then(res => {
										this.itemsList = res.data
										getLoadFeeItems(this.orderNo).then(res => {
											res.data.loadetc == 0 ? res.data.loadetc = null : res.data.loadetc
											res.data.loadtoll == 0 ? res.data.loadtoll = null : res.data.loadtoll
											res.data.oilhomeQty == 0 ? res.data.oilhomeQty = null : res.data.oilhomeQty
											res.data.oilhomeAmt == 0 ? res.data.oilhomeAmt = null : res.data.oilhomeAmt
											res.data.oilappoint1Qty == 0 ? res.data.oilappoint1Qty = null : res.data.oilappoint1Qty
											res.data.oilappoint1Amt == 0 ? res.data.oilappoint1Amt = null : res.data.oilappoint1Amt
											res.data.oilappoint2Qty == 0 ? res.data.oilappoint2Qty = null : res.data.oilappoint2Qty
											res.data.oilappoint2Amt == 0 ? res.data.oilappoint2Amt = null : res.data.oilappoint2Amt
											res.data.oilappoint3Qty == 0 ? res.data.oilappoint3Qty = null : res.data.oilappoint3Qty
											res.data.oilappoint3Amt == 0 ? res.data.oilappoint3Amt = null : res.data.oilappoint3Amt
											res.data.oilcash1Qty == 0 ? res.data.oilcash1Qty = null : res.data.oilcash1Qty
											res.data.oilcash1Amt == 0 ? res.data.oilcash1Amt = null : res.data.oilcash1Amt
											res.data.oilcardQty == 0 ? res.data.oilcardQty = null : res.data.oilcardQty
											res.data.oilcardAmt == 0 ? res.data.oilcardAmt = null : res.data.oilcardAmt
												for (let item of this.itemsList) {
													if (item == 0) {
														item.amt = null
													}
												}
											// 角色
											for (let role of res.data.roleList) {
												if (role == 'DZ') {
													this.button = false;
												}
											}
											// 审核中
											if (
												res.data.ifStarted == "S") {
												this.disabled = true;
												this.saveDisabled = true;
												this.upDisabled = true;
												this.sDisabled = false;
											}
											// 审核完成
											if (
												res.data.ifStarted == "A") {
												this.disabled = true;
												this.saveDisabled = true;
												this.upDisabled = true;
											}
								
											// 未提交
											// if (res.data.ifLoaded != "T" ||
											// 	res.data.ifUnLoaded != "T") {
											// 	this.disabled = false;
											// 	this.saveDisabled = false;
											// 	this.upDisabled = true;
											// }
								
											this.formData = res.data;
											var costBreakdownList = res.data.loadFeeItemsList;
											this.itemsList = costBreakdownList;
								
											for (const key in this.itemsList) {
												if (this.itemsList[key].amt == 0) {
													this.itemsList[key].amt = null;
												}
											}
											this.fileList1 = res.data.fileList1;
											this.$refs.uToast.show({
												type: 'success',
												message: "提交审核成功!",
												iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
											})
											this.loading = false;
										})
									})
								})
							// this.getData();
							// // 保存成功弹窗提示
							// this.$refs.uToast.show({
							// 	type: 'success',
							// 	message: "提交审核成功!",
							// 	iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
							// })
						} else {
							// 保存失败消息
							this.$refs.uToast.show({
								icon: false,
								message: "提交审核失败请重试!",
								iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
							})
						}
					})
				}
			},

			// 审核
			check(type) {
				this.loading = true;
				var data = {
					orderNo: this.orderNo,
					entityId: this.formData.entityId,
					audit2Desc: this.formData.audit2Desc ? this.formData.audit2Desc : '',
					lineNo: this.formData.lineNo,
					auditType: type
				}

				audit(data).then(res => {
					if (res.msg == 'ok') {
						this.getData();
						this.sDisabled = false;
						if (type == 'T') {
							this.auditTShow = false;
						} else if (type == 'F') {
							this.auditFShow = false;
						}
						// 保存成功弹窗提示
						this.$refs.uToast.show({
							type: 'success',
							message: "审核成功!",
							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
						})
						this.loading = false;
					} else {
						// 保存失败消息
						this.$refs.uToast.show({
							icon: false,
							message: "审核失败请重试!",
							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
						})
						this.loading = false;
					}
				})
			},
			// 删除图片
			deletePic(event) {
				if (this.disabled) {
					this.$refs.uToast.show({
						type: 'warning',
						icon: false,
						message: "不允许修改!",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/warning.png'
					})
				} else {
					this.event = event;
					this.deleteShow = true;
				}
			},
			deleteImg() {

				var event = this.event;
				var url = event.file.url;
				var index = url.lastIndexOf("\/");
				var attachId = url.substring(index + 1, url.length);

				deleteTmsAttachMngs(attachId).then(res => {
					if (res.code == 200) {
						this[`fileList${event.name}`].splice(event.index, 1)
						// 删除成功消息
						this.$refs.uToast.show({
							type: 'success',
							message: "删除成功!",
							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
						})
					} else {
						// 删除失败消息
						this.$refs.uToast.show({
							icon: false,
							message: "删除失败请重试!",
							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
						})
					}

					this.event = {};
					this.deleteShow = false;
				})
			},
			// 新增图片
			imgUploading(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					let date = this.dateToString("yyyyMMdd");
					let dateHHmmss = this.dateToString("yyyy-MM-dd HH:mm:ss");
					this.formData.date = date;
					insertTmsAttachMngs(this.formData).then(res => {
						if (res.code == 200) {
							let data = {
								name: 'avatarfile',
								filePath: lists[i].url
							}
							// 获取经纬度
							let longitude = '';
							let latitude = '';
							// uni.getLocation({
							// 	type: 'wgs84',
							// 	success: function(res) {
							// 		console.log('当前位置的经度：' + res.longitude);
							// 		console.log('当前位置的纬度：' + res.latitude);
							// 	}
							// });
							
							uni.getLocation({
								type: 'wgs84',
								isHighAccuracy: true,
								geocode: true,
								success: (map) => {
									longitude = map.longitude
									latitude = map.latitude
									let dataForm = {
										attachId: res.data,
										longitude: longitude,
										latitude: latitude,
										updateDate: dateHHmmss
									}
									// 上传图片
									pictureUploading(data, dataForm).then(res => {
										let item = this[`fileList${event.name}`][fileListLen]
										this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(
											item, {
												status: 'success',
												message: '',
												url: res.data
											}))
										fileListLen++
									})
								}
							});
							// let dataForm = {
							// 	attachId: res.data,
							// 	longitude: longitude,
							// 	latitude: latitude,
							// 	updateDate: dateHHmmss
							// }

							// console.log(dataForm);
							// // 上传图片
							// pictureUploading(data, dataForm).then(res => {
							// 	let item = this[`fileList${event.name}`][fileListLen]
							// 	this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(
							// 		item, {
							// 			status: 'success',
							// 			message: '',
							// 			url: res.data
							// 		}))
							// 	fileListLen++
							// })
						}

					})
				}
			},
			dateToString(fmt) {
				var date = new Date();
				var o = {
					"M+": date.getMonth() + 1, //月份 
					"d+": date.getDate(), //日 
					"H+": date.getHours(), //小时 
					"m+": date.getMinutes(), //分 
					"s+": date.getSeconds(), //秒 
					"q+": Math.floor((date.getMonth() + 3) / 3), //季度 
					"S": date.getMilliseconds() //毫秒 
				};
				if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
				for (var k in o)
					if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
						k]) : (("00" + o[k]).substr(("" + o[k]).length)));
				return fmt;
			},
			// 定点加油1清空
			gasstation1Change() {
				this.formData.oilappoint1Qty = '';
				this.formData.oilappoint1Amt = 0;
			},
			// 定点加油2清空
			gasstation2Change() {
				this.formData.oilappoint2Qty = '';
				this.formData.oilappoint2Amt = 0;
			},
			// 定点加油3清空
			gasstation3Change() {
				this.formData.oilappoint3Qty = '';
				this.formData.oilappoint3Amt = 0;
			},
			// 点击拨打电话
			telFun() {
				if (this.formData.driver1mobile != null && this.formData.driver1mobile != '') {
					uni.makePhoneCall({
						phoneNumber: this.formData.driver1mobile, //电话号码
						success: function(e) {
							// console.log(e);
						},
						fail: function(e) {
							// console.log(e);
						}
					})
				}
			},
			// 其他费用表格勾选事件
			selectionChange(e) {
				this.selectedIndexs = e.detail.index;
			},

			// 计算报销金额
			// calculatMoney() {
			// 	let loadetc = this.formData.loadetc == null ? 0 : this.formData.loadetc;
			// 	let loadtoll = this.formData.loadtoll == null ? 0 : this.formData.loadtoll;
			// 	let oilhomeAmt = this.formData.oilhomeAmt == null ? 0 : this.formData.oilhomeAmt;
			// 	let oilappoint1Amt = this.formData.oilappoint1Amt == null ? 0 : this.formData.oilappoint1Amt;
			// 	let oilappoint2Amt = this.formData.oilappoint2Amt == null ? 0 : this.formData.oilappoint2Amt;
			// 	let oilappoint3Amt = this.formData.oilappoint3Amt == null ? 0 : this.formData.oilappoint3Amt;
			// 	let oilcash1Amt = this.formData.oilcash1Amt == null ? 0 : this.formData.oilcash1Amt;
			// 	let oilcardAmt = this.formData.oilcardAmt == null ? 0 : this.formData.oilcardAmt;

			// 	let itemsMoney = 0;

			// 	for (const key in this.itemsList) {
			// 		let a = this.itemsList[key].amt == null ? 0 : this.itemsList[key].amt;
			// 		itemsMoney += Number(a);
			// 	}

			// 	loadetc = Number(loadetc)
			// 	loadtoll = Number(loadtoll)
			// 	oilhomeAmt = Number(oilhomeAmt)
			// 	oilappoint1Amt = Number(oilappoint1Amt)
			// 	oilappoint2Amt = Number(oilappoint2Amt)
			// 	oilappoint3Amt = Number(oilappoint3Amt)
			// 	oilcash1Amt = Number(oilcash1Amt)
			// 	oilcardAmt = Number(oilcardAmt)
			// 	itemsMoney = Number(itemsMoney)


			// 	this.money = loadetc + loadtoll + oilhomeAmt + oilappoint1Amt + oilappoint2Amt + oilcash1Amt + oilcardAmt +
			// 		oilappoint3Amt + itemsMoney;
			// },
			checkUnLoadetc(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.loadetc = e.target.value
				})
				this.calculatMoney();
			},
			checkUnLoadtoll(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.loadtoll = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilhomeQty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilhomeQty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilhomeAmt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilhomeAmt = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilappoint1Qty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint1Qty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilappoint1Amt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint1Amt = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilappoint2Qty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint2Qty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilappoint2Amt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint2Amt = e.target.value
				})

				this.calculatMoney();
			},
			checkUnOilappoint3Qty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint3Qty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilappoint3Amt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilappoint3Amt = e.target.value
				})

				this.calculatMoney();
			},
			checkUnOilcash1Qty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilcash1Qty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilcash1Amt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilcash1Amt = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilcardQty(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,3})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilcardQty = e.target.value
				})
				this.calculatMoney();

			},
			checkUnOilcardAmt(e) {
				//正则表达试
				e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.formData.oilcardAmt = e.target.value
				})
				this.calculatMoney();

			},
			checkUnAmt(amt, index) {

				var amt = (amt.match(/^\d*(\.?\d{0,2})/g)[0]) || null
				//重新赋值给input
				this.$nextTick(() => {
					this.itemsList[index].amt = amt
				})
				this.calculatMoney();
			},
			inputHeight() {
				// if (this.vHeight == 0) {
				this.vHeight = 600;
				// } else {
				// 		this.vHeight = 0;
				// }
			}
		}
	}
</script>

<style lang="scss">
	@import url("/font/iconfont.css");

	// 修改布局方向为纵向布局
	.vertical-layout {
		display: flex;
	}

	.h {
		margin-top: 20rpx;
		height: 100rpx;
		padding-left: 40rpx;
		// font-weight: 900;
		border-top: 2rpx solid #f0f0f0f0;
		border-bottom: 2rpx solid #f0f0f0f0;

		line-height: 100rpx;

		font-size: 30rpx;
		color: #3c9cff;

		// background-color: pink;
	}

	// 分割线
	.striping {
		width: 100%;
		height: 4rpx;
		background-color: #f0f0f0f0;
	}

	.box-box {
		padding-left: 30rpx;
		padding-right: 30rpx;
	}

	.content {

		box-sizing: border-box;
		background-color: white;

		.head {
			color: #3c9cff;
			// width: 100%;
			height: 40rpx;
			padding: 0 30rpx;

			vertical-align: middle;
			// display: table-cell;
			display: flex;
			align-items: flex-end;

			justify-content: space-between;
			box-sizing: border-box;

			font-size: 34rpx;
			font-weight: 700;
			// background-color: red;
		}

		.head-no-addr {
			// width: 960rpx;
			height: 100rpx;
			// padding-left: 30rpx;
			padding: 0 30rpx;
			vertical-align: middle;
			color: #fff;
			font-size: 34rpx;
			font-weight: 700;

			display: flex;

			align-items: center;
			justify-content: space-between;
			box-sizing: border-box;
			background-color: #3c9cff;
		}


		.box-list {

			color: #3b3b3b;
			width: 100%;
			border-bottom: 2rpx solid #f0f0f0f0;
			// padding-left: 50rpx;
			// font-size: 30rpx;


			color: #3b3b3b;

			.icon {

				// width: 100rpx;
				margin-top: 50rpx;
				// font-size: 50rpx;
				// color: #4888ff;
			}

			.list {

				margin-top: 30rpx;
				margin-bottom: 20rpx;

				width: 100%;
				height: 100%;
				// background-color: pink;

				height: auto;
				display: flex;

				flex-wrap: wrap;

				// font-size: 30rpx;
			}

			.quantity-aum {
				margin-bottom: 25rpx;

				.aaa {
					width: 50%;

					.key {
						display: inline-block;
						width: 50%;
						margin-left: 20rpx;
						// margin-right: 80rpx;
						border-bottom: 2rpx dotted #000;
					}
				}

				.bbb {
					width: 50%;

					.value {

						width: 50%;

						margin-left: 20rpx;
						// margin-right: 20rpx;
						border-bottom: 2rpx dotted #000;
					}
				}
			}
		}

		.box {

			color: #3b3b3b;

			// overflow: hidden;
			height: 100rpx;

			// border-bottom: 2rpx solid #f0f0f0f0;

			// font-size: 30rpx;

			display: flex;
			align-items: center;

			.data {
				width: 50%;
				display: flex;
				align-items: center;

				.key {
					width: 55%;
					text-align: right;
					color: #3c9cff;
				}

				.value {
					margin-left: 20rpx;
					width: 45%;
					color: #3b3b3b;
					border-bottom: 2rpx dotted #000;
				}
			}

			.data-two {
				width: 100%;
				display: flex;
				align-items: center;

				.key {
					width: 35%;
					text-align: right;
					color: #3c9cff;

				}

				.list {
					margin-top: 30rpx;
					margin-bottom: 20rpx;

					width: 100%;
					height: 100%;
					// background-color: pink;

					height: auto;
					display: flex;

					flex-wrap: wrap;

					// font-size: 30rpx;
				}
			}
		}

		.box-two {

			color: #3b3b3b;

			overflow: hidden;
			height: 100rpx;

			padding-left: 20rpx;
			// margin-right: 20rpx;

			// font-size: 30rpx;

			display: flex;
			align-items: center;

			.key {


				display: inline-block;
				width: 24%;
				color: #3c9cff;

			}

			.value {
				margin-left: 20rpx;
				width: calc(100% - 24%);
				color: #3b3b3b;
				// margin-right: 20rpx;
				border-bottom: 2rpx dotted #000;

			}
		}

		.table {
			// margin-top: 40rpx;
			margin-left: 20rpx;
			margin-right: 20rpx;

			.data {
				// font-size: 30rpx;
				width: 100%;
				height: 100rpx;
				border-bottom: 2rpx solid #f0f0f0f0;
				align-items: center;

				.name {

					text-align: right;
					width: 25%;
					margin-left: 20rpx;
					color: #000;
				}

				.sum {
					width: 20%;
					margin-left: 20rpx;
					margin-right: 40rpx;
					border-bottom: 2rpx dotted #000;
				}

				.remarks {
					width: 30%;
				}
			}
		}

		.primary {
			background-color: #0b68ffff;
		}

		.attention {
			padding: 30rpx;
			padding-left: 50rpx;
			padding-bottom: 40rpx;
		}

		// 底部提交按钮
		// .bottom {
		// 	height: 130rpx;
		// 	display: block;
		// 	position: fixed;
		// 	bottom: calc(var(--window-bottom));
		// 	width: 100%;
		// 	// background-color: #f0f0f0f0;
		// 	// background-color: pink;
		// 	background-color: white;

		// 	.bottom-bottom {
		// 		width: 100%;
		// 		height: 100%;

		// 		position: relative;

		// 		display: flex;

		// 		// .submit {
		// 		// 	width: 95%;
		// 		// 	background-color: #0b68ffff;
		// 		// }

		// 		.money {

		// 			font-size: 28rpx;
		// 			height: 130rpx;
		// 			margin-right: 80rpx;
		// 			line-height: 130rpx;

		// 			margin-left: 10%;
		// 		}

		// 		.button {
		// 			width: 300rpx;
		// 			position: absolute;
		// 			right: 0;

		// 			margin-right: 10%;

		// 			.button-button {
		// 				padding: 10% 0;
		// 				background-clip: content-box;
		// 			}

		// 		}
		// 	}
		// }

		.bottom {

			position: fixed;
			bottom: calc(var(--window-bottom));
			width: 100%;
			height: 130rpx;
			background-color: white;

			.row {

				display: flex;
				justify-content: space-evenly;
				height: 130rpx;
				align-items: center;

				.button {
					width: 300rpx;
					// width: 660rpx;
				}
			}
		}

		.input {
			width: 100%;
			// height: 100rpx;
			// background-color: red;

		}

		.cushion {
			width: 100%;
			height: 200rpx;
			background-color: #f0f0f0f0;
		}



	}
</style>