@jx3box/jx3box-editor 1.2.9 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/module/author.less +170 -0
- package/package.json +2 -2
- package/service/author.js +12 -17
- package/src/Author.vue +105 -10
- package/src/Resource.vue +54 -11
- package/src/components/Avatar.vue +94 -0
- package/vue.config.js +10 -4
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
.w-author {
|
|
2
|
+
.w-author-wrapper {
|
|
3
|
+
@max-width: 345px;
|
|
4
|
+
@min-width: 200px;
|
|
5
|
+
max-width: @max-width;
|
|
6
|
+
min-width: @min-width;
|
|
7
|
+
padding: 9px 10px 10px;
|
|
8
|
+
background-color: #fff;
|
|
9
|
+
box-sizing: border-box;
|
|
10
|
+
|
|
11
|
+
.u-author {
|
|
12
|
+
.clearfix;
|
|
13
|
+
.db;
|
|
14
|
+
.pr;
|
|
15
|
+
}
|
|
16
|
+
.u-avatar {
|
|
17
|
+
.fl;
|
|
18
|
+
.mr(15px);
|
|
19
|
+
.size(68px);
|
|
20
|
+
}
|
|
21
|
+
.u-name {
|
|
22
|
+
.lh(2.2);
|
|
23
|
+
.bold;
|
|
24
|
+
color: @darkblue;
|
|
25
|
+
&:hover {
|
|
26
|
+
color: #f39;
|
|
27
|
+
}
|
|
28
|
+
.nobreak;
|
|
29
|
+
}
|
|
30
|
+
.u-info{
|
|
31
|
+
.pr;top:-4px;
|
|
32
|
+
.h(68px);
|
|
33
|
+
display: flex;
|
|
34
|
+
flex-direction: column;
|
|
35
|
+
justify-content: center;
|
|
36
|
+
}
|
|
37
|
+
.u-bio {
|
|
38
|
+
.mb(10px);
|
|
39
|
+
.fz(12px, 2);
|
|
40
|
+
.break(3);
|
|
41
|
+
color: #888;
|
|
42
|
+
padding: 0 5px;
|
|
43
|
+
}
|
|
44
|
+
.u-extend {
|
|
45
|
+
display: flex;
|
|
46
|
+
}
|
|
47
|
+
.u-level {
|
|
48
|
+
padding: 2px 8px;
|
|
49
|
+
.fz(12px, 14px);
|
|
50
|
+
color: #fff;
|
|
51
|
+
background-color:#aaa;
|
|
52
|
+
border-radius: 2px;
|
|
53
|
+
|
|
54
|
+
&.lv-1{background-color: #32d3c4;}
|
|
55
|
+
&.lv-2{background-color: #86c0fb;}
|
|
56
|
+
&.lv-3{background-color: #33d9ff;}
|
|
57
|
+
&.lv-4{background-color: #ffdb2a;}
|
|
58
|
+
&.lv-5{background-color: #ffa739;}
|
|
59
|
+
&.lv-6{background-color: #ff70b2;}
|
|
60
|
+
&.lv-7{background-color: #ff3399;}
|
|
61
|
+
&.lv-8{background-color: #f93c3c;}
|
|
62
|
+
}
|
|
63
|
+
.u-vip {
|
|
64
|
+
.ml(5px);
|
|
65
|
+
.db;
|
|
66
|
+
.i-icon-vip {
|
|
67
|
+
.db;
|
|
68
|
+
vertical-align: baseline;
|
|
69
|
+
padding: 2px 6px;
|
|
70
|
+
.fz(12px, 14px);
|
|
71
|
+
font-style: normal;
|
|
72
|
+
border-radius: 2px;
|
|
73
|
+
background-color: #ddd;
|
|
74
|
+
color: #fff;
|
|
75
|
+
&.on {
|
|
76
|
+
background-color: #6f42c1;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
.u-superauthor {
|
|
81
|
+
margin-left: 4px;
|
|
82
|
+
display: inline-block;
|
|
83
|
+
vertical-align: -2px;
|
|
84
|
+
img {
|
|
85
|
+
padding: 0;
|
|
86
|
+
margin: 0;
|
|
87
|
+
width: 16px;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
.u-tips {
|
|
91
|
+
.db;
|
|
92
|
+
color: #555;
|
|
93
|
+
font-size: 12px;
|
|
94
|
+
}
|
|
95
|
+
.u-link {
|
|
96
|
+
border-top: 1px dashed #eee;
|
|
97
|
+
border-bottom: 1px dashed #eee;
|
|
98
|
+
a,
|
|
99
|
+
div {
|
|
100
|
+
.db;
|
|
101
|
+
margin: 10px 5px;
|
|
102
|
+
.fz(12px, 20px);
|
|
103
|
+
color: #555;
|
|
104
|
+
}
|
|
105
|
+
a {
|
|
106
|
+
&:hover {
|
|
107
|
+
color: #f39;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
svg,
|
|
111
|
+
img {
|
|
112
|
+
.size(16px);
|
|
113
|
+
.mr(6px);
|
|
114
|
+
.y(-3px);
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
.u-medals {
|
|
118
|
+
padding: 0 2px;
|
|
119
|
+
line-height: unset;
|
|
120
|
+
|
|
121
|
+
.m-medal {
|
|
122
|
+
line-height: normal;
|
|
123
|
+
flex-wrap: wrap;
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.u-medal{
|
|
128
|
+
img{
|
|
129
|
+
padding: 0;
|
|
130
|
+
margin: 0;
|
|
131
|
+
.size(20px);
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
.u-label {
|
|
135
|
+
margin: 15px 0 10px 0;
|
|
136
|
+
padding: 0 5px 10px 5px;
|
|
137
|
+
i {
|
|
138
|
+
.mr(5px);
|
|
139
|
+
}
|
|
140
|
+
span {
|
|
141
|
+
.fz(13px);
|
|
142
|
+
}
|
|
143
|
+
border-bottom: 1px solid @border;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.u-teams {
|
|
147
|
+
.mt(10px);
|
|
148
|
+
.u-team {
|
|
149
|
+
.db;
|
|
150
|
+
background-color: #f2f6fc;
|
|
151
|
+
.mb(6px);
|
|
152
|
+
&:hover {
|
|
153
|
+
background-color: #e6f0fb;
|
|
154
|
+
// color:@color-link;
|
|
155
|
+
}
|
|
156
|
+
.r(3px);
|
|
157
|
+
}
|
|
158
|
+
.u-team-logo {
|
|
159
|
+
.size(24px);
|
|
160
|
+
.y;
|
|
161
|
+
.mr(4px);
|
|
162
|
+
.r(4px);
|
|
163
|
+
}
|
|
164
|
+
.u-team-name {
|
|
165
|
+
.fz(12px);
|
|
166
|
+
color: #555;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jx3box/jx3box-editor",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.0",
|
|
4
4
|
"description": "JX3BOX Article & Editor",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"last 2 versions"
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@jx3box/jx3box-common": "^
|
|
34
|
+
"@jx3box/jx3box-common": "^7.2.1",
|
|
35
35
|
"@jx3box/jx3box-data": "^1.8.3",
|
|
36
36
|
"@jx3box/jx3box-emotion": "^1.0.10",
|
|
37
37
|
"@jx3box/jx3box-macro": "^1.0.1",
|
package/service/author.js
CHANGED
|
@@ -1,29 +1,24 @@
|
|
|
1
|
-
import { $next, $cms } from "@jx3box/jx3box-common/js/https";
|
|
1
|
+
import { $next, $cms, $team } from "@jx3box/jx3box-common/js/https";
|
|
2
2
|
|
|
3
|
-
function getUserMedals(uid) {
|
|
4
|
-
|
|
5
|
-
.get("/api/user/" + uid + "/medals")
|
|
6
|
-
|
|
7
|
-
return res.data.data;
|
|
8
|
-
});
|
|
3
|
+
async function getUserMedals(uid) {
|
|
4
|
+
const res = await $next({ mute: true })
|
|
5
|
+
.get("/api/user/" + uid + "/medals");
|
|
6
|
+
return res.data.data;
|
|
9
7
|
}
|
|
10
8
|
|
|
11
|
-
function getUserInfo(uid) {
|
|
12
|
-
|
|
13
|
-
.get(`/api/cms/user/${uid}/info`)
|
|
14
|
-
|
|
15
|
-
return res.data.data;
|
|
16
|
-
});
|
|
9
|
+
async function getUserInfo(uid) {
|
|
10
|
+
const res = await $cms({ mute: true })
|
|
11
|
+
.get(`/api/cms/user/${uid}/info`);
|
|
12
|
+
return res.data.data;
|
|
17
13
|
}
|
|
18
14
|
|
|
19
|
-
function getUserPublicTeams(uid) {
|
|
20
|
-
|
|
15
|
+
async function getUserPublicTeams(uid) {
|
|
16
|
+
const res = await $team({ mute: true }).get(`/api/team/relation/public`, {
|
|
21
17
|
params: {
|
|
22
18
|
uid: uid,
|
|
23
19
|
},
|
|
24
|
-
}).then((res) => {
|
|
25
|
-
return res.data.data;
|
|
26
20
|
});
|
|
21
|
+
return res.data.data;
|
|
27
22
|
}
|
|
28
23
|
|
|
29
24
|
|
package/src/Author.vue
CHANGED
|
@@ -1,43 +1,108 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="w-author">
|
|
3
|
-
<div class="w-
|
|
4
|
-
|
|
2
|
+
<div class="w-author" v-loading="loading">
|
|
3
|
+
<div class="w-author-wrapper el-popover" v-if="data">
|
|
4
|
+
<div class="u-author">
|
|
5
|
+
<Avatar class="u-avatar" :uid="uid" :url="data.user_avatar" :size="68" :frame="data.user_avatar_frame" />
|
|
6
|
+
<div class="u-info">
|
|
7
|
+
<a class="u-name" :href="authorLink(uid)" target="_blank">
|
|
8
|
+
<span>{{ data.display_name.slice(0, 8) }}</span>
|
|
9
|
+
<a class="u-superauthor" href="/dashboard/#/cooperation" target="_blank">
|
|
10
|
+
<img :src="super_author_icon" alt="superauthor" />
|
|
11
|
+
</a>
|
|
12
|
+
</a>
|
|
13
|
+
<div class="u-extend">
|
|
14
|
+
<span class="u-level" :class="'lv-' + level" :style={backgroundColor:showLevelColor(level)}>Lv.{{ level }}</span>
|
|
15
|
+
<a class="u-vip" href="/vip/premium?from=sidebar_author" target="_blank">
|
|
16
|
+
<i class="i-icon-vip on">{{ vipType }}</i>
|
|
17
|
+
</a>
|
|
18
|
+
</div>
|
|
19
|
+
</div>
|
|
20
|
+
</div>
|
|
21
|
+
<div class="u-trophy" v-if="hasTrophy">
|
|
22
|
+
<div class="u-medals" v-if="medals && medals.length">
|
|
23
|
+
<medal :medals="medals" :showIcon="showMedalIcon"></medal>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
<div class="u-teams" v-if="teams && teams.length">
|
|
27
|
+
<a class="u-team" v-for="(item, i) in teams" :key="i" :href="teamLink(item.team_id)" target="_blank">
|
|
28
|
+
<img class="u-team-logo" :src="showTeamLogo(item.team_logo)" />
|
|
29
|
+
<span class="u-team-name">{{ item.team_name }}@{{ item.team_server }}</span>
|
|
30
|
+
</a>
|
|
31
|
+
</div>
|
|
5
32
|
</div>
|
|
6
33
|
</div>
|
|
7
34
|
</template>
|
|
8
35
|
|
|
9
36
|
<script>
|
|
37
|
+
import { authorLink, getLink, getThumbnail } from "@jx3box/jx3box-common/js/utils";
|
|
10
38
|
import { getUserInfo, getUserMedals, getUserPublicTeams } from "../service/author";
|
|
39
|
+
import { __server, __imgPath,__userLevelColor } from "@jx3box/jx3box-common/data/jx3box.json";
|
|
40
|
+
import User from "@jx3box/jx3box-common/js/user";
|
|
41
|
+
import { __userLevel } from "@jx3box/jx3box-common/data/jx3box.json";
|
|
42
|
+
import Avatar from "./components/Avatar.vue"
|
|
11
43
|
import medal from "./components/medal.vue"
|
|
12
44
|
export default {
|
|
13
45
|
name: "Author",
|
|
14
46
|
components: {
|
|
15
|
-
|
|
47
|
+
medal,
|
|
48
|
+
Avatar
|
|
16
49
|
},
|
|
17
50
|
props: ["uid"],
|
|
18
51
|
data: () => ({
|
|
19
52
|
data: null,
|
|
20
53
|
medals: [],
|
|
21
54
|
teams: [],
|
|
55
|
+
loading: false
|
|
22
56
|
}),
|
|
57
|
+
computed: {
|
|
58
|
+
super_author_icon: function() {
|
|
59
|
+
return __imgPath + "image/user/" + "superauthor.svg";
|
|
60
|
+
},
|
|
61
|
+
vipType: function() {
|
|
62
|
+
return this.data?.is_pro ? "PRO" : "PRE";
|
|
63
|
+
},
|
|
64
|
+
level: function() {
|
|
65
|
+
return User.getLevel(this.data && this.data.experience);
|
|
66
|
+
},
|
|
67
|
+
hasTrophy: function() {
|
|
68
|
+
return this.medals.length;
|
|
69
|
+
},
|
|
70
|
+
},
|
|
71
|
+
watch: {
|
|
72
|
+
uid: {
|
|
73
|
+
immediate: true,
|
|
74
|
+
handler (val) {
|
|
75
|
+
if (val) {
|
|
76
|
+
this.loadData()
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
},
|
|
23
81
|
methods: {
|
|
24
82
|
loadData: function() {
|
|
83
|
+
const promises = [getUserInfo(this.uid), getUserMedals(this.uid), getUserPublicTeams(this.uid)];
|
|
84
|
+
this.loading = true;
|
|
85
|
+
Promise.all(promises).then(res => {
|
|
86
|
+
this.data = res[0];
|
|
87
|
+
this.medals = res[1];
|
|
88
|
+
this.teams = res[2];
|
|
89
|
+
this.loading = false;
|
|
90
|
+
});
|
|
91
|
+
},
|
|
92
|
+
loadUserInfo: function (){
|
|
25
93
|
return getUserInfo(this.uid)
|
|
26
94
|
.then((data) => {
|
|
27
95
|
this.data = data;
|
|
28
96
|
})
|
|
29
|
-
.then(() => {
|
|
30
|
-
this.loadMedals();
|
|
31
|
-
this.loadTeams();
|
|
32
|
-
});
|
|
33
97
|
},
|
|
34
98
|
loadMedals: function() {
|
|
35
|
-
getUserMedals(this.uid).then((data) => {
|
|
99
|
+
return getUserMedals(this.uid).then((data) => {
|
|
100
|
+
console.log(data)
|
|
36
101
|
this.medals = data;
|
|
37
102
|
});
|
|
38
103
|
},
|
|
39
104
|
loadTeams: function() {
|
|
40
|
-
getUserPublicTeams(this.uid).then((data) => {
|
|
105
|
+
return getUserPublicTeams(this.uid).then((data) => {
|
|
41
106
|
this.teams = data && data.slice(0, 5);
|
|
42
107
|
});
|
|
43
108
|
},
|
|
@@ -48,9 +113,39 @@ export default {
|
|
|
48
113
|
showMedalDesc: function(item) {
|
|
49
114
|
return item.medal_desc || medal_map[item.medal];
|
|
50
115
|
},
|
|
116
|
+
teamLink: function(team_id) {
|
|
117
|
+
return getLink("org", team_id);
|
|
118
|
+
},
|
|
51
119
|
showTeamLogo: function(val) {
|
|
52
120
|
return getThumbnail(val, 96);
|
|
53
121
|
},
|
|
122
|
+
showLevelColor:function (level){
|
|
123
|
+
return __userLevelColor[level]
|
|
124
|
+
},
|
|
125
|
+
authorLink
|
|
54
126
|
}
|
|
55
127
|
}
|
|
56
128
|
</script>
|
|
129
|
+
|
|
130
|
+
<style lang="less">
|
|
131
|
+
@import "../assets/css/module/author.less";
|
|
132
|
+
.w-author {
|
|
133
|
+
.w-author-wrapper {
|
|
134
|
+
.u-avatar {
|
|
135
|
+
.fl;
|
|
136
|
+
.mr(15px);
|
|
137
|
+
.size(48px);
|
|
138
|
+
}
|
|
139
|
+
img {
|
|
140
|
+
border: none;
|
|
141
|
+
}
|
|
142
|
+
a {
|
|
143
|
+
text-decoration: none;
|
|
144
|
+
&:hover {
|
|
145
|
+
text-decoration: none;
|
|
146
|
+
box-shadow: none;
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
</style>
|
package/src/Resource.vue
CHANGED
|
@@ -185,7 +185,7 @@
|
|
|
185
185
|
</ul>
|
|
186
186
|
<el-alert v-if="!authors.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
|
|
187
187
|
</el-tab-pane>
|
|
188
|
-
<el-tab-pane label="表情" name="emotions">
|
|
188
|
+
<!-- <el-tab-pane label="表情" name="emotions">
|
|
189
189
|
<span slot="label" class="u-tab-label">
|
|
190
190
|
<i class="el-icon-sugar"></i>
|
|
191
191
|
<b>表情</b>
|
|
@@ -195,17 +195,11 @@
|
|
|
195
195
|
</p>
|
|
196
196
|
<ul class="m-resource-iconlist">
|
|
197
197
|
<li v-for="(o, i) in emotions" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectEmotion(o)" ref="emotion">
|
|
198
|
-
<!-- <el-tooltip
|
|
199
|
-
effect="dark"
|
|
200
|
-
:content="o.Name || query"
|
|
201
|
-
placement="top"
|
|
202
|
-
>-->
|
|
203
198
|
<img class="e-jx3-emotion" :src="userAvatar(o.url)" :alt="query" />
|
|
204
|
-
<!-- </el-tooltip> -->
|
|
205
199
|
</li>
|
|
206
200
|
</ul>
|
|
207
201
|
<el-alert v-if="!emotions.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
|
|
208
|
-
</el-tab-pane>
|
|
202
|
+
</el-tab-pane> -->
|
|
209
203
|
</el-tabs>
|
|
210
204
|
|
|
211
205
|
<template v-if="multipage">
|
|
@@ -241,9 +235,11 @@
|
|
|
241
235
|
<script>
|
|
242
236
|
import { loadResource, loadStat, getIcons } from "../service/database";
|
|
243
237
|
import { loadAuthors, loadEmotions } from "../service/cms";
|
|
238
|
+
import { getUserInfo } from "../service/author";
|
|
244
239
|
import { __ossRoot, __iconPath, __Root, __OriginRoot } from "@jx3box/jx3box-common/data/jx3box.json";
|
|
245
240
|
import detach_types from "../assets/data/detach_type.json";
|
|
246
241
|
import { iconLink, getLink, showAvatar } from "@jx3box/jx3box-common/js/utils";
|
|
242
|
+
import User from "@jx3box/jx3box-common/js/user";
|
|
247
243
|
import Item from './Item.vue';
|
|
248
244
|
export default {
|
|
249
245
|
name: "Resource",
|
|
@@ -257,6 +253,7 @@ export default {
|
|
|
257
253
|
return {
|
|
258
254
|
dialogVisible: false,
|
|
259
255
|
actived: false,
|
|
256
|
+
userInfo: {},
|
|
260
257
|
|
|
261
258
|
type: "buff",
|
|
262
259
|
query: "",
|
|
@@ -269,6 +266,7 @@ export default {
|
|
|
269
266
|
icon: [],
|
|
270
267
|
npc: [],
|
|
271
268
|
authors: [],
|
|
269
|
+
selectedAuthor: {},
|
|
272
270
|
emotions: [],
|
|
273
271
|
|
|
274
272
|
stat: {
|
|
@@ -318,6 +316,15 @@ export default {
|
|
|
318
316
|
iconDir: function() {
|
|
319
317
|
return this.client == "origin" ? "origin_icon" : "icon";
|
|
320
318
|
},
|
|
319
|
+
userStatus: function (){
|
|
320
|
+
return User.getInfo().status
|
|
321
|
+
},
|
|
322
|
+
uid: function (){
|
|
323
|
+
return User.getInfo().uid
|
|
324
|
+
},
|
|
325
|
+
canInsertAuthor: function() {
|
|
326
|
+
return User.getLevel(this.userInfo && this.userInfo.experience) >= 2;
|
|
327
|
+
},
|
|
321
328
|
},
|
|
322
329
|
watch: {
|
|
323
330
|
html: function(newval) {
|
|
@@ -435,10 +442,38 @@ export default {
|
|
|
435
442
|
changeType: function() {
|
|
436
443
|
this.page = 1;
|
|
437
444
|
this.getData();
|
|
445
|
+
if (this.type === 'authors') {
|
|
446
|
+
this.loadUserInfo();
|
|
447
|
+
}
|
|
448
|
+
},
|
|
449
|
+
setAuthors: function() {
|
|
450
|
+
try {
|
|
451
|
+
let author = sessionStorage.getItem("atAuthor");
|
|
452
|
+
if (author) {
|
|
453
|
+
author = JSON.parse(author);
|
|
454
|
+
author = author.split(',') || [];
|
|
455
|
+
author.push(this.selectedAuthor.id);
|
|
456
|
+
sessionStorage.setItem("atAuthor", JSON.stringify(author.join(',')));
|
|
457
|
+
}
|
|
458
|
+
} catch (error) {
|
|
459
|
+
console.log(error)
|
|
460
|
+
}
|
|
438
461
|
},
|
|
439
462
|
insert: function() {
|
|
440
|
-
this.
|
|
441
|
-
|
|
463
|
+
if (this.type === 'authors') {
|
|
464
|
+
if (this.userStatus == 0 && this.canInsertAuthor) {
|
|
465
|
+
this.setAuthors();
|
|
466
|
+
this.$emit("insert", this.html);
|
|
467
|
+
this.dialogVisible = false;
|
|
468
|
+
this.selectAuthor = {};
|
|
469
|
+
} else {
|
|
470
|
+
this.$message.error("您的等级不足或无权限，无法插入用户资源");
|
|
471
|
+
return;
|
|
472
|
+
}
|
|
473
|
+
} else {
|
|
474
|
+
this.$emit("insert", this.html);
|
|
475
|
+
this.dialogVisible = false;
|
|
476
|
+
}
|
|
442
477
|
},
|
|
443
478
|
transformData: function(data) {
|
|
444
479
|
data.forEach((item) => {
|
|
@@ -492,8 +527,9 @@ export default {
|
|
|
492
527
|
o.isSelected = true
|
|
493
528
|
this.html = `<a data-type="npc" class="e-jx3-npc w-jx3-element" data-mode="" data-id="${o.ID}" data-client="${this.client}" target="_blank" href="${this.getDbLink("npc", this.client, o.ID, '')}">${o.Name}]</a>`
|
|
494
529
|
},
|
|
495
|
-
selectAuthor: function (o
|
|
530
|
+
selectAuthor: function (o){
|
|
496
531
|
this.resetItems();
|
|
532
|
+
this.selectAuthor = o;
|
|
497
533
|
o.isSelected = true;
|
|
498
534
|
this.html = `<a data-type="author" class="e-jx3-author w-jx3-element" data-mode="" data-id="${o.ID}" target="_blank" href="/author/${o.ID}">【${o.display_name}】</a>`
|
|
499
535
|
},
|
|
@@ -526,6 +562,13 @@ export default {
|
|
|
526
562
|
userAvatar: function(url) {
|
|
527
563
|
return showAvatar(url);
|
|
528
564
|
},
|
|
565
|
+
loadUserInfo: function (){
|
|
566
|
+
if (!this.uid) return;
|
|
567
|
+
return getUserInfo(this.uid)
|
|
568
|
+
.then((data) => {
|
|
569
|
+
this.userInfo = data;
|
|
570
|
+
})
|
|
571
|
+
},
|
|
529
572
|
|
|
530
573
|
// 杂项
|
|
531
574
|
// ==============================
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<a class="c-avatar" :href="authorLink(uid)" target="_blank">
|
|
3
|
+
<img :src="showAvatar(url)" class="c-avatar-pic"/>
|
|
4
|
+
<i class="c-avatar-frame" v-if="frame">
|
|
5
|
+
<img :src="frameUrl" />
|
|
6
|
+
</i>
|
|
7
|
+
<slot></slot>
|
|
8
|
+
</a>
|
|
9
|
+
</template>
|
|
10
|
+
|
|
11
|
+
<script>
|
|
12
|
+
import { __server, __imgPath } from "@jx3box/jx3box-common/data/jx3box.json";
|
|
13
|
+
import { showAvatar, authorLink } from "@jx3box/jx3box-common/js/utils";
|
|
14
|
+
export default {
|
|
15
|
+
name: "Avatar",
|
|
16
|
+
props: ["uid", "url", "size", "frame"],
|
|
17
|
+
components: {},
|
|
18
|
+
data: function() {
|
|
19
|
+
return {
|
|
20
|
+
frames: [],
|
|
21
|
+
styles : [
|
|
22
|
+
{cls:'xs',size:60},
|
|
23
|
+
{cls:'s',size:84},
|
|
24
|
+
{cls:'m',size:136},
|
|
25
|
+
{cls:'l',size:224},
|
|
26
|
+
]
|
|
27
|
+
};
|
|
28
|
+
},
|
|
29
|
+
computed: {
|
|
30
|
+
frameUrl: function() {
|
|
31
|
+
return __imgPath + `avatar/images/${this.frame}/${this.frame}.svg`;
|
|
32
|
+
},
|
|
33
|
+
},
|
|
34
|
+
methods: {
|
|
35
|
+
showAvatar: function(val) {
|
|
36
|
+
return showAvatar(val, this.size*3);
|
|
37
|
+
},
|
|
38
|
+
authorLink,
|
|
39
|
+
},
|
|
40
|
+
mounted : function (){
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
</script>
|
|
44
|
+
|
|
45
|
+
<style scoped lang="less">
|
|
46
|
+
.c-avatar {
|
|
47
|
+
.pr;
|
|
48
|
+
.dbi;
|
|
49
|
+
}
|
|
50
|
+
.c-avatar-pic {
|
|
51
|
+
.db;
|
|
52
|
+
.full;
|
|
53
|
+
.r(100%);
|
|
54
|
+
}
|
|
55
|
+
.c-avatar-frame {
|
|
56
|
+
.pa;
|
|
57
|
+
.lt(-10px);
|
|
58
|
+
.size(100%);
|
|
59
|
+
padding: 10px;
|
|
60
|
+
box-sizing: content-box;
|
|
61
|
+
img {
|
|
62
|
+
.db;
|
|
63
|
+
.pa;
|
|
64
|
+
.size(100%);
|
|
65
|
+
.lt(0);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
&.xs {
|
|
69
|
+
left: -6px;
|
|
70
|
+
top: -6px;
|
|
71
|
+
width: 60px;
|
|
72
|
+
height: 60px;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
&.s {
|
|
76
|
+
left: -8px;
|
|
77
|
+
top: -8px;
|
|
78
|
+
width: 84px;
|
|
79
|
+
height: 84px;
|
|
80
|
+
}
|
|
81
|
+
&.m {
|
|
82
|
+
left: -8px;
|
|
83
|
+
top: -8px;
|
|
84
|
+
width: 136px;
|
|
85
|
+
height: 136px;
|
|
86
|
+
}
|
|
87
|
+
&.l {
|
|
88
|
+
width: 224px;
|
|
89
|
+
height: 224px;
|
|
90
|
+
left: -22px;
|
|
91
|
+
top: -22px;
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
</style>
|
package/vue.config.js
CHANGED
|
@@ -68,12 +68,18 @@ module.exports = {
|
|
|
68
68
|
request.setHeader("origin", "");
|
|
69
69
|
}
|
|
70
70
|
},
|
|
71
|
+
"/api/team": {
|
|
72
|
+
target: "https://team.api.jx3box.com",
|
|
73
|
+
onProxyReq: function(request) {
|
|
74
|
+
request.setHeader("origin", "");
|
|
75
|
+
},
|
|
76
|
+
},
|
|
71
77
|
"/api": {
|
|
72
|
-
|
|
73
|
-
|
|
78
|
+
target: "https://next2.jx3box.com",
|
|
79
|
+
onProxyReq: function(request) {
|
|
74
80
|
request.setHeader("origin", "");
|
|
75
|
-
}
|
|
76
|
-
}
|
|
81
|
+
},
|
|
82
|
+
},
|
|
77
83
|
}
|
|
78
84
|
},
|
|
79
85
|
|