Commit fd18168c authored by Kemm23's avatar Kemm23

fix UI

parent ef3630f7
<template> <template>
<div> <v-app>
<NavBar /> <NavBar />
<nuxt /> <nuxt />
</div> </v-app>
</template> </template>
<script> <script>
......
This diff is collapsed.
<!-- eslint-disable vue/valid-v-slot -->
<template> <template>
<v-app> <v-app>
<div>
<div />
<div> <div>
<v-breadcrumbs :items="items"> <div>
<template #divider> <v-breadcrumbs :items="items">
<v-icon>mdi-chevron-right</v-icon> <template #divider>
</template> <v-icon>mdi-chevron-right</v-icon>
</v-breadcrumbs> </template>
</div> </v-breadcrumbs>
<div style="float: right"> </div>
<div style="float: right">
<v-dialog
v-model="dialog1"
persistent
max-width="600px"
@submit.prevent="createUser"
>
<template #activator="{ on, attrs }">
<v-btn
color="primary"
dark
v-bind="attrs"
v-on="on"
>
New USER
</v-btn>
</template>
<v-card>
<v-card-title>
<span class="text-h5">User Profile</span>
</v-card-title>
<v-card-text>
<v-container>
<v-row>
<v-col
cols="12"
sm="6"
md="4"
>
<v-text-field
v-model="name"
label="Legal name*"
required
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="email"
label="Email*"
required
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="password"
label="Password*"
type="password"
required
/>
</v-col>
</v-row>
</v-container>
<small>*indicates required field</small>
</v-card-text>
<v-card-actions>
<v-spacer />
<v-btn
color="blue darken-1"
text
@click="dialog1 = false"
>
Close
</v-btn>
<v-btn
color="blue darken-1"
text
type="submit"
@click="dialog1 = false; createUser();"
>
Save
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</div>
<!-- modal-create -->
<v-dialog <v-dialog
v-model="dialog1" v-model="dialog2"
persistent persistent
max-width="600px" max-width="600px"
@submit.prevent="createUser"
> >
<template #activator="{ on, attrs }">
<v-btn
color="primary"
dark
v-bind="attrs"
v-on="on"
>
New USER
</v-btn>
</template>
<v-card> <v-card>
<v-card-title> <v-card-title>
<span class="text-h5">User Profile</span> <span class="text-h5">User Edit</span>
</v-card-title> </v-card-title>
<v-card-text> <v-card-text>
<v-container> <v-container>
...@@ -39,21 +103,21 @@ ...@@ -39,21 +103,21 @@
md="4" md="4"
> >
<v-text-field <v-text-field
v-model="name" v-model="eName"
label="Legal name*" label="Legal name*"
required required
/> />
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<v-text-field <v-text-field
v-model="email" v-model="eEmail"
label="Email*" label="Email*"
required required
/> />
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<v-text-field <v-text-field
v-model="password" v-model="ePassword"
label="Password*" label="Password*"
type="password" type="password"
required required
...@@ -68,7 +132,7 @@ ...@@ -68,7 +132,7 @@
<v-btn <v-btn
color="blue darken-1" color="blue darken-1"
text text
@click="dialog1 = false" @click="dialog2 = false"
> >
Close Close
</v-btn> </v-btn>
...@@ -76,101 +140,38 @@ ...@@ -76,101 +140,38 @@
color="blue darken-1" color="blue darken-1"
text text
type="submit" type="submit"
@click="dialog1 = false; createUser();" @click="dialog2 = false; updateUser();"
> >
Save Save
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
</div> <v-data-table :headers="headers" :items="users" sort-by="calories" class="elevation-1">
<!-- modal-create --> <template #top>
<v-dialog <v-toolbar flat>
v-model="dialog2" <v-toolbar-title>User Manage</v-toolbar-title>
persistent <v-divider class="mx-4" inset vertical />
max-width="600px" <v-spacer />
> </v-toolbar>
<v-card> </template>
<v-card-title> // eslint-disable-next-line vue/valid-v-slot
<span class="text-h5">User Edit</span> <template #item.actions="{ item }">
</v-card-title> <v-icon :id="item.id" small class="mr-2" @click="dialog2 = true; editUser(item);">
<v-card-text> mdi-pencil
<v-container> </v-icon>
<v-row> <v-icon :id="item.id" small @click="deleteUser(item.id, item)">
<v-col mdi-delete
cols="12" </v-icon>
sm="6" </template>
md="4" <template #no-data>
> <v-btn color="primary" @click="initialize">
<v-text-field Reset
v-model="eName"
label="Legal name*"
required
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="eEmail"
label="Email*"
required
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="ePassword"
label="Password*"
type="password"
required
/>
</v-col>
</v-row>
</v-container>
<small>*indicates required field</small>
</v-card-text>
<v-card-actions>
<v-spacer />
<v-btn
color="blue darken-1"
text
@click="dialog2 = false"
>
Close
</v-btn>
<v-btn
color="blue darken-1"
text
type="submit"
@click="dialog2 = false; updateUser();"
>
Save
</v-btn> </v-btn>
</v-card-actions> </template>
</v-card> </v-data-table>
</v-dialog> </div>
<v-data-table :headers="headers" :items="users" sort-by="calories" class="elevation-1"> </v-app>
<template #top>
<v-toolbar flat>
<v-toolbar-title>User Manage</v-toolbar-title>
<v-divider class="mx-4" inset vertical />
<v-spacer />
</v-toolbar>
</template>
<template #item.actions="{ item }">
<v-icon :id="item.id" small class="mr-2" @click="dialog2 = true; editUser(item);">
mdi-pencil
</v-icon>
<v-icon :id="item.id" small @click="deleteUser(item.id, item)">
mdi-delete
</v-icon>
</template>
<template #no-data>
<v-btn color="primary" @click="initialize">
Reset
</v-btn>
</template>
</v-data-table>
</div>
</v-app>
</template> </template>
<script> <script>
export default { export default {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment