Improve chart fullscreen UI and add table cell selection

This commit is contained in:
RB 2025-09-01 15:54:10 +08:00
parent 2803b3acc9
commit 3feb486dd4
6 changed files with 31 additions and 7 deletions

2
@rbv

@ -1 +1 @@
Subproject commit 8f0e04c31603daa7893e7afb34f9a86b5e9348c3
Subproject commit 3c40f82ef6eac7641a651907fefe6a51a14a9c52

View file

@ -348,6 +348,7 @@ See LICENSE and COMMERCIAL in the project root for license information.
width: 100%;
height: 240px;
background-color: #fff;
border-radius: 6px;
}
#asideCharts .chart-box .chart-body {
@ -367,7 +368,6 @@ See LICENSE and COMMERCIAL in the project root for license information.
}
#asideCharts .chart-box:hover .chart-oper a.J_source,
#asideCharts .chart-box:hover .chart-oper a.J_fullscreen,
#asideCharts .chart-box:hover .chart-oper a.J_chart-edit,
#asideCharts .chart-box:hover .chart-oper a.J_export {
display: none !important;
@ -381,11 +381,28 @@ See LICENSE and COMMERCIAL in the project root for license information.
position: fixed;
top: 60px !important;
left: 230px !important;
width: 100% !important;
height: 100% !important;
right: 0 !important;
bottom: 0 !important;
z-index: 9999;
background-color: #fff;
padding: 20px;
margin: 0;
overflow: hidden;
transition: all 0.3s;
}
#asideCharts .charts-wrap > div.fullscreen .chart-box {
height: 100%;
}
@media (min-width: 768px) and (max-width: 1464px) {
#asideCharts .charts-wrap > div.fullscreen {
left: 200px !important;
}
}
.rb-collapsible-sidebar-collapsed #asideCharts .charts-wrap > div.fullscreen {
left: 60px !important;
}
#asideCharts .charts-wrap .ui-sortable-helper {

View file

@ -3840,10 +3840,14 @@ a.user-show:not([href]) {
}
.page-aside.widgets {
z-index: 2;
z-index: 3;
overflow: hidden;
}
.page-aside.widgets + .main-content {
z-index: 2;
}
.page-aside.widgets .tab-container {
min-width: 279px;
overflow: hidden;

View file

@ -109,12 +109,13 @@ class BaseChart extends React.Component {
const $stack = $('.chart-grid>.grid-stack')
if (!$stack[0]) {
// in DataList
// $(this._$box).parent().toggleClass('fullscreen')
const $wrap = $(this._$box).parent()
$wrap.toggleClass('fullscreen')
this.resize()
return
}
const $boxParent = $(this._$box).parents('.grid-stack-item')
if (this.state.fullscreen) {
BaseChart.currentFullscreen = this
if (!this.__chartStackHeight) this.__chartStackHeight = $stack.height()

View file

@ -133,6 +133,7 @@
}
</script>
<script th:src="@{/assets/lib/charts/echarts.min.js?v=5.5.0}"></script>
<script th:src="@{/assets/lib/charts/tablecellsselection.js}"></script>
<script th:src="@{/assets/js/charts/charts.js}" type="text/babel"></script>
<script th:src="@{/assets/js/metadata/field-compatible.js}" type="text/babel"></script>
<script th:src="@{/assets/js/metadata/field-valueset.js}" type="text/babel"></script>

View file

@ -144,6 +144,7 @@
}
</script>
<script th:src="@{/assets/lib/charts/echarts.min.js?v=5.5.0}"></script>
<script th:src="@{/assets/lib/charts/tablecellsselection.js}"></script>
<script th:src="@{/assets/js/charts/charts.js}" type="text/babel"></script>
<script th:src="@{/assets/js/metadata/field-compatible.js}" type="text/babel"></script>
<script th:src="@{/assets/js/metadata/field-valueset.js}" type="text/babel"></script>