emilis/FoundKey
1
0
Fork 0
forked from FoundKeyGang/FoundKey
Code Issues Pull requests Packages Projects Releases Wiki Activity

refactor: sample.vue to composition api

Browse source
This commit is contained in:
Norm 2022-07-29 12:46:58 -04:00
parent 16833b8cd8
commit 9e8b59f886
Signed by untrusted user: norm
GPG key ID: 7123E30E441E80DE
1 changed files with 52 additions and 72 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

124
packages/client/src/components/sample.vue
View file

@ -27,90 +27,70 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { defineComponent } from 'vue'; import { ref } from 'vue';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue'; import MkInput from '@/components/form/input.vue';
import MkSwitch from '@/components/form/switch.vue'; import MkSwitch from '@/components/form/switch.vue';
import MkTextarea from '@/components/form/textarea.vue';
import MkRadio from '@/components/form/radio.vue'; import MkRadio from '@/components/form/radio.vue';
import * as os from '@/os'; import * as os from '@/os';
import * as config from '@/config'; import * as config from '@/config';
import { $i } from '@/account';
export default defineComponent({ const text = ref('');
components: { const flag = ref(true);
MkButton, const radio = ref('misskey');
MkInput, const mfm = ref(`Hello world! This is an @example mention. BTW you are @${$i ? $i.username : 'guest'}.\nAlso, here is ${config.url} and [example link](${config.url}). for more details, see https://example.com.\nAs you know #misskey is open-source software.`);
MkSwitch,
MkTextarea,
MkRadio,
},
data() { function openDialog(): void {
return { os.alert({
text: '', type: 'warning',
flag: true, title: 'Oh my Aichan',
radio: 'misskey', text: 'Lorem ipsum dolor sit amet, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
mfm: `Hello world! This is an @example mention. BTW you are @${this.$i ? this.$i.username : 'guest'}.\nAlso, here is ${config.url} and [example link](${config.url}). for more details, see https://example.com.\nAs you know #misskey is open-source software.` });
}; }
},
methods: { function openForm(): void {
async openDialog() { os.form('Example form', {
os.alert({ foo: {
type: 'warning', type: 'boolean',
title: 'Oh my Aichan', default: true,
text: 'Lorem ipsum dolor sit amet, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', label: 'This is a boolean property',
});
}, },
bar: {
async openForm() { type: 'number',
os.form('Example form', { default: 300,
foo: { label: 'This is a number property',
type: 'boolean',
default: true,
label: 'This is a boolean property'
},
bar: {
type: 'number',
default: 300,
label: 'This is a number property'
},
baz: {
type: 'string',
default: 'Misskey makes you happy.',
label: 'This is a string property'
},
});
}, },
baz: {
async openDrive() { type: 'string',
os.selectDriveFile(); default: 'Misskey makes you happy.',
label: 'This is a string property',
}, },
});
}
async selectUser() { function openDrive(): void {
os.selectUser(); os.selectDriveFile(true);
}, }
async openMenu(ev) { function openMenu(ev): void {
os.popupMenu([{ os.popupMenu([{
type: 'label', type: 'label',
text: 'Fruits' text: 'Fruits'
}, { }, {
text: 'Create some apples', text: 'Create some apples',
action: () => {}, action: (): void => {},
}, { }, {
text: 'Read some oranges', text: 'Read some oranges',
action: () => {}, action: (): void => {},
}, { }, {
text: 'Update some melons', text: 'Update some melons',
action: () => {}, action: (): void => {},
}, null, { }, null, {
text: 'Delete some bananas', text: 'Delete some bananas',
danger: true, danger: true,
action: () => {}, action: (): void => {},
}], ev.currentTarget ?? ev.target); }], ev.currentTarget ?? ev.target);
}, }
}
});
</script> </script>