Commit 29340646 by cw

adminDemo

parents
{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime"],
"env": {
"test": {
"presets": ["env", "stage-2"]
}
}
}
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
/build/
/config/
/dist/
/*.js
/test/unit/coverage/
// https://eslint.org/docs/user-guide/configuring
module.exports = {
root: true,
parserOptions: {
parser: 'babel-eslint'
},
env: {
browser: true,
},
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
extends: ['plugin:vue/essential'],
// required to lint *.vue files
plugins: [
'vue'
],
// add your custom rules here
rules: {
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
}
}
.DS_Store
node_modules/
/dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
/test/unit/coverage/
/test/e2e/reports/
selenium-debug.log
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
// https://github.com/michael-ciniawsky/postcss-load-config
module.exports = {
"plugins": {
"postcss-import": {},
"postcss-url": {},
// to edit target browsers: use "browserslist" field in package.json
"autoprefixer": {}
}
}
# admin
> A Vue.js project
## Build Setup
``` bash
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
# run unit tests
npm run unit
# run e2e tests
npm run e2e
# run all tests
npm test
```
For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"'
})
'use strict'
// Template version: 1.3.1
// see http://vuejs-templates.github.io/webpack for documentation.
const path = require('path')
module.exports = {
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
// Various Dev Server settings
host: 'localhost', // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
// Use Eslint Loader?
// If true, your code will be linted during bundling and
// linting errors and warnings will be shown in the console.
useEslint: true,
// If true, eslint errors and warnings will also be shown in the error overlay
// in the browser.
showEslintErrorsInOverlay: false,
/**
* Source Maps
*/
// https://webpack.js.org/configuration/devtool/#development
devtool: 'cheap-module-eval-source-map',
// If you have problems debugging vue-files in devtools,
// set this to false - it *may* help
// https://vue-loader.vuejs.org/en/options.html#cachebusting
cacheBusting: true,
cssSourceMap: true
},
build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: '/',
/**
* Source Maps
*/
productionSourceMap: true,
// https://webpack.js.org/configuration/devtool/#production
devtool: '#source-map',
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
// Before setting to `true`, make sure to:
// npm install --save-dev compression-webpack-plugin
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
// Run the build command with an extra argument to
// View the bundle analyzer report after build finishes:
// `npm run build --report`
// Set to `true` or `false` to always turn it on or off
bundleAnalyzerReport: process.env.npm_config_report
}
}
'use strict'
module.exports = {
NODE_ENV: '"production"'
}
'use strict'
const merge = require('webpack-merge')
const devEnv = require('./dev.env')
module.exports = merge(devEnv, {
NODE_ENV: '"testing"'
})
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>admin</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "admin",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "1510017964@qq.com",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"e2e": "node test/e2e/runner.js",
"test": "npm run unit && npm run e2e",
"lint": "eslint --ext .js,.vue src test/unit test/e2e/specs",
"build": "node build/build.js"
},
"dependencies": {
"axios": "^0.19.2",
"view-design": "^4.1.3",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-eslint": "^8.2.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"babel-register": "^6.22.0",
"chalk": "^2.0.1",
"chromedriver": "^2.27.2",
"copy-webpack-plugin": "^4.0.1",
"cross-spawn": "^5.0.1",
"css-loader": "^0.28.0",
"eslint": "^4.15.0",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^1.7.1",
"eslint-plugin-vue": "^4.0.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"nightwatch": "^0.9.12",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.13",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"selenium-server": "^3.0.1",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8",
"vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</style>
/*包含n个请求函数的模块
* 函数的返回值:promise
* 第一个参数(url),第二个参数(post/get)--字符串*/
import http from './http'
/**
* 基础请求
* @param url 请求路径
* @param params 请求参数
* @param method 请求方式: POST(默认)、GET
* */
export const sendRequest = (url, params, method) => {
return new Promise((resolve, reject) => {
//调用请求方法
http({
url: url,
data: params || {},
method: method || 'POST'
}).then(res => {
// if (res.status === 200) {
// if (res.data.success) {
// resolve(res.data)
// } else {
// reject(JSON.stringify(res.data))
// }
// }
console.log(res.data.code)
if(res.data.code==200){
console.log("进入这里了")
resolve(res.data)
}else {
reject(res)
}
}).catch(err => {
reject(err)
})
})
} //post
/**
* 发送GET请求, 获取图片流
* */
export const getImgStream = (url, params) => {
return new Promise((resolve, reject) => {
//调用请求方法
http.get(url, {params: params, responseType: 'blob'}).then(res => {
if (res.status === 200) {
resolve(res)
} else {
reject(res)
}
}).catch(err => {
reject(err)
})
})
}
/**
* 发送POST请求,获取Excel文件流
* */
export const sendPostExcelStream = (url, params) => {
return new Promise((resolve, reject) => {
//调用请求方法
http.post(url, params,{responseType: 'blob'}).then(res => {
if (res.status === 200) {
var blob = res.data
var reader = new FileReader()
reader.readAsDataURL(blob) // 转换为base64,可以直接放入a表情href
reader.onload = function (e) {
// 转换完成,创建一个a标签用于下载
var a = document.createElement('a')
a.download = params.getStreamPage
a.href = e.target.result
a.click()
}
}
resolve(res)
}).catch(err => {
reject(err)
})
})
}
/**
* 文件上传
* */
export const fileUpload = (url, params) => {
return new Promise((resolve, reject) => {
let formData = new FormData()
for (let i in params) {
formData.append(i, params[i])
}
http.post(url, formData).then(res => {
if (res.status === 200) {
if (res.data.success) {
resolve(res.data)
} else {
reject(res)
}
} else {
reject(res)
}
}).catch(err => {
reject(err)
})
})
}
import axios from 'axios'
// import { Message } from 'ViewUI'
//import store from '../../store/index'
import router from '../../router/index' //引入路由(接口拦截操作)
//所有请求的携带的参数设置
const http = axios.create({
baseURL: '', // 地址
timeout: 30000
})
//设置拦截器
http.interceptors.request.use(function (config) {
//过滤字段
for (let item in config.data) {
//过滤清除空格(如果是字符串就过滤)
if (typeof config.data[item] === 'string') config.data[item].replace(/ /g, '')
//过滤清除为空的属性
if (config.data[item] === '') delete config.data[`${item}`]
}
//发送请求先要做的事情
config.headers = {
'content-type': 'application/json',
// 'x-admin-token': store.getters.getToken
}
//表格loading状态
//store.state.loading = true
return config
}, function (error) {
return Promise.reject(error)
})
http.interceptors.response.use(res => {
//取消表格loading状态
//store.state.loading = false
//回调成功(success = false)
if (!res.data.success) {
if (res.request.responseType !== 'blob') {
// Message.error({
// content: res.data.errMsg,
// duration: 3
// })
}
if (res.data.errCode === 401) {
setTimeout(() => { router.replace('/login') }, 500)
}
}
//对响应数据成功回调时的处理
return res
}, err => {
//对响应数据error处理
//store.state.loading = false
// Message.error({
// content: '网络请求超时,请重新请求网络!',
// duration: 3
// })
return Promise.reject(err)
})
export default http
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
<ul>
<li>
<a
href="https://vuejs.org"
target="_blank"
>
Core Docs
</a>
</li>
<li>
<a
href="https://forum.vuejs.org"
target="_blank"
>
Forum
</a>
</li>
<li>
<a
href="https://chat.vuejs.org"
target="_blank"
>
Community Chat
</a>
</li>
<li>
<a
href="https://twitter.com/vuejs"
target="_blank"
>
Twitter
</a>
</li>
<br>
<li>
<a
href="http://vuejs-templates.github.io/webpack/"
target="_blank"
>
Docs for This Template
</a>
</li>
</ul>
<h2>Ecosystem</h2>
<ul>
<li>
<a
href="http://router.vuejs.org/"
target="_blank"
>
vue-router
</a>
</li>
<li>
<a
href="http://vuex.vuejs.org/"
target="_blank"
>
vuex
</a>
</li>
<li>
<a
href="http://vue-loader.vuejs.org/"
target="_blank"
>
vue-loader
</a>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
>
awesome-vue
</a>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import ViewUI from 'view-design';
import 'view-design/dist/styles/iview.css';
Vue.config.productionTip = false
Vue.use(ViewUI);
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld' //初始页
import Main from '@/view/Main.vue' //导航页面
import login from "@/view/login/login.vue" //登录页
import userList from "@/view/user/list.vue" //列表
Vue.use(Router)
export default new Router({
routes: [{
path: '/',
name: 'main',
component: Main,
children: [{
path: '/list',
name: "userList",
component: userList,
}
]
},{
path: '/login',
name: "login",
component: login,
}]
})
const menu = [{
title: "会员管理",
icon: 'ios-people',
children: [{
title: '会员列表',
path: '/list',
action: 'member-page'
},
{
title: '登录',
path: '/login',
action: 'member-page'
}
]
},
{
title: "会员管理1",
icon: 'ios-people',
children: [{
title: '会员列表1',
path: '/user/list',
action: 'member-page'
}]
},
{
title: "会员管理2",
icon: 'ios-people',
children: [{
title: '会员列表2',
path: '/user/list',
action: 'member-page'
}]
},
{
title: "会员管理3",
icon: 'ios-people',
children: [{
title: '会员列表3',
path: '/user/list',
action: 'member-page'
}]
}
]
export default menu
<template>
<div class="layout">
<Sider :style="{position: 'fixed', height: '100vh', left: 0, overflow: 'auto'}">
<Menu active-name="1-2" theme="dark" width="auto" :open-names="['1']">
<Submenu :name="index" v-for="(item,index) in menu" :key="index">
<template slot="title">
<Icon :type="item.icon"></Icon>
{{item.title}}
</template>
<MenuItem :name="`${index}-${i}`" v-for="(v,i) in item.children" :key="i" :to="v.path" @click.native="onSelect(index,i)">
{{v.title}}
</MenuItem>
</Submenu>
</Menu>
</Sider>
<Layout :style="{marginLeft: '200px'}">
<Header :style="{background: '#fff', boxShadow: '0 2px 3px 2px rgba(0,0,0,.1)'}">
<Row type="flex" justify="end" align="middle">
<div class="name">name</div>
<Button type="error">退出登录</Button>
</Row>
</Header>
<Content :style="{padding: '0 16px 16px'}">
<Breadcrumb :style="{margin: '16px 0'}">
<BreadcrumbItem>{{menu[menuIndex].title}}</BreadcrumbItem>
<BreadcrumbItem>{{menu[menuIndex].children[menuChildren].title}}</BreadcrumbItem>
</Breadcrumb>
<div style="height:750px">
<router-view/>
</div>
</Content>
</Layout>
</div>
</template>
<script>
import menus from "../router/menu.js"
export default {
data() {
return {
menu:menus,
menuIndex:0,
menuChildren:0,
type:0
}
},
created() {
// setTimeout(()=>{
// this.$router.push('/login')
// },5000)
},
methods:{
onSelect(index,i){
this.menuIndex = index
this.menuChildren = i
}
}
}
</script>
<style scoped>
.layout {
border: 1px solid #d7dde4;
background: #f5f7f9;
position: relative;
border-radius: 4px;
overflow: hidden;
}
.layout-header-bar {
background: #fff;
box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
}
.name {
margin-right: 30px;
}
</style>
<template>
<div>
<div>
list
</div>
</div>
</template>
<script>
export default {
data(){
return {
test:"我是登录页"
}
},
methods:{
}
}
</script>
<style>
</style>
<template>
<Card >
<Table border :columns="columns" :data="list"></Table>
</Card >
</template>
<script>
import {
sendRequest,
getImgStream,
fileUpload
} from '../../commons/http/api'
export default {
data() {
return {
list: [],
columns: [
{
title: '内容',
key: 'text'
},
{
title:"作者ID",
key:"uid"
},
{
title: '作者',
key: 'name'
},
{
title: '时间',
key: 'passtime'
},
],
}
},
created() {
this.getList()
},
methods: {
//示例
getList() {
sendRequest('https://api.apiopen.top/getJoke?page=1&count=5&type=text').then(res => {
console.log("POST请求")
this.list = res.result
}).catch(err => {
console.log(err)
})
}
}
}
</script>
<style>
img{
width: 100px;
height:200px;
}
</style>
// A custom Nightwatch assertion.
// The assertion name is the filename.
// Example usage:
//
// browser.assert.elementCount(selector, count)
//
// For more information on custom assertions see:
// http://nightwatchjs.org/guide#writing-custom-assertions
exports.assertion = function (selector, count) {
this.message = 'Testing if element <' + selector + '> has count: ' + count
this.expected = count
this.pass = function (val) {
return val === this.expected
}
this.value = function (res) {
return res.value
}
this.command = function (cb) {
var self = this
return this.api.execute(function (selector) {
return document.querySelectorAll(selector).length
}, [selector], function (res) {
cb.call(self, res)
})
}
}
require('babel-register')
var config = require('../../config')
// http://nightwatchjs.org/gettingstarted#settings-file
module.exports = {
src_folders: ['test/e2e/specs'],
output_folder: 'test/e2e/reports',
custom_assertions_path: ['test/e2e/custom-assertions'],
selenium: {
start_process: true,
server_path: require('selenium-server').path,
host: '127.0.0.1',
port: 4444,
cli_args: {
'webdriver.chrome.driver': require('chromedriver').path
}
},
test_settings: {
default: {
selenium_port: 4444,
selenium_host: 'localhost',
silent: true,
globals: {
devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
}
},
chrome: {
desiredCapabilities: {
browserName: 'chrome',
javascriptEnabled: true,
acceptSslCerts: true
}
},
firefox: {
desiredCapabilities: {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true
}
}
}
}
// 1. start the dev server using production config
process.env.NODE_ENV = 'testing'
const webpack = require('webpack')
const DevServer = require('webpack-dev-server')
const webpackConfig = require('../../build/webpack.prod.conf')
const devConfigPromise = require('../../build/webpack.dev.conf')
let server
devConfigPromise.then(devConfig => {
const devServerOptions = devConfig.devServer
const compiler = webpack(webpackConfig)
server = new DevServer(compiler, devServerOptions)
const port = devServerOptions.port
const host = devServerOptions.host
return server.listen(port, host)
})
.then(() => {
// 2. run the nightwatch test suite against it
// to run in additional browsers:
// 1. add an entry in test/e2e/nightwatch.conf.js under "test_settings"
// 2. add it to the --env flag below
// or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
// For more information on Nightwatch's config file, see
// http://nightwatchjs.org/guide#settings-file
let opts = process.argv.slice(2)
if (opts.indexOf('--config') === -1) {
opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
}
if (opts.indexOf('--env') === -1) {
opts = opts.concat(['--env', 'chrome'])
}
const spawn = require('cross-spawn')
const runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' })
runner.on('exit', function (code) {
server.close()
process.exit(code)
})
runner.on('error', function (err) {
server.close()
throw err
})
})
// For authoring Nightwatch tests, see
// http://nightwatchjs.org/guide#usage
module.exports = {
'default e2e tests': function (browser) {
// automatically uses dev Server port from /config.index.js
// default: http://localhost:8080
// see nightwatch.conf.js
const devServer = browser.globals.devServerURL
browser
.url(devServer)
.waitForElementVisible('#app', 5000)
.assert.elementPresent('.hello')
.assert.containsText('h1', 'Welcome to Your Vue.js App')
.assert.elementCount('img', 1)
.end()
}
}
{
"env": {
},
"globals": {
}
}
import Vue from 'vue'
import HelloWorld from '@/components/HelloWorld'
describe('HelloWorld.vue', () => {
it('should render correct contents', () => {
const Constructor = Vue.extend(HelloWorld)
const vm = new Constructor().$mount()
expect(vm.$el.querySelector('.hello h1').textContent)
})
})
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