@jx3box/jx3box-editor 1.2.7 → 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.
@@ -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
+ }
@@ -8,4 +8,12 @@
8
8
  //border: 1px solid #d2d2d2;
9
9
  vertical-align: middle;
10
10
  }
11
+
12
+ .e-jx3-emotion {
13
+ .size(80px, 80px);
14
+ .mr(10px);
15
+ box-shadow: 0 0 1px inset rgba(0, 0, 0, 0.2);
16
+ //border: 1px solid #d2d2d2;
17
+ vertical-align: middle;
18
+ }
11
19
  }
@@ -178,6 +178,14 @@
178
178
  margin-bottom: 10px;
179
179
  border-radius: 6px;
180
180
  }
181
+
182
+ .e-jx3-emotion {
183
+ .size(80px, 80px);
184
+ .mr(10px);
185
+ box-shadow: 0 0 1px inset rgba(0, 0, 0, 0.2);
186
+ //border: 1px solid #d2d2d2;
187
+ vertical-align: middle;
188
+ }
181
189
  }
182
190
  }
183
191
 
@@ -6,20 +6,22 @@ function renderItem(vm, selector = ".w-jx3-element") {
6
6
  const pop_class = '.w-jx3-element-pop'
7
7
 
8
8
  // 触发时
9
- $(selector).on("mouseenter", function(e) {
9
+ $(selector).on("mouseenter", function (e) {
10
10
  clearTimeout(outer);
11
11
 
12
12
  // 获取元素数据
13
13
  let type = $(e.target).attr("data-type");
14
- if(type=='item'){
14
+ if (type == 'item') {
15
15
  vm.item.id = $(e.target).attr("data-id");
16
16
  vm.item.client = $(e.target).attr("data-client") == 'origin' ? 2 : 1;
17
- }else{
17
+ } else if (type === 'author') {
18
+ vm.author.id = $(e.target).attr("data-id");
19
+ } else {
18
20
  vm[type].client = $(e.target).attr("data-client");
19
21
  vm[type].id = $(e.target).attr("data-id");
20
22
  vm[type].level = $(e.target).attr("data-level");
21
23
  }
22
-
24
+
23
25
  // 显示浮层
24
26
  $(pop_class).fadeIn();
25
27
  vm.jx3_element.type = type
@@ -39,18 +41,18 @@ function renderItem(vm, selector = ".w-jx3-element") {
39
41
  });
40
42
 
41
43
  // 移除时
42
- $(selector).on("mouseleave", function(e) {
44
+ $(selector).on("mouseleave", function (e) {
43
45
  outer = setTimeout(() => {
44
46
  $(pop_class).fadeOut();
45
47
  }, 380);
46
48
  });
47
49
 
48
50
  // POP内停留
49
- $(pop_class).on("mouseenter", function(e) {
51
+ $(pop_class).on("mouseenter", function (e) {
50
52
  clearTimeout(outer);
51
53
  $(pop_class).fadeIn();
52
54
  });
53
- $(pop_class).on("mouseleave", function(e) {
55
+ $(pop_class).on("mouseleave", function (e) {
54
56
  clearTimeout(inner);
55
57
  inner = setTimeout(() => {
56
58
  $(pop_class).fadeOut();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jx3box/jx3box-editor",
3
- "version": "1.2.7",
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": "^6.7.8",
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",
@@ -0,0 +1,29 @@
1
+ import { $next, $cms, $team } from "@jx3box/jx3box-common/js/https";
2
+
3
+ async function getUserMedals(uid) {
4
+ const res = await $next({ mute: true })
5
+ .get("/api/user/" + uid + "/medals");
6
+ return res.data.data;
7
+ }
8
+
9
+ async function getUserInfo(uid) {
10
+ const res = await $cms({ mute: true })
11
+ .get(`/api/cms/user/${uid}/info`);
12
+ return res.data.data;
13
+ }
14
+
15
+ async function getUserPublicTeams(uid) {
16
+ const res = await $team({ mute: true }).get(`/api/team/relation/public`, {
17
+ params: {
18
+ uid: uid,
19
+ },
20
+ });
21
+ return res.data.data;
22
+ }
23
+
24
+
25
+ export {
26
+ getUserMedals,
27
+ getUserInfo,
28
+ getUserPublicTeams,
29
+ }
package/service/cms.js CHANGED
@@ -4,4 +4,18 @@ function uploadFile(data) {
4
4
  return $cms().post(`/api/cms/upload`, data);
5
5
  }
6
6
 
7
- export { uploadFile };
7
+ // 获取用户列表
8
+ function loadAuthors(params){
9
+ return $cms().get(`/api/cms/user/list`, {
10
+ params: params
11
+ });
12
+ }
13
+
14
+ // 获取表情列表
15
+ function loadEmotions(params){
16
+ return $cms().get(`/api/cms/post/emotions`, {
17
+ params: params
18
+ });
19
+ }
20
+
21
+ export { uploadFile, loadAuthors, loadEmotions };
package/src/Article.vue CHANGED
@@ -54,6 +54,7 @@
54
54
  v-show="jx3_element.type == 'skill'"
55
55
  />
56
56
  <jx3-npc :client="npc.client" :id="npc.id" v-show="jx3_element.type === 'npc'" />
57
+ <jx3-author :uid="author.id" v-show="jx3_element.type === 'author'" />
57
58
  </div>
58
59
  <!-- <gallery :images="images" :index="gallery_index" @close="index = null"></gallery> -->
59
60
  </div>
@@ -98,6 +99,7 @@ import Item from "./Item";
98
99
  import Buff from "./Buff";
99
100
  import Skill from "./Skill";
100
101
  import Npc from "./Npc";
102
+ import Author from "./Author";
101
103
  import renderJx3Element from "../assets/js/jx3_element";
102
104
 
103
105
  export default {
@@ -144,6 +146,9 @@ export default {
144
146
  client : 'std',
145
147
  id : '',
146
148
  },
149
+ author: {
150
+ id: '',
151
+ },
147
152
  // COMMON
148
153
  jx3_element: {
149
154
  style: {
@@ -274,6 +279,7 @@ export default {
274
279
  "jx3-buff": Buff,
275
280
  "jx3-skill": Skill,
276
281
  "jx3-npc": Npc,
282
+ "jx3-author": Author,
277
283
  // "gallery":gallery,
278
284
  // VueViewer
279
285
  },
package/src/Author.vue ADDED
@@ -0,0 +1,151 @@
1
+ <template>
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>
32
+ </div>
33
+ </div>
34
+ </template>
35
+
36
+ <script>
37
+ import { authorLink, getLink, getThumbnail } from "@jx3box/jx3box-common/js/utils";
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"
43
+ import medal from "./components/medal.vue"
44
+ export default {
45
+ name: "Author",
46
+ components: {
47
+ medal,
48
+ Avatar
49
+ },
50
+ props: ["uid"],
51
+ data: () => ({
52
+ data: null,
53
+ medals: [],
54
+ teams: [],
55
+ loading: false
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
+ },
81
+ methods: {
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 (){
93
+ return getUserInfo(this.uid)
94
+ .then((data) => {
95
+ this.data = data;
96
+ })
97
+ },
98
+ loadMedals: function() {
99
+ return getUserMedals(this.uid).then((data) => {
100
+ console.log(data)
101
+ this.medals = data;
102
+ });
103
+ },
104
+ loadTeams: function() {
105
+ return getUserPublicTeams(this.uid).then((data) => {
106
+ this.teams = data && data.slice(0, 5);
107
+ });
108
+ },
109
+
110
+ showMedalIcon: function(val) {
111
+ return __imgPath + "image/medals/user/" + val + ".gif";
112
+ },
113
+ showMedalDesc: function(item) {
114
+ return item.medal_desc || medal_map[item.medal];
115
+ },
116
+ teamLink: function(team_id) {
117
+ return getLink("org", team_id);
118
+ },
119
+ showTeamLogo: function(val) {
120
+ return getThumbnail(val, 96);
121
+ },
122
+ showLevelColor:function (level){
123
+ return __userLevelColor[level]
124
+ },
125
+ authorLink
126
+ }
127
+ }
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
@@ -8,8 +8,8 @@
8
8
  <div class="c-resource-content" v-loading="loading">
9
9
  <div class="m-database-search">
10
10
  <el-radio-group class="u-client" v-model="client" @change="search">
11
- <el-radio-button label="std">正式服</el-radio-button>
12
- <el-radio-button label="origin">怀旧服</el-radio-button>
11
+ <el-radio-button label="std">重制</el-radio-button>
12
+ <el-radio-button label="origin">缘起</el-radio-button>
13
13
  </el-radio-group>
14
14
  <el-input class="u-input" placeholder="请输入 ID 或 名称" v-model="query" @change="search" @keyup.enter.native="search">
15
15
  <template slot="prepend">ID /名称</template>
@@ -21,13 +21,13 @@
21
21
 
22
22
  <el-tabs class="m-database-tabs" v-model="type" type="card" @tab-click="changeType">
23
23
  <el-tab-pane label="Buff" name="buff">
24
- <span slot="label">
24
+ <span slot="label" class="u-tab-label">
25
25
  <img class="u-icon" svg-inline src="../assets/img/buff.svg" />
26
26
  <b>Buff</b>
27
27
  <em class="u-count">{{ stat.buff }}</em>
28
28
  </span>
29
- <div v-if="buff.length && done" class="m-resource-count">
30
- <i class="el-icon-s-data"></i> 共找到 <b>{{ buff.length }}</b> 条记录
29
+ <div v-if="total && done" class="m-resource-count">
30
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
31
31
  <div class="u-mode">
32
32
  插入模式:
33
33
  <el-radio-group v-model="buff_mode" size="mini" @change="changeMode">
@@ -55,13 +55,13 @@
55
55
  <el-alert v-if="!buff.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
56
56
  </el-tab-pane>
57
57
  <el-tab-pane label="技能" name="skill">
58
- <span slot="label">
58
+ <span slot="label" class="u-tab-label">
59
59
  <img class="u-icon" svg-inline src="../assets/img/skill.svg" />
60
60
  <b>技能</b>
61
61
  <em class="u-count">{{ stat.skill }}</em>
62
62
  </span>
63
- <div v-if="skill.length && done" class="m-resource-count">
64
- <i class="el-icon-s-data"></i> 共找到 <b>{{ skill.length }}</b> 条记录
63
+ <div v-if="total && done" class="m-resource-count">
64
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
65
65
  <div class="u-mode">
66
66
  插入模式:
67
67
  <el-radio-group v-model="skill_mode" size="mini" @change="changeMode">
@@ -88,13 +88,13 @@
88
88
  <el-alert v-if="!skill.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
89
89
  </el-tab-pane>
90
90
  <el-tab-pane label="物品" name="item">
91
- <span slot="label">
91
+ <span slot="label" class="u-tab-label">
92
92
  <img class="u-icon" svg-inline src="../assets/img/item.svg" />
93
93
  <b>物品</b>
94
94
  <em class="u-count">{{ stat.item }}</em>
95
95
  </span>
96
- <p v-if="item.length && done" class="m-resource-count">
97
- <i class="el-icon-s-data"></i> 共找到 <b>{{ item.length }}</b> 条记录
96
+ <p v-if="total && done" class="m-resource-count">
97
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
98
98
  </p>
99
99
  <ul class="m-resource-list" v-if="item.length">
100
100
  <el-popover popper-class="m-item-pop" :visible-arrow="false" trigger="hover" placement="left" v-for="(o, i) in item" :key="i">
@@ -108,19 +108,19 @@
108
108
  </span>
109
109
  </li>
110
110
 
111
- <jx3-item :item_id="o.id"></jx3-item>
111
+ <jx3-item :item_id="o.id" :client="client"></jx3-item>
112
112
  </el-popover>
113
113
  </ul>
114
114
  <el-alert v-if="!item.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
115
115
  </el-tab-pane>
116
116
  <el-tab-pane label="Npc" name="npc">
117
- <span slot="label">
117
+ <span slot="label" class="u-tab-label">
118
118
  <img class="u-icon" svg-inline src="../assets/img/npc/skull.svg" />
119
119
  <b>Npc</b>
120
120
  <em class="u-count">{{ stat.npc }}</em>
121
121
  </span>
122
- <p v-if="npc.length && done" class="m-resource-count">
123
- <i class="el-icon-s-data"></i> 共找到 <b>{{ npc.length }}</b> 条记录
122
+ <p v-if="total && done" class="m-resource-count">
123
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
124
124
  </p>
125
125
  <ul class="m-resource-list" v-if="npc.length">
126
126
  <li v-for="(o, i) in npc" :key="i" class="u-item" :class="{ on: o.isSelected }" @click="selectNpc(o, i)" ref="item">
@@ -143,7 +143,7 @@
143
143
  <el-alert v-if="!npc.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
144
144
  </el-tab-pane>
145
145
  <el-tab-pane label="图标" name="icon">
146
- <span slot="label">
146
+ <span slot="label" class="u-tab-label">
147
147
  <img class="u-icon" svg-inline src="../assets/img/icons.svg" />
148
148
  <b>图标</b>
149
149
  <em class="u-count">{{ stat.icon }}</em>
@@ -164,6 +164,42 @@
164
164
  </ul>
165
165
  <el-alert v-if="!icon.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
166
166
  </el-tab-pane>
167
+ <el-tab-pane label="魔盒用户" name="authors">
168
+ <span slot="label" class="u-tab-label">
169
+ <i class="el-icon-s-custom"></i>
170
+ <b>魔盒用户</b>
171
+ </span>
172
+ <p v-if="total && done" class="m-resource-count">
173
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
174
+ </p>
175
+ <ul class="m-resource-list">
176
+ <li v-for="(o, i) in authors" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectAuthor(o, i)" ref="author">
177
+ <span class="u-id">ID:{{ o.ID }}</span>
178
+ <img class="u-pic" :title="'AuthorID:' + o.display_name" :src="userAvatar(o.user_avatar)" />
179
+ <span class="u-primary">
180
+ <span class="u-name">
181
+ {{ o.display_name }}
182
+ </span>
183
+ </span>
184
+ </li>
185
+ </ul>
186
+ <el-alert v-if="!authors.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
187
+ </el-tab-pane>
188
+ <!-- <el-tab-pane label="表情" name="emotions">
189
+ <span slot="label" class="u-tab-label">
190
+ <i class="el-icon-sugar"></i>
191
+ <b>表情</b>
192
+ </span>
193
+ <p v-if="total && done" class="m-resource-count">
194
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ total }}</b> 条记录
195
+ </p>
196
+ <ul class="m-resource-iconlist">
197
+ <li v-for="(o, i) in emotions" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectEmotion(o)" ref="emotion">
198
+ <img class="e-jx3-emotion" :src="userAvatar(o.url)" :alt="query" />
199
+ </li>
200
+ </ul>
201
+ <el-alert v-if="!emotions.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
202
+ </el-tab-pane> -->
167
203
  </el-tabs>
168
204
 
169
205
  <template v-if="multipage">
@@ -198,9 +234,12 @@
198
234
 
199
235
  <script>
200
236
  import { loadResource, loadStat, getIcons } from "../service/database";
237
+ import { loadAuthors, loadEmotions } from "../service/cms";
238
+ import { getUserInfo } from "../service/author";
201
239
  import { __ossRoot, __iconPath, __Root, __OriginRoot } from "@jx3box/jx3box-common/data/jx3box.json";
202
240
  import detach_types from "../assets/data/detach_type.json";
203
- import { iconLink,getLink } from "@jx3box/jx3box-common/js/utils";
241
+ import { iconLink, getLink, showAvatar } from "@jx3box/jx3box-common/js/utils";
242
+ import User from "@jx3box/jx3box-common/js/user";
204
243
  import Item from './Item.vue';
205
244
  export default {
206
245
  name: "Resource",
@@ -214,6 +253,7 @@ export default {
214
253
  return {
215
254
  dialogVisible: false,
216
255
  actived: false,
256
+ userInfo: {},
217
257
 
218
258
  type: "buff",
219
259
  query: "",
@@ -225,6 +265,9 @@ export default {
225
265
  item: [],
226
266
  icon: [],
227
267
  npc: [],
268
+ authors: [],
269
+ selectedAuthor: {},
270
+ emotions: [],
228
271
 
229
272
  stat: {
230
273
  skill: 0,
@@ -273,6 +316,15 @@ export default {
273
316
  iconDir: function() {
274
317
  return this.client == "origin" ? "origin_icon" : "icon";
275
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
+ },
276
328
  },
277
329
  watch: {
278
330
  html: function(newval) {
@@ -284,6 +336,7 @@ export default {
284
336
  if (!this.query) return;
285
337
 
286
338
  this.loading = true;
339
+ this.per = 10;
287
340
  this.done = false;
288
341
  let query = this.query;
289
342
  let params = {
@@ -316,8 +369,45 @@ export default {
316
369
  this.loading = false;
317
370
  }
318
371
 
319
- // 非图标
372
+ } else if (this.type === 'authors') {
373
+ params = {
374
+ ...params,
375
+ name: query,
376
+ }
377
+ loadAuthors(params)
378
+ .then((res) => {
379
+ if (!append) this.authors = [];
380
+ let list = this.transformData(res.data.data.list)
381
+ this.authors = this.authors.concat(list);
382
+ this.pages = res.data.data.pages;
383
+ this.total = res.data.data.total;
384
+ })
385
+ .finally(() => {
386
+ this.done = true;
387
+ this.loading = false;
388
+ });
389
+
390
+ } else if (this.type === 'emotions') {
391
+ this.per = 30;
392
+ params = {
393
+ per: this.per,
394
+ page: page,
395
+ search: query,
396
+ }
397
+ loadEmotions(params)
398
+ .then((res) => {
399
+ if (!append) this.emotions = [];
400
+ let list = this.transformData(res.data.data.list)
401
+ this.emotions = this.emotions.concat(list);
402
+ this.pages = res.data.data.pages;
403
+ this.total = res.data.data.total;
404
+ })
405
+ .finally(() => {
406
+ this.done = true;
407
+ this.loading = false;
408
+ });
320
409
  } else {
410
+ // 非图标
321
411
  loadResource(this.type, query, params)
322
412
  .then((data) => {
323
413
  if (!append) this[this.type] = [];
@@ -327,7 +417,7 @@ export default {
327
417
  this.pages = data.last_page;
328
418
  this.total = data.total;
329
419
  } else {
330
- list = this.transformData(data.list);
420
+ list = this.transformData(data.list || []);
331
421
  this.pages = data.pages;
332
422
  this.total = data.total;
333
423
  }
@@ -352,10 +442,38 @@ export default {
352
442
  changeType: function() {
353
443
  this.page = 1;
354
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
+ }
355
461
  },
356
462
  insert: function() {
357
- this.dialogVisible = false;
358
- this.$emit("insert", this.html);
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
+ }
359
477
  },
360
478
  transformData: function(data) {
361
479
  data.forEach((item) => {
@@ -407,7 +525,18 @@ export default {
407
525
  selectNpc: function (o, i){
408
526
  this.resetItems()
409
527
  o.isSelected = true
410
- 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>`
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>`
529
+ },
530
+ selectAuthor: function (o){
531
+ this.resetItems();
532
+ this.selectAuthor = o;
533
+ o.isSelected = true;
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>`
535
+ },
536
+ selectEmotion: function (o){
537
+ this.resetItems();
538
+ o.isSelected = true;
539
+ this.html = `<img class="e-jx3-emotion" style="width:80px;" src="${o.url}" alt="${o.id}"/>`
411
540
  },
412
541
  resetItems: function() {
413
542
  let data = this[this.type];
@@ -430,6 +559,16 @@ export default {
430
559
  let domain = this.client == "origin" ? __OriginRoot : __Root;
431
560
  return domain + getLink(type,id).slice(1)
432
561
  },
562
+ userAvatar: function(url) {
563
+ return showAvatar(url);
564
+ },
565
+ loadUserInfo: function (){
566
+ if (!this.uid) return;
567
+ return getUserInfo(this.uid)
568
+ .then((data) => {
569
+ this.userInfo = data;
570
+ })
571
+ },
433
572
 
434
573
  // 杂项
435
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>
@@ -0,0 +1,43 @@
1
+ <template>
2
+ <div class="m-medal">
3
+ <a :href="medalLink(item)" target="_blank" class="u-medal" v-for="item in medals" :key="item.id" :title="item.medal_desc">
4
+ <img class="u-medal-img" :src="showIcon(item.medal)">
5
+ </a>
6
+ </div>
7
+ </template>
8
+
9
+ <script>
10
+ import { getMedalLink } from '@jx3box/jx3box-common/js/utils'
11
+ export default {
12
+ name: 'author_medal',
13
+ props: {
14
+ medals: {
15
+ type: Array,
16
+ default: () => [], // [{ rank_id, medal_desc, medal }]
17
+ },
18
+ showIcon: {
19
+ type: Function,
20
+ default: () => true,
21
+ }
22
+ },
23
+ methods: {
24
+
25
+ medalLink({ rank_id, medal_type = 'rank' }) {
26
+ return getMedalLink(rank_id, medal_type)
27
+ }
28
+ }
29
+ }
30
+ </script>
31
+
32
+ <style lang="less">
33
+ .m-medal {
34
+ display: flex;
35
+ .u-medal {
36
+ cursor: pointer;
37
+ .u-medal-img {
38
+ width: 20px;
39
+ height: 20px;
40
+ }
41
+ }
42
+ }
43
+ </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
- "target": process.env["DEV_SERVER"] == "true" ? "http://localhost:51818" : "https://next.jx3box.com",
73
- "onProxyReq": function (request) {
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