Skip to content

Commit 87cbd42

Browse files
gzezFISHERgzezFISHER
authored
Merge pull request #74 from segment-oj/add-user-edit-ztl
add user edit
2 parents f198829 + c47e555 commit 87cbd42

File tree

6 files changed

+162
-9
lines changed

6 files changed

+162
-9
lines changed

‎src/components/problem/content.vue‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -229,7 +229,6 @@ export default {
229229
#pannel {
230230
background-color: #ffffff !important;
231231
margin-left: 20px;
232-
width: calc(1140px - 850px - 20px);
233232
}
234233
235234
#tools {

‎src/components/user/content.vue‎

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
</el-card>
77
<el-card class="item">
88
<div slot="header" class="clearfix"><i class="el-icon-setting" /> Tool Bar</div>
9-
<el-button v-if="ismine" type="primary">Edit</el-button>
9+
<el-button v-if="ismine" type="primary" @click="$router.push('/account/' + $route.params.id + '/edit');">Edit</el-button>
1010
<el-button @click="$router.go(-1);">Back</el-button>
1111
</el-card>
1212
</div>
@@ -66,9 +66,15 @@
6666
</el-col>
6767
</el-row>
6868
<el-card shadow="never" class="item">
69-
<div slot="header" class="clearfix"><i class="el-icon-chat-line-square" /> Introduction</div>
69+
<div slot="header" class="clearfix"><i class="el-icon-chat-line-square" /> Introductions</div>
7070
<MarkdownContainer v-if="introduction" :content="introduction"/>
7171
</el-card>
72+
<el-card class="item">
73+
<div slot="header" class="clearfix"><i class="el-icon-chat-line-square" /> Permissions</div>
74+
<el-checkbox v-model="isStaff" disabled>Staff</el-checkbox>
75+
<el-checkbox v-model="isRoot" disabled>Root</el-checkbox>
76+
<el-checkbox v-model="isActive" disabled>Active</el-checkbox>
77+
</el-card>
7278
</div>
7379
</div>
7480
</template>
@@ -82,6 +88,7 @@ export default {
8288
name: 'UserHomepage',
8389
data() {
8490
return {
91+
staff: false,
8592
username: 'Unknown',
8693
userid: '-',
8794
email: 'Unknown',
@@ -92,7 +99,10 @@ export default {
9299
ismine: false,
93100
timeJoin: 'Unknown',
94101
lastLogin: 'Unknown',
95-
userLoading: true
102+
userLoading: true,
103+
isRoot: false,
104+
isStaff: false,
105+
isActive: true
96106
};
97107
},
98108
methods: {
@@ -109,14 +119,17 @@ export default {
109119
this.submit = data.submit_time;
110120
this.timeJoin = timeFormat(data.date_joined);
111121
this.lastLogin = timeFormat(data.last_login);
122+
this.isRoot = data.is_superuser;
123+
this.isStaff = data.is_staff;
124+
this.isActive = data.is_active;
112125
this.userLoading = false;
113-
if (this.solved == 0) {
126+
if (this.submit === 0) {
114127
this.rate = 100;
115128
} else {
116129
this.rate = (this.solved * 100.0) / this.submit;
117130
this.rate = this.rate.toFixed(2);
118131
}
119-
if (this.userid == String(this.$store.state.user.userid)) {
132+
if (this.$store.state.user.isStaff || this.userid == String(this.$store.state.user.userid)) {
120133
this.ismine = true;
121134
}
122135
})

‎src/components/user/edit.vue‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
<template>
2+
<div class="content">
3+
<div id="tool-bar">
4+
<el-card shadow="never">
5+
<el-avatar shape="square" :size="400"><img src="./../../assets/icon/SOJ-thick-white-background.png" /></el-avatar>
6+
</el-card>
7+
<el-card class="item">
8+
<div slot="header" class="clearfix"><i class="el-icon-setting" /> Tool Bar</div>
9+
<el-button v-if="isMine || this.$store.state.user.isStaff || this.$store.state.user.isRoot" type="primary" @click="submit()">Submit</el-button>
10+
<el-button @click="$router.go(-1);">Back</el-button>
11+
</el-card>
12+
</div>
13+
<div v-loading="!(isMine || this.$store.state.user.isStaff || this.$store.state.user.isRoot)" class="edit-content">
14+
<el-card>
15+
<div slot="header" class="clearfix"><i class="el-icon-user" /> User Name</div>
16+
<el-input v-model="username"></el-input>
17+
</el-card>
18+
<el-card class="item">
19+
<div slot="header" class="clearfix"><i class="el-icon-chat-line-square" /> Permissions</div>
20+
<el-checkbox v-model="isStaff" :disabled="!isStaffMe && !isRootMe">Staff</el-checkbox>
21+
<el-checkbox v-model="isRoot" :disabled="!isStaffMe && !isRootMe">Root</el-checkbox>
22+
<el-checkbox v-model="isActive" :disabled="(!isStaffMe && !isRootMe) || isMine">Active</el-checkbox>
23+
</el-card>
24+
<el-card class="item">
25+
<div slot="header" class="clearfix"><i class="el-icon-chat-line-square" /> Introductions</div>
26+
<MarkdownEditor v-model="introduction" />
27+
</el-card>
28+
</div>
29+
</div>
30+
</template>
31+
32+
<script>
33+
import apiurl from './../../apiurl';
34+
import MarkdownEditor from './../lib/MarkdownEditor.vue';
35+
36+
export default {
37+
name: 'UserEdit',
38+
data() {
39+
return {
40+
username: 'Unknown',
41+
email: 'Unknown',
42+
introduction: 'loading...',
43+
isMine: false,
44+
isStaff: false,
45+
isRoot: false,
46+
isActive: true,
47+
isRootMe: false,
48+
isStaffMe: false,
49+
isActiveMe: true
50+
};
51+
},
52+
methods: {
53+
showEdit() {
54+
this.$axios
55+
.get(apiurl('/account/' + this.$route.params.id))
56+
.then(res => {
57+
let data = res.data.res;
58+
this.isRootMe = this.$store.state.user.isRoot;
59+
this.isStaffMe = this.$store.state.user.isStaff;
60+
if (data.id == this.$store.state.user.userid) {
61+
this.isMine = true;
62+
}
63+
if (this.isMine || this.isRootMe || this.isStaffMe) {
64+
this.username = data.username;
65+
this.email = data.email;
66+
this.introduction = data.introduction;
67+
this.isStaff = data.is_staff;
68+
this.isRoot = data.is_superuser;
69+
this.isActive = data.is_active;
70+
}
71+
});
72+
},
73+
submit() {
74+
this.$axios
75+
.patch(apiurl('/account/' + this.$route.params.id), {
76+
username: this.username,
77+
introduction: this.introduction,
78+
is_staff: this.isStaff,
79+
is_superuser: this.isRoot,
80+
is_active: this.isActive
81+
})
82+
.then(() => {
83+
this.$SegmentMessage.success(this, 'Submitted');
84+
if (this.isMine) {
85+
this.$store.commit('userStaffChange', {
86+
isStaff: this.isStaff,
87+
isRoot: this.isRoot
88+
});
89+
}
90+
});
91+
}
92+
},
93+
mounted() {
94+
this.showEdit();
95+
},
96+
components: {
97+
MarkdownEditor
98+
}
99+
};
100+
</script>
101+
102+
<style scoped>
103+
#tool-bar {
104+
margin-right: 30px;
105+
}
106+
107+
.edit-content {
108+
width: 100%;
109+
}
110+
111+
.content {
112+
display: flex;
113+
}
114+
115+
.item {
116+
margin-top: 20px;
117+
}
118+
</style>

‎src/components/user/login.vue‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,10 @@ export default {
7171
this.$store.commit('userLang', {
7272
lang: detail.data.res.lang
7373
});
74+
this.$store.commit('userStaff', {
75+
is_staff: detail.data.res.is_staff,
76+
is_superuser: detail.data.res.is_superuser
77+
});
7478
});
7579
this.$store.commit('userLogin', {
7680
username: this.ldata.username,

‎src/router.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@ let router = new Router({
1010
}, {
1111
path: '/account/:id',
1212
component: () => import('./components/user/content.vue')
13+
}, {
14+
path: '/account/:id/edit',
15+
component: () => import('./components/user/edit.vue')
1316
}, {
1417
path: '/problem/list',
1518
component: () => import('./components/problem/list.vue')

‎src/store/user.js‎

Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
const userstore = {
22
state: {
3-
authenticated: localStorage.getItem('user-authenticated') || false,
3+
authenticated: localStorage.getItem('user-authenticated') === 'true' ? true : false || false,
44
username: localStorage.getItem('user-username') || null,
55
userid: localStorage.getItem('user-userid') || null,
66
userlang: localStorage.getItem('user-userlang') || null,
7+
isStaff: localStorage.getItem('user-is-staff') === 'true' ? true : false || false,
8+
isRoot: localStorage.getItem('user-is-root') === 'true' ? true : false || false,
79
showlogin: false,
810
showregister: false,
911
showlogout: false
@@ -13,11 +15,22 @@ const userstore = {
1315
state.authenticated = true;
1416
state.userid = data.userid;
1517
state.username = data.username;
16-
1718
localStorage.setItem('user-authenticated', true);
1819
localStorage.setItem('user-username', data.username);
1920
localStorage.setItem('user-userid', data.userid);
2021
},
22+
userStaffChange(state, data) {
23+
state.isStaff = data.isStaff;
24+
state.isRoot = data.isRoot;
25+
localStorage.setItem('user-is-root', data.isRoot);
26+
localStorage.setItem('user-is-staff', data.isStaff);
27+
},
28+
userStaff(state, data) {
29+
state.isStaff = data.is_staff;
30+
state.isRoot = data.is_superuser;
31+
localStorage.setItem('user-is-root', data.is_superuser);
32+
localStorage.setItem('user-is-staff', data.is_staff);
33+
},
2134
userLang(state, data) {
2235
state.userlang = data.lang;
2336

@@ -28,7 +41,10 @@ const userstore = {
2841
state.userid = null;
2942
state.username = null;
3043
state.userlang = null;
31-
44+
state.isStaff = false;
45+
state.isRoot = false;
46+
localStorage.removeItem('user-is-root');
47+
localStorage.removeItem('user-is-staff');
3248
localStorage.removeItem('user-userlang');
3349
localStorage.removeItem('user-authenticated');
3450
localStorage.removeItem('user-userid');

0 commit comments

Comments
 (0)