王士厅

cms视频详情页缺少来源、详情信息,见截图

@@ -3,6 +3,7 @@ import { ContentDetailDTO } from 'wdBean/Index' @@ -3,6 +3,7 @@ import { ContentDetailDTO } from 'wdBean/Index'
3 import { DetailDialog } from './DetailDialog' 3 import { DetailDialog } from './DetailDialog'
4 import { componentUtils } from '@kit.ArkUI' 4 import { componentUtils } from '@kit.ArkUI'
5 5
  6 +const TAG = 'PlayerTitleView';
6 @Preview 7 @Preview
7 @Component 8 @Component
8 export struct PlayerTitleView { 9 export struct PlayerTitleView {
@@ -11,6 +12,9 @@ export struct PlayerTitleView { @@ -11,6 +12,9 @@ export struct PlayerTitleView {
11 @Consume isOpenDetail: boolean 12 @Consume isOpenDetail: boolean
12 @Consume isDragging: boolean 13 @Consume isDragging: boolean
13 @State titleHeight: number = 0 14 @State titleHeight: number = 0
  15 + @State rmhPlatform: number = 0 // 1是人民号
  16 + @State isOverLines: boolean = false
  17 + @State summary: string = ''
14 dialogController: CustomDialogController = new CustomDialogController({ 18 dialogController: CustomDialogController = new CustomDialogController({
15 builder: DetailDialog({ 19 builder: DetailDialog({
16 name: this.getName(), 20 name: this.getName(),
@@ -26,8 +30,12 @@ export struct PlayerTitleView { @@ -26,8 +30,12 @@ export struct PlayerTitleView {
26 30
27 getName(): string { 31 getName(): string {
28 // authTitle 32 // authTitle
  33 + if (this.rmhPlatform == 0) {
  34 + return this.contentDetailData?.newsSourceName || ''
  35 + } else {
29 return this.contentDetailData?.rmhInfo?.rmhName || '' 36 return this.contentDetailData?.rmhInfo?.rmhName || ''
30 } 37 }
  38 + }
31 39
32 getIcon(): string { 40 getIcon(): string {
33 return this.contentDetailData?.rmhInfo?.authIcon || '' 41 return this.contentDetailData?.rmhInfo?.authIcon || ''
@@ -41,7 +49,45 @@ export struct PlayerTitleView { @@ -41,7 +49,45 @@ export struct PlayerTitleView {
41 return this.contentDetailData?.newIntroduction || '' 49 return this.contentDetailData?.newIntroduction || ''
42 } 50 }
43 51
  52 + /**
  53 + * 截断文本
  54 + * @author liuzhendong(猩猩G)
  55 + * @param {string} str 要截断的文本 '啊啊啊啊啊'
  56 + * @param {number} fontSize 字体大小(px)
  57 + * @param {number} maxLines 最大行数 3
  58 + * @param {number} textWidth 文本宽度(px) vp 需要转换vp2px()
  59 + * @returns {string} clipStr 截断后的文本 '啊啊'
  60 + */
  61 + clipText(str: string, fontSize: number, maxLines: number, textWidth: number): string {
  62 + let strArr: string[] = str.split("")
  63 + let truncateContent: string = '啊啊啊啊啊啊' // ...比正常文字宽度更小,这里使用啊啊啊(任意三个文字)代替计算
  64 + let measureTruncateWidth: number = measure.measureText({
  65 + textContent: truncateContent,
  66 + fontSize: fontSize,
  67 + fontWeight: 400,
  68 + lineHeight: 20,
  69 + wordBreak:WordBreak.BREAK_ALL
  70 + })
  71 + let clipStr: string = ''
  72 + for (let i = 0; i < strArr.length; i++) {
  73 + if (measure.measureText({
  74 + textContent: clipStr,
  75 + fontSize: fontSize,
  76 + fontWeight: 400,
  77 + lineHeight: 20,
  78 + wordBreak:WordBreak.BREAK_ALL
  79 + }) >= textWidth * maxLines - measureTruncateWidth) {
  80 + this.isOverLines = true
  81 + break;
  82 + }
  83 + clipStr += strArr[i]
  84 + }
  85 + console.log(TAG, 'clipStr:', clipStr)
  86 + return clipStr
  87 + }
  88 +
44 aboutToAppear(): void { 89 aboutToAppear(): void {
  90 + this.rmhPlatform = this.contentDetailData?.rmhPlatform || 0
45 const info = measure.measureTextSize({ 91 const info = measure.measureTextSize({
46 textContent: this.getTitle(), 92 textContent: this.getTitle(),
47 fontSize: 15, 93 fontSize: 15,
@@ -52,6 +98,8 @@ export struct PlayerTitleView { @@ -52,6 +98,8 @@ export struct PlayerTitleView {
52 }) 98 })
53 this.titleHeight = info?.height as number || 0 99 this.titleHeight = info?.height as number || 0
54 console.log('titleHeight:', this.titleHeight,) 100 console.log('titleHeight:', this.titleHeight,)
  101 + console.log(TAG, 'this.contentDetailData:', JSON.stringify(this.contentDetailData))
  102 + this.summary = this.getSummary()
55 } 103 }
56 104
57 build() { 105 build() {
@@ -64,7 +112,7 @@ export struct PlayerTitleView { @@ -64,7 +112,7 @@ export struct PlayerTitleView {
64 .maxLines(1) 112 .maxLines(1)
65 .lineHeight(25) 113 .lineHeight(25)
66 .fontWeight(600) 114 .fontWeight(600)
67 - .fontFamily('PingFang SC-Regular') 115 + .fontFamily('PingFang SC-Semibold')
68 .textOverflow({ overflow: TextOverflow.Ellipsis }) 116 .textOverflow({ overflow: TextOverflow.Ellipsis })
69 117
70 if (this.getIcon()) { 118 if (this.getIcon()) {
@@ -87,7 +135,8 @@ export struct PlayerTitleView { @@ -87,7 +135,8 @@ export struct PlayerTitleView {
87 /** 135 /**
88 * 标题大于三行或存在简介显示查看详情按钮 136 * 标题大于三行或存在简介显示查看详情按钮
89 */ 137 */
90 - if (this.titleHeight > 200 || this.getSummary()) { 138 + if (this.rmhPlatform == 1) {
  139 + if (this.titleHeight > 200 || this.summary) {
91 Text('查看详情 > ') 140 Text('查看详情 > ')
92 .padding({ 141 .padding({
93 left: 6, 142 left: 6,
@@ -108,6 +157,49 @@ export struct PlayerTitleView { @@ -108,6 +157,49 @@ export struct PlayerTitleView {
108 this.dialogController?.open() 157 this.dialogController?.open()
109 }) 158 })
110 } 159 }
  160 + } else {
  161 + if(this.summary) {
  162 + Text() {
  163 + Span(this.clipText(this.summary, 14, 2, this.windowWidth - 150 - vp2px(50)))
  164 + .fontSize(14)
  165 + .fontColor(Color.White)
  166 + .lineHeight(21)
  167 + .fontWeight(400)
  168 + .fontFamily('PingFang SC-Regular')
  169 + if (this.isOverLines) {
  170 + Span('... 全文')
  171 + .fontColor('#888888')
  172 + .fontWeight(400)
  173 + .fontFamily('PingFang SC-Regular')
  174 + .fontSize(12)
  175 + .onClick(() => {
  176 + this.isOpenDetail = true
  177 + this.dialogController?.open()
  178 + })
  179 + ImageSpan($r('app.media.comment_unfold_svg'))
  180 + .width(14)
  181 + .height(14)
  182 + .objectFit(ImageFit.Fill)
  183 + .verticalAlign(ImageSpanAlignment.CENTER)
  184 + .padding({
  185 + bottom: 4
  186 + })
  187 + .onClick(() => {
  188 + this.isOpenDetail = true
  189 + this.dialogController?.open()
  190 + })
  191 +
  192 + }
  193 + }
  194 + .padding({
  195 + left: 6,
  196 + right: 6,
  197 + top: 4,
  198 + bottom: 4
  199 + })
  200 + .margin({ bottom: 8 })
  201 + }
  202 + }
111 203
112 } 204 }
113 .width(this.windowWidth - 150 + 'px') 205 .width(this.windowWidth - 150 + 'px')
  1 +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><g transform="matrix(0,-1,1,0,-16,16)"><g><path d="M10.303455641479491,17.960819560243227L4.363755241479492,23.900515460243227Q4.324434578479492,23.939835460243224,4.324704443879492,23.995445460243225Q4.324434578479492,24.051055460243226,4.363755241479492,24.090375460243223L10.303455641479491,30.030075460243225Q10.342505641479491,30.069075460243226,10.397735641479493,30.069075460243226Q10.452965641479492,30.069075460243226,10.492015641479492,30.030075460243225L11.387685641479493,29.134375460243227Q11.406435641479492,29.115675460243224,11.416585641479493,29.091175460243225Q11.426735641479493,29.066675460243225,11.426735641479493,29.040075460243223Q11.426735641479493,29.013575460243224,11.416585641479493,28.989075460243225Q11.406435641479492,28.964575460243225,11.387685641479493,28.945875460243226L6.437285641479493,23.995445460243225L11.387685641479493,19.045045460243227Q11.406435641479492,19.026295460243226,11.416585641479493,19.001795460243226Q11.426735641479493,18.977295460243226,11.426735641479493,18.950765460243225Q11.426735641479493,18.924245460243224,11.416585641479493,18.899744460243227Q11.406435641479492,18.875241460243224,11.387685641479493,18.856488460243224L10.492015641479492,17.960819560243227Q10.452965641479492,17.921767119783226,10.397735641479493,17.921767119783226Q10.342505641479491,17.921767119783226,10.303455641479491,17.960819560243227Z" fill-rule="evenodd" fill="#888888" fill-opacity="1"/></g></g></svg>