214 lines
6.5 KiB
Vue
214 lines
6.5 KiB
Vue
<template>
|
||
<tpx-page>
|
||
<tpx-layout>
|
||
<template v-slot:body>
|
||
<view class="com-jianju pos-rlt pb-30" style="padding-top: 2rpx;">
|
||
<view class="blcok-white radius-20">
|
||
<u-textarea v-model="ansValue" border="none" height="110" placeholder="粘贴或输入地址，点击“智能识别”自动拆分姓名、电话和地址" custom-style="border:0;padding: 0;"></u-textarea>
|
||
<u-row justify="end">
|
||
<view class="mt-10">
|
||
<u-button @click="handleAnsText()" type="primary" size="mini" shape="circle" custom-style="width: 130rpx;font-size: 24rpx;padding:0;">智能识别</u-button>
|
||
</view>
|
||
</u-row>
|
||
</view>
|
||
|
||
<view class="blcok-white radius-20">
|
||
<view class="">
|
||
|
||
<view style="margin-top: 10rpx;">
|
||
<u-row>
|
||
<u-col span="4">
|
||
<tpx-input v-model:value="submitParam.name" placeholder="真实姓名"></tpx-input>
|
||
</u-col>
|
||
<u-col offset="1" span="7">
|
||
<tpx-input v-model:value="submitParam.phone" placeholder="电话"></tpx-input>
|
||
</u-col>
|
||
</u-row>
|
||
</view>
|
||
|
||
<view class="mt-40 pos-rlt">
|
||
<tpx-input :value="getAddressDetail(submitParam, false)" placeholder="所在地区"></tpx-input>
|
||
<view @click="handleDialogClick(addressModal)" class="pos-abt-all"></view>
|
||
</view>
|
||
|
||
<view class="mt-30">
|
||
<tpx-textarea v-model:value="submitParam.address" placeholder="详细地址（例如**街道**号**）"></tpx-textarea>
|
||
</view>
|
||
|
||
<view class="mt-30" v-if="submitParam.country=='0086'">
|
||
<tpx-input v-model:value="submitParam.enterpriseName" placeholder="企业名称"></tpx-input>
|
||
</view>
|
||
|
||
<view class="mt-30" v-if="submitParam.country=='0086'">
|
||
<tpx-input v-model:value="submitParam.enterpriseTaxId" placeholder="企业税号"></tpx-input>
|
||
</view>
|
||
|
||
<view class="mt-30">
|
||
<tpx-input v-model:value="submitParam.postCode" placeholder="邮编"></tpx-input>
|
||
</view>
|
||
|
||
<view class="mt-30">
|
||
<tpx-input v-model:value="submitParam.email" placeholder="邮箱（选填"></tpx-input>
|
||
</view>
|
||
|
||
<view class="mt-30 lbRequiredDot">
|
||
<tpx-input v-model:value="submitParam.company" placeholder="公司名称"></tpx-input>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mt-30 pl-30 pr-30">
|
||
<u-row justify="between">
|
||
<view>
|
||
<!-- <u-checkbox-group v-model="submitParam.blDefaultFlag" placement="column">
|
||
<u-checkbox
|
||
:name="true"
|
||
shape="circle"
|
||
size="30" label="默认地址" active-color="#B12D29"
|
||
label-size="28"
|
||
>
|
||
</u-checkbox>
|
||
</u-checkbox-group> -->
|
||
</view>
|
||
<view @click="handleReset">
|
||
<u-text text="清空" size="28" color="#0E0708"></u-text>
|
||
</view>
|
||
</u-row>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<template v-slot:footer>
|
||
<view class="blcok-white-noradius">
|
||
<u-button @click="handleSubmit()" type="primary" size="large" shape="circle"
|
||
custom-style="height:80rpx;font-size: 30rpx;"
|
||
>确定</u-button>
|
||
</view>
|
||
</template>
|
||
</tpx-layout>
|
||
<buns-address-sheet v-model:show="addressModal.show" v-model:value="addressModal.values" @onSure="handleAddressChoose"></buns-address-sheet>
|
||
</tpx-page>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAddressModels } from "./model"
|
||
import * as apiService from "@/common/api"
|
||
import { addressNameCodeMap } from "@/common/enum"
|
||
import { pageEventNames } from "@/common/enum"
|
||
import { getAddressDetail, setAddresModalParam } from "@/common/util"
|
||
import { checkParams } from "@/common/validate"
|
||
|
||
export default {
|
||
props: {
|
||
},
|
||
computed: {
|
||
|
||
},
|
||
data() {
|
||
return {
|
||
queryOption: {
|
||
id: undefined,
|
||
addressType: undefined, // 1寄件 2收件
|
||
listQuery: {}
|
||
},
|
||
addressModal: {
|
||
show: false,
|
||
values: {
|
||
regIds: [],
|
||
regNames: []
|
||
}
|
||
},
|
||
ansValue: '',
|
||
submitParam: {
|
||
...getAddressModels(),
|
||
},
|
||
submitValidConfig: {
|
||
name: { required: true, requiredMsg: '姓名不能为空' },
|
||
phone: { required: true, requiredMsg: '手机号不能为空' },
|
||
country: { required: true, requiredMsg: '国家不能为空' },
|
||
province: { required: true, requiredMsg: '省份不能为空' },
|
||
address: { required: true, requiredMsg: '详细地址不能为空' },
|
||
company: { required: true, requiredMsg: '公司名称不能为空' },
|
||
},
|
||
}
|
||
},
|
||
onShareAppMessage() {
|
||
return {
|
||
// title: '',
|
||
// path: 'TODO'
|
||
}
|
||
},
|
||
onLoad(queryOption) {
|
||
this.queryOption = queryOption
|
||
this.initData();
|
||
},
|
||
onUnload() {
|
||
|
||
},
|
||
methods: {
|
||
getAddressDetail,
|
||
async initData() {
|
||
if(this.queryOption.id) {
|
||
let res = await apiService.getAddressById({ id: this.queryOption.id, _loading: true })
|
||
if(res.data.blDefaultFlag) {
|
||
res.data.blDefaultFlag = [true]
|
||
}
|
||
// 回显 国家-省市区组件数据
|
||
this.addressModal.values = setAddresModalParam(res.data);
|
||
this.submitParam = res.data
|
||
}
|
||
},
|
||
|
||
async handleAnsText(){
|
||
let res = await apiService.parseAddress({ content: this.ansValue, _loading: true })
|
||
let data = res.data || {}
|
||
this.addressModal.values = setAddresModalParam(data);
|
||
Object.assign(this.submitParam, data)
|
||
},
|
||
handleAddressChoose(data) {
|
||
addressNameCodeMap.map((nameCodeMap, index)=> {
|
||
this.submitParam[nameCodeMap.codeKey] = data.regIds[index]
|
||
this.submitParam[nameCodeMap.nameKey] = data.regNames[index]
|
||
})
|
||
},
|
||
handleReset(){
|
||
this.submitParam = getAddressModels()
|
||
this.addressModal.values = {
|
||
regIds: [],
|
||
regNames: [],
|
||
}
|
||
},
|
||
async handleSubmit() {
|
||
let params = { ...this.submitParam }
|
||
await checkParams(params, this.submitValidConfig)
|
||
let curServiceHand = apiService.addAddress
|
||
if(this.queryOption.id) {
|
||
curServiceHand = apiService.editAddress
|
||
} else {
|
||
params.addressType = this.queryOption.addressType
|
||
}
|
||
params.blDefaultFlag = Number(!!(params.blDefaultFlag && params.blDefaultFlag.length > 0));
|
||
await curServiceHand({ ...params, _loading: true })
|
||
this.showToast("操作成功")
|
||
uni.$emit(pageEventNames.addressSaveSuccess, {
|
||
data: params
|
||
})
|
||
this.goBack()
|
||
},
|
||
handleDialogClick(curModal) {
|
||
curModal.show = true
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import '@/common/uni-nvue.scss';
|
||
|
||
page {
|
||
background-color: #F6F6F6;
|
||
height: 100% !important;
|
||
}
|
||
</style>
|
||
<style scoped lang="scss">
|
||
|
||
</style> |