* Add inside and outside query button.

This commit is contained in:
宋辰轩
2023-04-12 16:21:52 +08:00
parent b5aabadf8b
commit f8f4c3363e
3 changed files with 20 additions and 10 deletions
+1 -1
View File
@@ -48,6 +48,6 @@
.filter-items{display: flex; flex: 1; flex-wrap: wrap;}
.filter-item{padding: 0 16px 5px 0;}
.filter-item-grow{flex-grow: 1;}
.queryBtn{display: flex; align-items: center; padding-bottom: 5px;}
.queryBtn{display: flex; align-items: center; padding-bottom: 5px; flex-basis: 60px;}
.filterBox .picker-selections{width: 128px; height: 32px; overflow: hidden; text-overflow: clip; white-space: nowrap;}
+14 -6
View File
@@ -9,7 +9,7 @@ $(function()
{
var chartPros = charts.map(function(chart)
{
var echartDom = $('#chartDraw' + chart.currentGroup + chart.id).get(0);
var echartDom = $('#chartDraw' + chart.currentGroup + '_' + chart.id).get(0);
var echart = echarts.init(echartDom);
ajaxGetChart(false, chart, echart);
chartMap.set(chart.cudrrentGroup + chart.id, chart);
@@ -18,14 +18,12 @@ $(function()
Promise.all(chartPros).then(function()
{
console.log(11);
calcPreviewGrowFilter();
$('body').resize(() => {calcPreviewGrowFilter(true);});
});
}
$('[data-toggle="tooltip"]').tooltip();
})
@@ -132,12 +130,13 @@ function calcPreviewGrowFilter(resize = false)
/* When body resize, resize echarts. */
if(resize)
{
var echartDom = $('#chartDraw' + chart.currentGroup + chart.id).get(0);
var echartDom = $('#chartDraw' + chart.currentGroup + '_' + chart.id).get(0);
var echart = echarts.init(echartDom);
echart.resize();
}
var $filterItems = $('#filterItems' + chart.currentGroup + chart.id + ' .filter-items');
var $filterBox = $('#filterItems' + chart.currentGroup + '_' + chart.id);
var $filterItems = $filterBox.find('.filter-items');
/* When refreshing this page, ZenTao load this page twice, when the first load isn't complete, jump back to index and load the second time,
the first load can't calc filter width, can't get the element using jQuery at first load. */
var hasInit = true;
@@ -151,8 +150,12 @@ function calcPreviewGrowFilter(resize = false)
var domWidth = $filterItems[0].getBoundingClientRect().width;
var nowWidth = domWidth;
var lineWrap = false;
var nowCount = 0;
var canGrowTotal = 0;
$filterBox.find('.query-inside').addClass('hidden');
$filterBox.find('.query-outside').addClass('hidden');
chart.filters.forEach(function(filter, index)
{
var nowItem = '.filter-item-' + index;
@@ -174,6 +177,7 @@ function calcPreviewGrowFilter(resize = false)
canGrowTotal += nowCount;
nowWidth = domWidth - filterWidth;
nowCount = 1;
lineWrap = true;
}
});
@@ -184,6 +188,9 @@ function calcPreviewGrowFilter(resize = false)
var nowItem = '.filter-item-' + index;
if(canGrowTotal >= index + 1) $filterItems.find(nowItem).addClass('filter-item-grow');
});
var queryType =(!lineWrap && nowWidth >= 60) ? '.query-inside' : '.query-outside';
$filterBox.find(queryType).removeClass('hidden');
});
}
@@ -202,11 +209,12 @@ function renderFilters(chart)
$.post(createLink('chart', 'ajaxGetFilterForm', 'chartID=' + chart.id), {fieldList: fieldNames, fieldSettings: chart.fieldSettings, filters: chart.filters, langs: chart.langs}, function(resp)
{
resp = JSON.parse(resp);
var $filterItems = $('#filterItems' + chart.currentGroup + '_' + chart.id + ' .filter-items');
chart.filters.forEach(function(filter, index)
{
var $filterItems = $('#filterItems' + chart.currentGroup + chart.id + ' .filter-items');
$filterItems.append(renderFilterItem(filter, resp, index));
});
$filterItems.append(queryDom);
resolve();
});
})
+5 -3
View File
@@ -20,6 +20,8 @@
<?php js::set('WIDTH_INPUT', $config->chart->widthInput);?>
<?php js::set('WIDTH_DATE', $config->chart->widthDate);?>
<?php js::set('pickerHeight', $config->bi->pickerHeight);?>
<?php $queryDom = "<div class='queryBtn query-inside hidden'> <button type='submit' id='submit' class='btn btn-primary btn-query' data-loading='Loading...'>{$lang->chart->query}</button></div>";?>
<?php js::set('queryDom', $queryDom);?>
<div id='mainMenu' class='clearfix main-position'>
<div class='btn-toolBar pull-left parent-position'>
@@ -92,13 +94,13 @@
</div>
</div>
<div class='panel-body'>
<div id="filterItems<?php echo $chart->currentGroup;?><?php echo $chart->id;?>" class='filterBox'>
<div id="filterItems<?php echo $chart->currentGroup . '_';?><?php echo $chart->id;?>" class='filterBox'>
<div class='filter-items'></div>
<?php if(!empty($chart->filters)):?>
<div class='queryBtn'><?php echo html::submitButton($lang->chart->query, "data-chart={$chart->currentGroup}{$chart->id}", 'btn btn-primary btn-query');?></div>
<div class='queryBtn query-outside'><?php echo html::submitButton($lang->chart->query, "data-chart={$chart->currentGroup}{$chart->id}", 'btn btn-primary btn-query');?></div>
<?php endif;?>
</div>
<div id="chartDraw<?php echo $chart->currentGroup;?><?php echo $chart->id;?>" data-group="<?php echo $chart->currentGroup;?>" data-id="<?php echo $chart->id;?>" class='echart-content'></div>
<div id="chartDraw<?php echo $chart->currentGroup . '_';?><?php echo $chart->id;?>" data-group="<?php echo $chart->currentGroup;?>" data-id="<?php echo $chart->id;?>" class='echart-content'></div>
</div>
</div>
<?php endforeach;?>