Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
iBiz-Vue-R7-Res
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
iBiz-R7前端标准模板
iBiz-Vue-R7-Res
提交
d996f3fa
提交
d996f3fa
编写于
11月 03, 2022
作者:
tony001
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update:更新
上级
884759c1
变更
6
隐藏空白字符变更
内嵌
并排
正在显示
6 个修改的文件
包含
114 行增加
和
36 行删除
+114
-36
app-scroll-container.vue
...t/container/app-scroll-container/app-scroll-container.vue
+1
-1
app-simpleflex-container.vue
...ner/app-simpleflex-container/app-simpleflex-container.vue
+1
-1
app-standard-container.less
...tainer/app-standard-container/app-standard-container.less
+5
-0
app-standard-container.vue
...ntainer/app-standard-container/app-standard-container.vue
+18
-11
panel-container.ts
src/model/panel-detail/panel-container.ts
+49
-2
panel-detail.ts
src/model/panel-detail/panel-detail.ts
+40
-21
未找到文件。
src/components/layout-element/container/app-scroll-container/app-scroll-container.vue
浏览文件 @
d996f3fa
...
@@ -84,7 +84,7 @@ export default class AppScrollContainer extends Vue {
...
@@ -84,7 +84,7 @@ export default class AppScrollContainer extends Vue {
*/
*/
get
curStyle
(){
get
curStyle
(){
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
return
layoutModel
.
get
BoxSpacing
Style
();
return
layoutModel
.
get
Element
Style
();
}
}
/**
/**
...
...
src/components/layout-element/container/app-simpleflex-container/app-simpleflex-container.vue
浏览文件 @
d996f3fa
...
@@ -72,7 +72,7 @@ export default class AppSimpleFlexContainer extends Vue {
...
@@ -72,7 +72,7 @@ export default class AppSimpleFlexContainer extends Vue {
*/
*/
get
curStyle
()
{
get
curStyle
()
{
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
return
layoutModel
.
get
BoxSpacing
Style
();
return
layoutModel
.
get
Element
Style
();
}
}
/**
/**
...
...
src/components/layout-element/container/app-standard-container/app-standard-container.less
浏览文件 @
d996f3fa
// 标准容器大小靠内容撑
.app-standard-container{
.app-standard-container{
display: block;
display: block;
.container-item__pos{
width: 100%;
height: 100%;
}
}
}
\ No newline at end of file
src/components/layout-element/container/app-standard-container/app-standard-container.vue
浏览文件 @
d996f3fa
<
template
>
<
template
>
<div
:class=
"curClassName"
:style=
"curStyle
Content
"
>
<div
:class=
"curClassName"
:style=
"curStyle"
>
<template
v-if=
"containerModel.length > 0"
>
<template
v-if=
"containerModel.length > 0"
>
<
template
v-for=
"name of containerModel
"
>
<
div
v-for=
"name of containerModel"
class=
"container-item__pos"
:style=
"getItemPosStyle(name)
"
>
<slot
:name=
"name"
></slot>
<slot
:name=
"name"
></slot>
</
template
>
</
div
>
</
template
>
</
template
>
</div>
</div>
</template>
</template>
...
@@ -63,17 +63,24 @@ export default class AppStandardContainer extends Vue {
...
@@ -63,17 +63,24 @@ export default class AppStandardContainer extends Vue {
* 当前容器样式类
* 当前容器样式类
*/
*/
get
curClassName
()
{
get
curClassName
()
{
return
`app-standard-container
${
this
.
name
}
`
;
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
return
`app-standard-container
${
this
.
name
}
${
layoutModel
.
sysCss
}
`
;
}
}
/**
/**
* 当前容器样式
* 当前容器样式
*/
*/
get
curStyleContent
()
{
get
curStyle
()
{
let
boxLayoutPosStyle
=
""
;
const
layoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
const
curLayoutModel
=
this
.
layoutModelDetails
[
this
.
name
];
return
layoutModel
.
getElementStyle
();
console
.
log
(
curLayoutModel
);
}
return
boxLayoutPosStyle
;
/**
* 获取项布局样式
*/
public
getItemPosStyle
(
name
:
string
)
{
const
layoutModel
=
this
.
layoutModelDetails
[
name
];
return
layoutModel
.
getCommonLayoutStyle
();
}
}
}
}
</
script
>
</
script
>
...
...
src/model/panel-detail/panel-container.ts
浏览文件 @
d996f3fa
...
@@ -15,7 +15,7 @@ export class PanelContainerModel extends PanelDetailModel {
...
@@ -15,7 +15,7 @@ export class PanelContainerModel extends PanelDetailModel {
* @type {string[]}
* @type {string[]}
* @memberof PanelContainerModel
* @memberof PanelContainerModel
*/
*/
public
details
:
string
[]
=
[];
public
details
:
string
[]
=
[];
/**
/**
* 标题关闭模式
* 标题关闭模式
...
@@ -23,7 +23,15 @@ export class PanelContainerModel extends PanelDetailModel {
...
@@ -23,7 +23,15 @@ export class PanelContainerModel extends PanelDetailModel {
* @type {number}
* @type {number}
* @memberof PanelContainerModel
* @memberof PanelContainerModel
*/
*/
public
titleBarCloseMode
:
number
=
0
;
public
titleBarCloseMode
:
number
=
0
;
/**
* 背景图片
*
* @type {*}
* @memberof PanelContainerModel
*/
public
sysImage
:
any
=
{};
/**
/**
* Creates an instance of PanelContainerModel.
* Creates an instance of PanelContainerModel.
...
@@ -34,6 +42,45 @@ export class PanelContainerModel extends PanelDetailModel {
...
@@ -34,6 +42,45 @@ export class PanelContainerModel extends PanelDetailModel {
super
(
opts
);
super
(
opts
);
this
.
details
=
opts
.
details
;
this
.
details
=
opts
.
details
;
this
.
titleBarCloseMode
=
opts
.
titleBarCloseMode
;
this
.
titleBarCloseMode
=
opts
.
titleBarCloseMode
;
this
.
sysImage
=
opts
.
sysImage
;
}
/**
* 获取容器元素样式(仅限容器元素)
*
* @return {*}
* @memberof PanelContainerModel
*/
public
getElementStyle
()
{
const
containerStyle
=
{};
Object
.
assign
(
containerStyle
,
this
.
getFlexStyle
());
//边缘布局容器盒子大小由布局组件内部计算
if
(
this
.
layout
!==
"BORDER"
)
{
Object
.
assign
(
containerStyle
,
this
.
getBoxSizeStyle
());
}
Object
.
assign
(
containerStyle
,
this
.
getBoxSpacingStyle
());
Object
.
assign
(
containerStyle
,
this
.
getSpecificStyle
());
return
containerStyle
;
}
/**
* 获取容器特有样式(主要包含背景图片)
*
* @protected
* @memberof PanelContainerModel
*/
protected
getSpecificStyle
()
{
const
boxStyle
=
{};
if
(
Object
.
is
(
this
.
itemStyle
,
'STYLE2'
)
&&
this
.
sysImage
&&
(
this
.
sysImage
.
imagePath
||
this
.
sysImage
.
rawContent
))
{
Object
.
assign
(
boxStyle
,
{
background
:
`url('
${
this
.
sysImage
.
imagePath
||
this
.
sysImage
.
rawContent
}
') no-repeat 0px 0px`
,
'background-size'
:
'100% 100%'
});
if
(
!
this
.
layoutWidth
)
{
Object
.
assign
(
boxStyle
,
{
width
:
'100%'
});
}
if
(
!
this
.
layoutHeight
)
{
Object
.
assign
(
boxStyle
,
{
height
:
'100%'
});
}
}
return
boxStyle
;
}
}
...
...
src/model/panel-detail/panel-detail.ts
浏览文件 @
d996f3fa
...
@@ -24,6 +24,14 @@ export class PanelDetailModel {
...
@@ -24,6 +24,14 @@ export class PanelDetailModel {
*/
*/
public
itemType
:
string
=
''
;
public
itemType
:
string
=
''
;
/**
* 成员样式
*
* @type {string}
* @memberof PanelDetailModel
*/
public
itemStyle
:
string
=
''
;
/**
/**
* 面板对象
* 面板对象
*
*
...
@@ -214,10 +222,11 @@ export class PanelDetailModel {
...
@@ -214,10 +222,11 @@ export class PanelDetailModel {
this
.
isShowCaption
=
opts
.
isShowCaption
;
this
.
isShowCaption
=
opts
.
isShowCaption
;
this
.
sysCss
=
opts
.
sysCss
;
this
.
sysCss
=
opts
.
sysCss
;
this
.
predefinedType
=
opts
.
predefinedType
;
this
.
predefinedType
=
opts
.
predefinedType
;
this
.
itemStyle
=
opts
.
itemStyle
;
}
}
/**
/**
* 获取元素样式(元素,包含内容盒子 大小/边距/内容 的样式)
* 获取元素样式(
除容器之外的
元素,包含内容盒子 大小/边距/内容 的样式)
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
...
@@ -234,7 +243,7 @@ export class PanelDetailModel {
...
@@ -234,7 +243,7 @@ export class PanelDetailModel {
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxSpacingStyle
()
{
p
rotected
getBoxSpacingStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
// 上方间隔模式
// 上方间隔模式
if
(
this
.
spacingTop
)
{
if
(
this
.
spacingTop
)
{
...
@@ -255,12 +264,35 @@ export class PanelDetailModel {
...
@@ -255,12 +264,35 @@ export class PanelDetailModel {
return
boxStyle
;
return
boxStyle
;
}
}
/**
* 识别flex布局方向,横轴对齐,纵轴对齐(元素)
*
* @return {*}
* @memberof PanelDetailModel
*/
protected
getFlexStyle
()
{
const
boxStyle
=
{};
if
(
this
.
flexParams
.
align
||
this
.
flexParams
.
dir
||
this
.
flexParams
.
vAlign
)
{
Object
.
assign
(
boxStyle
,
{
'display'
:
'flex'
});
if
(
this
.
flexParams
.
dir
)
{
Object
.
assign
(
boxStyle
,
{
'flex-direction'
:
this
.
flexParams
.
dir
});
}
if
(
this
.
flexParams
.
align
)
{
Object
.
assign
(
boxStyle
,
{
'justify-content'
:
this
.
flexParams
.
align
});
}
if
(
this
.
flexParams
.
vAlign
)
{
Object
.
assign
(
boxStyle
,
{
'align-items'
:
this
.
flexParams
.
vAlign
});
}
}
return
boxStyle
;
}
/**
/**
* 获取盒子大小样式(元素)
* 获取盒子大小样式(元素)
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxSizeStyle
()
{
p
rotected
getBoxSizeStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
if
(
this
.
widthMode
||
this
.
layoutWidth
)
{
if
(
this
.
widthMode
||
this
.
layoutWidth
)
{
Object
.
assign
(
boxStyle
,
Util
.
getBoxSize
(
"WIDTH"
,
this
.
widthMode
,
this
.
layoutWidth
));
Object
.
assign
(
boxStyle
,
Util
.
getBoxSize
(
"WIDTH"
,
this
.
widthMode
,
this
.
layoutWidth
));
...
@@ -276,7 +308,7 @@ export class PanelDetailModel {
...
@@ -276,7 +308,7 @@ export class PanelDetailModel {
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxContentStyle
()
{
p
rotected
getBoxContentStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
return
boxStyle
;
return
boxStyle
;
}
}
...
@@ -286,7 +318,7 @@ export class PanelDetailModel {
...
@@ -286,7 +318,7 @@ export class PanelDetailModel {
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxBorderStyle
()
{
p
rotected
getBoxBorderStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
return
boxStyle
;
return
boxStyle
;
}
}
...
@@ -297,7 +329,7 @@ export class PanelDetailModel {
...
@@ -297,7 +329,7 @@ export class PanelDetailModel {
* @return {*}
* @return {*}
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
public
getCommonLayoutStyle
()
{
public
getCommonLayoutStyle
()
{
const
layoutStyle
=
{};
const
layoutStyle
=
{};
Object
.
assign
(
layoutStyle
,
this
.
getBoxSelfAlignStyle
());
Object
.
assign
(
layoutStyle
,
this
.
getBoxSelfAlignStyle
());
Object
.
assign
(
layoutStyle
,
this
.
getBoxLayOutStyle
());
Object
.
assign
(
layoutStyle
,
this
.
getBoxLayOutStyle
());
...
@@ -324,7 +356,7 @@ export class PanelDetailModel {
...
@@ -324,7 +356,7 @@ export class PanelDetailModel {
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxSelfAlignStyle
()
{
p
rotected
getBoxSelfAlignStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
// 自身对齐方式
// 自身对齐方式
if
(
this
.
vAlignSelf
||
this
.
hAlignSelf
)
{
if
(
this
.
vAlignSelf
||
this
.
hAlignSelf
)
{
...
@@ -369,25 +401,12 @@ export class PanelDetailModel {
...
@@ -369,25 +401,12 @@ export class PanelDetailModel {
*
*
* @memberof PanelDetailModel
* @memberof PanelDetailModel
*/
*/
p
ublic
getBoxLayOutStyle
()
{
p
rotected
getBoxLayOutStyle
()
{
const
boxStyle
=
{};
const
boxStyle
=
{};
// 识别FLEX
// 识别FLEX
if
(
this
.
layout
==
'FLEX'
)
{
if
(
this
.
layout
==
'FLEX'
)
{
Object
.
assign
(
boxStyle
,
{
'display'
:
'flex'
,
'flex-grow'
:
this
.
flexGrow
?
this
.
flexGrow
:
0
});
Object
.
assign
(
boxStyle
,
{
'display'
:
'flex'
,
'flex-grow'
:
this
.
flexGrow
?
this
.
flexGrow
:
0
});
}
}
// 识别flex布局方向,横轴对齐,纵轴对齐
if
(
this
.
flexParams
.
align
||
this
.
flexParams
.
dir
||
this
.
flexParams
.
vAlign
)
{
Object
.
assign
(
boxStyle
,
{
'display'
:
'flex'
});
if
(
this
.
flexParams
.
dir
)
{
Object
.
assign
(
boxStyle
,
{
'flex-direction'
:
this
.
flexParams
.
dir
});
}
if
(
this
.
flexParams
.
align
)
{
Object
.
assign
(
boxStyle
,
{
'justify-content'
:
this
.
flexParams
.
align
});
}
if
(
this
.
flexParams
.
vAlign
)
{
Object
.
assign
(
boxStyle
,
{
'align-items'
:
this
.
flexParams
.
vAlign
});
}
}
// 识别SIMPLEFLEX
// 识别SIMPLEFLEX
if
(
this
.
layout
==
'SIMPLEFLEX'
)
{
if
(
this
.
layout
==
'SIMPLEFLEX'
)
{
if
(
this
.
flexGrow
)
{
if
(
this
.
flexGrow
)
{
...
...
编辑
预览
Markdown
格式
0%
请重试
or
添加新附件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录