SmartStorage/pages/innerFix/innerFix.vue

<template>
	<view>
		<view class="form-area">
			<uni-forms
			    v-for="(item, index) in allForm"
				:key="index"
				:modelValue="allForm[index]"
				label-position="top"
				style="border: 1px solid #A9A9A9; box-sizing: border-box; padding: 30rpx; margin-bottom: 3vh;"
			>
				<uni-forms-item
					label="维修数量"
					v-show="ifNo == 0"
				>
					<uni-easyinput type="number" placeholder="请输入" v-model="allForm[index].repairNum"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item
					label="是否收费"
				>
					<uni-data-select
					      v-model="allForm[index].partType"
					      :localdata="ifFeeRange"
						  :clear="false"
					    ></uni-data-select>
				</uni-forms-item>
				<uni-forms-item
					label="选择配件"
				>
					<custom-tree-select
						:listData="deptList"
						v-model="allForm[index].partId"
						:search="true"
						:choseParent="false"
						:pathMode="true"
						@selectChange="treeChange($event, index)"
					></custom-tree-select>
				</uni-forms-item>
				<uni-forms-item
					label="配件数量"
				>
					<uni-number-box v-model="allForm[index].partNum"/>
				</uni-forms-item>
				<uni-forms-item
					label="维修人员"
				>
					<uni-data-select
					      v-model="allForm[index].repairer"
					      :localdata="repairerRange"
					    ></uni-data-select>
				</uni-forms-item>
				<uni-forms-item
					label="维修内容"
				>
					<uni-easyinput type="textarea" placeholder="请输入内容" v-model="allForm[index].repairContent"></uni-easyinput>
				</uni-forms-item>
			</uni-forms>
			<view class="btn-area">
				<view
					@click="addForm"
					style="background-color: #3788FF; color: #fff;"
				>
					添加配件
				</view>
				<view
					@click="subForm"
					style="border: 1px solid #EBEBEB;"
				>
					维修完成
				</view>
			</view>
		</view>
		<!-- <custom-tree-select
			:listData="deptList"
			v-model="testArr"
			:search="true"
		></custom-tree-select> -->
		<u-loading-page :loading="showLoading" color="#000" loading-text="表单提交中,请稍后..."></u-loading-page>
	</view>
</template>

<script>
import { basePath } from '../../public'
import form from '../../uni_modules/uview-ui/libs/config/props/form';
	export default {
		data() {
			return {
				testArr: [],
				ifNo: '',
				showLoading: false,
				allForm: [
					{
						repairNum: 1,
						partType: 0,
						partId: [],
						partNum: '',
						repairer: '',
						repairContent: ''
					}
				],
				repairerRange: [
					
				],
				ifFeeRange: [
					{ value: 1, text: '是' },
					{ value: 0, text: '否' }
				],
				deptList: [],
				submitForm: [],
				totalSub: {},
				id: '',
				taskId: '',
				maId: '',
				typeId: ''
			}
		},
		methods: {
			treeChange (e, index) {
				let that = this
				console.log(e, index);
			},
			addForm () {
				this.allForm.push({
					repairNum: 1,
					partType: 0,
					partId: [],
					partNum: '',
					repairer: '',
					repairContent: ''
				})
			},
			subForm () {
				let that = this
				this.submitForm = this.allForm
				for (let i = 0; i < this.submitForm.length; i++) {
					this.submitForm[i].partId = this.submitForm[i].partId[0]
				}
				console.log(this.submitForm);
				this.totalSub.partStrList = JSON.stringify(this.submitForm) 
				this.totalSub.id = this.id
				this.totalSub.taskId = this.taskId
				this.totalSub.maId = this.maId
				this.totalSub.typeId = this.typeId
				this.totalSub.companyId = uni.getStorageSync('userInfo').sysUser.companyId
				this.totalSub.userId = uni.getStorageSync('userInfo').userid
				this.totalSub.repairType = 1
				console.log(this.totalSub);
				this.showLoading = true
				that.$api.fix.submitFix(that.totalSub).then(res => {
					console.log(res);
					if (res.data.code == 200) {
						uni.showToast({
							icon: 'none',
							title: res.data.msg,
							success: () => {
								that.showLoading = false
								uni.navigateBack({
									delta: 2
								})
							}
						})
					} else {
						that.showLoading = false
						uni.showToast({
							icon: 'none',
							title: res.data.msg
						})
					}
				}).catch(err => {
					console.log(err);
				})
			},
			handleTree (data, id, parentId, children) {
			  let config = {
			    id: id || 'id',
			    parentId: parentId || 'parentId',
			    childrenList: children || 'children'
			  };
			
			  var childrenListMap = {};
			  var nodeIds = {};
			  var tree = [];
			
			  for (let d of data) {
			    let parentId = d[config.parentId];
			    if (childrenListMap[parentId] == null) {
			      childrenListMap[parentId] = [];
			    }
			    nodeIds[d[config.id]] = d;
			    childrenListMap[parentId].push(d);
			  }
			
			  for (let d of data) {
			    let parentId = d[config.parentId];
			    if (nodeIds[parentId] == null) {
			      tree.push(d);
			    }
			  }
			
			  for (let t of tree) {
			    adaptToChildrenList(t);
			  }
			
			  function adaptToChildrenList(o) {
			    if (childrenListMap[o[config.id]] !== null) {
			      o[config.childrenList] = childrenListMap[o[config.id]];
			    }
			    if (o[config.childrenList]) {
			      for (let c of o[config.childrenList]) {
			        adaptToChildrenList(c);
			      }
			    }
			  }
			  return tree;
			},
			veri (data) {
				let that = this
				if (!data || data.length <= 0) {
					return null;
				}
				return data.map(x => {
					/* let model
					if (x.id.includes('u')) {
						model = {
							name: x.name,
							id: x.userId,
						};
					} else {
						model = {
							name: x.name,
							id: x.id
						};
					} */
					const model = {
						name: x.paName,
						id: x.paId
					}
				    
				    const children = that.veri(x.children);
						
				    if (children) { 
					    model.children = children;
				    }
					
					return model;
				});
			}
		},
		onShow() {
			let that = this
			// 获取维修人员
			that.$api.fix.fixCrew().then(res => {
				console.log(res);
				if (res.data.code == 200) {
					that.repairerRange = res.data.data.map((item) => {
						return {
							text: item['nickName'],
							value: item['userId']
						}
					})
				}
			}).catch(err => {
				console.log(err);
			})
			// 获取配件树
			that.$api.fix.maList().then(res => {
				console.log(res);
				if (res.data.code == 200) {
					that.deptList = that.veri(that.handleTree(res.data.data, 'paId')) 
				}
				console.log(that.deptList);
			}).catch(err => {
				console.log(err);
			})
		},
		onLoad(params) {
			console.log(params);
			this.id = params.id
			this.taskId = params.taskId
			this.maId = params.maId
			this.typeId = params.typeId
			this.ifNo = params.ifNo
		}
	}
</script>

<style lang="scss">
	.form-area{
		width: 90%;
		margin: 2vh auto;
		.btn-area{
			width: 100%;
			display: flex;
			justify-content: space-around;
			align-items: center;
			margin: 3vh auto;
			view{
				box-sizing: border-box;
				padding: 15rpx 40rpx;
				border-radius: 15rpx;
				font-size: 14px;
			}
		}
	}
</style>