vue-golden-layout/src/roles/link.ts

Integration of the golden-layout to Vue

import { Component } from 'vue-property-decorator'
import { goldenContainer } from './container'
import { goldenChild } from "./child"
import { goldenItem } from "./item"
import goldenLayout from "../golden"

@Component({mixins: [goldenContainer]})
export class goldenLink extends goldenChild implements goldenContainer {
	// declaration of goldenContainer properties
	destroyed: ()=> void
	config: any
	layout: goldenLayout
	childPath:(comp: goldenChild)=> string
	getChild: (path: string)=> goldenChild
	//readonly glChildrenTarget: any
	get glChildrenTarget() { return this.glObject; }
	addGlChild: (child : any, comp : any)=> void
	readonly glChildren: goldenChild[]
	vueChild: (child: number)=> goldenChild
	vueChildren: ()=> goldenChild[]
	groupColor: string|null
	colorGroup: boolean
	
	watchComputeChildrenPath: number = 0
	computeChildrenPath: ()=> void

	get tabColor(): string|null {
		return this.belongGroupColor || this.groupColor;
	}
}

@Component
export class glCustomContainer extends goldenLink {
	constructor() {
		super();
		this.destructor = this.delete.bind(this);
	}
	get definedVueComponent(): goldenContainer { return this; }
	cachedChildMe: goldenChild
	destructor: any
	get childMe() {
		var sub = <goldenItem>this.$children[0], rv = sub && sub.childMe;

		if(this.cachedChildMe) this.cachedChildMe.$off('destroy', this.destructor);
		if(rv) rv.$on('destroy', this.destructor);
		return rv;
	}
	get parentMe() {
		return this.vueParent;
	}
	getChildConfig(): any { return null; }
}