topuser
/
nuxt-for-preset
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

bp

new
1549469775 5 years ago
parent
e118c6895e
commit
a2880ffd5b
18 changed files with 540 additions and 151 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 11
      api/auth.js
  2. 11
      assets/style/_global.scss
  3. 0
      assets/style/pc.scss
  4. 5
      components/base/_base-loading.vue
  5. 20
      components/panel/index.vue
  6. 48
      components/panel/style.scss
  7. 12
      layouts/default.vue
  8. 6
      middleware/auth.js
  9. 52
      nuxt.config.js
  10. 256
      package-lock.json
  11. 15
      package.json
  12. 68
      pages/index.vue
  13. 85
      pages/login.vue
  14. 25
      plugins/axios.js
  15. 19
      plugins/global-components.js
  16. 10
      server/index.js
  17. 34
      store/index.js
  18. 14
      store/todos.js

11
api/auth.js
View File

@ -0,0 +1,11 @@
export default function (req, res, next) {
// req 是 Node.js http request 对象
// res.json({code:200})
// res 是 Node.js http response 对象
//next是一个调用下一个中间件的函数
// 如果您的中间件不是最终执行，请不要忘记在最后调用next！
next()
}

11
assets/style/_global.scss
View File

@ -1,13 +1,4 @@
html {
width: 100%;
}
*,
*:before,
*:after {
box-sizing: border-box;
margin: 0;
}
@import "./common.scss"; @import "./common.scss";

0
assets/style/pc.scss
View File

5
components/base/_base-loading.vue
View File

@ -0,0 +1,5 @@
<template>
<div>
dsads
</div>
</template>

20
components/panel/index.vue
View File

@ -1,20 +0,0 @@
<template>
<div class="panel" :style="{'backgroundColor':color?color:'#ffffff'}">
<div class="panel__wrapper layer m-auto">
<h2>{{vtitle}}</h2>
<div class="panel__desc">
<div class="panel__desc__word">{{vdesc}}</div>
</div>
<slot></slot>
</div>
</div>
</template>
<script>
export default {
props: ['vtitle', 'vdesc', 'color'],
}
</script>
<style lang="scss" scoped>
@import "./style.scss";
</style>

48
components/panel/style.scss
View File

@ -1,48 +0,0 @@
.panel {
padding-top: em(59);
padding-bottom: em(59);
text-align: center;
color: #131720;
.panel__wrapper {
overflow: visible;
}
h2 {
font-size: em(36);
margin-bottom: em(15);
}
.panel__desc {
display: flex;
justify-content: center;
.panel__desc__word {
font-size: em(18);
position: relative;
color: #4B4B4B;
&::before {
content: "";
position: absolute;
left: em(-100, 18);
top: 50%;
transform: translateY(-50%);
width: em(83);
height: 2px;
background-color: rgba(181, 181, 181, 1);
}
&::after {
content: "";
position: absolute;
right: em(-100, 18);
top: 50%;
transform: translateY(-50%);
width: em(83, 18);
height: 1px;
background-color: rgba(181, 181, 181, 1);
}
}
}
}

12
layouts/default.vue
View File

@ -1,11 +1,19 @@
<template> <template>
<div class="hq"> <div class="default layout">
<nuxt /> <nuxt />
</div> </div>
</template> </template>
<script> <script>
export default { export default {
components: { components: {
} }
} }
</script> </script>
<style lang="scss" scoped>
.default.layout{
background: #F5F5D5;
width: 100vw;
height: 100vh;
}
</style>

6
middleware/auth.js
View File

@ -0,0 +1,6 @@
export default function ({ store, redirect }) {
// console.log(store.state.user)
// if (JSON.stringify(store.getters.user)=='{}') {
// return redirect('/login')
// }
}

52
nuxt.config.js
View File

@ -7,18 +7,21 @@ module.exports = {
head: { head: {
title: process.env.npm_package_name || '', title: process.env.npm_package_name || '',
meta: [ meta: [
{ charset: 'utf-8' }, {charset: 'utf-8'},
{ name: 'viewport', content: 'width=device-width, initial-scale=1, shrink-to-fit=no' }, {name: 'viewport', content: 'width=device-width, initial-scale=1, shrink-to-fit=no'},
{ hid: 'description', name: 'description', content: process.env.npm_package_description || '' } {hid: 'description', name: 'description', content: process.env.npm_package_description || ''}
], ],
link: [ link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' } {rel: 'icon', type: 'image/x-icon', href: '/favicon.ico'}
] ]
}, },
env: {
baseUrl: process.env.BASE_URL || 'http://localhost:3000'
},
/* /*
** Customize the progress-bar color ** Customize the progress-bar color
*/ */
loading: { color: '#fff' }, loading: {color: '#fff'},
/* /*
** Global CSS ** Global CSS
*/ */
@ -29,19 +32,34 @@ module.exports = {
** Plugins to load before mounting the App ** Plugins to load before mounting the App
*/ */
plugins: [ plugins: [
'~/plugins/axios',
'~/plugins/global-components'
], ],
/* /*
** Nuxt.js dev-modules ** Nuxt.js dev-modules
*/ */
devModules: [ devModules: [],
],
/* /*
** Nuxt.js modules ** Nuxt.js modules
*/ */
modules: [ modules: [
'@nuxtjs/style-resources',
// 使用bootstrap-vue // 使用bootstrap-vue
'bootstrap-vue/nuxt' 'bootstrap-vue/nuxt',
'@nuxtjs/axios'
], ],
//https://axios.nuxtjs.org/setup
axios: {
// proxyHeaders: false
retry: {retries: 3}
},
styleResources: {
// your settings here
sass: [],
scss: ['./assets/style/_global.scss'],
less: [],
stylus: []
},
/* /*
** Build configuration ** Build configuration
*/ */
@ -49,14 +67,14 @@ module.exports = {
/* /*
** You can extend webpack config here ** You can extend webpack config here
*/ */
styleResources:{ extend(config, ctx) {
scss: 'assets/style/_global.scss' config.resolve.alias['@pages'] = path.resolve(__dirname, 'pages');
}, config.resolve.alias['@assets'] = path.resolve(__dirname, 'assets');
extend (config, ctx) { config.resolve.alias['@components'] = path.resolve(__dirname, 'components');
config.resolve.alias['@pages']=path.resolve(__dirname,'pages'); config.resolve.alias['@images'] = path.resolve(__dirname, 'assets', 'images');
config.resolve.alias['@assets']=path.resolve(__dirname,'assets');
config.resolve.alias['@components']=path.resolve(__dirname,'components');
config.resolve.alias['@images']=path.resolve(__dirname,'assets','images');
} }
} },
serverMiddleware: [
'~/api/auth'
]
} }

256
package-lock.json
View File

@ -1131,6 +1131,36 @@
"webpackbar": "^3.2.0" "webpackbar": "^3.2.0"
} }
}, },
"@nuxtjs/axios": {
"version": "5.6.0",
"resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.6.0.tgz",
"integrity": "sha512-Rl4nnudm+sSkMtgfSEAeA5bq6aFpbBoYVXLXWaDxfydslukRd2SdEDdGv0gHE7F/jtIw+JfptWDHCHnzuoO/Ng==",
"requires": {
"@nuxtjs/proxy": "^1.3.3",
"axios": "^0.19.0",
"axios-retry": "^3.1.2",
"consola": "^2.10.1"
}
},
"@nuxtjs/proxy": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/@nuxtjs/proxy/-/proxy-1.3.3.tgz",
"integrity": "sha512-ykpCUdOqPOH79mQG30QfWZmbRD8yjTD+TTSBbwow5GkROUQEtXw+HE+q6i+YFpuChvgJNbwVrXdZ3YmfXbZtTw==",
"requires": {
"consola": "^2.5.6",
"http-proxy-middleware": "^0.19.1"
}
},
"@nuxtjs/style-resources": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@nuxtjs/style-resources/-/style-resources-1.0.0.tgz",
"integrity": "sha512-tDRcC/pm8B0Kpxtzb/1/HOBkv3/kPD+2FiCiUBGMB7YriRud9OUPw1pnYCsAH9ftwpMJS4k4XOyUY8FCTk6OxA==",
"requires": {
"consola": "^2.4.0",
"glob-all": "^3.1.0",
"sass-resources-loader": "^2.0.0"
}
},
"@nuxtjs/youch": { "@nuxtjs/youch": {
"version": "4.2.3", "version": "4.2.3",
"resolved": "https://registry.npmjs.org/@nuxtjs/youch/-/youch-4.2.3.tgz", "resolved": "https://registry.npmjs.org/@nuxtjs/youch/-/youch-4.2.3.tgz",
@ -1763,6 +1793,38 @@
"resolved": "https://registry.npmjs.org/aws4/-/aws4-1.8.0.tgz", "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.8.0.tgz",
"integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==" "integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ=="
}, },
"axios": {
"version": "0.19.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
"integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
"requires": {
"follow-redirects": "1.5.10",
"is-buffer": "^2.0.2"
},
"dependencies": {
"follow-redirects": {
"version": "1.5.10",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"is-buffer": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
"integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A=="
}
}
},
"axios-retry": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/axios-retry/-/axios-retry-3.1.2.tgz",
"integrity": "sha512-+X0mtJ3S0mmia1kTVi1eA3DAC+oWnT2A29g3CpkzcBPMT6vJm+hn/WiV9wPt/KXLHVmg5zev9mWqkPx7bHMovg==",
"requires": {
"is-retry-allowed": "^1.1.0"
}
},
"babel-code-frame": { "babel-code-frame": {
"version": "6.26.0", "version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz", "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@ -2868,6 +2930,25 @@
"parse-json": "^4.0.0" "parse-json": "^4.0.0"
} }
}, },
"crc": {
"version": "3.8.0",
"resolved": "https://registry.npmjs.org/crc/-/crc-3.8.0.tgz",
"integrity": "sha512-iX3mfgcTMIq3ZKLIsVFAbv7+Mc10kxabAGQb8HvjA1o3T1PIYprbakQ65d3I+2HGHt6nSKkM9PYjgoJO2KcFBQ==",
"requires": {
"buffer": "^5.1.0"
},
"dependencies": {
"buffer": {
"version": "5.4.3",
"resolved": "https://registry.npmjs.org/buffer/-/buffer-5.4.3.tgz",
"integrity": "sha512-zvj65TkFeIt3i6aj5bIvJDzjjQQGs4o/sNoezg1F1kYap9Nu2jcUdpwzRSJTHMMzG0H7bZkn4rNQpImhuxWX2A==",
"requires": {
"base64-js": "^1.0.2",
"ieee754": "^1.1.4"
}
}
}
},
"create-ecdh": { "create-ecdh": {
"version": "4.0.3", "version": "4.0.3",
"resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.3.tgz", "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.3.tgz",
@ -3627,6 +3708,11 @@
"resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz", "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
"integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=" "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
}, },
"eventemitter3": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.0.tgz",
"integrity": "sha512-qerSRB0p+UDEssxTtm6EDKcE7W4OaoisfIMl4CngyEhjpYglocpNg6UEqCvemdGhosAsg4sO2dXJOdyBifPGCg=="
},
"events": { "events": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/events/-/events-3.0.0.tgz", "resolved": "https://registry.npmjs.org/events/-/events-3.0.0.tgz",
@ -3995,6 +4081,14 @@
} }
} }
}, },
"follow-redirects": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.9.0.tgz",
"integrity": "sha512-CRcPzsSIbXyVDl0QI01muNDu69S8trU4jArW9LpOt2WtC6LyUJetcIrmfHsRBx7/Jb6GHJUiuqyYxPooFfNt6A==",
"requires": {
"debug": "^3.0.0"
}
},
"for-in": { "for-in": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@ -4238,6 +4332,30 @@
"path-is-absolute": "^1.0.0" "path-is-absolute": "^1.0.0"
} }
}, },
"glob-all": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/glob-all/-/glob-all-3.1.0.tgz",
"integrity": "sha1-iRPd+17hrHgSZWJBsD1SF8ZLAqs=",
"requires": {
"glob": "^7.0.5",
"yargs": "~1.2.6"
},
"dependencies": {
"minimist": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-0.1.0.tgz",
"integrity": "sha1-md9lelJXTCHJBXSX33QnkLK0wN4="
},
"yargs": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-1.2.6.tgz",
"integrity": "sha1-nHtKgv1dWVsr8Xq23MQxNUMv40s=",
"requires": {
"minimist": "^0.1.0"
}
}
}
},
"glob-parent": { "glob-parent": {
"version": "5.0.0", "version": "5.0.0",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.0.0.tgz", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.0.0.tgz",
@ -4643,6 +4761,27 @@
"toidentifier": "1.0.0" "toidentifier": "1.0.0"
} }
}, },
"http-proxy": {
"version": "1.18.0",
"resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.0.tgz",
"integrity": "sha512-84I2iJM/n1d4Hdgc6y2+qY5mDaz2PUVjlg9znE9byl+q0uC3DeByqBGReQu5tpLK0TAqTIXScRUV+dg7+bUPpQ==",
"requires": {
"eventemitter3": "^4.0.0",
"follow-redirects": "^1.0.0",
"requires-port": "^1.0.0"
}
},
"http-proxy-middleware": {
"version": "0.19.1",
"resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.19.1.tgz",
"integrity": "sha512-yHYTgWMQO8VvwNS22eLLloAkvungsKdKTLO8AJlftYIKNfJr3GK3zK0ZCfzDDGUBttdGc8xFy1mCitvNKQtC3Q==",
"requires": {
"http-proxy": "^1.17.0",
"is-glob": "^4.0.0",
"lodash": "^4.17.11",
"micromatch": "^3.1.10"
}
},
"http-signature": { "http-signature": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz", "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
@ -4700,6 +4839,11 @@
"integrity": "sha1-SMptcvbGo68Aqa1K5odr44ieKwk=", "integrity": "sha1-SMptcvbGo68Aqa1K5odr44ieKwk=",
"dev": true "dev": true
}, },
"immediate": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
"integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
},
"import-cwd": { "import-cwd": {
"version": "2.1.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz", "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
@ -4857,6 +5001,11 @@
"ci-info": "^1.5.0" "ci-info": "^1.5.0"
} }
}, },
"is-class-hotfix": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/is-class-hotfix/-/is-class-hotfix-0.0.6.tgz",
"integrity": "sha512-0n+pzCC6ICtVr/WXnN2f03TK/3BfXY7me4cjCAqT8TYXEl0+JBRoqBo94JJHXcyDSLUeWbNX8Fvy5g5RJdAstQ=="
},
"is-color-stop": { "is-color-stop": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/is-color-stop/-/is-color-stop-1.1.0.tgz", "resolved": "https://registry.npmjs.org/is-color-stop/-/is-color-stop-1.1.0.tgz",
@ -5026,8 +5175,7 @@
"is-retry-allowed": { "is-retry-allowed": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz", "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
"integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ=", "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
"dev": true
}, },
"is-stream": { "is-stream": {
"version": "1.1.0", "version": "1.1.0",
@ -5050,6 +5198,16 @@
"has-symbols": "^1.0.0" "has-symbols": "^1.0.0"
} }
}, },
"is-type-of": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/is-type-of/-/is-type-of-1.2.1.tgz",
"integrity": "sha512-uK0kyX9LZYhSDS7H2sVJQJop1UnWPWmo5RvR3q2kFH6AUHYs7sOrVg0b4nyBHw29kRRNFofYN/JbHZDlHiItTA==",
"requires": {
"core-util-is": "^1.0.2",
"is-class-hotfix": "~0.0.6",
"isstream": "~0.1.2"
}
},
"is-typedarray": { "is-typedarray": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz", "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
@ -5251,6 +5409,53 @@
"resolved": "https://registry.npmjs.org/koa-is-json/-/koa-is-json-1.0.0.tgz", "resolved": "https://registry.npmjs.org/koa-is-json/-/koa-is-json-1.0.0.tgz",
"integrity": "sha1-JzwH7c3Ljfaiwat9We52SRRR7BQ=" "integrity": "sha1-JzwH7c3Ljfaiwat9We52SRRR7BQ="
}, },
"koa-router": {
"version": "7.4.0",
"resolved": "https://registry.npmjs.org/koa-router/-/koa-router-7.4.0.tgz",
"integrity": "sha512-IWhaDXeAnfDBEpWS6hkGdZ1ablgr6Q6pGdXCyK38RbzuH4LkUOpPqPw+3f8l8aTDrQmBQ7xJc0bs2yV4dzcO+g==",
"requires": {
"debug": "^3.1.0",
"http-errors": "^1.3.1",
"koa-compose": "^3.0.0",
"methods": "^1.0.1",
"path-to-regexp": "^1.1.1",
"urijs": "^1.19.0"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"koa-compose": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/koa-compose/-/koa-compose-3.2.1.tgz",
"integrity": "sha1-qFzLQLfZhtjlo0Wzoazo6rz1Tec=",
"requires": {
"any-promise": "^1.1.0"
}
},
"path-to-regexp": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
"integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
"requires": {
"isarray": "0.0.1"
}
}
}
},
"koa-session": {
"version": "5.12.3",
"resolved": "https://registry.npmjs.org/koa-session/-/koa-session-5.12.3.tgz",
"integrity": "sha512-r1vRerk6z+J54TtgXPG+oYGj1vwrd889bz55hS7VykWvbtmPNb0q/N7arOHGV8dnstlRyZPP3xCJL20wIf9LwA==",
"requires": {
"crc": "^3.4.4",
"debug": "^3.1.0",
"is-type-of": "^1.0.0",
"uuid": "^3.3.2"
}
},
"last-call-webpack-plugin": { "last-call-webpack-plugin": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz", "resolved": "https://registry.npmjs.org/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz",
@ -5294,6 +5499,14 @@
"invert-kv": "^1.0.0" "invert-kv": "^1.0.0"
} }
}, },
"lie": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz",
"integrity": "sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=",
"requires": {
"immediate": "~3.0.5"
}
},
"load-json-file": { "load-json-file": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
@ -5346,6 +5559,14 @@
} }
} }
}, },
"localforage": {
"version": "1.7.3",
"resolved": "https://registry.npmjs.org/localforage/-/localforage-1.7.3.tgz",
"integrity": "sha512-1TulyYfc4udS7ECSBT2vwJksWbkwwTX8BzeUIiq8Y07Riy7bDAAnxDaPU/tWyOVmQAcWJIEIFP9lPfBGqVoPgQ==",
"requires": {
"lie": "3.1.1"
}
},
"locate-path": { "locate-path": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
@ -8618,6 +8839,11 @@
"resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz", "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
"integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=" "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
}, },
"requires-port": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
"integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
},
"reset-css": { "reset-css": {
"version": "4.0.1", "version": "4.0.1",
"resolved": "https://registry.npmjs.org/reset-css/-/reset-css-4.0.1.tgz", "resolved": "https://registry.npmjs.org/reset-css/-/reset-css-4.0.1.tgz",
@ -8976,6 +9202,11 @@
"jsonify": "~0.0.0" "jsonify": "~0.0.0"
} }
}, },
"shvl": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/shvl/-/shvl-1.3.1.tgz",
"integrity": "sha512-+rRPP46hloYUAEImJcqprUgXu+05Ikqr4h4V+w5i2zJy37nAqtkQKufs3+3S2fDq6JNRrHMIQhB/Vaex+jgAAw=="
},
"signal-exit": { "signal-exit": {
"version": "3.0.2", "version": "3.0.2",
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
@ -10140,6 +10371,11 @@
"punycode": "^2.1.0" "punycode": "^2.1.0"
} }
}, },
"urijs": {
"version": "1.19.1",
"resolved": "https://registry.npmjs.org/urijs/-/urijs-1.19.1.tgz",
"integrity": "sha512-xVrGVi94ueCJNrBSTjWqjvtgvl3cyOTThp2zaMaFNGp3F542TR6sM3f2o8RqZl+AwteClSVmoCyt0ka4RjQOQg=="
},
"urix": { "urix": {
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz", "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
@ -10398,6 +10634,22 @@
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.1.tgz", "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.1.tgz",
"integrity": "sha512-ER5moSbLZuNSMBFnEBVGhQ1uCBNJslH9W/Dw2W7GZN23UQA69uapP5GTT9Vm8Trc0PzBSVt6LzF3hGjmv41xcg==" "integrity": "sha512-ER5moSbLZuNSMBFnEBVGhQ1uCBNJslH9W/Dw2W7GZN23UQA69uapP5GTT9Vm8Trc0PzBSVt6LzF3hGjmv41xcg=="
}, },
"vuex-persistedstate": {
"version": "2.5.4",
"resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-2.5.4.tgz",
"integrity": "sha512-XYJhKIwO+ZVlTaXyxKxnplrJ88Fnvk5aDw753bxzRw5/yMKLQ6lq9CDCBex2fwZaQcLibhtgJOxGCHjy9GLSlQ==",
"requires": {
"deepmerge": "^2.1.0",
"shvl": "^1.3.0"
},
"dependencies": {
"deepmerge": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
"integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA=="
}
}
},
"watchpack": { "watchpack": {
"version": "1.6.0", "version": "1.6.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",

15
package.json
View File

@ -11,20 +11,33 @@
"generate": "nuxt generate" "generate": "nuxt generate"
}, },
"dependencies": { "dependencies": {
"@nuxtjs/axios": "^5.6.0",
"@nuxtjs/style-resources": "^1.0.0",
"autoprefixer": "^9.6.1", "autoprefixer": "^9.6.1",
"bootstrap-vue": "^2.0.0-rc.27", "bootstrap-vue": "^2.0.0-rc.27",
"cross-env": "^5.2.0", "cross-env": "^5.2.0",
"jquery": "^3.4.1", "jquery": "^3.4.1",
"koa": "^2.6.2", "koa": "^2.6.2",
"koa-router": "^7.4.0",
"koa-session": "^5.12.3",
"localforage": "^1.7.3",
"lodash": "^4.17.15",
"node-sass": "^4.12.0", "node-sass": "^4.12.0",
"nuxt": "^2.0.0", "nuxt": "^2.0.0",
"postcss": "^7.0.17", "postcss": "^7.0.17",
"postcss-loader": "^3.0.0", "postcss-loader": "^3.0.0",
"reset-css": "^4.0.1", "reset-css": "^4.0.1",
"sass-loader": "^7.2.0", "sass-loader": "^7.2.0",
"sass-resources-loader": "^2.0.1" "sass-resources-loader": "^2.0.1",
"vuex-persistedstate": "^2.5.4"
}, },
"devDependencies": { "devDependencies": {
"nodemon": "^1.18.9" "nodemon": "^1.18.9"
},
"config": {
"nuxt": {
"host": "0.0.0.0",
"port": "5000"
}
} }
} }

68
pages/index.vue
View File

@ -1,63 +1,47 @@
<template> <template>
<b-container fluid> <b-container>
{{ip}}
<b-row> <b-row>
<b-col sm='4'>1 of 2</b-col> <b-col md="4" sm="2">1 of 3</b-col>
<b-col sm='2'>2 of 2</b-col> <b-col md="4" sm="2">2 of 3</b-col>
<b-col md="4" sm="8">3 of 3</b-col>
</b-row> </b-row>
<b-alert show>Default Alert</b-alert>
<b-alert variant="success" show>Success Alert</b-alert>
<b-alert v-model="showDismissibleAlert" variant="danger" dismissible>
Dismissible Alert!
</b-alert>
<img src="~@images/bluedialog.png" alt="">
<b-alert
:show="dismissCountDown"
dismissible
variant="warning"
@dismissed="dismissCountDown=0"
@dismiss-count-down="countDownChanged"
>
<p>This alert will dismiss after {{ dismissCountDown }} seconds...</p>
<b-progress
variant="warning"
:max="dismissSecs"
:value="dismissCountDown"
height="4px"
></b-progress>
</b-alert>
<b-button @click="showAlert" variant="info" class="m-1">
Show alert with count-down timer
</b-button>
<b-button @click="showDismissibleAlert=true" variant="info" class="m-1">
Show dismissible alert ({{ showDismissibleAlert ? 'visible' : 'hidden' }})
</b-button>
</b-container> </b-container>
</template> </template>
<script> <script>
export default { export default {
middleware: 'auth',
//用于请求数据，返回的数据会作用在data上
async asyncData({ $axios }) {
const ip = await $axios.$get('http://icanhazip.com');
return { ip }
},
//无法在内部使用this获取组件实例
//fetch 方法用于在渲染页面前填充应用的状态树（store）数据
//与 asyncData 方法类似，不同的是它不会设置组件的数据。
async fetch ({ store, params,$axios }) {
let ip = await $axios.$get('http://icanhazip.com')
store.commit('todos/SET_IP', ip)
},
mounted(){
console.log(this.$store)
},
data() { data() {
return { return {
dismissSecs: 10, ip: '0.0.0.0'
dismissCountDown: 0,
showDismissibleAlert: false
} }
}, },
methods: { methods: {
countDownChanged(dismissCountDown) { async fetchSomething() {
this.dismissCountDown = dismissCountDown const ip = await this.$axios.$get('http://icanhazip.com');
}, this.ip = ip
showAlert() {
this.dismissCountDown = this.dismissSecs
} }
} }
} }
</script> </script>
<style lang='scss'> <style lang='scss'>
@import "./style.scss"; @import "style";
</style> </style>

85
pages/login.vue
View File

@ -0,0 +1,85 @@
<template>
<b-container fluid>
<div class="panel">
<form class="vform">
<b-img src="https://picsum.photos/125/125/?image=58" center rounded fluid alt="Center image"
style="margin-bottom: 20px;"></b-img>
<div class="vinput">
<div class="vtitle">
<span class="title">账号</span>
<span class="subtitle">(账号|邮箱|手机)</span>
</div>
<b-form-input class="input" type="text" v-model="account" placeholder="请输入您的账号"></b-form-input>
<div class="vtitle">
<span class="title">密码</span>
<span class="subtitle">(文字+数字)</span>
</div>
<b-form-input class="input" type="password" v-model="password" placeholder="请输入您的密码"></b-form-input>
</div>
<b-button block variant="primary" @click="login">
<div v-if="isLoging" class="loading">
<BaseLoading></BaseLoading>
</div>
<div v-if="!isLoging">登录</div>
</b-button>
</form>
</div>
</b-container>
</template>
<script>
export default {
data() {
return {
isLoging:false,
account: '',
password:'',
error:''
}
},
methods:{
login(){
this.$router.replace('/')
console.log(this)
this.isLoging = !this.isLoging
}
}
}
</script>
<style lang='scss' scoped>
.panel {
background: #fff;
width: 500px;
/*height: 500px;*/
border-radius: 2%;
box-sizing: content-box;
position: fixed;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
text-align: left;
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
@media only screen and (max-width: 767px) {
width: 90%;
}
.vform {
margin: 50px auto;
width: 80%;
.input {
margin: 20px 0;
}
}
.vtitle {
.title {
font-size: 20px;
font-weight: bold;
}
.subtitle {
font-size: 12px;
color: rgba(0, 0, 0, 0.44);
}
}
}
</style>

25
plugins/axios.js
View File

@ -0,0 +1,25 @@
// onRequest(config)
// onResponse(response)
// onError(err)
// onRequestError(err)
// onResponseError(err)
export default function ({ $axios,store, redirect }) {
// store.commit('user/setToken','dasdsad')
let token = store.state.user.token;
$axios.setToken(token, 'Bearer')
$axios.setHeader('Content-Type', 'application/json')
$axios.onRequest(config => {
console.log('Making request to ' + config.url)
})
$axios.onError(error => {
const code = parseInt(error.response && error.response.status)
if (code === 400) {
redirect('/400')
}
})
}

19
plugins/global-components.js
View File

@ -0,0 +1,19 @@
// 引入vue 及 lodash
import Vue from 'vue'
import upperFirst from 'lodash/upperFirst' // 首字线大写
import camelCase from 'lodash/camelCase' // 驼峰命名大法
// 把 /component/base/ 下的所有 vue 组件 require 进来
// path: 要引入的组件所在相对路径（相对于当前文件）
// deep: 是否检索子文件夹
// matchFile: 匹配的文件名称
// require.context(path, deep, matchFile)
const requireComponent = require.context('../components/base/', false, /_base-[\w-]+\.vue$/)
// 遍历 require 进来的组件并注册
requireComponent.keys().forEach((fileName) => {
const componentConfig = requireComponent(fileName)
const componentName = upperFirst( camelCase( fileName.replace(/^\.\/_/, '').replace(/\.\w+$/, '') ) )
// 全局注册组件
Vue.component(componentName, componentConfig.default || componentConfig)
})

10
server/index.js
View File

@ -25,11 +25,11 @@ async function start () {
await nuxt.ready() await nuxt.ready()
} }
app.use((ctx) => { app.use(async (ctx,next) => {
ctx.status = 200 ctx.status = 200
ctx.respond = false // Bypass Koa's built-in response handling ctx.respond = false // Bypass Koa's built-in response handling
ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash
nuxt.render(ctx.req, ctx.res) nuxt.render(ctx.req, ctx.res)
}) })
app.listen(port, host) app.listen(port, host)

34
store/index.js
View File

@ -1,9 +1,37 @@
import createPersistedState from 'vuex-persistedstate'
// import localforage from 'localforage'
// export const plugins = [ createPersistedState({
// key:'fuckme',
// storage:localforage,
// paths: ['user.token'] //,'room.room'
// }) ]
export const state = () => ({ export const state = () => ({
counter: 0 user: {}
}) })
export const getters = {
user(state){
return state.user;
}
}
export const mutations = { export const mutations = {
increment(state) { SET_USER (state,user) {
state.counter++ state.user=user;
} }
} }
export const actions = {
nuxtServerInit({ commit }, { req, res }) {
if (req.session && req.session.user) {
const { username, password } = req.session.user
const user = {
username,
password
}
commit('SET_USER', user)
}
},
}

14
store/todos.js
View File

@ -1,5 +1,6 @@
export const state = () => ({ export const state = () => ({
list: [] list: [],
ip:''
}) })
export const mutations = { export const mutations = {
@ -16,5 +17,16 @@ export const mutations = {
}, },
toggle(state, todo) { toggle(state, todo) {
todo.done = !todo.done todo.done = !todo.done
},
SET_IP(state, ip) {
state.ip = ip
} }
} }
export const actions={
async getIP ({ commit }) {
const ip = await this.$axios.$get('http://icanhazip.com')
commit('SET_IP', ip)
}
}

Write Preview
Loading…
Cancel
Save