From ad876a6fea2df6e2a831d4c9d95cf724855610f4 Mon Sep 17 00:00:00 2001
From: Liuyi <candymxq888@outlook.com>
Date: 星期六, 14 十二月 2024 16:43:35 +0800
Subject: [PATCH] 修复用户微信扫码进入小程序无法跳转及登录问题，修改会员卡解绑接口
---
pages/addressAdd/index.vue | 336 +++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 237 insertions(+), 99 deletions(-)
diff --git a/pages/addressAdd/index.vue b/pages/addressAdd/index.vue
index e7105be..3276ff9 100644
--- a/pages/addressAdd/index.vue
+++ b/pages/addressAdd/index.vue
@@ -1,115 +1,209 @@
<script setup>
- import{ref} from 'vue'
- const isDefault =ref(false)
+ import { onMounted, ref, watchEffect } from 'vue';
+ import { getRegionApi,creatUserArchive,getAddressApi,editAddressApi } from '../../api/index.js';
+ import { onLoad } from "@dcloudio/uni-app"
+
+ const addressId = ref()
+ const pageTitle = ref('新增地址')
+ const isCheckedDefault =ref(false)
const form = ref({
- name:'',
- phone:'',
- region:'',
- address:'',
+ id:'',
+ userName:'',
+ userPhone:'',
+ listRegion:[],
+ userAddress:'',
+ isDefault:null,
})
- function submit(){
-
+ //获取地址
+ async function getAddress(){
+ if(addressId.value){
+ pageTitle.value = "编辑地址"
+ await getAddressApi(addressId.value).then((res) =>{
+ form.value.id = res.data.id
+ form.value.userName = res.data.userName
+ form.value.userPhone = res.data.userPhone
+ form.value.listRegion = res.data.region.replace(/#/g,'').split(',')
+ form.value.userAddress = res.data.address
+ form.value.isDefault = res.data.isDefault
+ regionName.value = res.data.regionName.replace(/[#,]/g,' ')
+ isCheckedDefault.value = form.value.isDefault == 1 ? true : false
+ console.log('form',form.value)
+ })
+ }else{
+ console.log('xiznzeng')
+ }
}
- const treeListData = ref([
- {
- id: '2',
- name: '行政中心',
- children: [
- {
- id: '21',
- name: '行政部',
- children: [
- {
- id: '211',
- name: '行政一部',
- children: null,
- },
- {
- id: '212',
- name: '行政二部',
- children: [],
- disabled: true,
- },
- ],
- },
- {
- id: '22',
- name: '财务部',
- children: [
- {
- id: '221',
- name: '财务一部',
- children: [],
- disabled: true,
- },
- {
- id: '222',
- name: '财务二部',
- children: [],
- },
- ],
- },
- {
- id: '23',
- name: '人力资源部',
- children: [
- {
- id: '231',
- name: '人力一部',
- children: [],
- },
- {
- id: '232',
- name: '人力二部',
- append: '更多示例，请下载示例项目查看',
- },
- ],
- },
- ],
- },
- ])
- function handleTreeChange(e){
- console.log(e)
+ onLoad(async(option)=>{
+ addressId.value = option.id
+ console.log('1')
+ })
+ onMounted(()=>{
+ getAddress()
+ })
+ function change(e){
+ form.value.isDefault = e.detail.value ? 1 : 0
}
- function handleExpandChange(e){
- console.log(e)
+ //提交表单数据
+ async function submit(){
+ //修改地址
+ if(form.value.id){
+ await editAddressApi(form.value).then((res) =>{
+ if(res.code == 200){
+ uni.showToast({
+ title: '修改成功',
+ duration:500
+ })
+ setTimeout(() =>{
+ uni.navigateBack()
+ form.value = {}
+ },500)
+ }
+ })
+ }else{
+ //新增地址
+ form.value.id = JSON.parse(uni.getStorageSync('userInfo')).id
+ await creatUserArchive(form.value).then((res) =>{
+ if(res.code == 200){
+ uni.showToast({
+ title: '新增成功',
+ duration:1000
+ })
+ setTimeout(() =>{
+ uni.navigateBack()
+ form.value = {}
+ },1000)
+ }
+ })
+ }
}
+
const DaTreeRef = ref()
+ const treeListData = ref([])
+ const isExpandIcon = ref(false)
+ const regionName = ref('')
+ //展开关闭选择框
+ function expandRegion(){
+ if(isExpandIcon.value){
+ isExpandIcon.value = false
+ }else{
+ isExpandIcon.value = true
+ }
+ }
+ //请求行政区域数据
+ async function getRegion(){
+ await getRegionApi('').then((res) =>{
+ res.data.forEach((item)=>{
+ if(item.children == null){
+ item.children = [{}]
+ }
+ })
+ treeListData.value = res.data
+ console.log(res)
+ })
+ }
+ //设置选中区域名
+ function setRegionName(){
+ let nodeList
+ let nameList = []
+ //判断选中是否根节点，根节点直接取选中node值
+ if(DaTreeRef.value.getHalfCheckedNodes()){
+ nodeList = DaTreeRef.value.getHalfCheckedNodes().concat(DaTreeRef.value.getCheckedNodes())
+ console.log('ban',DaTreeRef.value.getHalfCheckedNodes(),DaTreeRef.value.getCheckedNodes())
+ }else{
+ nodeList = DaTreeRef.value.getCheckedNodes()
+ }
+ nodeList.forEach((item)=>{
+ nameList.push(item.label)
+ })
+ regionName.value = nameList.join()
+ }
+ //选中区域
+ function handleTreeChange(e,e2){
+ isExpandIcon.value = false
+ if(DaTreeRef.value.getHalfCheckedKeys()){
+ form.value.listRegion = DaTreeRef.value.getHalfCheckedKeys().concat(DaTreeRef.value.getCheckedKeys())
+ }else{
+ form.value.listRegion = DaTreeRef.value.getCheckedKeys()
+ }
+ setRegionName()
+ console.log('select',form.value.listRegion,regionName.value)
+ }
+ //遍历树形数据，给展开子节点数据赋值
+ function setTreeData(data,id,childData){
+ let treeList = data
+ treeList.forEach((item) =>{
+ if(item.id === id){
+ item.children = childData
+ }else{
+ if(item.children && item.children.length > 0){
+ setTreeData(item.children,id,childData);
+ }
+ }
+ })
+ return treeList
+ }
+ //展开节点，请求节点数据
+ async function handleExpandChange(isExpand,item){
+ if(item.children[0].key != undefined){
+ }else{
+ let treeList = treeListData.value
+ let childData = []
+ await getRegionApi(item.originItem.code).then((res) =>{
+ res.data.forEach((item)=>{
+ if((item.children == null) && item.level!=4){
+ item.children = [{}]
+ }
+ })
+ childData = res.data
+ })
+ treeListData.value = setTreeData(treeList,item.key,childData)
+ DaTreeRef.value.setExpandedKeys([item.key],true)
+ }
+ }
+
+ onMounted(async() =>{
+ await getRegion()
+ })
</script>
<template>
<view class="container">
- <navbar title ='新增地址'></navbar>
+ <navbar :title ='pageTitle'></navbar>
<view class="content">
<view class="main">
- <view>
+ <view class="item">
<text>联系人</text>
- <input v-model="form.name" placeholder="请输入联系人" />
+ <input v-model="form.userName" placeholder="请输入联系人" />
</view>
- <view>
+ <view class="item">
<text>联系电话</text>
- <input v-model="form.phpne" placeholder="请输入联系电话" />
+ <input v-model="form.userPhone" placeholder="请输入联系电话" />
</view>
- <view >
+ <view class=" item tree-item">
<text>送水区域</text>
- <!-- <da-tree ref="DaTreeRef"
- :data="treeListData"
- labelField="name"
- valueField="id"
- defaultExpandAll
- showCheckbox
- @change="handleTreeChange"
- @expand="handleExpandChange"></da-tree> -->
-
- <input v-model="form.phpne" placeholder="请选择区域" />
+ <view class="tree-select" @click="expandRegion()">
+ <text v-if="!isExpandIcon && !regionName" class="tree-placehoder">省市区域</text>
+ <view v-if="regionName" class="tree-name">{{regionName}}</view>
+ <image :class="isExpandIcon ? 'tree-img' : 'tree-img-fold'" src="../../static/images/address/expand.png"></image>
+ </view>
+ <view v-if='isExpandIcon' class="tree">
+ <DaTree ref="DaTreeRef"
+ :data="treeListData"
+ labelField="name"
+ valueField="id"
+ :showRadioIcon='false'
+ @change="handleTreeChange"
+ @expand="handleExpandChange"></DaTree>
+ </view>
</view>
- <view>
+ <view class="item">
<text>送水地址</text>
- <input v-model="form.address" placeholder="请输入详细地址" />
+ <input v-model="form.userAddress" placeholder="请输入详细地址" />
</view>
</view>
+
<view class="default">
<view>设为默认收货地址</view>
- <switch :checked = 'isDefault' color="#1890FF"/>
+ <switch :checked='isCheckedDefault' @change="change" color="#1890FF"/>
</view>
<view class="subBtn" @click="submit()">提交信息</view>
</view>
@@ -130,7 +224,7 @@
width: 100%;
height:565rpx;
// background: #E8EFFF;
- view{
+ .item{
width:100%;
height:93rpx;
display: flex;
@@ -149,18 +243,62 @@
border-radius:22rpx;
height:100%;
width:534rpx;
+ box-shadow:0 0 7rpx 1rpx rgba(85, 170, 255, 0.3);
+ }
+ .tree-select{
+ // padding-left:36rpx;
+ box-sizing: border-box;
+ background: #FFFFFF;
+ width:534rpx;
+ height:100%;
+ border-radius:22rpx;
+ box-shadow:0 0 5rpx 2rpx rgba(85, 170, 255, 0.5);
+ .tree-placehoder{
+ height: 100%;
+ line-height:93rpx;
+ color: #868686;
+ margin-left:36rpx;
+ }
+ .tree-name{
+ height: 100%;
+ width:400rpx;
+ line-height:93rpx;
+ color: #000;
+ margin-left:36rpx;
+ overflow-x:hidden;
+ }
+ .tree-img-fold{
+ width:36rpx;
+ height:36rpx;
+ position: absolute;
+ right:40rpx;
+ top:30rpx;
+ }
+ .tree-img{
+ width:36rpx;
+ height:36rpx;
+ position: absolute;
+ right:40rpx;
+ top:30rpx;
+ transform: rotate(180deg);
+ }
}
}
- .tree{
- width:100%;
- height:93rpx;
- background: #FFFFFF;
- border-radius:22rpx;
- da-tree{
- width:543rpx;
- height:93rpx;
+ .tree-item{
+ position: relative;
+ .tree{
+ padding-top:30rpx;
+ width:534rpx;
+ height:600rpx;
background: #FFFFFF;
- border-radius:22rpx;
+ // border:1px solid #72757d;
+ z-index:100;
+ position: absolute;
+ top:95rpx;
+ right:0;
+ border-radius:12rpx;
+ // border:1px solid rgba(93, 163, 255, 0.3);
+ box-shadow: 0 0 5rpx 1rpx rgba(93, 163, 255, 0.3);
}
}
}
--
Gitblit v1.9.3