@jx3box/jx3box-editor 1.2.9 → 1.3.2
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 +55 -12
- 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.2
|
|
3
|
+
"version": "1.3.2",
|
|
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) {
|
|
@@ -379,7 +386,7 @@ export default {
|
|
|
379
386
|
this.done = true;
|
|
380
387
|
this.loading = false;
|
|
381
388
|
});
|
|
382
|
-
|
|
389
|
+
|
|
383
390
|
} else if (this.type === 'emotions') {
|
|
384
391
|
this.per = 30;
|
|
385
392
|
params = {
|
|
@@ -435,10 +442,39 @@ 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 = author.split(',') || [];
|
|
454
|
+
author.push(this.selectedAuthor.ID);
|
|
455
|
+
sessionStorage.setItem("atAuthor", JSON.stringify(author.join(',')));
|
|
456
|
+
} else {
|
|
457
|
+
sessionStorage.setItem("atAuthor", JSON.stringify(this.selectedAuthor.ID));
|
|
458
|
+
}
|
|
459
|
+
} catch (error) {
|
|
460
|
+
console.log(error)
|
|
461
|
+
}
|
|
438
462
|
},
|
|
439
463
|
insert: function() {
|
|
440
|
-
this.
|
|
441
|
-
|
|
464
|
+
if (this.type === 'authors') {
|
|
465
|
+
if (this.userStatus == 0 && this.canInsertAuthor) {
|
|
466
|
+
this.setAuthors();
|
|
467
|
+
this.$emit("insert", this.html);
|
|
468
|
+
this.dialogVisible = false;
|
|
469
|
+
this.selectedAuthor = {};
|
|
470
|
+
} else {
|
|
471
|
+
this.$message.error("您的等级不足或无权限，无法插入用户资源");
|
|
472
|
+
return;
|
|
473
|
+
}
|
|
474
|
+
} else {
|
|
475
|
+
this.$emit("insert", this.html);
|
|
476
|
+
this.dialogVisible = false;
|
|
477
|
+
}
|
|
442
478
|
},
|
|
443
479
|
transformData: function(data) {
|
|
444
480
|
data.forEach((item) => {
|
|
@@ -492,8 +528,9 @@ export default {
|
|
|
492
528
|
o.isSelected = true
|
|
493
529
|
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
530
|
},
|
|
495
|
-
selectAuthor: function (o
|
|
531
|
+
selectAuthor: function (o){
|
|
496
532
|
this.resetItems();
|
|
533
|
+
this.selectedAuthor = o;
|
|
497
534
|
o.isSelected = true;
|
|
498
535
|
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
536
|
},
|
|
@@ -526,6 +563,12 @@ export default {
|
|
|
526
563
|
userAvatar: function(url) {
|
|
527
564
|
return showAvatar(url);
|
|
528
565
|
},
|
|
566
|
+
loadUserInfo: function (){
|
|
567
|
+
if (!this.uid) return;
|
|
568
|
+
getUserInfo(this.uid).then(res => {
|
|
569
|
+
this.userInfo = res
|
|
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
|
|