Dining_Hall/pages/mine/me/upAddress.vue

<template>
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
	
  <view class="pwd-retrieve-container">
	  <Navbar :title="NavbarTitle" :showRightText="false" :isBack="false"/>
    <uni-forms ref="form" :value="address" labelWidth="80px"> 
	  <uni-forms-item name="custName" label="联系人" required="true">
	    <uni-easyinput type="text" v-model="address.custName" maxlength="20" placeholder="请输入" />
	  </uni-forms-item>
	  <uni-forms-item name="mobile" label="电话号码" required="true">
	    <uni-easyinput type="text" v-model="address.mobile"  maxlength="11" placeholder="请输入" />
	  </uni-forms-item>
      <uni-forms-item name="addressIndex" label="地址"  style="display: flex;align-items: center;" required="true">
			<view style="width: 100%;height: 100%;border: 1px solid #dcdfe6;padding: 16rpx 10rpx;border-radius: 8rpx;" @click="show=true">{{address.addrFullName || '填选择地址'}}</view>
        <!-- <uni-easyinput type="text" v-model="address.addrFullName" placeholder="请输入" /> -->
      </uni-forms-item>
	  <uni-forms-item name="detailAddr" label="详细地址" required="true">
	    <uni-easyinput type="text" v-model="address.detailAddr" maxlength="50" placeholder="小区,楼号,门牌" />
	  </uni-forms-item>
	  
	  <view @click="submit" style="width: 90%;height: 80rpx;margin: 10px auto;background: #ff8b38;color: #fff;border-radius: 10rpx;text-align: center;line-height: 80rpx;" >
		  提交
	  </view>
	  <view v-show="address.id!=''" @click="delAddress" style="width: 90%;height: 80rpx;margin: 10px auto;background: #fff;border-radius: 10rpx;text-align: center;line-height: 80rpx;border: 1px solid #ccc;" >
		  删除
	  </view>
	  
     <!-- <button type="primary" @click="submit">提交</button>
      <button type="danger" >删除</button> -->
    </uni-forms>
	
	<u-picker :show="show" :columns="columns" @confirm="confirm" @close="show=false" closeOnClickOverlay="true"></u-picker>
  </view>
</template>

<script>
  // import { updateCustAddrApi,queryChildPlaceByIdApi,addCustAddrForAppApi } from '@/api/mine/information.js';
	import { addCustAddrForAppApi,deleteCustAddrForAppApi,queryChildPlaceByIdApi,updateCustAddrApi } from '@/api/mine/information.js';
	
  export default {
    data() {
      return { 
		fontValue:uni.getStorageSync('fontSize') || 8,
		NavbarTitle:"收货地址",
		placeList:[],
		columns: [[]],
		show:false,
		isSumbit:false,
		address:{
			id: "",
			// ifDefault:0,
			addrFullName: "",
			addressIndex: undefined,
			detailAddr: "",
			custName: "",
			mobile: "", 
		},
        rules: {
          addressIndex: {
            rules: [{
              required: true,
              errorMessage: '不能为空'
            }]
          },
		  detailAddr: {
		    rules: [{
		      required: true,
		      errorMessage: '不能为空'
		    }]
		  },
          custName: {
            rules: [{
                required: true,
                errorMessage: '不能为空',
              },
              {
                minLength: 1,
                maxLength: 20,
                errorMessage: '长度在 2 到 20 个字符'
              }
            ]
          },
          mobile: {
            rules: [{
                required: true,
                errorMessage: '不能为空'
              }
            ]
          }
        }
      }
    }, 
	onLoad(options) { 
		this.getPlaceList()
		// const addressStr = options.address;
		// address = JSON.parse(decodeURIComponent(addressStr));
		this.address = JSON.parse(options.address)
		console.log(this.address)
	},
    methods: {
		async getPlaceList(){ 
			let param = {
				"custId":uni.getStorageSync('custId'),
				"placeId":-1,
			}
			const res = await queryChildPlaceByIdApi(param);
			console.log('?? ~ getAddressById ~ res:', res)
			if(res.code==200){
				this.placeList = res.data;
				if(this.placeList.length>0){ 
					this.placeList.forEach(item=>{
						this.columns[0].push(item.placeFullName)
					})
					
				}
			}else{
				this.placeList=[]
				this.columns=[[]]
			}
			console.log(this.columns)
		},
		//地址选中
		confirm(e) {
			console.log('confirm', e)
			this.address.addressIndex=e.indexs[0];
			this.address.addrFullName = e.value[0]
			this.show = false
		},
		submit() {
			const regex = /^1[3-9]\d{9}$/;
			// console.log(this.address)
			if(this.address.custName==""){
				uni.$u.toast(`联系人不能为空`) 
			}else if(this.address.mobile==""){
				uni.$u.toast(`手机号不能为空`) 
			}else if(!regex.test(this.address.mobile)){
				uni.$u.toast(`请输入正确手机号`) 
			}else if(this.address.addrFullName==""){
				uni.$u.toast(`地址不能为空`) 
			}else if(this.address.detailAddr==""){
				uni.$u.toast(`详细地址不能为空`) 
			}else{
				if(!this.isSumbit){
					const id=this.address.id;
					if(id!=undefined&&id!=""){
						this.updatedata();
					}else{
						this.insertdata();
					}
				}
			}
		}, 
		async updatedata(){
			this.isSumbit=true
			let param = { 
				"id":this.address.id,
				"custId":uni.getStorageSync('custId'),
				"custName": this.address.custName, 
				"mobile": this.address.mobile,
				"addrFullName": this.address.addrFullName, 
				"detailAddr": this.address.detailAddr, 
				"areaCode":1,
				"openid": uni.getStorageSync('openId'),
				"sourceType": "7",
				"placeId":this.address.addressIndex,
			}
			const res = await updateCustAddrApi(param); 
			console.log('?? ~ getList ~ res:', res) 
			if(res.code==200){
				uni.$u.toast(`操作成功！`)
				setTimeout(()=>{
					uni.navigateBack()
					this.isSumbit=false
				},500)
			}else{
				this.isSumbit=false
				uni.$u.toast(`操作失败！`)
			}
			
		},
		async insertdata(){ 
			this.isSumbit=true
			let param = {
				"custId":uni.getStorageSync('custId'),
				"custName": this.address.custName, 
				"mobile": this.address.mobile,
				"addrFullName": this.address.addrFullName, 
				"detailAddr": this.address.detailAddr, 
				"areaCode":1,
				"openid": uni.getStorageSync('openId'),
				"sourceType": "7",
				"placeId":this.address.addressIndex,
			}
			const res = await addCustAddrForAppApi(param); 
			console.log('?? ~ getList ~ res:', res) 
			if(res.code==200){
				uni.$u.toast(`新增成功！`)
				setTimeout(()=>{
					this.isSumbit=false
					uni.navigateBack()
				},500)
			}else{
				this.isSumbit=false
				uni.$u.toast(res.msg)
			} 
		}, 
		async delAddress(){
			let param = {
				"custId":uni.getStorageSync('custId'),
				"openid": uni.getStorageSync('openId'),
				"sourceType": "7",
				"id":this.address.id,
			}
			const res = await deleteCustAddrForAppApi(param); 
			if(res.code==200){
				uni.$u.toast(`删除成功！`)
				setTimeout(()=>{
					uni.navigateBack()
				},500)
			}else{
				uni.$u.toast(res.msg)
			}
			
		}
	
	}
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }

  .pwd-retrieve-container {
    padding-top: 36rpx;
    padding: 15px;
  }
</style>