chuangte_bike_newxcx/page_fenbao/jiameng/addjiam.vue

<template>
	<view class="page">
		<u-navbar :title="tit" :border-bottom="false" :background="bgc" title-color='#000' back-icon-color="#000" title-size='36' height='50'></u-navbar>
        <view class="box">
        	<view class="title">
        		基本信息
        	</view>
			<view class="list">
				<view class="list_val" style="position: relative;">
					<view class="" style="padding-top:12rpx;width: 176rpx;">身份类型</view> <input @click="show = true" type="text" disabled="false" v-model="sheng" :placeholder="sheng" /> 
					<u-icon	name="arrow-down" style="position: absolute;top: 30%;right: 14rpx;" color="#808080"></u-icon>
					<u-select v-model="show" :list="arr" @confirm="confirm"></u-select>
				</view>
				<view class="list_val">
					<view class="" style="padding-top:12rpx">手机号码</view> <input type="text" v-model="tel" placeholder="请输入手机号码" />
				</view>
				<view class="list_val">
					<view class="" style="padding-top:12rpx">分成比例</view> <input type="text" v-model="bili" placeholder="请输入分成比例%" />
				</view>
				<view class="list_val">
					<view class="" style="padding-top:12rpx">备注</view> <input type="text" v-model="beizhu" placeholder="请输入备注" />
				</view>
			</view>
			<view class="baocun" @click="btncj">
				{{tit}}
			</view>
        </view>
	</view>
</template>
<script>
// import { number } from 'echarts'
	export default {
		data() {
			return {
				show:false,
				bgc: {
					backgroundColor: " #fff",
				},
				level:'',
				tel:'',
				sheng:'请选择身份类型',
				arr:[{ label: '加盟商', value: 1 },{ label: '合伙人', value: 2 }],
				tit:'创建加盟伙伴',
				userId:'',
				bili:'',
				beizhu:'',
				jiamtype:'',
				areaId:'',
				jiamid:''
			}
		},
		onLoad(option) {
			this.areaId = uni.getStorageSync('adminAreaid')
			if(option.item){
				this.tit = '编辑加盟伙伴'
				let obj = JSON.parse(option.item)
				this.tel = obj.userPhone
				this.areaId = obj.areaId
				this.bili = obj.point
				this.jiamid = obj.id
				this.beizhu = obj.remark
				this.jiamtype = obj.type
				if(obj.type == 1){
					this.sheng = '加盟商'
				}else{
					this.sheng = '合伙人'
				}
			}
		},
		methods: {
			confirm(e){
				this.sheng = e[0].label
				this.jiamtype = e[0].value
			},
			// 点击创建
			btncj(){
				if(this.tit == '创建加盟伙伴'){
					let data = {
						userPhone:this.tel,
						areaId:this.areaId,
						point:this.bili,
						type:this.jiamtype,
						remark:this.beizhu
					}
					this.$u.post(`/bst/areaJoin`,data).then(res => {
						if (res.code == 200) {
					       uni.showToast({
					       	title: '创建成功',
					       	icon: 'success',
					       	duration: 2000
					       })
						   setTimeout(()=>{
							   uni.navigateBack()
						   },2000)
						}else{
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000
							})
						}
					})
				}else{
					let data = {
						id:this.jiamid,
						userPhone:this.tel,
						areaId:this.areaId,
						point:this.bili,
						type:this.jiamtype,
						remark:this.beizhu
					}
					this.$u.put(`/bst/areaJoin`,data).then(res => {
						if (res.code == 200) {
					       uni.showToast({
					       	title: '编辑成功',
					       	icon: 'success',
					       	duration: 2000
					       })
						   setTimeout(()=>{
							   uni.navigateBack()
						   },2000)
						}else{
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000
							})
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	/deep/ .u-title,
	/deep/ .uicon-nav-back {
		padding-bottom: 22rpx;
	}
	.page {
		width: 750rpx;
		.box{
			width: 750rpx;
			height: 100%;
			overflow-y:scroll;
			background: #F4F5F7;
			border-radius: 0rpx 0rpx 0rpx 0rpx;
			padding: 32rpx 36rpx; 
			box-sizing: border-box;
			padding-bottom: 100rpx;
			.baocun{
				width: 584rpx; 
				height: 90rpx;
				margin: auto;
				background: linear-gradient( 270deg, #4C97E7 0%, #4C97E7 100%);
				border-radius: 54rpx 54rpx 54rpx 54rpx;
				margin-top: 110rpx;
				margin-bottom: 78rpx;
				font-weight: 500;
				font-size: 40rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 90rpx;
			}
			.swlist{
				margin-top: 34rpx;
				display: flex;
				justify-content: space-between;
				 flex-wrap: wrap;
				.swlist_val{
					display: flex;
					justify-content: space-between;
                    width: 324rpx;
                    height: 144rpx;
                    background: #FFFFFF;
                    border-radius: 24rpx 24rpx 24rpx 24rpx;		
					padding-top: 28rpx;
					padding-left: 38rpx;
					box-sizing: border-box;
					margin-top: 18rpx;
				}
				.lt{
					.one{
						font-size: 28rpx;
						color: #3D3D3D;
					}
					.two{
						font-size: 24rpx;
						color: #808080;
						margin-top: 12rpx;
					}
				}
				.rt{
					margin-top: 24rpx;
					padding-right: 12rpx;
				}
			}
			.title{
				font-size: 32rpx;
				color: #3D3D3D;
			}
			.list{
				    width: 680rpx;
				    max-height: 578rpx;
				    background: #FFFFFF;
				    border-radius: 24rpx 24rpx 24rpx 24rpx;
				    padding: 46rpx 36rpx;
				    box-sizing: border-box;
				    margin-top: 34rpx;
				    margin-bottom: 47rpx;
			    .list_val{
					display: flex;
					font-size: 32rpx;
					color: #3D3D3D;
					justify-content: space-between;
					margin-bottom: 32rpx;
					input{
						width: 430rpx;
						height: 70rpx;
						background: #F0F0F0;
						border-radius: 12rpx 12rpx 12rpx 12rpx;
						padding-left: 32rpx;
						box-sizing: border-box;
						font-size: 28rpx;
						color: #808080;
					}
				}
			}
		}
	}
</style>