km-card-layout-component-miniprogram 0.1.5 → 0.1.7

package/src/vendor/km-card-layout-core/interface/data/payload.ts

@@ -0,0 +1,45 @@
+import { CardLayoutSchema } from "../layout";
+
+/**
+ * 背景项
+ */
+export interface TemplateBackground {
+  id: number;
+  name: string;
+  fileId?: number;
+  fontColor?: string;
+  fontColorExtra?: { name: string | string[]; color: string }[];
+  imgUrl: string;
+}
+
+/**
+ * 元素项
+ */
+export interface TemplateItem {
+  id: number;
+  name: string;
+  bind: string;
+  key?: string;
+  icon?: string;
+  default?: string;
+  type: 'text' | 'image';
+  cate: number;
+  required?: 0 | 1;
+}
+
+export interface TemplateLayoutInfo {
+  id: number | string;
+  name?: string;
+  previewImg?: string;
+  height?: number;
+  width?: number;
+  enableBgIds?: string | null;
+  enableItemIds?: string | null;
+  content?: CardLayoutSchema[];
+  isVip?: 0 | 1;
+  isDouble?: 0 | 1;
+  isMoreCompany?: 0 | 1;
+  isBgCustomize?: 0 | 1;
+  createAt?: string;
+  updateAt?: string;
+}

package/src/vendor/km-card-layout-core/interface/elements.ts

@@ -0,0 +1,73 @@
+export type CardElementType =
+  | 'text'
+  | 'image'
+  | 'icon'
+  | 'custom'
+  | 'layout-panel';
+
+export interface AbsoluteLayoutDefinition {
+  mode: 'absolute';
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+  zIndex?: number;
+}
+
+export interface CardElementBase {
+  id: string;
+  type: CardElementType;
+  layout: AbsoluteLayoutDefinition;
+  visible?: boolean;
+  binding?: string;
+  style?: Record<string, string | number | undefined>;
+  defaultValue?: string;
+  key?: string;
+}
+
+export interface TextIconConfig {
+  name?: string;
+  size?: number;
+  color?: string;
+  gap?: number;
+  align?: 'left' | 'right';
+  enable?: boolean;
+  style?: 'fill' | 'dot' | 'line';
+}
+
+export interface TextElement extends CardElementBase {
+  type: 'text';
+  align?: 'left' | 'center' | 'right';
+  icon?: TextIconConfig;
+}
+
+export interface ImageElement extends CardElementBase {
+  type: 'image';
+  alt?: string;
+  fit?: 'cover' | 'contain';
+  defaultUrl?: string;
+}
+
+export interface IconElement extends CardElementBase {
+  type: 'icon';
+  name?: string;
+}
+
+export interface CustomElement extends CardElementBase {
+  type: 'custom';
+}
+
+export interface LayoutPanelElement extends CardElementBase {
+  type: 'layout-panel';
+  container: {
+    mode: 'absolute';
+  };
+  children?: CardElement[];
+}
+
+export type CardElement =
+  | TextElement
+  | ImageElement
+  | IconElement
+  | CustomElement
+  | LayoutPanelElement;

package/src/vendor/km-card-layout-core/interface/index.ts

@@ -0,0 +1,4 @@
+export * from './elements';
+export * from './layout';
+export * from './render';
+export * from './data/payload';

package/src/vendor/km-card-layout-core/interface/layout.ts

@@ -0,0 +1,19 @@
+import type { CardElement } from './elements';
+
+export interface CardLayoutSchema {
+  name?: string;
+  container: {
+    mode: 'absolute';
+  };
+  width: number;
+  height: number;
+  backgroundImage?: string;
+  backgroundZIndex?: number;
+  fontColor?: string;
+  borderRadius?: number;
+  padding?: number;
+  children: CardElement[];
+  thumbnail?: string;
+}
+
+export type CardLayoutInput = CardLayoutSchema[];

package/src/vendor/km-card-layout-core/interface/render.ts

@@ -0,0 +1,52 @@
+import type { CardElementType, CardElement } from './elements';
+import type { CardLayoutInput, CardLayoutSchema } from './layout';
+
+export interface RenderNodeIcon {
+  name: string;
+  text?: string;
+  size?: string;
+  color?: string;
+  gap?: string;
+  align?: 'left' | 'right';
+}
+
+export interface RenderNode {
+  id: string;
+  type: CardElementType | 'text';
+  wrapperStyle: string;
+  contentStyle: string;
+  name?: string;
+  text?: string;
+  src?: string;
+  mode?: string;
+  children?: RenderNode[];
+  visible?: boolean;
+  icon?: RenderNodeIcon;
+}
+
+export interface RenderPageResult {
+  renderTree: RenderNode[];
+  cardStyle: string;
+  backgroundImage: string;
+  backgroundStyle: string;
+}
+
+export type RenderResult = RenderPageResult[];
+
+export interface BindingContext {
+  /**
+   * 当前上下文数据的绑定前缀（预留给嵌套场景）
+   */
+  contextBinding?: string;
+  /**
+   * 当前上下文数据（预留给嵌套场景）
+   */
+  contextData?: any;
+}
+
+export type {
+  CardElement,
+  CardElementType,
+  CardLayoutInput,
+  CardLayoutSchema,
+};

package/src/vendor/km-card-layout-core/types.d.ts

@@ -3,159 +3,16 @@
  * Mirrors the exported types/functions from index.ts.
  */
 
-export type CardElementType =
-  | 'text'
-  | 'image'
-  | 'icon'
-  | 'custom'
-  | 'layout-panel'
-  | 'repeatable-group';
+export * from './interface';
 
-export interface AbsoluteLayoutDefinition {
-  mode: 'absolute';
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  zIndex?: number;
-}
-
-export interface FlexItemOptions {
-  flexGrow?: number;
-  flexShrink?: number;
-  flexBasis?: number | string;
-  order?: number;
-  alignSelf?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-}
-
-export interface FlexItemLayoutDefinition {
-  mode: 'flex';
-  item?: FlexItemOptions;
-  width?: number;
-  height?: number;
-}
-
-export type ElementLayout = AbsoluteLayoutDefinition | FlexItemLayoutDefinition;
-
-export interface CardElementBase {
-  id: string;
-  type: CardElementType;
-  layout: ElementLayout;
-  visible?: boolean;
-  binding?: string;
-  style?: Record<string, string | number | undefined>;
-  defaultValue?: string;
-}
-
-export interface TextElement extends CardElementBase {
-  type: 'text';
-  align?: 'left' | 'center' | 'right';
-  multiline?: boolean;
-}
-
-export interface ImageElement extends CardElementBase {
-  type: 'image';
-  alt?: string;
-  fit?: 'cover' | 'contain';
-  defaultUrl?: string;
-}
-
-export interface IconElement extends CardElementBase {
-  type: 'icon';
-  name?: string;
-}
-
-export interface CustomElement extends CardElementBase {
-  type: 'custom';
-}
-
-export interface LayoutPanelElement extends CardElementBase {
-  type: 'layout-panel';
-  container: {
-    mode: 'absolute' | 'flex';
-    options?: {
-      direction?: 'row' | 'column';
-      wrap?: 'nowrap' | 'wrap';
-      justifyContent?:
-        | 'flex-start'
-        | 'flex-end'
-        | 'center'
-        | 'space-between'
-        | 'space-around'
-        | 'space-evenly';
-      alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-      gap?: number | { row: number; column: number };
-      padding?: number | [number, number] | [number, number, number, number];
-    };
-  };
-  children?: CardElement[];
-}
-
-export interface RepeatableGroupItem {
-  id: string;
-  elements: CardElement[];
-  data?: Record<string, any>;
-}
-
-export interface RepeatableGroupElement extends CardElementBase {
-  type: 'repeatable-group';
-  dataPath: string;
-  itemTemplate: CardElement[];
-  items: RepeatableGroupItem[];
-  maxItems?: number;
-  mutualExcludes?: string[];
-}
-
-export type CardElement =
-  | TextElement
-  | ImageElement
-  | IconElement
-  | CustomElement
-  | LayoutPanelElement
-  | RepeatableGroupElement;
-
-export interface CardLayoutSchema {
-  name?: string;
-  container: {
-    mode: 'absolute';
-  };
-  width: number;
-  height: number;
-  backgroundImage?: string;
-  backgroundZIndex?: number;
-  fontColor?: string;
-  borderRadius?: number;
-  padding?: number;
-  children: CardElement[];
-  thumbnail?: string;
-}
-
-export interface RenderNode {
-  id: string;
-  type: CardElementType | 'text';
-  wrapperStyle: string;
-  contentStyle: string;
-  name?: string;
-  text?: string;
-  src?: string;
-  mode?: string;
-  children?: RenderNode[];
-  visible?: boolean;
-}
-
-export interface RenderPageResult {
-  renderTree: RenderNode[];
-  cardStyle: string;
-  backgroundImage: string;
-  backgroundStyle: string;
-}
-
-export type RenderResult = RenderPageResult[];
-
-export interface BindingContext {
-  contextBinding?: string;
-  contextData?: any;
-}
+import type {
+  BindingContext,
+  CardElement,
+  CardLayoutInput,
+  CardLayoutSchema,
+  RenderNode,
+  RenderResult,
+} from './interface';
 
 export function addUnit(
   value: string | number | undefined | null,
@@ -167,8 +24,6 @@ export function styleObjectToString(
   unit?: 'px' | 'rpx'
 ): string;
 
-export type CardLayoutInput = CardLayoutSchema[] | string | null | undefined;
-
 export function normalizeLayout(layout: CardLayoutInput): CardLayoutSchema[];
 
 export function resolveBindingValue(
@@ -177,6 +32,15 @@ export function resolveBindingValue(
   context?: BindingContext
 ): any;
 
+export function stripLayoutBindings(
+  layouts?: CardLayoutSchema[]
+): CardLayoutSchema[];
+
+export function applyItemCollectBindings(
+  layouts: CardLayoutSchema[],
+  items?: TemplateItem[]
+): CardLayoutSchema[];
+
 export function buildRenderNodes(
   children: CardElement[],
   data: Record<string, any>,
@@ -189,3 +53,7 @@ export function buildRenderResult(
   data: Record<string, any>,
   unit?: 'px' | 'rpx'
 ): RenderResult;
+
+export function getTemplateItems(ids: string, items: TemplateItem[]): TemplateItem[];
+
+export function getTemplateBackgrounds(ids: string, items: TemplateBackground[]) : TemplateBackground[];

package/src/vendor/km-card-layout-core/utils.ts

@@ -0,0 +1,141 @@
+import type { CardElement, CardLayoutSchema, TemplateItem } from './interface';
+import { TemplateBackground } from './interface/data/payload';
+
+
+export function backgroundChange(
+  bg: TemplateBackground,
+  layout: CardLayoutSchema
+): CardLayoutSchema {
+  const toNameArray = (name?: string | string[]) => {
+    if (Array.isArray(name)) return name.filter(Boolean);
+    if (!name) return [];
+    return `${name}`
+      .split(',')
+      .map(n => n.trim())
+      .filter(Boolean);
+  };
+
+  const applySpecialColor = (el: CardElement): CardElement => {
+    const extras = bg.fontColorExtra || [];
+    if (!extras.length) return el;
+
+    const keys: string[] = [];
+    if (el.binding) keys.push(String(el.binding));
+    if (el.id) keys.push(String(el.id));
+    if (el.type === 'icon') keys.push('icon');
+    if (el.type === 'custom') keys.push('decor');
+
+    const matched = extras.find(sc =>
+      toNameArray(sc.name).some(n => keys.some(k => k?.startsWith(n)))
+    );
+    if (!matched) return el;
+
+    const baseStyle = { ...(el.style || {}) };
+    if (el.type === 'custom') {
+      return { ...el, style: { ...baseStyle, backgroundColor: matched.color } };
+    }
+    return { ...el, style: { ...baseStyle, color: matched.color } };
+  };
+
+  const traverse = (children: CardElement[] = []): CardElement[] =>
+    children.map(el => {
+      if (!el) return el;
+      if (el.type === 'layout-panel') {
+        return {
+          ...el,
+          children: traverse(el.children || []),
+        };
+      }
+      return applySpecialColor(el);
+    });
+
+  return {
+    ...layout,
+    backgroundImage: bg.imgUrl,
+    fontColor: bg.fontColor || layout.fontColor,
+    children: traverse(layout.children || []),
+  };
+}
+
+export function stripLayoutBindings(
+  layouts: CardLayoutSchema[] = []
+): CardLayoutSchema[] {
+  const targetLayouts = Array.isArray(layouts) ? layouts : [];
+  const stripElement = (el: CardElement): CardElement => {
+    const { binding: _b, defaultValue: _d, ...rest } = el as any;
+    if (el.type === 'layout-panel') {
+      return {
+        ...rest,
+        children: (el.children || []).map(stripElement),
+      } as CardElement;
+    }
+    return rest as CardElement;
+  };
+
+  return targetLayouts.map(layout => ({
+    ...layout,
+    children: (layout.children || []).map(stripElement),
+  }));
+}
+
+/**
+ * 应用元素数据绑定字段
+ * @param layouts 布局
+ * @param items 绑定元素数据
+ * @returns
+ */
+export function applyItemCollectBindings(
+  layouts: CardLayoutSchema[] = [],
+  items: TemplateItem[] = []
+): CardLayoutSchema[] {
+  const targetLayouts = Array.isArray(layouts) ? layouts : [];
+  const metaMap = new Map<string, TemplateItem>();
+  const metaList = Array.isArray(items) ? items : [];
+  metaList.forEach(item => {
+    if (item && item.id !== undefined && item.id !== null) {
+      metaMap.set(String(item.id), item);
+    }
+  });
+
+  const assignBinding = (el: CardElement): CardElement => {
+    const meta = metaMap.get(String(el.id));
+    const binding =
+      meta && meta.bind !== undefined && meta.bind !== null
+        ? meta.bind
+        : el.binding;
+    const defaultValue =
+      meta && meta.default !== undefined ? meta.default : el.defaultValue;
+    const key = meta && meta.key !== undefined ? meta.key : el.key;
+    const base: any = { ...el };
+    if (binding !== undefined) base.binding = binding;
+    else delete base.binding;
+    if (defaultValue !== undefined) base.defaultValue = defaultValue;
+    else delete base.defaultValue;
+    if (key !== undefined) base.key = key;
+    else delete base.key;
+
+    if (el.type === 'layout-panel') {
+      return {
+        ...base,
+        children: (el.children || []).map(assignBinding),
+      } as CardElement;
+    }
+    return base as CardElement;
+  };
+
+  return targetLayouts.map(layout => ({
+    ...layout,
+    children: (layout.children || []).map(assignBinding),
+  }));
+}
+
+export function getTemplateItems(ids: string, items: TemplateItem[]) {
+  const idArray = ids.split(',').map(id => id.trim());
+  return items.filter(item => idArray.includes(String(item.id)));
+}
+
+
+export function getTemplateBackgrounds(ids: string, items: TemplateBackground[]){
+  const idArray = ids.split(',').map(id => id.trim());
+  return items.filter(item => idArray.includes(String(item.id)));
+}