Browse Source

Prepare for coding

- Bulma added
- Axios used
master
Alfred 8 months ago
parent
commit
3dc05b7e7c

+ 1
- 2
.editorconfig View File

@@ -2,8 +2,7 @@ root = true
2 2
 
3 3
 [*]
4 4
 charset = utf-8
5
-indent_style = space
6
-indent_size = 2
5
+indent_style = tab
7 6
 end_of_line = lf
8 7
 insert_final_newline = true
9 8
 trim_trailing_whitespace = true

+ 1
- 0
index.html View File

@@ -4,6 +4,7 @@
4 4
     <meta charset="utf-8">
5 5
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
6 6
     <title>Macarrodes</title>
7
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
7 8
   </head>
8 9
   <body>
9 10
     <div id="app"></div>

+ 4
- 0
package.json View File

@@ -15,6 +15,8 @@
15 15
   },
16 16
   "dependencies": {
17 17
     "axios": "^0.18.0",
18
+    "bulma": "^0.7.1",
19
+    "lodash": "^4.17.10",
18 20
     "vue": "^2.5.2",
19 21
     "vue-router": "^3.0.1"
20 22
   },
@@ -64,6 +66,7 @@
64 66
     "mocha": "^3.2.0",
65 67
     "nightwatch": "^0.9.12",
66 68
     "node-notifier": "^5.1.2",
69
+    "node-sass": "^4.9.3",
67 70
     "optimize-css-assets-webpack-plugin": "^3.2.0",
68 71
     "ora": "^1.2.0",
69 72
     "phantomjs-prebuilt": "^2.1.14",
@@ -72,6 +75,7 @@
72 75
     "postcss-loader": "^2.0.8",
73 76
     "postcss-url": "^7.2.1",
74 77
     "rimraf": "^2.6.0",
78
+    "sass-loader": "^7.1.0",
75 79
     "selenium-server": "^3.0.1",
76 80
     "semver": "^5.3.0",
77 81
     "shelljs": "^0.7.6",

+ 12
- 3
src/App.vue View File

@@ -1,17 +1,26 @@
1 1
 <template>
2 2
   <div id="app">
3
-    <img src="./assets/logo.png">
3
+    <h1>Macarrodes</h1>
4 4
     <router-view/>
5
+    <tools></tools>
6
+    <bookmark-modal></bookmark-modal>
5 7
   </div>
6 8
 </template>
7 9
 
8 10
 <script>
11
+import Tools from '@/components/Tools'
12
+import BookmarkModal from '@/components/BookmarkModal'
13
+
9 14
 export default {
10
-  name: 'App'
15
+  name: 'App',
16
+  components: {
17
+    Tools,
18
+    BookmarkModal
19
+  }
11 20
 }
12 21
 </script>
13 22
 
14
-<style>
23
+<style lang="scss">
15 24
 #app {
16 25
   font-family: 'Avenir', Helvetica, Arial, sans-serif;
17 26
   -webkit-font-smoothing: antialiased;

+ 3
- 0
src/assets/definitions.scss View File

@@ -0,0 +1,3 @@
1
+p {
2
+    color: red;
3
+}

+ 40
- 0
src/components/BookmarkModal.vue View File

@@ -0,0 +1,40 @@
1
+<template>
2
+    <div class="modal" ref="modal" :class="{'is-active': visible}">
3
+      <div class="modal-background"></div>
4
+      <div class="modal-card">
5
+        <header class="modal-card-head">
6
+          <p class="modal-card-title">{{(isNew) ? "New" : "Edit"}} link</p>
7
+          <button class="delete" aria-label="close" @click="visible = !visible"></button>
8
+        </header>
9
+        <section class="modal-card-body">
10
+              <div class="content">
11
+                <p>Hola caracola</p>
12
+              </div>
13
+        </section>
14
+    <footer class="modal-card-foot">
15
+      <button class="button is-success">Save changes</button>
16
+      <button class="button">Cancel</button>
17
+    </footer>
18
+  </div>
19
+</div>
20
+</template>
21
+
22
+<script>
23
+export default {
24
+  name: 'bookmark-modal',
25
+  data () {
26
+    return {
27
+      visible: false,
28
+      isNew: true
29
+    }
30
+  },
31
+  methods: {
32
+    loadBookmark: function (data) {
33
+    }
34
+  }
35
+}
36
+</script>
37
+
38
+<style lang="scss">
39
+@import "../assets/definitions";
40
+</style>

+ 1
- 3
src/components/Bookmarks.vue View File

@@ -9,17 +9,16 @@
9 9
         </li>
10 10
       </ul>
11 11
     </div>
12
-    <hr />
13 12
     <div>
14 13
       <input type="text" v-model="input_val">
15 14
     </div>
16 15
     <div>
17 16
       Input Value: <span v-text="input_val"></span>
18 17
     </div>
19
-    <hr />
20 18
     <div>
21 19
       <button class="btn btn-primary" v-on:click="counter++">Your've clicked this button {{counter}} times!</button>
22 20
     </div>
21
+    <hr />
23 22
   </div>
24 23
 </template>
25 24
 
@@ -40,7 +39,6 @@ export default {
40 39
   methods: {
41 40
   },
42 41
   created: function () {
43
-    console.log('sadfjsafd')
44 42
     axios.get('http://127.0.0.1:3000/bookmarks')
45 43
       .then(response => {
46 44
         this.bookmarks = response.data

+ 34
- 0
src/components/Tools.vue View File

@@ -0,0 +1,34 @@
1
+<template>
2
+    <div>
3
+        <input type="text" v-model="url" placeholder="New link" /> <input type="submit" value="Add new link" @click="addLink" />
4
+    </div>
5
+</template>
6
+
7
+<script>
8
+import axios from 'axios'
9
+
10
+export default {
11
+  name: 'tools',
12
+  data () {
13
+    return {
14
+      url: ''
15
+    }
16
+  },
17
+  methods: {
18
+    addLink: function () {
19
+      console.log(this.url)
20
+      axios.post('http://127.0.0.1:8081/api/analyze/', {
21
+        url: this.url
22
+      }).then(function (response) {
23
+        console.log(response.data)
24
+      }).catch(function (error) {
25
+        console.log(error)
26
+      })
27
+    }
28
+  }
29
+}
30
+</script>
31
+
32
+<style>
33
+
34
+</style>

Loading…
Cancel
Save