2
0
mirror of https://github.com/tenrok/vue-ganttastic.git synced 2026-06-21 17:10:33 +03:00

feat: row label style

This commit is contained in:
2021-10-27 16:37:56 +03:00
parent 6e1f59167a
commit dad1cf7545
3 changed files with 11 additions and 1 deletions
+4
View File
@@ -48,6 +48,7 @@ The following code showcases a simple usage example in a .vue SFC (Single File C
v-for="row in rows" v-for="row in rows"
:key="row.label" :key="row.label"
:label="row.label" :label="row.label"
:label-style="row.labelStyle"
:bars="row.bars" :bars="row.bars"
bar-start="myStart" bar-start="myStart"
bar-end="myEnd" bar-end="myEnd"
@@ -76,6 +77,9 @@ The following code showcases a simple usage example in a .vue SFC (Single File C
rows: [ rows: [
{ {
label: "My row #1", label: "My row #1",
labelStyle: {
justifyContent: "end"
},
bars: [ bars: [
{ {
myStart: "2020-03-01 12:10", myStart: "2020-03-01 12:10",
+3 -1
View File
@@ -49,6 +49,7 @@ export default {
props: { props: {
label: { type: String, default: 'Row' }, label: { type: String, default: 'Row' },
labelStyle: { type: Object },
bars: { type: Array, default: () => [] }, bars: { type: Array, default: () => [] },
highlightOnHover: { type: Boolean } highlightOnHover: { type: Boolean }
}, },
@@ -107,7 +108,8 @@ export default {
background: this.themeColors.ternary, background: this.themeColors.ternary,
color: this.themeColors.text, color: this.themeColors.text,
borderTop: `1px solid ${this.themeColors.rowLabelBorder}`, borderTop: `1px solid ${this.themeColors.rowLabelBorder}`,
borderBottom: `1px solid ${this.themeColors.rowLabelBorder}` borderBottom: `1px solid ${this.themeColors.rowLabelBorder}`,
...this.labelStyle
} }
} }
}, },
+4
View File
@@ -25,6 +25,7 @@
v-for="row in chart1.rows" v-for="row in chart1.rows"
:key="row.label" :key="row.label"
:label="row.label" :label="row.label"
:label-style="row.labelStyle"
:bars="row.bars" :bars="row.bars"
:highlight-on-hover="chart1.highlightOnHover" :highlight-on-hover="chart1.highlightOnHover"
> >
@@ -117,6 +118,9 @@ export default {
}, },
{ {
label: 'Row #2', label: 'Row #2',
labelStyle: {
justifyContent: 'end'
},
bars: [ bars: [
{ {
myStart: '2020-03-02 09:00', myStart: '2020-03-02 09:00',