feat(结账页面): 添加编辑个人信息按钮及处理逻辑
添加编辑按钮允许用户修改已提交的个人信息 实现handleEditInfo方法处理编辑逻辑,构建编辑URL并显示弹窗
Showing
1 changed file
with
32 additions
and
4 deletions
| ... | @@ -91,6 +91,17 @@ | ... | @@ -91,6 +91,17 @@ |
| 91 | scrolling="no" | 91 | scrolling="no" |
| 92 | @load="adjustIframeHeight" | 92 | @load="adjustIframeHeight" |
| 93 | ></iframe> | 93 | ></iframe> |
| 94 | + | ||
| 95 | + <!-- 编辑按钮 --> | ||
| 96 | + <!-- <div v-if="!showInfoEntry && iframeInfoSrc" class="mt-3 text-center"> --> | ||
| 97 | + <div class="mt-3 text-center"> | ||
| 98 | + <div | ||
| 99 | + @click="handleEditInfo" | ||
| 100 | + class="px-4 py-2 bg-green-500 text-white rounded-lg text-sm hover:bg-green-600" | ||
| 101 | + > | ||
| 102 | + 编辑信息 | ||
| 103 | + </div> | ||
| 104 | + </div> | ||
| 94 | </FrostedGlass> | 105 | </FrostedGlass> |
| 95 | 106 | ||
| 96 | <FrostedGlass class="rounded-xl p-4 mb-6"> | 107 | <FrostedGlass class="rounded-xl p-4 mb-6"> |
| ... | @@ -280,7 +291,7 @@ const adjustIframeHeight = () => { | ... | @@ -280,7 +291,7 @@ const adjustIframeHeight = () => { |
| 280 | if (iframeDoc) { | 291 | if (iframeDoc) { |
| 281 | const body = iframeDoc.body | 292 | const body = iframeDoc.body |
| 282 | const html = iframeDoc.documentElement | 293 | const html = iframeDoc.documentElement |
| 283 | - | 294 | + |
| 284 | // 获取内容的实际高度 | 295 | // 获取内容的实际高度 |
| 285 | const height = Math.max( | 296 | const height = Math.max( |
| 286 | body.scrollHeight, | 297 | body.scrollHeight, |
| ... | @@ -289,7 +300,7 @@ const adjustIframeHeight = () => { | ... | @@ -289,7 +300,7 @@ const adjustIframeHeight = () => { |
| 289 | html.scrollHeight, | 300 | html.scrollHeight, |
| 290 | html.offsetHeight | 301 | html.offsetHeight |
| 291 | ) | 302 | ) |
| 292 | - | 303 | + |
| 293 | // 设置iframe高度,添加一些padding | 304 | // 设置iframe高度,添加一些padding |
| 294 | iframe.style.height = (height + 20) + 'px' | 305 | iframe.style.height = (height + 20) + 'px' |
| 295 | console.log('调整iframe高度:', height + 20 + 'px') | 306 | console.log('调整iframe高度:', height + 20 + 'px') |
| ... | @@ -333,7 +344,7 @@ onMounted(async () => { | ... | @@ -333,7 +344,7 @@ onMounted(async () => { |
| 333 | formData.value.customize_id = infoData.customize_id | 344 | formData.value.customize_id = infoData.customize_id |
| 334 | iframeInfoSrc.value = infoData.form_url + '&page_type=info' + '&data_id=' + infoData.customize_id | 345 | iframeInfoSrc.value = infoData.form_url + '&page_type=info' + '&data_id=' + infoData.customize_id |
| 335 | console.log('从缓存恢复个人信息数据:', infoData) | 346 | console.log('从缓存恢复个人信息数据:', infoData) |
| 336 | - | 347 | + |
| 337 | // 延迟调整iframe高度,等待内容加载 | 348 | // 延迟调整iframe高度,等待内容加载 |
| 338 | setTimeout(() => { | 349 | setTimeout(() => { |
| 339 | adjustIframeHeight() | 350 | adjustIframeHeight() |
| ... | @@ -468,6 +479,23 @@ const handleInfoEntryComplete = async (data) => { | ... | @@ -468,6 +479,23 @@ const handleInfoEntryComplete = async (data) => { |
| 468 | } | 479 | } |
| 469 | } | 480 | } |
| 470 | 481 | ||
| 482 | +// 处理编辑个人信息 | ||
| 483 | +const handleEditInfo = () => { | ||
| 484 | + // cartItems是数组,需要找到包含form_url的项目 | ||
| 485 | + const itemWithForm = cartItems.value.find(item => item.form_url) | ||
| 486 | + if (itemWithForm && itemWithForm.form_url && formData.value.customize_id) { | ||
| 487 | + // 构建编辑URL,添加page_type=edit和data_id参数 | ||
| 488 | + const editUrl = itemWithForm.form_url + '&page_type=edit' + '&data_id=' + formData.value.customize_id | ||
| 489 | + console.log('打开编辑个人信息弹窗,URL:', editUrl) | ||
| 490 | + | ||
| 491 | + // 设置iframe地址并显示弹窗 | ||
| 492 | + iframeSrc.value = editUrl | ||
| 493 | + showInfoEntry.value = true | ||
| 494 | + } else { | ||
| 495 | + console.log('无法编辑:未找到form_url或customize_id') | ||
| 496 | + } | ||
| 497 | +} | ||
| 498 | + | ||
| 471 | // 处理个人信息录入关闭 | 499 | // 处理个人信息录入关闭 |
| 472 | const handleInfoEntryClose = () => { | 500 | const handleInfoEntryClose = () => { |
| 473 | showInfoEntry.value = false | 501 | showInfoEntry.value = false |
| ... | @@ -478,7 +506,7 @@ const handleInfoEntryClose = () => { | ... | @@ -478,7 +506,7 @@ const handleInfoEntryClose = () => { |
| 478 | // 写入地址查询详情 | 506 | // 写入地址查询详情 |
| 479 | iframeInfoSrc.value = itemWithForm.form_url + '&page_type=info' + '&data_id=' + formData.value.customize_id | 507 | iframeInfoSrc.value = itemWithForm.form_url + '&page_type=info' + '&data_id=' + formData.value.customize_id |
| 480 | console.log('个人信息录入弹窗关闭,iframe地址:', iframeInfoSrc.value) | 508 | console.log('个人信息录入弹窗关闭,iframe地址:', iframeInfoSrc.value) |
| 481 | - | 509 | + |
| 482 | // 延迟调整iframe高度,等待内容加载 | 510 | // 延迟调整iframe高度,等待内容加载 |
| 483 | setTimeout(() => { | 511 | setTimeout(() => { |
| 484 | adjustIframeHeight() | 512 | adjustIframeHeight() | ... | ... |
-
Please register or login to post a comment