caimei-applets-caimei/supplier/pages/user/information.vue

<template name='information'>
	<view class="container">
		<view class="wrap-info">
			<view class="row">
				<view class="info-title">基本信息</view>
			</view>
			<view class="info-from">
				<view class="label">公司名称</view>
				<input class="row-input" type="text"  v-model="params.name" placeholder="请与营业执照的注册名称保持一致" maxlength="30"/>
			</view>
			<view class="info-from">
				<view class="label">公司简称</view>
				<input class="row-input" type="text" v-model="params.sname"placeholder="请输入公司简称" maxlength="10"/>
			</view>
			<view class="info-from">
				<view class="label">公司地址</view>
				<view class="row-input" @click="showMulLinkageThreePicker">
					 <text :class="addressData.address === '请选择公司所在地区' ? 'none' : ''">
					 	{{addressData.address}}
					 </text>	
					 <text class="iconfont icon-xiayibu"></text>
				</view> 
			</view>
			<textarea value="" v-model="addressData.addressDetail"  placeholder="请填写详细地址，如街道/小区/门牌等" maxlength="50" class="address-details"/>
			<view class="info-from">
				<view class="label">联系人</view>
				<input class="row-input"  v-model="params.linkMan" type="text" placeholder="请输入联系人姓名" maxlength="6"/>
			</view>
			<view class="info-from">
				<view class="label">邮箱</view>
				<input class="row-input" v-model="params.email" type="text" placeholder="请输入邮箱地址 " maxlength="6"/>
			</view>
			 <text class="info-email">邮箱可用作登录账号，请使用公司邮箱或法人邮箱</text>
			<view class="info-from">
				<view class="label">固定电话</view>
				<input class="row-input" v-model="params.contractPhone" type="text" placeholder="请在号码前加区 " maxlength="11"/>
			</view>
			<view class="info-from">
				<view class="label">传真</view>
				<input class="row-input" v-model="params.fax" type="text" placeholder="请输入公司传真号 " />
			</view>
			<view class="info-from">
				<view class="label">法人代表</view>
				<input class="row-input" v-model="params.legalPerson" type="text" placeholder="请输入公司法人代表姓名 " maxlength="6"/>
			</view>
			<view class="info-from">
				<view class="label">注册资本</view>
				<input class="row-input"  v-model="params.registeredCapital" type="text" placeholder="请填写公司注册资本 " />
			</view>
			<view class="info-from">
				<view class="label">公司性质</view>
				<input class="row-input" v-model="params.nature" type="text" placeholder="请填写公司性质 " />
			</view>
			<view class="info-from">
				<view class="label">年营业额</view>
				<input class="row-input" v-model="params.turnover" type="text" placeholder="请输入公司年营业额  " />
			</view>
		</view>
		
		<view class="wrap-content">
			<view class="row">
				<view class="info-title">经营信息</view>	
			</view>
			<view class="info-from" style="border: 0;">
				<view class="label">公司类型</view>
				<view class="row-input ShopTyperadio">
				 <radio-group @change="radioChange">
					 <label class="radio" v-for="(item, index) in typename" :key="item.value">
						 <radio :value="item.value" :checked="item.value === params.firstShopType" color='#E15616'/>{{item.name}}
					 </label>
				 </radio-group>
				 </view>
			</view>
			<view class="secondTyperadio"  v-if="isfirstShow" >
				 <view class="radio" v-for="(item,index) in secondtype" :key="index" @click="secondypeRidio(item)" :class="item.value==params.secondShopType?'active':''">
				 	<view class="secondRadio" >{{item.name}}</view>
				 </view>
			</view>
			<view class="zizhi" v-if="issecondshow">
				<view class="info2-title zizhi-title">资质</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.medicalPracticeLicenseImg1!=''">
						   <image class="upload-img" :src="params.medicalPracticeLicenseImg1" alt="" ></image>
						   <view class="iconfont icon-shanchu1" @click="deleteMedicalImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadzizhiImageFn" v-else>
						   <view class="file-zizhi"></view>
					  </view>
					  <view class="form-upload-tips">
						  <text class="iconfont icon-wenhao"></text>
						  <view class="wen-tips">点击图片可放大图片</view>
					  </view>
				</view>
			</view>
			<view class="business">
				<view class="info2-title business-title">主营内容</view>
				<view class="business-info">
					 <checkbox-group class="row-group" @change="chooseMaleLike">
								<label class="diyBox" v-for="(item, index) in mentuzCampList" :key="item.value" >
									<checkbox :value="item.value" :checked="item.checked"></checkbox>
									<view class="row-text">{{item.name}}</view>
								</label>
					 </checkbox-group>
					 <view class="addbusiness">
					 	<input class="row-input other" type="text" placeholder="请输入自定义项目"  v-model="mainProEdit" maxlength="5"/>
					 	<button type="default" class="button" @click.stop="mainProAdd">确认添加</button>
					 </view>
				</view>
			</view>
			<view class="business">
				<view class="info2-title business-title">经营范围</view>
				<view class="business-info">
					   <checkbox-group class="row-group" @change="chooseMaleLikes">
							<label class="row-input" v-for="(item, index) in medicaCampList" :key="item.value" >
								<checkbox :value="item.value" :checked="item.checked" ></checkbox>
								<view class="row-text">{{item.name}}</view>
							</label>
					   </checkbox-group>
					 <view class="addbusiness">
					 	<input class="row-input other" type="text" placeholder="请输入自定义经营范围" v-model="shopScopeEdit" maxlength="5"/>
					 	<button type="default" class="button" @click.stop="shopScopeAdd">确认添加</button>
					 </view>
				</view>
			</view>
			<view class="info">
				<view class="info2-title">公司介绍</view>
				 <textarea  v-model="params.info"  maxlength="2000" placeholder="公司简介会在公司介绍页面展示，有助于机构更好的了解您， 建议从个人规模、代理产品、机构服务、荣誉资质这4方面进行介绍" name="textarea"/>
			</view>
			<view class="info">
				<view class="info2-title">主打系列商品说明</view>
				 <textarea placeholder="请输入主打系列商品说明" v-model="params.productDesc" maxlength="500" name="textarea"/>
			</view>
		</view>
		
		<view class="wrap-image">
			<view class="row">
				<view class="info-title">资质证明</view>
			</view>
			<view class="info-from">
				<view class="label Code">营业执照编号</view>
				<input class="row-input Code" v-model.trim="params.socialCreditCode" type="text" placeholder="请输入公司营业执照编号" maxlength="18"/>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title">营业执照图片</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.businessLicenseImage!=''">
						   <image class="upload-img" :src="params.businessLicenseImage" @click="showViewerImageFn()" ></image>
						   <view class="iconfont icon-shanchu1" @click="deleteBusinessImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadBusinessLicenseImageFn" v-else>
						   <view class="file-biss iconImage"></view>
					  </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title">公司LOGO</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.logo!=''">
						   <image class="upload-img" :src="params.logo" alt="" @click="showViewerImageFn1()"></image>
						   <view class="iconfont icon-shanchu1"  @click="deletelogoImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadlogoImageFn" v-else>
						   <view class="file-logo iconImage"></view>
					  </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title">生产许可证</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.productionLicence!=''">
						   <image class="upload-img" :src="params.productionLicence" alt="" @click="showViewerImageFn2()"></image>
						   <view class="iconfont icon-shanchu1" @click="deleteproducImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadproductionLicenceImageFn" v-else>
						   <view class="file-produce iconImage"></view>
					  </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title">卫生许可证</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.hygienicLicense!=''">
						   <image class="upload-img" :src="params.hygienicLicense" alt="" @click="showViewerImageFn3()"></image>
						   <view class="iconfont icon-shanchu1" @click="deletehygienicImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadhygienicLicenseImageFn" v-else>
						   <view class="file-health iconImage"></view>
					  </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title">税务许可证</view>
				<view class="uploadImage">
					 <view class="form-upload-image"  v-if="params.taxLicense!=''">
						   <image class="upload-img" :src="params.taxLicense" alt="" @click="showViewerImageFn4()"></image>
						   <view class="iconfont icon-shanchu1" @click="deletaxImage()"></view>
					 </view>
					 <view class="formLine-file" @click="uploadtaxLicenseImageFn" v-else>
						   <view class="file-tax iconImage"></view>
					  </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title hoor">荣誉证书</view>
				<view class="uploadImage list-image">
					<view class="formLine-file" @click="uploadHonorImageFn" v-if="HonorImagesList.length<5" >
							<view class="file-honor iconImage"></view>
					 </view>
					 <view class="form-upload-image" v-for="(item, index) in HonorImagesList" :key="index">
						   <image class="upload-img" :src="item" alt="" @click="showViewerImageFn5()"></image>
						   <view class="iconfont icon-shanchu1" @click="removeGoodsImagesFn(HonorImagesList)"></view>
					 </view>
				</view>
			</view>
			<view class="zizhi">
				<view class="info2-title zizhi-title hoor">产品证书</view>
				<view class="uploadImage list-image">
					<view class="formLine-file" @click="uploadproductImageFn" v-if="productImagesList.length<5" >
							<view class="file-product iconImage"></view>
					 </view>
					 <view class="form-upload-image" v-for="(item, index) in productImagesList" :key="index">
						   <image class="upload-img" :src="item" alt="" @click="showViewerImageFn6()"></image>
						   <view class="iconfont icon-shanchu1" @click="removeproductImagesFn(index)"></view>
					 </view>
				</view>
			</view>
		</view>
		<view class="wrap-Btn">
			<button type="default" class="confirmBbtn" @click="shopSubmit">确定</button>
		</view>
		<mpvue-city-picker :themeColor="themeColor"
							ref="mpvueCityPicker" 
						    :pickerValueDefault="cityPickerValueDefault"
							@onCancel="onCancel" 
							@onConfirm="onConfirm">
		</mpvue-city-picker>
	</view>
</template>

<script>
	import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
	import { uploadFileImage } from "@/api/utils.js"
	import { mapState,mapMutations } from 'vuex';
	export default{
		name:'information',
		components:{
			mpvueCityPicker,
		},
		data(){
			return{
				isShowInput:false,
				firsttype:0,
				secontype:0,
				isfirstShow:false,
				issecondshow:false,
				addressData:{
					address:'请选择公司所在地区',
					townID:'',			//区ID
					cityID:'',			//区ID
					provinceID:'',		//区ID
					addressDetail: '',	//地址
				},
				typename:[
					{name:'医疗',value:'1'},
					{name:'非医疗',value:'2'}
				],
				secondtype:[
					{name:'一类器械',value:'1'},
					{name:'二类器械',value:'2'},
					{name:'三类器械',value:'3'},
					{name:'其它',value:'4'}
				],
				mentuzCampNullList:[
					{value:'1',name:'产品'},
					{value:'2',name:'仪器'},
					{value:'3',name:'服务'}
				],
				medicaCampNullList:[
					{value:'1',name:'仪器护理类'},
					{value:'2',name:'护肤品类'},
					{value:'3',name:'纹绣类'},
					{value:'4',name:'美体内衣'},
					{value:'5',name:'整形耗材'},
					{value:'6',name:'国际品牌'},
					{value:'7',name:'美胸类'},
					{value:'8',name:'健康保健类'},
					{value:'9',name:'面膜类'},
					{value:'10',name:'抗衰老'},
					{value:'11',name:'生殖保养'},
					{value:'12',name:'健康养生'},
					{value:'13',name:'纤体减肥'}
				],
				params:{
					userID:'',
					shopID:'',
					townID:'',
					provinceID: '',//省id
					cityID: '',
					address:'',
					name:'',//公司名称
					sname:'',//公司简称
					linkMan:'',//联系人
					email:'',//
					contractPhone:'',//固定电话
					fax:'',//传真
					legalPerson:'',//法人代表
					registeredCapital:'',//注册资本
					nature:'',//公司性质
					turnover:'',//年营业额
					firstShopType:'',//公司类型 1医疗  2非医疗
					secondShopType:'',//医疗下的二级分类
					medicalPracticeLicenseImg1:'',//资质
					mainpro:'',//主营产品
					businessScope:'',//经营内容
					info:'',//公司介绍
					productDesc:'',//主打说明
					medicalPracticeLicenseImg1:'',//三级器械/医疗执照
					socialCreditCode:'',//营业执照编号
					businessLicenseImage:'',//营业执照
					logo:'',//公司logo
					productionLicence:'',//生产
					hygienicLicense:'',//卫生
					taxLicense:'',//税务
					certificateHonor:'',//荣誉
					productCertification:'',//产品
				},
				mentuzCampList:[],
				medicaCampList:[],
				shopMainPros:[],
				shopScope:[],
				mainProEdit: '',
				shopScopeEdit:'',
				HonorImagesList:[],
				productImagesList:[],
				isPreviewImage:false,   	//预览图片开关
				isMainproCheck:false,
			}
		},
		onLoad() {
			this.$api.getComStorage('userInfo').then((resolve) =>{
				this.params.userID = resolve.userID;
				this.params.shopID = resolve.shopID;
			})
			this.shopInfo();
		},
		methods:{
			chooseMaleLike(e){
				this.isMainproCheck = true
				this.params.mainpro = this.checkLikes(e,this.mentuzCampList)
			},
			chooseMaleLikes(e){
				this.isMainproCheck = true
				this.params.businessScope = this.checkLikes(e,this.medicaCampList)
			},
			checkLikes(e,list){
				let	values = e.detail.value;
				console.log(values)
				let arr = []
				list.forEach(item => {
					if(values.includes(item.value)){
						this.$set(item,'checked',true)
						arr.push(item.name)
					}else{
						this.$set(item,'checked',false)
					}
				})
				return arr.join('/')
			},
			setNewMainpro(arr){//回显处理主营内容
				let _ARRAY = [];
				arr.split('/').forEach((item,index) =>{
					if(item != ""){
						let _OBJ = {value:(index+1).toString(),name:item,checked:true}
						_ARRAY.push(_OBJ)
					}
				})
				return _ARRAY
			},
		  shopInfo(){
			  // this.$api.getStorage().then((resolve) =>{
				  this.ShopService.shopInfo({userId:10450}).then(response =>{
					if(response.code==0){
						console.log(response)
						let shop = response.data.shop;
						let user = response.data.user;
						this.params.name = shop.name;
						this.params.sname = shop.sname;
						this.params.linkMan = shop.linkMan;
						this.params.email = user.email;
						this.addressData.addressDetail = shop.provincialAddress;
						this.addressData.provinceID = shop.provinceID;
						this.addressData.cityID = shop.cityID;
						this.addressData.townID = shop.townID;
						this.params.contractPhone = shop.contractPhone;
						this.params.fax = shop.fax;
						this.params.legalPerson = shop.legalPerson;
						this.params.registeredCapital = shop.registeredCapital;
						this.params.nature = shop.nature;
						this.params.turnover = shop.turnover;
						this.params.firstShopType = shop.firstShopType;
						this.params.secondShopType = shop.secondShopType;
						this.params.medicalPracticeLicenseImg1 = shop.medicalPracticeLicenseImg1;
						this.params.info = shop.info;
						this.params.productDesc = shop.productDesc;
						this.params.socialCreditCode = shop.socialCreditCode;
						this.params.businessLicenseImage = shop.businessLicenseImage;
						this.params.logo = shop.logo;
						this.params.productionLicence = shop.productionLicence;
						this.params.hygienicLicense = shop.hygienicLicense;
						this.params.taxLicense = shop.taxLicense;
						this.params.certificateHonor = shop.hygienicLicense;
						this.HonorImagesList = response.data.certificateHonor;
						this.productImagesList = response.data.productCertification;
						if(shop.mainpro == "" || shop.mainpro == null){
							this.mentuzCampList = this.mentuzCampNullList
						}else{
							this.mentuzCampList = this.setNewMainpro(shop.mainpro)
						}
						if(shop.businessScope == "" || shop.businessScope == null){
								this.medicaCampList = this.medicaCampNullList
						}else{
							this.medicaCampList = this.setNewMainpro(shop.businessScope)
						}
					}
				 })
				 // })
			 },
			shopSubmit(){//提交修改
				console.log(this.params);
				if(this.params.name==''){
					this.$util.msg('请输入公司名称',2000);
					return
				}else if(this.params.townID==''){
					this.$util.msg('请选择联系地址',2000);
					return
				}else if(this.params.address==''){
					this.$util.msg('请输入正确的联系地址',2000);
					return
				}else if(this.params.linkMan==''){
					this.$util.msg('请输入正确的联系人姓名',2000);
					return
				}else if(this.params.legalPerson==''){
					this.$util.msg('请输入法人代表姓名',2000);
					return
				}else if(this.params.registeredCapital==''){
					this.$util.msg('请输入注册资本',2000);
					return
				}else if(this.params.nature==''){
					this.$util.msg('请输入公司性质',2000);
					return
				}else if(this.params.turnover==''){
					this.$util.msg('请输入年营业额',2000);
					return
				}else if(this.params.firstShopType==''){
					this.$util.msg('请选择公司类型',2000);
					return
				}else if(this.params.firstShopType==1){
					if(this.params.secondShopType==""){
						this.$util.msg('请选择公司类型',2000);
						return
					}
				}else if(this.params.info==''){
					this.$util.msg('请填写公司介绍',2000);
					return
				}else if(this.params.productDesc==''){
					this.$util.msg('请填系列商品说明',2000);
					return
				}else if(this.params.socialCreditCode==''){
					this.$util.msg('请输入正确的统一社会信用代码',2000);
					return
				}else if(this.params.businessLicenseImage==''){
					this.$util.msg('请上传营业执照图片',2000);
					return
				}else if(this.params.logo==''){
					this.$util.msg('请上传公司logo',2000);
					return
				}else if(this.params.productionLicence==''){
					this.$util.msg('请上传生产许可证',2000);
					return
				}else if(this.params.hygienicLicense==''){
					this.$util.msg('请上传卫生许可证',2000);
					return
				}else if(this.params.taxLicense==''){
					this.$util.msg('请上传税务许可证',2000);
					return
				}else if(this.params.certificateHonor==''){
					this.$util.msg('请上传荣誉证书',2000);
					return
				}else if(this.params.productCertification==''){
					this.$util.msg('请上传产品证书',2000);
					return
				}else{
					this.ShopService.modifiedData(this.params).then(res=>{
						 console.log(res)
						  if(res.code === 0){
							  this.$util.msg('修改成功',2000,true,'success')
							  setTimeout(()=>{
								uni.navigateBack();
							  },2000)
						} else {
							this.$util.msg(res.msg,2000);
							this.loginLoading = false;
						}
					})
				}
			},
			 mainProAdd(){//添加主营内容
					if (this.mainProEdit.length>0) {
						let obj = {name:this.mainProEdit,value:`${this.mentuzCampList.length+1}`};
						if(this.checkedArray(this.mainProEdit,this.mentuzCampList)){
							this.$util.msg('主营内容已存在!',2000)
						}else {
							this.mentuzCampList.push(obj);
						}
					}
				},
			shopScopeAdd(){ //经营内容
				if (this.shopScopeEdit.length>0) {
					let obj = {name:this.shopScopeEdit,value:`${this.medicaCampList.length+1}`};
					if(this.checkedArray(this.shopScopeEdit,this.medicaCampList)){
						this.$util.msg('主营内容已存在!',2000)
					}else {
						this.medicaCampList.push(obj);
						
					}
				}
			},
			 checkedArray(content,arr){//判断主营内容是否已存在
			 console.log(content,arr)
						 for(var i in arr){
								if(arr[i].name == content){
									return true;
								}
							}
			            return false;
			        },
			radioChange(e){
				this.params.firstShopType = e.target.value;
				if (e.target.value==1){
					this.isfirstShow = true;
				}else {
					this.isfirstShow = false;
				}
				console.log(e.target.value)
			},
			showViewerImageFn6(e) {//预览产品
				this.myPreviewImageFnlist(this.productImagesList)
			},
			showViewerImageFn5(e) {//预览荣誉
				this.myPreviewImageFnlist(this.HonorImagesList)
			},
			showViewerImageFn4(e) {//预览税务
				this.myPreviewImageFn(this.params.taxLicense)
			},
			showViewerImageFn3(e) {//预览卫生
				this.myPreviewImageFn(this.params.hygienicLicense)
			},
			showViewerImageFn2(e) {//预览生产
				this.myPreviewImageFn(this.params.productionLicence)
			},
			showViewerImageFn1(e) {//预览logo
				this.myPreviewImageFn(this.params.logo)
			},
			showViewerImageFn(e) {//预览营业执照
				this.myPreviewImageFn(this.params.businessLicenseImage)
			},
			myPreviewImageFnlist(arr){//多张预览
				this.isPreviewImage = true;
				uni.previewImage({
					urls: arr,
					current: 0
				})
				},
			myPreviewImageFn(url){//单张预览
				this.isPreviewImage = true
				let mentuzArray = []
				mentuzArray.push(url)
				uni.previewImage({
					urls: mentuzArray,
					current: 0
				});
			},
			uploadproductImageFn(event){//产品证书
					 uploadFileImage().then(res =>{
						 this.productImagesList.push(JSON.parse(res.data).data);
						 this.params.productCertification =this.productImagesList.toString()+',';
					 })
			       },
			 uploadHonorImageFn(event){//荣誉证书上传
					 uploadFileImage().then(res =>{
						 this.HonorImagesList.push(JSON.parse(res.data).data);
						 this.params.certificateHonor =this.HonorImagesList.toString()+',';
					 })
			        },
			 uploadlogoImageFn(event){//上传公司logo
					uploadFileImage().then(res =>{
						this.params.logo = JSON.parse(res.data).data;
					})
			},
			uploadproductionLicenceImageFn(event){//上传生产
					uploadFileImage().then(res =>{
						this.params.productionLicence = JSON.parse(res.data).data;
					})
			},
			 uploadhygienicLicenseImageFn(event){//上传卫生
					uploadFileImage().then(res =>{
						this.params.hygienicLicense = JSON.parse(res.data).data;
					})
			},
			 uploadtaxLicenseImageFn(event){//上传税务
				   uploadFileImage().then(res =>{
					this.params.taxLicense = JSON.parse(res.data).data;
				   })
			},
			uploadBusinessLicenseImageFn(event){//上传营业执照图片
					uploadFileImage().then(res =>{
						this.params.businessLicenseImage = JSON.parse(res.data).data;
					})
			},
			uploadzizhiImageFn(event){//上传医疗图片
					uploadFileImage().then(res =>{
						this.params.medicalPracticeLicenseImg1 = JSON.parse(res.data).data;
					})
			},
			 removeGoodsImagesFn(index){//删除荣誉图片
					this.HonorImagesList.splice(index,1);
					this.params.certificateHonor = this.HonorImagesList.toString()+',';
				 },
			removeproductImagesFn(index){//删除产品图片
				this.productImagesList.splice(index,1);
				this.params.productCertification = this.productImagesList.toString()+',';
			 },
			deletaxImage(){//删除卫生
			      this.params.taxLicense = '';
			   },
			 deletehygienicImage(){//删除卫生
				this.params.hygienicLicense = '';
			},
			deleteproducImage(){//删除生产
				this.params.productionLicence = '';
			},
			 deletelogoImage(){//删除logo图片
				this.params.logo = '';
			},
			 deleteBusinessImage(){//删除营业执照图片
				this.params.businessLicenseImage = '';
			},
			 deleteMedicalImage(){//删除商品图片
			   this.medicalPracticeLicenseImg1 = '';
			 },
			secondypeRidio(item){
				this.params.secondShopType = item.value;
				if (item.value==3){
				this.issecondshow = true;
				}else {
				 this.issecondshow = false;
				}
			},
			showMulLinkageThreePicker() {//三级地址联动
				this.isShowInput = true
				this.$refs.mpvueCityPicker.show()
				},
			onConfirm(e) {//获取选择的地址信息
				console.log('地址',e);
				this.addressData.address = e.name;
				this.addressData.townID = e.townCode;
				this.addressData.cityID = e.cityCode;
				this.addressData.provinceID = e.provinceCode;
				this.params.townID = this.addressData.townID;
				this.params.provinceID = this.addressData.provinceID;
				this.params.cityID = this.addressData.cityID;
				this.params.address = this.addressData.address;
			},
			onConfirmbrand(e){
				this.brandname = e.name;
			},
		},
	}
</script>

<style  lang="scss">
	.row{
		line-height: 80rpx;
		background: #f7f7f7;
		padding: 0 24rpx;
		.info-title{
			font-size: $font-size-30;
			color: $text-color;
			font-weight: bold;
		}
	}
	.info-from{
		width: 702rpx;
		height: 90rpx;
		line-height: 90rpx;
		border-bottom: 2rpx solid #e1e1e1;
		margin: auto;
		position: relative;
		.label{
			width: 112rpx;
			text-align: left;
			font-size: $font-size-28;
			color: #666666;
			line-height: 90rpx;
			float: left;
			&.Code{
				width: 170rpx;
			}
		}
		.row-input{
			width: 520rpx;
			padding-left:10rpx;
			font-size: $font-size-28;
			color: $text-color;
			line-height: 90rpx;
			float: left;
			height: 90rpx;
			margin-left: 50rpx;
			&.Code{
				width: 470rpx;
			}
			.icon-xiayibu{
				position: absolute;
				right: 0;
				color: #b2b2b2;
			}
			.none{
				color: #b2b2b2;
			}
		}
	}
	.address-details{
		height: 146rpx;
		border-bottom: 2rpx solid #e1e1e1;
		width: 702rpx;
		margin: auto;
		font-size: $font-size-28;
		padding-top: 20rpx;
	}
	 input[type="text"]::placeholder,textarea::placeholder {color: #b2b2b2;font-size: $font-size-28;}
	 .info-email{
		 color: #fea785;
		 font-size: $font-size-20;
		 padding-left: 24rpx ;
	 }
	 .ShopTyperadio{
		 overflow: hidden;
		 height: auto;
		 border: 0;
		 .radio{
			 float: left;
			 margin-right: 77rpx;
			 .iconfont{
				 margin-right: 10rpx;
				 font-size: $font-size-36;
			 }
			 .icon-weixuanze{
				 color: #b2b2b2;
			 }
			 .icon-yixuanze{
				  color: $color-system;
			 }
		 }
	 }
	 .active{
		 color: $color-system;
	 }
	 .secondTyperadio{
		 overflow: hidden;
		 height: auto;
		 padding: 0 24rpx;
		 margin-bottom: 20rpx;
		 color: #999999;
		 .radio{
				float: left;
				margin-right: 20rpx;
				.secondRadio{
					 border: 2rpx solid #e1e1e1;
					 padding: 0 30rpx;
					 text-align: center;
					 line-height: 42rpx;
					 font-size: $font-size-26;
					 border-radius: 21rpx;
				}
			}
	 }
	 .zizhi{
		 .uploadImage{
			 padding: 0 24rpx;
			 &.list-image{
				 overflow: hidden;
				 display: flex;
				 overflow-x: auto;
				 padding-top: 20rpx;
				 .formLine-file{
					 float: left;
				 }
				 .form-upload-image{
					  float: left;
					  -webkit-flex-shrink: 0;
					  flex-shrink: 0;
					  position: relative;
					  display: inline-block;
					  margin: 0 15rpx;
				 }
			 }
			 .form-upload-image{
				 width: 256rpx;
				 height:180rpx; 
				 position: relative;
				 .upload-img{
					 width: 100%;
					 height: 100%;
				 }
				 .icon-shanchu1{
					position: absolute;
					top: -20rpx;
					right:-15rpx;
					color: #f94b4b;
					font-size: $font-size-36;
				}
			 }
			 .formLine-file{
					width: 270rpx;
					height: 200rpx;
					display: inline-block;
				 .file-zizhi{
					background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-zizhi.png') no-repeat;
					width: 270rpx;
					height: 200rpx;
				 }
				 .iconImage{
					width: 256rpx;
					height:180rpx; 
					&.file-biss{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-business(1).png') no-repeat;
						}
					&.file-logo{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-logo.png') no-repeat;
						}
					&.file-produce{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-produce.png') no-repeat;
						}
					&.file-health{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-health.png') no-repeat;
						}
					&.file-tax{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-tax.png') no-repeat;
						}
					&.file-honor{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-honor.png') no-repeat;
						}
					&.file-product{
						background: url('https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/icon-product.png') no-repeat;
						}
						
				 }
			 }
			 .form-upload-tips{
				 display: inline-block;
				 vertical-align: top;
				 position: relative;

				 .icon-wenhao{
					font-size: 41rpx;
					 color:#1890f9 ;
				 }
				 .wen-tips{
						width: 360rpx;
					     height: 64rpx;
					     line-height: 64rpx;
					     text-align: center;
					     color: #FFF;
					     font-size: 28rpx;
					     background-color: #1890f9;
					     position: absolute;
					     bottom: -80rpx;
					     left: -4rpx;
					     border-radius: 2rpx;
						 display: none ;
				 }
				 .wen-tips:before {
				     content: '';
				     width: 0px;
				     height: 0px;
				     border-width: 20rpx;
				     border-style: solid;
				     border-color: transparent transparent #1890f9 transparent;
				     position: absolute;
				     top: -35rpx;
				     left: 10rpx;
				 }
				 .form-upload-tips:hover .wen-tips{display: block;}
			 }
		 }
	 }
	 .business{overflow: hidden;}
	 .business-info{
		 float: left;
		 margin-left: 60rpx;
		 width: 550rpx;
		 }
	 .info2-title{
	 	padding: 0 0 24rpx 24rpx;
	 	font-size: $font-size-28;
	 	color: #666666;
		&.zizhi-title{
			padding: 24rpx;	
			 &.hoor{padding: 24rpx 24rpx 0 24rpx;}
			 }
			 &.business-title{
			 float: left;
		 }
		 
	 }
	 .addbusiness{
		 margin: 20rpx 0;
		 .other{
			 width: 350rpx;
			 height: 64rpx;
			 border: 2rpx solid #b2b2b2;
			 border-radius: 45rpx;
			 text-align: center;
			 line-height: 64rpx;
			 padding-left: 10rpx;
			 font-size: 28rpx;
			 display: inline-block;
		 }
		 .button{
			 width: 160rpx;
			 height: 64rpx;
			 text-align: center;
			 line-height: 64rpx;
			 display: inline-block;
			 color: $color-system;
			 background:#ffe6dc ;
			 margin-left: 15rpx;
			 border-radius: 45rpx;
		 }
	 }
	 .row-group{
		 .row-text{
		 	display: inline-block;
			font-size: 28rpx;
			color: #333333;
		 }
		 .row-input{
			width: 50%;
			display: inline-block;
			margin-bottom: 10rpx;
		 }
		 .diyBox{
			margin-bottom: 5px;
			// width: 33%;
			margin-right: 70rpx;
			display: inline-block;
		 }
		 
	 }
	 radio .wx-radio-input{
		 border-radius: 50%;
		 width: 36rpx; 
		 height: 36rpx;
	 }
	 checkbox .wx-checkbox-input{
	   border-radius: 50%;
	   width: 36rpx; 
	   height: 36rpx;
	 }
	 /* 选中后的 背景样式 */
	 checkbox .wx-checkbox-input.wx-checkbox-input-checked{
	   background: #E15616;
	 }
	 checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
	   border-radius: 50%;
	    border: 2rpx solid #e15616;
	   width: 36rpx;
	   height: 36rpx;
	   line-height: 36rpx;
	   text-align: center;
	   font-size:24rpx; 
	   color:#fff;
	   background: transparent;
	   transform:translate(-50%, -50%) scale(1);
	   -webkit-transform:translate(-50%, -50%) scale(1);
	 }
	 .info{
		 margin: 20rpx 0;
		 textarea{
			width: 680rpx;
			height: 200rpx; 
			border: 2rpx solid #b2b2b2;
			border-radius: 6rpx;
			font-size: $font-size-28;
			padding: 10rpx;
			margin: auto;
			line-height: 48rpx;
		 }
	 }
	 .wrap-Btn{
		 margin:100rpx auto;
		 .confirmBbtn{
			 width: 600rpx;
			 height: 90rpx;
			 line-height: 90rpx;
			 text-align: center;
			color: #fff;
			background:$btn-confirm;
			border-radius: 45rpx;
		 }
	 }
</style>