/**
* aPaaS Custom Component Meta Definition
*
* This file defines the component metadata, props, events, and methods
* for the TikTok Analytics Dashboard custom component
*/
export interface TikTokDashboardProps {
// Chart configuration
chartType: 'line' | 'bar' | 'pie' | 'dashboard';
width: string;
height: number;
// Data source
bitableTableId: string;
bitableAppToken: string;
// Display options
topVideosMetric: 'views' | 'likes' | 'shares';
showViewsOverTime: boolean;
showTopVideos: boolean;
showEngagement: boolean;
// Auto refresh
autoRefresh: boolean;
refreshInterval: number;
// Event handlers
onChartReady?: (chart: any) => void;
onChartClick?: (params: any) => void;
onDataUpdate?: (data: any) => void;
onError?: (error: Error) => void;
}
export const defaultProps: Partial<TikTokDashboardProps> = {
chartType: 'dashboard',
width: '100%',
height: 400,
topVideosMetric: 'views',
showViewsOverTime: true,
showTopVideos: true,
showEngagement: true,
autoRefresh: false,
refreshInterval: 300000, // 5 minutes
};
export interface TikTokDashboardMethods {
refresh: () => Promise<void>;
exportImage: () => Promise<string>;
updateFilter: (startDate: string, endDate: string) => Promise<void>;
}
export const componentMeta = {
name: 'TikTokAnalyticsDashboard',
displayName: 'TikTok Analytics Dashboard',
version: '1.0.0',
description: 'Advanced TikTok analytics visualization component powered by VChart',
category: 'data-visualization',
props: {
chartType: {
type: 'string',
enum: ['line', 'bar', 'pie', 'dashboard'],
default: 'dashboard',
required: false,
},
bitableTableId: {
type: 'string',
required: true,
},
bitableAppToken: {
type: 'string',
required: true,
},
width: {
type: 'string',
default: '100%',
},
height: {
type: 'number',
default: 400,
},
topVideosMetric: {
type: 'string',
enum: ['views', 'likes', 'shares'],
default: 'views',
},
autoRefresh: {
type: 'boolean',
default: false,
},
refreshInterval: {
type: 'number',
default: 300000,
},
showViewsOverTime: {
type: 'boolean',
default: true,
},
showTopVideos: {
type: 'boolean',
default: true,
},
showEngagement: {
type: 'boolean',
default: true,
},
},
events: ['onChartReady', 'onChartClick', 'onDataUpdate', 'onError'],
methods: ['refresh', 'exportImage', 'updateFilter'],
};
