指令快捷操作栏
使用示例
1. 根据自身需求实现 ListDataProvider、DataItemProvider 接口,此为操作栏列表的数据适配器
/**
* 操作栏默认模式数据适配器
*
* @author chitanda
* @date 2022-06-28 18:06:54
* @export
* @class DefaultModeDataProvider
* @implements {ListDataProvider<DefaultModeDataItemProvider>}
*/
export class DefaultModeDataProvider implements ListDataProvider<DefaultModeDataItemProvider> {
/**
* 列表行内点击指令
*
* @author chitanda
* @date 2022-06-30 11:06:49
* @type {string}
*/
command: string = CommandConst.DEFAULT_MODE_CLICK;
list: DefaultModeDataItemProvider[] = [];
constructor() {
// 注册列表行内点击指令
commands.register(
CommandConst.DEFAULT_MODE_CLICK,
async (data: DefaultModeDataItemProvider) => {
const { keyboards } = data.mode.opts;
Mousetrap.trigger(keyboards instanceof Array ? keyboards[0] : keyboards);
},
{
id: CommandConst.DEFAULT_MODE_CLICK,
title: '默认模式点击',
},
);
}
/**
* 过滤展示列表
*
* @author chitanda
* @date 2022-06-29 14:06:49
* @param {string} [searchVal]
* @return {*} {Promise<DefaultModeDataItemProvider[]>}
*/
async getItems(_searchVal?: string): Promise<DefaultModeDataItemProvider[]> {
// 减一是因为默认模式不需要显示
if (quickActionModeRegister.size - 1 !== this.list.length) {
this.list = [];
const modes = quickActionModeRegister.getModes();
for (let i = 1; i < modes.length; i++) {
const mode = modes[i];
this.list.push(new DefaultModeDataItemProvider(i.toString(), mode));
}
}
return this.list;
}
}
/**
* 列表数据项
*
* @author chitanda
* @date 2022-06-28 18:06:15
* @export
* @class DefaultModeDataItemProvider
* @implements {DataItemProvider}
*/
export class DefaultModeDataItemProvider implements DataItemProvider {
readonly id: string = '';
readonly label: string;
readonly tooltip?: string;
readonly icon?: string;
readonly description?: string;
readonly mode: QuickActionMode;
/**
* Creates an instance of DefaultModeDataItemProvider.
*
* @author chitanda
* @date 2022-06-30 11:06:54
* @param {string} id
* @param {QuickActionMode} mode
*/
constructor(id: string, mode: QuickActionMode) {
const { opts } = mode;
this.mode = mode;
this.id = id;
this.label = opts.title;
this.icon = opts.icon;
this.description = opts.description;
}
}
2. 注册新适配的模式
quickActionModeRegister.addModel({
title: '默认模式',
tooltip: '默认模式提示',
description: '默认模式描述',
icon: './assets/svg/icon-default.svg',
type: ModeType.DEFAULT,
keyboards: 'ctrl+p',
tag: '',
provider: new DefaultModeDataProvider(),
});