提交 1172dead 编写于 作者: Mosher's avatar Mosher

update:更新数据看板视图

上级 62af6348
...@@ -9,16 +9,16 @@ ...@@ -9,16 +9,16 @@
{{#if portlet.psSysImage.imagePath}}imgPath="{{portlet.psSysImage.imagePath}}"{{else if portlet.psSysImage.cssClass}}iconClass="{{portlet.psSysImage.cssClass}}"{{/if}} {{#if portlet.psSysImage.imagePath}}imgPath="{{portlet.psSysImage.imagePath}}"{{else if portlet.psSysImage.cssClass}}iconClass="{{portlet.psSysImage.cssClass}}"{{/if}}
{{/if}} {{/if}}
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=portlet.psLayout layoutPos=portlet.psLayoutPos}}" :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=portlet.psLayout layoutPos=portlet.psLayoutPos}}"
class="app-portletContainer {{portlet.psSysCss.cssName}}" class="app-portlet-container {{portlet.psSysCss.cssName}}"
{{#if (or portlet.width portlet.height)}} {{#if (or portlet.width portlet.height)}}
style="{{#if portlet.width}}width: {{portlet.width}}px;{{/if}}{{#if portlet.height}}height: {{portlet.height}}px;{{/if}}" style="{{#if portlet.width}}width: {{portlet.width}}px;{{/if}}{{#if portlet.height}}height: {{portlet.height}}px;{{/if}}"
{{/if}} {{/if}}
> >
{{#each portlet.psControls as | subPortlet | }} {{#each portlet.psControls as | subPortlet | }}
{{#eq subPortlet.portletType 'CONTAINER'}} {{#eq subPortlet.portletType 'CONTAINER'}}
{{> @macro/front-end/widgets/dashboard-detail/include-dashboard.hbs type='PORTLET_CONTAINER' portlet=subPortlet}} {{> @macro/front-end/widgets/dashboard-detail/include-dashboard.hbs type='PORTLET_CONTAINER' portlet=subPortlet}}
{{else}} {{else}}
{{> @macro/front-end/widgets/dashboard-detail/include-dashboard.hbs type='PORTLET' portlet=subPortlet}} {{> @macro/front-end/widgets/dashboard-detail/include-dashboard.hbs type='PORTLET' portlet=subPortlet}}
{{/eq}} {{/eq}}
{{/each}} {{/each}}
</AppPortletCard> </AppPortletCard>
{{#eq portlet.portletType 'CONTAINER'}} {{#eq portlet.portletType 'CONTAINER'}}
{{#if portlet.psControls}} {{#if portlet.psControls}}
<div class="portlet-card" :bordered="false" dis-hover :padding="0"> <div class="portlet-card" :bordered="false" dis-hover :padding="0">
{{else}} {{else}}
<div class="portlet-card custom-card" :bordered="false" dis-hover :padding="10"> <div class="portlet-card custom-card" :bordered="false" dis-hover :padding="10">
{{/if}} {{/if}}
{{#if (and portlet.showTitleBar portlet.title)}} {{#if (and portlet.showTitleBar portlet.title)}}
<div class="portlet-card-title">{{portlet.title}}</div> <div class="portlet-card-title">{{portlet.title}}</div>
{{/if}} {{/if}}
<div class="portlet-container"> <div class="portlet-container">
{{>(lookup 'DASHBOARD') ctrl=portlet}} {{>(lookup 'DASHBOARD') ctrl=portlet}}
</div> </div>
</div> </div>
{{else}} {{else}}
<{{codeName}}Portlet <{{codeName}}Portlet
ref="portlet" ref="portlet"
name="{{portlet.name}}" name="{{portlet.name}}"
:context="state.context" :context="state.context"
:viewParams="state.viewParams" :viewParams="state.viewParams"
:viewSubject="state.viewSubject" :viewSubject="state.viewSubject"
@ctrlEvent="onCtrlEvent" :parent="dashboardControl"
></{{codeName}}Portlet> @ctrlEvent="onCtrlEvent"
{{/eq}} ></{{codeName}}Portlet>
\ No newline at end of file {{/eq}}
<{{codeName}}Portlet <{{codeName}}Portlet
ref="portlet" ref="portlet"
name="{{portlet.name}}" name="{{portlet.name}}"
{{#if portlet.caption}}
title="{{portlet.caption}}"
{{/if}}
:showCaption="{{#if portlet.isShowTitleBar}}true{{else}}false{{/if}}" :showCaption="{{#if portlet.isShowTitleBar}}true{{else}}false{{/if}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=portlet.psLayout layoutPos=portlet.psLayoutPos}}"
{{#if portlet.psSysImage}}
{{#if portlet.psSysImage.imagePath}}imgPath="{{portlet.psSysImage.imagePath}}"{{else if portlet.psSysImage.cssClass}}iconClass="{{portlet.psSysImage.cssClass}}"{{/if}}
{{/if}}
{{#if portlet.psSysCss}}
class="{{portlet.psSysCss.cssName}}"
{{/if}}
{{#if (or portlet.width portlet.height)}}
style="{{#if portlet.width}}width: {{portlet.width}}px;{{/if}}{{#if portlet.height}}height: {{portlet.height}}px;{{/if}}"
{{/if}}
:context="state.context" :context="state.context"
:viewParams="state.viewParams" :viewParams="state.viewParams"
:viewSubject="state.viewSubject" :viewSubject="state.viewSubject"
:parent="dashboardControl"
@ctrlEvent="onCtrlEvent" @ctrlEvent="onCtrlEvent"
/> />
...@@ -22,22 +22,22 @@ const layout = LayoutTool.useLayout(toRef(props, "layoutOpts")); ...@@ -22,22 +22,22 @@ const layout = LayoutTool.useLayout(toRef(props, "layoutOpts"));
</script> </script>
<template> <template>
<AppCol class="app-portletCard" :layoutOpts="layoutOpts"> <AppCol class="app-portlet-card" :layoutOpts="layoutOpts">
<div class="app-portletCard__head"> <div class="app-portlet-card__head">
<div class="app-portletCard__headLeft"> <div class="app-portlet-card__head-left">
<slot name="header-left"> <slot name="header-left">
<AppIconText v-if="showCaption" :text="title" :imgPath="imgPath" :iconClass="iconClass"/> <AppIconText v-if="showCaption" :text="title" :imgPath="imgPath" :iconClass="iconClass"/>
</slot> </slot>
</div> </div>
<div class="app-portletCard__headerRight"> <div class="app-portlet-card__header-right">
<slot name="header-right"></slot> <slot name="header-right"></slot>
</div> </div>
</div> </div>
<div class="app-portletCard__body"> <div class="app-portlet-card__body">
<AppRow v-if="isContainer" :layoutOpts="layoutOpts"> <AppRow v-if="isContainer" :layoutOpts="layoutOpts">
<slot></slot> <slot></slot>
</AppRow> </AppRow>
<template v-else > <template v-else>
<slot></slot> <slot></slot>
</template> </template>
</div> </div>
...@@ -45,4 +45,16 @@ const layout = LayoutTool.useLayout(toRef(props, "layoutOpts")); ...@@ -45,4 +45,16 @@ const layout = LayoutTool.useLayout(toRef(props, "layoutOpts"));
</template> </template>
<style lang="scss"> <style lang="scss">
.app-portlet-card {
.app-portlet-card__head {
height: 32px;
line-height: 32px;
font-weight: 600;
border-bottom: 1px solid var(--app-border-color);
margin-bottom: 6px;
}
.app-portlet-card__body {
height: calc(100% - 38px);
}
}
</style> </style>
\ No newline at end of file
...@@ -34,5 +34,5 @@ export interface ControlPropsBase { ...@@ -34,5 +34,5 @@ export interface ControlPropsBase {
* @type {*} * @type {*}
* @memberof ControlPropsBase * @memberof ControlPropsBase
*/ */
parent: any; parent?: any;
} }
\ No newline at end of file
...@@ -31,13 +31,14 @@ interface CtrlEmit { ...@@ -31,13 +31,14 @@ interface CtrlEmit {
const emit = defineEmits <CtrlEmit> (); const emit = defineEmits <CtrlEmit> ();
// 安装功能模块,提供状态和能力方法 // 安装功能模块,提供状态和能力方法
const { name, state, onCtrlEvent } = new DashboardControl(ctrlState, props, emit).moduleInstall(); const dashboardControl = new DashboardControl(ctrlState, props, emit).moduleInstall();
const { name, state, onCtrlEvent } = dashboardControl;
// 暴露内部状态及能力 // 暴露内部状态及能力
defineExpose({ name, state }); defineExpose({ name, state });
</script> </script>
<template> <template>
<div class="app-dashboard{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}"> <AppRow class="app-dashboard{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}" layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=ctrl.psLayout layoutPos=ctrl.psLayoutPos}}">
<template v-if="!state.isEnableCustomized"> <template v-if="!state.isEnableCustomized">
{{#each ctrl.psControls as |portlet|}} {{#each ctrl.psControls as |portlet|}}
{{#eq portlet.portletType 'CONTAINER'}} {{#eq portlet.portletType 'CONTAINER'}}
...@@ -47,7 +48,7 @@ defineExpose({ name, state }); ...@@ -47,7 +48,7 @@ defineExpose({ name, state });
{{/eq}} {{/eq}}
{{/each}} {{/each}}
</template> </template>
</div> </AppRow>
</template> </template>
<style lang="scss"> <style lang="scss">
</style> </style>
\ No newline at end of file
...@@ -3,14 +3,7 @@ export const ctrlState = { ...@@ -3,14 +3,7 @@ export const ctrlState = {
controlCodeName: '{{ctrl.codeName}}', controlCodeName: '{{ctrl.codeName}}',
controlName: '{{ctrl.name}}', controlName: '{{ctrl.name}}',
portletType: '{{ctrl.portletType}}', portletType: '{{ctrl.portletType}}',
{{#if ctrl.psLayoutPos.height}} showCaption: {{ctrl.showTitleBar}},
// 部件高度
height: {{ctrl.psLayoutPos.height}},
{{/if}}
{{#if ctrl.psLayoutPos.width}}
// 部件宽度
width: {{ctrl.psLayoutPos.width}},
{{/if}}
{{#if ctrl.psAppDataEntity}} {{#if ctrl.psAppDataEntity}}
// 实体名称 // 实体名称
appEntityCodeName: '{{ctrl.psAppDataEntity.codeName}}', appEntityCodeName: '{{ctrl.psAppDataEntity.codeName}}',
...@@ -22,31 +15,52 @@ export const ctrlState = { ...@@ -22,31 +15,52 @@ export const ctrlState = {
{{groupDetail.psUIAction.uIActionTag}} : { {{groupDetail.psUIAction.uIActionTag}} : {
viewlogicname: '{{groupDetail.name}}', viewlogicname: '{{groupDetail.name}}',
showCaption:{{groupDetail.showCaption}}, showCaption:{{groupDetail.showCaption}},
actionName: '{{groupDetail.psUIAction.caption}}', actionName: '{{groupDetail.psUIAction.caption}}',
icon: '{{groupDetail.psUIAction.psSysImage.cssClass}}', icon: '{{groupDetail.psUIAction.psSysImage.cssClass}}',
imgPath: '{{groupDetail.psUIAction.psSysImage.imagePath}}', imgPath: '{{groupDetail.psUIAction.psSysImage.imagePath}}',
disabled: false, visabled: true, disabled: false,
dataAccessAction: {{#if groupDetail.psUIAction.dataAccessAction}}false{{else}}true{{/if}}, visabled: true,
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}},
codeName:'{{groupDetail.psUIAction.codeName}}', codeName:'{{groupDetail.psUIAction.codeName}}',
fullCodeName:'{{groupDetail.psUIAction.fullCodeName}}', fullCodeName:'{{groupDetail.psUIAction.fullCodeName}}',
uIActionMode:'{{groupDetail.psUIAction.uIActionMode}}', uIActionMode:'{{groupDetail.psUIAction.uIActionMode}}',
uIActionTag:'{{groupDetail.psUIAction.uIActionTag}}', uIActionTag:'{{groupDetail.psUIAction.uIActionTag}}',
uIActionType:'{{groupDetail.psUIAction.uIActionType}}', uIActionType:'{{groupDetail.psUIAction.uIActionType}}'
}, },
{{/each}} {{/each}}
}, },
{{/if}} {{/if}}
{{#if ctrl.pageUrl}} {{#and (eq ctrl.portletType 'HTML') ctrl.pageUrl}}
// 网页地址 // 网页地址
pageUrl: '{{ctrl.pageUrl}}', pageUrl: '{{ctrl.pageUrl}}',
{{/if}} {{/and}}
{{#if ctrl.contentType}} {{#eq ctrl.portletType 'RAWITEM'}}
// 内容类型 // 内容类型
contentType:'{{ctrl.contentType}}', contentType: '{{ctrl.contentType}}',
{{/if}} {{#eq ctrl.contentType 'RAW'}}
rawContent: `{{ctrl.rawContent}}`,
{{/eq}}
{{#eq ctrl.contentType 'HTML'}}
rawContent: `{{ctrl.htmlContent}}`,
{{/eq}}
{{/eq}}
{{#if ctrl.rawContent}} {{#if ctrl.rawContent}}
// 直接内容 // 直接内容
rawContent:'{{ctrl.rawContent}}', rawContent: `{{ctrl.rawContent}}`,
{{/if}} {{/if}}
{{#eq ctrl.portletType 'LIST'}}
{{#ctrl.psControls}}
{{name}}: {
action:{
loadAction: '{{getPSControlAction.psAppDEMethod.codeName}}',
removeAction: '{{removePSControlAction.psAppDEMethod.codeName}}',
updateAction: '{{updatePSControlAction.psAppDEMethod.codeName}}',
loadDraftAction: '{{getDraftPSControlAction.psAppDEMethod.codeName}}',
createAction: '{{createPSControlAction.psAppDEMethod.codeName}}',
fetchAction:'{{fetchPSControlAction.psAppDEMethod.codeName}}'
}
}
{{/ctrl.psControls}}
{{/eq}}
}; };
\ No newline at end of file
<script setup lang="ts"> <script setup lang="ts">
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { ctrlState } from './{{spinalCase ctrl.codeName}}-portlet-state'; import { ctrlState } from './{{spinalCase ctrl.codeName}}-portlet-state';
import { PortletControl, IActionParam, IParam, IContext } from '@core'; import { PortletControl, IActionParam, IParam, IContext, ILayoutOpts } from '@core';
{{!-- 引入视图start --}} {{#eq ctrl.portletType "VIEW"}}
{{#if (eq ctrl.portletType "VIEW")}} {{#if ctrl.portletPSAppView}}
{{#if ctrl.portletPSAppView}}
import {{ctrl.portletPSAppView.codeName}} from '@views/{{spinalCase ctrl.portletPSAppView.psAppModule.codeName}}/{{spinalCase ctrl.portletPSAppView.codeName}}'; import {{ctrl.portletPSAppView.codeName}} from '@views/{{spinalCase ctrl.portletPSAppView.psAppModule.codeName}}/{{spinalCase ctrl.portletPSAppView.codeName}}';
{{/if}} {{/if}}
{{/if}} {{/eq}}
{{!-- 引入视图end --}} {{#eq ctrl.portletType "APPMENU"}}
{{!-- 引入菜单start --}} {{#each ctrl.psControls as | control |}}
{{#if (eq ctrl.portletType "APPMENU")}} {{#eq control.controlType "APPMENU"}}
{{#each ctrl.psControls as | control |}}
{{#eq control.controlType "APPMENU"}}
import { {{control.codeName}}Menu } from '@widgets/app/{{spinalCase control.codeName}}-menu'; import { {{control.codeName}}Menu } from '@widgets/app/{{spinalCase control.codeName}}-menu';
{{/eq}}
{{/each}}
{{/eq}}
{{#eq ctrl.portletType "LIST"}}
{{#ctrl.psControls}}
import { {{codeName}}List } from '@widgets/{{spinalCase psAppDataEntity.codeName}}/{{spinalCase codeName}}-list';
{{/ctrl.psControls}}
{{/eq}} {{/eq}}
{{/each}}
{{/if}}
{{!-- 引入菜单end --}}
interface Props { interface Props {
name:string, name:string,
...@@ -26,26 +26,12 @@ interface Props { ...@@ -26,26 +26,12 @@ interface Props {
viewParams?: IParam; viewParams?: IParam;
viewSubject: Subject<IActionParam>; viewSubject: Subject<IActionParam>;
showCaption?: boolean; showCaption?: boolean;
title?: string; layoutOpts?: ILayoutOpts;
imgPath?: string; parent: IParam;
iconClass?: string;
} }
const props = withDefaults(defineProps < Props > (), { const props = withDefaults(defineProps < Props > (), {
viewSubject: () => new Subject < IActionParam > (), viewSubject: () => new Subject < IActionParam > ()
{{#if ctrl.title}}
title: '{{ctrl.title}}',
{{/if}}
{{#if ctrl.showTitleBar}}
showCaption: '{{ctrl.showTitleBar}}',
{{/if}}
{{#if ctrl.psSysImage}}
{{#if ctrl.psSysImage.cssClass}}
iconcls: '{{ctrl.psSysImage.cssClass}}',
{{else if (ctrl.psSysImage.imagePath)}}
imgPath: '{{ctrl.psSysImage.imagePath}}',
{{/if}}
{{/if}}
}) })
// emit声明 // emit声明
...@@ -63,13 +49,20 @@ defineExpose({ name, state }); ...@@ -63,13 +49,20 @@ defineExpose({ name, state });
</script> </script>
<template> <template>
<AppPortletCard <AppPortletCard
class="app-portlet{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}" class="app-portlet{{#if ctrl.psSysCss}} {{ctrl.psSysCss.cssName}}{{/if}}"
:title="title" title="{{ctrl.title}}"
:iconClass="iconClass" {{#if ctrl.psSysImage}}
:imgPath="imgPath" {{#if ctrl.psSysImage.cssClass}}
:showCaption="showCaption" iconClass="{{ctrl.psSysImage.cssClass}}"
{{/if}}
{{#if ctrl.psSysImage.imagePath}}
imgPath="ctrl.psSysImage.imagePath"
{{/if}}
{{/if}}
:showCaption="{{ctrl.showTitleBar}}"
:layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=ctrl.psLayout layoutPos=ctrl.psLayoutPos}}"
{{#if (or ctrl.width ctrl.height)}} {{#if (or ctrl.width ctrl.height)}}
style="{{#if ctrl.width}}width: {{ctrl.width}}px;{{/if}}{{#if ctrl.height}}height: {{ctrl.height}}px;{{/if}}" style="{{#if ctrl.width}}width: {{ctrl.width}}px;{{/if}}{{#if ctrl.height}}height: {{ctrl.height}}px;{{/if}}"
{{/if}} {{/if}}
> >
<template #header-right> <template #header-right>
...@@ -88,49 +81,60 @@ defineExpose({ name, state }); ...@@ -88,49 +81,60 @@ defineExpose({ name, state });
</template> </template>
</span> </span>
</template> </template>
{{#if (eq ctrl.portletType 'VIEW') }} {{#if (eq ctrl.portletType 'VIEW')}}
<{{ctrl.portletPSAppView.codeName}} <{{ctrl.portletPSAppView.codeName}}
:context="state.context" :context="state.context"
:viewParams="state.viewParams" :viewParams="state.viewParams"
:viewSubject="state.viewSubject" :viewSubject="state.viewSubject"
@viewEvent="onViewEvent" @viewEvent="onViewEvent"
/> />
{{else if (eq ctrl.portletType 'APPMENU')}} {{else if (eq ctrl.portletType 'APPMENU')}}
{{#each ctrl.psControls as | control |}} {{#each ctrl.psControls as | control |}}
<{{control.codeName}}Menu <{{control.codeName}}Menu
ref="menu" ref="menu"
name="{{name}}" name="{{name}}"
:context="state.context" :context="state.context"
:viewParams="state.viewParams" :viewParams="state.viewParams"
:viewSubject="state.viewSubject" :viewSubject="state.viewSubject"
menuAlign="LEFT" menuAlign="LEFT"
:collapsed="false" :collapsed="false"
@ctrlEvent="onCtrlEvent" @ctrlEvent="onCtrlEvent"
></{{control.codeName}}Menu> ></{{control.codeName}}Menu>
{{/each}} {{/each}}
{{else if (eq ctrl.portletType 'CUSTOM')}} {{else if (eq ctrl.portletType 'CUSTOM')}}
<div>暂未支持自定义绘制</div> <div>暂未支持自定义绘制</div>
{{else if (eq ctrl.portletType 'ACTIONBAR')}} {{else if (eq ctrl.portletType 'ACTIONBAR')}}
<app-action-bar <app-action-bar
:viewSubject="state.viewSubject" :viewSubject="state.viewSubject"
:uiService="state.UIService" :uiService="state.UIService"
:items="state.actionBarModelData" :items="state.actionBarModelData"
@itemClick="handleItemClick" @itemClick="handleItemClick"
></app-action-bar> ></app-action-bar>
{{else if (eq ctrl.portletType 'TOOLBAR')}} {{else if (eq ctrl.portletType 'TOOLBAR')}}
<div>暂未支持工具栏绘制</div> <div>暂未支持工具栏绘制</div>
{{else if (eq ctrl.portletType 'HTML')}} {{else if (eq ctrl.portletType 'HTML')}}
<iframe :src="state.pageUrl" :style="{height: state.height && state.height > 0 ? '100%' : '400px', width: '100%', borderWidth: '0px'}"></iframe> <iframe :src="state.pageUrl" :style="{ height: '100%', width: '100%', borderWidth: '0px' }"></iframe>
{{else if (eq ctrl.portletType 'RAWITEM')}} {{else if (eq ctrl.portletType 'RAWITEM')}}
<app-raw <app-raw
:name="state.controlName" :name="state.controlName"
:contentType="state.contentType" :contentType="state.contentType"
:iconClass="state.iconcls" :iconClass="state.iconcls"
:imgPath="state.imagePath" :imgPath="state.imagePath"
style="{{#if ctrl.rawItemHeight}}height: {{ctrl.rawItemHeight}}px;{{/if}}{{#if ctrl.rawItemWidth}}width: {{ctrl.rawItemWidth}}px{{/if}}" style="{{#if ctrl.rawItemHeight}}height: {{ctrl.rawItemHeight}}px;{{/if}}{{#if ctrl.rawItemWidth}}width: {{ctrl.rawItemWidth}}px{{/if}}"
{{#if (eq ctrl.contentType 'RAW')}}value="{{ctrl.rawContent}}"{{else if (eq ctrl.contentType 'HTML')}}:value="`{{ctrl.htmlContent}}`"{{/if}} :value="state.rawContent"
></app-raw> ></app-raw>
{{else}} {{else if (eq ctrl.portletType 'LIST')}}
{{#ctrl.psControls}}
<{{codeName}}List
ref="portlet"
name="{{name}}"
:controlAction="state.{{name}}.action"
:context="state.context"
:viewParams="state.viewParams"
:viewSubject="state.viewSubject"
@ctrlEvent="onCtrlEvent">
</{{codeName}}List>
{{/ctrl.psControls}}
{{/if}} {{/if}}
</AppPortletCard> </AppPortletCard>
</template> </template>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册