mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-16 23:08:05 +08:00
91e4201cb1
* initial layout system with tool options * cargo fmt * cargo fmt again * document bar defined on the backend * cargo fmt * removed RC<RefCell> * cargo fmt * - fix increment behavior - removed hashmap from layout message handler - removed no op message from layoutMessage * cargo fmt * only send documentBar when zoom or rotation is updated * ctrl-0 changes zoom properly * unfinished layer hook in * fix layerData name * layer panel options bar * basic x/y movment * working transform section * changed messages from tuples to structs * hook up text input * - fixed number input to be more clear - fixed actions for properties message handler * Add styling Co-authored-by: Keavon Chambers <keavon@keavon.com>
50 lines
1.1 KiB
Vue
50 lines
1.1 KiB
Vue
<template>
|
|
<div class="widget-layout">
|
|
<template v-for="(layoutRow, index) in layout.layout" :key="index">
|
|
<component :is="layoutRowType(layoutRow)" :widgetData="layoutRow" :layoutTarget="layout.layout_target"></component>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.widget-layout {
|
|
height: 100%;
|
|
flex: 0 0 auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, PropType } from "vue";
|
|
|
|
import { isWidgetRow, isWidgetSection, LayoutRow, WidgetLayout } from "@/dispatcher/js-messages";
|
|
|
|
import WidgetRow from "@/components/widgets/WidgetRow.vue";
|
|
import WidgetSection from "@/components/widgets/WidgetSection.vue";
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
layout: { type: Object as PropType<WidgetLayout>, required: true },
|
|
},
|
|
methods: {
|
|
layoutRowType(layoutRow: LayoutRow): unknown {
|
|
if (isWidgetRow(layoutRow)) return WidgetRow;
|
|
if (isWidgetSection(layoutRow)) return WidgetSection;
|
|
|
|
throw new Error("Layout row type does not exist");
|
|
},
|
|
},
|
|
data: () => {
|
|
return {
|
|
isWidgetRow,
|
|
isWidgetSection,
|
|
};
|
|
},
|
|
components: {
|
|
WidgetRow,
|
|
WidgetSection,
|
|
},
|
|
});
|
|
</script>
|