From f521e88240a2d5dd41ee42d78b96fc89309f1790 Mon Sep 17 00:00:00 2001 From: Hester Gong Date: Mon, 13 Mar 2023 13:31:06 +0800 Subject: [PATCH] Fix actions frontend bugs (pagination, long name alignment) and small simplify (#23370) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 1 Right now on actions page, the action list will not be aligned if commit message is long. In this PR, the changes are: - The branch tag is moved to bottom row - Width percentage is given to make them aligned - Show "..." if commit is longer than two lines. - Align the status icon with the commit message with baseline Before: 截屏2023-03-08 12 23 22 After: 截屏2023-03-08 13 34 28 2 Right now the actions list's pagination is not working properly because Param is not passed to pagination template, in this PR Param Strings are passed to the pager Before: 截屏2023-03-08 12 23 50 After: 截屏2023-03-08 13 11 54 3 A small simplify in `RepoActionView.vue` . --------- Co-authored-by: wxiaoguang Co-authored-by: Lunny Xiao --- routers/web/repo/actions/actions.go | 2 ++ templates/repo/actions/runs_list.tmpl | 14 +++++++------- web_src/js/components/RepoActionView.vue | 3 +-- web_src/less/helpers.less | 1 + web_src/less/shared/issuelist.less | 16 ++++++++++++++++ 5 files changed, 27 insertions(+), 9 deletions(-) diff --git a/routers/web/repo/actions/actions.go b/routers/web/repo/actions/actions.go index e5496676a9..0e7a95ed07 100644 --- a/routers/web/repo/actions/actions.go +++ b/routers/web/repo/actions/actions.go @@ -133,6 +133,8 @@ func List(ctx *context.Context) { pager := context.NewPagination(int(total), opts.PageSize, opts.Page, 5) pager.SetDefaultParams(ctx) + pager.AddParamString("workflow", workflow) + pager.AddParamString("state", ctx.FormString("state")) ctx.Data["Page"] = pager ctx.HTML(http.StatusOK, tplListActions) diff --git a/templates/repo/actions/runs_list.tmpl b/templates/repo/actions/runs_list.tmpl index ffabe534c8..a28b9d7137 100644 --- a/templates/repo/actions/runs_list.tmpl +++ b/templates/repo/actions/runs_list.tmpl @@ -1,14 +1,18 @@
{{range .Runs}} -
  • +
  • {{template "repo/actions/status" .Status}}
    -
    +
    - + {{- .Title -}} +
    +
    + {{if not $.CurWorkflow}}{{.WorkflowID}} {{end}}#{{.Index}}: {{$.locale.Tr "actions.runs.commit"}} + {{ShortSha .CommitSHA}}{{$.locale.Tr "actions.runs.pushed_by"}} {{.TriggerUser.GetDisplayName}} {{if .RefLink}} {{.PrettyRef}} @@ -17,10 +21,6 @@ {{end}}
    -
    - {{if not $.CurWorkflow}}{{.WorkflowID}} {{end}}#{{.Index}}: {{$.locale.Tr "actions.runs.commit"}} - {{ShortSha .CommitSHA}}  {{$.locale.Tr "actions.runs.pushed_by"}} {{.TriggerUser.GetDisplayName | Escape}} -
    {{TimeSinceUnix .Updated $.locale}}
    diff --git a/web_src/js/components/RepoActionView.vue b/web_src/js/components/RepoActionView.vue index aadc8369b7..bf84186c1a 100644 --- a/web_src/js/components/RepoActionView.vue +++ b/web_src/js/components/RepoActionView.vue @@ -43,8 +43,7 @@
    - - + diff --git a/web_src/less/helpers.less b/web_src/less/helpers.less index 08589fdaab..91ea2268e2 100644 --- a/web_src/less/helpers.less +++ b/web_src/less/helpers.less @@ -3,6 +3,7 @@ .gt-dif { display: inline-flex !important; } .gt-dib { display: inline-block !important; } .gt-ac { align-items: center !important; } +.gt-ab { align-items: baseline !important; } .gt-tc { text-align: center !important; } .gt-tl { text-align: left !important; } .gt-tdn { text-decoration: none !important; } diff --git a/web_src/less/shared/issuelist.less b/web_src/less/shared/issuelist.less index 8d4cfc46d4..9f69d6bb3a 100644 --- a/web_src/less/shared/issuelist.less +++ b/web_src/less/shared/issuelist.less @@ -23,6 +23,14 @@ .issue-item-main { width: 100%; } + + .action-item-main { + width: 80%; + } + + .issue-item-right { + width: 15%; + } .issue-item-top-row { max-width: 100%; @@ -30,6 +38,14 @@ font-size: 16px; min-width: 0; font-weight: 600; + a.index { + max-width: fit-content; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; + word-break:break-all; + } } .labels-list {