hookehuyr

feat(结账页面): 添加编辑个人信息按钮及处理逻辑

添加编辑按钮允许用户修改已提交的个人信息
实现handleEditInfo方法处理编辑逻辑,构建编辑URL并显示弹窗
......@@ -91,6 +91,17 @@
scrolling="no"
@load="adjustIframeHeight"
></iframe>
<!-- 编辑按钮 -->
<!-- <div v-if="!showInfoEntry && iframeInfoSrc" class="mt-3 text-center"> -->
<div class="mt-3 text-center">
<div
@click="handleEditInfo"
class="px-4 py-2 bg-green-500 text-white rounded-lg text-sm hover:bg-green-600"
>
编辑信息
</div>
</div>
</FrostedGlass>
<FrostedGlass class="rounded-xl p-4 mb-6">
......@@ -280,7 +291,7 @@ const adjustIframeHeight = () => {
if (iframeDoc) {
const body = iframeDoc.body
const html = iframeDoc.documentElement
// 获取内容的实际高度
const height = Math.max(
body.scrollHeight,
......@@ -289,7 +300,7 @@ const adjustIframeHeight = () => {
html.scrollHeight,
html.offsetHeight
)
// 设置iframe高度,添加一些padding
iframe.style.height = (height + 20) + 'px'
console.log('调整iframe高度:', height + 20 + 'px')
......@@ -333,7 +344,7 @@ onMounted(async () => {
formData.value.customize_id = infoData.customize_id
iframeInfoSrc.value = infoData.form_url + '&page_type=info' + '&data_id=' + infoData.customize_id
console.log('从缓存恢复个人信息数据:', infoData)
// 延迟调整iframe高度,等待内容加载
setTimeout(() => {
adjustIframeHeight()
......@@ -468,6 +479,23 @@ const handleInfoEntryComplete = async (data) => {
}
}
// 处理编辑个人信息
const handleEditInfo = () => {
// cartItems是数组,需要找到包含form_url的项目
const itemWithForm = cartItems.value.find(item => item.form_url)
if (itemWithForm && itemWithForm.form_url && formData.value.customize_id) {
// 构建编辑URL,添加page_type=edit和data_id参数
const editUrl = itemWithForm.form_url + '&page_type=edit' + '&data_id=' + formData.value.customize_id
console.log('打开编辑个人信息弹窗,URL:', editUrl)
// 设置iframe地址并显示弹窗
iframeSrc.value = editUrl
showInfoEntry.value = true
} else {
console.log('无法编辑:未找到form_url或customize_id')
}
}
// 处理个人信息录入关闭
const handleInfoEntryClose = () => {
showInfoEntry.value = false
......@@ -478,7 +506,7 @@ const handleInfoEntryClose = () => {
// 写入地址查询详情
iframeInfoSrc.value = itemWithForm.form_url + '&page_type=info' + '&data_id=' + formData.value.customize_id
console.log('个人信息录入弹窗关闭,iframe地址:', iframeInfoSrc.value)
// 延迟调整iframe高度,等待内容加载
setTimeout(() => {
adjustIframeHeight()
......