union-question-web/src/modules/card/elementModel.js

/* eslint-disable no-unused-vars */
import { deepCopy, getNumList } from "./plugins/utils";
import { getModel as getCardHeadModel } from "./elements/card-head/model";
import { getModel as getTopicHeadModel } from "./elements/topic-head/model";
// element
import { getModel as createLines } from "./elements/lines/model";
import { getModel as createLine } from "./elements/line/model";
import { getModel as createText } from "./elements/text/model";
import { getModel as createImage } from "./elements/image/model";
import { getModel as createGrids } from "./elements/grids/model";
import {
  getModel as createComposition,
  getFullModel as getCompositionElements,
} from "./elements/composition/model";
import {
  getModel as createFillQuestion,
  getFullModel as getFillQuesitonElements,
} from "./elements/fill-question/model";
import {
  getModel as createFillLine,
  getFullModel as getFillLineElements,
} from "./elements/fill-line/model";
import {
  getModel as createExplain,
  getFullModel as getExplainElements,
} from "./elements/explain/model";

// page relate ------------------- >
// 页面
const PAGE = {
  type: "PAGE",
  columnGap: 20,
  locators: [],
  globals: [],
  columns: [],
};
// 可编辑栏
const COLUMN = {
  type: "COLUMN",
  x: "",
  y: "",
  w: "",
  h: "",
  isFull: false, // 是否已经填满元素
  elements: [],
};
// 定位点
const LOCATOR = {
  type: "LOCATOR",
  x: "",
  y: "",
  w: "",
  h: "",
};

// available infos
const EDITABLE_ELEMENT = [
  "LINE_HORIZONTAL",
  "LINE_VERTICAL",
  "LINES",
  "TEXT",
  "IMAGE",
  "GRIDS",
];

const EDITABLE_TOPIC = ["FILL_QUESTION", "FILL_LINE", "EXPLAIN", "COMPOSITION"];

const ELEMENT_INFOS = {
  CARD_HEAD: {
    name: "",
    getModel: getCardHeadModel,
  },
  LINES: {
    name: "多横线",
    getModel: createLines,
  },
  LINE_HORIZONTAL: {
    name: "横线",
    getModel: () => createLine("HORIZONTAL"),
  },
  LINE_VERTICAL: {
    name: "竖线",
    getModel: () => createLine("VERTICAL"),
  },
  TEXT: {
    name: "文本",
    getModel: createText,
  },
  IMAGE: {
    name: "图片",
    getModel: createImage,
  },
  GRIDS: {
    name: "网格",
    getModel: createGrids,
  },
  FILL_QUESTION: {
    name: "选择题",
    getModel: createFillQuestion,
  },
  FILL_LINE: {
    name: "填空题",
    getModel: createFillLine,
  },
  EXPLAIN: {
    name: "解答题",
    getModel: createExplain,
  },
  COMPOSITION: {
    name: "作文题",
    getModel: createComposition,
  },
};

const ELEMENT_LIST = EDITABLE_ELEMENT.map((type) => {
  return {
    ...ELEMENT_INFOS[type],
    type,
  };
});

const TOPIC_LIST = EDITABLE_TOPIC.map((type) => {
  return {
    ...ELEMENT_INFOS[type],
    type,
  };
});

// 获取元件默认数据结构
const getElementModel = (type, optionData = {}) => {
  return ELEMENT_INFOS[type].getModel(optionData);
};

const getElementName = (type) => {
  return ELEMENT_INFOS[type].name;
};

// 创建新页面
const getNewPage = (pageNo, { pageSize, columnNumber }) => {
  let npage = deepCopy(PAGE);
  if (
    (pageSize === "A3" && columnNumber === 4) ||
    (pageSize === "A4" && columnNumber === 2)
  ) {
    npage.columnGap = 10;
  }
  const num = pageSize === "A3" ? 3 : 2;
  npage.locators = getNumList(num).map((item, index) => {
    return [
      {
        ...LOCATOR,
        id: `locator-${pageNo}-${index}0`,
      },
      {
        ...LOCATOR,
        id: `locator-${pageNo}-${index}1`,
      },
    ];
  });
  npage.columns = getNumList(columnNumber).map((item, index) => {
    return deepCopy(COLUMN);
  });
  return npage;
};

export {
  getElementModel,
  getElementName,
  getNewPage,
  getCardHeadModel,
  getTopicHeadModel,
  getFillQuesitonElements,
  getFillLineElements,
  getExplainElements,
  getCompositionElements,
  ELEMENT_LIST,
  TOPIC_LIST,
};