teachcloud-print-web/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",
  pageSize: "A3",
  columnNumber: 2,
  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 = {
  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 => {
  return ELEMENT_INFOS[type].getModel();
};

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

const getLocators = pageNo => {
  return {
    top: [
      {
        id: `locator-${pageNo}-00`,
        ...LOCATOR
      },
      {
        id: `locator-${pageNo}-01`,
        ...LOCATOR
      }
    ],
    bottom: [
      {
        id: `locator-${pageNo}-10`,
        ...LOCATOR
      }
    ]
  };
};

// 创建新页面
const getNewPage = (pageNo, { pageSize, columnNumber }) => {
  let npage = deepCopy(PAGE);
  npage.pageSize = pageSize;
  npage.columnNumber = columnNumber;
  if (
    (pageSize === "A3" && columnNumber === 4) ||
    (pageSize === "A4" && columnNumber === 2)
  ) {
    npage.columnGap = 10;
  }
  npage.locators = getLocators(pageNo);
  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
};