Design/EasySoft-ZenTaoPMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 30 Wiki Activity

* refactor history style.

Browse Source
This commit is contained in:
dingyongliang
2023-05-08 16:41:54 +08:00
parent 1cea286323
commit ddd258339d
2 changed files with 123 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/zin/wg/history/css/v1.css
+25 -2
View File
@@ -6,6 +6,12 @@
font-size: 14px;
font-weight: 700;
line-height: 20px;
display: flex;
align-items: center;
}
.histories {
background: #FCFDFE;
}
.histories .btn-mini {
@@ -22,7 +28,8 @@
.histories .btn {
background-color: #fff;
display: inline-block;
display: inline-flex;
align-items: center;
margin-bottom: 0;
font-weight: 400;
text-align: center;
@@ -69,6 +76,7 @@
background: 0 0;
box-shadow: none;
border-color: transparent;
text-decoration: none;
}
.detail-content {
@@ -77,7 +85,6 @@
}
.histories-list {
padding-left: 15px;
margin-bottom: 0;
margin-top: 0;
list-style: decimal;
@@ -85,6 +92,21 @@
flex-direction: column;
}
.histories-list .timeline {
top: 13px;
bottom: 13px;
left: 10px;
background: #EEE;
}
.histories-list .marker {
color: #5E626D;
border-color: #EEE;
border-width: 1px;
box-shadow: none;
background: #FCFDFE;
}
.histories-list.sort-reverse {
flex-direction: column-reverse;
}
@@ -93,6 +115,7 @@
word-break: break-word;
word-wrap: break-word;
position: relative;
list-style: none;
}
.histories-list > li strong {
lib/zin/wg/history/v1.php
+98 -85
View File
@@ -14,10 +14,24 @@ class history extends wg
return file_get_contents(__DIR__ . DS . 'css' . DS . 'v1.css');
}
private function marker(int $num)
{
return span
(
setClass('marker', 'label', 'rounded-full', 'aspect-square', 'inline-flex', 'justify-center', 'items-center', 'mr-2'),
$num
);
}
private function timeline()
{
return div(setClass('timeline w-px absolute'));
}
private function checkEditCommentPriv($action)
{
global $app;
$methodName = $this->prop('methodName') ?? data('methodName');
$methodName = $this->prop('methodName') === null ? $this->prop('methodName') : data('methodName');
return (!isset($canBeChanged) || !empty($canBeChanged))
&& end($actions) == $action
@@ -27,10 +41,9 @@ class history extends wg
&& common::hasPriv('action', 'editComment');
}
private function createExpandBtn($i)
private function expandBtn($i)
{
global $lang;
return button
(
setClass('btn btn-mini switch-btn btn-icon btn-expand'),
@@ -52,10 +65,9 @@ class history extends wg
);
}
private function createEditCommentBtn()
private function editCommentBtn()
{
global $lang;
return button
(
setClass('btn btn-link btn-icon btn-sm btn-edit-comment'),
@@ -64,10 +76,9 @@ class history extends wg
);
}
private function createHistoryChangesView($action, $i)
private function historyChanges($action, $i)
{
global $app;
return div
(
setClass('history-changes'),
@@ -76,18 +87,19 @@ class history extends wg
);
}
private function createActionItemView($action, $i)
private function actionItem($action, $i)
{
global $app;
return li
(
setClass('my-3'),
set::value($i),
$this->marker($i),
html($app->loadTarget('action')->renderAction($action))
);
}
private function generateComment($action)
private function getComment($action)
{
if(str_contains($action->comment, '<pre class="prettyprint lang-html">'))
{
@@ -102,10 +114,9 @@ class history extends wg
: $action->comment;
}
private function createCommentView($action)
private function comment($action)
{
$comment = $this->generateComment($action);
$comment = $this->getComment($action);
return div
(
setClass('article-content comment'),
@@ -117,10 +128,9 @@ class history extends wg
);
}
private function createCommentEditForm($action)
private function commentEditForm($action)
{
global $lang;
return form
(
setClass('comment-edit-form'),
@@ -156,51 +166,38 @@ class history extends wg
);
}
private function buildHistoriesList()
private function historyList()
{
$actions = $this->prop('actions') ?? data('actions');
$users = $this->prop('users') ?? data('users');
$historiesListView = h::ol(setClass('histories-list'));
$actions = $this->prop('actions') === null ? $this->prop('actions') : data('actions');
$users = $this->prop('users') === null ? $this->prop('users') : data('users');
$historiesListView = h::ol(setClass('histories-list relative'));
$i = 0;
$historiesListView->add($this->timeline());
foreach($actions as $action)
{
if($action->action === 'assigned' || $action->action === 'toaudit')
$action->extra = zget($users, $action->extra);
if($action->action === 'assigned' || $action->action === 'toaudit') $action->extra = zget($users, $action->extra);
$action->actor = zget($users, $action->actor);
if(str_contains($action->actor, ':'))
$action->actor = substr($action->actor, strpos($action->actor, ':') + 1);
if(str_contains($action->actor, ':')) $action->actor = substr($action->actor, strpos($action->actor, ':') + 1);
$i++;
$actionItemView = $this->createActionItemView($action, $i);
$actionItemView = $this->actionItem($action, $i);
if(!empty($action->history))
{
$allExpandBtn = $this->createExpandBtn($i);
$actionItemView->add($allExpandBtn);
$historyChangesView = $this->createHistoryChangesView($action, $i);
$actionItemView->add($historyChangesView);
$actionItemView->add($this->expandBtn($i));
$actionItemView->add($this->historyChanges($action, $i));
}
if(strlen(trim(($action->comment))) !== 0)
{
$canEditComment = $this->checkEditCommentPriv($action);
if($canEditComment)
{
$editCommentBtn = $this->createEditCommentBtn();
$actionItemView->add($editCommentBtn);
}
if($canEditComment) $actionItemView->add($this->editCommentBtn());
$commentView = $this->createCommentView($action);
$actionItemView->add($commentView);
$actionItemView->add($this->comment($action));
if($canEditComment)
{
$commentEditForm = $this->createCommentEditForm($action);
$actionItemView->add($commentEditForm);
}
if($canEditComment) $actionItemView->add($this->commentEditForm($action));
}
$historiesListView->add($actionItemView);
}
@@ -208,6 +205,62 @@ class history extends wg
return $historiesListView;
}
private function reverseBtn()
{
global $lang;
return btn
(
setClass('btn-mini btn-icon btn-reverse mr-2'),
set::title($lang->reverse),
set::icon('arrow-up'),
on::click(<<<REVERSE
document.querySelector('.histories-list').classList.toggle('sort-reverse');
var icon = e.target.querySelector('.icon');
icon.classList.toggle('icon-arrow-up');
icon.classList.toggle('icon-arrow-down');
REVERSE)
);
}
private function expandAllBtn()
{
global $lang;
return btn
(
setClass('btn-mini btn-icon btn-expand-all'),
set::title($lang->switchDisplay),
set::icon('plus'),
on::click(<<<EXPANDALL
var icon = e.target.querySelector('.icon');
var isExpand = icon.classList.contains('icon-plus');
var changeBoxs = document.querySelectorAll('[id^="changeBox"]');
if(isExpand) {
changeBoxs.forEach(function(box) {
box.classList.add('show');
});
} else {
changeBoxs.forEach(function(box) {
box.classList.remove('show');
});
}
icon.classList.toggle('icon-plus');
icon.classList.toggle('icon-minus');
EXPANDALL)
);
}
private function commentBtn()
{
global $lang;
return btn
(
setClass('btn-comment btn-link ml-4'),
set::icon('chat-line'),
set::iconClass('text-primary'),
$lang->action->create
);
}
protected function build()
{
global $lang;
@@ -221,51 +274,11 @@ class history extends wg
(
setClass('detail-title'),
span($lang->history),
button
(
setClass('btn btn-mini btn-icon btn-reverse'),
setStyle('margin-right', '4px'),
set::type('button'),
set::title($lang->reverse),
h::i(setClass('icon icon-arrow-up icon-sm')),
on::click(<<<REVERSE
document.querySelector('.histories-list').classList.toggle('sort-reverse');
var icon = e.target.querySelector('.icon');
icon.classList.toggle('icon-arrow-up');
icon.classList.toggle('icon-arrow-down');
REVERSE),
),
button
(
setClass('btn btn-mini btn-icon btn-expand-all'),
set::type('button'),
set::title($lang->switchDisplay),
h::i(setClass('icon icon-plus icon-sm')),
on::click(<<<EXPANDALL
var icon = e.target.querySelector('.icon');
var isExpand = icon.classList.contains('icon-plus');
var changeBoxs = document.querySelectorAll('[id^="changeBox"]');
if(isExpand) {
changeBoxs.forEach(function(box) {
box.classList.add('show');
});
} else {
changeBoxs.forEach(function(box) {
box.classList.remove('show');
});
}
icon.classList.toggle('icon-plus');
icon.classList.toggle('icon-minus');
EXPANDALL),
),
button
(
setClass('btn btn-link pull-right btn-comment'),
set::type('button'),
h::i(setClass('icon icon-chat-line'), ' ' . $lang->action->create)
),
$this->reverseBtn(),
$this->expandAllBtn(),
$this->commentBtn(),
),
div(setClass('detail-content'), $this->buildHistoriesList())
div(setClass('detail-content'), $this->historyList())
);
}
}