Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
D
dataease
项目
项目
详情
活动
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
图表
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
zhu
dataease
Commits
abb58954
提交
abb58954
authored
11月 24, 2021
作者:
wangjiahao
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: 仪表板支持统一设置视图结果显示数量
上级
16e807bc
全部展开
隐藏空白字符变更
内嵌
并排
正在显示
12 个修改的文件
包含
407 行增加
和
147 行删除
+407
-147
CommonConstants.java
...n/java/io/dataease/commons/constants/CommonConstants.java
+22
-5
ChartExtRequest.java
...io/dataease/controller/request/chart/ChartExtRequest.java
+12
-0
ChartViewService.java
...main/java/io/dataease/service/chart/ChartViewService.java
+11
-5
UserView.vue
frontend/src/components/canvas/custom-component/UserView.vue
+123
-67
en.js
frontend/src/lang/en.js
+4
-1
tw.js
frontend/src/lang/tw.js
+0
-0
zh.js
frontend/src/lang/zh.js
+4
-1
ComponentGap.vue
...rc/views/panel/SubjectSetting/PanelStyle/ComponentGap.vue
+23
-16
PanelRefreshTime.vue
...iews/panel/SubjectSetting/PanelStyle/PanelRefreshTime.vue
+30
-22
PanelViewResult.vue
...views/panel/SubjectSetting/PanelStyle/PanelViewResult.vue
+135
-0
index.vue
frontend/src/views/panel/SubjectSetting/index.vue
+40
-28
panel.js
frontend/src/views/panel/panel.js
+3
-2
没有找到文件。
backend/src/main/java/io/dataease/commons/constants/CommonConstants.java
浏览文件 @
abb58954
...
...
@@ -9,7 +9,7 @@ public class CommonConstants {
//操作类型
public
static
final
class
OPT_TYPE
{
public
static
final
class
OPT_TYPE
{
public
static
final
String
INSERT
=
"insert"
;
...
...
@@ -22,19 +22,36 @@ public class CommonConstants {
}
//操作类型
public
static
final
class
CHECK_RESULT
{
public
static
final
class
CHECK_RESULT
{
// 不存在
public
static
final
String
NONE
=
"none"
;
// 全局存在
public
static
final
String
EXIST_ALL
=
"exist_all"
;
public
static
final
String
EXIST_ALL
=
"exist_all"
;
// 当前用户存在
public
static
final
String
EXIST_USER
=
"exist_user"
;
public
static
final
String
EXIST_USER
=
"exist_user"
;
// 其他用户存在
public
static
final
String
EXIST_OTHER
=
"exist_other"
;
public
static
final
String
EXIST_OTHER
=
"exist_other"
;
}
//视图数据查询来源
public
static
final
class
VIEW_QUERY_FROM
{
// 仪表板
public
static
final
String
PANEL
=
"panel"
;
}
//视图数据查询模式
public
static
final
class
VIEW_RESULT_MODE
{
// 所有
public
static
final
String
ALL
=
"all"
;
// 自定义
public
static
final
String
CUSTOM
=
"custom"
;
}
}
backend/src/main/java/io/dataease/controller/request/chart/ChartExtRequest.java
浏览文件 @
abb58954
...
...
@@ -22,4 +22,16 @@ public class ChartExtRequest {
@ApiModelProperty
(
"下钻维度集合"
)
private
List
<
ChartDrillRequest
>
drill
;
@ApiModelProperty
(
"数据查询来源"
)
private
String
queryFrom
;
@ApiModelProperty
(
"视图结果展示模式"
)
private
String
resultMode
;
@ApiModelProperty
(
"视图结果展示数量"
)
private
Integer
resultCount
;
@ApiModelProperty
(
"使用缓存:默认使用"
)
private
boolean
cache
=
true
;
}
backend/src/main/java/io/dataease/service/chart/ChartViewService.java
浏览文件 @
abb58954
...
...
@@ -6,6 +6,7 @@ import io.dataease.base.domain.*;
import
io.dataease.base.mapper.ChartViewMapper
;
import
io.dataease.base.mapper.ext.ExtChartGroupMapper
;
import
io.dataease.base.mapper.ext.ExtChartViewMapper
;
import
io.dataease.commons.constants.CommonConstants
;
import
io.dataease.commons.constants.JdbcConstants
;
import
io.dataease.commons.utils.AuthUtils
;
import
io.dataease.commons.utils.BeanUtils
;
...
...
@@ -182,9 +183,14 @@ public class ChartViewService {
chartViewMapper
.
deleteByExample
(
chartViewExample
);
}
public
ChartViewDTO
getData
(
String
id
,
ChartExtRequest
request
List
)
throws
Exception
{
public
ChartViewDTO
getData
(
String
id
,
ChartExtRequest
request
)
throws
Exception
{
ChartViewWithBLOBs
view
=
chartViewMapper
.
selectByPrimaryKey
(
id
);
return
calcData
(
view
,
requestList
,
true
);
// 如果是从仪表板获取视图数据,则仪表板的查询模式,查询结果的数量,覆盖视图对应的属性
if
(
CommonConstants
.
VIEW_QUERY_FROM
.
PANEL
.
equals
(
request
.
getQueryFrom
())
&&
CommonConstants
.
VIEW_RESULT_MODE
.
CUSTOM
.
equals
(
request
.
getResultMode
()))
{
view
.
setResultMode
(
request
.
getResultMode
());
view
.
setResultCount
(
request
.
getResultCount
());
}
return
calcData
(
view
,
request
,
request
.
isCache
());
}
public
ChartViewDTO
calcData
(
ChartViewWithBLOBs
view
,
ChartExtRequest
requestList
,
boolean
cache
)
throws
Exception
{
...
...
@@ -1383,10 +1389,10 @@ public class ChartViewService {
return
extChartViewMapper
.
searchAdviceSceneId
(
AuthUtils
.
getUser
().
getUserId
().
toString
(),
panelId
);
}
public
String
checkSameDataSet
(
String
viewIdSource
,
String
viewIdTarget
)
{
if
(
extChartViewMapper
.
checkSameDataSet
(
viewIdSource
,
viewIdTarget
)==
1
)
{
public
String
checkSameDataSet
(
String
viewIdSource
,
String
viewIdTarget
)
{
if
(
extChartViewMapper
.
checkSameDataSet
(
viewIdSource
,
viewIdTarget
)
==
1
)
{
return
"YES"
;
}
else
{
}
else
{
return
"NO"
;
}
}
...
...
frontend/src/components/canvas/custom-component/UserView.vue
浏览文件 @
abb58954
...
...
@@ -9,16 +9,40 @@
]"
>
<div
v-if=
"requestStatus==='error'"
class=
"chart-error-class"
>
<div
style=
"font-size: 12px; color: #9ea6b2;height: 100%;display: flex;align-items: center;justify-content: center;
"
>
<div
class=
"chart-error-message-class
"
>
{{
message
}}
,
{{
$t
(
'chart.chart_show_error'
)
}}
<br>
{{
$t
(
'chart.chart_error_tips'
)
}}
</div>
</div>
<chart-component
v-if=
"httpRequest.status &&chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'echarts'"
:ref=
"element.propValue.id"
class=
"chart-class"
:chart=
"chart"
:track-menu=
"trackMenu"
:search-count=
"searchCount"
@
onChartClick=
"chartClick"
@
onJumpClick=
"jumpClick"
/>
<chart-component-g2
v-if=
"httpRequest.status &&chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'antv'"
:ref=
"element.propValue.id"
class=
"chart-class"
:chart=
"chart"
:track-menu=
"trackMenu"
:search-count=
"searchCount"
@
onChartClick=
"chartClick"
@
onJumpClick=
"jumpClick"
/>
<table-normal
v-if=
"httpRequest.status &&chart.type && chart.type.includes('table')"
:ref=
"element.propValue.id"
:show-summary=
"chart.type === 'table-normal'"
:chart=
"chart"
class=
"table-class"
/>
<label-normal
v-if=
"httpRequest.status && chart.type && chart.type.includes('text')"
:ref=
"element.propValue.id"
:chart=
"chart"
class=
"table-class"
/>
<chart-component
v-if=
"charViewShowFlag"
:ref=
"element.propValue.id"
class=
"chart-class"
:chart=
"chart"
:track-menu=
"trackMenu"
:search-count=
"searchCount"
@
onChartClick=
"chartClick"
@
onJumpClick=
"jumpClick"
/>
<chart-component-g2
v-if=
"charViewG2ShowFlag"
:ref=
"element.propValue.id"
class=
"chart-class"
:chart=
"chart"
:track-menu=
"trackMenu"
:search-count=
"searchCount"
@
onChartClick=
"chartClick"
@
onJumpClick=
"jumpClick"
/>
<table-normal
v-if=
"tableShowFlag"
:ref=
"element.propValue.id"
:show-summary=
"chart.type === 'table-normal'"
:chart=
"chart"
class=
"table-class"
/>
<label-normal
v-if=
"labelShowFlag"
:ref=
"element.propValue.id"
:chart=
"chart"
class=
"table-class"
/>
<div
style=
"position: absolute;left: 20px;bottom:14px;"
>
<drill-path
:drill-filters=
"drillFilters"
@
onDrillJump=
"drillJump"
/>
</div>
...
...
@@ -43,7 +67,7 @@ import { getToken, getLinkToken } from '@/utils/auth'
import
DrillPath
from
'@/views/chart/view/DrillPath'
import
{
areaMapping
}
from
'@/api/map/map'
import
ChartComponentG2
from
'@/views/chart/components/ChartComponentG2'
import
{
Base64
}
from
'js-base64'
export
default
{
name
:
'UserView'
,
components
:
{
ChartComponent
,
TableNormal
,
LabelNormal
,
DrillPath
,
ChartComponentG2
},
...
...
@@ -89,10 +113,24 @@ export default {
msg
:
''
},
timeMachine
:
null
,
changeIndex
:
0
changeIndex
:
0
,
pre
:
null
,
preCanvasPanel
:
null
}
},
computed
:
{
charViewShowFlag
()
{
return
this
.
httpRequest
.
status
&&
this
.
chart
.
type
&&
!
this
.
chart
.
type
.
includes
(
'table'
)
&&
!
this
.
chart
.
type
.
includes
(
'text'
)
&&
this
.
renderComponent
()
===
'echarts'
},
charViewG2ShowFlag
()
{
return
this
.
httpRequest
.
status
&&
this
.
chart
.
type
&&
!
this
.
chart
.
type
.
includes
(
'table'
)
&&
!
this
.
chart
.
type
.
includes
(
'text'
)
&&
this
.
renderComponent
()
===
'antv'
},
tableShowFlag
()
{
return
this
.
httpRequest
.
status
&&
this
.
chart
.
type
&&
this
.
chart
.
type
.
includes
(
'table'
)
},
labelShowFlag
()
{
return
this
.
httpRequest
.
status
&&
this
.
chart
.
type
&&
this
.
chart
.
type
.
includes
(
'text'
)
},
loadingFlag
()
{
return
(
this
.
canvasStyleData
.
refreshViewLoading
||
this
.
searchCount
===
0
)
&&
this
.
requestStatus
===
'waiting'
},
...
...
@@ -104,6 +142,9 @@ export default {
filter
.
filter
=
this
.
element
.
filters
filter
.
linkageFilters
=
this
.
element
.
linkageFilters
filter
.
drill
=
this
.
drillClickDimensionList
filter
.
resultCount
=
this
.
resultCount
filter
.
resultMode
=
this
.
resultMode
filter
.
queryFrom
=
'panel'
return
filter
},
filters
()
{
...
...
@@ -111,11 +152,9 @@ export default {
if
(
!
this
.
element
.
filters
)
return
[]
return
JSON
.
parse
(
JSON
.
stringify
(
this
.
element
.
filters
))
},
linkageFilters
()
{
// 必要 勿删勿该 watch数组,哪怕发生变化 oldValue等于newValue ,深拷贝解决
if
(
!
this
.
element
.
linkageFilters
)
return
[]
// console.log('linkageFilters:' + JSON.stringify(this.element.linkageFilters))
return
JSON
.
parse
(
JSON
.
stringify
(
this
.
element
.
linkageFilters
))
},
trackMenu
()
{
...
...
@@ -145,6 +184,12 @@ export default {
hw
()
{
return
this
.
outStyle
.
width
*
this
.
outStyle
.
height
},
resultMode
()
{
return
this
.
canvasStyleData
.
panel
.
resultMode
},
resultCount
()
{
return
this
.
canvasStyleData
.
panel
.
resultCount
},
...
mapState
([
'canvasStyleData'
,
'nowPanelTrackInfo'
,
...
...
@@ -168,13 +213,17 @@ export default {
canvasStyleData
:
{
handler
(
newVal
,
oldVla
)
{
this
.
mergeStyle
()
// 如果视图结果模式模式 或者 视图结果获取数量改变 刷新视图
if
(
!
this
.
preCanvasPanel
||
this
.
preCanvasPanel
.
resultCount
!==
newVal
.
panel
.
resultCount
||
this
.
preCanvasPanel
.
resultMode
!==
newVal
.
panel
.
resultMode
)
{
this
.
getData
(
this
.
element
.
propValue
.
viewId
,
false
)
}
this
.
preCanvasPanel
=
deepCopy
(
newVal
.
panel
)
},
deep
:
true
},
// 监听外部的样式变化 (非实时性要求)
'hw'
:
{
handler
(
newVal
,
oldVla
)
{
// console.log('hw:' + newVal + '---' + oldVla)
if
(
newVal
!==
oldVla
&&
this
.
$refs
[
this
.
element
.
propValue
.
id
])
{
if
(
this
.
chart
.
type
===
'map'
)
{
this
.
destroyTimeMachine
()
...
...
@@ -205,27 +254,19 @@ export default {
}
}
},
created
()
{
this
.
refId
=
uuid
.
v1
if
(
this
.
element
&&
this
.
element
.
propValue
&&
this
.
element
.
propValue
.
viewId
)
{
this
.
getData
(
this
.
element
.
propValue
.
viewId
)
this
.
getData
(
this
.
element
.
propValue
.
viewId
,
false
)
}
// this.initAreas()
},
mounted
()
{
},
methods
:
{
mergeStyle
()
{
if
((
this
.
requestStatus
===
'success'
||
this
.
requestStatus
===
'merging'
)
&&
this
.
chart
.
stylePriority
===
'panel'
&&
this
.
canvasStyleData
.
chart
)
{
const
customAttrChart
=
JSON
.
parse
(
this
.
chart
.
customAttr
)
const
customStyleChart
=
JSON
.
parse
(
this
.
chart
.
customStyle
)
const
customAttrPanel
=
JSON
.
parse
(
this
.
canvasStyleData
.
chart
.
customAttr
)
const
customStylePanel
=
JSON
.
parse
(
this
.
canvasStyleData
.
chart
.
customStyle
)
// 组件样式-标题设置 - 标题修改为组件自己控制
// 组件样式-背景设置
customStyleChart
.
background
=
customStylePanel
.
background
// 图形属性-颜色设置
...
...
@@ -234,7 +275,6 @@ export default {
}
else
{
customAttrChart
.
color
=
customAttrPanel
.
color
}
this
.
chart
=
{
...
this
.
chart
,
customAttr
:
JSON
.
stringify
(
customAttrChart
),
...
...
@@ -242,7 +282,7 @@ export default {
}
}
},
getData
(
id
)
{
getData
(
id
,
cache
=
true
)
{
if
(
id
)
{
this
.
requestStatus
=
'waiting'
this
.
message
=
null
...
...
@@ -254,8 +294,11 @@ export default {
if
(
!
token
&&
linkToken
)
{
method
=
viewInfo
}
method
(
id
,
this
.
filter
).
then
(
response
=>
{
const
requestInfo
=
{
...
this
.
filter
,
cache
:
cache
}
method
(
id
,
requestInfo
).
then
(
response
=>
{
// 将视图传入echart组件
if
(
response
.
success
)
{
this
.
chart
=
response
.
data
...
...
@@ -477,59 +520,72 @@ export default {
</
script
>
<
style
lang=
"scss"
scoped
>
.rect-shape
{
.rect-shape
{
width
:
100%
;
height
:
100%
;
overflow
:
hidden
;
}
.chart-class
{
height
:
100%
;
}
.table-class
{
height
:
100%
;
}
.chart-error-class
{
text-align
:
center
;
height
:
calc
(
100%
-
84px
);
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
background-color
:
#ece7e7
;
}
.active
{
}
}
.chart-class
{
height
:
100%
;
}
.active
>>>
.icon-fangda
{
z-index
:
2
;
display
:block
!
important
;
}
.table-class
{
height
:
100%
;
}
.rect-shape
>
i
{
right
:
5px
;
color
:
gray
;
position
:
absolute
;
}
.chart-error-class
{
text-align
:
center
;
height
:
100%
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
background-color
:
#ece7e7
;
}
.rect-shape
>>>
i
:hover
{
color
:
red
;
}
.chart-error-message-class
{
font-size
:
12px
;
color
:
#9ea6b2
;
height
:
100%
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
}
.rect-shape
:hover
>>>
.icon-fangda
{
z-index
:
2
;
display
:block
;
}
.active
{
.rect-shape
>>>
.icon-fangda
{
display
:none
}
}
.rect-shape
:hover
>>>
.icon-shezhi
{
z-index
:
2
;
display
:block
;
}
.active
>
>
>
.icon-fangda
{
z-index
:
2
;
display
:
block
!
important
;
}
.rect-shape
>>>
.icon-shezhi
{
display
:none
}
.rect-shape
>
i
{
right
:
5px
;
color
:
gray
;
position
:
absolute
;
}
.rect-shape
>
>
>
i
:hover
{
color
:
red
;
}
.rect-shape
:hover
>
>
>
.icon-fangda
{
z-index
:
2
;
display
:
block
;
}
.rect-shape
>
>
>
.icon-fangda
{
display
:
none
}
.rect-shape
:hover
>
>
>
.icon-shezhi
{
z-index
:
2
;
display
:
block
;
}
.rect-shape
>
>
>
.icon-shezhi
{
display
:
none
}
</
style
>
frontend/src/lang/en.js
浏览文件 @
abb58954
...
...
@@ -954,6 +954,7 @@ export default {
table_page_size_unit
:
'Item/Page'
,
result_count
:
'Result'
,
result_mode_all
:
'ALL'
,
result_mode_custom
:
'Custom'
,
chart_word_cloud
:
'Word Cloud'
,
drag_block_word_cloud_label
:
'Word Label'
,
drag_block_word_cloud_size
:
'Word Size'
,
...
...
@@ -1410,7 +1411,9 @@ export default {
play_once
:
'Once'
,
play_circle
:
'Circle'
,
video_links
:
'Video Links'
,
video_add_tips
:
'Please Add Video Info...'
video_add_tips
:
'Please Add Video Info...'
,
panel_view_result_show
:
'View Result Show'
,
panel_view_result_tips
:
'Chose "Panel" Will Overwrite View`s Result,Range 1~10000'
},
plugin
:
{
local_install
:
'Local installation'
,
...
...
frontend/src/lang/tw.js
浏览文件 @
abb58954
差异被折叠。
点击展开。
frontend/src/lang/zh.js
浏览文件 @
abb58954
...
...
@@ -958,6 +958,7 @@ export default {
table_page_size_unit
:
'条/页'
,
result_count
:
'结果展示'
,
result_mode_all
:
'全部'
,
result_mode_custom
:
'自定义'
,
chart_word_cloud
:
'词云'
,
drag_block_word_cloud_label
:
'词标签'
,
drag_block_word_cloud_size
:
'词大小'
,
...
...
@@ -1422,7 +1423,9 @@ export default {
play_once
:
'播放一次'
,
play_circle
:
'循环播放'
,
video_links
:
'视频链接'
,
video_add_tips
:
'请点击添加配置视频信息...'
video_add_tips
:
'请点击添加配置视频信息...'
,
panel_view_result_show
:
'视图结果展示'
,
panel_view_result_tips
:
'选择仪表板会覆盖视图的结果展示数量,取值范围1~10000'
},
plugin
:
{
local_install
:
'本地安装'
,
...
...
frontend/src/views/panel/SubjectSetting/PanelStyle/ComponentGap.vue
浏览文件 @
abb58954
...
...
@@ -7,25 +7,24 @@
trigger=
"click"
>
<el-col>
<el-radio
v-model=
"panel.gap"
label=
"yes"
@
change=
"onChangePanelStyle"
>
{{
$t
(
'panel.gap'
)
}}
</el-radio>
<el-radio
v-model=
"panel.gap"
label=
"yes"
@
change=
"onChangePanelStyle"
>
{{
$t
(
'panel.gap'
)
}}
</el-radio>
<el-radio
v-model=
"panel.gap"
label=
"no"
@
change=
"onChangePanelStyle"
>
{{
$t
(
'panel.no_gap'
)
}}
</el-radio>
</el-col>
<el-button
slot=
"reference"
size=
"mini"
class=
"shape-item"
>
{{
$t
(
'panel.component_gap'
)
}}
<i
class=
"el-icon-setting el-icon--right"
/></el-button>
<el-button
slot=
"reference"
size=
"mini"
class=
"shape-item"
>
{{
$t
(
'panel.component_gap'
)
}}
<i
class=
"el-icon-setting el-icon--right"
/></el-button>
</el-popover>
</div>
</div>
</
template
>
<
script
>
// eslint-disable-next-line no-unused-vars
import
{
DEFAULT_PANEL_STYLE
}
from
'@/views/panel/panel'
import
{
mapState
}
from
'vuex'
import
{
deepCopy
}
from
'@/components/canvas/utils/utils'
export
default
{
name
:
'ComponentGap'
,
props
:
{
},
props
:
{},
data
()
{
return
{
panel
:
null
...
...
@@ -44,26 +43,29 @@ export default {
const
canvasStyleData
=
deepCopy
(
this
.
canvasStyleData
)
canvasStyleData
.
panel
=
this
.
panel
this
.
$store
.
commit
(
'setCanvasStyle'
,
canvasStyleData
)
this
.
$store
.
commit
(
'recordSnapshot'
,
'onChangePanelStyle'
)
this
.
$store
.
commit
(
'recordSnapshot'
,
'onChangePanelStyle'
)
}
}
}
</
script
>
<
style
scoped
>
.avatar-uploader
>>>
.el-upload
{
.avatar-uploader
>>>
.el-upload
{
width
:
100px
;
height
:
60px
;
line-height
:
70px
;
}
.avatar-uploader
>>>
.el-upload-list
li
{
.avatar-uploader
>>>
.el-upload-list
li
{
width
:
100px
!important
;
height
:
60px
!important
;
}
.disabled
>>>
.el-upload--picture-card
{
.disabled
>>>
.el-upload--picture-card
{
display
:
none
;
}
.shape-item
{
.shape-item
{
padding
:
6px
;
border
:
none
;
width
:
100%
;
...
...
@@ -71,20 +73,25 @@ export default {
justify-content
:
space-between
;
align-items
:
center
;
}
.form-item-slider
>>>
.el-form-item__label
{
.form-item-slider
>>>
.el-form-item__label
{
font-size
:
12px
;
line-height
:
38px
;
}
.form-item
>>>
.el-form-item__label
{
.form-item
>>>
.el-form-item__label
{
font-size
:
12px
;
}
.el-select-dropdown__item
{
.el-select-dropdown__item
{
padding
:
0
20px
;
}
span
{
span
{
font-size
:
12px
}
.el-form-item
{
.el-form-item
{
margin-bottom
:
6px
;
}
</
style
>
frontend/src/views/panel/SubjectSetting/PanelStyle/PanelRefreshTime.vue
浏览文件 @
abb58954
...
...
@@ -18,37 +18,37 @@
</el-radio-group>
</el-form-item>
<el-form-item
:label=
"'刷新时间频率'"
class=
"form-item form-item-slider"
>
<el-slider
v-model=
"canvasStyleData.refreshTime"
show-input
:show-input-controls=
"false"
input-size=
"mini"
:min=
"1"
:max=
"3600"
@
change=
"onChangePanelStyle"
/>
<el-slider
v-model=
"canvasStyleData.refreshTime"
show-input
:show-input-controls=
"false"
input-size=
"mini"
:min=
"1"
:max=
"3600"
@
change=
"onChangePanelStyle"
/>
</el-form-item>
</el-form>
</el-col>
<el-button
slot=
"reference"
size=
"mini"
class=
"shape-item"
>
{{
$t
(
'panel.refresh_time'
)
}}
<i
class=
"el-icon-setting el-icon--right"
/></el-button>
<el-button
slot=
"reference"
size=
"mini"
class=
"shape-item"
>
{{
$t
(
'panel.refresh_time'
)
}}
<i
class=
"el-icon-setting el-icon--right"
/></el-button>
</el-popover>
</div>
</div>
</
template
>
<
script
>
// eslint-disable-next-line no-unused-vars
import
{
deepCopy
}
from
'@/components/canvas/utils/utils'
import
{
CANVAS_STYLE
}
from
'@/views/panel/panel'
export
default
{
name
:
'PanelRefreshTime'
,
props
:
{
},
props
:
{},
computed
:
{
canvasStyleData
()
{
return
this
.
$store
.
state
.
canvasStyleData
}
},
created
()
{
// 初始化赋值
// if (!this.canvasStyleData.refreshTime) {
// this.canvasStyleData['refreshTime'] = CANVAS_STYLE.refreshTime
// }
},
methods
:
{
onChangePanelStyle
()
{
...
...
@@ -59,19 +59,22 @@ export default {
</
script
>
<
style
scoped
>
.avatar-uploader
>>>
.el-upload
{
.avatar-uploader
>>>
.el-upload
{
width
:
100px
;
height
:
60px
;
line-height
:
70px
;
}
.avatar-uploader
>>>
.el-upload-list
li
{
.avatar-uploader
>>>
.el-upload-list
li
{
width
:
100px
!important
;
height
:
60px
!important
;
}
.disabled
>>>
.el-upload--picture-card
{
.disabled
>>>
.el-upload--picture-card
{
display
:
none
;
}
.shape-item
{
.shape-item
{
padding
:
6px
;
border
:
none
;
width
:
100%
;
...
...
@@ -79,20 +82,25 @@ export default {
justify-content
:
space-between
;
align-items
:
center
;
}
.form-item-slider
>>>
.el-form-item__label
{
.form-item-slider
>>>
.el-form-item__label
{
font-size
:
12px
;
line-height
:
38px
;
}
.form-item
>>>
.el-form-item__label
{
.form-item
>>>
.el-form-item__label
{
font-size
:
12px
;
}
.el-select-dropdown__item
{
.el-select-dropdown__item
{
padding
:
0
20px
;
}
span
{
span
{
font-size
:
12px
}
.el-form-item
{
.el-form-item
{
margin-bottom
:
6px
;
}
</
style
>
frontend/src/views/panel/SubjectSetting/PanelStyle/PanelViewResult.vue
0 → 100644
浏览文件 @
abb58954
<
template
>
<div>
<div
style=
"width: 100%;"
>
<el-popover
placement=
"right"
width=
"400"
trigger=
"click"
>
<el-row>
<el-col
:span=
"16"
>
<el-radio-group
v-model=
"panel.resultMode"
class=
"radio-span"
size=
"mini"
@
change=
"onChangePanelStyle"
>
<el-radio
label=
"all"
><span>
{{
$t
(
'panel.view'
)
}}
</span></el-radio>
<el-radio
label=
"custom"
>
<span>
{{
$t
(
'panel.panel'
)
}}
</span>
</el-radio>
</el-radio-group>
</el-col>
<el-col
:span=
"8"
class=
"slider-area"
>
<el-slider
v-model=
"panel.resultCount"
:disabled=
"panel.resultMode==='all'"
style=
"margin-left: 5px"
show-input
:show-input-controls=
"false"
:show-tooltip=
"false"
input-size=
"mini"
:min=
"1"
:max=
"10000"
@
change=
"onChangePanelStyle"
/>
</el-col>
</el-row>
<el-row>
<span
style=
"color: #909399; font-size: 8px;margin-left: 3px"
>
Tips:
{{
$t
(
'panel.panel_view_result_tips'
)
}}
</span>
</el-row>
<el-button
slot=
"reference"
size=
"mini"
class=
"shape-item"
>
{{
$t
(
'panel.panel_view_result_show'
)
}}
<i
class=
"el-icon-setting el-icon--right"
/></el-button>
</el-popover>
</div>
</div>
</
template
>
<
script
>
export
default
{
name
:
'PanelViewResult'
,
props
:
{},
data
()
{
return
{
panel
:
null
}
},
computed
:
{
canvasStyleData
()
{
return
this
.
$store
.
state
.
canvasStyleData
}
},
created
()
{
// 初始化赋值
this
.
panel
=
this
.
canvasStyleData
.
panel
},
methods
:
{
onChangePanelStyle
()
{
this
.
$store
.
state
.
styleChangeTimes
++
}
}
}
</
script
>
<
style
scoped
>
.avatar-uploader
>>>
.el-upload
{
width
:
100px
;
height
:
60px
;
line-height
:
70px
;
}
.avatar-uploader
>>>
.el-upload-list
li
{
width
:
100px
!important
;
height
:
60px
!important
;
}
.disabled
>>>
.el-upload--picture-card
{
display
:
none
;
}
.shape-item
{
padding
:
6px
;
border
:
none
;
width
:
100%
;
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
}
.form-item-slider
>>>
.el-form-item__label
{
font-size
:
12px
;
line-height
:
38px
;
}
.form-item
>>>
.el-form-item__label
{
font-size
:
12px
;
}
.el-select-dropdown__item
{
padding
:
0
20px
;
}
span
{
font-size
:
12px
}
.el-form-item
{
margin-bottom
:
6px
;
}
.radio-span
{
margin-top
:
10px
;
}
.radio-span
>>>
.el-radio__label
{
margin-left
:
4px
;
}
.slider-area
>>>
.el-slider__runway
{
display
:
none
;
}
.result-count
{
width
:
80px
;
}
</
style
>
frontend/src/views/panel/SubjectSetting/index.vue
浏览文件 @
abb58954
<
template
>
<el-row
class=
"slider-container"
>
<div
style=
"height: 40px; line-height: 40px; padding-left: 15px; text-align: left; white-space: pre; text-overflow: ellipsis; left: 0px; right: 0px; top: 0px; font-weight: 700"
>
{{
$t
(
'panel.dashboard_theme'
)
}}
</div>
<div
style=
"height: 1px; position: absolute; left: 15px; right: 15px; top: 40px; box-sizing:border-box;border-bottom: 1px solid #e8eaed"
/>
<div
style=
"height: 40px; line-height: 40px; padding-left: 15px; text-align: left; white-space: pre; text-overflow: ellipsis; left: 0px; right: 0px; top: 0px; font-weight: 700"
>
{{
$t
(
'panel.dashboard_theme'
)
}}
</div>
<div
style=
"height: 1px; position: absolute; left: 15px; right: 15px; top: 40px; box-sizing:border-box;border-bottom: 1px solid #e8eaed"
/>
<div>
<slider
/>
</div>
...
...
@@ -9,38 +15,42 @@
<div
v-if=
"collapseShow"
style=
"margin: 10px;overflow-y: auto"
>
<el-collapse
v-model=
"activeNames"
@
change=
"handleChange"
>
<el-collapse-item
:title=
"$t('panel.panel')"
name=
"panel"
>
<!--
<el-row
class=
"shape-item"
>
-->
<!--
<span
class=
"shape-item"
style=
"margin-left: 10px"
>
{{
$t
(
'panel.new_element_distribution'
)
}}
:
</span>
-->
<!-- <!–
<el-switch
v-model=
"canvasStyleData.auxiliaryMatrix"
:width=
"35"
name=
"auxiliaryMatrix"
/>
–>
-->
<!--
<el-radio-group
v-model=
"canvasStyleData.auxiliaryMatrix"
size=
"mini"
name=
"auxiliaryMatrix"
@
change=
"styleChange"
>
-->
<!--
<el-radio-button
:label=
"true"
>
-->
<!--
{{
$t
(
'panel.matrix'
)
}}
<i
class=
"icon iconfont icon-shujujuzhen"
/>
-->
<!--
</el-radio-button>
-->
<!--
<el-radio-button
:label=
"false"
>
-->
<!--
{{
$t
(
'panel.suspension'
)
}}
<i
class=
"icon iconfont icon-xuanfuanniu"
/>
-->
<!--
</el-radio-button>
-->
<!--
</el-radio-group>
-->
<!--
</el-row>
-->
<el-row
class=
"selector-div"
>
<background-selector
class=
"attr-selector"
/>
<component-gap
class=
"attr-selector"
/>
<Panel-Refresh-Time
class=
"attr-selector"
/>
<panel-refresh-time
class=
"attr-selector"
/>
<panel-view-result
class=
"attr-selector"
/>
</el-row>
</el-collapse-item>
<el-collapse-item
:title=
"$t('chart.module_style')"
name=
"component"
>
<el-row
class=
"selector-div"
>
<!--
<title-selector
class=
"attr-selector"
:chart=
"chart"
@
onTextChange=
"onTextChange"
/>
-->
<panel-background-color-selector
v-if=
"chart"
class=
"attr-selector"
:chart=
"chart"
@
onChangeBackgroundForm=
"onChangeBackgroundForm"
/>
<panel-background-color-selector
v-if=
"chart"
class=
"attr-selector"
:chart=
"chart"
@
onChangeBackgroundForm=
"onChangeBackgroundForm"
/>
</el-row>
</el-collapse-item>
<el-collapse-item
:title=
"$t('chart.shape_attr')"
name=
"graphical"
>
<el-row
class=
"selector-div"
>
<panel-color-selector
:source-type=
"'panelEchart'"
class=
"attr-selector"
:chart=
"chart"
@
onColorChange=
"onColorChange"
/>
<panel-color-selector
:source-type=
"'panelEchart'"
class=
"attr-selector"
:chart=
"chart"
@
onColorChange=
"onColorChange"
/>
</el-row>
</el-collapse-item>
<el-collapse-item
:title=
"$t('panel.table')"
name=
"table"
>
<el-row
class=
"selector-div"
>
<panel-color-selector
index=
"10002"
:source-type=
"'panelTable'"
class=
"attr-selector"
:chart=
"tableChart"
@
onColorChange=
"onTableColorChange"
/>
<panel-color-selector
index=
"10002"
:source-type=
"'panelTable'"
class=
"attr-selector"
:chart=
"tableChart"
@
onColorChange=
"onTableColorChange"
/>
</el-row>
</el-collapse-item>
</el-collapse>
...
...
@@ -59,9 +69,11 @@ import PanelRefreshTime from './PanelStyle/PanelRefreshTime'
import
{
mapState
}
from
'vuex'
import
{
deepCopy
}
from
'@/components/canvas/utils/utils'
import
bus
from
'@/utils/bus'
import
PanelViewResult
from
'@/views/panel/SubjectSetting/PanelStyle/PanelViewResult'
export
default
{
components
:
{
PanelViewResult
,
slider
,
BackgroundSelector
,
ComponentGap
,
...
...
@@ -82,8 +94,7 @@ export default {
'canvasStyleData'
]),
watch
:
{
},
watch
:
{},
mounted
()
{
bus
.
$on
(
'onSubjectChange'
,
()
=>
{
...
...
@@ -119,10 +130,8 @@ export default {
this
.
tableChart
.
customAttr
.
color
=
this
.
tableChart
.
customAttr
.
tableColor
},
handleChange
(
val
)
{
// console.log(val)
},
onChangePanelStyle
(
parma
)
{
// console.log('parma:' + JSON.stringify(parma))
},
onColorChange
(
val
)
{
this
.
chart
.
customAttr
.
color
=
val
...
...
@@ -171,21 +180,24 @@ export default {
color
:
#3d4d66
;
font-size
:
12px
;
}
.attr-selector
{
.attr-selector
{
background-color
:
white
;
height
:
32px
;
margin
:
5px
5px
5px
5px
;
padding
:
0
4px
;
padding
:
0
4px
;
display
:
flex
;
align-items
:
center
;
z-index
:
10001
;
}
.blackTheme
.attr-selector
{
.blackTheme
.attr-selector
{
background-color
:
var
(
--
MainBG
)
}
.selector-div
{
background-color
:
var
(
--
MainBG
,
#f7f8fa
);
margin
:
5px
background-color
:
var
(
--
MainBG
,
#f7f8fa
);
margin
:
5px
}
</
style
>
frontend/src/views/panel/panel.js
浏览文件 @
abb58954
// eslint-disable-next-line no-unused-vars
import
{
BASE_CHART
,
BASE_CHART_STRING
}
from
'@/views/chart/chart/chart'
import
{
deepCopy
}
from
'@/components/canvas/utils/utils'
...
...
@@ -7,7 +6,9 @@ export const DEFAULT_PANEL_STYLE = {
color
:
'#ffffff'
,
imageUrl
:
null
,
backgroundType
:
'image'
,
gap
:
'yes'
gap
:
'yes'
,
resultMode
:
'all'
,
// 视图结果显示模式 all 视图 custom 仪表板自定义
resultCount
:
1000
// 视图结果显示条数
}
export
const
CANVAS_STYLE
=
{
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论