wangluohuoyun-app/pages/riders/addFleet.vue

<template>
	<view class="center">
		
		<view class="flex row form_css">
			<view class="left-text">车队名称</view>
			<view class="right-text">
				<u--input placeholder="输入车队名称,4-15个字" inputAlign='left' border="none"  v-model="formData.fleetName">
				</u--input>
			</view>
		</view>
		<view class="flex row form_css">
			<view class="left-text">发货城市</view>
			<view class="right-text">
				<!-- <regionPicker :multiIndex_="selections1" @region_="regionChange1" custom_="请选择"
					@selecteRegion_="selecteRegion1" title_="全国" /> -->
				<view @click="show = true">{{title1 ? title1 : "请选择地址"}}</view>
				<Linkage @conceal="conceal1" class="flex" v-if="show" ref="uDropdown"></Linkage>
			</view>
		</view>
		<view class="flex row form_css">
			<view class="left-text">邀请权限</view>
			<view class="right-text">
				<u-radio-group v-model="formData.invitationPermission">
					<u-radio key="1" label="所有队员" name="1"></u-radio>
					<u-radio key="2" label="仅队长" name="2"></u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="row">
			<view class="left-text">车队简介</view>
			<u--textarea v-model="formData.fleetProfile" placeholder="请输入内容" ></u--textarea>
		</view>
		<view class=" row ">
			<view class="left-text">封面照片</view>
			<u-upload class="uview-upload" :fileList="fileList1" @afterRead="afterRead($event)" @delete="deletePic"
				name="1" multiple :maxCount="1"></u-upload>
		</view>
		<view class=" row ">
			<view class="left-text">车队照片</view>
			<u-upload class="uview-upload" :fileList="fileList2" @afterRead="afterRead1($event)" @delete="deletePic"
				name="2" multiple :maxCount="9" style="z-index: 9999;"></u-upload>
		</view>
			<u-toast ref="uToast"></u-toast>
		<u-button type="primary" @click="submit">提交</u-button>
		
	</view>
</template>

<script>
	import Linkage from '@/components/gaojianghua-linkage/linkage.vue'
	import uploadImage from '@/components/ossutil/uploadFile.js';
	export default{
		components: {
			Linkage
		},
		data(){
			return{
				formData:{
					fleetMemberInfo:{},
					invitationPermission:1,
				},
				show:false,
				title1:"",
				fileList1: [],
				fileList2:[]
			}
		},
		onShow(){
			
		},
		onLoad(){
			
		},
		methods:{
			radioChange(){
				debugger
				console.log(this.invitationPermission)
			},
			conceal1(param) {
				const {
					chooseprovince,
					choosecity,
					choosearea
				} = param
				// 获取到传过来的 省 市 区 县数据
				this.formData.province = chooseprovince
				this.formData.city = choosecity == '全部' ? "" : choosecity
				this.formData.area = choosearea == '全部' ? "" : choosearea
				this.title1 = chooseprovince + choosecity + choosearea
				if (chooseprovince == '全国') {
					this.succeed()
				}
				if (choosecity == '全部') {
					this.succeed()
				} else if (choosearea != '') {
					this.succeed()
				}
			},
			succeed() {
				// this.$refs.uDropdown.close();
				this.show = false
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 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++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				uploadImage('image',url, 'appData/',
					result => {
						// 上传成功回调函数
						if(this.formData.coverUrl){
							this.formData.coverUrl = this.formData.coverUrl+','+ result
						}else{
							this.formData.coverUrl = result
						}
						
					}
				)
			},
			// 新增图片
			async afterRead1(event) {
				// 当设置 mutiple 为 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++) {
					const result = await this.uploadFilePromise1(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise1(url) {
				uploadImage('image',url, 'appData/',
					result => {
						// 上传成功回调函数
						if(this.formData.fleetUrl){
							this.formData.fleetUrl = this.formData.fleetUrl+','+ result
						}else{
							this.formData.fleetUrl = result
						}
					}
				)
			},
			submit(){
				this.formData.fleetMemberInfo.commonId = uni.getStorageSync("firstAuthentication").id
				this.formData.fleetMemberInfo.driverNickname = uni.getStorageSync("firstAuthentication").driverCall
				this.formData.fleetMemberInfo.driverPortrait = uni.getStorageSync("userInfo").avatarUrl
				this.$request.baseRequest('post', '/fleetInfo/api/addFleetInfo', this.formData).then(res => {
						if (res.code == 200) {
							this.$refs.uToast.show({
								type: 'success',
								message: "车队添加成功！",
								complete() {
									uni.$u.route("pages/riders/myTeam")
								}
							})
						
						}
					})
					.catch(res => {
						uni.$u.toast(res.message);
					});
			}
		}
	}
</script>

<style lang="scss">
	.form_data{
		// padding: 30rpx;
	}
	.form_css {
		width: 100%;
		display: flex;
		margin: 20rpx 0;
		height: 60rpx;
		border-bottom: 1px solid #eeeeee;
	
		.left-text {
			width: 50%;
			text-align: left;
		}
	
		.right-text {
			width: 50%;
			justify-content: flex-end;
			display: flex;
			text-align: right;
		}
	}
</style>