Skip to content

Commit 18b6702

Browse files
ALPIXELMaikiALPIXELMaiki
committed
W on new-file and head plugin
1 parent 573abae commit 18b6702

File tree

12 files changed

+219
-54
lines changed

12 files changed

+219
-54
lines changed

‎dist/build.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/build.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.html

Lines changed: 30 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,39 @@
11
<!DOCTYPE html>
22
<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">
7-
<meta name="application-name" content="VueJS Admin">
8-
<meta name="robots" content="index,follow,noodp">
9-
<meta name="google" content="nositelinkssearchbox">
10-
<meta name="google" content="notranslate">
11-
<meta name="generator" content="VueJS - ALPIXEL">
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, shrink-to-fit=no">
7+
<title>A VueJS & ChuckCSS administration</title>
8+
9+
10+
<!-- Name of web application (only should be used if the website is used as an app) -->
11+
<meta name="application-name" content="VueJS Admin">
1212

13+
<!-- All Search Engines -->
14+
<meta name="robots" content="index,follow,noodp">
1315

14-
<title>A VueJS & ChuckCSS administration</title>
16+
<!-- Google Specific -->
17+
<meta name="googlebot" content="index,follow">
18+
<meta name="google-site-verification" content="">
19+
<meta name="google" content="notranslate">
1520

16-
<!-- CDD -->
17-
<link rel="stylesheet" href="dist/style.css" />
18-
19-
<meta name="google-site-verification" content="">
21+
<!-- Used to name software used to build the website -->
22+
<meta name="generator" content="VueJS">
2023

21-
</head>
22-
<body>
23-
<div id="app"></div>
24+
<!-- Short description of your site's subject -->
25+
<meta name="subject" content="An administration panel build with ChuckCSS framework and VueJS">
2426

25-
<!-- Tinymce -->
26-
<script src="//cloud.tinymce.com/stable/tinymce.min.js"></script>
27+
<!-- CSS -->
28+
<link rel="stylesheet" href="dist/style.css" />
29+
</head>
2730

28-
<script src="dist/build.js"></script>
29-
</body>
31+
<body>
32+
<div id="app"></div>
33+
34+
<!-- Tinymce -->
35+
<script src="//cloud.tinymce.com/stable/tinymce.min.js"></script>
36+
37+
<script src="dist/build.js"></script>
38+
</body>
3039
</html>

‎memo.txt

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,12 +23,12 @@ mkdir ~/.npm-global/lib && mkdir ~/.npm-global/lib/node_modules && mkdir ~/.npm-
2323
sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share}
2424

2525

26-
6. (in /var/www/)
27-
sudo npm install --no-bin-links
26+
6. (in /var/www/) Thanks windows..
27+
sudo npm i --no-bin-links
2828

2929

30-
7.
31-
sudo npm install cross-env webpack webpack-dev-server --save
30+
7. Thanks windows..
31+
sudo npm i -g cross-env webpack webpack-dev-server --save
3232

3333

3434
8.

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"karma-cli": "^1.0.1",
1515
"vue": "^2.2",
1616
"webpack": "^2.4.1",
17-
"webpack-dev-server": "^2.4.2"
17+
"webpack-dev-server": "^2.4.3"
1818
},
1919
"devDependencies": {
2020
"accounting": "^0.4.1",
@@ -56,7 +56,7 @@
5656
"vue-axios": "^1.2.2",
5757
"vue-cookie": "^1.1.3",
5858
"vue-flatpickr": "^2.3.0",
59-
"vue-head": "^2.0.10",
59+
"vue-head": "^2.0",
6060
"vue-highcharts": "0.0.9",
6161
"vue-loader": "^10.0.0",
6262
"vue-router": "^2.2.1",

‎src/js/App.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,6 @@
114114
loading: true
115115
}
116116
},
117-
118117
created () {
119118
// check cookie for auto-login user
120119
this.checkCookie()

‎src/js/_new-file.vue

Lines changed: 134 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,134 @@
1+
<template>
2+
<div>
3+
<!-- My component / page template -->
4+
<my-awesome-component></my-awesome-component>
5+
6+
<!-- Computed + filter -->
7+
{{ proutDouble|pluralize }}
8+
9+
</div>
10+
</template>
11+
12+
<script>
13+
import Vue from 'vue'
14+
import myAwesomecomponent from './pathtocomponent/my-awesome-component.vue'
15+
import { alpha,alphaNum,and,between,email,maxLength,minLength,numeric,or,required,sameAs } from 'vuelidate/lib/validators
16+
17+
export default {
18+
name: 'trololo',
19+
20+
// LifeCycle Diagram
21+
// https://vuejs.org/v2/guide/instance.html#Lifecycle-Diagram
22+
created () {
23+
// Called synchronously after the instance is created. At this stage, the instance has finished processing the options which means the following have been set up: data observation, computed properties, methods, watch/event callbacks. However, the mounting phase has not been started, and the $el property will not be available yet.
24+
this.prout = !this.prout
25+
},
26+
mounted () {
27+
// Called after the instance has just been mounted where el is replaced by the newly created vm.$el. If the root instance is mounted to an in-document element, vm.$el will also be in-document when mounted is called.
28+
var vm = this
29+
},
30+
beforeUpdate(){
31+
// Called when the data changes, before the virtual DOM is re-rendered and patched. You can perform further state changes in this hook and they will not trigger additional re-renders.
32+
},
33+
updated() {
34+
// Called after a data change causes the virtual DOM to be re-rendered and patched.
35+
// The component’s DOM will have been updated when this hook is called, so you can perform DOM-dependent operations here. However, in most cases you should avoid changing state inside the hook. To react to state changes, it’s usually better to use a computed property or watcher instead.
36+
},
37+
beforeDestroy () {
38+
// Called right before a Vue instance is destroyed. At this stage the instance is still fully functional.
39+
},
40+
41+
// Options / Datas
42+
data () {
43+
return {
44+
prout: false,
45+
proutPower : 10
46+
}
47+
},
48+
computed: {
49+
proutDouble: {
50+
get(){
51+
return this.proutPower * 2
52+
53+
},
54+
set(val){
55+
this.prout = val * 2
56+
}
57+
}
58+
},
59+
watch: {
60+
// When route change but same component is called, launch "fetchData" method
61+
// for exemple : from "user/25" -> to -> "user/52"
62+
'$route' : 'myRouteChanged',
63+
64+
// Refer to data
65+
proutPower (newPower) {
66+
// do something with this new power
67+
},
68+
},
69+
methods: {
70+
// Call in 'watch' property
71+
myRouteChanged() {
72+
},
73+
74+
method1(param) {
75+
return 'Such Sun!'
76+
}
77+
},
78+
79+
// Options / Assets
80+
filters: {
81+
pluralize(value) {
82+
return (value > 1) ? value+' prouts' : value+ ' prout'
83+
}
84+
},
85+
directive: {
86+
makeNoise: {
87+
88+
}
89+
},
90+
components: {
91+
myAwesomecomponent
92+
},
93+
94+
95+
96+
// Only for components
97+
props: {
98+
'isSick': {
99+
type: Boolean,
100+
default: false,
101+
require: true
102+
}
103+
},
104+
105+
106+
107+
// Custom properties : not Vue native
108+
// Meta <head> Plugin
109+
head: {
110+
title() {
111+
return {
112+
}
113+
},
114+
meta() {
115+
return [
116+
]
117+
}
118+
},
119+
// Form validations
120+
validations: {
121+
login: {
122+
loginInput: {
123+
required,
124+
minLength: minLength(4)
125+
},
126+
loginPass: {
127+
required,
128+
minLength: minLength(4)
129+
}
130+
}
131+
},
132+
}
133+
134+
</script>

‎src/js/components/dropzone.vue

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
import Dropzone from 'dropzone'
77
88
export default {
9+
name: 'dropzone',
10+
911
data() {
1012
return {
1113

‎src/js/components/pagination.vue

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,13 +72,11 @@
7272
}
7373
},
7474
75-
// When component is created, create the pagination
7675
created() {
7776
7877
this.createPagination()
7978
},
8079
81-
// Computed datas
8280
computed: {
8381
// Show first & prev buttons ?
8482
showLeft() {
@@ -120,6 +118,7 @@
120118
this.current = (this.currentpage < 1) ? 1 : this.currentpage
121119
}
122120
},
121+
123122
methods: {
124123
125124
// When the page change

‎src/js/components/tinymce.vue

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@
88
import tinymce from 'tinymce/tinymce'
99
1010
export default {
11+
name: 'tinymce',
12+
1113
data() {
1214
return {
1315

‎src/js/main.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,10 @@ import './directives/directives.vue'
2323

2424

2525
// Use Plugins
26-
Vue.use(VueHead)
26+
Vue.use(VueHead,{
27+
separator: '-',
28+
complement: 'Made by ALPIXEL Agency'
29+
})
2730
Vue.use(VueAxios, axios)
2831
Vue.use(Vuelidate)
2932
Vue.use(VueCookie)
@@ -34,6 +37,9 @@ Vue.use(VueAnalytics, {
3437
trackingId: 'UA-9271946-13',
3538
debug: false,
3639
vueRouter: router
40+
41+
// If router, you can exclude some routes name (case insensitive) (optional)
42+
// ignoredViews: ['homepage'],
3743
})
3844

3945

‎src/js/views/dashboard/dashboard.vue

Lines changed: 34 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -207,30 +207,44 @@
207207
head: {
208208
title() {
209209
return {
210-
inner: this.msg,
211-
separator: '-',
212-
complement: 'Made by ALPIXEL agency'
210+
inner: this.msg
213211
}
214212
},
215213
meta() {
216214
return [
217-
{ name: 'application-name', content: 'ChuckAdmin' },
218-
{ name: 'description', content: 'A VueJS & ChuckCSS administration', id: 'desc' }, // id to replace intead of create element
219-
// ...
220-
// Twitter
221-
{ name: 'twitter:title', content: 'ChuckAdmin' },
222-
// with shorthand
223-
{ n: 'twitter:description', c: 'A VueJS & ChuckCSS administration'},
224-
// ...
225-
// Google+ / Schema.org
226-
{ itemprop: 'name', content: 'ChuckAdmin' },
227-
{ itemprop: 'description', content: 'A VueJS & ChuckCSS administration' }
228-
// ...
229-
// Facebook / Open Graph
230-
// { property: 'fb:app_id', content: '123456789' },
231-
// { property: 'og:title', content: 'Content Title' },
232-
// with shorthand
233-
// { p: 'og:image', c: 'https://example.com/image.jpg' }
215+
// Meta Description
216+
{
217+
n: 'description',
218+
c: 'A VueJS & ChuckCSS administration'
219+
},
220+
221+
// Twitter card
222+
{ n: 'twitter:card', c:'summary' },
223+
// { n: 'twitter:site', c:'@site_account' },
224+
// { n: 'twitter:creator', c:'@individual_account' },
225+
{ n: 'twitter:url', c:'' },
226+
{ n: 'twitter:title', c:'A VueJS & ChuckCSS administration' },
227+
{ n: 'twitter:image', c:'' },
228+
{ n: 'twitter:description', c: 'A VueJS & ChuckCSS administration' },
229+
230+
// FaceBook / Open Graph
231+
{ p: 'fb:app_id', c:'' },
232+
{ p: 'og:url', c:'' },
233+
{ p: 'og:type', c:'website' },
234+
{ p: 'og:title', c:'A VueJS & ChuckCSS administration' },
235+
{ p: 'og:image', c:'' },
236+
{ p: 'og:description', c: 'A VueJS & ChuckCSS administration' },
237+
{ p: 'og:site_name', c: 'VueJS & ChuckCSS administration' },
238+
{ p: 'og:locale', c: 'en_US' },
239+
{ p: 'article:author', c: 'ALPIXEL Agency' },
240+
241+
// Google+ / Schema.org : itemprop meta
242+
{ ip: 'name', c: 'ChuckAdmin' },
243+
{ ip: 'description', c: 'A VueJS & ChuckCSS administration' }
244+
]
245+
},
246+
link() {
247+
return [
234248
]
235249
}
236250
},

0 commit comments

Comments
 (0)