developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
liujian1_wd
14f26591 1 parent 9a3128b9

图文详情页面

Inline Side-by-side
Showing 149 changed files with 315 additions and 115 deletions
... ... @@ -5,13 +5,13 @@
"name": "default",
"type": "HarmonyOS",
"material": {
"certpath": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.cer",
"storePassword": "0000001B264B065AE68D1C7F3C0863A33C083D91E12CC54AA36D44179AA8DBA37EA3C50E7F3692F5EB6F3E",
"certpath": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.cer",
"storePassword": "0000001A76406594DCD45689E6888037F1FA52EA0D15317DD495835E1F8D18BEF743FCEB51D881F01BA2",
"keyAlias": "debugKey",
"keyPassword": "0000001BFB62A8007F44B0EAAF9CF878A92620ED75A21E53B3740EA60DEBF6543F6E16AA7200542280D746",
"profile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.p7b",
"keyPassword": "0000001ACD3163BEAB09744DEA803A35F7B90073531926D60C13C3BA4F277C41CDB92A46819ED663CD31",
"profile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.p7b",
"signAlg": "SHA256withECDSA",
"storeFile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.p12"
"storeFile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.p12"
}
}
],
... ...
import { Action } from 'wdBean';
import { ImageAndTextPageComponent } from 'wdComponent'
import { Logger } from 'wdKit'
import router from '@ohos.router';
const TAG = 'ImageAndTextDetailPage';
@Entry
@Component
struct ImageAndTextDetailPage {
action: Action = {} as Action
build() {
Column() {
ImageAndTextPageComponent()
ImageAndTextPageComponent({action: this.action})
}
}
... ... @@ -25,6 +28,8 @@ struct ImageAndTextDetailPage {
aboutToAppear() {
Logger.info(TAG, 'aboutToAppear');
let action: Action = router.getParams() as Action
this.action = action
}
aboutToDisappear() {
... ...
... ... @@ -51,4 +51,12 @@ export { ReLInfoDTO } from './src/main/ets/bean/detail/ReLInfoDTO';
export { ShareInfoDTO } from './src/main/ets/bean/detail/ShareInfoDTO';
export { VideoInfoDTO } from './src/main/ets/bean/detail/VideoInfoDTO';
\ No newline at end of file
export { VideoInfoDTO } from './src/main/ets/bean/detail/VideoInfoDTO';
export { H5ReceiveDetailBean } from './src/main/ets/bean/h5/H5ReceiveDetailBean';
export { H5ReceiveDataJsonBean } from './src/main/ets/bean/h5/H5ReceiveDataJsonBean';
export { H5ReceiveDataExtraBean } from './src/main/ets/bean/h5/H5ReceiveDataExtraBean';
export { ResponseBean } from './src/main/ets/bean/h5/ResponseBean';
\ No newline at end of file
... ...
... ... @@ -4,4 +4,12 @@ import { ItemDTO } from '../../ItemDTO';
// 附加字段集合,不同组件，额外附加参数不同
export interface ExtraDTO extends ItemDTO {
labels?: LabelDTO[];
contentId: string;
contentType: string;
topicId: string;
channelId: string;
compId: string;
sourcePage: string;
relId: string;
relType: string;
}
\ No newline at end of file
... ...
export interface H5ReceiveDataExtraBean {
creatorId: string;
isLogin: string;
}
\ No newline at end of file
... ...
import { ResponseBean } from './ResponseBean';
export interface H5ReceiveDataJsonBean {
contentId: string;
contentType: string;
topicId: string;
channelId: string;
compId: string;
sourcePage: string;
netError: string;
responseMap: ResponseBean;
}
\ No newline at end of file
... ...
import { H5ReceiveDataExtraBean } from './H5ReceiveDataExtraBean';
import { H5ReceiveDataJsonBean } from './H5ReceiveDataJsonBean';
export interface H5ReceiveDetailBean {
dataSource: string;
dataJson: H5ReceiveDataJsonBean;
dataExt: H5ReceiveDataExtraBean;
}
\ No newline at end of file
... ...
import { ContentDetailDTO } from '../detail/ContentDetailDTO';
export interface ResponseBean{
success:boolean;
// 服务请求响应值/微服务响应状态码”
code: number;
// 服务请求响应说明
message: string;
// 响应结果
data:ContentDetailDTO;
// 请求响应时间戳（unix格式）
timestamp?: number;
}
\ No newline at end of file
... ...
... ... @@ -9,6 +9,7 @@
"dependencies": {
"wdConstant": "file:../wdConstant",
"wdKit": "file:../wdKit",
"wdWebComponent": "file:../wdWebComponent",
"wdBean": "file:../wdBean",
"wdRouter": "file:../wdRouter",
"wdNetwork": "file:../wdNetwork"
... ...
import { NewspaperListItemBean, NewspaperPositionItemBean } from 'wdBean';
import { Action, NewspaperListItemBean, NewspaperPositionItemBean, Params } from 'wdBean';
import { ExtraDTO } from 'wdBean/src/main/ets/bean/component/extra/ExtraDTO';
import { StringUtils } from 'wdKit';
import { WDRouterRule } from 'wdRouter';
@Component
export struct ENewspaperItemComponent {
... ... @@ -27,14 +29,6 @@ export struct ENewspaperItemComponent {
}
.width('100%')
.aspectRatio(0.68688)
.onClick((event: ClickEvent) =>{
if (this.itemBeanClicked && this.itemBeanClicked.newsId){
// todo 跳转事件
this.itemBeanClicked = {} as NewspaperPositionItemBean
}
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
let x = event.touches[0].x;
... ... @@ -58,6 +52,24 @@ export struct ENewspaperItemComponent {
}
if (event.type === TouchType.Up) {
this.context.clearRect(0, 0, this.context.width, this.context.height)
if (this.itemBeanClicked && this.itemBeanClicked.newsId){
// todo 跳转事件
let taskAction: Action = {
type: 'JUMP_INNER_NEW_PAGE',
params: {
contentID:'30001373964',
pageID: 'IMAGE_TEXT_DETAIL',
extra:{
relType: '1',
relId: '500000008738',
sourcePage: '5'
} as ExtraDTO
} as Params,
};
WDRouterRule.jumpWithAction(taskAction)
this.itemBeanClicked = {} as NewspaperPositionItemBean
}
}
if (event.type === TouchType.Move) {
let mx = event.touches[0].x;
... ...
import { ContentDetailDTO } from 'wdBean';
import { Action, ContentDetailDTO } from 'wdBean';
import DetailViewModel from '../viewmodel/DetailViewModel';
import { ImageAndTextWebComponent } from './ImageAndTextWebComponent';
import router from '@ohos.router';
@Component
export struct ImageAndTextPageComponent {
scroller: Scroller = new Scroller();
@State relId: string= ''
@State contentId: string= ''
@State relType: string= ''
action: Action = {} as Action
@State detailData: ContentDetailDTO = {} as ContentDetailDTO
build(){
build() {
RelativeContainer() {
RelativeContainer(){
RelativeContainer() {
Text('2024年1月25日 9:45')
.fontColor($r('app.color.color_B0B0B0'))
.fontSize($r('app.float.font_size_13'))
.id('date')
.alignRules({ right: { anchor: "__container__", align: HorizontalAlign.End },
center:{anchor: "__container__", align:VerticalAlign.Center}})
Image($r('app.media.icon_ren_min_ri_bao'))
.width(70)
.height(28)
.alignRules({top:{anchor: "__container__", align: VerticalAlign.Top},
left:{anchor: "__container__", align: HorizontalAlign.Start}})
Text(this.detailData.publishTime)
.fontColor($r('app.color.color_B0B0B0'))
.fontSize($r('app.float.font_size_13'))
.alignRules({top:{anchor: "__container__", align: VerticalAlign.Top},
right:{anchor: "__container__", align: HorizontalAlign.End}})
.alignRules({ left: { anchor: "__container__", align: HorizontalAlign.Start },
center:{anchor: "__container__", align:VerticalAlign.Center}})
}
.height(32)
.width('100%')
.id('image_text_detail_top')
.alignRules({top:{anchor: "__container__", align: VerticalAlign.Top}})
.alignRules({ top: { anchor: "__container__", align: VerticalAlign.Top } })
Image($r('app.media.line'))
.width('100%')
.height(6)
.objectFit(ImageFit.Contain)
.id('image_text_detail_top_line')
.alignRules({top:{anchor: "image_text_detail_top", align: VerticalAlign.Bottom}})
.margin({top: 10})
Scroll(this.scroller) {
Column() {
ImageAndTextWebComponent({detailData: this.detailData})
}
.width('100%')
}
.scrollable(ScrollDirection.Vertical)
.scrollBar(BarState.Off)
.alignRules({top:{anchor: "image_text_detail_top_line", align: VerticalAlign.Bottom}})
.id('image_text_detail_content')
.alignRules({ top: { anchor: "image_text_detail_top", align: VerticalAlign.Bottom } })
.margin({ top: 10 })
RelativeContainer(){
RelativeContainer() {
Image($r('app.media.icon_arrow_left'))
.width(24)
.height(24)
.alignRules({left:{anchor: "__container__", align: HorizontalAlign.Start},
center:{anchor: "__container__", align: VerticalAlign.Center}})
Row(){
Image($r('app.media.icon_comment'))
.width(24)
.height(24)
.margin({left: 24})
Image($r('app.media.icon_star'))
.width(24)
.height(24)
.margin({left: 24})
Image($r('app.media.icon_listen'))
.width(24)
.height(24)
.margin({left: 24})
Image($r('app.media.icon_forward'))
.width(24)
.height(24)
.margin({left: 24})
}
.alignItems(VerticalAlign.Center)
.alignRules({right:{anchor: "__container__", align: HorizontalAlign.End},
center:{anchor: "__container__", align: VerticalAlign.Center}})
.id('back')
.alignRules({ left: { anchor: "__container__", align: HorizontalAlign.Start },
center: { anchor: "__container__", align: VerticalAlign.Center } })
.onClick((event: ClickEvent) => {
router.back()
})
Image($r('app.media.icon_forward'))
.width(24)
.height(24)
.id('forward')
.alignRules({ right: { anchor: "__container__", align: HorizontalAlign.End },
center: { anchor: "back", align: VerticalAlign.Center } })
Image($r('app.media.icon_listen'))
.width(24)
.height(24)
.margin({ right: 24 })
.id('listen')
.alignRules({ right: { anchor: "forward", align: HorizontalAlign.Start },
center: { anchor: "back", align: VerticalAlign.Center } })
Image($r('app.media.icon_star'))
.width(24)
.height(24)
.margin({ right: 24 })
.id('star')
.alignRules({ right: { anchor: "listen", align: HorizontalAlign.Start },
center: { anchor: "back", align: VerticalAlign.Center } })
Image($r('app.media.icon_comment'))
.width(24)
.height(24)
.margin({ right: 24 })
.id('comment')
.alignRules({ right: { anchor: "star", align: HorizontalAlign.Start },
center: { anchor: "back", align: VerticalAlign.Center } })
}
.width('100%')
.height(56)
.alignRules({bottom:{anchor: "__container__", align: VerticalAlign.Bottom}})
.id('image_text_detail_bottom')
.alignRules({ bottom: { anchor: "__container__", align: VerticalAlign.Bottom } })
Scroll(this.scroller) {
Column() {
ImageAndTextWebComponent({ detailData: this.detailData, action: this.action })
}
.width('100%')
}
.scrollable(ScrollDirection.Vertical)
.scrollBar(BarState.Off)
.alignRules({ top: { anchor: "image_text_detail_top_line", align: VerticalAlign.Bottom },
bottom:{anchor: "image_text_detail_bottom", align: VerticalAlign.Top}})
.id('image_text_detail_content')
}
.width('100%')
.height('100%')
.padding({left: 16, right: 16})
.padding({ left: 16, right: 16 })
.backgroundColor(Color.White)
}
async aboutToAppear() {
let detailBean = await DetailViewModel.getDetailPageData(this.relId, this.contentId, this.relType)
this.detailData = detailBean;
let contentId: string = ''
let relId: string = ''
let relType: string = ''
if (this.action && this.action.params) {
if (this.action.params.contentID) {
contentId = this.action.params.contentID;
}
if (this.action && this.action.params && this.action.params.extra) {
if (this.action.params.extra.relId) {
relId = this.action.params.extra.relId;
}
if (this.action.params.extra.relType) {
relType = this.action.params.extra.relType
}
}
let detailBean = await DetailViewModel.getDetailPageData(relId, contentId, relType)
this.detailData = detailBean;
}
}
aboutToDisappear() {
}
}
\ No newline at end of file
... ...
import { ContentDetailDTO } from 'wdBean'
import {
Action,
ContentDetailDTO,
H5ReceiveDataExtraBean,
H5ReceiveDataJsonBean,
H5ReceiveDetailBean,
ResponseBean
} from 'wdBean';
import { Logger } from 'wdKit';
import { WdWebComponent } from 'wdWebComponent';
import { BridgeWebViewControl } from '../../../../../wdWebComponent/oh_modules/wdJsBridge/Index';
@Component
export struct ImageAndTextWebComponent{
@Prop detailData: ContentDetailDTO = {} as ContentDetailDTO
export struct ImageAndTextWebComponent {
webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
action: Action = {} as Action
@State reload: number = 0;
@Prop @Watch('onDetailDataUpdated') detailData: ContentDetailDTO = {} as ContentDetailDTO
build(){
onDetailDataUpdated() {
if (this.action) {
let contentId: string = ''
let contentType: string = ''
let topicId: string = ''
let channelId: string = ''
let compId: string = ''
let sourcePage: string = '5'
if (this.action.params) {
if (this.action.params.contentID) {
contentId = this.action.params?.contentID
}
if (this.action.params.extra) {
if (this.action.params.extra.contentType) {
contentType = this.action.params.extra.contentType
}
if (this.action.params.extra.topicId) {
topicId = this.action.params.extra.topicId
}
if (this.action.params.extra.channelId) {
channelId = this.action.params.extra.channelId
}
if (this.action.params.extra.compId) {
compId = this.action.params.extra.compId
}
if (this.action.params.extra.sourcePage) {
sourcePage = this.action.params.extra.sourcePage
}
}
}
let h5ReceiveAppData: H5ReceiveDetailBean = { dataSource: '2' } as H5ReceiveDetailBean
let h5ReceiveDataExtraBean: H5ReceiveDataExtraBean = { creatorId: '', isLogin: '0' } as H5ReceiveDataExtraBean
let h5ReceiveDataJsonBean: H5ReceiveDataJsonBean = {
contentId: contentId,
contentType: contentType
} as H5ReceiveDataJsonBean
h5ReceiveDataJsonBean.topicId = topicId
h5ReceiveDataJsonBean.channelId = channelId
h5ReceiveDataJsonBean.compId = compId
h5ReceiveDataJsonBean.sourcePage = sourcePage
h5ReceiveDataJsonBean.netError = '0'
let response: ResponseBean = {} as ResponseBean
response.data = this.detailData
h5ReceiveDataJsonBean.responseMap = response
h5ReceiveAppData.dataJson = h5ReceiveDataJsonBean
h5ReceiveAppData.dataExt = h5ReceiveDataExtraBean
this.webviewControl.callHandle("jsCall_receiveAppData", JSON.stringify(h5ReceiveAppData), (data: string) => {
Logger.info("from js data = " + data);
})
}
}
build() {
Column() {
WdWebComponent({
type: 0,
webviewControl: this.webviewControl,
webResource: $rawfile('apph5/index.html'),
backVisibility: false,
reload: this.reload
})
}
}
}
\ No newline at end of file
... ...
import { CompDTO, TopNavDTO } from 'wdBean';
import { Action, CompDTO, Params, TopNavDTO } from 'wdBean';
import { LazyDataSource, Logger } from 'wdKit';
import { WDRouterRule } from 'wdRouter';
import { PageComponent } from './PageComponent';
const TAG = 'TopNavigationComponent';
... ... @@ -17,26 +18,40 @@ export struct TopNavigationComponent {
readonly MAX_LINE: number = 1;
build() {
Tabs() {
ForEach(this.topNavList, (navItem: TopNavDTO, index: number) => {
TabContent() {
PageComponent({
currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
navIndex: index,
pageId: navItem.pageId + '',
channelId: navItem.channelId + ''
})
}
.tabBar(this.tabBarBuilder(navItem, index))
}, (navItem: TopNavDTO) => JSON.stringify(navItem));
Column() {
Image($r('app.media.icon_ren_min_ri_bao'))
.width(72)
.height(29)
.onClick((event: ClickEvent) => {
let taskAction: Action = {
type: 'JUMP_INNER_NEW_PAGE',
params: {
pageID: 'E_NEWSPAPER'
} as Params,
};
WDRouterRule.jumpWithAction(taskAction)
})
Tabs() {
ForEach(this.topNavList, (navItem: TopNavDTO, index: number) => {
TabContent() {
PageComponent({
currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
navIndex: index,
pageId: navItem.pageId + '',
channelId: navItem.channelId + ''
})
}
.tabBar(this.tabBarBuilder(navItem, index))
}, (navItem: TopNavDTO) => JSON.stringify(navItem));
}
.barHeight($r('app.float.top_tab_bar_height'))
.barMode(BarMode.Scrollable)
.vertical(false)
.onChange((index: number) => {
Logger.info(TAG, `onChange index : ${index}`);
this.currentTopNavSelectedIndex = index;
})
}
.barHeight($r('app.float.top_tab_bar_height'))
.barMode(BarMode.Scrollable)
.vertical(false)
.onChange((index: number) => {
Logger.info(TAG, `onChange index : ${index}`);
this.currentTopNavSelectedIndex = index;
})
}
@Builder
... ...
... ... @@ -241,7 +241,7 @@ body #app::-webkit-scrollbar-track {
display: inline-block;
width: 20px;
height: 20px;
background-image: url("../image/loading.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/loading.svg");
background-position: 50%;
background-size: 100%;
background-repeat: no-repeat;
... ...
... ... @@ -81,7 +81,7 @@
position: absolute;
left: 0.32rem;
top: -0.13333rem;
background-image: url("../image/yh-icon.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/yh-icon.svg");
background-size: 100% 100%;
}
.gx-mobile .head-link-block {
... ... @@ -1124,7 +1124,7 @@
.vote .title .t-icon .icon-img {
width: 0.48rem;
height: 0.48rem;
background-image: url("../image/vote/icon_live.png");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/vote/icon_live.png");
background-size: 100% 100%;
}
.vote .title .t-icon span {
... ... @@ -1567,7 +1567,7 @@
#newsContent .swiper-block .swiper-pagination-bullet::after {
display: block;
content: "";
background: url("../image/swiper_not_active.svg");
background: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/swiper_not_active.svg");
width: 0.26666667rem;
height: 0.08rem;
background-repeat: no-repeat;
... ... @@ -1584,7 +1584,7 @@
#newsContent .swiper-block .swiper-pagination-bullet-active::after {
display: block;
content: "";
background: url("../image/swiper_active.svg");
background: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/swiper_active.svg");
width: 0.37333333rem;
height: 0.08rem;
background-repeat: no-repeat;
... ... @@ -2212,7 +2212,7 @@
top: 0.08rem;
position: absolute;
content: '';
background-image: url("../image/sourceIocn.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/sourceIocn.svg");
background-repeat: no-repeat;
background-size: 100%;
width: 0.08rem;
... ...
... ... @@ -280,7 +280,7 @@ body #app::-webkit-scrollbar-track {
display: inline-block;
width: 20px;
height: 20px;
background-image: url("../image/loading.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/loading.svg");
background-position: 50%;
background-size: 100%;
background-repeat: no-repeat;
... ...
... ... @@ -91,7 +91,7 @@
position: absolute;
left: 0.32rem;
top: -0.13333rem;
background-image: url("../image/yh-icon.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/yh-icon.svg");
background-size: 100% 100%;
}
.gx-mobile .head-link-block {
... ... @@ -1337,7 +1337,7 @@
.vote .title .t-icon .icon-img {
width: 0.48rem;
height: 0.48rem;
background-image: url("../image/vote/icon_live.png");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/vote/icon_live.png");
background-size: 100% 100%;
}
.vote .title .t-icon span {
... ... @@ -1889,7 +1889,7 @@
#newsContent .swiper-block .swiper-pagination-bullet::after {
display: block;
content: "";
background: url("../image/swiper_not_active.svg");
background: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/swiper_not_active.svg");
width: 0.26666667rem;
height: 0.08rem;
background-repeat: no-repeat;
... ... @@ -1906,7 +1906,7 @@
#newsContent .swiper-block .swiper-pagination-bullet-active::after {
display: block;
content: "";
background: url("../image/swiper_active.svg");
background: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/swiper_active.svg");
width: 0.37333333rem;
height: 0.08rem;
background-repeat: no-repeat;
... ... @@ -2672,7 +2672,7 @@
top: 0.08rem;
position: absolute;
content: '';
background-image: url("../image/sourceIocn.svg");
background-image: url("../../../../../../../wdComponent/src/main/resources/rawfile/apph5/image/sourceIocn.svg");
background-repeat: no-repeat;
background-size: 100%;
width: 0.08rem;
... ...
... ... @@ -13,6 +13,11 @@ export struct WdWebComponent {
private webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
//TODO 默认网页
webUrl: string = ConfigConstants.DETAIL_URL
// 0网页， 1本地html
type: number = 0
webResource: Resource = {} as Resource
/**
* 对外暴露webview的回调，能力
*/
... ... @@ -63,7 +68,7 @@ export struct WdWebComponent {
.height(44)
.visibility(this.backVisibility ? Visibility.Visible : Visibility.None)
Web({ src: this.webUrl, controller: this.webviewControl })
Web({ src: this.type == 0 ? this.webUrl : this.webResource, controller: this.webviewControl })
.domStorageAccess(true)
.databaseAccess(true)
.javaScriptAccess(true)
... ...