1. var getColumn = function (list, style, collapse) {
    2.     const option = {
    3.         type: "column",
    4.         style: style,
    5.         collapse
    6.     };
    7.     if (Array.isArray(list)) {
    8.         option.list = list;
    9.     } else { 
    10.         option.data = list;
    11.     }
    12.     return option;
    13. }
    14. var getRow = function (list, style, collapse) {
    15.     const option = {
    16.         type: "row",
    17.         style: style,
    18.         collapse
    19.     };
    20.     if (Array.isArray(list)) {
    21.         option.list = list;
    22.     } else {
    23.         option.data = list;
    24.     }
    25.     return option;
    26. }
    28. var layout = [
    29.     getRow([
    30.         getColumn([
    31.             getRow([
    32.                 getColumn({
    33.                     id:"1"
    34.                 }),
    35.                 getColumn({
    36.                     id: "2"
    37.                 }),
    38.                 getColumn({
    39.                     id: "3"
    40.                 })
    41.             ],null,2),
    42.             getRow([
    43.                 getColumn({
    44.                     id: "3-4"
    45.                 })
    46.             ]),
    47.             getRow([
    48.                 getColumn({
    49.                     id: "4"
    50.                 })
    51.             ]),
    52.         ], null,3),
    53.         getColumn({
    54.             id: "4-5"
    55.         }),
    56.         getColumn({
    57.             id: "5"
    58.         })
    59.     ]),
    60.     getRow([
    61.         getColumn([
    62.             getRow([
    63.                 getColumn({
    64.                     id: "6"
    65.                 }),
    66.                 getColumn({
    67.                     id: "7"
    68.                 }),
    69.                 getColumn({
    70.                     id: "8"
    71.                 }),
    72.                 getColumn({
    73.                     id: "9"
    74.                 })
    75.             ]),
    76.             getRow([
    77.                 getColumn({
    78.                     id: "10"
    79.                 }),
    80.                 getColumn({
    81.                     id: "11"
    82.                 })
    83.             ]),
    84.             getRow({
    85.                 id: "12"
    86.             }),
    87.             getRow([
    88.                 getColumn({
    89.                     id: "13"
    90.                 }),
    91.                 getColumn({
    92.                     id: "14"
    93.                 }),
    94.                 getColumn({
    95.                     id: "15"
    96.                 })
    97.             ]),
    98.         ]),
    99.         getColumn({
    100.             id: "16"
    101.         }),
    102.         getColumn()
    103.     ], {})
    104. ];
    106. var getLayout = () => { 
    107.     var html = "<div class='layout'>"
    108.     var getRowHtml = (data) => {
    109.         const collapse = data.collapse || 1;
    110.         return `<div class='row' style='flex:${collapse}'>`
    111.     }
    112.     var getColumnHtml = (data) => {
    113.         const collapse = data.collapse || 1;
    114.         return `<div class='column' style='flex:${collapse}'>`
    115.     }
    116.     var getCellHtml = (data) => { 
    117.         const text = data.data && data.data.id || ""
    118.         return `<span>${text}</span></div>`;
    119.     };
    120.     var excutor = function (layout) {
    121.         layout.forEach(data => {
    122.             const list = data.list;
    123.             if (!Array.isArray(data.list)) {
    124.                 html += (data.type === "row" ? getRowHtml(data) : getColumnHtml(data));
    125.                 html += getCellHtml(data);
    126.                 return;
    127.             }
    128.             if (data.type === "row") {
    129.                 html += getRowHtml(data)
    130.                 excutor(list);
    131.                 html += "</div>"
    132.             } else {
    133.                 html += getColumnHtml(data)
    134.                 excutor(list);
    135.                 html += "</div>"
    136.             }
    137.         });
    138.     };
    139.     excutor(layout);
    140.     return html;
    141. }
    143. console.log(getLayout());