@jx3box/jx3box-editor 1.6.8 → 1.7.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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jx3box/jx3box-editor",
3
- "version": "1.6.8",
3
+ "version": "1.7.0",
4
4
  "description": "JX3BOX Article & Editor",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -1,26 +1,70 @@
1
1
  <template>
2
2
  <div class="w-author" v-loading="loading">
3
- <div class="w-author-wrapper el-popover" v-if="data" :style="{ backgroundImage: bg }">
3
+ <div
4
+ class="w-author-wrapper el-popover"
5
+ v-if="data"
6
+ :style="{ backgroundImage: bg }"
7
+ >
4
8
  <div class="u-author">
5
- <Avatar class="u-avatar" :uid="uid" :url="data.user_avatar" :size="68" :frame="data.user_avatar_frame" />
9
+ <Avatar
10
+ class="u-avatar"
11
+ :uid="uid"
12
+ :url="data.user_avatar"
13
+ :size="68"
14
+ :frame="data.user_avatar_frame"
15
+ />
6
16
  <div class="u-info">
7
17
  <a class="u-name" :href="authorLink(uid)" target="_blank">
8
- <span>{{ data.display_name.slice(0, 8) }}</span>
9
- <el-tooltip class="item" effect="dark" content="签约作者" placement="top" v-if="isSuperAuthor">
10
- <a class="u-superauthor" href="/dashboard/cooperation" target="_blank">
11
- <img :src="super_author_icon" alt="superauthor" />
18
+ <el-tooltip
19
+ class="item"
20
+ effect="dark"
21
+ content="签约作者"
22
+ placement="top"
23
+ v-if="isSuperAuthor"
24
+ >
25
+ <a
26
+ class="u-superauthor"
27
+ href="/dashboard/cooperation"
28
+ target="_blank"
29
+ >
30
+ <img
31
+ :src="super_author_icon"
32
+ alt="superauthor"
33
+ />
12
34
  </a>
13
35
  </el-tooltip>
36
+ <span class="u-displayname" :title="data.display_name">{{
37
+ data.display_name || "未知"
38
+ }}</span>
14
39
  </a>
15
40
  <div class="u-extend">
16
41
  <el-tooltip class="item" effect="dark" placement="top">
17
42
  <div slot="content">
18
- <span class="u-tips">经验值:{{ data.experience }}</span>
43
+ <span class="u-tips"
44
+ >经验值:{{ data.experience }}</span
45
+ >
19
46
  </div>
20
- <span class="u-level" :class="'lv-' + level" :style={backgroundColor:showLevelColor(level)}>Lv.{{ level }}</span>
47
+ <span
48
+ class="u-level"
49
+ :class="'lv-' + level"
50
+ :style="{
51
+ backgroundColor: showLevelColor(level),
52
+ }"
53
+ >Lv.{{ level }}</span
54
+ >
21
55
  </el-tooltip>
22
- <el-tooltip class="item" effect="dark" :content="vipTypeTitle" placement="top" v-if="isVip">
23
- <a class="u-vip" href="/vip/premium?from=sidebar_author" target="_blank">
56
+ <el-tooltip
57
+ class="item"
58
+ effect="dark"
59
+ :content="vipTypeTitle"
60
+ placement="top"
61
+ v-if="isVip"
62
+ >
63
+ <a
64
+ class="u-vip"
65
+ href="/vip/premium?from=sidebar_author"
66
+ target="_blank"
67
+ >
24
68
  <i class="i-icon-vip on">{{ vipType }}</i>
25
69
  </a>
26
70
  </el-tooltip>
@@ -33,9 +77,20 @@
33
77
  </div>
34
78
  </div>
35
79
  <div class="u-teams" v-if="teams && teams.length">
36
- <a class="u-team" v-for="(item, i) in teams" :key="i" :href="teamLink(item.team_id)" target="_blank">
37
- <img class="u-team-logo" :src="showTeamLogo(item.team_logo)" />
38
- <span class="u-team-name">{{ item.team_name }}@{{ item.team_server }}</span>
80
+ <a
81
+ class="u-team"
82
+ v-for="(item, i) in teams"
83
+ :key="i"
84
+ :href="teamLink(item.team_id)"
85
+ target="_blank"
86
+ >
87
+ <img
88
+ class="u-team-logo"
89
+ :src="showTeamLogo(item.team_logo)"
90
+ />
91
+ <span class="u-team-name"
92
+ >{{ item.team_name }}@{{ item.team_server }}</span
93
+ >
39
94
  </a>
40
95
  </div>
41
96
  </div>
@@ -43,19 +98,31 @@
43
98
  </template>
44
99
 
45
100
  <script>
46
- import { authorLink, getLink, getThumbnail } from "@jx3box/jx3box-common/js/utils";
47
- import { getUserInfo, getUserMedals, getUserPublicTeams } from "../../service/author";
101
+ import {
102
+ authorLink,
103
+ getLink,
104
+ getThumbnail,
105
+ } from "@jx3box/jx3box-common/js/utils";
106
+ import {
107
+ getUserInfo,
108
+ getUserMedals,
109
+ getUserPublicTeams,
110
+ } from "../../service/author";
48
111
  import { getDecoration } from "../../service/cms";
49
- import { __server, __imgPath,__userLevelColor } from "@jx3box/jx3box-common/data/jx3box.json";
112
+ import {
113
+ __server,
114
+ __imgPath,
115
+ __userLevelColor,
116
+ } from "@jx3box/jx3box-common/data/jx3box.json";
50
117
  import User from "@jx3box/jx3box-common/js/user";
51
118
  import { __userLevel } from "@jx3box/jx3box-common/data/jx3box.json";
52
- import Avatar from "./Avatar.vue"
53
- import medal from "./medal.vue"
119
+ import Avatar from "./Avatar.vue";
120
+ import medal from "./medal.vue";
54
121
  export default {
55
122
  name: "Author",
56
123
  components: {
57
124
  medal,
58
- Avatar
125
+ Avatar,
59
126
  },
60
127
  props: ["uid"],
61
128
  data: () => ({
@@ -63,116 +130,132 @@ export default {
63
130
  medals: [],
64
131
  teams: [],
65
132
  loading: false,
66
- bg:''
133
+ bg: "",
67
134
  }),
68
135
  computed: {
69
- super_author_icon: function() {
136
+ super_author_icon: function () {
70
137
  return __imgPath + "image/user/" + "superauthor.svg";
71
138
  },
72
- isVip: function (){
73
- return this.data?.is_pro || this.data?.is_pre
139
+ isVip: function () {
140
+ return this.data?.is_pro || this.data?.is_pre;
74
141
  },
75
- vipTypeTitle: function() {
142
+ vipTypeTitle: function () {
76
143
  return this.data?.is_pro ? "专业版会员" : "高级版会员";
77
144
  },
78
- vipType: function() {
145
+ vipType: function () {
79
146
  return this.data?.is_pro ? "PRO" : "PRE";
80
147
  },
81
- level: function() {
148
+ level: function () {
82
149
  return User.getLevel(this.data && this.data.experience);
83
150
  },
84
- hasTrophy: function() {
151
+ hasTrophy: function () {
85
152
  return this.medals.length;
86
153
  },
87
- isSuperAuthor: function() {
154
+ isSuperAuthor: function () {
88
155
  return !!this.data?.sign;
89
156
  },
90
157
  },
91
158
  watch: {
92
159
  uid: {
93
160
  immediate: true,
94
- handler (val) {
161
+ handler(val) {
95
162
  if (val) {
96
- this.loadData()
97
- this.getDecoration()
163
+ this.loadData();
164
+ this.getDecoration();
98
165
  }
99
- }
100
- }
166
+ },
167
+ },
101
168
  },
102
169
  methods: {
103
- loadData: function() {
104
- const promises = [getUserInfo(this.uid), getUserMedals(this.uid), getUserPublicTeams(this.uid)];
170
+ loadData: function () {
171
+ const promises = [
172
+ getUserInfo(this.uid),
173
+ getUserMedals(this.uid),
174
+ getUserPublicTeams(this.uid),
175
+ ];
105
176
  this.loading = true;
106
- Promise.all(promises).then(res => {
177
+ Promise.all(promises).then((res) => {
107
178
  this.data = res[0];
108
179
  this.medals = res[1];
109
180
  this.teams = res[2];
110
181
  this.loading = false;
111
182
  });
112
183
  },
113
- loadUserInfo: function (){
114
- return getUserInfo(this.uid)
115
- .then((data) => {
116
- this.data = data;
117
- })
184
+ loadUserInfo: function () {
185
+ return getUserInfo(this.uid).then((data) => {
186
+ this.data = data;
187
+ });
118
188
  },
119
- loadMedals: function() {
189
+ loadMedals: function () {
120
190
  return getUserMedals(this.uid).then((data) => {
121
191
  this.medals = data;
122
192
  });
123
193
  },
124
- loadTeams: function() {
194
+ loadTeams: function () {
125
195
  return getUserPublicTeams(this.uid).then((data) => {
126
196
  this.teams = data && data.slice(0, 5);
127
197
  });
128
198
  },
129
- getDecoration(){
130
- let decoration_atcard=sessionStorage.getItem('decoration_atcard'+this.uid)
131
- if(decoration_atcard == 'no'){
132
- this.bg = ""
199
+ getDecoration() {
200
+ let decoration_atcard = sessionStorage.getItem(
201
+ "decoration_atcard" + this.uid
202
+ );
203
+ if (decoration_atcard == "no") {
204
+ this.bg = "";
133
205
  return;
134
206
  }
135
207
  //已有缓存,读取解析
136
- if(decoration_atcard){
137
- this.setDecoration(JSON.parse(decoration_atcard))
208
+ if (decoration_atcard) {
209
+ this.setDecoration(JSON.parse(decoration_atcard));
138
210
  return;
139
211
  }
140
- getDecoration({using:1,user_id:this.uid,type:'atcard'}).then(data=>{
141
- let res=data.data.data
142
- if(res.length==0){
143
- //空 则为无主题,不再加载接口,界面设No
144
- sessionStorage.setItem('decoration_atcard'+this.uid,'no')
145
- this.bg = ""
146
- return;
212
+ getDecoration({ using: 1, user_id: this.uid, type: "atcard" }).then(
213
+ (data) => {
214
+ let res = data.data.data;
215
+ if (res.length == 0) {
216
+ //空 则为无主题,不再加载接口,界面设No
217
+ sessionStorage.setItem(
218
+ "decoration_atcard" + this.uid,
219
+ "no"
220
+ );
221
+ this.bg = "";
222
+ return;
223
+ }
224
+ sessionStorage.setItem(
225
+ "decoration_atcard" + this.uid,
226
+ JSON.stringify(res[0])
227
+ );
228
+ this.setDecoration(res[0]);
147
229
  }
148
- sessionStorage.setItem('decoration_atcard'+this.uid,JSON.stringify(res[0]))
149
- this.setDecoration(res[0])
150
- })
230
+ );
151
231
  },
152
- setDecoration(decoration_sidebar){
153
- this.bg = `url(${this.showDecoration(decoration_sidebar.val,decoration_sidebar.type)})`;
232
+ setDecoration(decoration_sidebar) {
233
+ this.bg = `url(${this.showDecoration(
234
+ decoration_sidebar.val,
235
+ decoration_sidebar.type
236
+ )})`;
154
237
  },
155
- showMedalIcon: function(val) {
238
+ showMedalIcon: function (val) {
156
239
  return __imgPath + "image/medals/user/" + val + ".gif";
157
240
  },
158
- showMedalDesc: function(item) {
241
+ showMedalDesc: function (item) {
159
242
  return item.medal_desc || medal_map[item.medal];
160
243
  },
161
- teamLink: function(team_id) {
244
+ teamLink: function (team_id) {
162
245
  return getLink("org", team_id);
163
246
  },
164
- showTeamLogo: function(val) {
247
+ showTeamLogo: function (val) {
165
248
  return getThumbnail(val, 96);
166
249
  },
167
- showLevelColor:function (level){
168
- return __userLevelColor[level]
250
+ showLevelColor: function (level) {
251
+ return __userLevelColor[level];
169
252
  },
170
- showDecoration:function(val,type){
253
+ showDecoration: function (val, type) {
171
254
  return __imgPath + `decoration/images/${val}/${type}.png`;
172
255
  },
173
- authorLink
174
- }
175
- }
256
+ authorLink,
257
+ },
258
+ };
176
259
  </script>
177
260
 
178
261
  <style lang="less">
@@ -183,8 +266,8 @@ export default {
183
266
  background-repeat: no-repeat;
184
267
  background-position: top right;
185
268
  background-size: 100% auto;
186
- .u-author{
187
- padding:5px 0 15px 5px;
269
+ .u-author {
270
+ padding: 5px 0 15px 5px;
188
271
  }
189
272
  .u-avatar {
190
273
  .fl;
@@ -192,8 +275,8 @@ export default {
192
275
  }
193
276
  img {
194
277
  border: none;
195
- margin:0;
196
- padding:0;
278
+ margin: 0;
279
+ padding: 0;
197
280
  }
198
281
  a {
199
282
  .lh(28px);
@@ -203,6 +286,13 @@ export default {
203
286
  box-shadow: none;
204
287
  }
205
288
  }
289
+ .u-displayname {
290
+ .fz(15px);
291
+ .nobreak;
292
+ max-width: 200px;
293
+ color: @color;
294
+ .bold;
295
+ }
206
296
  }
207
297
  }
208
298
  </style>
@@ -7,7 +7,7 @@
7
7
  <el-dialog :visible.sync="visible" title="插入视频" :modal-append-to-body="false">
8
8
  <a class="u-help" href="/tool/686/" target="_blank">💙 点击查看如何获取视频地址</a>
9
9
 
10
- <el-input class="u-input" type="textarea" :rows="4" v-model="videoUrl"></el-input>
10
+ <el-input class="u-input" placeholder="请输入BV号" v-model="videoUrl"></el-input>
11
11
 
12
12
  <div slot="footer">
13
13
  <el-button @click="cancel">取消</el-button>
@@ -35,10 +35,11 @@ export default {
35
35
  this.videoUrl = "";
36
36
  },
37
37
  insert() {
38
- const content = `<div class="c-article-videox">${this.videoUrl}</div>`;
38
+ const content = `<iframe class="w-player-bilibili" src="//player.bilibili.com/player.html?bvid=${this.videoUrl}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="400" height="300"> </iframe>`;
39
39
 
40
40
  this.$emit("insert", content);
41
41
 
42
+
42
43
  this.videoUrl = "";
43
44
 
44
45
  this.visible = false;