From bbd471e2d0f08046a2655bbbd3600bfd102f095a Mon Sep 17 00:00:00 2001 From: wangyuting Date: Tue, 11 Jul 2023 10:35:43 +0800 Subject: [PATCH] * Adjust productstatistic block and qastatistic block style. --- module/block/config.php | 2 +- module/block/css/qastatisticblock.ui.css | 8 +++ module/block/js/qastatisticblock.ui.js | 27 ++++++++++ .../block/ui/productstatisticblock.html.php | 41 +++++++++++---- module/block/ui/qastatisticblock.html.php | 51 +++++++++++++------ 5 files changed, 104 insertions(+), 25 deletions(-) diff --git a/module/block/config.php b/module/block/config.php index d5c0ce6486..ea68bd316f 100644 --- a/module/block/config.php +++ b/module/block/config.php @@ -318,7 +318,7 @@ $config->block->size['product']['story'] = array('2' => '6', '1' => ' $config->block->size['product']['plan'] = array('2' => '6', '1' => '6'); $config->block->size['product']['bug'] = array('2' => '6', '1' => '6'); $config->block->size['product']['release'] = array('2' => '6', '1' => '6'); -$config->block->size['product']['statistic'] = array('2' => '5', '1' => '8'); +$config->block->size['product']['statistic'] = array('2' => '5', '1' => '11'); $config->block->size['product']['bugstatistic'] = array('2' => '5', '1' => '8'); $config->block->size['product']['monthlyprogress'] = array('2' => '5'); $config->block->size['product']['annualworkload'] = array('2' => '6'); diff --git a/module/block/css/qastatisticblock.ui.css b/module/block/css/qastatisticblock.ui.css index 61b81d66ae..c40334541b 100644 --- a/module/block/css/qastatisticblock.ui.css +++ b/module/block/css/qastatisticblock.ui.css @@ -7,6 +7,14 @@ .qastatistic-block .chart {margin: auto;} .qastatistic-block .story-num {margin: auto;} +.qastatistic-block.block-sm .nav-tabs .nav-item.active {display: flex!important;} +.qastatistic-block.block-sm .nav-tabs .nav-item > a {width: 100%;} +.qastatistic-block.block-sm .nav-tabs .nav-item {display: none} +.qastatistic-block.block-sm .nav-tabs .nav-item.nav-prev {display: flex} +.qastatistic-block.block-sm .nav-tabs .nav-item.nav-prev > a {padding: 0;} +.qastatistic-block.block-sm .nav-tabs .nav-item.nav-next {display: flex} +.qastatistic-block.block-sm .nav-tabs .nav-item.nav-next > a {padding: 0;} + .qastatistic-block .chart > div {margin: auto;} .qastatistic-block .pie-chart {position: relative;} .qastatistic-block .pie-chart .pie-chart-title {position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -35px} diff --git a/module/block/js/qastatisticblock.ui.js b/module/block/js/qastatisticblock.ui.js index 7490e4feaa..08d91f01af 100644 --- a/module/block/js/qastatisticblock.ui.js +++ b/module/block/js/qastatisticblock.ui.js @@ -1,3 +1,30 @@ +$(function() +{ + $('.qastatistic-block.block-sm .nav.nav-tabs').find('.nav-item.nav-switch').removeClass('active'); + $('.qastatistic-block.block-sm .nav.nav-tabs').find('.nav-item.nav-switch').each(function() + { + if($(this).find('a[data-toggle=tab]').hasClass('active')) $(this).addClass('active'); + }) +}); + +function switchNav(event) +{ + var isPrev = $(event.target).closest('.nav-item').hasClass('nav-prev'); + var $navTabs = $(event.target).closest('.nav-tabs'); + + var $switch = isPrev ? $navTabs.find('.nav-switch > a.active').parent().prev() : $navTabs.find('.nav-switch > a.active').parent().next(); + if($switch.length) $switch.find('a[data-toggle=tab]').trigger('click'); +} + +$('.qastatistic-block.block-sm .nav.nav-tabs').on('show', function(event, info) +{ + $(event.target).find('.nav-item.nav-switch').removeClass('active'); + $(event.target).find('.nav-item.nav-switch').each(function() + { + if($(this).find('a[data-toggle=tab]').hasClass('active')) $(this).addClass('active'); + }) +}); + $('.qastatistic-block .nav.nav-tabs').on('show', function(event, info) { $('#' + info[1] + ' .chart').each(function() diff --git a/module/block/ui/productstatisticblock.html.php b/module/block/ui/productstatisticblock.html.php index decc54e7f4..d8e3aa2e72 100644 --- a/module/block/ui/productstatisticblock.html.php +++ b/module/block/ui/productstatisticblock.html.php @@ -58,7 +58,8 @@ $getProductTabs = function(array $products, string $blockNavCode, bool $longBloc icon ( set('class', 'rotate-90 text-primary'), - 'export' + setStyle(array('--tw-rotate' => '270deg')), + 'import' ) ) ); @@ -88,9 +89,31 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) $tabItems = array(); foreach($products as $product) { + $product->storyDeliveryRate = rand(0, 100); + $product->monthStories = array(); + $product->monthStories[date('Y-m')] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + $product->monthStories[date('Y-m', strtotime('first day of -1 month'))] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + $product->monthStories[date('Y-m', strtotime('first day of -2 month'))] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + $product->monthStories[date('Y-m', strtotime('first day of -3 month'))] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + $product->monthStories[date('Y-m', strtotime('first day of -4 month'))] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + $product->monthStories[date('Y-m', strtotime('first day of -5 month'))] = array('done' => rand(0, 100), 'opened' => rand(0, 100)); + + $doneData = array(); + $openedData = array(); + foreach($product->monthStories as $date => $monthStories) + { + if($date == date('Y-m')) + { + $product->monthStories[$lang->datepicker->dpText->TEXT_THIS_MONTH] = $monthStories; + unset($product->monthStories[$date]); + } + $doneData[] = $monthStories['done']; + $openedData[] = $monthStories['opened']; + } + $stories = $product->stories; $monthStories = $product->monthStories; - $tabItems[] = div + $tabItems[] = div ( set('class', 'tab-pane h-full' . ($product->id == $selected ? ' active' : '')), set('id', "tab3{$blockNavID}Content{$product->id}"), @@ -124,7 +147,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) 'radius' => array('80%', '90%'), 'itemStyle' => array('borderRadius' => '40'), 'label' => array('show' => false), - 'data' => array(69.9, 100-69.9) + 'data' => array($product->storyDeliveryRate, 100 - $product->storyDeliveryRate) ) ) ) @@ -132,7 +155,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) div ( set::class('pie-chart-title text-center'), - div(span(set::class('text-2xl font-bold'), '69.9%')), + div(span(set::class('text-2xl font-bold'), $product->storyDeliveryRate)), div(span(set::class('text-sm text-gray'), $lang->block->productstatistic->deliveryRate, icon('help', set('data-toggle', 'tooltip'), set('id', 'storyTip'), set('class', 'text-light')))) ) ), @@ -234,12 +257,12 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) span ( set('class', 'border-r pr-2 text-sm text-gray'), - html(sprintf($lang->block->productstatistic->monthDone, !empty($monthStories[date('Y-m')]) ? $monthStories[date('Y-m')]->done : 0)) + html(sprintf($lang->block->productstatistic->monthDone, !empty($monthStories[$lang->datepicker->dpText->TEXT_THIS_MONTH]['done']) ? $monthStories[$lang->datepicker->dpText->TEXT_THIS_MONTH]['done'] : 0)) ), span ( set('class', 'pl-2 text-sm text-gray'), - html(sprintf($lang->block->productstatistic->monthOpened, !empty($monthStories[date('Y-m')]) ? $monthStories[date('Y-m')]->opened : 0)) + html(sprintf($lang->block->productstatistic->monthOpened, !empty($monthStories[$lang->datepicker->dpText->TEXT_THIS_MONTH]['opened']) ? $monthStories[$lang->datepicker->dpText->TEXT_THIS_MONTH]['opened'] : 0)) ) ), div @@ -250,7 +273,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) set::color(array('#2B80FF', '#17CE97')), set::grid(array('left' => '10px', 'top' => '30px', 'right' => '0', 'bottom' => '0', 'containLabel' => true)), set::legend(array('show' => true, 'right' => '0')), - set::xAxis(array('type' => 'category', 'data' => array('1月', '2月', '3月', '4月', '5月', '本月'), 'splitLine' => array('show' => false), 'axisTick' => array('alignWithLabel' => true, 'interval' => '0'))), + set::xAxis(array('type' => 'category', 'data' => array_keys($monthStories), 'splitLine' => array('show' => false), 'axisTick' => array('alignWithLabel' => true, 'interval' => '0'))), set::yAxis(array('type' => 'value', 'name' => '个', 'splitLine' => array('show' => false), 'axisLine' => array('show' => true, 'color' => '#DDD'))), set::series ( @@ -260,13 +283,13 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) ( 'type' => 'line', 'name' => $lang->block->productstatistic->opened, - 'data' => array(23, 25, 27, 22, 24, 30) + 'data' => $openedData ), array ( 'type' => 'line', 'name' => $lang->block->productstatistic->done, - 'data' => array(20, 21, 24, 20, 21, 22) + 'data' => $doneData ) ) ) diff --git a/module/block/ui/qastatisticblock.html.php b/module/block/ui/qastatisticblock.html.php index 6a0fef3c35..7d3225667f 100644 --- a/module/block/ui/qastatisticblock.html.php +++ b/module/block/ui/qastatisticblock.html.php @@ -25,20 +25,32 @@ $getProductTabs = function(array $products, string $blockNavCode, bool $longBloc { $navTabs = array(); $selected = key($products); + $navTabs[] = li + ( + set('class', 'nav-item overflow-hidden nav-prev rounded-full bg-white shadow-md h-6 w-6'), + a(icon(set('size', '24'), 'angle-left')) + ); foreach($products as $product) { $navTabs[] = li ( - set('class', 'nav-item'), + set('class', 'nav-item nav-switch w-full'), a ( - set('class', 'ellipsis title ' . ($product->id == $selected ? 'active' : '')), - set('data-toggle', 'tab'), + set('class', 'ellipsis text-dark title ' . ($longBlock && $product->id == $selected ? ' active' : '')), + $longBlock ? set('data-toggle', 'tab') : null, set('data-name', "tab3{$blockNavCode}Content{$product->id}"), - set('href', "#tab3{$blockNavCode}Content{$product->id}"), + set('href', $longBlock ? "#tab3{$blockNavCode}Content{$product->id}" : helper::createLink('product', 'browse', "productID=$product->id")), $product->name ), + !$longBlock ? a + ( + set('class', 'hidden' . ($product->id == $selected ? ' active' : '')), + set('data-toggle', 'tab'), + set('data-name', "tab3{$blockNavCode}Content{$product->id}"), + set('href', "#tab3{$blockNavCode}Content{$product->id}"), + ) : null, a ( set('class', 'link flex-1 text-right hidden'), @@ -52,6 +64,11 @@ $getProductTabs = function(array $products, string $blockNavCode, bool $longBloc ) ); } + $navTabs[] = li + ( + set('class', 'nav-item overflow-hidden nav-next rounded-full bg-white shadow-md h-6 w-6'), + a(icon(set('size', '24'), 'angle-right')) + ); return $navTabs; }; @@ -73,12 +90,16 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) $tabItems = array(); foreach($products as $product) { - $product->addYesterday = 12; - $product->addToday = 6; - $product->resolvedYesterday = 36; - $product->resolvedToday = 12; - $product->closedYesterday = 24; - $product->closedToday = 12; + $product->addYesterday = rand(0, 100); + $product->addToday = rand(0, 100); + $product->resolvedYesterday = rand(0, 100); + $product->resolvedToday = rand(0, 100); + $product->closedYesterday = rand(0, 100); + $product->closedToday = rand(0, 100); + $product->closedBugRate = rand(0, 100); + $product->totalBug = rand(0, 100); + $product->closedBug = rand(0, 100); + $product->activatedBug = rand(0, 100); $progressMax = max($product->addYesterday, $product->addToday, $product->resolvedYesterday, $product->resolvedToday, $product->closedYesterday, $product->closedToday); $progressBlcok = array(); foreach(array(array('addYesterday', 'addToday'), array('resolvedYesterday', 'resolvedToday'), array('closedYesterday', 'closedToday')) as $group) @@ -169,7 +190,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) 'radius' => array('80%', '90%'), 'itemStyle' => array('borderRadius' => '40'), 'label' => array('show' => false), - 'data' => array(55.7, 100-55.7) + 'data' => array($product->closedBugRate, 100 - $product->closedBugRate) ) ) ) @@ -177,7 +198,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) div ( set::class('pie-chart-title text-center'), - div(span(set::class('text-2xl font-bold'), '69.9%')), + div(span(set::class('text-2xl font-bold'), $product->closedBugRate)), div(span(set::class('text-sm text-gray'), $lang->block->qastatistic->closedBugRate, icon('help', set('data-toggle', 'tooltip'), set('id', 'storyTip'), set('class', 'text-light')))) ) ), @@ -189,7 +210,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) set('class', 'flex-1 text-center'), div ( - span(!empty($product->total) ? $product->total : 0) + span(!empty($product->totalBug) ? $product->totalBug : 0) ), div ( @@ -205,7 +226,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) set('class', 'flex-1 text-center'), div ( - span(!empty($product->closed) ? $product->closed : 0) + span(!empty($product->closedBug) ? $product->closedBug : 0) ), div ( @@ -221,7 +242,7 @@ $getProductInfo = function(array $products, string $blockNavID, bool $longBlock) set('class', 'flex-1 text-center'), div ( - span(!empty($product->activated) ? $product->activated : 0) + span(!empty($product->activatedBug) ? $product->activatedBug : 0) ), div (