theluyuan/javavue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: theluyuan:master
Branches Tags
theluyuan:master
..
compare: theluyuan:706e69fd7749d846bf03cd2559507bf966960b69
Branches Tags
theluyuan:master

No commits in common. "master" and "706e69fd7749d846bf03cd2559507bf966960b69" have entirely different histories.
master ... 706e69fd77

11 changed files with 32 additions and 469 deletions
Show Stats Expand all files Collapse all files

8
README.md
View File

@ -2,22 +2,22 @@
## Project setup ## Project setup
``` ```
npm install yarn install
``` ```
### Compiles and hot-reloads for development ### Compiles and hot-reloads for development
``` ```
npm run serve yarn serve
``` ```
### Compiles and minifies for production ### Compiles and minifies for production
``` ```
npm run build yarn build
``` ```
### Lints and fixes files ### Lints and fixes files
``` ```
npm run lint yarn lint
``` ```
### Customize configuration ### Customize configuration

41
src/App.vue
View File

@ -1,41 +1,10 @@
<template> <template>
<div id="app"> <div id="app">
<router-view />
</div> <router-view/>
</div>
</template> </template>
<style> <style>
</style>
<script> </style>
export default {
mounted() {
const token = localStorage.getItem("token");
console.log(token);
if (token) {
this.axios
.get("/getuserinfo", {
params: {
token: localStorage.getItem("token"),
},
})
.then((res) => {
console.log("jiekouqingqiuwan")
if (res.data.data.length == 0) {
localStorage.removeItem("token");
this.$router.push("/login");
} else {
const a = {
user: res.data.data[0].user,
token: res.data.data.num_key,
};
this.$store.commit("setuserinfo", a);
}
// 验证这个用户
// 不对 remove token 跳转到登录
// 对 不做什么
});
}
},
};
</script>

BIN
src/assets/1.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 328 KiB

2
src/main.js
View File

@ -5,7 +5,7 @@ import store from './store'
import "./element-ui.js" import "./element-ui.js"
import axios from "axios" import axios from "axios"
Vue.config.productionTip = false Vue.config.productionTip = false
axios.defaults.baseURL = 'http://127.0.0.1:3003'; axios.defaults.baseURL = 'http://127.0.0.1:3002';
Vue.prototype.axios = axios Vue.prototype.axios = axios
new Vue({ new Vue({
router, router,

35
src/router/index.js
View File

@ -1,13 +1,13 @@
import Vue from 'vue' import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
import Home from '../views/Home.vue' import Home from '../views/Home.vue'
import store from "../store/index.js"
Vue.use(VueRouter) Vue.use(VueRouter)
const routes = [ const routes = [
{ {
path: '/', path: '/',
name: 'Home',
component: Home component: Home
}, },
{ {
@ -21,30 +21,9 @@ const routes = [
{ {
path:"/login", path:"/login",
component: ()=> import("@/views/Login.vue") component: ()=> import("@/views/Login.vue")
},
{
path:"/nav",
component: ()=>import("@/views/DaoHang.vue"),
children:[
{
path:"list",
component: ()=> import("@/views/List.vue")
},
{
path:"addstu",
component:()=>import("@/views/AddSTu.vue")
},
{
path:"stulist",
component:()=>import("@/views/StuList.vue")
},
]
} }
] ]
const router = new VueRouter({ const router = new VueRouter({
mode: 'history', mode: 'history',
base: process.env.BASE_URL, base: process.env.BASE_URL,
@ -52,17 +31,5 @@ const router = new VueRouter({
}) })
router.beforeEach((to,from,next)=>{
console.log(store.state.userinfo,"vuex");
if(store.state.userinfo.token !="" || localStorage.getItem("token")){
next()
}else if(to.path == "/login"){
next()
}else{
next("/login")
}
})
export default router export default router

37
src/store/index.js
View File

@ -1,51 +1,18 @@
import Vue from 'vue' import Vue from 'vue'
import Vuex from 'vuex' import Vuex from 'vuex'
import { Message } from 'element-ui';
Vue.use(Vuex) Vue.use(Vuex)
import axios from "axios"
import router from "../router/index.js"
export default new Vuex.Store({ export default new Vuex.Store({
state: { state: {
count: 1, count: 1
userinfo:{
token: "",
username: ""
}
}, },
mutations: { mutations: {
add(state){ add(state){
state.count++ state.count++
},
setuserinfo(state,a){
state.userinfo = a
} }
}, },
actions: { actions: {
getuserinfo(context,info){
console.log(info)
axios
.get("/login", {
params: {
pwd: info.pwd,
user: info.user,
},
})
.then((res) => {
console.log(res.data);
if (res.data.code == 500) {
Message.error(res.data.msg);
}else{
Message({
message: "登录成功",
type: "success",
});
localStorage.setItem("token",res.data.data.num_key)
context.commit("setuserinfo",res.data.data)
router.push("/nav")
}
});
}
}, },
modules: { modules: {
} }

89
src/views/AddSTu.vue
View File

@ -1,89 +0,0 @@
<template>
<div class="back">
<!-- {{ $store.state.userinfo }} -->
<div class="box">
<div>
<p>学生名：</p>
<el-input v-model="user" placeholder="请输入用户名"></el-input>
</div>
<div>
<p>密码：</p>
<el-input
v-model="pwd"
show-password
placeholder="请输入密码"
></el-input>
</div>
<div class="button">
<el-button @click="register" type="primary">添加</el-button>
</div>
</div>
</div>
</template>
<style scoped>
.back {
background-image: url("../assets/1.jpg");
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-size: cover;
}
.box {
width: 400px;
height: 200px;
background-color: #fff;
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
border-radius: 10px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
}
.box > div {
width: 80%;
display: flex;
align-items: center;
}
.box > div > p {
flex-shrink: 0;
width: 80px;
}
.button {
display: flex;
justify-content: flex-end;
}
</style>
<script>
export default {
data() {
return {
user: "",
pwd: "",
};
},
methods: {
register() {
this.axios
.get("/addstu", {
params: {
pwd: this.pwd,
user: this.user,
},
})
.then((res) => {
console.log(res.data);
if (res.data.code == 1) {
this.$message.error("添加失败");
} else {
this.$message({
message: "添加成功",
type: "success",
});
}
});
},
},
};
</script>

55
src/views/DaoHang.vue
View File

@ -1,55 +0,0 @@
<template>
<div class="box">
<div>
<el-menu
default-active="2"
class="el-menu-vertical-demo"
@select="nav"
>
<el-menu-item index="list">
<i class="el-icon-menu"></i>
<span slot="title">用户列表</span>
</el-menu-item>
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span>学生管理</span>
</template>
<el-menu-item index="stulist">学生列表</el-menu-item>
<el-menu-item index="addstu">添加学生</el-menu-item>
</el-submenu>
</el-menu>
</div>
<div>
<router-view></router-view>
</div>
</div>
</template>
<style scoped>
.box {
display: flex;
width: 100vw;
height: 100vh;
}
.box > div:first-child {
width: 200px;
height: 100%;
flex-shrink: 0;
}
.box > div:last-child{
width: 100%;
}
</style>
<script>
export default {
methods:{
nav(index){
console.log(index)
this.$router.push("/nav/" + index)
}
}
};
</script>

107
src/views/List.vue
View File

@ -1,107 +0,0 @@
<template>
<div class="box">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="num_key" label="ID" width="180">
</el-table-column>
<el-table-column prop="user" label="用户名" width="180">
</el-table-column>
<el-table-column width="180" prop="pwd" label="密码">
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" @click="del(scope.row.num_key)"
>删除</el-button
>
<el-button size="mini" @click="up(scope.row.num_key,scope.$index)"
>修改</el-button
>
</template>
</el-table-column>
</el-table>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%"
>
<div>
<p>用户名：</p>
<el-input v-model="user" placeholder="请输入用户名"></el-input>
</div>
<div>
<p>密码：</p>
<el-input
v-model="pwd"
show-password
placeholder="请输入密码"
></el-input>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="set"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<style scoped>
.box{
width: 100%;
}
</style>
<script>
export default {
data() {
return {
tableData: [],
dialogVisible: false,
user:"",
pwd:"",
id:""
};
},
mounted() {
this.getlist();
},
methods: {
del(id) {
this.axios
.get("/deluser", {
params: {
id,
},
})
.then((res) => {
console.log(res.data);
this.getlist();
});
},
getlist() {
this.axios.get("/getlist").then((res) => {
console.log(res.data);
this.tableData = res.data.data;
});
},
up(id,index){
this.dialogVisible = true
this.id = id
this.pwd = this.tableData[index].pwd
this.user = this.tableData[index].user
},
set(){
this.axios.post("/update",{
user: this.user,
pwd: this.pwd,
id: this.id
}).then((res)=>{
console.log(res.data)
this.getlist()
this.dialogVisible = false
})
}
},
};
</script>

23
src/views/Login.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<div class="back"> <div class="back">
<!-- {{ $store.state.userinfo }} -->
<div class="box"> <div class="box">
<div> <div>
<p>用户名：</p> <p>用户名：</p>
@ -66,9 +65,25 @@ export default {
methods: { methods: {
login() { login() {
console.log(this.user, this.pwd); console.log(this.user, this.pwd);
const a = { user: this.user, pwd: this.pwd }; this.axios
this.$store.dispatch("getuserinfo", a); .get("/login", {
console.log(123) params: {
pwd: this.pwd,
user: this.user,
},
})
.then((res) => {
console.log(res.data);
if (res.data.code == 500) {
this.$message.error(res.data.msg);
}else{
this.$message({
message: "登录成功",
type: "success",
});
localStorage.setItem("token",res.data.token)
}
});
}, },
register() { register() {
this.axios this.axios

104
src/views/StuList.vue
View File

@ -1,104 +0,0 @@
<template>
<div>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="num_key" label="ID" width="180">
</el-table-column>
<el-table-column prop="user" label="用户名" width="180">
</el-table-column>
<el-table-column width="180" prop="pwd" label="密码">
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" @click="del(scope.row.num_key)"
>删除</el-button
>
<el-button size="mini" @click="up(scope.row.num_key,scope.$index)"
>修改</el-button
>
</template>
</el-table-column>
</el-table>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%"
>
<div>
<p>用户名：</p>
<el-input v-model="user" placeholder="请输入用户名"></el-input>
</div>
<div>
<p>密码：</p>
<el-input
v-model="pwd"
show-password
placeholder="请输入密码"
></el-input>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="set"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<style scoped>
</style>
<script>
export default {
data() {
return {
tableData: [],
dialogVisible: false,
user:"",
pwd:"",
id:""
};
},
mounted() {
this.getlist();
},
methods: {
del(id) {
this.axios
.get("/delstu", {
params: {
id,
},
})
.then((res) => {
console.log(res.data);
this.getlist();
});
},
getlist() {
this.axios.get("/getstulist").then((res) => {
console.log(res.data);
this.tableData = res.data.data;
});
},
up(id,index){
this.dialogVisible = true
this.id = id
this.pwd = this.tableData[index].pwd
this.user = this.tableData[index].user
},
set(){
this.axios.post("/upstu",{
user: this.user,
pwd: this.pwd,
id: this.id
}).then((res)=>{
console.log(res.data)
this.getlist()
this.dialogVisible = false
})
}
},
};
</script>