refactor: 重构商品留言表单逻辑,替换为diy-form组件

1.  移除页面data中维护的留言表单数据,改为通过computed实时从商品详情数据构建diy-form所需格式
2.  替换ns-newform为diy-form组件,使用raw模式并接管表单提交逻辑
3.  完善平台别名映射,新增更多小程序平台兼容配置
4.  为diy-form新增占位符样式属性绑定
5.  重构商品表单接口处理逻辑,统一所有元数据字段的初始化和兼容处理
This commit is contained in:
2026-07-18 10:55:39 +08:00
parent 1ac0fb2484
commit 059630ba2c
5 changed files with 75 additions and 30 deletions

View File

@@ -411,11 +411,12 @@
</view> -->
<!-- v-if="goodsSkuDetail.goodsForm" -->
<view style="padding: 0 30rpx;">
<ns-newform
:data="informationform"
:form-config="goodsSkuDetail.goods_form_config"
ref="form"
></ns-newform>
<diy-form
:value="formDiyValue"
dataMode="raw"
:show-submit="false"
ref="form"
></diy-form>
</view>
</scroll-view>
<view class="button-box"><button type="primary" @click="saveubfirnation()">{{ $lang('goods.detail.confirm') }}</button></view>
@@ -549,6 +550,21 @@ export default {
nsGoodsPromotion
},
mixins: [base, detail, scroll],
computed: {
// diy-form raw 模式 value:banner/tip 由独立列归一化后的 goods_form_* 提供,
// 与 formdata.vue 的 diyValue 同源;本页 :show-submit="false" 走外部"确定"按钮提交。
formDiyValue() {
const sku = this.goodsSkuDetail || {};
return {
jsonData: sku.goods_form || [],
formConfig: sku.goods_form_config || {},
show_banner: sku.goods_form_show_banner === true,
form_banner: sku.goods_form_banner || '',
show_tip: sku.goods_form_show_tip === true,
form_tip: sku.goods_form_tip || ''
};
}
},
methods: {
/**
* 发送商品信息到智能客服

View File

@@ -24,9 +24,10 @@ export default {
membercard: null, // 会员卡信息
hackReset: true,
cardOff: false,
informationform:[]//留言表单
cardOff: false
// 留言表单数据不再在 data() 维护:detail.vue 的 computed formDiyValue
// 直接从 goodsSkuDetail.goods_form / goods_form_config / goods_form_* 实时读取并打包成
// diy-form raw 模式期望的 value 结构。
}
},
computed: {
@@ -221,7 +222,6 @@ export default {
//商品留言打开
showinformation(){
this.informationform = this.goodsSkuDetail?.goods_form ?? [];
this.$refs.informationPopup.open();
},
//商品留言关闭
@@ -230,18 +230,18 @@ export default {
},
//保存商品留言
saveubfirnation(){
//缺少
// ref 指向 <diy-form>:diy-form 只暴露 getFormData() 方法,无 formData 属性
if (!this.$refs.form.verify()) return;
// uni.setStorageSync('goodFormData', {
// goods_id: this.goodsSkuDetail.goods_id,
// form_data: this.$refs.form.formData
// form_data: this.$refs.form.getFormData()
// });
this.$api.sendRequest({
url: '/api/goods/information',
data: {
goods_id: this.goodsSkuDetail.goods_id,
form_data: JSON.stringify(this.$refs.form.formData)
form_data: JSON.stringify(this.$refs.form.getFormData())
},
success: res => {
var data = res.data;