Jvxetable用slot植入j-popup

上一篇讲了如何根据当前记录确定jpopup field是否disabled（https://blog.csdn.net/rocklee/article/details/125581874?spm=1001.2014.3001.5501），这里讲一下如何利用slot插槽方式指定template为j-popup

<template #prodSeq="{row, rowIndex, $rowIndex, column}" >
  <j-popup
    v-model="row.prodSeq"
    :code="column.popupCode"
    :field="column.field"
    :column="column"
    :value="row[column.key]"
    :renderOptions="{listeners:$listeners}"
    :orgFields="column.orgFields"
    :destFields="column.destFields"
    :param="column.param"
    :sorter="column.sorter"
    :row="row"
    :multi="false"
    :disabled="!column.props.getDisabled(row,column)"
    @input="(value,others,oldValue,row)=>updateMainMtRecord(value,others,oldValue,row,column,rowIndex)"
  ></j-popup>
</template>

• slot里面的jpopup指定的参数
  – param 浏览记录时指定的过滤参数
  – row 带进去的当前记录
  – disabled 动态判断是否禁用
  – input 回调事件

• 安插这个插槽
  将某个字段的配置指定为slot:

{
  title: '物料SQ',
  key: 'prodSeq',
  type: JVXETypes.slot,
  slotName:'prodSeq',
  fixed: 'left',
  width:"150px",
  popupCode:"getProds",
  field:"prod_seq",
  orgFields:"id,prod_name,prod_seq,spec,fukuang,mazhong,unit",
  destFields:"prodId,prodName,prodSeq,productInfo.spec,productInfo.fukuang,productInfo.mazhong,productInfo.unit",
  placeholder: '请输入${title}',
  defaultValue:'',
  param: {prod_cat:'B04A01'},
  props:{
    formType:this.type,
	getDisabled: (row,column,ref)=>{return !(!!row['clone']||(this.formType||!!ref&&ref.$attrs.formType)=='edit')}
  },
  validateRules: [{ required: true, message: '${title}不能为空' }],
}

• Jpopup的修改
  data()增加了oldValue：

data() {
  return {
    showText: '',
    title: '',
    oldValue:'',
    avalid: true,
    extendParam: {}
  }
}

openModal() 要oldValue保存原值

openModal() {
  if (this.disabled === false) {
    this.oldValue=this.row[this.column.key]
    this.$refs.jPopupOnlReport.show()
  }
}

最后callback最后一句改为：

this.$emit('input', str, res,this.oldValue,this.row)