github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-01-28 15:28:24 -05:00
Code Issues Packages Projects Releases Wiki Activity

Update layout templates to new layouts system (#7726)

Browse Source
This commit is contained in:
Nicola Krumschmidt
2021-08-31 18:41:50 +02:00
committed by GitHub
parent d9d8edc217
commit a137a44e24
4 changed files with 31 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/extensions-sdk/templates/layout/javascript/src/index.js
View File

@@ -11,8 +11,8 @@ export default {
sidebar: () => null,
actions: () => null,
},
setup(props) {
const name = ref('Custom layout state');
setup() {
const name = ref('Custom Layout');
return { name };
},

22
packages/extensions-sdk/templates/layout/javascript/src/layout.vue
View File

@@ -1,17 +1,21 @@
<template>
<div>{{ name }} - Collection: {{ props.collection }}</div>
<div>
<p>Name: {{ name }}</p>
<p>Collection: {{ collection }}</p>
</div>
</template>
<script>
import { toRefs } from 'vue';
import { useLayoutState } from '@directus/extensions-sdk';
export default {
setup() {
const layoutState = useLayoutState();
const { props, name } = toRefs(layoutState.value);
return { props, name };
props: {
collection: {
type: String,
required: true,
},
name: {
type: String,
required: true,
},
},
};
</script>

4
packages/extensions-sdk/templates/layout/typescript/src/index.ts
View File

@@ -12,8 +12,8 @@ export default defineLayout({
sidebar: () => null,
actions: () => null,
},
setup(props) {
const name = ref('Custom layout state');
setup() {
const name = ref('Custom Layout');
return { name };
},

22
packages/extensions-sdk/templates/layout/typescript/src/layout.vue
View File

@@ -1,17 +1,23 @@
<template>
<div>{{ name }} - Collection: {{ props.collection }}</div>
<div>
<p>Name: {{ name }}</p>
<p>Collection: {{ collection }}</p>
</div>
</template>
<script lang="ts">
import { defineComponent, toRefs } from 'vue';
import { useLayoutState } from '@directus/extensions-sdk';
import { defineComponent } from 'vue';
export default defineComponent({
setup() {
const layoutState = useLayoutState();
const { props, name } = toRefs(layoutState.value);
return { props, name };
props: {
collection: {
type: String,
required: true,
},
name: {
type: String,
required: true,
},
},
});
</script>