|
@@ -1,5 +1,5 @@
|
1
|
1
|
import { Component } from 'react'
|
2
|
|
-import { View, Text, Button, Image, scrollView, Input } from '@tarojs/components'
|
|
2
|
+import { View, Text, Button, Image, scrollView, Input, RichText } from '@tarojs/components'
|
3
|
3
|
import * as api from '../../../../service/index'
|
4
|
4
|
import tool from '../../../../common/tool'
|
5
|
5
|
import Taro, { getCurrentInstance } from '@tarojs/taro'
|
|
@@ -12,12 +12,15 @@ export default class collection extends Component {
|
12
|
12
|
booksinfo: {},
|
13
|
13
|
is_collect: 0,//是否加入书架,0|1
|
14
|
14
|
likeBookList: [],
|
15
|
|
- lastTime: 0
|
|
15
|
+ lastTime: 0,
|
|
16
|
+ isOpendDrectory: false,//是否打开目录
|
|
17
|
+ free_content: '',//免费章节
|
16
|
18
|
}
|
17
|
19
|
|
18
|
20
|
componentWillMount () {
|
19
|
21
|
this.getBookinfo()
|
20
|
22
|
this.getBookLike()
|
|
23
|
+ this.getAppConfig()
|
21
|
24
|
}
|
22
|
25
|
componentDidShow () {
|
23
|
26
|
}
|
|
@@ -30,6 +33,15 @@ export default class collection extends Component {
|
30
|
33
|
}
|
31
|
34
|
})
|
32
|
35
|
}
|
|
36
|
+ getAppConfig () {
|
|
37
|
+ api.getAppConfig().then(res => {
|
|
38
|
+ if (res.code == 200) {
|
|
39
|
+ this.setState({
|
|
40
|
+ isOpendDrectory: res.data.status_chapter == 0 ? false : true
|
|
41
|
+ })
|
|
42
|
+ }
|
|
43
|
+ })
|
|
44
|
+ }
|
33
|
45
|
getBookinfo () {
|
34
|
46
|
let routers = this.$instance.router.params
|
35
|
47
|
api.getBookinfo({ book_id: routers.book_id }).then(res => {
|
|
@@ -37,6 +49,8 @@ export default class collection extends Component {
|
37
|
49
|
this.setState({
|
38
|
50
|
booksinfo: res.data.book_info[0],
|
39
|
51
|
is_collect: res.data.is_collect
|
|
52
|
+ }, () => {
|
|
53
|
+ this.getBookFreeContent()
|
40
|
54
|
})
|
41
|
55
|
}
|
42
|
56
|
})
|
|
@@ -112,6 +126,55 @@ export default class collection extends Component {
|
112
|
126
|
}
|
113
|
127
|
})
|
114
|
128
|
})
|
|
129
|
+
|
|
130
|
+ }
|
|
131
|
+ copyBookTips () {
|
|
132
|
+ Taro.setClipboardData({
|
|
133
|
+ data: this.state.booksinfo.intro,
|
|
134
|
+ success: function (res) {
|
|
135
|
+ Taro.showToast({
|
|
136
|
+ title: `复制成功`,
|
|
137
|
+ icon: 'none',
|
|
138
|
+ mask: true,
|
|
139
|
+ });
|
|
140
|
+ }
|
|
141
|
+ })
|
|
142
|
+ }
|
|
143
|
+ convertToPlainText(html) {
|
|
144
|
+ var temp = document.createElement("div");
|
|
145
|
+ temp.innerHTML = html;
|
|
146
|
+ var plainText = temp.textContent || temp.innerText;
|
|
147
|
+ plainText = plainText.replace(/ /g, " ");
|
|
148
|
+ plainText = plainText.replace(/…/g, "…");
|
|
149
|
+ plainText = plainText.replace(/—/g, "—");
|
|
150
|
+ plainText = plainText.replace(/“/g, "“");
|
|
151
|
+ plainText = plainText.replace(/”/g, "”");
|
|
152
|
+ return plainText;
|
|
153
|
+ }
|
|
154
|
+ getBookFreeContent () {
|
|
155
|
+ api.getBookFreeContent({ book_id: this.state.booksinfo.id }).then(res => {
|
|
156
|
+ if (res.code == 200) {
|
|
157
|
+ // const plainText = res.data.replace(/<[^>]+>/g, '');
|
|
158
|
+ const plainText = this.convertToPlainText(res.data)
|
|
159
|
+ this.setState({
|
|
160
|
+ free_content: plainText
|
|
161
|
+ })
|
|
162
|
+ }
|
|
163
|
+ })
|
|
164
|
+ }
|
|
165
|
+
|
|
166
|
+ copySelectedTips () {
|
|
167
|
+ const { free_content } = this.state;
|
|
168
|
+ Taro.setClipboardData({
|
|
169
|
+ data: free_content,
|
|
170
|
+ success: function (res) {
|
|
171
|
+ Taro.showToast({
|
|
172
|
+ title: `复制成功`,
|
|
173
|
+ icon: 'none',
|
|
174
|
+ mask: true,
|
|
175
|
+ });
|
|
176
|
+ }
|
|
177
|
+ })
|
115
|
178
|
}
|
116
|
179
|
|
117
|
180
|
render () {
|
|
@@ -122,23 +185,30 @@ export default class collection extends Component {
|
122
|
185
|
<Image className='book-img' src={this.state.booksinfo.img}></Image>
|
123
|
186
|
<View className='top-right'>
|
124
|
187
|
<View className='book-title'>{tool.ellipsis(this.state.booksinfo.name, 15)}</View>
|
125
|
|
- <View className='book-visit-num'>{this.state.booksinfo.paly_cnt}游览</View>
|
|
188
|
+ <View className='book-visit-num'>{this.state.booksinfo.paly_cnt}浏览</View>
|
126
|
189
|
</View>
|
127
|
190
|
<View className='share update-active' onClick={e => (this.copyCode())}>
|
128
|
191
|
<Image className='share-img' mode='widthFix' src='https://video-img.fyshark.com/1684206675357shykahfgl.png'></Image>
|
129
|
192
|
</View>
|
130
|
193
|
</View>
|
131
|
194
|
<View className='book-tips'>
|
132
|
|
- <View className='book-tips-title'>书籍简介</View>
|
|
195
|
+ <View className='book-tips-title'>
|
|
196
|
+ 书籍简介
|
|
197
|
+ <Image className='book-tips-copy' onClick={e => (this.copyBookTips())} src='https://video-img.fyshark.com/1686882094575dahkn.png'></Image>
|
|
198
|
+ </View>
|
133
|
199
|
<View className='book-tips-content'>{this.state.booksinfo.intro} </View>
|
134
|
200
|
</View>
|
135
|
|
- <View className='directory' onClick={e => (this.toDirectory())}>
|
136
|
|
- <View className='directory-left'>
|
137
|
|
- <Image className='directory-icon' src='https://video-img.fyshark.com/1683618704652dadda%20.png'></Image>
|
138
|
|
- <View className='derectory-title'>查看目录</View>已更新到{this.state.booksinfo.album_cnt}章
|
|
201
|
+ {
|
|
202
|
+ this.state.isOpendDrectory &&
|
|
203
|
+ <View className='directory' onClick={e => (this.toDirectory())}>
|
|
204
|
+ <View className='directory-left'>
|
|
205
|
+ <Image className='directory-icon' src='https://video-img.fyshark.com/1683618704652dadda%20.png'></Image>
|
|
206
|
+ <View className='derectory-title'>查看目录</View>已更新到{this.state.booksinfo.album_cnt}章
|
|
207
|
+ </View>
|
|
208
|
+ <Image className='directory-right-icon' src='https://video-img.fyshark.com/1683618693594ddada%20.png'></Image>
|
139
|
209
|
</View>
|
140
|
|
- <Image className='directory-right-icon' src='https://video-img.fyshark.com/1683618693594ddada%20.png'></Image>
|
141
|
|
- </View>
|
|
210
|
+ }
|
|
211
|
+
|
142
|
212
|
<View className='like'>
|
143
|
213
|
<View className='like-tips'>
|
144
|
214
|
<View className='lick-title'>猜你喜欢</View>
|
|
@@ -159,8 +229,13 @@ export default class collection extends Component {
|
159
|
229
|
</View>
|
160
|
230
|
</View>
|
161
|
231
|
<View className='selected'>
|
162
|
|
- <View className='selected-title'>精选内容</View>
|
163
|
|
- <View className='selected-text'>{this.state.booksinfo.short_name}</View>
|
|
232
|
+ <View className='selected-title'>
|
|
233
|
+ 精选内容
|
|
234
|
+ <Image className='book-tips-copy' onClick={e => (this.copySelectedTips())} src='https://video-img.fyshark.com/1686882094575dahkn.png'></Image>
|
|
235
|
+ </View>
|
|
236
|
+ <RichText
|
|
237
|
+ className='selected-text'
|
|
238
|
+ nodes={tool.ellipsis(this.state.free_content, 80)}></RichText>
|
164
|
239
|
</View>
|
165
|
240
|
<View className='console'>
|
166
|
241
|
<View className='console-content'>
|