Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 | 1x 15x 5x 9x 4x 5x 9x 15x 3x 3x 2x | // @ts-check
import AnimBlock from "./BaseAnimation/BaseAnimationBlock.vue";
import Anim from "./BaseAnimation/BaseAnimation";
import Vue from "vue";
// FIXME add animations support
/**
* @typedef {{ caret: Element }} Refs
*/
const component = /** @type {V.Constructor<any, Refs>} */ (Vue).extend({
name: "BaseCollapsible",
components: { AnimBlock },
props: {
title: { type: String, default: "" },
expand: { type: Boolean, default: false },
counter: { type: Number, default: null }
},
/**
* @return {{ isExpanded: boolean }}
*/
data() { return { isExpanded: this.expand }; },
watch: {
/**
* @param {boolean} value
*/
expand(value) {
this.isExpanded = value;
},
/**
* @param {boolean} value
* @return {void}
*/
isExpanded: function(value) {
if (value) {
Anim.rot90.in(this.$refs.caret);
}
else {
Anim.rot90.out(this.$refs.caret);
}
// v3 compatible v-model
this.$emit("update:expand", this.isExpanded);
}
},
mounted() {
if (this.isExpanded) {
Anim.rot90.in(this.$refs.caret);
}
},
methods: {
toggle() {
this.isExpanded = !this.isExpanded;
},
show(value = true) {
this.isExpanded = value;
}
}
});
export default component;
|