diff --git a/src/components/CProgress/CProgress.scss b/src/components/CProgress/CProgress.scss index 477fd3d..331af6a 100644 --- a/src/components/CProgress/CProgress.scss +++ b/src/components/CProgress/CProgress.scss @@ -27,10 +27,15 @@ $heightBtn: 100%; .cpr-progrbar-item { //height: 10px - padding-top: 7px; + margin-top: 11px; + margin-bottom: 11px; height:15px; } +.cpr-slider-item { + //height: 10px +} + .cpr-percProgress { padding-top: 3px; color: #888; diff --git a/src/components/CProgress/CProgress.ts b/src/components/CProgress/CProgress.ts index cc4717f..c087c6b 100644 --- a/src/components/CProgress/CProgress.ts +++ b/src/components/CProgress/CProgress.ts @@ -10,6 +10,7 @@ import { tools } from '@src/store/Modules/tools' export default class CProgress extends Vue { public cpr_colProgress: string = 'blue' public cpr_percProgress: string = 'cpr-percProgress' + public progressvalinternal: number = 0 @Watch('progressval') public changeprogress() { @@ -18,12 +19,24 @@ export default class CProgress extends Vue { @Prop({ required: true }) public progressval: number @Prop() public descr: string + @Prop({ default: false }) public slider: boolean - public updateclasses() { - this.cpr_colProgress = tools.getProgressColor(this.progressval) + @Watch('progressval') + public valchanged(value) { + this.progressvalinternal = value } - get getdescr(){ + public updateclasses() { + this.cpr_colProgress = tools.getProgressColor(this.progressvalinternal) + } + + public setchange(value) { + this.progressvalinternal = value + console.log('setchange', this.progressvalinternal) + this.$emit('input', this.progressvalinternal) + } + + get getdescr() { if (!!this.descr) { return this.descr + ' : ' } diff --git a/src/components/CProgress/CProgress.vue b/src/components/CProgress/CProgress.vue index 004c9b3..1df9ef2 100644 --- a/src/components/CProgress/CProgress.vue +++ b/src/components/CProgress/CProgress.vue @@ -1,7 +1,16 @@