diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-19 21:06:18 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-19 21:06:18 +0300 |
commit | 81f7adf08b4557c38ac2ef1c730e72e07db2f1a3 (patch) | |
tree | 37239c312903ca5e6ca079b64c35a6e0e01b18c4 /app/assets | |
parent | 383daa1200fb0b8859e2b6ec0eb55f4615538749 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/jobs/components/log/collapsible_section.vue | 55 | ||||
-rw-r--r-- | app/assets/javascripts/jobs/components/log/log.vue | 29 | ||||
-rw-r--r-- | app/assets/stylesheets/framework.scss | 1 |
3 files changed, 65 insertions, 20 deletions
diff --git a/app/assets/javascripts/jobs/components/log/collapsible_section.vue b/app/assets/javascripts/jobs/components/log/collapsible_section.vue new file mode 100644 index 00000000000..7c0deb08488 --- /dev/null +++ b/app/assets/javascripts/jobs/components/log/collapsible_section.vue @@ -0,0 +1,55 @@ +<script> +import LogLine from './line.vue'; +import LogLineHeader from './line_header.vue'; + +export default { + name: 'CollpasibleLogSection', + components: { + LogLine, + LogLineHeader, + }, + props: { + section: { + type: Object, + required: true, + }, + traceEndpoint: { + type: String, + required: true, + }, + }, + computed: { + badgeDuration() { + return this.section.line && this.section.line.section_duration; + }, + }, + methods: { + handleOnClickCollapsibleLine(section) { + this.$emit('onClickCollapsibleLine', section); + }, + }, +}; +</script> +<template> + <div> + <log-line-header + :line="section.line" + :duration="badgeDuration" + :path="traceEndpoint" + :is-closed="section.isClosed" + @toggleLine="handleOnClickCollapsibleLine(section)" + /> + <template v-if="!section.isClosed"> + <template v-for="line in section.lines"> + <collpasible-log-section + v-if="line.isHeader" + :key="`collapsible-nested-${line.offset}`" + :section="line" + :trace-endpoint="traceEndpoint" + @toggleLine="handleOnClickCollapsibleLine" + /> + <log-line v-else :key="line.offset" :line="line" :path="traceEndpoint" /> + </template> + </template> + </div> +</template> diff --git a/app/assets/javascripts/jobs/components/log/log.vue b/app/assets/javascripts/jobs/components/log/log.vue index 429796aeb4e..ef126166e8b 100644 --- a/app/assets/javascripts/jobs/components/log/log.vue +++ b/app/assets/javascripts/jobs/components/log/log.vue @@ -1,12 +1,12 @@ <script> import { mapState, mapActions } from 'vuex'; +import CollpasibleLogSection from './collapsible_section.vue'; import LogLine from './line.vue'; -import LogLineHeader from './line_header.vue'; export default { components: { + CollpasibleLogSection, LogLine, - LogLineHeader, }, computed: { ...mapState(['traceEndpoint', 'trace', 'isTraceComplete']), @@ -22,24 +22,13 @@ export default { <template> <code class="job-log d-block"> <template v-for="(section, index) in trace"> - <template v-if="section.isHeader"> - <log-line-header - :key="`collapsible-${index}`" - :line="section.line" - :duration="section.section_duration" - :path="traceEndpoint" - :is-closed="section.isClosed" - @toggleLine="handleOnClickCollapsibleLine(section)" - /> - <template v-if="!section.isClosed"> - <log-line - v-for="line in section.lines" - :key="line.offset" - :line="line" - :path="traceEndpoint" - /> - </template> - </template> + <collpasible-log-section + v-if="section.isHeader" + :key="`collapsible-${index}`" + :section="section" + :trace-endpoint="traceEndpoint" + @onClickCollapsibleLine="handleOnClickCollapsibleLine" + /> <log-line v-else :key="section.offset" :line="section" :path="traceEndpoint" /> </template> diff --git a/app/assets/stylesheets/framework.scss b/app/assets/stylesheets/framework.scss index 82b4ec750ff..c4a0ed63080 100644 --- a/app/assets/stylesheets/framework.scss +++ b/app/assets/stylesheets/framework.scss @@ -28,6 +28,7 @@ @import 'framework/issue_box'; @import 'framework/lists'; @import 'framework/logo'; +@import 'framework/job_log'; @import 'framework/markdown_area'; @import 'framework/media_object'; @import 'framework/modal'; |