2020-1-CloudComputing / D_Team_Khuloud

Go to a project
Toggle navigation Toggle navigation pinning
최동원
57a98f27 1 parent c3c4ef1b

front-end-skeleton

Inline Side-by-side
Showing 28 changed files with 1699 additions and 0 deletions
1 +module.exports = {
2 + presets: [
3 + '@vue/cli-plugin-babel/preset'
4 + ]
5 +}
This diff could not be displayed because it is too large.
1 +{
2 + "name": "dropbox_proto",
3 + "version": "0.1.0",
4 + "private": true,
5 + "scripts": {
6 + "serve": "vue-cli-service serve",
7 + "build": "vue-cli-service build"
8 + },
9 + "dependencies": {
10 + "core-js": "^3.6.4",
11 + "vue": "^2.6.11",
12 + "vue-router": "^3.1.6",
13 + "vuetify": "^2.2.11",
14 + "vuex": "^3.1.3"
15 + },
16 + "devDependencies": {
17 + "@vue/cli-plugin-babel": "~4.3.0",
18 + "@vue/cli-plugin-router": "~4.3.0",
19 + "@vue/cli-plugin-vuex": "~4.3.0",
20 + "@vue/cli-service": "~4.3.0",
21 + "sass": "^1.19.0",
22 + "sass-loader": "^8.0.0",
23 + "vue-cli-plugin-vuetify": "~2.0.5",
24 + "vue-template-compiler": "^2.6.11",
25 + "vuetify-loader": "^1.3.0"
26 + },
27 + "browserslist": [
28 + "> 1%",
29 + "last 2 versions",
30 + "not dead"
31 + ]
32 +}
No preview for this file type
1 +<!DOCTYPE html>
2 +<html lang="en">
3 + <head>
4 + <meta charset="utf-8">
5 + <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 + <meta name="viewport" content="width=device-width,initial-scale=1.0">
7 + <link rel="icon" href="<%= BASE_URL %>favicon.ico">
8 + <title><%= htmlWebpackPlugin.options.title %></title>
9 + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
10 + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
11 + </head>
12 + <body>
13 + <noscript>
14 + <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
15 + </noscript>
16 + <div id="app"></div>
17 + <!-- built files will be auto injected -->
18 + </body>
19 +</html>
1 +<template>
2 + <tool-view></tool-view>
3 +</template>
4 +
5 +<script>
6 +import ToolView from './views/ToolView'
7 +
8 + export default {
9 + data() {
10 + return {
11 +
12 + }
13 + },
14 + components: {
15 + ToolView,
16 + }
17 + }
18 +</script>
1 +<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 87.5 100"><defs><style>.cls-1{fill:#1697f6;}.cls-2{fill:#7bc6ff;}.cls-3{fill:#1867c0;}.cls-4{fill:#aeddff;}</style></defs><title>Artboard 46</title><polyline class="cls-1" points="43.75 0 23.31 0 43.75 48.32"/><polygon class="cls-2" points="43.75 62.5 43.75 100 0 14.58 22.92 14.58 43.75 62.5"/><polyline class="cls-3" points="43.75 0 64.19 0 43.75 48.32"/><polygon class="cls-4" points="64.58 14.58 87.5 14.58 43.75 100 43.75 62.5 64.58 14.58"/></svg>
1 +<template>
2 + <v-card
3 + max-width="98%"
4 + class="mx-auto"
5 + >
6 + <v-toolbar
7 + color="light-blue"
8 + dark
9 + >
10 + <v-toolbar-title>즐겨찾기</v-toolbar-title>
11 + <v-spacer></v-spacer>
12 + </v-toolbar>
13 + <v-list two-line subheader>
14 + <v-list-item
15 + v-for="item in items"
16 + :key="item.title"
17 + @click=""
18 + >
19 + <v-list-item-avatar>
20 + <v-icon
21 + :class="[item.iconClass]"
22 + v-text="item.icon"
23 + ></v-icon>
24 + </v-list-item-avatar>
25 + <v-list-item-content>
26 + <v-list-item-title v-text="item.title"></v-list-item-title>
27 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
28 + </v-list-item-content>
29 + <v-list-item-action>
30 + <v-btn icon>
31 + <v-icon color="grey lighten-1">mdi-information</v-icon>
32 + </v-btn>
33 + </v-list-item-action>
34 + </v-list-item>
35 + <v-list-item
36 + v-for="item in items2"
37 + :key="item.title"
38 + @click=""
39 + >
40 + <v-list-item-avatar>
41 + <v-icon
42 + :class="[item.iconClass]"
43 + v-text="item.icon"
44 + ></v-icon>
45 + </v-list-item-avatar>
46 + <v-list-item-content>
47 + <v-list-item-title v-text="item.title"></v-list-item-title>
48 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
49 + </v-list-item-content>
50 + <v-list-item-action>
51 + <v-btn icon>
52 + <v-icon color="grey lighten-1">mdi-information</v-icon>
53 + </v-btn>
54 + </v-list-item-action>
55 + </v-list-item>
56 + </v-list>
57 + </v-card>
58 +</template>
59 +
60 +<script>
61 + export default {
62 + data: () => ({
63 + items: [
64 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Photos', subtitle: 'Jan 9, 2014' },
65 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Recipes', subtitle: 'Jan 17, 2014' },
66 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Work', subtitle: 'Jan 28, 2014' },
67 + ],
68 + items2: [
69 + { icon: 'assignment', iconClass: 'blue white--text', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
70 + { icon: 'call_to_action', iconClass: 'amber white--text', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
71 + ],
72 + }),
73 + }
74 +</script>
1 +<template lang="html">
2 + <v-card>
3 + <v-toolbar flat>
4 + <v-toolbar-title>피드백
5 + </v-toolbar-title>
6 + <v-spacer></v-spacer>
7 + </v-toolbar>
8 + <v-divider></v-divider>
9 + <v-form>
10 + <v-textarea
11 + name="input-7-1"
12 + filled
13 + label="아쉬웠던 점을 말씀해주세요. 칭찬도 당연히 환영입니다!"
14 + auto-grow
15 + ></v-textarea>
16 + <v-btn large color="primary">SUBMIT</v-btn>
17 + </v-form>
18 +
19 +
20 + </v-card>
21 +</template>
22 +
23 +<script>
24 +export default {
25 + data(){
26 + return{
27 +
28 + }
29 + }
30 +}
31 +</script>
32 +
33 +<style lang="css" scoped>
34 +</style>
1 +<template>
2 + <v-card
3 + max-width="98%"
4 + class="mx-auto"
5 + >
6 + <v-toolbar
7 + color="light-blue"
8 + dark
9 + >
10 + <v-toolbar-title>파일</v-toolbar-title>
11 + <v-spacer></v-spacer>
12 + </v-toolbar>
13 + <v-list two-line subheader>
14 + <v-list-item
15 + v-for="item in items"
16 + :key="item.title"
17 + @click=""
18 + >
19 + <v-list-item-avatar>
20 + <v-icon
21 + :class="[item.iconClass]"
22 + v-text="item.icon"
23 + ></v-icon>
24 + </v-list-item-avatar>
25 + <v-list-item-content>
26 + <v-list-item-title v-text="item.title"></v-list-item-title>
27 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
28 + </v-list-item-content>
29 + <v-list-item-action>
30 + <v-btn icon>
31 + <v-icon color="grey lighten-1">mdi-information</v-icon>
32 + </v-btn>
33 + </v-list-item-action>
34 + </v-list-item>
35 + <v-list-item
36 + v-for="item in items2"
37 + :key="item.title"
38 + @click=""
39 + >
40 + <v-list-item-avatar>
41 + <v-icon
42 + :class="[item.iconClass]"
43 + v-text="item.icon"
44 + ></v-icon>
45 + </v-list-item-avatar>
46 + <v-list-item-content>
47 + <v-list-item-title v-text="item.title"></v-list-item-title>
48 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
49 + </v-list-item-content>
50 + <v-list-item-action>
51 + <v-btn icon>
52 + <v-icon color="grey lighten-1">mdi-information</v-icon>
53 + </v-btn>
54 + </v-list-item-action>
55 + </v-list-item>
56 + </v-list>
57 + </v-card>
58 +</template>
59 +
60 +<script>
61 + export default {
62 + data: () => ({
63 + items: [
64 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Photos', subtitle: 'Jan 9, 2014' },
65 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Recipes', subtitle: 'Jan 17, 2014' },
66 + { icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Work', subtitle: 'Jan 28, 2014' },
67 + ],
68 + items2: [
69 + { icon: 'assignment', iconClass: 'blue white--text', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
70 + { icon: 'call_to_action', iconClass: 'amber white--text', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
71 + ],
72 + }),
73 + }
74 +</script>
1 +<template>
2 + <div>
3 + <v-toolbar flat>
4 + <v-toolbar-title>파일
5 + </v-toolbar-title>
6 + <v-spacer></v-spacer>
7 + <v-text-field
8 + v-model="search"
9 + append-icon="mdi-magnify"
10 + label="파일 검색"
11 + single-line
12 + hide-details
13 + ></v-text-field>
14 + </v-toolbar>
15 +
16 + <v-list two-line subheader>
17 + <v-subheader inset>Folders</v-subheader>
18 +
19 + <v-list-item
20 + v-for="item in items"
21 + :key="item.title"
22 + @click=""
23 + >
24 + <v-list-item-avatar>
25 + <v-icon
26 +
27 + >{{item.iconClass}}</v-icon>
28 + </v-list-item-avatar>
29 +
30 + <v-list-item-content>
31 + <v-list-item-title v-text="item.title"></v-list-item-title>
32 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
33 + </v-list-item-content>
34 +
35 + <v-list-item-action>
36 + <v-btn icon>
37 + <v-icon color="grey lighten-1">mdi-information</v-icon>
38 + </v-btn>
39 + </v-list-item-action>
40 + </v-list-item>
41 +
42 + <v-divider inset></v-divider>
43 +
44 + <v-subheader inset>Files</v-subheader>
45 +
46 + <v-list-item
47 + v-for="item in items2"
48 + :key="item.title"
49 + @click=""
50 + >
51 + <v-list-item-avatar>
52 + <v-icon> {{item.iconClass}}</v-icon>
53 + </v-list-item-avatar>
54 +
55 + <v-list-item-content>
56 + <v-list-item-title v-text="item.title"></v-list-item-title>
57 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
58 + </v-list-item-content>
59 +
60 + <v-list-item-action>
61 + <v-btn icon>
62 + <v-icon color="grey lighten-1">mdi-information</v-icon>
63 + </v-btn>
64 + </v-list-item-action>
65 + </v-list-item>
66 + </v-list>
67 + <v-file-input
68 + v-model="files"
69 + color="deep-purple accent-4"
70 + counter
71 + label="업로드"
72 + multiple
73 + placeholder="파일을 화면으로 드래그앤 드롭 하거나, 이곳을 클릭하세요."
74 + prepend-icon="mdi-paperclip"
75 + outlined
76 + :show-size="1000"
77 + >
78 + <template v-slot:selection="{ index, text }">
79 + <v-chip
80 + v-if="index < 2"
81 + color="deep-purple accent-4"
82 + dark
83 + label
84 + small
85 + >
86 + {{ text }}
87 + </v-chip>
88 +
89 + <span
90 + v-else-if="index === 2"
91 + class="overline grey--text text--darken-3 mx-2"
92 + >
93 + +{{ files.length - 2 }} File(s)
94 + </span>
95 + </template>
96 + </v-file-input>
97 + </div>
98 +</template>
99 +
100 +<script>
101 + export default {
102 + data: () => ({
103 + items: [
104 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Photos', subtitle: 'Jan 9, 2014' },
105 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Recipes', subtitle: 'Jan 17, 2014' },
106 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Work', subtitle: 'Jan 28, 2014' },
107 + ],
108 + items2: [
109 + { icon: 'assignment', iconClass: 'mdi-file', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
110 + { icon: 'call_to_action', iconClass: 'mdi-PdfBox', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
111 + ],
112 + }),
113 + }
114 +</script>
1 +<template>
2 + <v-container fluid>
3 + <v-card-title>
4 + 연락처
5 + <v-spacer></v-spacer>
6 + <v-text-field
7 + v-model="search"
8 + append-icon="mdi-magnify"
9 + label="연락처 검색"
10 + single-line
11 + hide-details
12 + ></v-text-field>
13 + </v-card-title>
14 + <v-data-table
15 + :headers="headers"
16 + :items="desserts"
17 + :items-per-page="10"
18 + class="elevation-1"
19 + ></v-data-table>
20 + </v-container>
21 +</template>
22 +
23 +<script>
24 + export default {
25 + data () {
26 + return {
27 + headers: [
28 + {
29 + text: 'Name',
30 + align: 'start',
31 + sortable: false,
32 + value: 'name',
33 + },
34 + { text: 'Phone', value: 'Phone' },
35 + { text: 'E-mail', value: 'Email' },
36 + { text: 'Added date', value: 'date' }
37 + ],
38 + desserts: [
39 + {
40 + name: 'Frozen Yogurt',
41 + Phone: '010-1111-1111',
42 + Email: 'asdf@asdf.com',
43 + date: '2020-05-18'
44 + },
45 + {
46 + name: 'Ice cream sandwich',
47 + Phone: '010-1111-1111',
48 + Email: 'asdf@asdf.com',
49 + date: '2020-05-18'
50 + },
51 + {
52 + name: 'Eclair',
53 + Phone: '010-1111-1111',
54 + Email: 'asdf@asdf.com',
55 + date: '2020-05-18'
56 + },
57 + {
58 + name: 'Cupcake',
59 + Phone: '010-1111-1111',
60 + Email: 'asdf@asdf.com',
61 + date: '2020-05-18'
62 + },
63 + {
64 + name: 'Gingerbread',
65 + Phone: '010-1111-1111',
66 + Email: 'asdf@asdf.com',
67 + date: '2020-05-18'
68 + },
69 + {
70 + name: 'Jelly bean',
71 + Phone: '010-1111-1111',
72 + Email: 'asdf@asdf.com',
73 + date: '2020-05-18'
74 + },
75 + {
76 + name: 'Lollipop',
77 + Phone: '010-1111-1111',
78 + Email: 'asdf@asdf.com',
79 + date: '2020-05-18'
80 + },
81 + {
82 + name: 'Honeycomb',
83 + Phone: '010-1111-1111',
84 + Email: 'asdf@asdf.com',
85 + date: '2020-05-18'
86 + },
87 + {
88 + name: 'Donut',
89 + Phone: '010-1111-1111',
90 + Email: 'asdf@asdf.com',
91 + date: '2020-05-18'
92 + },
93 + {
94 + name: 'KitKat',
95 + Phone: '010-1111-1111',
96 + Email: 'asdf@asdf.com',
97 + date: '2020-05-18'
98 + },
99 + ],
100 + }
101 + },
102 + }
103 +</script>
1 +import Vue from 'vue'
2 +import App from './App.vue'
3 +import router from './router/index'
4 +import store from './store'
5 +import vuetify from './plugins/vuetify';
6 +
7 +Vue.config.productionTip = false
8 +
9 +new Vue({
10 + router,
11 + store,
12 + vuetify,
13 + render: h => h(App)
14 +}).$mount('#app')
1 +import Vue from 'vue';
2 +import Vuetify from 'vuetify/lib';
3 +
4 +Vue.use(Vuetify);
5 +
6 +export default new Vuetify({
7 +});
1 +import Vue from 'vue'
2 +import VueRouter from 'vue-router'
3 +import Home from '../views/Home.vue'
4 +import Login from '../views/Login.vue'
5 +import Main from '../views/Main.vue'
6 +import Contact from '../views/Contact.vue'
7 +import File from '../views/File.vue'
8 +import FavList from '../views/FavList.vue'
9 +import QuickList from '../views/QuickList.vue'
10 +import Feedback from '../views/Feedback.vue'
11 +import ToolView from '../views/ToolView'
12 +import RegistUser from '../views/RegistUser'
13 +Vue.use(VueRouter);
14 +
15 +
16 +
17 +export default new VueRouter ({
18 + mode: 'history',
19 + base: process.env.BASE_URL,
20 + routes : [
21 + {
22 + path: '/',
23 + name: 'Home',
24 + component: Home
25 + },
26 + {
27 + path: '/main',
28 + name:'Main',
29 + component: Main
30 + },
31 + {
32 + path: '/contact',
33 + name:'Contact',
34 + component: Contact
35 + },
36 + {
37 + path: '/RegistUser',
38 + name: 'RegistUser',
39 + component: RegistUser
40 + },
41 + {
42 + path: '/login',
43 + name: 'Login',
44 + component:Login,
45 + },
46 + {
47 + path:'/file',
48 + name:'File',
49 + component: File
50 + },
51 + {
52 + path:'/fav',
53 + name:'Fav',
54 + component: FavList
55 + },
56 + {
57 + path:'/quick',
58 + name:'Quick',
59 + component : QuickList
60 + },
61 + {
62 + path:'/feedback',
63 + name:'Feedback',
64 + component: Feedback
65 + }
66 +
67 + ]
68 +})
1 +import Vue from 'vue'
2 +import Vuex from 'vuex'
3 +
4 +Vue.use(Vuex)
5 +
6 +export default new Vuex.Store({
7 + state: {
8 + },
9 + mutations: {
10 + },
11 + actions: {
12 + },
13 + modules: {
14 + }
15 +})
1 +<template lang="html">
2 + <contact></contact>
3 +</template>
4 +
5 +<script>
6 + import contact from '@/components/make_contact.vue'
7 + export default {
8 + components:{
9 + contact
10 + }
11 + }
12 +</script>
13 +
14 +<style lang="css" scoped>
15 +</style>
1 +<template>
2 + <div>
3 + <v-toolbar flat>
4 + <v-toolbar-title>즐겨찾기</v-toolbar-title>
5 +
6 + <v-spacer></v-spacer>
7 + <v-text-field
8 + v-model="search"
9 + append-icon="mdi-magnify"
10 + label="즐겨찾기 검색"
11 + single-line
12 + hide-details
13 + ></v-text-field>
14 + </v-toolbar>
15 +
16 + <v-list two-line subheader>
17 +
18 +
19 + <v-list-item
20 + v-for="item in items"
21 + :key="item.title"
22 + @click=""
23 + >
24 + <v-list-item-avatar>
25 + <v-icon
26 +
27 + >{{item.iconClass}}</v-icon>
28 + </v-list-item-avatar>
29 +
30 + <v-list-item-content>
31 + <v-list-item-title v-text="item.title"></v-list-item-title>
32 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
33 + </v-list-item-content>
34 +
35 + <v-list-item-action>
36 + <v-btn icon>
37 + <v-icon color="grey lighten-1">mdi-information</v-icon>
38 + </v-btn>
39 + </v-list-item-action>
40 + </v-list-item>
41 +
42 +
43 + <v-list-item
44 + v-for="item in items2"
45 + :key="item.title"
46 + @click=""
47 + >
48 + <v-list-item-avatar>
49 + <v-icon> {{item.iconClass}}</v-icon>
50 + </v-list-item-avatar>
51 +
52 + <v-list-item-content>
53 + <v-list-item-title v-text="item.title"></v-list-item-title>
54 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
55 + </v-list-item-content>
56 +
57 + <v-list-item-action>
58 + <v-btn icon>
59 + <v-icon color="grey lighten-1">mdi-information</v-icon>
60 + </v-btn>
61 + </v-list-item-action>
62 + </v-list-item>
63 + </v-list>
64 + </div>
65 +</template>
66 +
67 +<script>
68 + export default {
69 + data: () => ({
70 + items: [
71 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Photos', subtitle: 'Jan 9, 2014' },
72 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Recipes', subtitle: 'Jan 17, 2014' },
73 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Work', subtitle: 'Jan 28, 2014' },
74 + ],
75 + items2: [
76 + { icon: 'assignment', iconClass: 'mdi-file', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
77 + { icon: 'call_to_action', iconClass: 'mdi-PdfBox', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
78 + ],
79 + }),
80 + }
81 +</script>
1 +<template lang="html">
2 + <v-app>
3 + <feedback></feedback>
4 + </v-app>
5 +</template>
6 +
7 +<script>
8 + import feedback from '@/components/Feedback.vue'
9 + export default {
10 + components:{
11 + feedback
12 + }
13 + }
14 +</script>
15 +
16 +<style lang="css" scoped>
17 +</style>
1 +<template lang="html">
2 + <v-container fluid>
3 + <FileList></FileList>
4 + </v-container>
5 +</template>
6 +
7 +
8 +
9 +<script>
10 + import FileList from '@/components/FileList'
11 + import Favlist from '@/components/Fav_list'
12 + export default {
13 + components:{
14 + FileList,
15 + Favlist
16 + },
17 + data () {
18 + return {
19 + headers: [
20 + {
21 + text: 'Dessert (100g serving)',
22 + align: 'start',
23 + sortable: false,
24 + value: 'name',
25 + },
26 + { text: 'Calories', value: 'calories' },
27 + { text: 'Fat (g)', value: 'fat' },
28 + { text: 'Carbs (g)', value: 'carbs' },
29 + { text: 'Protein (g)', value: 'protein' },
30 + { text: 'Iron (%)', value: 'iron' },
31 + ],
32 + desserts: [
33 + {
34 + name: 'Frozen Yogurt',
35 + calories: 159,
36 + fat: 6.0,
37 + carbs: 24,
38 + protein: 4.0,
39 + iron: '1%',
40 + format : 'dir'
41 + },
42 + {
43 + name: 'Ice cream sandwich',
44 + calories: 237,
45 + fat: 9.0,
46 + carbs: 37,
47 + protein: 4.3,
48 + iron: '1%',
49 + format: 'pdf'
50 + },
51 + {
52 + name: 'Eclair',
53 + calories: 262,
54 + fat: 16.0,
55 + carbs: 23,
56 + protein: 6.0,
57 + iron: '7%',
58 + format: 'file'
59 + },
60 + {
61 + name: 'Cupcake',
62 + calories: 305,
63 + fat: 3.7,
64 + carbs: 67,
65 + protein: 4.3,
66 + iron: '8%',
67 + format : 'dir'
68 + },
69 + {
70 + name: 'Gingerbread',
71 + calories: 356,
72 + fat: 16.0,
73 + carbs: 49,
74 + protein: 3.9,
75 + iron: '16%',
76 + format : 'pdf'
77 + },
78 + {
79 + name: 'Jelly bean',
80 + calories: 375,
81 + fat: 0.0,
82 + carbs: 94,
83 + protein: 0.0,
84 + iron: '0%',
85 + format:'file'
86 + },
87 + {
88 + name: 'Lollipop',
89 + calories: 392,
90 + fat: 0.2,
91 + carbs: 98,
92 + protein: 0,
93 + iron: '2%',
94 + format:'dir'
95 + },
96 + {
97 + name: 'Honeycomb',
98 + calories: 408,
99 + fat: 3.2,
100 + carbs: 87,
101 + protein: 6.5,
102 + iron: '45%',
103 + foramt:'file'
104 + },
105 + {
106 + name: 'Donut',
107 + calories: 452,
108 + fat: 25.0,
109 + carbs: 51,
110 + protein: 4.9,
111 + iron: '22%',
112 + foramt:'pdf'
113 + },
114 + {
115 + name: 'KitKat',
116 + calories: 518,
117 + fat: 26.0,
118 + carbs: 65,
119 + protein: 7,
120 + iron: '6%',
121 + foramt:'dir'
122 + },
123 + ],
124 + favorite:[
125 + {
126 + name: 'KitKat',
127 + date: '20.05.17'
128 + },
129 + {
130 + name: 'Vuetify',
131 + date: '20.05.17'
132 + }
133 + ],
134 + }
135 + },
136 + }
137 +</script>
1 +<template lang="html">
2 + <v-container>
3 + <div>
4 + <h2>안녕하세요!</h2>
5 + <br><br>
6 + </div>
7 + <v-layout column>
8 + <v-flex>
9 + <v-layout row wrap>
10 + <v-flex xs6>
11 + <v-flex>
12 + <h1>파일</h1>
13 + <v-data-table
14 + :headers="headers"
15 + :items="desserts"
16 + :expand-icon="home"
17 + :items-per-page="5"
18 + class="elevation-1"
19 + ></v-data-table>
20 + <v-spacer></v-spacer>
21 + </v-flex>
22 + <v-flex><br><v-divider></v-divider><br></v-flex>
23 + <v-flex>
24 + <h1>빠른액세스</h1>
25 + <v-simple-table>
26 + <template v-slot:default>
27 + <thead>
28 + <tr>
29 + <th class="text-left">Name</th>
30 + <th class="text-left">Date</th>
31 + </tr>
32 + </thead>
33 + <tbody>
34 + <tr v-for="item in favorite" :key="item.name">
35 + <td>{{ item.name }}</td>
36 + <td>{{ item.date }}</td>
37 + </tr>
38 + </tbody>
39 + </template>
40 + </v-simple-table>
41 + <v-divider></v-divider>
42 + </v-flex>
43 + </v-flex>
44 + <v-flex><br><v-divider></v-divider><br></v-flex>
45 + <v-flex xs6>
46 + <h1>즐겨찾기</h1>
47 + <v-simple-table>
48 + <template v-slot:default>
49 + <thead>
50 + <tr>
51 + <th class="text-left">Name</th>
52 + <th class="text-left">Date</th>
53 + </tr>
54 + </thead>
55 + <tbody>
56 + <tr v-for="item in favorite" :key="item.name">
57 + <td>{{ item.name }}</td>
58 + <td>{{ item.date }}</td>
59 + </tr>
60 + </tbody>
61 + </template>
62 + </v-simple-table>
63 + <v-divider></v-divider>
64 + </v-flex>
65 + </v-layout>
66 + </v-flex>
67 +
68 + </v-layout>
69 + </v-container>
70 +</template>
71 +
72 +
73 +
74 +<script>
75 + export default {
76 + data () {
77 + return {
78 + headers: [
79 + {
80 + text: 'Dessert (100g serving)',
81 + align: 'start',
82 + sortable: false,
83 + value: 'name',
84 + },
85 + { text: 'Calories', value: 'calories' },
86 + { text: 'Fat (g)', value: 'fat' },
87 + { text: 'Carbs (g)', value: 'carbs' },
88 + { text: 'Protein (g)', value: 'protein' },
89 + { text: 'Iron (%)', value: 'iron' },
90 + ],
91 + desserts: [
92 + {
93 + name: 'Frozen Yogurt',
94 + calories: 159,
95 + fat: 6.0,
96 + carbs: 24,
97 + protein: 4.0,
98 + iron: '1%',
99 + format : 'dir'
100 + },
101 + {
102 + name: 'Ice cream sandwich',
103 + calories: 237,
104 + fat: 9.0,
105 + carbs: 37,
106 + protein: 4.3,
107 + iron: '1%',
108 + format: 'pdf'
109 + },
110 + {
111 + name: 'Eclair',
112 + calories: 262,
113 + fat: 16.0,
114 + carbs: 23,
115 + protein: 6.0,
116 + iron: '7%',
117 + format: 'file'
118 + },
119 + {
120 + name: 'Cupcake',
121 + calories: 305,
122 + fat: 3.7,
123 + carbs: 67,
124 + protein: 4.3,
125 + iron: '8%',
126 + format : 'dir'
127 + },
128 + {
129 + name: 'Gingerbread',
130 + calories: 356,
131 + fat: 16.0,
132 + carbs: 49,
133 + protein: 3.9,
134 + iron: '16%',
135 + format : 'pdf'
136 + },
137 + {
138 + name: 'Jelly bean',
139 + calories: 375,
140 + fat: 0.0,
141 + carbs: 94,
142 + protein: 0.0,
143 + iron: '0%',
144 + format:'file'
145 + },
146 + {
147 + name: 'Lollipop',
148 + calories: 392,
149 + fat: 0.2,
150 + carbs: 98,
151 + protein: 0,
152 + iron: '2%',
153 + format:'dir'
154 + },
155 + {
156 + name: 'Honeycomb',
157 + calories: 408,
158 + fat: 3.2,
159 + carbs: 87,
160 + protein: 6.5,
161 + iron: '45%',
162 + foramt:'file'
163 + },
164 + {
165 + name: 'Donut',
166 + calories: 452,
167 + fat: 25.0,
168 + carbs: 51,
169 + protein: 4.9,
170 + iron: '22%',
171 + foramt:'pdf'
172 + },
173 + {
174 + name: 'KitKat',
175 + calories: 518,
176 + fat: 26.0,
177 + carbs: 65,
178 + protein: 7,
179 + iron: '6%',
180 + foramt:'dir'
181 + },
182 + ],
183 + favorite:[
184 + {
185 + name: 'KitKat',
186 + date: '20.05.17'
187 + },
188 + {
189 + name: 'Vuetify',
190 + date: '20.05.17'
191 + }
192 + ],
193 + }
194 + },
195 + }
196 +</script>
1 +<template>
2 + <v-app id="inspire">
3 + <v-content>
4 + <v-container
5 + class="fill-height"
6 + fluid
7 + >
8 + <v-row
9 + align="center"
10 + justify="center"
11 + >
12 + <v-col
13 + cols="12"
14 + sm="8"
15 + md="4"
16 + >
17 + <v-card class="elevation-12">
18 + <v-toolbar
19 + color="primary"
20 + dark
21 + flat
22 + >
23 + <v-toolbar-title>KhuLoud</v-toolbar-title>
24 + <v-spacer></v-spacer>
25 + <v-tooltip bottom>
26 + <template v-slot:activator="{ on }">
27 + <v-btn
28 + :href="source"
29 + icon
30 + large
31 + target="_blank"
32 + v-on="on"
33 + >
34 + <v-icon>mdi-code-tags</v-icon>
35 + </v-btn>
36 + </template>
37 + <span>Source</span>
38 + </v-tooltip>
39 + </v-toolbar>
40 + <v-card-text>
41 + <v-form>
42 + <v-text-field
43 + label="Login"
44 + name="login"
45 + type="text"
46 + ></v-text-field>
47 +
48 + <v-text-field
49 + id="password"
50 + label="Password"
51 + name="password"
52 + type="password"
53 + ></v-text-field>
54 + </v-form>
55 + </v-card-text>
56 + <v-card-actions>
57 + <v-spacer></v-spacer>
58 + <v-btn color="primary" @click = "$router.push({name: 'RegistUser'})">Regist</v-btn>
59 + <v-btn color="primary" router :to="{name: 'Main'}" exact>Login</v-btn>
60 + </v-card-actions>
61 + </v-card>
62 + </v-col>
63 + </v-row>
64 + </v-container>
65 + </v-content>
66 + </v-app>
67 +</template>
68 +
69 +<script>
70 + export default {
71 + props: {
72 + source: String,
73 + },
74 + }
75 +</script>
1 +<template lang="html">
2 + <v-container>
3 + <div>
4 + <h2>안녕하세요!</h2>
5 + <br><br>
6 + </div>
7 + <v-layout column>
8 + <v-flex>
9 + <v-layout row wrap>
10 + <v-flex lg6>
11 + <v-flex>
12 + <Filecard></Filecard>
13 + </v-flex>
14 + <v-flex><br><br></v-flex>
15 + </v-flex>
16 + <v-flex><br><br></v-flex>
17 + <v-flex lg6>
18 + <Favlist></Favlist>
19 + </v-flex>
20 + </v-layout>
21 + </v-flex>
22 + </v-layout>
23 + <v-divider></v-divider>
24 + <v-layout column>
25 + <v-flex>
26 + <v-toolbar flat>
27 + <v-toolbar-title>빠른 액세스</v-toolbar-title>
28 + <v-spacer></v-spacer>
29 + </v-toolbar>
30 + <v-simple-table>
31 + <template v-slot:default>
32 + <thead>
33 + <tr>
34 + <th class="text-left">Name</th>
35 + <th class="text-left">Date</th>
36 + </tr>
37 + </thead>
38 + <tbody>
39 + <tr v-for="item in favorite" :key="item.name">
40 + <td>{{ item.name }}</td>
41 + <td>{{ item.date }}</td>
42 + </tr>
43 + </tbody>
44 + </template>
45 + </v-simple-table>
46 + <v-divider></v-divider>
47 + </v-flex>
48 + </v-layout>
49 + </v-container>
50 +</template>
51 +
52 +
53 +
54 +<script>
55 + import FileList from '@/components/FileList'
56 + import Favlist from '@/components/Fav_list'
57 + import Filecard from '@/components/FileCardlist.vue'
58 + export default {
59 + components:{
60 + FileList,
61 + Favlist,
62 + Filecard
63 + },
64 + data () {
65 + return {
66 + headers: [
67 + {
68 + text: 'Dessert (100g serving)',
69 + align: 'start',
70 + sortable: false,
71 + value: 'name',
72 + },
73 + { text: 'Calories', value: 'calories' },
74 + { text: 'Fat (g)', value: 'fat' },
75 + { text: 'Carbs (g)', value: 'carbs' },
76 + { text: 'Protein (g)', value: 'protein' },
77 + { text: 'Iron (%)', value: 'iron' },
78 + ],
79 + desserts: [
80 + {
81 + name: 'Frozen Yogurt',
82 + calories: 159,
83 + fat: 6.0,
84 + carbs: 24,
85 + protein: 4.0,
86 + iron: '1%',
87 + format : 'dir'
88 + },
89 + {
90 + name: 'Ice cream sandwich',
91 + calories: 237,
92 + fat: 9.0,
93 + carbs: 37,
94 + protein: 4.3,
95 + iron: '1%',
96 + format: 'pdf'
97 + },
98 + {
99 + name: 'Eclair',
100 + calories: 262,
101 + fat: 16.0,
102 + carbs: 23,
103 + protein: 6.0,
104 + iron: '7%',
105 + format: 'file'
106 + },
107 + {
108 + name: 'Cupcake',
109 + calories: 305,
110 + fat: 3.7,
111 + carbs: 67,
112 + protein: 4.3,
113 + iron: '8%',
114 + format : 'dir'
115 + },
116 + {
117 + name: 'Gingerbread',
118 + calories: 356,
119 + fat: 16.0,
120 + carbs: 49,
121 + protein: 3.9,
122 + iron: '16%',
123 + format : 'pdf'
124 + },
125 + {
126 + name: 'Jelly bean',
127 + calories: 375,
128 + fat: 0.0,
129 + carbs: 94,
130 + protein: 0.0,
131 + iron: '0%',
132 + format:'file'
133 + },
134 + {
135 + name: 'Lollipop',
136 + calories: 392,
137 + fat: 0.2,
138 + carbs: 98,
139 + protein: 0,
140 + iron: '2%',
141 + format:'dir'
142 + },
143 + {
144 + name: 'Honeycomb',
145 + calories: 408,
146 + fat: 3.2,
147 + carbs: 87,
148 + protein: 6.5,
149 + iron: '45%',
150 + foramt:'file'
151 + },
152 + {
153 + name: 'Donut',
154 + calories: 452,
155 + fat: 25.0,
156 + carbs: 51,
157 + protein: 4.9,
158 + iron: '22%',
159 + foramt:'pdf'
160 + },
161 + {
162 + name: 'KitKat',
163 + calories: 518,
164 + fat: 26.0,
165 + carbs: 65,
166 + protein: 7,
167 + iron: '6%',
168 + foramt:'dir'
169 + },
170 + ],
171 + favorite:[
172 + {
173 + name: 'KitKat',
174 + date: '20.05.17'
175 + },
176 + {
177 + name: 'Vuetify',
178 + date: '20.05.17'
179 + }
180 + ],
181 + }
182 + },
183 + }
184 +</script>
1 +<template>
2 + <div>
3 + <v-toolbar flat>
4 + <v-toolbar-title>빠른액세스</v-toolbar-title>
5 +
6 + <v-spacer></v-spacer>
7 + <v-text-field
8 + v-model="search"
9 + append-icon="mdi-magnify"
10 + label="검색"
11 + single-line
12 + hide-details
13 + ></v-text-field>
14 + </v-toolbar>
15 +
16 + <v-list two-line subheader>
17 +
18 +
19 + <v-list-item
20 + v-for="item in items"
21 + :key="item.title"
22 + @click=""
23 + >
24 + <v-list-item-avatar>
25 + <v-icon
26 +
27 + >{{item.iconClass}}</v-icon>
28 + </v-list-item-avatar>
29 +
30 + <v-list-item-content>
31 + <v-list-item-title v-text="item.title"></v-list-item-title>
32 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
33 + </v-list-item-content>
34 +
35 + <v-list-item-action>
36 + <v-btn icon>
37 + <v-icon color="grey lighten-1">mdi-information</v-icon>
38 + </v-btn>
39 + </v-list-item-action>
40 + </v-list-item>
41 +
42 +
43 + <v-list-item
44 + v-for="item in items2"
45 + :key="item.title"
46 + @click=""
47 + >
48 + <v-list-item-avatar>
49 + <v-icon> {{item.iconClass}}</v-icon>
50 + </v-list-item-avatar>
51 +
52 + <v-list-item-content>
53 + <v-list-item-title v-text="item.title"></v-list-item-title>
54 + <v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
55 + </v-list-item-content>
56 +
57 + <v-list-item-action>
58 + <v-btn icon>
59 + <v-icon color="grey lighten-1">mdi-information</v-icon>
60 + </v-btn>
61 + </v-list-item-action>
62 + </v-list-item>
63 + </v-list>
64 + </div>
65 +</template>
66 +
67 +<script>
68 + export default {
69 + data: () => ({
70 + items: [
71 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Photos', subtitle: 'Jan 9, 2014' },
72 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Recipes', subtitle: 'Jan 17, 2014' },
73 + { icon: 'folder', iconClass: 'mdi-folder', title: 'Work', subtitle: 'Jan 28, 2014' },
74 + ],
75 + items2: [
76 + { icon: 'assignment', iconClass: 'mdi-file', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
77 + { icon: 'call_to_action', iconClass: 'mdi-PdfBox', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
78 + ],
79 + }),
80 + }
81 +</script>
1 +<template>
2 + <v-app id="inspire">
3 + <v-content>
4 + <v-container
5 + class="fill-height"
6 + fluid
7 + >
8 + <v-row
9 + align="center"
10 + justify="center"
11 + >
12 + <v-col
13 + cols="12"
14 + sm="8"
15 + md="4"
16 + >
17 + <v-card class="elevation-12">
18 + <v-toolbar
19 + color="primary"
20 + dark
21 + flat
22 + >
23 + <v-toolbar-title>KhuLoud</v-toolbar-title>
24 + <v-spacer></v-spacer>
25 + <v-tooltip bottom>
26 + <template v-slot:activator="{ on }">
27 + <v-btn
28 + :href="source"
29 + icon
30 + large
31 + target="_blank"
32 + v-on="on"
33 + >
34 + <v-icon>mdi-code-tags</v-icon>
35 + </v-btn>
36 + </template>
37 + <span>Source</span>
38 + </v-tooltip>
39 + </v-toolbar>
40 + <v-card-text>
41 + <v-form>
42 + <v-text-field
43 + label="ID"
44 + v-model="Id"
45 + name="ID"
46 + type="text"
47 + ></v-text-field>
48 +
49 + <v-text-field
50 + v-model="Password"
51 + label="Password"
52 + name="password"
53 + type="password"
54 + ></v-text-field>
55 +
56 + <v-text-field
57 + label="Name"
58 + v-model="Name"
59 + name="name"
60 + type="name"
61 + ></v-text-field>
62 +
63 + <v-text-field
64 + label="E-mail"
65 + v-model="email"
66 + :rules="emailRules"
67 + name="Email"
68 + ></v-text-field>
69 + </v-form>
70 + </v-card-text>
71 + <v-card-actions>
72 + <v-spacer></v-spacer>
73 + <v-btn color="primary" @click = "$router.push({name: 'Login'})">Regist</v-btn>
74 + </v-card-actions>
75 + </v-card>
76 + </v-col>
77 + </v-row>
78 + </v-container>
79 + </v-content>
80 + </v-app>
81 +</template>
82 +
83 +<script>
84 + export default {
85 + props: {
86 + source: String,
87 + },
88 + }
89 +</script>
1 +<template>
2 + <v-app id="inspire">
3 + <v-navigation-drawer
4 + v-model="drawer"
5 + :clipped="$vuetify.breakpoint.lgAndUp"
6 + app
7 + >
8 + <v-list dense>
9 + <v-list-item router :to="{name: 'Main'}" exact>
10 + <v-list-item-action>
11 + <v-icon>mdi-home</v-icon>
12 + </v-list-item-action>
13 + <v-list-item-content>
14 + <v-list-item-title>홈</v-list-item-title>
15 + </v-list-item-content>
16 + </v-list-item>
17 + <v-list-item router :to="{name: 'File'}" exact>
18 + <v-list-item-action>
19 + <v-icon>mdi-file</v-icon>
20 + </v-list-item-action>
21 + <v-list-item-content>
22 + <v-list-item-title>파일</v-list-item-title>
23 + </v-list-item-content>
24 + </v-list-item>
25 + <v-list-item router :to="{name: 'Fav'}" exact>
26 + <v-list-item-action>
27 + <v-icon>mdi-heart</v-icon>
28 + </v-list-item-action>
29 + <v-list-item-content>
30 + <v-list-item-title>즐겨찾기</v-list-item-title>
31 + </v-list-item-content>
32 + </v-list-item>
33 + <v-list-item router :to="{name: 'Quick'}" exact>
34 + <v-list-item-action>
35 + <v-icon>mdi-history</v-icon>
36 + </v-list-item-action>
37 + <v-list-item-content>
38 + <v-list-item-title>빠른 액세스</v-list-item-title>
39 + </v-list-item-content>
40 + </v-list-item>
41 + <v-list-item router :to="{name: 'Contact'}" exact>
42 + <v-list-item-action>
43 + <v-icon>mdi-contacts</v-icon>
44 + </v-list-item-action>
45 + <v-list-item-content>
46 + <v-list-item-title>연락처</v-list-item-title>
47 + </v-list-item-content>
48 + </v-list-item>
49 + <v-list-item router :to="{name: 'Main'}" exact>
50 + <v-list-item-action>
51 + <v-icon>mdi-settings</v-icon>
52 + </v-list-item-action>
53 + <v-list-item-content>
54 + <v-list-item-title>설정</v-list-item-title>
55 + </v-list-item-content>
56 + </v-list-item>
57 + <v-list-item>
58 + <v-list-item-action>
59 + <v-icon>mdi-delete</v-icon>
60 + </v-list-item-action>
61 + <v-list-item-content>
62 + <v-list-item-title>휴지통</v-list-item-title>
63 + </v-list-item-content>
64 + </v-list-item>
65 + <v-list-item router :to="{name: 'Feedback'}" exact>
66 + <v-list-item-action>
67 + <v-icon>mdi-message</v-icon>
68 + </v-list-item-action>
69 + <v-list-item-content>
70 + <v-list-item-title>피드백</v-list-item-title>
71 + </v-list-item-content>
72 + </v-list-item>
73 + <v-list-item router :to="{name: 'Main'}" exact>
74 + <v-list-item-action>
75 + <v-icon>mdi-help-circle</v-icon>
76 + </v-list-item-action>
77 + <v-list-item-content>
78 + <v-list-item-title>도움말</v-list-item-title>
79 + </v-list-item-content>
80 + </v-list-item>
81 + </v-list>
82 + </v-navigation-drawer>
83 +
84 + <v-app-bar
85 + :clipped-left="$vuetify.breakpoint.lgAndUp"
86 + app
87 + color="blue darken-3"
88 + dark
89 + >
90 + <v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
91 + <v-toolbar-title
92 + style="width: 300px"
93 + class="ml-0 pl-4"
94 + >
95 + <span class="hidden-sm-and-down">KhuLoud</span>
96 + </v-toolbar-title>
97 + <v-text-field
98 + flat
99 + solo-inverted
100 + hide-details
101 + prepend-inner-icon="mdi-magnify"
102 + label="전체 검색"
103 + class="hidden-sm-and-down"
104 + ></v-text-field>
105 + <v-spacer></v-spacer>
106 + <v-btn icon @click = "$router.push({name: 'Login'})">
107 + <v-icon>mdi-login</v-icon>
108 + </v-btn>
109 + <v-btn icon>
110 + <v-icon>mdi-bell</v-icon>
111 + </v-btn>
112 + </v-app-bar>
113 + <v-content>
114 + <v-container
115 +
116 + >
117 + <router-view></router-view>
118 + </v-container>
119 + </v-content>
120 + <v-btn
121 + bottom
122 + color="pink"
123 + dark
124 + fab
125 + fixed
126 + right
127 + @click="dialog = !dialog"
128 + >
129 + <v-icon>mdi-plus</v-icon>
130 + </v-btn>
131 + <v-dialog
132 + v-model="dialog"
133 + width="800px"
134 + >
135 + <v-card>
136 + <v-card-title class="grey darken-2">
137 + Create contact
138 + </v-card-title>
139 + <v-container>
140 + <v-row class="mx-2">
141 + <v-col
142 + class="align-center justify-space-between"
143 + cols="12"
144 + >
145 + <v-row
146 + align="center"
147 + class="mr-0"
148 + >
149 + <v-avatar
150 + size="40px"
151 + class="mx-3"
152 + >
153 + <img
154 + src="//ssl.gstatic.com/s2/oz/images/sge/grey_silhouette.png"
155 + alt=""
156 + >
157 + </v-avatar>
158 + <v-text-field
159 + placeholder="Name"
160 + ></v-text-field>
161 + </v-row>
162 + </v-col>
163 + <v-col cols="6">
164 + <v-text-field
165 + prepend-icon="mdi-account-card-details-outline"
166 + placeholder="Company"
167 + ></v-text-field>
168 + </v-col>
169 + <v-col cols="6">
170 + <v-text-field
171 + placeholder="Job title"
172 + ></v-text-field>
173 + </v-col>
174 + <v-col cols="12">
175 + <v-text-field
176 + prepend-icon="mdi-mail"
177 + placeholder="Email"
178 + ></v-text-field>
179 + </v-col>
180 + <v-col cols="12">
181 + <v-text-field
182 + type="tel"
183 + prepend-icon="mdi-phone"
184 + placeholder="(000) 000 - 0000"
185 + ></v-text-field>
186 + </v-col>
187 + <v-col cols="12">
188 + <v-text-field
189 + prepend-icon="mdi-text"
190 + placeholder="Notes"
191 + ></v-text-field>
192 + </v-col>
193 + </v-row>
194 + </v-container>
195 + <v-card-actions>
196 + <v-btn
197 + text
198 + color="primary"
199 + >More</v-btn>
200 + <v-spacer></v-spacer>
201 + <v-btn
202 + text
203 + color="primary"
204 + @click="dialog = false"
205 + >Cancel</v-btn>
206 + <v-btn
207 + text
208 + @click="dialog = false"
209 + >Save</v-btn>
210 + </v-card-actions>
211 + </v-card>
212 + </v-dialog>
213 + </v-app>
214 +</template>
215 +
216 +<script>
217 +export default {
218 + props: {
219 + source: String,
220 + },
221 + data: () => ({
222 + dialog: false,
223 + drawer: null,
224 + items: [
225 + { icon: 'mdi-home', text: '홈' },
226 + { icon: 'mdi-file', text: '파일' },
227 + { icon: 'mdi-heart', text: '즐겨찾기' },
228 + { icon: 'mdi-history', text: '빠른 액세스'},
229 + { icon: 'mdi-contacts', text: '연락처' },
230 + { icon: 'mdi-settings', text: '설정' },
231 + { icon: 'mdi-message', text: '피드백' },
232 + { icon: 'mdi-help-circle', text: '도움말' },
233 +
234 + ],
235 + }),
236 +}
237 +</script>
238 +
239 +<style>
240 +
241 +</style>
...\ No newline at end of file ...\ No newline at end of file
1 +module.exports = {
2 + "transpileDependencies": [
3 + "vuetify"
4 + ]
5 +}
...\ No newline at end of file ...\ No newline at end of file