developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
zhenghy
3ab3f6ba 1 parent be81fb38

点赞增加默哀、祈福、不展示判断

Inline Side-by-side
Showing 7 changed files with 128 additions and 111 deletions
@@ -23,12 +23,12 @@ export struct DetailPlayShortVideoPage { @@ -23,12 +23,12 @@ export struct DetailPlayShortVideoPage {
23 @Prop index: number = 0 23 @Prop index: number = 0
24 @Prop @Watch('currentIndexChange') currentIndex: number = 0 24 @Prop @Watch('currentIndexChange') currentIndex: number = 0
25 @State playerController: WDPlayerController = new WDPlayerController(); 25 @State playerController: WDPlayerController = new WDPlayerController();
26 - @Provide contentDetailData: ContentDetailDTO | undefined = undefined  
27 - @Provide interactData: InteractDataDTO | undefined = undefined 26 + @Provide contentDetailData: ContentDetailDTO = {} as ContentDetailDTO
  27 + @Provide interactData: InteractDataDTO = {} as InteractDataDTO
28 @Provide isFullScreen: boolean = false; 28 @Provide isFullScreen: boolean = false;
29 @Provide progressVal: number = 0; 29 @Provide progressVal: number = 0;
30 @Provide videoLandScape?: number = 1; // 视频朝向， 横屏视频：1;竖屏视频：2 30 @Provide videoLandScape?: number = 1; // 视频朝向， 横屏视频：1;竖屏视频：2
31 - @Provide newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态 31 + @Provide newsStatusOfUser: batchLikeAndCollectResult = {} as batchLikeAndCollectResult // 点赞、收藏状态
32 @Provide followStatus: string = '0' // 关注状态 32 @Provide followStatus: string = '0' // 关注状态
33 @Provide isOpenDetail: boolean = false // 查看详情按钮点击 33 @Provide isOpenDetail: boolean = false // 查看详情按钮点击
34 @Provide isDragging: boolean = false // 拖动时间进度条 34 @Provide isDragging: boolean = false // 拖动时间进度条
@@ -43,7 +43,7 @@ export struct DetailVideoListPage { @@ -43,7 +43,7 @@ export struct DetailVideoListPage {
43 } 43 }
44 44
45 await this.queryVideoList() 45 await this.queryVideoList()
46 - this.getContentInteract() 46 + await this.getContentInteract()
47 47
48 console.log(TAG, 'aboutToAppear', JSON.stringify(action.params)) 48 console.log(TAG, 'aboutToAppear', JSON.stringify(action.params))
49 } 49 }
@@ -119,7 +119,7 @@ export struct DetailVideoListPage { @@ -119,7 +119,7 @@ export struct DetailVideoListPage {
119 /** 119 /**
120 * 批量查询内容当前用户点赞、收藏状态 120 * 批量查询内容当前用户点赞、收藏状态
121 */ 121 */
122 - getContentInteract() { 122 + async getContentInteract() {
123 if (this.data.length > 0) { 123 if (this.data.length > 0) {
124 const params: contentListParams = { 124 const params: contentListParams = {
125 contentList: [] 125 contentList: []
@@ -131,7 +131,7 @@ export struct DetailVideoListPage { @@ -131,7 +131,7 @@ export struct DetailVideoListPage {
131 }) 131 })
132 }) 132 })
133 // 批量查询内容当前用户点赞、收藏状态 133 // 批量查询内容当前用户点赞、收藏状态
134 - ContentDetailRequest.getContentInteract(params).then(res => { 134 + await ContentDetailRequest.getContentInteract(params).then(res => {
135 if (res.data) { 135 if (res.data) {
136 this.interactDataList = res.data || [] 136 this.interactDataList = res.data || []
137 } 137 }
1 -import { ContentDetailDTO, InteractDataDTO, Params, RmhInfoDTO, UserInfoDTO } from 'wdBean/Index'; 1 +import { ContentDetailDTO, InteractDataDTO, Params, } from 'wdBean/Index';
2 import { 2 import {
3 - batchLikeAndCollectParams,  
4 batchLikeAndCollectResult, 3 batchLikeAndCollectResult,
5 ContentDetailRequest, 4 ContentDetailRequest,
6 contentListParams, 5 contentListParams,
@@ -8,20 +7,11 @@ import { @@ -8,20 +7,11 @@ import {
8 postExecuteLikeParams, 7 postExecuteLikeParams,
9 postInteractAccentionOperateParams 8 postInteractAccentionOperateParams
10 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest'; 9 } from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
11 -import { SPHelper, ToastUtils } from 'wdKit';  
12 -import { HttpUrlUtils } from 'wdNetwork/Index'; 10 +import { SPHelper, ToastUtils, NumberFormatterUtils } from 'wdKit';
13 import { WDPlayerController } from 'wdPlayer/Index'; 11 import { WDPlayerController } from 'wdPlayer/Index';
14 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index'; 12 import { WDRouterPage, WDRouterRule } from 'wdRouter/Index';
15 import { SpConstants } from 'wdConstant/Index' 13 import { SpConstants } from 'wdConstant/Index'
16 14
17 -export interface OperationItem {  
18 - icon: Resource;  
19 - icon_check?: Resource;  
20 -  
21 - // icon_selected: Resource;  
22 - text: string | Resource;  
23 - num?: number; // 个数  
24 -}  
25 15
26 const TAG = 'PlayerRightView'; 16 const TAG = 'PlayerRightView';
27 17
@@ -34,31 +24,10 @@ export struct PlayerRightView { @@ -34,31 +24,10 @@ export struct PlayerRightView {
34 @Consume followStatus: string 24 @Consume followStatus: string
35 @Consume isOpenDetail: boolean 25 @Consume isOpenDetail: boolean
36 @Consume isDragging: boolean 26 @Consume isDragging: boolean
37 - @State operationList: OperationItem[] = [  
38 - {  
39 - icon: $r('app.media.ic_like_uncheck'),  
40 - icon_check: $r('app.media.ic_like_check'),  
41 - text: "赞",  
42 - // num: 6622  
43 - },  
44 - {  
45 - icon: $r('app.media.ic_collect_uncheck'),  
46 - icon_check: $r('app.media.ic_collect_check'),  
47 - text: "收藏",  
48 - // num: 662,  
49 - },  
50 - {  
51 - icon: $r('app.media.ic_comment'),  
52 - text: "抢首评",  
53 - // num: 500,  
54 - },  
55 - {  
56 - icon: $r('app.media.ic_share'),  
57 - text: "分享"  
58 - }  
59 - ] 27 + @State likesStyle: number = this.contentDetailData.likesStyle // 赞样式 1红心(点赞) 2大拇指(祈福) 3蜡烛(默哀) 4置空
60 28
61 aboutToAppear() { 29 aboutToAppear() {
  30 +
62 } 31 }
63 32
64 /** 33 /**
@@ -82,11 +51,11 @@ export struct PlayerRightView { @@ -82,11 +51,11 @@ export struct PlayerRightView {
82 if (this.newsStatusOfUser) { 51 if (this.newsStatusOfUser) {
83 this.newsStatusOfUser.likeStatus = this.newsStatusOfUser?.likeStatus === '1' ? '0' : '1' 52 this.newsStatusOfUser.likeStatus = this.newsStatusOfUser?.likeStatus === '1' ? '0' : '1'
84 if (this.newsStatusOfUser.likeStatus === '1') { 53 if (this.newsStatusOfUser.likeStatus === '1') {
85 - this.interactData.likeNum = Number(this.interactData.likeNum) + 1 54 + this.interactData.likeNum = Number(this.interactData.likeNum || 0) + 1
86 } else { 55 } else {
87 - this.interactData.likeNum = Number(this.interactData.likeNum) - 1 56 + this.interactData.likeNum = Number(this.interactData.likeNum || 0) - 1
88 } 57 }
89 - console.log('点赞、取消点赞==', this.newsStatusOfUser?.likeStatus, this.interactData?.likeNum) 58 + console.log(TAG, '点赞、取消点赞==', this.newsStatusOfUser?.likeStatus, this.interactData?.likeNum)
90 // this.queryContentInteractCount() 59 // this.queryContentInteractCount()
91 } 60 }
92 61
@@ -116,11 +85,11 @@ export struct PlayerRightView { @@ -116,11 +85,11 @@ export struct PlayerRightView {
116 this.newsStatusOfUser.collectStatus = this.newsStatusOfUser?.collectStatus === 1 ? 0 : 1 85 this.newsStatusOfUser.collectStatus = this.newsStatusOfUser?.collectStatus === 1 ? 0 : 1
117 // this.queryContentInteractCount() 86 // this.queryContentInteractCount()
118 if (this.newsStatusOfUser.collectStatus === 1) { 87 if (this.newsStatusOfUser.collectStatus === 1) {
119 - this.interactData.collectNum = Number(this.interactData.collectNum) + 1 88 + this.interactData.collectNum = Number(this.interactData.collectNum || 0) + 1
120 } else { 89 } else {
121 - this.interactData.collectNum = Number(this.interactData.collectNum) - 1 90 + this.interactData.collectNum = Number(this.interactData.collectNum || 0) - 1
122 } 91 }
123 - console.log('收藏、取消收藏==', this.newsStatusOfUser?.collectStatus, this.interactData?.collectNum) 92 + console.log(TAG, '收藏、取消收藏==', this.newsStatusOfUser?.collectStatus, this.interactData?.collectNum)
124 } 93 }
125 }) 94 })
126 95
@@ -138,15 +107,15 @@ export struct PlayerRightView { @@ -138,15 +107,15 @@ export struct PlayerRightView {
138 } 107 }
139 ContentDetailRequest.getContentInteract(params).then(res => { 108 ContentDetailRequest.getContentInteract(params).then(res => {
140 if (res.data && this.interactData) { 109 if (res.data && this.interactData) {
141 - this.interactData.likeNum = res.data[0]?.likeNum  
142 - this.interactData.collectNum = res.data[0]?.collectNum  
143 - this.interactData.commentNum = res.data[0]?.commentNum 110 + this.interactData.likeNum = res.data[0]?.likeNum || 0
  111 + this.interactData.collectNum = res.data[0]?.collectNum || 0
  112 + this.interactData.commentNum = res.data[0]?.commentNum || 0
144 } 113 }
145 console.log('获取互动点赞等数据===', JSON.stringify(res)) 114 console.log('获取互动点赞等数据===', JSON.stringify(res))
146 }) 115 })
147 } 116 }
148 117
149 - getImgUrl() { 118 + getHeadUrl() {
150 return this.contentDetailData?.rmhInfo?.rmhHeadUrl || this.contentDetailData?.userInfo?.userHeadUrl 119 return this.contentDetailData?.rmhInfo?.rmhHeadUrl || this.contentDetailData?.userInfo?.userHeadUrl
151 } 120 }
152 121
@@ -170,7 +139,7 @@ export struct PlayerRightView { @@ -170,7 +139,7 @@ export struct PlayerRightView {
170 status: 1, 139 status: 1,
171 } 140 }
172 ContentDetailRequest.postInteractAccentionOperate(params2).then(res => { 141 ContentDetailRequest.postInteractAccentionOperate(params2).then(res => {
173 - console.log('关注号主==', JSON.stringify(res.data)) 142 + console.log(TAG, '关注号主==', JSON.stringify(res.data))
174 if (this.followStatus == '1') { 143 if (this.followStatus == '1') {
175 this.followStatus = '0' 144 this.followStatus = '0'
176 } else { 145 } else {
@@ -179,110 +148,178 @@ export struct PlayerRightView { @@ -179,110 +148,178 @@ export struct PlayerRightView {
179 }) 148 })
180 } 149 }
181 150
182 - @Builder  
183 - buildUserComp() { 151 + build() {
184 Column() { 152 Column() {
185 - if (this.getImgUrl()) {  
186 - RelativeContainer() {  
187 - Image(this.getImgUrl()) 153 + if (this.interactData.contentId) {
  154 + this.userBuilderView()
  155 + this.likeBuilderView()
  156 + this.collectBuilderView()
  157 + this.commentBuilderView()
  158 + this.shareBuilderView()
  159 + }
  160 +
  161 + }
  162 + // .backgroundColor(Color.Blue)
  163 + // .height('100%')
  164 + .width(48)
  165 + .position({ x: '100%', y: '100%' })
  166 + .markAnchor({ x: '100%', y: '100%' })
  167 + .padding({ bottom: 72, right: 10 })
  168 + .visibility(this.isOpenDetail || this.isDragging ? Visibility.None : Visibility.Visible)
  169 +
  170 + }
  171 +
  172 + /**
  173 + * 用户关注、号主页
  174 + */
  175 + @Builder
  176 + userBuilderView() {
  177 + Stack() {
  178 + Image(this.getHeadUrl())
188 .width('100%') 179 .width('100%')
189 .borderRadius(24) 180 .borderRadius(24)
190 .aspectRatio(1) 181 .aspectRatio(1)
191 .border({ width: 1, color: Color.White, style: BorderStyle.Solid }) 182 .border({ width: 1, color: Color.White, style: BorderStyle.Solid })
192 - .alignRules({  
193 - top: { anchor: "__container__", align: VerticalAlign.Top },  
194 - left: { anchor: "__container__", align: HorizontalAlign.Start }  
195 - })  
196 - .id("row1")  
197 .onClick(() => { 183 .onClick(() => {
  184 + // 跳转到号主页
198 if (this.contentDetailData.rmhInfo?.cnMainControl === 1) { 185 if (this.contentDetailData.rmhInfo?.cnMainControl === 1) {
199 - // 号主页  
200 const params: Params = { 186 const params: Params = {
201 creatorId: this.contentDetailData.rmhInfo.rmhId, 187 creatorId: this.contentDetailData.rmhInfo.rmhId,
202 pageID: '' 188 pageID: ''
203 } 189 }
204 WDRouterRule.jumpWithPage(WDRouterPage.peopleShipHomePage, params) 190 WDRouterRule.jumpWithPage(WDRouterPage.peopleShipHomePage, params)
205 } 191 }
206 -  
207 }) 192 })
208 - if (this.followStatus == '0') { 193 +
209 Image($r('app.media.ic_add')) 194 Image($r('app.media.ic_add'))
210 .width(24) 195 .width(24)
211 .borderRadius(12) 196 .borderRadius(12)
212 - .alignRules({  
213 - left: { anchor: "__container__", align: HorizontalAlign.Center },  
214 - bottom: { anchor: "__container__", align: VerticalAlign.Bottom },  
215 - })  
216 - .margin({ left: -12 })  
217 - .id("row2") 197 + .position({ x: '50%', y: '100%' })
  198 + .markAnchor({ x: '50%', y: '50%' })
218 .onClick(() => { 199 .onClick(() => {
219 - // 关注 200 + // TODO:关注动画
220 this.handleAccention() 201 this.handleAccention()
221 }) 202 })
222 } 203 }
  204 + .height(48)
  205 + .width('100%')
  206 + .margin({ bottom: 30 })
  207 + .visibility(this.getHeadUrl() ? Visibility.Visible : Visibility.None)
  208 + }
  209 +
  210 + /**
  211 + * 将点赞样式转换为icon
  212 + */
  213 + transLikeStyle2Icon(): Resource {
  214 + if (this.likesStyle === 1) {
  215 + return this.newsStatusOfUser.likeStatus === '1' ? $r(`app.media.ic_like_check`) : $r(`app.media.ic_like_uncheck`)
  216 + } else if (this.likesStyle === 2) {
  217 + return this.newsStatusOfUser.likeStatus === '1' ? $r(`app.media.ic_thub_check`) : $r(`app.media.ic_thub_uncheck`)
  218 + } else if (this.likesStyle === 3) {
  219 + return this.newsStatusOfUser.likeStatus === '1' ? $r(`app.media.ic_candle_check`) : $r(`app.media.ic_candle_uncheck`)
  220 + }
  221 + return $r(`app.media.icon_like_ckeck`)
  222 + }
223 223
224 - }.height(60) 224 + transNum2String(name: 'likeNum' | 'collectNum' | 'commentNum') {
  225 + console.log(TAG, 'transNum2String', this.interactData.likeNum, this.interactData.collectNum, this.interactData.commentNum)
  226 + if (name === 'likeNum') {
  227 + return this.interactData.likeNum != 0 ? NumberFormatterUtils.formatNumberWithWan(this.interactData.likeNum || '') : ''
  228 + } else if (name === 'collectNum') {
  229 + return this.interactData.collectNum != 0 ? NumberFormatterUtils.formatNumberWithWan(this.interactData.collectNum || '') : ''
  230 + } else {
  231 + return this.interactData.commentNum != 0 ? NumberFormatterUtils.formatNumberWithWan(this.interactData.commentNum || '') : ''
225 } 232 }
226 - }.margin({ bottom: 18 })  
227 } 233 }
228 234
  235 + /**
  236 + * 点赞、默哀、祈福
  237 + */
229 @Builder 238 @Builder
230 - buildOperationItem(item: OperationItem, index: number) { 239 + likeBuilderView() {
231 Column() { 240 Column() {
232 - if (item.text === '赞') {  
233 - Image(this.newsStatusOfUser?.likeStatus == '1' ? item.icon_check : item.icon) 241 + Image(this.transLikeStyle2Icon())
234 .width(32) 242 .width(32)
235 .aspectRatio(1) 243 .aspectRatio(1)
236 .onClick(() => { 244 .onClick(() => {
  245 + // TODO:点赞动画
237 this.toggleLikeStatus() 246 this.toggleLikeStatus()
238 }) 247 })
239 - Text(this.interactData?.likeNum ? (this.interactData.likeNum + '') : item.text)  
240 - .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown) 248 + Text(this.transNum2String('likeNum') || '赞')
  249 + .width('100%')
241 .fontWeight(500) 250 .fontWeight(500)
242 .textAlign(TextAlign.Center) 251 .textAlign(TextAlign.Center)
243 .fontSize(13) 252 .fontSize(13)
244 .fontColor('#FFFFFF') 253 .fontColor('#FFFFFF')
245 .maxLines(1) 254 .maxLines(1)
246 .textOverflow({ overflow: TextOverflow.Ellipsis }) 255 .textOverflow({ overflow: TextOverflow.Ellipsis })
247 - } else if (item.text === '收藏') {  
248 - Image(this.newsStatusOfUser?.collectStatus == 1 ? item.icon_check : item.icon) 256 + }
  257 + .margin({ bottom: 20 })
  258 + .visibility(this.likesStyle !== 4 ? Visibility.Visible : Visibility.None)
  259 + }
  260 +
  261 + /**
  262 + * 收藏、取消收藏、收藏文件夹
  263 + */
  264 + @Builder
  265 + collectBuilderView() {
  266 + Column() {
  267 + Image(this.newsStatusOfUser.collectStatus == 1 ? $r(`app.media.ic_collect_check`) : $r(`app.media.ic_collect_uncheck`))
249 .width(32) 268 .width(32)
250 .aspectRatio(1) 269 .aspectRatio(1)
251 .onClick(() => { 270 .onClick(() => {
252 this.toggleCollectStatus() 271 this.toggleCollectStatus()
253 }) 272 })
254 - Text(this.interactData?.collectNum ? (this.interactData.collectNum + '') : item.text)  
255 - .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown) 273 + Text(this.transNum2String('collectNum') || '收藏')
  274 + .width('100%')
256 .fontWeight(500) 275 .fontWeight(500)
257 .textAlign(TextAlign.Center) 276 .textAlign(TextAlign.Center)
258 .fontSize(13) 277 .fontSize(13)
259 .fontColor('#FFFFFF') 278 .fontColor('#FFFFFF')
260 .maxLines(1) 279 .maxLines(1)
261 .textOverflow({ overflow: TextOverflow.Ellipsis }) 280 .textOverflow({ overflow: TextOverflow.Ellipsis })
262 - } else if (item.text === '抢首评') {  
263 - Image(item.icon) 281 + }
  282 + .margin({ bottom: 20 })
  283 + }
  284 +
  285 + /**
  286 + * 评论
  287 + */
  288 + @Builder
  289 + commentBuilderView() {
  290 + Column() {
  291 + Image($r(`app.media.ic_comment`))
264 .width(32) 292 .width(32)
265 .aspectRatio(1) 293 .aspectRatio(1)
266 .onClick((event: ClickEvent) => { 294 .onClick((event: ClickEvent) => {
267 ToastUtils.showToast('评论为公共方法，待开发', 1000); 295 ToastUtils.showToast('评论为公共方法，待开发', 1000);
268 }) 296 })
269 - Text(this.interactData?.commentNum ? (this.interactData.commentNum + '') : item.text)  
270 - .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown) 297 + Text(this.transNum2String('commentNum') || '抢首评')
  298 + .width('100%')
271 .fontWeight(500) 299 .fontWeight(500)
272 .textAlign(TextAlign.Center) 300 .textAlign(TextAlign.Center)
273 .fontSize(13) 301 .fontSize(13)
274 .fontColor('#FFFFFF') 302 .fontColor('#FFFFFF')
275 .maxLines(1) 303 .maxLines(1)
276 .textOverflow({ overflow: TextOverflow.Ellipsis }) 304 .textOverflow({ overflow: TextOverflow.Ellipsis })
277 - } else {  
278 - Image(item.icon) 305 + }
  306 + .margin({ bottom: 20 })
  307 + }
  308 +
  309 + /**
  310 + * 分享
  311 + */
  312 + @Builder
  313 + shareBuilderView() {
  314 + Column() {
  315 + Image($r(`app.media.ic_share`))
279 .width(32) 316 .width(32)
280 .aspectRatio(1) 317 .aspectRatio(1)
281 .onClick((event: ClickEvent) => { 318 .onClick((event: ClickEvent) => {
282 ToastUtils.showToast('分享为公共方法，待开发', 1000); 319 ToastUtils.showToast('分享为公共方法，待开发', 1000);
283 }) 320 })
284 - Text(item.text)  
285 - .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown) 321 + Text('分享')
  322 + .width('100%')
286 .fontWeight(500) 323 .fontWeight(500)
287 .textAlign(TextAlign.Center) 324 .textAlign(TextAlign.Center)
288 .fontSize(13) 325 .fontSize(13)
@@ -290,26 +327,6 @@ export struct PlayerRightView { @@ -290,26 +327,6 @@ export struct PlayerRightView {
290 .maxLines(1) 327 .maxLines(1)
291 .textOverflow({ overflow: TextOverflow.Ellipsis }) 328 .textOverflow({ overflow: TextOverflow.Ellipsis })
292 } 329 }
293 -  
294 - }  
295 - // .width(48)  
296 .margin({ bottom: 20 }) 330 .margin({ bottom: 20 })
297 - .alignItems(HorizontalAlign.Center)  
298 - .hoverEffect(HoverEffect.Scale)  
299 -  
300 - }  
301 -  
302 - build() {  
303 - Column() {  
304 - this.buildUserComp()  
305 - ForEach(this.operationList, (item: OperationItem, index: number) => {  
306 - this.buildOperationItem(item, index)  
307 - }, (item: OperationItem, index: number) => JSON.stringify(item))  
308 - }  
309 - .width(48)  
310 - .position({ x: '100%', y: '100%' })  
311 - .markAnchor({ x: '100%', y: '100%' })  
312 - .padding({ bottom: 72 })  
313 - .visibility(this.isOpenDetail || this.isDragging ? Visibility.None : Visibility.Visible)  
314 } 331 }
315 } 332 }