【案例+1】HarmonyOS官方模板优秀案例（第7期：金融理财 · 记账应用）​

​​支付宝SDK​​​

​​微信支付SDK​​​

​​银联SDK​​​

​​腾讯QQ SDK​​​

​​新浪微博SDK​​​

​​极光PUSH SDK​​​

​​友盟移动统计SDK​​​

​​腾讯微信SDK​​​

​​个推​​​

​​Bugly​​​

​​ShareSDK​​​

​​听云SDK​​​

​​七牛云存储​​​​SDK​​​

​记账模板

 |-- 首页

 |    |-- 账单查询

 |    |-- 新增账单

 |    |-- 账单类型管理

 |    |-- 编辑账单

 |    |-- 删除账单

 |    └-- 账单详情查看

 |-- 统计

 |    |-- 账单报表查看

 |    |-- 账单分类查看

 |    └-- 日历视图

 └-- 资产

      |-- 资产查询

      |-- 新增资产

      |-- 编辑资产

      |-- 删除资产

      └-- 资产内记账

MoneyTrack

|--commons // 公共能力层

| └--commonlib // 基础能力包

| └--src/main

| |--ets

| | |--components // 公共组件

| | | |-- CommonButton.ets // 公共按钮

| | | |-- CommonDivider.ets // 公共分割线

| | | |-- CommonHeader.ets // 公共标题栏

| | | |-- CommonMonthPicker.ets // 月份选择

| | | |-- ContainerColumn.ets // 垂直卡片容器

| | | └-- ContainerRow.ets // 水平卡片容器

| | |--constants // 公共静态变量

| | | |-- CommonConstants.ets // 公共常量

| | | └-- CommonEnums.ets // 公共枚举

| | |

| | |--dialogs // 公共弹窗

| | | └-- CommonConfirmDialog.ets // 二次确认弹窗

| | |

| | └--utils // 公共方法

| | |-- eventbus // 全局事件管理

| | |-- framework // 全局框架管理

| | |-- logger // 日志

| | |-- router // 路由

| | └-- window// 窗口

| |

| └-- resources/base/element

| |-- color.json // 全局颜色

| |-- font.json // 全局字号

| └-- style.json // 全局样式

|

|--components // 可分可合组件包

| |-- asset_base // 资产通用基础包

| |-- asset_card // 资产卡片

| |-- asset_manage // 资产管理

| |-- bill_base // 账单通用基础包

| |-- bill_card // 账单卡片

| |-- bill_chart // 账单图表

| |-- bill_data_processing // 账单数据处理

| └-- bill_manage // 账单管理

|

|--features // 基础特性层

| |-- assets // 资产

| | └--src/main/ets/views

| | |--AssetDetailPage.ets // 资产详情页

| | └--AssetsView.ets // 资产页

| |-- home // 首页明细

| | └--src/main/ets/views

| | |--BillDetailPage.ets // 账单详情页

| | └--HomeView.ets // 首页

| └-- statistics // 统计

| └--src/main/ets/views

| |--BillByResourceView.ets // 分类账单详情

| └--StatisticsView.ets // 统计页

└--products // 设备入口层

└-- entry

└--src/main/ets

|-- pages

| └-- MainEntry.ets // 主入口

└-- widgets

|-- MiddleCard.ets // 2*4中号卡片

└-- MiniCard.ets // 2*2小号卡片

ts

// MoneyTrack/components/bill_data_processing/src/main/ets/utils/basedb/BaseDB.ets

const TAG = '[BaseDB]';

// 基础数据库操作类

export abstract class BaseDB {

protected rdbStore: relationalStore.RdbStore | null = null;

protected abstract dbConfig: relationalStore.StoreConfig;

protected abstract tableSchemas: TableSchema[];

// 初始化数据库

public async initialize(context: Context) {

try {

this.rdbStore = await relationalStore.getRdbStore(context, this.dbConfig);

await this._createTables();

Logger.info(TAG, `[${this.dbConfig.name}] database initialized success`);

} catch (err) {

Logger.error(

TAG,

`database initialized failed. error: ${JSON.stringify(err)}`,

);

}

}

// 创建表结构

private async _createTables() {

if (!this.rdbStore) {

return;

}

try {

for (const schema of this.tableSchemas) {

await this.rdbStore.executeSql(schema.createSQL);

if (schema.indexes) {

for (const indexSQL of schema.indexes) {

await this.rdbStore.executeSql(indexSQL);

}

}

}

} catch (err) {

Logger.error(TAG, `create table failed. error: ${JSON.stringify(err)}`);

}

}

// 通用插入方法

protected async insert<T>(tableName: string, values: T): Promise<number> {...}

// 通用更新方法

protected async update<T>(

tableName: string,

values: T,

conditions: TablePredicateParams[],

): Promise<number> {...}

// 通用删除方法

protected async delete(

tableName: string,

conditions: TablePredicateParams[],

): Promise<number> {...}

// 通用查询方法

protected async query<T>(

tableName: string,

conditions: TablePredicateParams[],

orderBy?: TableOrderByParams,

limit?: number,

): Promise<T[]> {...}

}

ts

// MoneyTrack/components/bill_data_processing/src/main/ets/utils/accountingdb/AccountingDB.ets

const TAG = '[AccountingDB]';

class AccountingDB extends BaseDB {

protected dbConfig: relationalStore.StoreConfig =

AccountingDBConstants.DB_CONFIG;

protected tableSchemas: TableSchema[] = [

{

tableName: AccountingDBConstants.ACCOUNT_TABLE_NAME,

createSQL: AccountingDBConstants.ACCOUNT_TABLE_SQL_CREATE,

indexes: AccountingDBConstants.ACCOUNT_TABLE_INDEXES_CREATE,

},

{

tableName: AccountingDBConstants.TRANSACTION_TABLE_NAME,

createSQL: AccountingDBConstants.TRANSACTION_TABLE_SQL_CREATE,

indexes: AccountingDBConstants.TRANSACTION_TABLE_INDEXES_CREATE,

},

{

tableName: AccountingDBConstants.ASSET_TABLE_NAME,

createSQL: AccountingDBConstants.ASSET_TABLE_SQL_CREATE,

indexes: AccountingDBConstants.ASSET_TABLE_INDEXES_CREATE,

},

];

public async initialize(context: Context) {

await super.initialize(context);

await this._initDefaultAccounts();

}

// 初始化账本

private async _initDefaultAccounts() {

const accountTable: AccountTableBasis = {

accountId: AccountID.DEFAULT,

name: '默认账本',

type: 'default',

};

const existing = await this.query<Account>(

AccountingDBConstants.ACCOUNT_TABLE_NAME,

[

{

field: AccountTableFields.NAME,

operator: DBOperator.EQUAL,

value: accountTable.name,

},

{

field: AccountTableFields.TYPE,

operator: DBOperator.EQUAL,

value: accountTable.type,

},

],

);

if (existing.length === 0) {

await this.insert(AccountingDBConstants.ACCOUNT_TABLE_NAME, accountTable);

Logger.info(TAG, 'create account table success');

}

}

// 新增交易记录

public async addTransaction(userTx: UserTransaction): Promise<void> {

const tx: TransactionTableBasis = {

transactionId: new Date().getTime(),

accountId: userTx.accountId,

type: userTx.type,

resource: userTx.resource,

amount: userTx.amount,

date: userTx.date,

note: userTx.note,

excluded: userTx.excluded,

assetId: userTx.assetId,

};

return this.transaction(async () => {

try {

await this.insert(AccountingDBConstants.TRANSACTION_TABLE_NAME, tx);

promptAction.showToast({ message: '交易记录新增成功~' });

await this.updateAssetAccountFromTransaction(userTx);

Logger.info(TAG, 'insert transaction success.');

} catch (err) {

promptAction.showToast({ message: '交易记录新增失败，请稍后重试~' });

Logger.error(

TAG,

'insert transaction failed. error:' + JSON.stringify(err),

);

}

});

}

// ...

}

const accountingDB = new AccountingDB();

export { accountingDB as AccountingDB };

ts

// MoneyTrack/products/entry/src/main/ets/common/WidgetUtil.ets

import { preferences } from '@kit.ArkData';

import { BusinessError, commonEventManager } from '@kit.BasicServicesKit';

import { formBindingData, formProvider } from '@kit.FormKit';

import { AmountSummary, BillProcessingModel } from 'bill_data_processing';

import { Logger } from 'commonlib';

const TAG = '[WidgetUtil]';

export class WidgetUtil {

private static readonly _fileName: string = 'accounting_form_id_file';

private static readonly _formIdKey: string = 'accounting_form_id_key';

private static readonly _formIdEventName: string = 'form_id_event_name';

private static _billProcessing: BillProcessingModel =

new BillProcessingModel();

public static getFormIds(ctx: Context) {

const store = WidgetUtil._getStore(ctx);

return store.getSync(WidgetUtil._formIdKey, []) as string[];

}

public static async addFormId(formId: string, cxt: Context) {

const list = WidgetUtil.getFormIds(cxt);

if (!list.some((id) => id === formId)) {

list.push(formId);

const store = WidgetUtil._getStore(cxt);

store.putSync(WidgetUtil._formIdKey, list);

await store.flush();

}

}

public static async delFormId(formId: string, cxt: Context) {

const list = WidgetUtil.getFormIds(cxt);

const index = list.findIndex((id) => id === formId);

if (index !== -1) {

list.splice(index, 1);

const store = WidgetUtil._getStore(cxt);

store.putSync(WidgetUtil._formIdKey, list);

await store.flush();

}

}

// 发布公共事件跨进程传递卡片id

public static publishFormId(formId: string, isDelete: boolean) {

commonEventManager.publish(

WidgetUtil._formIdEventName,

{ data: formId, parameters: { isDelete } },

(err: BusinessError) => {

if (err) {

Logger.error(

TAG,

`Failed to publish common event. Code is ${err.code}, message is ${err.message}`,

);

} else {

Logger.info(TAG, 'Succeeded in publishing common event.');

}

},

);

}

// 订阅获取卡片id

public static async subscribeFormId(ctx: Context) {

let subscriber: commonEventManager.CommonEventSubscriber | undefined =

undefined;

let subscribeInfo: commonEventManager.CommonEventSubscribeInfo = {

events: [WidgetUtil._formIdEventName],

publisherPermission: '',

};

commonEventManager.createSubscriber(subscribeInfo, (err1, data1) => {

if (err1) {

Logger.error(

TAG,

`Failed to create subscriber. Code is ${err1.code}, message is ${err1.message}`,

);

return;

}

subscriber = data1;

// 订阅公共事件回调

commonEventManager.subscribe(subscriber, async (err2, data2) => {

if (err2) {

Logger.error(

TAG,

`Failed to subscribe common event. Code is ${err2.code}, message is ${err2.message}`,

);

return;

} else {

if (data2.parameters?.isDelete) {

WidgetUtil.delFormId(data2.data as string, ctx);

} else {

WidgetUtil.addFormId(data2.data as string, ctx);

WidgetUtil.updateWidgetsWhenChange();

}

Logger.info(TAG, 'Succeeded in creating subscriber1.');

}

});

});

}

public static async updateWidgetsWhenChange() {

await WidgetUtil._billProcessing.getBillReport();

const summary: AmountSummary = {

totalExpense: Number(WidgetUtil._billProcessing.totalExpense),

totalIncome: Number(WidgetUtil._billProcessing.totalIncome),

};

WidgetUtil.getFormIds(getContext()).forEach((id) => {

const income = summary.totalIncome;

const expense = summary.totalExpense;

class TempForm {

date: Date = new Date();

income: number = 0;

expense: number = 0;

}

const formData: TempForm = {

date: new Date(),

income,

expense,

};

formProvider.updateForm(

id,

formBindingData.createFormBindingData(formData),

);

});

}

private static _getStore(ctx: Context) {

return preferences.getPreferencesSync(ctx, { name: WidgetUtil._fileName });

}

}

ts

// MoneyTrack/products/entry/src/main/ets/entryformability/EntryFormAbility.ets

import { Want } from '@kit.AbilityKit';

import { emitter } from '@kit.BasicServicesKit';

import { formBindingData, FormExtensionAbility, formInfo } from '@kit.FormKit';

import { WidgetUtil } from '../common/WidgetUtil';

export default class EntryFormAbility extends FormExtensionAbility {

public onAddForm(want: Want) {

let formId = want.parameters?.[formInfo.FormParam.IDENTITY_KEY] as string | undefined;

if (formId) {

WidgetUtil.addFormId(formId, this.context);

WidgetUtil.publishFormId(formId, false);

}

return formBindingData.createFormBindingData('');

}

public onUpdateForm() {

emitter.emit({ eventId: 1 });

}

public onRemoveForm(formId: string) {

WidgetUtil.delFormId(formId, this.context);

WidgetUtil.publishFormId(formId, true);

}

}