From 2ea4de81cb7029a3edd97d452e8bff117114528d Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期三, 10 九月 2025 14:13:51 +0800
Subject: [PATCH] 扫码修改订单地址
---
api/order.js | 11 +
pages/order/editOrderAddress/editOrderAddress.vue | 513 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
pages.json | 7
3 files changed, 531 insertions(+), 0 deletions(-)
diff --git a/api/order.js b/api/order.js
index d1cc985..1e42272 100644
--- a/api/order.js
+++ b/api/order.js
@@ -81,6 +81,17 @@
needToken: true,
});
}
+/**
+ * 鑾峰彇璁㈠崟璇︽儏
+ * @param orderSn 璁㈠崟缂栧彿
+ */
+export function getOrderDetailEdit(orderSn) {
+ return http.request({
+ url: `/order/order/editAddress/${orderSn}`,
+ method: Method.GET,
+ needToken: true,
+ });
+}
/**
* 鍙栨秷璁㈠崟
diff --git a/pages.json b/pages.json
index b6f90a9..5441924 100644
--- a/pages.json
+++ b/pages.json
@@ -1777,6 +1777,13 @@
"u-notice-bar": "view"
}
}
+ },
+ {
+ "path" : "editOrderAddress/editOrderAddress",
+ "style" :
+ {
+ "navigationBarTitleText" : "淇敼璁㈠崟"
+ }
}
]
},
diff --git a/pages/order/editOrderAddress/editOrderAddress.vue b/pages/order/editOrderAddress/editOrderAddress.vue
new file mode 100644
index 0000000..efcba7b
--- /dev/null
+++ b/pages/order/editOrderAddress/editOrderAddress.vue
@@ -0,0 +1,513 @@
+<template>
+ <view class="edit-address-page">
+ <!-- 璁㈠崟淇℃伅 -->
+ <view class="order-info">
+ <view class="order-title">璁㈠崟淇℃伅</view>
+ <view class="order-sn">璁㈠崟鍙凤細{{ orderDetail.order.sn || '' }}</view>
+
+ <!-- 鍟嗗搧鍒楄〃 -->
+ <view class="goods-list">
+ <view class="goods-item" v-for="item in orderDetail.orderItems" :key="item.id">
+ <image class="goods-image" :src="item.image" mode="aspectFill"></image>
+ <view class="goods-info">
+ <view class="goods-name">{{ item.goodsName }}</view>
+ <view class="goods-price-qty">
+ <text class="price">楼{{ item.flowPrice }}</text>
+ <text class="qty">x{{ item.num }}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <!-- 鍦板潃濉啓琛ㄥ崟 -->
+ <view class="address-form">
+ <view class="form-title">閰嶉�佸湴鍧�</view>
+
+ <view class="form-item">
+ <text class="label">鏀惰揣浜�</text>
+ <input class="input" v-model="addressForm.consigneeName" placeholder="璇疯緭鍏ユ敹璐т汉濮撳悕" />
+ </view>
+
+ <view class="form-item">
+ <text class="label">鑱旂郴鐢佃瘽</text>
+ <input class="input" v-model="addressForm.consigneeMobile" placeholder="璇疯緭鍏ヨ仈绯荤數璇�" type="number" />
+ </view>
+
+ <view class="form-item">
+ <text class="label">鎵�鍦ㄥ湴鍖�</text>
+ <view class="picker-text" @click="showPicker">
+ {{ addressForm.___path || '璇烽�夋嫨鎵�鍦ㄥ湴鍖�' }}
+ </view>
+ </view>
+
+ <view class="form-item">
+ <text class="label">璇︾粏鍦板潃</text>
+ <textarea class="textarea" v-model="addressForm.consigneeDetail"
+ placeholder="璇疯緭鍏ヨ缁嗗湴鍧�锛堝琛楅亾銆侀棬鐗屽彿绛夛級"></textarea>
+ </view>
+ </view>
+
+ <!-- 鎻愪氦鎸夐挳锛堝凡閫傞厤瀹夊叏鍖哄煙锛� -->
+ <view class="submit-btn" @tap="submitAddress">淇濆瓨鍦板潃</view>
+
+ <!-- 鍦板潃閫夋嫨缁勪欢 -->
+ <m-city :provinceData="list" headTitle="鍖哄煙閫夋嫨" ref="cityPicker" @funcValue="getpickerParentValue" pickerSize="4">
+ </m-city>
+ </view>
+</template>
+
+<script>
+ import {
+ getOrderDetailEdit
+ } from '@/api/order.js'
+ import {
+ http
+ } from '@/utils/request.js'
+ import '@/components/uview-components/uview-ui';
+ import city from "../m-city/m-city.vue";
+ export default {
+ components: {
+ "m-city": city
+ },
+ data() {
+ return {
+ orderSn: '', // 璁㈠崟缂栧彿
+ orderDetail: {
+ orderItems: []
+ }, // 璁㈠崟璇︽儏
+ addressForm: {
+ consigneeName: '',
+ consigneeMobile: '',
+ consigneeAddressPath: '',
+ consigneeAddressIdPath: '',
+ consigneeDetail: '',
+ ___path: '' // 鏄剧ず鐢ㄧ殑鍦板尯鏂囨湰
+ },
+ regionData: [
+ [],
+ [],
+ []
+ ], // 鐪佸競鍖烘暟鎹�
+ regionIndex: [0, 0, 0], // 閫変腑鐨勭储寮�
+ regionText: '', // 鏄剧ず鐨勫湴鍖烘枃鏈�
+ regionCodes: [], // 鍦板尯缂栫爜
+ list: [{
+ id: "",
+ localName: "璇烽�夋嫨",
+ children: [],
+ }, ]
+ }
+ },
+ onShow(){
+ console.log('瑙﹀彂onShow-------------------------->',this.orderSn)
+ this.loadOrderDetail()
+ },
+ onLoad(options) {
+ console.log('椤甸潰鍙傛暟:', options)
+ if (options.q) {
+ // 鍙岄噸瑙ｇ爜锛氬井淇″URL杩涜浜嗕袱娆＄紪鐮�
+ const decodedUrl = decodeURIComponent(decodeURIComponent(options.q));
+ console.log('鍘熷URL:', decodedUrl);
+
+ // 瑙ｆ瀽URL涓殑鏌ヨ鍙傛暟
+ const params = this.parseUrlParams(decodedUrl);
+ this.orderSn = params.orderSn;
+ this.loadOrderDetail()
+ }
+ },
+ methods: {
+ // 瑙ｆ瀽URL鍙傛暟
+ parseUrlParams(url) {
+ const params = {};
+ // 澶勭悊鍙兘瀛樺湪鐨刪ash锛堝鏋滄湁鐨勮瘽锛�
+ const cleanUrl = url.split('#')[0];
+ const queryStr = cleanUrl.split('?')[1] || '';
+
+ queryStr.split('&').forEach(pair => {
+ const [key, value] = pair.split('=');
+ if (key) {
+ // 濡傛灉鍊煎瓨鍦紝鍒欒В鐮侊紝鍚﹀垯璁句负绌哄瓧绗︿覆
+ params[key] = value ? decodeURIComponent(value) : '';
+ }
+ });
+
+ return params;
+ },
+ // 鍔犺浇璁㈠崟璇︽儏
+ async loadOrderDetail() {
+ try {
+ uni.showLoading({
+ title: '鍔犺浇涓�...'
+ })
+ const res = await getOrderDetailEdit(this.orderSn)
+ console.log('----------鑾峰彇璁㈠崟杩斿洖缁撴灉------------->',res)
+ if (res.data.success) {
+ this.orderDetail = res.data.result
+ console.log('----------------------->璁㈠崟鏁版嵁', JSON.stringify(this.orderDetail))
+ } else {
+ uni.showToast({
+ title: res.data.message || '鑾峰彇璁㈠崟淇℃伅澶辫触',
+ icon: 'none'
+ })
+ }
+ } catch (error) {
+ console.error('鑾峰彇璁㈠崟璇︽儏澶辫触:', error)
+ uni.showToast({
+ title: '鑾峰彇璁㈠崟淇℃伅澶辫触',
+ icon: 'none'
+ })
+ } finally {
+ uni.hideLoading()
+ }
+ },
+
+ // 鍦板尯閫夋嫨鏀瑰彉
+ async onColumnChange(e) {
+ const {
+ column,
+ value
+ } = e.detail
+ this.regionIndex[column] = value
+
+ if (column === 0) {
+ // 閫夋嫨鐪佷唤鏃讹紝鍔犺浇鍩庡競鏁版嵁
+ const provinceId = this.regionData[0][value].id
+ try {
+ const cityRes = await http.request({
+ url: '/common/common/region/tree',
+ method: 'GET',
+ params: {
+ parentId: provinceId
+ }
+ })
+ if (cityRes.data.success) {
+ this.regionData[1] = cityRes.data.result.map(item => ({
+ name: item.name,
+ id: item.id
+ }))
+ this.regionData[2] = []
+ this.regionIndex[1] = 0
+ this.regionIndex[2] = 0
+ }
+ } catch (error) {
+ console.error('鍔犺浇鍩庡競鏁版嵁澶辫触:', error)
+ }
+ } else if (column === 1) {
+ // 閫夋嫨鍩庡競鏃讹紝鍔犺浇鍖哄幙鏁版嵁
+ const cityId = this.regionData[1][value].id
+ try {
+ const areaRes = await http.request({
+ url: '/common/common/region/tree',
+ method: 'GET',
+ params: {
+ parentId: cityId
+ }
+ })
+ if (areaRes.data.success) {
+ this.regionData[2] = areaRes.data.result.map(item => ({
+ name: item.name,
+ id: item.id
+ }))
+ this.regionIndex[2] = 0
+ }
+ } catch (error) {
+ console.error('鍔犺浇鍖哄幙鏁版嵁澶辫触:', error)
+ }
+ }
+ },
+
+ // 鍦板尯閫夋嫨纭
+ onRegionChange(e) {
+ const {
+ value
+ } = e.detail
+ this.regionIndex = value
+
+ const province = this.regionData[0][value[0]]
+ const city = this.regionData[1][value[1]]
+ const area = this.regionData[2][value[2]]
+
+ if (province && city && area) {
+ this.regionText = `${province.name} ${city.name} ${area.name}`
+ this.addressForm.consigneeAddressIdPath = `${province.id},${city.id},${area.id}`
+ }
+ },
+
+ // 鏄剧ず鍦板潃閫夋嫨鍣�
+ showPicker() {
+ this.$nextTick(() => {
+ if (this.$refs.cityPicker) {
+ this.$refs.cityPicker.show();
+ }
+ });
+ },
+
+ // 鍦板潃閫夋嫨鍥炶皟
+ getpickerParentValue(e) {
+ // 灏嗛渶瑕佺粦瀹氱殑鍦板潃璁剧疆涓虹┖锛屽苟璧嬪��
+ this.addressForm.consigneeAddressIdPath = '';
+ let name = "";
+ let idPath = [];
+ let namePath = []
+
+ e.forEach((item, index) => {
+ if (item.id) {
+ // 閬嶅巻鏁版嵁
+ idPath.push(item.id);
+ namePath.push(item.localName);
+ name += item.localName;
+ this.addressForm.___path = name;
+ }
+ });
+
+ // 璁剧疆鍦板潃璺緞
+ this.addressForm.consigneeAddressIdPath = idPath.join(',');
+ this.addressForm.consigneeAddressPath = namePath.join(',');
+ },
+
+ // 鎻愪氦鍦板潃
+ async submitAddress() {
+ // 琛ㄥ崟楠岃瘉
+ if (!this.addressForm.consigneeName) {
+ uni.showToast({
+ title: '璇疯緭鍏ユ敹璐т汉濮撳悕',
+ icon: 'none'
+ })
+ return
+ }
+ if (!this.addressForm.consigneeMobile) {
+ uni.showToast({
+ title: '璇疯緭鍏ヨ仈绯荤數璇�',
+ icon: 'none'
+ })
+ return
+ }
+ if (!/^1[3-9]\d{9}$/.test(this.addressForm.consigneeMobile)) {
+ uni.showToast({
+ title: '璇疯緭鍏ユ纭殑鎵嬫満鍙�',
+ icon: 'none'
+ })
+ return
+ }
+ if (!this.addressForm.consigneeAddressIdPath || !this.addressForm.___path) {
+ uni.showToast({
+ title: '璇烽�夋嫨鎵�鍦ㄥ湴鍖�',
+ icon: 'none'
+ })
+ return
+ }
+ if (!this.addressForm.consigneeDetail) {
+ uni.showToast({
+ title: '璇疯緭鍏ヨ缁嗗湴鍧�',
+ icon: 'none'
+ })
+ return
+ }
+
+ try {
+ uni.showLoading({
+ title: '淇濆瓨涓�...'
+ })
+ console.log('-------------------->', JSON.stringify(this.addressForm))
+ // 鎻愪氦鍦板潃鍒拌鍗曪紙娉ㄩ噴閮ㄥ垎涓哄疄闄呮帴鍙ｈ皟鐢ㄩ�昏緫锛�
+ const res = await http.request({
+ url: `/order/order/update/editAddress/${this.orderSn}/consignee`,
+ method: 'POST',
+ needToken: true,
+ data: this.addressForm
+ })
+
+ if (res.data.success) {
+ uni.showToast({
+ title: '鍦板潃淇濆瓨鎴愬姛',
+ icon: 'success'
+ })
+ setTimeout(() => {
+ uni.switchTab({
+ url:'/pages/tabbar/index/home'
+ })
+ }, 1500)
+ } else {
+ uni.showToast({
+ title: res.data.message || '淇濆瓨澶辫触',
+ icon: 'none'
+ })
+ }
+ } catch (error) {
+ console.error('鎻愪氦鍦板潃澶辫触:', error)
+ uni.showToast({
+ title: '淇濆瓨澶辫触锛岃閲嶈瘯',
+ icon: 'none'
+ })
+ } finally {
+ uni.hideLoading()
+ }
+ }
+ }
+ }
+</script>
+
+<style scoped>
+ /* 鏍瑰鍣細搴曢儴鍐呰竟璺濋�傞厤鎸夐挳+瀹夊叏鍖哄煙 */
+ .edit-address-page {
+ background-color: #f5f5f5;
+ min-height: 100vh;
+ /* 鎸夐挳楂樺害(100rpx) + 瀹夊叏鍖哄煙楂樺害 + 棰濆闂磋窛(20rpx)锛岄伩鍏嶅唴瀹硅鎸夐挳閬尅 */
+ padding-bottom: calc(100rpx + 20rpx + constant(safe-area-inset-bottom));
+ padding-bottom: calc(100rpx + 20rpx + env(safe-area-inset-bottom));
+ }
+
+ /* 璁㈠崟淇℃伅鍖哄煙 */
+ .order-info {
+ background: white;
+ margin: 20rpx;
+ padding: 30rpx;
+ border-radius: 16rpx;
+ }
+
+ .order-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ margin-bottom: 20rpx;
+ color: #333;
+ }
+
+ .order-sn {
+ font-size: 28rpx;
+ color: #666;
+ margin-bottom: 30rpx;
+ }
+
+ /* 鍟嗗搧鍒楄〃 */
+ .goods-item {
+ display: flex;
+ align-items: center;
+ padding: 20rpx 0;
+ border-bottom: 1rpx solid #f0f0f0;
+ }
+
+ .goods-item:last-child {
+ border-bottom: none;
+ }
+
+ .goods-image {
+ width: 120rpx;
+ height: 120rpx;
+ border-radius: 12rpx;
+ margin-right: 20rpx;
+ }
+
+ .goods-info {
+ flex: 1;
+ }
+
+ .goods-name {
+ font-size: 28rpx;
+ color: #333;
+ margin-bottom: 10rpx;
+ line-height: 1.4;
+ }
+
+ .goods-price-qty {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .price {
+ font-size: 28rpx;
+ color: #ff6b35;
+ font-weight: bold;
+ }
+
+ .qty {
+ font-size: 24rpx;
+ color: #666;
+ }
+
+ /* 鍦板潃琛ㄥ崟鍖哄煙 */
+ .address-form {
+ background: white;
+ margin: 20rpx;
+ padding: 30rpx;
+ border-radius: 16rpx;
+ }
+
+ .form-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ margin-bottom: 30rpx;
+ color: #333;
+ }
+
+ .form-item {
+ display: flex;
+ align-items: flex-start;
+ margin-bottom: 30rpx;
+ min-height: 80rpx;
+ }
+
+ .label {
+ width: 160rpx;
+ font-size: 28rpx;
+ color: #333;
+ line-height: 80rpx;
+ flex-shrink: 0;
+ }
+
+ .input {
+ flex: 1;
+ height: 80rpx;
+ line-height: 80rpx;
+ font-size: 28rpx;
+ color: #333;
+ padding: 0 20rpx;
+ border: 1rpx solid #e0e0e0;
+ border-radius: 8rpx;
+ }
+
+ .picker-text {
+ flex: 1;
+ height: 80rpx;
+ line-height: 80rpx;
+ font-size: 28rpx;
+ color: #333;
+ padding: 0 20rpx;
+ border: 1rpx solid #e0e0e0;
+ border-radius: 8rpx;
+ background: white;
+ }
+
+ .textarea {
+ flex: 1;
+ min-height: 120rpx;
+ font-size: 28rpx;
+ color: #333;
+ padding: 20rpx;
+ border: 1rpx solid #e0e0e0;
+ border-radius: 8rpx;
+ line-height: 1.4;
+ }
+
+ /* 搴曢儴鎻愪氦鎸夐挳锛堟牳蹇冿細閫傞厤瀹夊叏鍖哄煙锛� */
+ .submit-btn {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 100rpx;
+ line-height: 100rpx;
+ /* 淇濊瘉鏂囧瓧鍨傜洿灞呬腑 */
+ background: #ff6b35;
+ color: white;
+ text-align: center;
+ font-size: 32rpx;
+ font-weight: bold;
+ /* 鍏煎鏂版棫iOS鍜屽畨鍗撶殑瀹夊叏鍖哄煙 */
+ padding-bottom: constant(safe-area-inset-bottom);
+ /* iOS 11.0-11.1 */
+ padding-bottom: env(safe-area-inset-bottom);
+ /* iOS 11.2+ 鍙婂畨鍗� */
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.8.0