Skip to content

I
ibizlab-generator
提交 3cb85367 编写于 作者: WodahsOrez's avatar WodahsOrez
浏览文件
操作

update: 表单布局

上级 7468d06a
隐藏空白字符变更
内嵌 并排
正在显示 包含 802 行增加 和 524 行删除
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/common/layoutPos.hbs 0 → 100644
浏览文件 @ 3cb85367
{
{{~#if layout}}
{{~#if layout.layout~}}
selfLayout: '{{layout.layout}}',
{{~/if~}}
{{~#if layout.dir~}}
dir: '{{layout.dir}}',
{{/if~}}
{{~#if layout.align~}}
align: '{{layout.align}}',
{{~/if~}}
{{~#if layout.vAlign~}}
vAlign: '{{layout.vAlign}}',
{{~/if~}}
{{~/if~}}
{{~#if layoutPos~}}
{{~#if layoutPos.layout~}}
parentLayout: '{{layoutPos.layout}}',
{{~/if~}}
{{~#if layoutPos.grow~}}
grow: {{layoutPos.grow}},
{{~/if~}}
{{~#if (and layoutPos.colLG (neq layoutPos.colLG -1) )~}}
colLG: {{layoutPos.colLG}},
{{~/if~}}
{{~#if (and layoutPos.colLGOffset (neq layoutPos.colLGOffset -1) )~}}
colLGOffset: {{layoutPos.colLGOffset}},
{{~/if~}}
{{~#if (and layoutPos.colMD (neq layoutPos.colMD -1) )~}}
colMD: {{layoutPos.colMD}},
{{~/if~}}
{{~#if (and layoutPos.colMDOffset (neq layoutPos.colMDOffset -1) )~}}
colMDOffset: {{layoutPos.colMDOffset}},
{{~/if~}}
{{~#if (and layoutPos.colSM (neq layoutPos.colSM -1) )~}}
colSM: {{layoutPos.colSM}},
{{~/if~}}
{{~#if (and layoutPos.colSMOffset (neq layoutPos.colSMOffset -1) )~}}
colSMOffset: {{layoutPos.colSMOffset}},
{{~/if~}}
{{~#if (and layoutPos.colXS (neq layoutPos.colXS -1) )~}}
colXS: {{layoutPos.colXS}},
{{~/if~}}
{{~#if (and layoutPos.colXSOffset (neq layoutPos.colXSOffset -1) )~}}
colXSOffset: {{layoutPos.colXSOffset}},
{{~/if~}}
{{/if}}
}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-button.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppFormButton
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};"> name="{{item.codeName}}"
<AppFormButton :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
:visible="state.detailsModel.{{item.codeName}}.visible" :visible="state.detailsModel.{{item.codeName}}.visible"
class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}" {{#if item.psSysCss}}
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}" class="{{item.psSysCss.cssName}}"
cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}" {{/if}}
imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}" {{#if (or item.width item.height)}}
:showCaption="{{item.showCaption}}" style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}" {{/if}}
caption="{{#if item.caption}}{{item.caption}}{{/if}}" {{#if item.psSysImage.cssClass}}
/> iconClass="{{item.psSysImage.cssClass}}"
</div> {{/if}}
{{else}} {{#if item.psSysImage.imagePath}}
<a-col imgPath="{{item.psSysImage.imagePath}}"
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} > {{/if}}
<AppFormButton :showCaption="{{item.showCaption}}"
:visible="state.detailsModel.{{item.codeName}}.visible" {{#if item.labelPSSysCss}}
class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}" labelCssName="{{item.labelPSSysCss.cssName}}"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}" {{/if}}
cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}" {{#if item.caption}}
imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}" caption="{{item.caption}}"
:showCaption="{{item.showCaption}}" {{/if}}
labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}" />
caption="{{#if item.caption}}{{item.caption}}{{/if}}" \ No newline at end of file
/>
</a-col>
{{/eq}}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-details-model.hbs
浏览文件 @ 3cb85367
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
relatedDetailNames: '{{groupLogic.relatedDetailNames}}', relatedDetailNames: '{{groupLogic.relatedDetailNames}}',
logicCat: '{{groupLogic.logicCat}}', logicCat: '{{groupLogic.logicCat}}',
logicType: '{{groupLogic.logicType}}', logicType: '{{groupLogic.logicType}}',
notMode: '{{groupLogic.notMode}}', notMode: {{groupLogic.notMode}},
logics: [ logics: [
{{#each groupLogic.psDEFDLogics as | logic |}} {{#each groupLogic.psDEFDLogics as | logic |}}
{condOP: '{{logic.condOP}}',dEFDName: '{{logic.dEFDName}}',logicType: '{{logic.logicType}}',name: '{{logic.name}}',value:'{{logic.value}}'}, {condOP: '{{logic.condOP}}',dEFDName: '{{logic.dEFDName}}',logicType: '{{logic.logicType}}',name: '{{logic.name}}',value:'{{logic.value}}'},
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-druipart.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppFormDruipart
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};"> name="{{item.codeName}}"
<AppFormDruipart title="{{item.caption}}"
v-show="state.detailsModel.{{item.codeName}}.visible" :visible="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}} :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}" {{#if item.psSysCss}}
name="{{item.codeName}}" class="{{item.psSysCss.cssName}}"
title="{{item.caption}}" {{/if}}
:context="context" {{#if (or item.width item.height)}}
:viewParams="viewParams" style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
:data="state.data" {{/if}}
:viewSubject="state.viewSubject" :context="context"
v-slot="druipartParams"> :viewParams="viewParams"
<{{item.psAppView.codeName}} :data="state.data"
:class="['app-view-layout--from-druipart']" :viewSubject="state.viewSubject">
:context="druipartParams.context" <template #default="druipartParams">
:viewParams="druipartParams.viewParams" <{{item.psAppView.codeName}}
:viewDefaultUsage="false" :class="['app-view-layout--from-druipart']"
:noViewCaption="true" :context="druipartParams.context"
@viewEvent="druipartParams.viewEvent" :viewParams="druipartParams.viewParams"
> :viewDefaultUsage="false"
</{{item.psAppView.codeName}}> :noViewCaption="true"
</AppFormDruipart> @viewEvent="druipartParams.viewEvent"
</div> >
{{else}} </{{item.psAppView.codeName}}>
<a-col </template>
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} > </AppFormDruipart>
<AppFormDruipart \ No newline at end of file
v-show="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}}
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}"
name="{{item.codeName}}"
title="{{item.caption}}"
:context="context"
:viewParams="viewParams"
:data="state.data"
:viewSubject="state.viewSubject"
v-slot="druipartParams">
<{{item.psAppView.codeName}}
:class="['app-view-layout--from-druipart']"
:context="druipartParams.context"
:viewParams="druipartParams.viewParams"
:viewDefaultUsage="false"
:noViewCaption="true"
@viewEvent="druipartParams.viewEvent"
>
</{{item.psAppView.codeName}}>
</AppFormDruipart>
</a-col>
{{/eq}}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-group-panel.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppFormGroup
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};"> name="{{item.codeName}}"
<AppFormGroup title="{{item.caption}}"
v-show="state.detailsModel.{{item.codeName}}.visible" :visible="state.detailsModel.{{item.codeName}}.visible"
name="{{item.codeName}}" :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
title="{{item.caption}}" {{#if item.psSysCss}}
{{#if item.psSysCss}} class="{{item.psSysCss.cssName}}"
class="{{item.psSysCss.cssName}}" {{/if}}
{{/if}} {{#if item.labelPSSysCss}}
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}" titleClass="{{item.labelPSSysCss.cssName}}"
{{#if item.psSysImage}} {{/if}}
{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{else if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}} {{#if (or item.width item.height)}}
{{/if}} style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
{{#if item.labelPSSysCss}} {{/if}}
titleStyle="{{item.labelPSSysCss.cssName}}" {{#if item.psSysImage}}
{{/if}} {{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{else if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}
:infoGroupMode="{{item.infoGroupMode}}" {{/if}}
:titleBarCloseMode="{{item.titleBarCloseMode}}" :infoGroupMode="{{item.infoGroupMode}}"
:showCaption="{{item.showCaption}}" :titleBarCloseMode="{{item.titleBarCloseMode}}"
:uIActionGroup="state.detailsModel.{{item.codeName}}.uIActionGroup" :showCaption="{{item.showCaption}}"
@componentEvent="onComponentEvent"> :uIActionGroup="state.detailsModel.{{item.codeName}}.uIActionGroup"
{{#eq item.psLayout.layout "FLEX"}} @componentEvent="onComponentEvent">
<div class="app-form-layout-flex" style="display: flex;{{#if item.psLayout.dir}}flex-direction: {{item.psLayout.dir}};{{/if}}{{#if item.psLayout.align}}justify-content: {{item.psLayout.align}};{{/if}}{{#if item.psLayout.vAlign}}align-items: {{item.psLayout.vAlign}};{{/if}}"> {{#each item.psDEFormDetails as | formDetail |}}
{{#each item.psDEFormDetails as | formDetail |}} {{>(lookup . 'formDetail.detailType') item=formDetail}}
{{>(lookup . 'formDetail.detailType') item=formDetail}} {{/each}}
{{/each}} </AppFormGroup>
</div>
{{else}}
<a-row>
{{#each item.psDEFormDetails as | formDetail |}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</a-row>
{{/eq}}
</AppFormGroup>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormGroup
v-show="state.detailsModel.{{item.codeName}}.visible"
name="{{item.codeName}}"
title="{{item.caption}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}"
{{#if item.psSysImage}}
{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{else if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}
{{/if}}
{{#if item.labelPSSysCss}}
titleStyle="{{item.labelPSSysCss.cssName}}"
{{/if}}
:infoGroupMode="{{item.infoGroupMode}}"
:titleBarCloseMode="{{item.titleBarCloseMode}}"
:showCaption="{{item.showCaption}}"
:uIActionGroup="state.detailsModel.{{item.codeName}}.uIActionGroup"
@componentEvent="onComponentEvent">
{{#eq item.psLayout.layout "FLEX"}}
<div class="app-form-layout-flex" style="display: flex;{{#if item.psLayout.dir}}flex-direction: {{item.psLayout.dir}};{{/if}}{{#if item.psLayout.align}}justify-content: {{item.psLayout.align}};{{/if}}{{#if item.psLayout.vAlign}}align-items: {{item.psLayout.vAlign}};{{/if}}">
{{#each item.psDEFormDetails as | formDetail |}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</div>
{{else}}
<a-row>
{{#each item.psDEFormDetails as | formDetail |}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</a-row>
{{/eq}}
</AppFormGroup>
</a-col>
{{/eq}}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-iframe.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppFormIframe
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};"> name="{{item.codeName}}"
<AppFormIframe :visible="state.detailsModel.{{item.codeName}}.visible"
:visible="state.detailsModel.{{item.codeName}}.visible" :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
class="app-form-iframe{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}" {{#if item.psSysCss}}
style="{{#if item.contentHeight}}height: {{item.contentHeight}}px;{{/if}}{{#if item.contentWidth}}width: {{item.contentWidth}}px{{/if}}" class="{{item.psSysCss.cssName}}"
iFrameUrl="{{item.iFrameUrl}}" {{/if}}
/> {{#if (or item.contentHeight item.contentWidth)}}
</div> style="{{#if item.contentHeight}}height: {{item.contentHeight}}px;{{/if}}{{#if item.contentWidth}}width: {{item.contentWidth}}px;{{/if}}"
{{else}} {{/if}}
<a-col iFrameUrl="{{item.iFrameUrl}}"
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} > />
<AppFormIframe \ No newline at end of file
:visible="state.detailsModel.{{item.codeName}}.visible"
class="app-form-iframe{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
style="{{#if item.contentHeight}}height: {{item.contentHeight}}px;{{/if}}{{#if item.contentWidth}}width: {{item.contentWidth}}px{{/if}}"
iFrameUrl="{{item.iFrameUrl}}"
/>
</a-col>
{{/eq}}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-item.hbs
浏览文件 @ 3cb85367
{{>@macro/front-end/editors/include-editor.hbs}} {{>@macro/front-end/editors/include-editor.hbs}}
{{#neq item.psEditor.editorType "HIDDEN"}} {{#neq item.psEditor.editorType "HIDDEN"}}
{{#eq item.psLayoutPos 'FLEX'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppFormItem <AppFormItem
v-show="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if item.labelPSSysCss}}
titleStyle="{{item.labelPSSysCss.cssName}}"
{{/if}}
name="{{item.codeName}}" name="{{item.codeName}}"
:rules="state.rules.{{item.codeName}}"
:labelWidth="{{item.labelWidth}}"
:required="state.detailsModel.{{item.codeName}}.required"
label="{{item.caption}}" label="{{item.caption}}"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}">
{{#if item.psEditor}}
<div class="form-editor-container" style="{{#if item.editorWidth}}width: {{item.editorWidth}}px;{{/if}}{{#if item.editorHeight}}height: {{item.editorHeight}}px{{/if}}">
{{>(lookup . 'item.psEditor.editorType') item=item ctrlType="form"}}
</div>
{{/if}}
</AppFormItem>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormItem
v-show="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if item.labelPSSysCss}}
titleStyle="{{item.labelPSSysCss.cssName}}"
{{/if}}
name="{{item.codeName}}"
:rules="state.rules.{{item.codeName}}"
:labelWidth="{{item.labelWidth}}" :labelWidth="{{item.labelWidth}}"
:rules="state.rules.{{item.codeName}}"
:required="state.detailsModel.{{item.codeName}}.required" :required="state.detailsModel.{{item.codeName}}.required"
label="{{item.caption}}" :visible="state.detailsModel.{{item.codeName}}.visible"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}"> :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#if item.psEditor}} {{#if item.psSysCss}}
<div class="form-editor-container" style="{{#if item.editorWidth}}width: {{item.editorWidth}}px;{{/if}}{{#if item.editorHeight}}height: {{item.editorHeight}}px{{/if}}"> class="{{item.psSysCss.cssName}}"
{{>(lookup . 'item.psEditor.editorType') item=item ctrlType="form"}} {{/if}}
</div> {{#if item.labelPSSysCss}}
{{/if}} labelClass="{{item.labelPSSysCss.cssName}}"
{{/if}}
{{#if (or item.width item.height)}}
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
{{/if}}
>
{{#if item.psEditor}}
<div class="form-editor-container" style="{{#if item.editorWidth}}width: {{item.editorWidth}}px;{{/if}}{{#if item.editorHeight}}height: {{item.editorHeight}}px{{/if}}">
{{>(lookup . 'item.psEditor.editorType') item=item ctrlType="form"}}
</div>
{{/if}}
</AppFormItem> </AppFormItem>
</a-col>
{{/eq}}
{{/neq}} {{/neq}}
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-page.hbs
浏览文件 @ 3cb85367
<AppFormPage <AppFormPage
name="{{item.codeName}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=item.psLayout layoutPos=item.psLayoutPos}}"
:visible="state.detailsModel.{{item.codeName}}.visible" :visible="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}} {{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}" class="{{item.psSysCss.cssName}}"
{{/if}} {{/if}}
key="{{item.codeName}}" key="{{item.codeName}}"
{{#if item.psSysImage}} tab="{{#if item.caption}}{{item.caption}}{{/if}}"
cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}"
imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}"
{{/if}}
caption="{{#if item.caption}}{{item.caption}}{{/if}}"
> >
{{#eq item.psLayout.layout "FLEX"}} <template #tab>
<div class="app-form-layout-flex" style="display: flex;{{#if item.psLayout.dir}}flex-direction: {{item.psLayout.dir}};{{/if}}{{#if item.psLayout.align}}justify-content: {{item.psLayout.align}};{{/if}}{{#if item.psLayout.vAlign}}align-items: {{item.psLayout.vAlign}};{{/if}}"> <AppIconText {{#if item.labelPSSysCss}}class="{{item.labelPSSysCss.cssName}}" {{/if}}{{#if item.psSysImage}}{{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}" {{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}" {{/if}}{{/if}}text="{{item.caption}}"/>
{{#each item.psDEFormDetails as | formDetail |}} </template>
{{>(lookup . 'formDetail.detailType') item=formDetail}} {{#each item.psDEFormDetails as | formDetail |}}
{{/each}} {{>(lookup . 'formDetail.detailType') item=formDetail}}
</div> {{/each}}
{{else}}
<a-row>
{{#each item.psDEFormDetails as | formDetail |}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</a-row>
{{/eq}}
</AppFormPage> </AppFormPage>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-rawitem.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppRaw
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};"> name="{{item.codeName}}"
<AppRaw :visible="state.detailsModel.{{item.codeName}}.visible"
name="{{item.codeName}}" {{#if item.psSysCss}}
v-show="state.detailsModel.{{item.codeName}}.visible" class="{{item.psSysCss.cssName}}"
{{#if item.psSysCss}} {{/if}}
class="{{item.psSysCss.cssName}}" {{#if item.psSysImage}}
{{/if}} {{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}}
{{#if item.psSysImage}} {{/if}}
{{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}} contentType="{{item.contentType}}"
{{/if}} {{#if (or item.rawItemHeight item.rawItemWidth)}}
contentType="{{item.contentType}}" style="{{#if item.rawItemHeight}}height: {{item.rawItemHeight}}px;{{/if}}{{#if item.rawItemWidth}}width: {{item.rawItemWidth}}px;{{/if}}"
style="{{#if item.rawItemHeight}}height: {{item.rawItemHeight}}px;{{/if}}{{#if item.rawItemWidth}}width: {{item.rawItemWidth}}px{{/if}}" {{/if}}
{{#if (eq item.contentType 'RAW')}}value="{{item.rawContent}}"{{else if (eq item.contentType 'HTML')}}:value="`{{item.htmlContent}}`"{{/if}}/> {{#if (eq item.contentType 'RAW')}}value="{{item.rawContent}}"{{else if (eq item.contentType 'HTML')}}:value="`{{item.htmlContent}}`"{{/if}}/>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppRaw
name="{{item.codeName}}"
v-show="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if item.psSysImage}}
{{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}}
{{/if}}
contentType="{{item.contentType}}"
style="{{#if item.rawItemHeight}}height: {{item.rawItemHeight}}px;{{/if}}{{#if item.rawItemWidth}}width: {{item.rawItemWidth}}px{{/if}}"
{{#if (eq item.contentType 'RAW')}}value="{{item.rawContent}}"{{else if (eq item.contentType 'HTML')}}:value="`{{item.htmlContent}}`"{{/if}}/>
</a-col>
{{/eq}}
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-tabpage.hbs
浏览文件 @ 3cb85367
<AppFormTabpage <AppFormTabpage
name="{{item.codeName}}"
:visible="state.detailsModel.{{item.codeName}}.visible" :visible="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}} :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}" class="{{item.psSysCss.cssName}}"
{{/if}} {{/if}}
key="{{item.codeName}}" key="{{item.codeName}}"
caption="{{#if item.caption}}{{item.caption}}{{/if}}" caption="{{#if item.caption}}{{item.caption}}{{/if}}"
> >
{{#eq item.psLayout.layout "FLEX"}} {{#each item.psDEFormDetails as | formDetail |}}
<div class="app-form-layout-flex" style="display: flex;{{#if item.psLayout.dir}}flex-direction: {{item.psLayout.dir}};{{/if}}{{#if item.psLayout.align}}justify-content: {{item.psLayout.align}};{{/if}}{{#if item.psLayout.vAlign}}align-items: {{item.psLayout.vAlign}};{{/if}}"> {{>(lookup . 'formDetail.detailType') item=formDetail}}
{{#each item.psDEFormDetails as | formDetail |}} {{/each}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</div>
{{else}}
<a-row>
{{#each item.psDEFormDetails as | formDetail |}}
{{>(lookup . 'formDetail.detailType') item=formDetail}}
{{/each}}
</a-row>
{{/eq}}
</AppFormTabpage> </AppFormTabpage>
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-tabpanel.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}} <AppFormTabpanel
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};" {{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}}> :visible="state.detailsModel.{{item.codeName}}.visible"
<AppFormTabpanel> :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#each item.psDEFormPages as | formPage | }} name={{item.name}}>
{{>(lookup . 'formPage.detailType') item=formPage }} {{#each item.psDEFormPages as | formPage | }}
{{/each}} {{>(lookup . 'formPage.detailType') item=formPage }}
</AppFormTabpanel> {{/each}}
</div> </AppFormTabpanel>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormTabpanel>
{{#each item.psDEFormPages as | formPage | }}
{{>(lookup . 'formPage.detailType') item=formPage }}
{{/each}}
</AppFormTabpanel>
</a-col>
{{/eq}}
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-col.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { ILayoutPos } from "@core"; import { ILayoutOpts, LayoutTool, styleObj2Str } from "@core";
import { isObject } from "qx-util";
interface AppColProps{ interface AppColProps {
layoutPos: ILayoutPos; layoutOpts?: ILayoutOpts,
noRoot?: boolean,
visible?: boolean,
} }
const props = withDefaults(defineProps<AppColProps>(), { const props = withDefaults(defineProps<AppColProps>(), {
noRoot: false,
visible: true,
});
// 使用布局逻辑获得响应式的layout对象
let layout: any = null;
if (props.layoutOpts) {
layout = LayoutTool.useLayout(toRef(props as any, "layoutOpts"));
}
// 插槽类名和插槽样式，只有不绘制根元素的时候需要传递给插槽
const attrs = useAttrs()
// 在template里写会丢失响应性，故封一个计算属性。
let slotStyle = computed(() => {
let result = '';
result += isObject(attrs.style ) ? styleObj2Str(attrs.style) : attrs.style;
console.log(attrs.style)
console.log(result)
if(layout?.value?.colStyle){
result += layout.value.colStyle;
}
result += props.visible == true ? "" : "display: none;";
return result;
}); });
// use通用的layout解析逻辑。 let slotClass = computed(()=>{
let result = '';
result += attrs.class;
if(props.layoutOpts?.parentLayout == 'FLEX' && props.noRoot){
result += " app-col app-col--flex";
}
return result;
})
const layoutMode = ""; // 计算是否需要绘制根元素(layoutOpts不存在或者flex模式下noRoot为true时不绘制根元素)
let hasRoot = computed(()=>{
return props.layoutOpts !== undefined &&
( props.layoutOpts.parentLayout !== 'FLEX' || !props.noRoot );
})
onMounted(() => {
console.log(props)
});
</script> </script>
<template> <template>
<div v-if="layoutMode == 'FLEX'" class="app-col"> <template v-if="!hasRoot">
<slot></slot> <!-- 没有根元素的直接输出插槽 -->
</div> <slot :slotStyle="slotStyle" :slotClass="slotClass"></slot>
<a-col v-else class="app-col"> </template>
<slot></slot> <div
</a-col> v-else-if="layoutOpts?.parentLayout == 'FLEX'"
v-show="visible"
:style="layout.colStyle"
class="app-col app-col--flex"
>
<slot slotStyle="" slotClass="" ></slot>
</div>
<a-col
v-else
v-show="visible"
:lg="layout.colGridOpts.lg"
:xs="layout.colGridOpts.md"
:md="layout.colGridOpts.md"
:sm="layout.colGridOpts.sm"
class="app-col app-col--grid"
>
<slot slotStyle="" slotClass=""></slot>
</a-col>
</template> </template>
<style lang="scss"> <style lang="scss">
</style> </style>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-button.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam } from "@core"; import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormButtonProps{ interface FormButtonProps{
visible: boolean; name: string;
cssClass?: string; layoutOpts: ILayoutOpts;
imagePath?: string; visible?: boolean;
iconClass?: string;
imgPath?: string;
showCaption?: boolean; showCaption?: boolean;
labelCssName?: string; labelCssName?: string;
caption: string caption: string
} }
const props = withDefaults(defineProps<FormButtonProps>(), { const props = withDefaults(defineProps<FormButtonProps>(), {
visible: true, visible: true,
showCaption: true,
}); });
</script> </script>
<template> <template>
<a-button <app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-formButton">
type="primary" <template #default="{slotStyle, slotClass}">
v-show="visible"> <a-button
<template #icon v-if="cssClass || imagePath"> :class="slotClass"
<AppIconText :iconClass="cssClass" :imgPath="imagePath"/> :style="slotStyle"
</template> type="primary">
<template v-if="showCaption && caption"> <AppIconText :class="labelCssName" :iconClass="iconClass" :imgPath="imagePath" :text="showCaption ? caption : '' "/>
<span :class="labelCssName">{{caption}}</span> </a-button>
</template> </template>
</a-button> </app-col>
</template> </template>
<style lang="scss"> <style lang="scss">
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-druipart.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam, RouteUtil } from '@core'; import { IActionParam, ILayoutOpts, IParam, RouteUtil } from '@core';
import { Subject, Subscription } from 'rxjs'; import { Subject, Subscription } from 'rxjs';
interface FormDruipartProps { interface FormDruipartProps {
// 名称
name: string;
// 布局配置项
layoutOpts: ILayoutOpts;
// 刷新关系项 // 刷新关系项
tempMode?: string; tempMode?: string;
// 禁止加载 // 禁止加载
...@@ -26,15 +30,17 @@ interface FormDruipartProps { ...@@ -26,15 +30,17 @@ interface FormDruipartProps {
viewSubject: Subject<any>; viewSubject: Subject<any>;
// 视图路由参数 // 视图路由参数
parameters?: any[]; parameters?: any[];
// 名称
name: string;
// 是否忽略表单项值变化 // 是否忽略表单项值变化
ignoreFieldValueChange?: boolean; ignoreFieldValueChange?: boolean;
// 是否显示
visible?: boolean;
} }
interface FormDruipartEmit { interface FormDruipartEmit {
(name: 'componentEvent', value: IActionParam): void; (name: 'componentEvent', value: IActionParam): void;
} }
const props = withDefaults(defineProps<FormDruipartProps>(), {}); const props = withDefaults(defineProps<FormDruipartProps>(), {
visible: true,
});
const emit = defineEmits<FormDruipartEmit>(); const emit = defineEmits<FormDruipartEmit>();
...@@ -115,14 +121,18 @@ const viewEvent = (action:any) => { ...@@ -115,14 +121,18 @@ const viewEvent = (action:any) => {
</script> </script>
<template> <template>
<a-card :class="['app-form-druipart', `app-form-druipart-${name}`]" :bordered="false"> <app-col noRoot :visible="visible" :layoutOpts="layoutOpts" :class="['app-form-druipart', `app-form-druipart-${name}`]">
<template #title> <template #default="{slotStyle, slotClass}">
<p :class="['app-form-druipart-title']"> <a-card :class="slotClass" :style="slotStyle" :bordered="false">
<AppIconText :text="title" /> <template #title>
</p> <p :class="['app-form-druipart-title']">
</template> <AppIconText :text="title" />
<slot :context="druipartContext" :viewParams="druipartViewParams" :viewEvent="viewEvent" ></slot> </p>
</a-card> </template>
<slot :context="druipartContext" :viewParams="druipartViewParams" :viewEvent="viewEvent" ></slot>
</a-card>
</template>
</app-col>
</template> </template>
<style lang="scss"> <style lang="scss">
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-group.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam } from "@core"; import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormGroupProps{ interface FormGroupProps {
name: string; name: string;
layoutOpts: ILayoutOpts;
title?: string; title?: string;
imgPath?: string; imgPath?: string;
iconClass?: string; iconClass?: string;
titleStyle?: string; titleClass?: string;
infoGroupMode?: boolean; infoGroupMode?: boolean;
titleBarCloseMode?: number; titleBarCloseMode?: number;
showCaption?: boolean; showCaption?: boolean;
visible?: boolean;
uIActionGroup?: IParam; uIActionGroup?: IParam;
} }
interface FormGroupEmit{ interface FormGroupEmit {
(name: 'componentEvent', value: IActionParam): void (name: 'componentEvent', value: IActionParam): void
} }
const props = withDefaults(defineProps<FormGroupProps>(), { const props = withDefaults(defineProps<FormGroupProps>(), {
infoGroupMode: false, infoGroupMode: false,
showCaption: true, showCaption: true,
visible: true,
titleBarCloseMode: 0, titleBarCloseMode: 0,
}); });
const emit = defineEmits<FormGroupEmit>(); const emit = defineEmits<FormGroupEmit>();
const handleGroupAction = (action: IParam) => { const handleGroupAction = (action: IParam) => {
emit('componentEvent', { tag: props.name, action: 'formGroupAction', data: action}); emit('componentEvent', { tag: props.name, action: 'formGroupAction', data: action });
} }
const handleMenuGroupAction = ($event: IParam) => { const handleMenuGroupAction = ($event: IParam) => {
if (props.uIActionGroup && props.uIActionGroup.details?.length > 0) { if (props.uIActionGroup && props.uIActionGroup.details?.length > 0) {
const details = props.uIActionGroup.details; const details = props.uIActionGroup.details;
const detail = details.find((action: IParam) => Object.is(action.uIActionTag, $event.key)); const detail = details.find((action: IParam) => Object.is(action.uIActionTag, $event.key));
emit('componentEvent', { tag: props.name, action: 'formGroupAction', data: detail}); emit('componentEvent', { tag: props.name, action: 'formGroupAction', data: detail });
} }
} }
</script> </script>
<template> <template>
<app-col :class="['app-form-group', `app-form-group-${name}`]"> <app-col
<a-card noRoot
:headStyle="titleStyle" :visible="visible"
:bordered="false"> :layoutOpts="layoutOpts"
<template v-if="showCaption" #title> :class="['app-form-group', `app-form-group-${name}`]"
<p class="app-form-group-title"> >
<AppIconText :iconClass="iconClass" :imgPath="imgPath" :text="title"/> <template #default="{ slotClass, slotStyle }">
</p> <a-card :class="slotClass" :style="slotStyle" :headStyle="titleClass" :bordered="false">
</template> <template v-if="showCaption" #title>
<template v-if="showCaption" #extra> <p class="app-form-group-title">
<template v-if="uIActionGroup"> <AppIconText :iconClass="iconClass" :imgPath="imgPath" :text="title" />
<template v-if="Object.is(uIActionGroup.extractMode, 'ITEMS')"> </p>
<a-dropdown> </template>
<a class="group-action" @click.prevent> <template v-if="showCaption" #extra>
{{uIActionGroup.caption}} <template v-if="uIActionGroup">
</a> <template v-if="Object.is(uIActionGroup.extractMode, 'ITEMS')">
<template #overlay> <a-dropdown>
<a-menu @click="handleMenuGroupAction"> <a class="group-action" @click.prevent>{{ uIActionGroup.caption }}</a>
<template v-for="(item, index) in uIActionGroup.details" :key="index"> <template #overlay>
<a-menu-item <a-menu @click="handleMenuGroupAction">
v-if="item.visible" <template v-for="(item, index) in uIActionGroup.details" :key="index">
:key="item.uIActionTag" <a-menu-item
:disabled="item.disabled"> v-if="item.visible"
<AppIconText :key="item.uIActionTag"
:iconClass="item.showIcon && item.iconClass" :disabled="item.disabled"
:imgPath="item.showIcon && item.imgPath" >
:text="item.showCaption && item.caption"/> <AppIconText
</a-menu-item> :iconClass="item.showIcon && item.iconClass"
:imgPath="item.showIcon && item.imgPath"
:text="item.showCaption && item.caption"
/>
</a-menu-item>
</template>
</a-menu>
</template> </template>
</a-menu> </a-dropdown>
</template> </template>
</a-dropdown> <template v-else>
</template> <span v-for="(item, index) in uIActionGroup.details" :key="index">
<template v-else> <span v-if="index > 0" class="separator">|</span>
<span v-for="(item, index) in uIActionGroup.details" :key="index"> <a-button
<span v-if="index > 0" class="separator">|</span> v-show="item.visible"
<a-button type="link"
v-show="item.visible" :disabled="item.disabled"
type="link" @click="handleGroupAction(item)"
:disabled="item.disabled" >
@click="handleGroupAction(item)"> <AppIconText
<AppIconText :iconClass="item.showIcon && item.iconClass"
:iconClass="item.showIcon && item.iconClass" :imgPath="item.showIcon && item.imgPath"
:imgPath="item.showIcon && item.imgPath" :text="item.showCaption && item.caption"
:text="item.showCaption && item.caption"/> />
</a-button> </a-button>
</span> </span>
</template>
</template>
</template> </template>
</template> <app-row :layoutOpts="layoutOpts">
<slot></slot>
</app-row>
</a-card>
</template> </template>
<app-row>
<slot></slot>
</app-row>
</a-card>
</app-col> </app-col>
</template> </template>
<style lang="scss"> <style lang="scss">
.app-form-group { .app-form-group {
height: 100%;
width: 100%;
.ant-card-head { .ant-card-head {
text-align: left; text-align: left;
.app-form-group-title { .app-form-group-title {
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-iframe.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam } from "@core"; import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormIframeProps{ interface FormIframeProps{
name: string;
layoutOpts: ILayoutOpts;
visible: boolean; visible: boolean;
iFrameUrl: string iFrameUrl: string
} }
...@@ -12,9 +14,9 @@ const props = withDefaults(defineProps<FormIframeProps>(), { ...@@ -12,9 +14,9 @@ const props = withDefaults(defineProps<FormIframeProps>(), {
</script> </script>
<template> <template>
<div v-show="visible"> <app-col class="app-formDruipart" :visible="visible" :layoutOpts="layoutOpts" v-show="visible">
<iframe :src="iFrameUrl" style="height: 100%;width: 100%;border: 0"></iframe> <iframe class="app-formDruipart__iframe" :src="iFrameUrl" style="height: 100%;width: 100%;border: 0"></iframe>
</div> </app-col>
</template> </template>
<style lang="scss"> <style lang="scss">
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-item.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam } from '@core'; import { IActionParam, ILayoutOpts } from '@core';
interface FormGroupProps { interface FormGroupProps {
name: string; name: string;
layoutOpts?: ILayoutOpts;
label?: string; label?: string;
required?: boolean; required?: boolean;
visible?: boolean;
labelWidth?: number; labelWidth?: number;
rules?: any; rules?: any;
error?: string; error?: string;
titleStyle?: string; labelClass?: string;
} }
interface FormGroupEmit { interface FormGroupEmit {
(name: 'componentEvent', value: IActionParam): void; (name: 'componentEvent', value: IActionParam): void;
} }
const props = withDefaults(defineProps<FormGroupProps>(), { const props = withDefaults(defineProps<FormGroupProps>(), {
required: false, required: false,
visible: true,
}); });
const emit = defineEmits<FormGroupEmit>(); const emit = defineEmits<FormGroupEmit>();
...@@ -39,22 +42,27 @@ const initRules = () => { ...@@ -39,22 +42,27 @@ const initRules = () => {
</script> </script>
<template> <template>
<a-form-item <app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-form-item">
:name="name" <template v-slot:default="{slotStyle, slotClass}">
:rules="itemRules" <a-form-item
:help="error" :class="slotClass"
:required="required" :style="slotStyle"
class="app-form-item" :name="name"
:labelCol="{ style: { width: `${labelWidth}px` } }" :rules="itemRules"
:validateStatus="error ? 'error' : 'validating'" :help="error"
> :required="required"
<template #label> :labelCol="{ style: { width: `${labelWidth}px` } }"
<label :class="titleStyle"> :validateStatus="error ? 'error' : 'validating'"
<div class="label-title">{{ label }}</div> >
</label> <template #label>
<label :class="labelClass">
<div class="label-title">{{ label }}</div>
</label>
</template>
<slot></slot>
</a-form-item>
</template> </template>
<slot></slot> </app-col>
</a-form-item>
</template> </template>
<style lang="scss"> <style lang="scss">
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-page.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam } from "@core"; import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormPageProps{ interface FormPageProps {
visible: boolean; layoutOpts: ILayoutOpts;
cssClass?: string; tab?: string
imagePath?: string;
caption: string
} }
const props = withDefaults(defineProps<FormPageProps>(), { const props = withDefaults(defineProps<FormPageProps>(), {
visible: true,
}); });
</script> </script>
<template> <template>
<a-tab-pane v-show="visible"> <a-tab-pane class="app-formPage" :key="$attrs.key" :tab="tab">
<template #tab> <app-row :layoutOpts="layoutOpts">
<AppIconText :iconClass="cssClass" :imgPath="imagePath" :text="caption"/> <slot></slot>
</template> </app-row>
<slot></slot>
</a-tab-pane> </a-tab-pane>
</template> </template>
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-raw.vue 0 → 100644
浏览文件 @ 3cb85367
<script setup lang="ts">
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormRawProps{
name: string;
layoutOpts: ILayoutOpts;
visible?: boolean;
iconClass?: string;
imgPath?: string;
value?:any;
contentType?: string;
}
const props = withDefaults(defineProps<FormRawProps>(), {
visible: true,
});
</script>
<template>
<app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-formRaw">
<template #default="{slotStyle, slotClass}">
<AppRaw
:class="slotClass"
:style="slotStyle"
:iconClass="iconClass"
:value="value"
:contentType="contentType">
</AppRaw>
</template>
</app-col>
</template>
<style lang="scss">
</style>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-tabpage.vue → modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-tab-page.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { IActionParam, IParam } from "@core"; import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormTabPageProps{ interface FormTabPageProps{
name: string;
layoutOpts: ILayoutOpts;
visible: boolean; visible: boolean;
caption: string caption: string
} }
...@@ -13,8 +15,10 @@ const props = withDefaults(defineProps<FormTabPageProps>(), { ...@@ -13,8 +15,10 @@ const props = withDefaults(defineProps<FormTabPageProps>(), {
</script> </script>
<template> <template>
<a-tab-pane v-show="visible" :tab="caption"> <a-tab-pane class="app-formTabPage" v-show="visible" :tab="caption">
<slot></slot> <app-row :layoutOpts="layoutOpts">
<slot></slot>
</app-row>
</a-tab-pane> </a-tab-pane>
</template> </template>
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-tab-panel.vue 0 → 100644
浏览文件 @ 3cb85367
<script setup lang="ts">
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormTabPanelProps {
name: string;
layoutOpts: ILayoutOpts;
visible?: boolean;
}
const props = withDefaults(defineProps<FormTabPanelProps>(), {
visible: true,
});
</script>
<template>
<app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-formTabPanel">
<template v-slot:default="{ slotStyle, slotClass }">
<a-tabs :class="slotClass" :style="slotStyle">
<slot></slot>
</a-tabs>
</template>
</app-col>
</template>
<style lang="scss">
</style>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-tabpanel.vue 已删除 100644 → 0
浏览文件 @ 7468d06a
<script setup lang="ts">
import { IActionParam, IParam } from "@core";
interface FormTabPanelProps{
}
const props = withDefaults(defineProps<FormTabPanelProps>(), {
});
</script>
<template>
<a-tabs class="app-form-page">
<slot></slot>
</a-tabs>
</template>
<style lang="scss">
</style>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-row.vue
浏览文件 @ 3cb85367
<script setup lang="ts"> <script setup lang="ts">
import { ILayoutPos } from "@core"; import { ILayoutOpts } from "@core";
import { LayoutTool } from "@core/modules/common/layout-tool";
interface AppRowProps{ interface AppRowProps {
layoutPos: ILayoutPos; layoutOpts: ILayoutOpts;
} }
const props = withDefaults(defineProps<AppRowProps>(), { const props = withDefaults(defineProps<AppRowProps>(), {});
}); // 使用布局逻辑获得响应式的layout对象
const layout = LayoutTool.useLayout(toRef(props, "layoutOpts"));
// use通用的layout解析逻辑。
const layoutMode = "";
onMounted(() => {
console.log(props)
});
</script> </script>
<template> <template>
<div v-if="layoutMode == 'FLEX'" class="app-row"> <div
<slot></slot> :style="layout.rowStyle"
</div> v-if="layoutOpts.selfLayout == 'FLEX'" class="app-row app-row--flex">
<a-row v-else class="app-row"> <slot></slot>
<slot></slot> </div>
</a-row> <a-row v-else class="app-row app-row--grid">
<slot></slot>
</a-row>
</template> </template>
<style lang="scss"> <style lang="scss">
.app-row{
width: 100%;
}
</style> </style>
\ No newline at end of file
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-checkbox-list.vue
浏览文件 @ 3cb85367
...@@ -8,7 +8,7 @@ interface CheckboxListProps { ...@@ -8,7 +8,7 @@ interface CheckboxListProps {
* @type {*} * @type {*}
* @memberof CheckboxListProps * @memberof CheckboxListProps
*/ */
value: any; value?: any;
/** /**
* 属性名称 * 属性名称
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-data-picker-view.vue
浏览文件 @ 3cb85367
...@@ -16,7 +16,7 @@ interface DataPickerViewProps { ...@@ -16,7 +16,7 @@ interface DataPickerViewProps {
/** /**
* @description 编辑器值 * @description 编辑器值
*/ */
value: any; value?: any;
/** /**
* @description 禁用 * @description 禁用
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-data-picker.vue
浏览文件 @ 3cb85367
...@@ -16,7 +16,7 @@ interface DataPickerProps { ...@@ -16,7 +16,7 @@ interface DataPickerProps {
/** /**
* @description 编辑器值 * @description 编辑器值
*/ */
value: any; value?: any;
/** /**
* @description 禁用 * @description 禁用
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-list-box.vue
浏览文件 @ 3cb85367
...@@ -8,7 +8,7 @@ interface ListBoxProps { ...@@ -8,7 +8,7 @@ interface ListBoxProps {
* @type {*} * @type {*}
* @memberof ListBoxProps * @memberof ListBoxProps
*/ */
value: any; value?: any;
/** /**
* 属性名称 * 属性名称
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-radio-group.vue
浏览文件 @ 3cb85367
...@@ -8,7 +8,7 @@ interface RadioGroupProps { ...@@ -8,7 +8,7 @@ interface RadioGroupProps {
* @type {*} * @type {*}
* @memberof AppCheckBox * @memberof AppCheckBox
*/ */
value: any; value?: any;
/** /**
* 属性名称 * 属性名称
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/editors/app-span.vue
浏览文件 @ 3cb85367
...@@ -8,7 +8,7 @@ interface SpanProps { ...@@ -8,7 +8,7 @@ interface SpanProps {
* @type {*} * @type {*}
* @memberof AppSpan * @memberof AppSpan
*/ */
value: string; value?: string;
/** /**
* 传入表单数据 * 传入表单数据
......
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/core/interface/common/i-layout-pos.ts
浏览文件 @ 3cb85367
type LayoutMode = 'FLEX' | 'TABLE_24COL' | 'TABLE_12COL';
/** /**
* 布局配置 * 布局配置
* *
* @export * @export
* @interface ILayoutPos * @interface ILayoutOpts
*/ */
export interface ILayoutPos{ export interface ILayoutOpts {
} /**
\ No newline at end of file * 自身的容器布局模式(容器才有)
*/
selfLayout?: LayoutMode;
/**
* 父容器的布局模式（作为子才有）
*/
parentLayout?: LayoutMode;
/**
* Flex横轴对齐方向
*/
align?: string | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around';
/**
* Flex布局方向
*/
dir?: string | 'row' | 'row-reverse' | 'column' | 'column-reverse';
/**
* Flex纵轴对齐方向
*/
vAlign?: string | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
/**
* Flex延伸
* @type {number}
*/
grow?: number;
/**
* 大型列宽
* @type {number}
* @default -1
*/
colLG?: number;
/**
* 大型偏移
* @type {number}
* @default -1
*/
colLGOffset?: number;
/**
* 中型列宽
* @type {number}
* @default -1
*/
colMD?: number;
/**
* 中型偏移
* @type {number}
* @default -1
*/
colMDOffset?: number;
/**
* 小型列宽
* @type {number}
* @default -1
*/
colSM?: number;
/**
* 小型偏移
* @type {number}
* @default -1
*/
colSMOffset?: number;
/**
* 固定列宽
* @type {number}
* @default -1
*/
colWidth?: number;
/**
* 超小列宽
* @type {number}
* @default -1
*/
colXS?: number;
/**
* 超小偏移
* @type {number}
* @default -1
*/
colXSOffset?: number;
}
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/core/modules/common/layout-tool.ts 0 → 100644
浏览文件 @ 3cb85367
import { ILayoutOpts, notEmpty } from '@core';
import { isNumber } from 'qx-util';
import { Ref } from 'vue';
/**
* 布局逻辑工具类
*
* @export
* @class LayoutTool
*/
export class LayoutTool {
/**
* 获取flex布局样式（父容器）
*
* @static
* @param {*} layoutOpts 布局设置
* @returns {string}
* @memberof LayoutTool
*/
public static getRowFlexStyle(layoutOpts: ILayoutOpts): string {
if (layoutOpts?.selfLayout == 'FLEX') {
const { dir, align, vAlign } = layoutOpts;
let cssStyle: string = 'width: 100%; height: 100%; overflow: auto; display: flex;';
cssStyle += dir ? `flex-direction: ${dir};` : '';
cssStyle += align ? `justify-content: ${align};` : '';
cssStyle += vAlign ? `align-items: ${vAlign};` : '';
return cssStyle;
} else {
return '';
}
}
/**
* 获取flex布局样式2(子)
*
* @static
* @param {*} layoutOpts 布局位置
* @returns {string}
* @memberof LayoutTool
*/
public static getColFlexStyle(layoutOpts: ILayoutOpts): string {
if (layoutOpts?.parentLayout == 'FLEX' && notEmpty(layoutOpts.grow)) {
let grow = layoutOpts.grow! < 0 ? 0 : layoutOpts.grow;
return `flex-grow: ${grow};`;
}
return '';
}
/**
* 获取栅格布局参数
*
* @static
* @param {*} layoutOpts
* @memberof LayoutTool
*/
public static getGridOptions(layoutOpts: ILayoutOpts, isTurn24: boolean = true) {
if (layoutOpts.parentLayout != 'TABLE_24COL' && layoutOpts.parentLayout != 'TABLE_12COL') {
return;
}
let colLG = this.formatColSpan(layoutOpts.colLG, layoutOpts.parentLayout);
let colMD = this.formatColSpan(layoutOpts.colMD, layoutOpts.parentLayout);
let colSM = this.formatColSpan(layoutOpts.colSM, layoutOpts.parentLayout);
let colXS = this.formatColSpan(layoutOpts.colXS, layoutOpts.parentLayout);
let colLGOffset = isNumber(layoutOpts.colLGOffset) ? layoutOpts.colLGOffset : 0;
let colMDOffset = isNumber(layoutOpts.colMDOffset) ? layoutOpts.colMDOffset : 0;
let colSMOffset = isNumber(layoutOpts.colSMOffset) ? layoutOpts.colSMOffset : 0;
let colXSOffset = isNumber(layoutOpts.colXSOffset) ? layoutOpts.colXSOffset : 0;
let multiplier = 1;
if (isTurn24) {
multiplier = layoutOpts.parentLayout == 'TABLE_24COL' ? 1 : 2;
}
return {
xs: { span: colXS * multiplier, offset: colXSOffset! * multiplier },
sm: { span: colSM * multiplier, offset: colSMOffset! * multiplier },
md: { span: colMD * multiplier, offset: colMDOffset! * multiplier },
lg: { span: colLG * multiplier, offset: colLGOffset! * multiplier },
};
}
/**
* 格式化栅格的列宽,对超出范围值的作出修改或设置默认值
*
* @static
* @param {*} span 栅格列宽
* @param {string} layoutMode 栅格类型(TABLE_24COL,TABLE_12COL)
* @returns
* @memberof LayoutTool
*/
public static formatColSpan(span: any, layoutMode: string) {
let colDefault = layoutMode == 'TABLE_24COL' ? 24 : 12;
// 空值传默认值
if (!isNumber(span)) {
return colDefault;
}
// 小于0传默认值，大于默认值传默认值，其他传原值
if (span < 0 || span > colDefault) {
return colDefault;
} else {
return span;
}
}
/**
* 使用容器布局逻辑,获得如下返回值
* rowStyle flex布局时作为父容器的样式
* colStyle flex布局时作为子元素的样式
* colGridOpts 栅格布局时作为子元素的占位和偏移
*
* @static
* @param layoutOpts
* @return {*}
*/
public static useLayout(layoutOpts: Ref<ILayoutOpts>) {
// 创建新的ref对象
const layoutResult: Ref<{ rowStyle: string; colStyle: string; colGridOpts: any }> = ref({
rowStyle: '',
colStyle: '',
colGridOpts: {},
});
watch(
layoutOpts,
(newVal, oldVal) => {
layoutResult.value.rowStyle = this.getRowFlexStyle(newVal);
layoutResult.value.colStyle = this.getColFlexStyle(newVal);
layoutResult.value.colGridOpts = this.getGridOptions(newVal);
},
{
immediate: true,
deep: true,
},
);
return layoutResult;
}
}
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/core/utils/util.ts
浏览文件 @ 3cb85367
import { clone } from "ramda"; import { clone } from 'ramda';
/** /**
* @description 克隆方法 * @description 克隆方法
...@@ -6,8 +6,8 @@ import { clone } from "ramda"; ...@@ -6,8 +6,8 @@ import { clone } from "ramda";
* @param {Record<any, any>} data * @param {Record<any, any>} data
* @return {*} {Record<any, any>} * @return {*} {Record<any, any>}
*/ */
export function deepCopy(data: Record<any, any>): Record<any, any>{ export function deepCopy(data: Record<any, any>): Record<any, any> {
return clone(data) return clone(data);
} }
/** /**
...@@ -15,9 +15,9 @@ export function deepCopy(data: Record<any, any>): Record<any, any>{ ...@@ -15,9 +15,9 @@ export function deepCopy(data: Record<any, any>): Record<any, any>{
* @export * @export
* @param {*} FirstOBJ 目标对象 * @param {*} FirstOBJ 目标对象
* @param {*} SecondOBJ 源对象 * @param {*} SecondOBJ 源对象
* @return {*} * @return {*}
*/ */
export function deepObjectMerge(FirstOBJ: any, SecondOBJ: any) { export function deepObjectMerge(FirstOBJ: any, SecondOBJ: any) {
for (var key in SecondOBJ) { for (var key in SecondOBJ) {
FirstOBJ[key] = FirstOBJ[key] =
FirstOBJ[key] && FirstOBJ[key].toString() === '[object Object]' FirstOBJ[key] && FirstOBJ[key].toString() === '[object Object]'
...@@ -37,22 +37,22 @@ export function deepCopy(data: Record<any, any>): Record<any, any>{ ...@@ -37,22 +37,22 @@ export function deepCopy(data: Record<any, any>): Record<any, any>{
export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): string { export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): string {
let ret; let ret;
const opt: any = { const opt: any = {
'Y+': date.getFullYear().toString(), // 年 'Y+': date.getFullYear().toString(), // 年
'M+': (date.getMonth() + 1).toString(), // 月 'M+': (date.getMonth() + 1).toString(), // 月
'd+': date.getDate().toString(), // 日 'd+': date.getDate().toString(), // 日
'D+': date.getDate().toString(), // 日 'D+': date.getDate().toString(), // 日
'H+': date.getHours().toString(), // 时 'H+': date.getHours().toString(), // 时
'h+': date.getHours().toString(), // 时 'h+': date.getHours().toString(), // 时
'm+': date.getMinutes().toString(), // 分 'm+': date.getMinutes().toString(), // 分
's+': date.getSeconds().toString(), // 秒 's+': date.getSeconds().toString(), // 秒
'S+': date.getSeconds().toString() 'S+': date.getSeconds().toString(),
// 有其他格式化字符需求可以继续添加，必须转化成字符串 // 有其他格式化字符需求可以继续添加，必须转化成字符串
}; };
for (let k in opt) { for (let k in opt) {
ret = new RegExp('(' + k + ')').exec(fmt); ret = new RegExp('(' + k + ')').exec(fmt);
if (ret) { if (ret) {
fmt = fmt.replace(ret[1], ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, '0')); fmt = fmt.replace(ret[1], ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, '0'));
} }
} }
return fmt; return fmt;
} }
...@@ -63,7 +63,7 @@ export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): stri ...@@ -63,7 +63,7 @@ export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): stri
* @param {*} arg * @param {*} arg
* @return {*} {boolean} * @return {*} {boolean}
*/ */
export function isExist(arg: any): boolean{ export function isExist(arg: any): boolean {
return arg !== undefined && arg !== null && arg === arg; return arg !== undefined && arg !== null && arg === arg;
} }
...@@ -83,7 +83,7 @@ export function isEmpty(value: any): boolean { ...@@ -83,7 +83,7 @@ export function isEmpty(value: any): boolean {
* @param {*} arg * @param {*} arg
* @return {*} {boolean} * @return {*} {boolean}
*/ */
export function notEmpty(arg: any): boolean{ export function notEmpty(arg: any): boolean {
return isExist(arg) && arg != ''; return isExist(arg) && arg != '';
} }
...@@ -91,9 +91,9 @@ export function notEmpty(arg: any): boolean{ ...@@ -91,9 +91,9 @@ export function notEmpty(arg: any): boolean{
* @description 是否拥有某个方法 * @description 是否拥有某个方法
* @param {*} arg 校验对象 * @param {*} arg 校验对象
* @param fnName 方法名 * @param fnName 方法名
* @return {*} * @return {*}
*/ */
export function hasFunction(arg: any, fnName: string): boolean{ export function hasFunction(arg: any, fnName: string): boolean {
return arg[fnName] && arg[fnName] instanceof Function; return arg[fnName] && arg[fnName] instanceof Function;
} }
...@@ -137,7 +137,7 @@ export function typeOf(obj: any): string { ...@@ -137,7 +137,7 @@ export function typeOf(obj: any): string {
* @param {*} value2 对比值 * @param {*} value2 对比值
* @return {*} {boolean} * @return {*} {boolean}
*/ */
export function verifyValue(value: any, op: any, value2: any): boolean { export function verifyValue(value: any, op: any, value2: any): boolean {
// 等于操作 // 等于操作
if (Object.is(op, 'EQ')) { if (Object.is(op, 'EQ')) {
const _value = `${value}`; const _value = `${value}`;
...@@ -338,38 +338,50 @@ function contains(value: any, value2: any): boolean { ...@@ -338,38 +338,50 @@ function contains(value: any, value2: any): boolean {
* 设置sessionStorage数据 * 设置sessionStorage数据
* *
*/ */
export const setSessionStorage: Function = (key: string, value: any) => { export const setSessionStorage: Function = (key: string, value: any) => {
if (!value) { if (!value) {
return; return;
} }
sessionStorage.setItem(key, JSON.stringify(value)); sessionStorage.setItem(key, JSON.stringify(value));
} };
/** /**
* 获取sessionStorage数据 * 获取sessionStorage数据
* *
*/ */
export const getSessionStorage: Function = (key: string) => { export const getSessionStorage: Function = (key: string) => {
if (!key) { if (!key) {
return null; return null;
} }
let value = sessionStorage.getItem(key); let value = sessionStorage.getItem(key);
if (value) { if (value) {
return JSON.parse(value); return JSON.parse(value);
} else { } else {
return value; return value;
} }
} };
/** /**
* 删除sessionStorage数据 * 删除sessionStorage数据
* *
*/ */
export const removeSessionStorage: Function = (key: string) => { export const removeSessionStorage: Function = (key: string) => {
if (!key) { if (!key) {
return; return;
} }
if (sessionStorage.getItem(key)) { if (sessionStorage.getItem(key)) {
sessionStorage.removeItem(key); sessionStorage.removeItem(key);
}
};
/**
* style对象转换成字符串
*
*/
export const styleObj2Str: Function = (style: any) => {
let s = "";
for (let i in style) {
s += i + ':' + style[i]+";";
} }
} return s;
\ No newline at end of file };
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/widgets/{{appEntities}}/{{ctrls@PORTLET}}-portlet/{{ctrls@PORTLET}}-portlet-state.ts.hbs
浏览文件 @ 3cb85367
...@@ -9,7 +9,7 @@ export const ctrlState = { ...@@ -9,7 +9,7 @@ export const ctrlState = {
{{#if ctrl.psSysImage.cssClass}} {{#if ctrl.psSysImage.cssClass}}
iconcls: '{{ctrl.psSysImage.cssClass}}', iconcls: '{{ctrl.psSysImage.cssClass}}',
{{else if (ctrl.psSysImage.imagePath)}} {{else if (ctrl.psSysImage.imagePath)}}
imagePath: '{{ctrl.psSysImage.imagePath}}', imgPath: '{{ctrl.psSysImage.imagePath}}',
{{/if}} {{/if}}
{{/if}} {{/if}}
{{#if ctrl.psLayoutPos.height}} {{#if ctrl.psLayoutPos.height}}
...@@ -33,7 +33,7 @@ export const ctrlState = { ...@@ -33,7 +33,7 @@ export const ctrlState = {
showCaption:{{groupDetail.showCaption}}, showCaption:{{groupDetail.showCaption}},
actionName: '{{groupDetail.psUIAction.caption}}', actionName: '{{groupDetail.psUIAction.caption}}',
icon: '{{groupDetail.psUIAction.psSysImage.cssClass}}', icon: '{{groupDetail.psUIAction.psSysImage.cssClass}}',
imagePath: '{{groupDetail.psUIAction.psSysImage.imagePath}}', imgPath: '{{groupDetail.psUIAction.psSysImage.imagePath}}',
disabled: false, visabled: true, disabled: false, visabled: true,
dataAccessAction: {{#if groupDetail.psUIAction.dataAccessAction}}false{{else}}true{{/if}}, dataAccessAction: {{#if groupDetail.psUIAction.dataAccessAction}}false{{else}}true{{/if}},
getNoPrivDisplayMode: {{#if groupDetail.psUIAction.noPrivDisplayMode}}groupDetail.psUIAction.noPrivDisplayMode{{else}}6{{/if}}, getNoPrivDisplayMode: {{#if groupDetail.psUIAction.noPrivDisplayMode}}groupDetail.psUIAction.noPrivDisplayMode{{else}}6{{/if}},
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或