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'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppFormButton
<AppFormButton
name="{{item.codeName}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
:visible="state.detailsModel.{{item.codeName}}.visible"
class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.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}}"
cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}"
imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}"
{{/if}}
{{#if item.psSysImage.cssClass}}
iconClass="{{item.psSysImage.cssClass}}"
{{/if}}
{{#if item.psSysImage.imagePath}}
imgPath="{{item.psSysImage.imagePath}}"
{{/if}}
:showCaption="{{item.showCaption}}"
labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}"
caption="{{#if item.caption}}{{item.caption}}{{/if}}"
/>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormButton
:visible="state.detailsModel.{{item.codeName}}.visible"
class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}"
imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}"
:showCaption="{{item.showCaption}}"
labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}"
caption="{{#if item.caption}}{{item.caption}}{{/if}}"
/>
</a-col>
{{/eq}}
\ No newline at end of file
{{#if item.labelPSSysCss}}
labelCssName="{{item.labelPSSysCss.cssName}}"
{{/if}}
{{#if item.caption}}
caption="{{item.caption}}"
{{/if}}
/>
\ 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 @@
relatedDetailNames: '{{groupLogic.relatedDetailNames}}',
logicCat: '{{groupLogic.logicCat}}',
logicType: '{{groupLogic.logicType}}',
notMode: '{{groupLogic.notMode}}',
notMode: {{groupLogic.notMode}},
logics: [
{{#each groupLogic.psDEFDLogics as | logic |}}
{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'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppFormDruipart
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}}"
<AppFormDruipart
name="{{item.codeName}}"
title="{{item.caption}}"
:visible="state.detailsModel.{{item.codeName}}.visible"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.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}}
:context="context"
:viewParams="viewParams"
:data="state.data"
:viewSubject="state.viewSubject"
v-slot="druipartParams">
:viewSubject="state.viewSubject">
<template #default="druipartParams">
<{{item.psAppView.codeName}}
:class="['app-view-layout--from-druipart']"
:context="druipartParams.context"
......@@ -20,31 +23,5 @@
@viewEvent="druipartParams.viewEvent"
>
</{{item.psAppView.codeName}}>
</AppFormDruipart>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormDruipart
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
</template>
</AppFormDruipart>
\ 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'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppFormGroup
v-show="state.detailsModel.{{item.codeName}}.visible"
<AppFormGroup
name="{{item.codeName}}"
title="{{item.caption}}"
{{#if item.psSysCss}}
:visible="state.detailsModel.{{item.codeName}}.visible"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#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}}
{{#if item.labelPSSysCss}}
titleClass="{{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.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}}
{{/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>
</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
</AppFormGroup>
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-iframe.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppFormIframe
<AppFormIframe
name="{{item.codeName}}"
: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}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if (or item.contentHeight item.contentWidth)}}
style="{{#if item.contentHeight}}height: {{item.contentHeight}}px;{{/if}}{{#if item.contentWidth}}width: {{item.contentWidth}}px;{{/if}}"
{{/if}}
iFrameUrl="{{item.iFrameUrl}}"
/>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
<AppFormIframe
: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
/>
\ 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}}
{{#neq item.psEditor.editorType "HIDDEN"}}
{{#eq item.psLayoutPos 'FLEX'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<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}}"
:required="state.detailsModel.{{item.codeName}}.required"
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}}"
:rules="state.rules.{{item.codeName}}"
:required="state.detailsModel.{{item.codeName}}.required"
label="{{item.caption}}"
style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}">
{{#if item.psEditor}}
:visible="state.detailsModel.{{item.codeName}}.visible"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if item.labelPSSysCss}}
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}}
{{/if}}
</AppFormItem>
</a-col>
{{/eq}}
{{/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
name="{{item.codeName}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=item.psLayout layoutPos=item.psLayoutPos}}"
:visible="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{/if}}
key="{{item.codeName}}"
{{#if item.psSysImage}}
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}}"
tab="{{#if item.caption}}{{item.caption}}{{/if}}"
>
{{#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}}">
<template #tab>
<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}}"/>
</template>
{{#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}}
</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'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
<AppRaw
<AppRaw
name="{{item.codeName}}"
v-show="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
:visible="state.detailsModel.{{item.codeName}}.visible"
{{#if item.psSysCss}}
class="{{item.psSysCss.cssName}}"
{{/if}}
{{#if item.psSysImage}}
{{/if}}
{{#if item.psSysImage}}
{{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}}
{{/if}}
{{/if}}
contentType="{{item.contentType}}"
style="{{#if item.rawItemHeight}}height: {{item.rawItemHeight}}px;{{/if}}{{#if item.rawItemWidth}}width: {{item.rawItemWidth}}px{{/if}}"
{{#if (or item.rawItemHeight item.rawItemWidth)}}
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}}/>
</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
name="{{item.codeName}}"
: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}}"
{{/if}}
{{/if}}
key="{{item.codeName}}"
caption="{{#if item.caption}}{{item.caption}}{{/if}}"
>
{{#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}}
</AppFormTabpage>
modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-tabpanel.hbs
浏览文件 @ 3cb85367
{{#eq item.psLayoutPos 'FLEX'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};" {{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}}>
<AppFormTabpanel>
<AppFormTabpanel
:visible="state.detailsModel.{{item.codeName}}.visible"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=formDetail.psLayout layoutPos=formDetail.psLayoutPos}}"
name={{item.name}}>
{{#each item.psDEFormPages as | formPage | }}
{{>(lookup . 'formPage.detailType') item=formPage }}
{{/each}}
</AppFormTabpanel>
</div>
{{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}}
</AppFormTabpanel>
modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-col.vue
浏览文件 @ 3cb85367
<script setup lang="ts">
import { ILayoutPos } from "@core";
import { ILayoutOpts, LayoutTool, styleObj2Str } from "@core";
import { isObject } from "qx-util";
interface AppColProps{
layoutPos: ILayoutPos;
interface AppColProps {
layoutOpts?: ILayoutOpts,
noRoot?: boolean,
visible?: boolean,
}
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>
<template>
<div v-if="layoutMode == 'FLEX'" class="app-col">
<slot></slot>
</div>
<a-col v-else class="app-col">
<slot></slot>
</a-col>
<template v-if="!hasRoot">
<!-- 没有根元素的直接输出插槽 -->
<slot :slotStyle="slotStyle" :slotClass="slotClass"></slot>
</template>
<div
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>
<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-button.vue
浏览文件 @ 3cb85367
<script setup lang="ts">
import { IActionParam, IParam } from "@core";
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormButtonProps{
visible: boolean;
cssClass?: string;
imagePath?: string;
name: string;
layoutOpts: ILayoutOpts;
visible?: boolean;
iconClass?: string;
imgPath?: string;
showCaption?: boolean;
labelCssName?: string;
caption: string
}
const props = withDefaults(defineProps<FormButtonProps>(), {
visible: true,
showCaption: true,
});
</script>
<template>
<app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-formButton">
<template #default="{slotStyle, slotClass}">
<a-button
type="primary"
v-show="visible">
<template #icon v-if="cssClass || imagePath">
<AppIconText :iconClass="cssClass" :imgPath="imagePath"/>
</template>
<template v-if="showCaption && caption">
<span :class="labelCssName">{{caption}}</span>
</template>
:class="slotClass"
:style="slotStyle"
type="primary">
<AppIconText :class="labelCssName" :iconClass="iconClass" :imgPath="imagePath" :text="showCaption ? caption : '' "/>
</a-button>
</template>
</app-col>
</template>
<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">
import { IActionParam, IParam, RouteUtil } from '@core';
import { IActionParam, ILayoutOpts, IParam, RouteUtil } from '@core';
import { Subject, Subscription } from 'rxjs';
interface FormDruipartProps {
// 名称
name: string;
// 布局配置项
layoutOpts: ILayoutOpts;
// 刷新关系项
tempMode?: string;
// 禁止加载
......@@ -26,15 +30,17 @@ interface FormDruipartProps {
viewSubject: Subject<any>;
// 视图路由参数
parameters?: any[];
// 名称
name: string;
// 是否忽略表单项值变化
ignoreFieldValueChange?: boolean;
// 是否显示
visible?: boolean;
}
interface FormDruipartEmit {
(name: 'componentEvent', value: IActionParam): void;
}
const props = withDefaults(defineProps<FormDruipartProps>(), {});
const props = withDefaults(defineProps<FormDruipartProps>(), {
visible: true,
});
const emit = defineEmits<FormDruipartEmit>();
......@@ -115,7 +121,9 @@ const viewEvent = (action:any) => {
</script>
<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 #default="{slotStyle, slotClass}">
<a-card :class="slotClass" :style="slotStyle" :bordered="false">
<template #title>
<p :class="['app-form-druipart-title']">
<AppIconText :text="title" />
......@@ -123,6 +131,8 @@ const viewEvent = (action:any) => {
</template>
<slot :context="druipartContext" :viewParams="druipartViewParams" :viewEvent="viewEvent" ></slot>
</a-card>
</template>
</app-col>
</template>
<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">
import { IActionParam, IParam } from "@core";
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormGroupProps{
interface FormGroupProps {
name: string;
layoutOpts: ILayoutOpts;
title?: string;
imgPath?: string;
iconClass?: string;
titleStyle?: string;
titleClass?: string;
infoGroupMode?: boolean;
titleBarCloseMode?: number;
showCaption?: boolean;
visible?: boolean;
uIActionGroup?: IParam;
}
interface FormGroupEmit{
interface FormGroupEmit {
(name: 'componentEvent', value: IActionParam): void
}
const props = withDefaults(defineProps<FormGroupProps>(), {
infoGroupMode: false,
showCaption: true,
visible: true,
titleBarCloseMode: 0,
});
const emit = defineEmits<FormGroupEmit>();
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) => {
if (props.uIActionGroup && props.uIActionGroup.details?.length > 0) {
const details = props.uIActionGroup.details;
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>
<template>
<app-col :class="['app-form-group', `app-form-group-${name}`]">
<a-card
:headStyle="titleStyle"
:bordered="false">
<app-col
noRoot
:visible="visible"
:layoutOpts="layoutOpts"
:class="['app-form-group', `app-form-group-${name}`]"
>
<template #default="{ slotClass, slotStyle }">
<a-card :class="slotClass" :style="slotStyle" :headStyle="titleClass" :bordered="false">
<template v-if="showCaption" #title>
<p class="app-form-group-title">
<AppIconText :iconClass="iconClass" :imgPath="imgPath" :text="title"/>
<AppIconText :iconClass="iconClass" :imgPath="imgPath" :text="title" />
</p>
</template>
<template v-if="showCaption" #extra>
<template v-if="uIActionGroup">
<template v-if="Object.is(uIActionGroup.extractMode, 'ITEMS')">
<a-dropdown>
<a class="group-action" @click.prevent>
{{uIActionGroup.caption}}
</a>
<a class="group-action" @click.prevent>{{ uIActionGroup.caption }}</a>
<template #overlay>
<a-menu @click="handleMenuGroupAction">
<template v-for="(item, index) in uIActionGroup.details" :key="index">
<a-menu-item
v-if="item.visible"
:key="item.uIActionTag"
:disabled="item.disabled">
:disabled="item.disabled"
>
<AppIconText
:iconClass="item.showIcon && item.iconClass"
:imgPath="item.showIcon && item.imgPath"
:text="item.showCaption && item.caption"/>
:text="item.showCaption && item.caption"
/>
</a-menu-item>
</template>
</a-menu>
......@@ -74,27 +81,28 @@ const handleMenuGroupAction = ($event: IParam) => {
v-show="item.visible"
type="link"
:disabled="item.disabled"
@click="handleGroupAction(item)">
@click="handleGroupAction(item)"
>
<AppIconText
:iconClass="item.showIcon && item.iconClass"
:imgPath="item.showIcon && item.imgPath"
:text="item.showCaption && item.caption"/>
:text="item.showCaption && item.caption"
/>
</a-button>
</span>
</template>
</template>
</template>
<app-row>
<app-row :layoutOpts="layoutOpts">
<slot></slot>
</app-row>
</a-card>
</template>
</app-col>
</template>
<style lang="scss">
.app-form-group {
height: 100%;
width: 100%;
.ant-card-head {
text-align: left;
.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">
import { IActionParam, IParam } from "@core";
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormIframeProps{
name: string;
layoutOpts: ILayoutOpts;
visible: boolean;
iFrameUrl: string
}
......@@ -12,9 +14,9 @@ const props = withDefaults(defineProps<FormIframeProps>(), {
</script>
<template>
<div v-show="visible">
<iframe :src="iFrameUrl" style="height: 100%;width: 100%;border: 0"></iframe>
</div>
<app-col class="app-formDruipart" :visible="visible" :layoutOpts="layoutOpts" v-show="visible">
<iframe class="app-formDruipart__iframe" :src="iFrameUrl" style="height: 100%;width: 100%;border: 0"></iframe>
</app-col>
</template>
<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">
import { IActionParam } from '@core';
import { IActionParam, ILayoutOpts } from '@core';
interface FormGroupProps {
name: string;
layoutOpts?: ILayoutOpts;
label?: string;
required?: boolean;
visible?: boolean;
labelWidth?: number;
rules?: any;
error?: string;
titleStyle?: string;
labelClass?: string;
}
interface FormGroupEmit {
(name: 'componentEvent', value: IActionParam): void;
}
const props = withDefaults(defineProps<FormGroupProps>(), {
required: false,
visible: true,
});
const emit = defineEmits<FormGroupEmit>();
......@@ -39,22 +42,27 @@ const initRules = () => {
</script>
<template>
<app-col :visible="visible" noRoot :layoutOpts="layoutOpts" class="app-form-item">
<template v-slot:default="{slotStyle, slotClass}">
<a-form-item
:class="slotClass"
:style="slotStyle"
:name="name"
:rules="itemRules"
:help="error"
:required="required"
class="app-form-item"
:labelCol="{ style: { width: `${labelWidth}px` } }"
:validateStatus="error ? 'error' : 'validating'"
>
<template #label>
<label :class="titleStyle">
<label :class="labelClass">
<div class="label-title">{{ label }}</div>
</label>
</template>
<slot></slot>
</a-form-item>
</template>
</app-col>
</template>
<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">
import { IActionParam, IParam } from "@core";
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormPageProps{
visible: boolean;
cssClass?: string;
imagePath?: string;
caption: string
interface FormPageProps {
layoutOpts: ILayoutOpts;
tab?: string
}
const props = withDefaults(defineProps<FormPageProps>(), {
visible: true,
});
</script>
<template>
<a-tab-pane v-show="visible">
<template #tab>
<AppIconText :iconClass="cssClass" :imgPath="imagePath" :text="caption"/>
</template>
<a-tab-pane class="app-formPage" :key="$attrs.key" :tab="tab">
<app-row :layoutOpts="layoutOpts">
<slot></slot>
</app-row>
</a-tab-pane>
</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">
import { IActionParam, IParam } from "@core";
import { IActionParam, ILayoutOpts, IParam } from "@core";
interface FormTabPageProps{
name: string;
layoutOpts: ILayoutOpts;
visible: boolean;
caption: string
}
......@@ -13,8 +15,10 @@ const props = withDefaults(defineProps<FormTabPageProps>(), {
</script>
<template>
<a-tab-pane v-show="visible" :tab="caption">
<a-tab-pane class="app-formTabPage" v-show="visible" :tab="caption">
<app-row :layoutOpts="layoutOpts">
<slot></slot>
</app-row>
</a-tab-pane>
</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">
import { ILayoutPos } from "@core";
import { ILayoutOpts } from "@core";
import { LayoutTool } from "@core/modules/common/layout-tool";
interface AppRowProps{
layoutPos: ILayoutPos;
interface AppRowProps {
layoutOpts: ILayoutOpts;
}
const props = withDefaults(defineProps<AppRowProps>(), {
const props = withDefaults(defineProps<AppRowProps>(), {});
});
// use通用的layout解析逻辑。
const layoutMode = "";
onMounted(() => {
console.log(props)
});
// 使用布局逻辑获得响应式的layout对象
const layout = LayoutTool.useLayout(toRef(props, "layoutOpts"));
</script>
<template>
<div v-if="layoutMode == 'FLEX'" class="app-row">
<div
:style="layout.rowStyle"
v-if="layoutOpts.selfLayout == 'FLEX'" class="app-row app-row--flex">
<slot></slot>
</div>
<a-row v-else class="app-row">
</div>
<a-row v-else class="app-row app-row--grid">
<slot></slot>
</a-row>
</a-row>
</template>
<style lang="scss">
.app-row{
width: 100%;
}
</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 {
* @type {*}
* @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 {
/**
* @description 编辑器值
*/
value: any;
value?: any;
/**
* @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 {
/**
* @description 编辑器值
*/
value: any;
value?: any;
/**
* @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 {
* @type {*}
* @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 {
* @type {*}
* @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 {
* @type {*}
* @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
* @interface ILayoutPos
* @interface ILayoutOpts
*/
export interface ILayoutPos{
export interface ILayoutOpts {
/**
* 自身的容器布局模式(容器才有)
*/
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 克隆方法
......@@ -6,8 +6,8 @@ import { clone } from "ramda";
* @param {Record<any, any>} data
* @return {*} {Record<any, any>}
*/
export function deepCopy(data: Record<any, any>): Record<any, any>{
return clone(data)
export function deepCopy(data: Record<any, any>): Record<any, any> {
return clone(data);
}
/**
......@@ -17,7 +17,7 @@ export function deepCopy(data: Record<any, any>): Record<any, any>{
* @param {*} SecondOBJ 源对象
* @return {*}
*/
export function deepObjectMerge(FirstOBJ: any, SecondOBJ: any) {
export function deepObjectMerge(FirstOBJ: any, SecondOBJ: any) {
for (var key in SecondOBJ) {
FirstOBJ[key] =
FirstOBJ[key] && FirstOBJ[key].toString() === '[object Object]'
......@@ -45,7 +45,7 @@ export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): stri
'h+': date.getHours().toString(), // 时
'm+': date.getMinutes().toString(), // 分
's+': date.getSeconds().toString(), // 秒
'S+': date.getSeconds().toString()
'S+': date.getSeconds().toString(),
// 有其他格式化字符需求可以继续添加，必须转化成字符串
};
for (let k in opt) {
......@@ -63,7 +63,7 @@ export function dateFormat(date: any, fmt: string = 'YYYY-MM-DD HH:mm:ss'): stri
* @param {*} arg
* @return {*} {boolean}
*/
export function isExist(arg: any): boolean{
export function isExist(arg: any): boolean {
return arg !== undefined && arg !== null && arg === arg;
}
......@@ -83,7 +83,7 @@ export function isEmpty(value: any): boolean {
* @param {*} arg
* @return {*} {boolean}
*/
export function notEmpty(arg: any): boolean{
export function notEmpty(arg: any): boolean {
return isExist(arg) && arg != '';
}
......@@ -93,7 +93,7 @@ export function notEmpty(arg: any): boolean{
* @param fnName 方法名
* @return {*}
*/
export function hasFunction(arg: any, fnName: string): boolean{
export function hasFunction(arg: any, fnName: string): boolean {
return arg[fnName] && arg[fnName] instanceof Function;
}
......@@ -137,7 +137,7 @@ export function typeOf(obj: any): string {
* @param {*} value2 对比值
* @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')) {
const _value = `${value}`;
......@@ -338,17 +338,17 @@ function contains(value: any, value2: any): boolean {
* 设置sessionStorage数据
*
*/
export const setSessionStorage: Function = (key: string, value: any) => {
export const setSessionStorage: Function = (key: string, value: any) => {
if (!value) {
return;
}
sessionStorage.setItem(key, JSON.stringify(value));
}
};
/**
* 获取sessionStorage数据
*
*/
* 获取sessionStorage数据
*
*/
export const getSessionStorage: Function = (key: string) => {
if (!key) {
return null;
......@@ -359,12 +359,12 @@ export const getSessionStorage: Function = (key: string) => {
} else {
return value;
}
}
};
/**
* 删除sessionStorage数据
*
*/
* 删除sessionStorage数据
*
*/
export const removeSessionStorage: Function = (key: string) => {
if (!key) {
return;
......@@ -372,4 +372,16 @@ export const removeSessionStorage: Function = (key: string) => {
if (sessionStorage.getItem(key)) {
sessionStorage.removeItem(key);
}
}
\ No newline at end of file
};
/**
* style对象转换成字符串
*
*/
export const styleObj2Str: Function = (style: any) => {
let s = "";
for (let i in style) {
s += i + ':' + style[i]+";";
}
return s;
};
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 = {
{{#if ctrl.psSysImage.cssClass}}
iconcls: '{{ctrl.psSysImage.cssClass}}',
{{else if (ctrl.psSysImage.imagePath)}}
imagePath: '{{ctrl.psSysImage.imagePath}}',
imgPath: '{{ctrl.psSysImage.imagePath}}',
{{/if}}
{{/if}}
{{#if ctrl.psLayoutPos.height}}
......@@ -33,7 +33,7 @@ export const ctrlState = {
showCaption:{{groupDetail.showCaption}},
actionName: '{{groupDetail.psUIAction.caption}}',
icon: '{{groupDetail.psUIAction.psSysImage.cssClass}}',
imagePath: '{{groupDetail.psUIAction.psSysImage.imagePath}}',
imgPath: '{{groupDetail.psUIAction.psSysImage.imagePath}}',
disabled: false, visabled: true,
dataAccessAction: {{#if groupDetail.psUIAction.dataAccessAction}}false{{else}}true{{/if}},
getNoPrivDisplayMode: {{#if groupDetail.psUIAction.noPrivDisplayMode}}groupDetail.psUIAction.noPrivDisplayMode{{else}}6{{/if}},
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或