@jx3box/jx3box-common-ui 5.4.2 → 5.4.7
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-common-ui",
|
|
3
|
-
"version": "5.4.
|
|
3
|
+
"version": "5.4.7",
|
|
4
4
|
"description": "JX3BOX UI",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"build": "vue-cli-service build",
|
|
10
10
|
"lint": "vue-cli-service lint",
|
|
11
11
|
"inspect": "vue inspect > output.js",
|
|
12
|
-
"update": "npm --registry https://registry.npmjs.org install @jx3box/jx3box-common@latest @jx3box/jx3box-data@latest",
|
|
12
|
+
"update": "npm --registry https://registry.npmjs.org install @jx3box/jx3box-common@latest @jx3box/jx3box-data@latest @jx3box/jx3box-editor@latest @jx3box/jx3box-comment-ui@latest",
|
|
13
13
|
"header": "vue-cli-service build --target lib --name newheader src/Header.vue && cp public/index.html dist/newheader.html"
|
|
14
14
|
},
|
|
15
15
|
"eslintConfig": {
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"@jx3box/jx3box-comment-ui": "^1.6.6",
|
|
34
34
|
"@jx3box/jx3box-common": "^6.7.8",
|
|
35
35
|
"@jx3box/jx3box-data": "^1.8.3",
|
|
36
|
-
"@jx3box/jx3box-editor": "^1.0.
|
|
36
|
+
"@jx3box/jx3box-editor": "^1.0.8",
|
|
37
37
|
"axios": "^0.19.2",
|
|
38
38
|
"element-ui": "^2.13.2",
|
|
39
39
|
"jquery": "^3.5.1",
|
package/src/App.vue
CHANGED
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
|
|
9
9
|
<LeftSidebar :open="true">
|
|
10
10
|
<LeftSideToggle :mobileOnly="true" />
|
|
11
|
-
<div id="directory"></div>
|
|
12
11
|
<Author :author="author" :uid="8" />
|
|
13
12
|
</LeftSidebar>
|
|
14
13
|
|
|
@@ -16,13 +15,13 @@
|
|
|
16
15
|
<el-tabs v-model="tab" type="card">
|
|
17
16
|
<el-tab-pane label="CMS作品" name="post">
|
|
18
17
|
<el-radio-group v-model="post_id">
|
|
19
|
-
<el-radio label="35605"
|
|
18
|
+
<el-radio label="35605">Markdown</el-radio>
|
|
20
19
|
<el-radio label="32035">仅小册</el-radio>
|
|
21
20
|
<el-radio label="30017">仅联合创作者</el-radio>
|
|
22
21
|
<el-radio label="30582">小册和联合创作者</el-radio>
|
|
23
22
|
<el-radio label="31129">无小册和联合创作者</el-radio>
|
|
24
23
|
</el-radio-group>
|
|
25
|
-
<singlebox :post="post" />
|
|
24
|
+
<singlebox :post="post" @extendUpdate="updateExtend"/>
|
|
26
25
|
</el-tab-pane>
|
|
27
26
|
<el-tab-pane label="通用组件" name="widget">
|
|
28
27
|
<PostHeader :post="post" />
|
|
@@ -80,6 +79,7 @@
|
|
|
80
79
|
|
|
81
80
|
<RightSidebar>
|
|
82
81
|
<RightSideMsg>Hello</RightSideMsg>
|
|
82
|
+
<div id="directory"></div>
|
|
83
83
|
<PostCollection :id="59" />
|
|
84
84
|
</RightSidebar>
|
|
85
85
|
|
|
@@ -213,6 +213,9 @@ export default {
|
|
|
213
213
|
this.$forceUpdate()
|
|
214
214
|
});
|
|
215
215
|
},
|
|
216
|
+
updateExtend : function (val){
|
|
217
|
+
console.log(val)
|
|
218
|
+
}
|
|
216
219
|
},
|
|
217
220
|
watch: {
|
|
218
221
|
post_id: {
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="m-single-directory"></div>
|
|
3
|
+
</template>
|
|
4
|
+
|
|
5
|
+
<script>
|
|
6
|
+
export default {
|
|
7
|
+
name : 'PostDirectory',
|
|
8
|
+
props:[],
|
|
9
|
+
components : {},
|
|
10
|
+
data : function(){
|
|
11
|
+
return {
|
|
12
|
+
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
computed:{},
|
|
16
|
+
watch:{},
|
|
17
|
+
methods:{},
|
|
18
|
+
filters:{},
|
|
19
|
+
created:function(){},
|
|
20
|
+
mounted:function(){},
|
|
21
|
+
}
|
|
22
|
+
</script>
|
|
23
|
+
|
|
24
|
+
<style lang="less">
|
|
25
|
+
.c-article-directory {
|
|
26
|
+
h1,
|
|
27
|
+
h2,
|
|
28
|
+
h3,
|
|
29
|
+
h4,
|
|
30
|
+
h5,
|
|
31
|
+
h6 {
|
|
32
|
+
margin: 0;
|
|
33
|
+
padding: 0;
|
|
34
|
+
cursor: pointer;
|
|
35
|
+
font-weight: normal;
|
|
36
|
+
white-space: nowrap;
|
|
37
|
+
word-wrap: normal;
|
|
38
|
+
word-break: keep-all;
|
|
39
|
+
text-overflow: ellipsis;
|
|
40
|
+
overflow: hidden;
|
|
41
|
+
letter-spacing: 0.2px;
|
|
42
|
+
line-height: 20px;
|
|
43
|
+
padding: 8px 0;
|
|
44
|
+
&:hover {
|
|
45
|
+
// font-weight: 600;
|
|
46
|
+
color: #0366d6;
|
|
47
|
+
}
|
|
48
|
+
font-size: 12px;
|
|
49
|
+
}
|
|
50
|
+
a {
|
|
51
|
+
color: @color;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
h1,
|
|
55
|
+
h2,
|
|
56
|
+
h3,
|
|
57
|
+
h4,
|
|
58
|
+
h5,
|
|
59
|
+
h6 {
|
|
60
|
+
&::before {
|
|
61
|
+
content: "\e78b";
|
|
62
|
+
|
|
63
|
+
font-family: element-icons !important;
|
|
64
|
+
speak: none;
|
|
65
|
+
font-style: normal;
|
|
66
|
+
font-weight: 400;
|
|
67
|
+
font-variant: normal;
|
|
68
|
+
text-transform: none;
|
|
69
|
+
line-height: 1;
|
|
70
|
+
vertical-align: baseline;
|
|
71
|
+
display: inline-block;
|
|
72
|
+
-webkit-font-smoothing: antialiased;
|
|
73
|
+
margin-right: 5px;
|
|
74
|
+
font-size: 16px;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
// .hasChild {
|
|
79
|
+
// font-size: 14px;
|
|
80
|
+
// &::before {
|
|
81
|
+
// content: "\e784";
|
|
82
|
+
// }
|
|
83
|
+
// }
|
|
84
|
+
|
|
85
|
+
// h2,h3,h4,h5,h6{
|
|
86
|
+
// margin-left: 20px;
|
|
87
|
+
// }
|
|
88
|
+
// .hasChild{
|
|
89
|
+
// margin-left: 0;
|
|
90
|
+
// }
|
|
91
|
+
|
|
92
|
+
// h3 + h2,h4 + h3,h5 + h4,h6 + h5{
|
|
93
|
+
// margin-left: 0;
|
|
94
|
+
// }
|
|
95
|
+
|
|
96
|
+
.lv2 {
|
|
97
|
+
padding-left: 20px;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.lv3 {
|
|
101
|
+
padding-left: 40px;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.lv0 {
|
|
105
|
+
display: none;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.c-article-directory-title {
|
|
110
|
+
margin-bottom: 5px;
|
|
111
|
+
.c-article-directory-title-label {
|
|
112
|
+
font-weight: 300;
|
|
113
|
+
font-size: 20px;
|
|
114
|
+
// cursor: pointer;
|
|
115
|
+
// &:hover {
|
|
116
|
+
// color: #f39;
|
|
117
|
+
// }
|
|
118
|
+
}
|
|
119
|
+
.c-article-directory-title-skip,
|
|
120
|
+
.c-article-directory-title-folder {
|
|
121
|
+
font-size: 14px;
|
|
122
|
+
float: right;
|
|
123
|
+
padding: 0 5px;
|
|
124
|
+
line-height: 25px;
|
|
125
|
+
color: darken(#dcdfe6, 5%);
|
|
126
|
+
cursor: pointer;
|
|
127
|
+
&:hover {
|
|
128
|
+
color: darken(#dcdfe6, 20%);
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
.c-article-directory-content {
|
|
133
|
+
padding: 10px 15px;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
@keyframes focusFade {
|
|
137
|
+
from {
|
|
138
|
+
background-color: #c3fcff;
|
|
139
|
+
}
|
|
140
|
+
to {
|
|
141
|
+
background-color: transparent;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.c-article .isScrollFocus {
|
|
146
|
+
animation: focusFade 0.5s ease-in-out;
|
|
147
|
+
}
|
|
148
|
+
</style>
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
<!-- 联合创作者 -->
|
|
11
11
|
<Creators class="m-single-creators" :postId="id" :postType="post_type" />
|
|
12
12
|
<!-- 文集小册 -->
|
|
13
|
-
<Collection class="m-single-collection" :id="collection_id" :defaultVisible="collection_collapse" />
|
|
13
|
+
<Collection class="m-single-collection" :id="collection_id" :defaultVisible="collection_collapse" @collectionUpdate="updateCollection"/>
|
|
14
14
|
<slot name="single-prepend"></slot>
|
|
15
15
|
</div>
|
|
16
16
|
|
|
@@ -18,9 +18,9 @@
|
|
|
18
18
|
<div class="m-single-post" v-if="visible">
|
|
19
19
|
<el-divider content-position="left">JX3BOX</el-divider>
|
|
20
20
|
<div class="m-single-content">
|
|
21
|
-
<ArticleMarkdown v-if="isMarkdown" :content="post_content" />
|
|
22
|
-
<Article v-else :content="post_content" />
|
|
23
21
|
<slot></slot>
|
|
22
|
+
<ArticleMarkdown v-if="isMarkdown" :content="post_content" @directoryRendered="updateDirectory"/>
|
|
23
|
+
<Article v-else :content="post_content" @directoryRendered="updateDirectory"/>
|
|
24
24
|
</div>
|
|
25
25
|
</div>
|
|
26
26
|
<div class="m-single-null" v-else>
|
|
@@ -29,11 +29,12 @@
|
|
|
29
29
|
|
|
30
30
|
<!-- 文章后 -->
|
|
31
31
|
<div class="m-single-append">
|
|
32
|
-
<!-- 打赏 -->
|
|
33
|
-
<Thx class="m-single-thx" :postId="id" :postType="post_type" :userId="author_id" :adminBoxcoinEnable="true" :userBoxcoinEnable="true"/>
|
|
34
32
|
|
|
35
33
|
<slot name="single-append"></slot>
|
|
36
34
|
|
|
35
|
+
<!-- 打赏 -->
|
|
36
|
+
<Thx class="m-single-thx" :postId="id" :postType="post_type" :userId="author_id" :adminBoxcoinEnable="true" :userBoxcoinEnable="true"/>
|
|
37
|
+
|
|
37
38
|
<!-- 评论 -->
|
|
38
39
|
<div class="m-single-comment">
|
|
39
40
|
<el-divider content-position="left">评论</el-divider>
|
|
@@ -72,6 +73,8 @@ export default {
|
|
|
72
73
|
props: ["post", "stat"],
|
|
73
74
|
data: function() {
|
|
74
75
|
return {
|
|
76
|
+
collection_data : '',
|
|
77
|
+
directory : false
|
|
75
78
|
};
|
|
76
79
|
},
|
|
77
80
|
computed: {
|
|
@@ -110,8 +113,31 @@ export default {
|
|
|
110
113
|
},
|
|
111
114
|
allow_comment : function (){
|
|
112
115
|
return !this.post?.comment
|
|
116
|
+
},
|
|
117
|
+
extend_data : function (){
|
|
118
|
+
return {
|
|
119
|
+
collection_data : this.collection_data,
|
|
120
|
+
directory : this.directory
|
|
121
|
+
}
|
|
113
122
|
}
|
|
114
123
|
},
|
|
124
|
+
methods : {
|
|
125
|
+
updateCollection : function (val){
|
|
126
|
+
this.collection_data = val
|
|
127
|
+
},
|
|
128
|
+
updateDirectory : function (val){
|
|
129
|
+
this.directory = val
|
|
130
|
+
}
|
|
131
|
+
},
|
|
132
|
+
watch : {
|
|
133
|
+
extend_data : {
|
|
134
|
+
deep : true,
|
|
135
|
+
immediate : true,
|
|
136
|
+
handler : function (val){
|
|
137
|
+
this.$emit('extendUpdate',val)
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
}
|
|
115
141
|
};
|
|
116
142
|
</script>
|
|
117
143
|
|