mirror of https://github.com/nocodb/nocodb
15 changed files with 7364 additions and 11823 deletions
@ -1,5 +1,6 @@ |
|||||||
<template> |
<template> |
||||||
<div><!-- Markup shared across all pages, ex: NavBar --> |
<!-- <NuxtLayout>--> |
||||||
|
<!-- <NuxtPage />--> |
||||||
|
<!-- </NuxtLayout>--> |
||||||
<NuxtPage/> |
<NuxtPage/> |
||||||
</div> |
|
||||||
</template> |
</template> |
||||||
|
After Width: | Height: | Size: 67 KiB |
@ -0,0 +1,9 @@ |
|||||||
|
import {store} from 'nuxt3-store' |
||||||
|
|
||||||
|
export const user = store({ |
||||||
|
name: 'user', |
||||||
|
type: 'localstorage', |
||||||
|
value: {token: null}, |
||||||
|
reactiveType: 'reactive', |
||||||
|
version: '1.0.0' |
||||||
|
}) |
@ -0,0 +1,19 @@ |
|||||||
|
<template> |
||||||
|
<v-layout> |
||||||
|
<v-app-bar color="grey-lighten-2"></v-app-bar> |
||||||
|
<!-- <v-navigation-drawer color="grey-darken-2" permanent></v-navigation-drawer>--> |
||||||
|
<v-main> |
||||||
|
<slot></slot> |
||||||
|
</v-main> |
||||||
|
</v-layout> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "default" |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,18 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<Sidebar :visible="true" position="left" :dismissable="false"> |
||||||
|
Content |
||||||
|
|
||||||
|
</Sidebar> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "dashboard" |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
@ -0,0 +1,42 @@ |
|||||||
|
<template> |
||||||
|
<div class="container"> |
||||||
|
|
||||||
|
<Card style="width:500px"> |
||||||
|
<template #title> |
||||||
|
Signup |
||||||
|
</template> |
||||||
|
<template #content> |
||||||
|
<InputText type="text" v-model="value" label="Email"/> |
||||||
|
</template> |
||||||
|
<template #footer> |
||||||
|
<Button label="Small" icon="pi pi-check" class="p-button-sm" /> |
||||||
|
</template> |
||||||
|
</Card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import { ref } from 'vue'; |
||||||
|
import { useToast } from "primevue/usetoast"; |
||||||
|
const text = ref(); |
||||||
|
const toast = useToast(); |
||||||
|
const greet = () => { |
||||||
|
toast.add({severity: 'info', summary: 'Hello ' + text.value}); |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
.container { |
||||||
|
margin: 0 auto; |
||||||
|
min-height: 100vh; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
div { |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
margin-top: 1rem; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
@ -1,13 +1,41 @@ |
|||||||
<template> |
<template> |
||||||
<span>test</span> |
<div class="container"> |
||||||
|
<div> |
||||||
|
<img alt="Vue logo" src="../assets/icon.png" width="50"> |
||||||
|
<Toast /> |
||||||
|
|
||||||
|
<div > |
||||||
|
<form @submit.prevent="greet"> |
||||||
|
<InputText type="text" v-model="text"/> |
||||||
|
<Button type="submit" label="Submit"/> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script setup lang="ts"> |
||||||
export default { |
import { ref } from 'vue'; |
||||||
name: "index" |
import { useToast } from "primevue/usetoast"; |
||||||
|
const text = ref(); |
||||||
|
const toast = useToast(); |
||||||
|
const greet = () => { |
||||||
|
toast.add({severity: 'info', summary: 'Hello ' + text.value}); |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style scoped> |
<style lang="scss"> |
||||||
|
.container { |
||||||
|
margin: 0 auto; |
||||||
|
min-height: 100vh; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
div { |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
margin-top: 1rem; |
||||||
|
} |
||||||
|
} |
||||||
</style> |
</style> |
||||||
|
@ -0,0 +1,72 @@ |
|||||||
|
<template> |
||||||
|
<v-cotainer> |
||||||
|
<v-card max-width="500" class="pa-4 mx-auto mt-10"> |
||||||
|
{{userStore}} |
||||||
|
<v-form |
||||||
|
ref="formType" |
||||||
|
v-model="valid" |
||||||
|
lazy-validation |
||||||
|
> |
||||||
|
<!-- Enter your work email --> |
||||||
|
<v-text-field |
||||||
|
v-model="form.email" |
||||||
|
label="Email" |
||||||
|
required |
||||||
|
/> |
||||||
|
|
||||||
|
<!-- Enter your password --> |
||||||
|
<v-text-field |
||||||
|
label="Password" |
||||||
|
v-model="form.password" |
||||||
|
name="input-10-2" |
||||||
|
min="8" |
||||||
|
/> |
||||||
|
|
||||||
|
<v-btn |
||||||
|
class="mx-auto" |
||||||
|
large |
||||||
|
elevation-10 |
||||||
|
:disabled="false" |
||||||
|
@click="signIn" |
||||||
|
> |
||||||
|
<b>Sign In</b> |
||||||
|
</v-btn> |
||||||
|
|
||||||
|
</v-form> |
||||||
|
</v-card> |
||||||
|
</v-cotainer> |
||||||
|
|
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import {ref, reactive} from 'vue' |
||||||
|
|
||||||
|
const valid = ref() |
||||||
|
const form = reactive({ |
||||||
|
email: '', |
||||||
|
password: '' |
||||||
|
}) |
||||||
|
const userStore = user |
||||||
|
|
||||||
|
</script> |
||||||
|
<script lang="ts"> |
||||||
|
import {useNuxtApp} from "nuxt/app"; |
||||||
|
import {Api} from "nocodb-sdk"; |
||||||
|
|
||||||
|
|
||||||
|
// const {$api}: { $api: Api<any> } = useNuxtApp() as any |
||||||
|
export default { |
||||||
|
methods: { |
||||||
|
signIn() { |
||||||
|
this.$api.auth.signin(this.form).then((res) => { |
||||||
|
console.log(res) |
||||||
|
this.userStore.token = res |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
@ -0,0 +1,13 @@ |
|||||||
|
<template> |
||||||
|
|
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "signup" |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
@ -0,0 +1,41 @@ |
|||||||
|
import { Api } from 'nocodb-sdk'; |
||||||
|
import {defineNuxtPlugin} from "nuxt3/app"; |
||||||
|
|
||||||
|
|
||||||
|
export default defineNuxtPlugin((nuxtApp) => { |
||||||
|
|
||||||
|
// Doing something with nuxtApp
|
||||||
|
|
||||||
|
const api = getApi(null, null) |
||||||
|
|
||||||
|
nuxtApp.provide('api', api) |
||||||
|
|
||||||
|
|
||||||
|
return { |
||||||
|
provide: { |
||||||
|
api123:api |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
export function getApi($store, $axios) { |
||||||
|
const api = new Api({ |
||||||
|
baseURL: 'http://localhost:8080', |
||||||
|
headers: { |
||||||
|
'xc-auth': $store?.state?.users?.token |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
if($axios) { |
||||||
|
// overwrite with nuxt axios instance
|
||||||
|
api.instance = $axios |
||||||
|
} |
||||||
|
return api |
||||||
|
} |
||||||
|
//
|
||||||
|
// export default function({ store: $store, $axios, ...rest }, inject) {
|
||||||
|
// const api = getApi($store, $axios)
|
||||||
|
//
|
||||||
|
// inject('api', api)
|
||||||
|
// }
|
@ -0,0 +1,19 @@ |
|||||||
|
import {defineNuxtPlugin} from "#app"; |
||||||
|
import PrimeVue from "primevue/config"; |
||||||
|
import Button from "primevue/button"; |
||||||
|
import InputText from "primevue/inputtext"; |
||||||
|
import Toast from "primevue/toast"; |
||||||
|
import Card from "primevue/card"; |
||||||
|
import Sidebar from "primevue/sidebar"; |
||||||
|
import ToastService from 'primevue/toastservice'; |
||||||
|
|
||||||
|
export default defineNuxtPlugin((nuxtApp) => { |
||||||
|
nuxtApp.vueApp.use(PrimeVue, {ripple: true}); |
||||||
|
nuxtApp.vueApp.use(ToastService); |
||||||
|
nuxtApp.vueApp.component('Button', Button); |
||||||
|
nuxtApp.vueApp.component('InputText', InputText); |
||||||
|
nuxtApp.vueApp.component('Toast', Toast); |
||||||
|
nuxtApp.vueApp.component('Card', Card); |
||||||
|
nuxtApp.vueApp.component('Sidebar', Sidebar); |
||||||
|
//other components that you need
|
||||||
|
}); |
@ -0,0 +1,21 @@ |
|||||||
|
import { createVuetify } from 'vuetify' |
||||||
|
import { |
||||||
|
VApp, |
||||||
|
VAppBar, |
||||||
|
VBtn |
||||||
|
} from 'vuetify/components' |
||||||
|
import {defineNuxtPlugin} from "nuxt/app"; |
||||||
|
|
||||||
|
// Import everything
|
||||||
|
// import * as components from 'vuetify/components'
|
||||||
|
|
||||||
|
export default defineNuxtPlugin((nuxtApp) => { |
||||||
|
// const vuetify = createVuetify({
|
||||||
|
// components/*: {
|
||||||
|
// VApp,
|
||||||
|
// VAppBar,
|
||||||
|
// VBtn*/
|
||||||
|
// // }
|
||||||
|
// })
|
||||||
|
// nuxtApp.vueApp.use(vuetify)
|
||||||
|
}) |
Loading…
Reference in new issue