Add latest changes from gitlab-org/gitlab@master
This commit is contained in:
parent
a1ed98e0c8
commit
749c2a5f5a
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import { GlResizeObserverDirective } from '@gitlab/ui';
|
||||
import { GlColumnChart } from '@gitlab/ui/dist/charts';
|
||||
import { debounceByAnimationFrame } from '~/lib/utils/common_utils';
|
||||
import { getSvgIconPathContent } from '~/lib/utils/icon_utils';
|
||||
import { chartHeight } from '../../constants';
|
||||
import { makeDataSeries } from '~/helpers/monitor_helper';
|
||||
|
@ -10,24 +10,21 @@ export default {
|
|||
components: {
|
||||
GlColumnChart,
|
||||
},
|
||||
inheritAttrs: false,
|
||||
directives: {
|
||||
GlResizeObserverDirective,
|
||||
},
|
||||
props: {
|
||||
graphData: {
|
||||
type: Object,
|
||||
required: true,
|
||||
validator: graphDataValidatorForValues.bind(null, false),
|
||||
},
|
||||
containerWidth: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: 0,
|
||||
height: chartHeight,
|
||||
svgs: {},
|
||||
debouncedResizeCallback: {},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
@ -68,15 +65,7 @@ export default {
|
|||
};
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
containerWidth: 'onResize',
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('resize', this.debouncedResizeCallback);
|
||||
},
|
||||
created() {
|
||||
this.debouncedResizeCallback = debounceByAnimationFrame(this.onResize);
|
||||
window.addEventListener('resize', this.debouncedResizeCallback);
|
||||
this.setSvg('scroll-handle');
|
||||
},
|
||||
methods: {
|
||||
|
@ -84,6 +73,7 @@ export default {
|
|||
return `${query.label}`;
|
||||
},
|
||||
onResize() {
|
||||
if (!this.$refs.columnChart) return;
|
||||
const { width } = this.$refs.columnChart.$el.getBoundingClientRect();
|
||||
this.width = width;
|
||||
},
|
||||
|
@ -100,7 +90,7 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="prometheus-graph">
|
||||
<div v-gl-resize-observer-directive="onResize" class="prometheus-graph">
|
||||
<div class="prometheus-graph-header">
|
||||
<h5 ref="graphTitle" class="prometheus-graph-title">{{ graphData.title }}</h5>
|
||||
<div ref="graphWidgets" class="prometheus-graph-widgets"><slot></slot></div>
|
||||
|
|
|
@ -1,26 +1,29 @@
|
|||
<script>
|
||||
import { GlResizeObserverDirective } from '@gitlab/ui';
|
||||
import { GlHeatmap } from '@gitlab/ui/dist/charts';
|
||||
import dateformat from 'dateformat';
|
||||
import PrometheusHeader from '../shared/prometheus_header.vue';
|
||||
import ResizableChartContainer from '~/vue_shared/components/resizable_chart/resizable_chart_container.vue';
|
||||
import { graphDataValidatorForValues } from '../../utils';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
GlHeatmap,
|
||||
ResizableChartContainer,
|
||||
PrometheusHeader,
|
||||
},
|
||||
directives: {
|
||||
GlResizeObserverDirective,
|
||||
},
|
||||
props: {
|
||||
graphData: {
|
||||
type: Object,
|
||||
required: true,
|
||||
validator: graphDataValidatorForValues.bind(null, false),
|
||||
},
|
||||
containerWidth: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
chartData() {
|
||||
|
@ -52,22 +55,27 @@ export default {
|
|||
return this.graphData.metrics[0];
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onResize() {
|
||||
if (this.$refs.heatmapChart) return;
|
||||
const { width } = this.$refs.heatmapChart.$el.getBoundingClientRect();
|
||||
this.width = width;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="prometheus-graph col-12 col-lg-6">
|
||||
<div v-gl-resize-observer-directive="onResize" class="prometheus-graph col-12 col-lg-6">
|
||||
<prometheus-header :graph-title="graphData.title" />
|
||||
<resizable-chart-container>
|
||||
<gl-heatmap
|
||||
ref="heatmapChart"
|
||||
v-bind="$attrs"
|
||||
:data-series="chartData"
|
||||
:x-axis-name="xAxisName"
|
||||
:y-axis-name="yAxisName"
|
||||
:x-axis-labels="xAxisLabels"
|
||||
:y-axis-labels="yAxisLabels"
|
||||
:width="containerWidth"
|
||||
/>
|
||||
</resizable-chart-container>
|
||||
<gl-heatmap
|
||||
ref="heatmapChart"
|
||||
v-bind="$attrs"
|
||||
:data-series="chartData"
|
||||
:x-axis-name="xAxisName"
|
||||
:y-axis-name="yAxisName"
|
||||
:x-axis-labels="xAxisLabels"
|
||||
:y-axis-labels="yAxisLabels"
|
||||
:width="width"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -14,6 +14,7 @@ import MonitorTimeSeriesChart from './charts/time_series.vue';
|
|||
import MonitorAnomalyChart from './charts/anomaly.vue';
|
||||
import MonitorSingleStatChart from './charts/single_stat.vue';
|
||||
import MonitorHeatmapChart from './charts/heatmap.vue';
|
||||
import MonitorColumnChart from './charts/column.vue';
|
||||
import MonitorEmptyChart from './charts/empty_chart.vue';
|
||||
import TrackEventDirective from '~/vue_shared/directives/track_event';
|
||||
import { downloadCSVOptions, generateLinkToChartOptions } from '../utils';
|
||||
|
@ -21,6 +22,7 @@ import { downloadCSVOptions, generateLinkToChartOptions } from '../utils';
|
|||
export default {
|
||||
components: {
|
||||
MonitorSingleStatChart,
|
||||
MonitorColumnChart,
|
||||
MonitorHeatmapChart,
|
||||
MonitorEmptyChart,
|
||||
Icon,
|
||||
|
@ -114,7 +116,10 @@ export default {
|
|||
<monitor-heatmap-chart
|
||||
v-else-if="isPanelType('heatmap') && graphDataHasMetrics"
|
||||
:graph-data="graphData"
|
||||
:container-width="dashboardWidth"
|
||||
/>
|
||||
<monitor-column-chart
|
||||
v-else-if="isPanelType('column') && graphDataHasMetrics"
|
||||
:graph-data="graphData"
|
||||
/>
|
||||
<component
|
||||
:is="monitorChartComponent"
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
title: Add support for column charts
|
||||
merge_request: 23903
|
||||
author:
|
||||
type: changed
|
|
@ -72,6 +72,16 @@ and they will assist you with any issues you are having.
|
|||
This is the principle of Kubernetes, read [Twelve-factor app](https://12factor.net/)
|
||||
for details.
|
||||
|
||||
- How to get cronjobs configured on a cluster
|
||||
|
||||
```bash
|
||||
kubectl get cronjobs
|
||||
```
|
||||
|
||||
When one configures [cron-based backups](https://docs.gitlab.com/charts/backup-restore/backup.html#cron-based-backup),
|
||||
you will be able to see the new schedule here. Some details about the schedules can be found
|
||||
in [Running Automated Tasks with a CronJob](https://kubernetes.io/docs/tasks/job/automated-tasks-with-cron-jobs/#creating-a-cron-job)
|
||||
|
||||
## GitLab-specific Kubernetes information
|
||||
|
||||
- Minimal config that can be used to test a Kubernetes Helm chart can be found
|
||||
|
|
Loading…
Reference in New Issue