--对接地址新增编辑
This commit is contained in:
parent
6bf2fc3391
commit
85641b3113
@ -17,7 +17,18 @@ import { useRequest } from "@/use/useHttp"
|
|||||||
*/
|
*/
|
||||||
export const addressAddApi = () => {
|
export const addressAddApi = () => {
|
||||||
return useRequest({
|
return useRequest({
|
||||||
url: `/lymarket/v1/mall/address`,
|
url: `/v1/mall/address`,
|
||||||
method: "post",
|
method: "post",
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 地址详情
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
export const addressDetailApi = () => {
|
||||||
|
return useRequest({
|
||||||
|
url: `/v1/mall/address`,
|
||||||
|
method: "get",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
@ -46,11 +46,23 @@ export const isEmptyObject = (object: any)=>{
|
|||||||
/**
|
/**
|
||||||
* 表单检索
|
* 表单检索
|
||||||
* @param data
|
* @param data
|
||||||
* @param rules
|
* @param rules = {
|
||||||
|
account: [{
|
||||||
|
message: "请输入正确的用户名",
|
||||||
|
// regex: /\d/, // 正则匹配规则
|
||||||
|
// validator: (value:any, rule:any)=>{ // 自定义验证,返回true表示匹配到了(错误)
|
||||||
|
// return false;
|
||||||
|
// }
|
||||||
|
}],
|
||||||
|
password: [{
|
||||||
|
message: "请输入正确的密码",
|
||||||
|
// regex: /\d/
|
||||||
|
}]
|
||||||
|
};
|
||||||
* @param message
|
* @param message
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const retrieval = (data: any, message: string="请填写完信息", rules?: Object)=>{
|
export const retrieval = (data: any, rules?: Object, message: string="请填写完信息")=>{
|
||||||
return new Promise((resolve, reject)=>{
|
return new Promise((resolve, reject)=>{
|
||||||
if(rules){
|
if(rules){
|
||||||
const keys = Reflect.ownKeys(rules);
|
const keys = Reflect.ownKeys(rules);
|
||||||
|
@ -51,9 +51,11 @@ const AddressList = memo((props:Params)=>{
|
|||||||
<View className="address-list-info">
|
<View className="address-list-info">
|
||||||
{/* **省**市**区**街道****仓库 */}
|
{/* **省**市**区**街道****仓库 */}
|
||||||
{item.province_name+item.city_name+item.district_name} {item.address_detail}
|
{item.province_name+item.city_name+item.district_name} {item.address_detail}
|
||||||
<Text className="address-list-phone">{item.phone}</Text>
|
{
|
||||||
|
item.is_default&&<Text className="address-list-phone">{item.phone}</Text>
|
||||||
|
}
|
||||||
</View>
|
</View>
|
||||||
<Navigator url="/pages/addressAdd/index?type=edit" hoverClass="none" className="address-edit">
|
<Navigator url={`/pages/addressAdd/index?type=edit&id=${item.id}`} hoverClass="none" className="address-edit">
|
||||||
<Text className="iconfont icon-bianji"></Text>
|
<Text className="iconfont icon-bianji"></Text>
|
||||||
</Navigator>
|
</Navigator>
|
||||||
</View>
|
</View>
|
||||||
|
@ -6,74 +6,109 @@ import { Button, Input, Text, Textarea, View } from "@tarojs/components"
|
|||||||
import Taro, { setNavigationBarTitle, useRouter } from "@tarojs/taro"
|
import Taro, { setNavigationBarTitle, useRouter } from "@tarojs/taro"
|
||||||
import { useEffect, useState } from "react"
|
import { useEffect, useState } from "react"
|
||||||
import "./index.scss"
|
import "./index.scss"
|
||||||
import {addressAddApi} from "@/api/addressManager"
|
import {addressAddApi, addressDetailApi} from "@/api/addressManager"
|
||||||
|
|
||||||
export default ()=>{
|
export default ()=>{
|
||||||
const [showSiteModal, setShowSiteModal] = useState(false);
|
const [showSiteModal, setShowSiteModal] = useState(false);
|
||||||
const {type} = useRouter().params;
|
const {type,id} = useRouter().params;
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
if(type=="add"){
|
if(type=="add"){
|
||||||
setNavigationBarTitle({title:"新增收货地址"})
|
setNavigationBarTitle({title:"新增收货地址"})
|
||||||
}else{
|
}else{
|
||||||
|
// initalFormData();
|
||||||
setNavigationBarTitle({title:"编辑收货地址"})
|
setNavigationBarTitle({title:"编辑收货地址"})
|
||||||
}
|
}
|
||||||
},[])
|
},[])
|
||||||
|
// 获取编辑地址信息
|
||||||
const handleSelectSite = ()=>{
|
const {fetchData: getFromData} = addressDetailApi()
|
||||||
setShowSiteModal(true);
|
const initalFormData = async ()=>{
|
||||||
|
const detail = await getFromData({id});
|
||||||
|
const siteArray = []
|
||||||
|
// setFormData({
|
||||||
|
// name: detail.data.name,
|
||||||
|
// phone: detail.data.phone,
|
||||||
|
// site: detail.data.,
|
||||||
|
// siteArray: [],
|
||||||
|
// district_id: detail.data.district_id,
|
||||||
|
// address_detail: detail.data.address_detail,
|
||||||
|
// is_default: false
|
||||||
|
// })
|
||||||
}
|
}
|
||||||
|
|
||||||
const {fetchData, state} = addressAddApi()
|
const {fetchData, state} = addressAddApi()
|
||||||
// 保存
|
// 保存
|
||||||
const [formData, setFormData] = useState(new Proxy({
|
const [formData, setFormData] = useState({
|
||||||
name: "",
|
name: "",
|
||||||
phone:"",
|
phone:"",
|
||||||
site:"",
|
site:"",
|
||||||
|
siteArray: [],
|
||||||
district_id:"",
|
district_id:"",
|
||||||
address_detail: "",
|
address_detail: "",
|
||||||
is_default: false
|
is_default: false
|
||||||
}, {
|
|
||||||
get: function (target, propKey, receiver) {
|
|
||||||
|
|
||||||
return Reflect.get(target, propKey, receiver);
|
|
||||||
},
|
|
||||||
set: function (target, propKey, value, receiver) {
|
|
||||||
console.log("进来了");
|
|
||||||
|
|
||||||
return Reflect.set(target, propKey, value, receiver);
|
|
||||||
}
|
|
||||||
}))
|
|
||||||
Taro.enableAlertBeforeUnload({
|
|
||||||
message: "编辑末保存",
|
|
||||||
|
|
||||||
})
|
})
|
||||||
|
const rules = {
|
||||||
|
name: [{
|
||||||
const handleSave = async ()=>{
|
message: "请输入收货人姓名"
|
||||||
if(hozon){
|
}],
|
||||||
await fetchData({
|
phone: [{
|
||||||
|
message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/
|
||||||
|
}],
|
||||||
|
district_id: [{
|
||||||
|
message: "请选择地址"
|
||||||
|
}],
|
||||||
|
address_detail: [{
|
||||||
|
message: "请输入详细地址"
|
||||||
|
}],
|
||||||
|
}
|
||||||
|
const handleSave = ()=>{
|
||||||
|
retrieval(formData, rules).then(async ()=>{
|
||||||
|
const result = await fetchData({
|
||||||
name: formData.name,
|
name: formData.name,
|
||||||
phone:formData.phone,
|
phone:formData.phone,
|
||||||
site:formData.site,
|
site:formData.site,
|
||||||
district_id:formData.district_id,
|
district_id:formData.district_id,
|
||||||
address_detail: formData.address_detail,
|
address_detail: formData.address_detail,
|
||||||
|
is_default: formData.is_default
|
||||||
});
|
});
|
||||||
|
if(result.success){
|
||||||
|
alert.success("保存成功")
|
||||||
|
}else{
|
||||||
|
alert.error(result.msg);
|
||||||
|
}
|
||||||
// Taro.navigateBack();
|
// Taro.navigateBack();
|
||||||
}else{
|
}).catch((message)=>{
|
||||||
alert.error("请完善表单!")
|
alert.none(message)
|
||||||
}
|
})
|
||||||
}
|
}
|
||||||
|
// 监听表单完善
|
||||||
const [hozon, setHozon] = useState(false);
|
const [hozon, setHozon] = useState(false);
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
if(retrieval){
|
if(retrieval){
|
||||||
retrieval(formData).then(()=>setHozon(true)).catch(()=>setHozon(false))
|
retrieval(formData).then(()=>setHozon(true)).catch(()=>setHozon(false))
|
||||||
}
|
}
|
||||||
},[formData])
|
},[formData])
|
||||||
|
// 设置选择地址
|
||||||
|
const handleSetSite = (ev:any)=>{
|
||||||
|
console.log(ev);
|
||||||
|
|
||||||
|
if(ev.length>=3){
|
||||||
|
setFormData({
|
||||||
|
...formData,
|
||||||
|
siteArray: ev,
|
||||||
|
site: ev.map(item=>item.name+" "),
|
||||||
|
district_id: ev[ev.length-1]?.id
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
alert.error("请选择完整地址");
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View className="add-address">
|
<View className="add-address">
|
||||||
<FromList onInput={(ev:any)=>setFormData({...formData,name:ev.detail.value})} value={formData["name"]} label="联系人" placeholder="请输入收货人姓名"/>
|
<FromList onInput={(ev:any)=>setFormData({...formData,name:ev.detail.value})} value={formData["name"]} label="联系人" placeholder="请输入收货人姓名"/>
|
||||||
<FromList onInput={(ev:any)=>setFormData({...formData,phone:ev.detail.value})} value={formData["phone"]} label="联系方式" placeholder="请输入联系方式"/>
|
<FromList onInput={(ev:any)=>setFormData({...formData,phone:ev.detail.value})} value={formData["phone"]} label="联系方式" placeholder="请输入联系方式"/>
|
||||||
<FromList value={formData["site"]} onClick={handleSelectSite} label="收货地址" type="select" placeholder="请选择/省/市/区"/>
|
<FromList value={formData["site"]} onClick={()=>setShowSiteModal(true)} label="收货地址" type="select" placeholder="请选择/省/市/区"/>
|
||||||
<FromList onInput={(ev:any)=>setFormData({...formData,address_detail:ev.detail.value})} value={formData["address_detail"]} label="详细地址" type="textarea" placeholder="请输入详细地址(街道、门牌号等)"/>
|
<FromList onInput={(ev:any)=>setFormData({...formData,address_detail:ev.detail.value})} value={formData["address_detail"]} label="详细地址" type="textarea" placeholder="请输入详细地址(街道、门牌号等)"/>
|
||||||
<View className="add-address-default">
|
<View className="add-address-default">
|
||||||
<Text>设为默认地址</Text>
|
<Text>设为默认地址</Text>
|
||||||
@ -88,7 +123,7 @@ export default ()=>{
|
|||||||
<Button style={{"background": hozon?'#007aff':''}} hoverClass="none" className={`add-address-save`} onClick={handleSave}>
|
<Button style={{"background": hozon?'#007aff':''}} hoverClass="none" className={`add-address-save`} onClick={handleSave}>
|
||||||
保存
|
保存
|
||||||
</Button>
|
</Button>
|
||||||
<Address addressOnSelect={(e) => console.log('地址::',e)} defaultValue={[{name: "广东省", id: 193}, {name: "佛山市", id: 202}, {name: "高明区", id: 204}]} addressOnClose={()=>setShowSiteModal(false)} show={showSiteModal}/>
|
<Address addressOnSelect={handleSetSite} defaultValue={formData.siteArray} addressOnClose={()=>setShowSiteModal(false)} show={showSiteModal}/>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user