777 lines
23 KiB
Plaintext
777 lines
23 KiB
Plaintext
import { emitter } from '@kit.BasicServicesKit';
|
|
import { enableDarkMode } from '@kernel/theme_manager';
|
|
import { EmitterConstants, GlobalContext, jumpToQuote } from 'biz_common';
|
|
import { AiPickDataFetcher } from './AiPickDataFetcher';
|
|
import { AiPickHqRequestClient } from '../node/clients/AiPickHqRequestClient';
|
|
import {
|
|
CardData,
|
|
PickContractItem,
|
|
PickStrategy,
|
|
PickTabData,
|
|
} from './AiPickModels';
|
|
import {
|
|
cellColor,
|
|
cellValue,
|
|
formatColName,
|
|
getUniqueContracts,
|
|
} from './AiPickUtils';
|
|
import {
|
|
EMPTY_IMAGE_DARK,
|
|
EMPTY_IMAGE_LIGHT,
|
|
} from './AiPickConstant';
|
|
import { AllCardsCard } from '../node/model/AiDiagnosisNodeModel';
|
|
import { RouterUtil } from '../util/RouterUtil';
|
|
import { getResourceString } from '../util/ResourceUtil';
|
|
|
|
interface StrategyDescParams {
|
|
tabIdx: number;
|
|
}
|
|
|
|
@Component
|
|
export struct AiPickNodeComponent {
|
|
// 外部状态
|
|
@Link @Watch('onRefreshTriggerChange') refreshTrigger: number;
|
|
@Consume('firstPageVisible') @Watch('onFirstPageVisibleChange')
|
|
firstPageVisible: boolean = true;
|
|
@StorageProp(enableDarkMode) isDarkMode: boolean = false;
|
|
|
|
// 卡片业务数据
|
|
@State cardConfig: AllCardsCard | undefined = undefined;
|
|
@State cardData: CardData = { tabs: [] };
|
|
// 区分加载中和暂无数据
|
|
@State dataReady: boolean = false;
|
|
|
|
// Tab 状态及滚动区域
|
|
@State tabIdx: number = 0;
|
|
@State tabViewportWidth: number = 0;
|
|
@State tabContentWidth: number = 0;
|
|
@State tabScrollOffset: number = 0;
|
|
|
|
// 弹层状态
|
|
@State showExplainSheet: boolean = false;
|
|
|
|
// 生命周期与异步请求状态
|
|
private isComponentActive: boolean = false;
|
|
private dataRequestVersion: number = 0;
|
|
|
|
// 行情订阅与事件状态
|
|
private hqUnsubscribe: (() => void) | undefined;
|
|
private hqSubscriptionVersion: number = 0;
|
|
private isTcpEventSubscribed: boolean = false;
|
|
private tcpReconnectListener = (): void => {
|
|
if (!this.canUseHq()) {
|
|
return;
|
|
}
|
|
setTimeout((): void => {
|
|
if (this.canUseHq()) {
|
|
this.restartCurrentSubscription();
|
|
}
|
|
});
|
|
};
|
|
|
|
// ==================== 组件生命周期 ====================
|
|
|
|
aboutToAppear(): void {
|
|
this.isComponentActive = true;
|
|
this.updateCardConfig();
|
|
if (this.firstPageVisible) {
|
|
this.subscribeTcpNetStatus();
|
|
}
|
|
this.updateCardData();
|
|
}
|
|
|
|
aboutToDisappear(): void {
|
|
this.isComponentActive = false;
|
|
this.dataRequestVersion += 1;
|
|
this.stopSubscribeHq();
|
|
this.unSubscribeTcpNetStatus();
|
|
}
|
|
|
|
// ==================== 配置与刷新 ====================
|
|
|
|
// 从首页统一卡片配置中读取 AI Pick 配置。
|
|
private updateCardConfig(): void {
|
|
this.cardConfig = AiPickDataFetcher.getInstance().fetchCardConfig();
|
|
}
|
|
|
|
// refreshTrigger 变化时重新获取策略和合约，并在请求完成后重建行情订阅。
|
|
onRefreshTriggerChange(): void {
|
|
if (!this.isComponentActive) {
|
|
return;
|
|
}
|
|
this.updateCardConfig();
|
|
this.updateCardData();
|
|
}
|
|
|
|
// ==================== 可见性与 TCP 重连 ====================
|
|
|
|
// 页面不可见时停止行情；恢复可见后使用已有数据重建订阅。
|
|
onFirstPageVisibleChange(): void {
|
|
if (!this.isComponentActive) {
|
|
return;
|
|
}
|
|
if (!this.firstPageVisible) {
|
|
this.stopSubscribeHq();
|
|
this.unSubscribeTcpNetStatus();
|
|
return;
|
|
}
|
|
this.subscribeTcpNetStatus();
|
|
if (this.cardData.tabs.length > 0) {
|
|
this.subscribeHq();
|
|
} else {
|
|
this.updateCardData();
|
|
}
|
|
}
|
|
|
|
private subscribeTcpNetStatus(): void {
|
|
if (this.isTcpEventSubscribed || !this.canUseHq()) {
|
|
return;
|
|
}
|
|
this.isTcpEventSubscribed = true;
|
|
emitter.on(
|
|
{ eventId: EmitterConstants.NETWORK_TCP_RECONNECT },
|
|
this.tcpReconnectListener,
|
|
);
|
|
}
|
|
|
|
private unSubscribeTcpNetStatus(): void {
|
|
if (!this.isTcpEventSubscribed) {
|
|
return;
|
|
}
|
|
this.isTcpEventSubscribed = false;
|
|
emitter.off(
|
|
EmitterConstants.NETWORK_TCP_RECONNECT,
|
|
this.tcpReconnectListener,
|
|
);
|
|
}
|
|
|
|
// 收到 TCP 重连事件后，仅在页面可见时重建原合约订阅。
|
|
private restartCurrentSubscription(): void {
|
|
if (!this.canUseHq()) {
|
|
return;
|
|
}
|
|
if (this.cardData.tabs.length > 0) {
|
|
this.subscribeHq();
|
|
} else if (this.dataReady) {
|
|
this.updateCardData();
|
|
}
|
|
}
|
|
|
|
// ==================== 数据请求与行情订阅 ====================
|
|
|
|
// 请求所有策略和合约；刷新成功后保留已有行情值，避免列表短暂回退到占位状态。
|
|
private async updateCardData(): Promise<void> {
|
|
if (!this.isComponentActive) {
|
|
return;
|
|
}
|
|
const requestVersion: number = this.dataRequestVersion + 1;
|
|
this.dataRequestVersion = requestVersion;
|
|
this.stopSubscribeHq();
|
|
if (this.cardData.tabs.length === 0) {
|
|
this.dataReady = false;
|
|
}
|
|
try {
|
|
const tabs: PickTabData[] =
|
|
await AiPickDataFetcher.getInstance().fetchCardData();
|
|
if (!this.isCurrentDataRequest(requestVersion)) {
|
|
return;
|
|
}
|
|
const nextTabs: PickTabData[] = this.mergeCachedQuotes(tabs);
|
|
if (this.tabIdx >= nextTabs.length) {
|
|
this.tabIdx = 0;
|
|
}
|
|
this.cardData = { tabs: nextTabs };
|
|
this.dataReady = true;
|
|
if (nextTabs.length > 0 && this.firstPageVisible) {
|
|
this.subscribeHq();
|
|
}
|
|
} catch {
|
|
if (!this.isCurrentDataRequest(requestVersion)) {
|
|
return;
|
|
}
|
|
this.dataReady = true;
|
|
if (this.cardData.tabs.length > 0 && this.firstPageVisible) {
|
|
this.subscribeHq();
|
|
}
|
|
}
|
|
}
|
|
|
|
// HTTP 刷新时按“合约 + 市场”复用旧行情，等待新订阅首包覆盖。
|
|
private mergeCachedQuotes(tabs: PickTabData[]): PickTabData[] {
|
|
const cachedContracts: PickContractItem[] = getUniqueContracts(this.cardData);
|
|
const cachedMap: Map<string, PickContractItem> =
|
|
new Map<string, PickContractItem>();
|
|
cachedContracts.forEach((item: PickContractItem): void => {
|
|
cachedMap.set(`${item.contract}_${item.market}`, item);
|
|
});
|
|
return tabs.map((tab: PickTabData): PickTabData => {
|
|
const items: PickContractItem[] =
|
|
tab.items.map((item: PickContractItem): PickContractItem => {
|
|
const cachedItem: PickContractItem | undefined =
|
|
cachedMap.get(`${item.contract}_${item.market}`);
|
|
const nextItem: PickContractItem = {
|
|
contract: item.contract,
|
|
market: item.market,
|
|
name: item.name,
|
|
price: cachedItem?.price,
|
|
priceChg: cachedItem?.priceChg,
|
|
isMain: item.isMain,
|
|
extraFields: item.extraFields,
|
|
};
|
|
return nextItem;
|
|
});
|
|
const nextTab: PickTabData = {
|
|
strategy: tab.strategy,
|
|
items: items,
|
|
keysList: tab.keysList,
|
|
fieldList: tab.fieldList,
|
|
};
|
|
return nextTab;
|
|
});
|
|
}
|
|
|
|
// AI Pick 一次订阅所有 Tab 的去重合约，推送后合并回完整卡片数据。
|
|
private subscribeHq(): void {
|
|
this.stopSubscribeHq();
|
|
if (!this.canUseHq() || this.cardData.tabs.length === 0) {
|
|
return;
|
|
}
|
|
const subscriptionVersion: number = this.hqSubscriptionVersion;
|
|
this.hqUnsubscribe = AiPickHqRequestClient.getInstance().subscribeHq(
|
|
this.cardData,
|
|
(cardData: CardData): void => {
|
|
if (this.canUseHq() &&
|
|
subscriptionVersion === this.hqSubscriptionVersion) {
|
|
this.cardData = cardData;
|
|
}
|
|
},
|
|
);
|
|
}
|
|
|
|
private stopSubscribeHq(): void {
|
|
this.hqSubscriptionVersion += 1;
|
|
if (this.hqUnsubscribe !== undefined) {
|
|
this.hqUnsubscribe();
|
|
this.hqUnsubscribe = undefined;
|
|
}
|
|
}
|
|
|
|
private canUseHq(): boolean {
|
|
return this.isComponentActive && this.firstPageVisible;
|
|
}
|
|
|
|
private isCurrentDataRequest(requestVersion: number): boolean {
|
|
return this.isComponentActive && requestVersion === this.dataRequestVersion;
|
|
}
|
|
|
|
// ==================== 页面跳转 ====================
|
|
|
|
// 跳转客户端行情页，并保持合约、市场和名称列表顺序一致。
|
|
private jumpToDetail(item: PickContractItem): void {
|
|
const contracts: PickContractItem[] = getUniqueContracts(this.cardData);
|
|
const codeList: string =
|
|
contracts.map((contract: PickContractItem): string => contract.contract).join(',');
|
|
const marketIdList: string =
|
|
contracts.map((contract: PickContractItem): string => contract.market).join(',');
|
|
const nameList: string =
|
|
contracts.map((contract: PickContractItem): string => contract.name).join(',');
|
|
jumpToQuote(item.contract, item.market, codeList, marketIdList, nameList);
|
|
}
|
|
|
|
// 跳转到卡片配置中的标题地址。
|
|
private jumpToCardTitle(): void {
|
|
const jumpUrl: string =
|
|
this.cardConfig?.card_url.android || this.cardConfig?.card_url.ios || '';
|
|
RouterUtil.jumpPage(jumpUrl, true);
|
|
}
|
|
|
|
// 跳转 AI 策略定制首页。
|
|
private jumpToNewHome(): void {
|
|
const pageUrl: string =
|
|
'https://fupage.10jqka.com.cn/ai-web/ai-diagnosis-home.html?sync=1';
|
|
RouterUtil.jumpPage(this.buildClientUrl(pageUrl), true);
|
|
}
|
|
|
|
// 跳转策略详情页。
|
|
private jumpToStrategyDetail(strategy: PickStrategy): void {
|
|
const pageUrl: string =
|
|
'https://fupage.10jqka.com.cn/ai-web/ai-diagnosis-detail.html' +
|
|
`?id=${strategy.id}&type=${strategy.periodType}` +
|
|
`&name=${encodeURIComponent(strategy.name)}`;
|
|
RouterUtil.jumpPage(this.buildClientUrl(pageUrl), true);
|
|
}
|
|
|
|
// 跳转策略标签页。
|
|
private jumpToLabel(strategy: PickStrategy, label: string): void {
|
|
const pageUrl: string =
|
|
'https://fupage.10jqka.com.cn/ai-web/ai-diagnosis-label.html' +
|
|
`?id=${strategy.id}&type=${strategy.periodType}` +
|
|
`&label=${encodeURIComponent(label)}`;
|
|
RouterUtil.jumpPage(this.buildClientUrl(pageUrl), true);
|
|
}
|
|
|
|
// 使用宿主统一的 client.html 协议包装 H5 地址。
|
|
private buildClientUrl(pageUrl: string): string {
|
|
const title: string =
|
|
this.cardConfig?.card_title.value ||
|
|
getResourceString(getContext(this), $r('app.string.ai_pick_title'));
|
|
return 'client.html?action=ymtz^ishiddenbar=1^mode=new^webid=2804^' +
|
|
`url=${pageUrl}^title=${title}`;
|
|
}
|
|
|
|
// ==================== UI 构建 ====================
|
|
|
|
private showTabGradient(): boolean {
|
|
const maxOffset: number = this.tabContentWidth - this.tabViewportWidth;
|
|
return maxOffset > 0 && this.tabScrollOffset < maxOffset;
|
|
}
|
|
|
|
build() {
|
|
Column() {
|
|
this.buildTitleBar()
|
|
if (this.cardData.tabs.length > 0) {
|
|
this.buildMainContent()
|
|
} else {
|
|
this.buildEmptyState()
|
|
}
|
|
}
|
|
.width('100%')
|
|
.backgroundColor($r('app.color.surface_layer1_foreground'))
|
|
.borderRadius(4)
|
|
.padding({ left: 10, right: 10, bottom: 10 })
|
|
.bindSheet(this.showExplainSheet, this.buildExplainSheetContent, {
|
|
height: SheetSize.FIT_CONTENT,
|
|
dragBar: true,
|
|
showClose: false,
|
|
maskColor: $r('app.color.mask_level2'),
|
|
onDisappear: () => {
|
|
this.showExplainSheet = false;
|
|
},
|
|
radius: {
|
|
topLeft: 10,
|
|
topRight: 10,
|
|
},
|
|
})
|
|
}
|
|
|
|
@Builder
|
|
buildTitleBar() {
|
|
Row() {
|
|
Row({ space: 4 }) {
|
|
Text(this.cardConfig?.card_title.value || $r('app.string.ai_pick_title'))
|
|
.fontSize(18)
|
|
.fontWeight(500)
|
|
.fontColor($r('app.color.elements_text_primary_02'))
|
|
.maxLines(1)
|
|
|
|
if ((this.cardConfig?.card_url.android ?? '') !== '' ||
|
|
(this.cardConfig?.card_url.ios ?? '') !== '') {
|
|
Image($r('app.media.icon_arrow_forward_20'))
|
|
.width(20)
|
|
.height(20)
|
|
.fillColor($r('app.color.elements_icon_primary_02'))
|
|
}
|
|
}
|
|
.height('100%')
|
|
.alignItems(VerticalAlign.Center)
|
|
.onClick(() => {
|
|
this.jumpToCardTitle();
|
|
})
|
|
|
|
if ((this.cardConfig?.explain_message ?? '') !== '') {
|
|
Image($r('app.media.icon_info_24'))
|
|
.width(16)
|
|
.height(16)
|
|
.fillColor($r('app.color.elements_icon_tertiary'))
|
|
.margin({ left: 8 })
|
|
.onClick(() => {
|
|
this.showExplainSheet = true;
|
|
})
|
|
}
|
|
|
|
Blank()
|
|
}
|
|
.width('100%')
|
|
.height(48)
|
|
.alignItems(VerticalAlign.Center)
|
|
}
|
|
|
|
@Builder
|
|
buildExplainSheetContent() {
|
|
Column() {
|
|
Stack({ alignContent: Alignment.End }) {
|
|
Text(this.cardConfig?.explain_title ||
|
|
this.cardConfig?.card_title.value ||
|
|
$r('app.string.ai_pick_title'))
|
|
.fontSize(18)
|
|
.fontWeight(500)
|
|
.textAlign(TextAlign.Center)
|
|
.width('100%')
|
|
|
|
Image($r('app.media.icon_close_24'))
|
|
.width(24)
|
|
.height(24)
|
|
.fillColor($r('app.color.elements_icon_primary_02'))
|
|
.onClick(() => {
|
|
this.showExplainSheet = false;
|
|
})
|
|
}
|
|
.height(64)
|
|
.width('100%')
|
|
|
|
Scroll() {
|
|
Text((this.cardConfig?.explain_message ?? '')
|
|
.replace(new RegExp('\\\\n', 'g'), '\n'))
|
|
.width('100%')
|
|
.fontSize(14)
|
|
.lineHeight(22)
|
|
.fontColor($r('app.color.elements_text_primary_02'))
|
|
}
|
|
.width('100%')
|
|
.scrollBar(BarState.Off)
|
|
|
|
Button($r('app.string.card_explain_confirm'))
|
|
.type(ButtonType.Normal)
|
|
.backgroundColor($r('app.color.elements_button_bg_primary'))
|
|
.width('100%')
|
|
.height(44)
|
|
.borderRadius(4)
|
|
.margin({ top: 16 })
|
|
.onClick(() => {
|
|
this.showExplainSheet = false;
|
|
})
|
|
}
|
|
.width('100%')
|
|
.backgroundColor($r('app.color.surface_layer3_background'))
|
|
.padding({
|
|
bottom: px2vp(GlobalContext.navigationBarHeight),
|
|
left: 16,
|
|
right: 16,
|
|
})
|
|
}
|
|
|
|
@Builder
|
|
buildMainContent() {
|
|
Column() {
|
|
this.buildTabBar()
|
|
if (this.cardData.tabs[this.tabIdx].items.length > 0) {
|
|
this.buildStrategyDesc({ tabIdx: this.tabIdx })
|
|
this.buildTable()
|
|
} else {
|
|
this.buildNoContractState()
|
|
}
|
|
this.buildCustomStrategy()
|
|
}
|
|
.width('100%')
|
|
.height(321)
|
|
}
|
|
|
|
@Builder
|
|
buildTabBar() {
|
|
Stack({ alignContent: Alignment.End }) {
|
|
Scroll() {
|
|
Row({ space: 8 }) {
|
|
ForEach(this.cardData.tabs, (tab: PickTabData, index: number) => {
|
|
Text(`${tab.strategy.name}(${tab.strategy.count})`)
|
|
.fontSize(14)
|
|
.fontWeight(this.tabIdx === index
|
|
? FontWeight.Medium
|
|
: FontWeight.Normal)
|
|
.fontColor(this.tabIdx === index
|
|
? $r('app.color.elements_text_primary_01')
|
|
: $r('app.color.elements_text_secondary'))
|
|
.constraintSize({ minWidth: 66 })
|
|
.maxLines(1)
|
|
.textAlign(TextAlign.Center)
|
|
.height(30)
|
|
.padding({ left: 8, right: 8 })
|
|
.borderRadius(4)
|
|
.backgroundColor(this.tabIdx === index
|
|
? $r('app.color.elements_others_bg_primary')
|
|
: $r('app.color.elements_button_bg_tertiary'))
|
|
.onClick(() => {
|
|
this.tabIdx = index;
|
|
})
|
|
}, (tab: PickTabData): string =>
|
|
`${tab.strategy.periodType}_${tab.strategy.id}`)
|
|
}
|
|
.onAreaChange((_oldValue: Area, newValue: Area) => {
|
|
this.tabContentWidth = Number(newValue.width);
|
|
})
|
|
}
|
|
.width('100%')
|
|
.height(30)
|
|
.padding({ right: 10 })
|
|
.scrollable(ScrollDirection.Horizontal)
|
|
.scrollBar(BarState.Off)
|
|
.align(Alignment.Start)
|
|
.onScroll((xOffset: number, _yOffset: number) => {
|
|
this.tabScrollOffset = xOffset;
|
|
})
|
|
|
|
if (this.showTabGradient()) {
|
|
Row()
|
|
.width(24)
|
|
.height(30)
|
|
.linearGradient({
|
|
angle: 90,
|
|
colors: [
|
|
[$r('app.color.tab_gradient_start'), 0],
|
|
[$r('app.color.surface_layer1_foreground'), 1],
|
|
],
|
|
})
|
|
.hitTestBehavior(HitTestMode.None)
|
|
}
|
|
}
|
|
.width('100%')
|
|
.height(30)
|
|
.onAreaChange((_oldValue: Area, newValue: Area) => {
|
|
this.tabViewportWidth = Number(newValue.width);
|
|
})
|
|
}
|
|
|
|
@Builder
|
|
buildStrategyDesc($$: StrategyDescParams) {
|
|
Row() {
|
|
Column({ space: 4 }) {
|
|
if (this.cardData.tabs[$$.tabIdx].strategy.detail !== '') {
|
|
Text(this.cardData.tabs[$$.tabIdx].strategy.detail)
|
|
.fontSize(14)
|
|
.lineHeight(21)
|
|
.fontColor($r('app.color.elements_text_primary_02'))
|
|
.maxLines(2)
|
|
.textOverflow({ overflow: TextOverflow.Ellipsis })
|
|
.onClick(() => {
|
|
this.jumpToStrategyDetail(
|
|
this.cardData.tabs[$$.tabIdx].strategy,
|
|
);
|
|
})
|
|
}
|
|
|
|
if (this.cardData.tabs[$$.tabIdx].strategy.tagList.length > 0) {
|
|
Row({ space: 4 }) {
|
|
ForEach(
|
|
this.cardData.tabs[$$.tabIdx].strategy.tagList,
|
|
(tag: string) => {
|
|
Row() {
|
|
Text(tag)
|
|
.fontSize(11)
|
|
.fontColor($r('app.color.elements_text_primary_01'))
|
|
.maxLines(1)
|
|
.textOverflow({ overflow: TextOverflow.Ellipsis })
|
|
}
|
|
.height(18)
|
|
.padding({ left: 3, right: 3 })
|
|
.borderRadius(2)
|
|
.border({
|
|
width: 0.5,
|
|
color: $r('app.color.elements_text_primary_01'),
|
|
})
|
|
.alignItems(VerticalAlign.Center)
|
|
.onClick(() => {
|
|
this.jumpToLabel(
|
|
this.cardData.tabs[$$.tabIdx].strategy,
|
|
tag,
|
|
);
|
|
})
|
|
},
|
|
(tag: string): string => tag,
|
|
)
|
|
}
|
|
.width('100%')
|
|
}
|
|
}
|
|
.layoutWeight(1)
|
|
.alignItems(HorizontalAlign.Start)
|
|
|
|
if ((this.cardData.tabs[$$.tabIdx]
|
|
.strategy.imgs[this.isDarkMode ? 1 : 0] ?? '') !== '') {
|
|
Image(this.cardData.tabs[$$.tabIdx]
|
|
.strategy.imgs[this.isDarkMode ? 1 : 0] ?? '')
|
|
.width(104)
|
|
.height(66)
|
|
.objectFit(ImageFit.Contain)
|
|
.margin({ left: 10 })
|
|
.onClick(() => {
|
|
this.jumpToStrategyDetail(
|
|
this.cardData.tabs[$$.tabIdx].strategy,
|
|
);
|
|
})
|
|
}
|
|
}
|
|
.width('100%')
|
|
.height(86)
|
|
.padding({ top: 10, bottom: 10 })
|
|
.alignItems(VerticalAlign.Top)
|
|
}
|
|
|
|
@Builder
|
|
buildTable() {
|
|
Column() {
|
|
Row({ space: 8 }) {
|
|
Text(formatColName(this.cardData.tabs[this.tabIdx].keysList[0]))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
.width('35%')
|
|
Text(formatColName(this.cardData.tabs[this.tabIdx].keysList[1]))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
.layoutWeight(1)
|
|
.textAlign(TextAlign.End)
|
|
Text(formatColName(this.cardData.tabs[this.tabIdx].keysList[2]))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
.layoutWeight(1)
|
|
.textAlign(TextAlign.End)
|
|
}
|
|
.width('100%')
|
|
.height(40)
|
|
|
|
ForEach(
|
|
this.cardData.tabs[this.tabIdx].items,
|
|
(item: PickContractItem) => {
|
|
this.buildContractRow(item)
|
|
},
|
|
(item: PickContractItem): string =>
|
|
`${item.contract}_${item.market}_${item.price ?? ''}_${item.priceChg ?? ''}`,
|
|
)
|
|
}
|
|
.width('100%')
|
|
.height(175)
|
|
}
|
|
|
|
@Builder
|
|
buildContractRow(item: PickContractItem) {
|
|
Row({ space: 8 }) {
|
|
Row({ space: 5 }) {
|
|
Text(item.name)
|
|
.fontSize(16)
|
|
.maxFontSize(16)
|
|
.minFontSize(9)
|
|
.fontColor($r('app.color.elements_text_primary_02'))
|
|
.maxLines(1)
|
|
.textOverflow({ overflow: TextOverflow.Ellipsis })
|
|
if (item.isMain) {
|
|
Text($r('app.string.ai_pick_main_contract'))
|
|
.fontSize(11)
|
|
.fontColor($r('app.color.hotlist_orange'))
|
|
.width(16)
|
|
.height(16)
|
|
.textAlign(TextAlign.Center)
|
|
.borderRadius(2)
|
|
.backgroundColor($r('app.color.bg_hotlist_orange'))
|
|
}
|
|
}
|
|
.width('35%')
|
|
.alignItems(VerticalAlign.Center)
|
|
|
|
Text(cellValue(
|
|
this.cardData.tabs[this.tabIdx].keysList[1],
|
|
item,
|
|
this.cardData.tabs[this.tabIdx].fieldList,
|
|
))
|
|
.fontSize(16)
|
|
.maxFontSize(16)
|
|
.minFontSize(9)
|
|
.fontWeight(500)
|
|
.fontColor(cellColor(
|
|
this.cardData.tabs[this.tabIdx].keysList[1],
|
|
item,
|
|
))
|
|
.layoutWeight(1)
|
|
.textAlign(TextAlign.End)
|
|
.maxLines(1)
|
|
.textOverflow({ overflow: TextOverflow.Ellipsis })
|
|
|
|
Text(cellValue(
|
|
this.cardData.tabs[this.tabIdx].keysList[2],
|
|
item,
|
|
this.cardData.tabs[this.tabIdx].fieldList,
|
|
))
|
|
.fontSize(16)
|
|
.maxFontSize(16)
|
|
.minFontSize(9)
|
|
.fontWeight(500)
|
|
.fontColor(cellColor(
|
|
this.cardData.tabs[this.tabIdx].keysList[2],
|
|
item,
|
|
))
|
|
.layoutWeight(1)
|
|
.textAlign(TextAlign.End)
|
|
.maxLines(1)
|
|
.textOverflow({ overflow: TextOverflow.Ellipsis })
|
|
}
|
|
.width('100%')
|
|
.height(45)
|
|
.alignItems(VerticalAlign.Center)
|
|
.border({
|
|
width: { top: 1 },
|
|
color: $r('app.color.elements_others_divider_primary'),
|
|
})
|
|
.onClick(() => {
|
|
this.jumpToDetail(item);
|
|
})
|
|
}
|
|
|
|
@Builder
|
|
buildCustomStrategy() {
|
|
Row({ space: 2 }) {
|
|
Text($r('app.string.ai_pick_custom_strategy'))
|
|
.fontSize(14)
|
|
.lineHeight(20)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
Image($r('app.media.icon_arrow_forward_20'))
|
|
.width(14)
|
|
.height(14)
|
|
.fillColor($r('app.color.elements_icon_tertiary'))
|
|
}
|
|
.width('100%')
|
|
.height(30)
|
|
.justifyContent(FlexAlign.Center)
|
|
.alignItems(VerticalAlign.Center)
|
|
.onClick(() => {
|
|
this.jumpToNewHome();
|
|
})
|
|
}
|
|
|
|
@Builder
|
|
buildEmptyState() {
|
|
Column() {
|
|
if (this.dataReady) {
|
|
Image(this.isDarkMode ? EMPTY_IMAGE_DARK : EMPTY_IMAGE_LIGHT)
|
|
.width(120)
|
|
.height(120)
|
|
.margin({ bottom: 8 })
|
|
Text($r('app.string.ai_pick_no_contract'))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
} else {
|
|
Text($r('app.string.ai_pick_loading'))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
}
|
|
}
|
|
.width('100%')
|
|
.height(321)
|
|
.alignItems(HorizontalAlign.Center)
|
|
.justifyContent(FlexAlign.Center)
|
|
}
|
|
|
|
@Builder
|
|
buildNoContractState() {
|
|
Column() {
|
|
Image(this.isDarkMode ? EMPTY_IMAGE_DARK : EMPTY_IMAGE_LIGHT)
|
|
.width(100)
|
|
.height(100)
|
|
Text($r('app.string.ai_pick_no_contract'))
|
|
.fontSize(14)
|
|
.fontColor($r('app.color.elements_text_tertiary'))
|
|
}
|
|
.width('100%')
|
|
.height(261)
|
|
.alignItems(HorizontalAlign.Center)
|
|
.justifyContent(FlexAlign.Center)
|
|
}
|
|
|
|
}
|