diff --git a/src/components/LowDesign/src/LowForm/components/FormTable.vue b/src/components/LowDesign/src/LowForm/components/FormTable.vue index 05f3839..13a5cff 100644 --- a/src/components/LowDesign/src/LowForm/components/FormTable.vue +++ b/src/components/LowDesign/src/LowForm/components/FormTable.vue @@ -61,7 +61,7 @@ index ) " - v-if="item.display" + v-if="item.display && menuBtnShow(item, scope.row, scope.index)" > @@ -332,6 +332,19 @@ const addTable = () => { } } +//按钮显隐处理 +const menuBtnShow = (btnItem, row, index) => { + if (index < 0) return true + const showStr = props.column.btnShowObj[btnItem.prop] + if (!showStr) return true + const bool = executeStrFunction( + showStr, + [row, index], + `${btnItem.label} 按钮显示/隐藏判断执行异常,请检查` + ) + return bool +} + // 按钮事件处理 const menuHandle = (menuData, btnIndex?) => { let { item, row, dataIndex, btnKey } = menuData diff --git a/src/components/LowDesign/src/utils/example.ts b/src/components/LowDesign/src/utils/example.ts index b3c4676..2d859fe 100644 --- a/src/components/LowDesign/src/utils/example.ts +++ b/src/components/LowDesign/src/utils/example.ts @@ -3,6 +3,7 @@ export interface exampleType { formJsEnhanceExample: string remoteExample: string buttonExample: string + formTableMenuButtonExample: string tabsEnhanceExample: string tableEnhanceExample: string tableConfigExample: string @@ -60,6 +61,22 @@ export const buttonExample = `return { } } ` +//表单开发 表格布局 操作列按钮 其他配置模板 +export const formTableMenuButtonExample = `return { + //其他配置请参考element-plus button配置 + type:'primary', + //当前按钮的点击事件 + handleClick: (obj) => { + if (obj.loading) obj.loading() //关闭loading方法 + }, + //当前按钮显示/隐藏判断 注:按钮需要先配置可见 + handleShow:(row)=>{ + //row 当前行数据 + return true + } +} +` + /* 组件配置模板 */ //选项卡布局 增强配置模板 export const tabsEnhanceExample = `return { diff --git a/src/components/LowDesign/src/utils/formUtil.ts b/src/components/LowDesign/src/utils/formUtil.ts index a79b1d2..cbb8c60 100644 --- a/src/components/LowDesign/src/utils/formUtil.ts +++ b/src/components/LowDesign/src/utils/formUtil.ts @@ -382,6 +382,7 @@ const initColumn = (column: object, control, ruleObj, componentData: Object, oth delete columnItem.params[key] }) columnItem.btnClickObj = {} + columnItem.btnShowObj = {} for (const key in columnItem.btnData) { columnItem.btnData[key] = columnItem.btnData[key].map((item) => { const config = handleStrObj(item.configStr, `【${item.label}】 按钮配置格式异常,请检查`) @@ -389,6 +390,10 @@ const initColumn = (column: object, control, ruleObj, componentData: Object, oth columnItem.btnClickObj[item.prop] = `${config['handleClick']}` delete config['handleClick'] } + if (config['handleShow']) { + columnItem.btnShowObj[item.prop] = `${config['handleShow']}` + delete config['handleShow'] + } delete item.configStr Object.assign(item, config) if (formType == 'view') { diff --git a/src/components/LowFormDesign/components/DesignConfig/components/config/LayoutTable.vue b/src/components/LowFormDesign/components/DesignConfig/components/config/LayoutTable.vue index 696b8a5..bb54b1c 100644 --- a/src/components/LowFormDesign/components/DesignConfig/components/config/LayoutTable.vue +++ b/src/components/LowFormDesign/components/DesignConfig/components/config/LayoutTable.vue @@ -122,7 +122,7 @@ size="small" v-model="element.configStr" placeholder="按钮配置" - @click="openBtnEditView(element, index)" + @click="openBtnEditView(element, index, tabItem.prop)" >
@@ -232,7 +232,8 @@ const handleRemoveBtn = (index, prop) => { } const exampleObj = { tableEnhanceStr: example.tableEnhanceExample, - configStr: example.buttonExample + configStr: example.buttonExample, + configMenuStr: example.formTableMenuButtonExample } const openEditView = (prop, label) => { @@ -251,7 +252,7 @@ const openEditView = (prop, label) => { } emit('open-med', { prop, label, params }) } -const openBtnEditView = (btnItem, index) => { +const openBtnEditView = (btnItem, index, tabProp?) => { openMEDialog( { prop: 'configStr', @@ -263,7 +264,10 @@ const openBtnEditView = (btnItem, index) => { name: `复制配置示例`, icon: 'solar:copy-outline', clickFun: () => { - emit('copy-text', exampleObj.configStr || '') + emit( + 'copy-text', + tabProp == 'menu' ? exampleObj.configMenuStr : exampleObj.configStr || '' + ) }, params: { size: 'small',