import { CustomError } from '@kevisual/router';
import { app } from '../../app.ts';
import { PageModel } from './models/index.ts';
import { v4 as uuidv4 } from 'uuid';
import { ContainerModel } from '../container/models/index.ts';
import { Op } from 'sequelize';
import { getDeck } from './module/cache-file.ts';
export const clearBlank = (newStyle: any) => {
  for (let key in newStyle) {
    if (newStyle[key] === '' || newStyle[key] === undefined || newStyle[key] === null) {
      delete newStyle[key];
    }
  }
};
app
  .route({
    path: 'page',
    key: 'get',
  })
  .define(async (ctx) => {
    const id = ctx.query.id;
    if (!id) {
      throw new CustomError('id is required');
    }
    try {
      const page = await PageModel.findByPk(id);
      ctx.body = page;
    } catch (e) {
      console.log('error', e);
      throw new CustomError(e.message || 'get error');
    }
  })
  .addTo(app);

app
  .route({
    path: 'page',
    key: 'list',
    middleware: ['auth'],
  })
  .define(async (ctx) => {
    const tokenUser = ctx.state.tokenUser;
    ctx.body = await PageModel.findAll({
      order: [['updatedAt', 'DESC']],
      where: {
        uid: tokenUser.id,
      },
    });
    return ctx;
  })
  .addTo(app);

app
  .route({
    path: 'page',
    key: 'update',
    middleware: ['auth'],
  })
  .define(async (ctx) => {
    const { data, id, publish, ...rest } = ctx.query.data;
    const tokenUser = ctx.state.tokenUser;
    let needUpdate = { ...rest };
    if (data) {
      needUpdate = { ...needUpdate, data };
    }
    if (publish) {
      needUpdate = { ...needUpdate, publish };
    }

    if (id) {
      const page = await PageModel.findByPk(id);
      // if (!page?.publish && publish) {
      //   needUpdate = { ...needUpdate, publish };
      // }
      if (page) {
        const newPage = await page.update({ ...needUpdate });
        ctx.body = newPage;
      } else {
        throw new CustomError('page not found');
      }
    } else if (data) {
      const page = await PageModel.create({ ...needUpdate, uid: tokenUser.id });
      ctx.body = page;
    }
  })
  .addTo(app);
app
  .route('page', 'updateNode')
  .define(async (ctx) => {
    const { id, nodeData } = ctx.query.data;
    const force = ctx.query.force;
    if (!id) {
      throw new CustomError('id is required');
    }
    const page = await PageModel.findByPk(id);
    if (!page) {
      throw new CustomError('page not found');
    }
    const { data } = page;
    const { nodes = [] } = data;
    let flag = false;
    const newNodes = nodes.map((item) => {
      const nodeItem = nodeData;
      if (item.id === nodeItem.id) {
        flag = true;
        const { data, ...rest } = nodeItem;
        const { style, ...restData } = data || {};
        let newStyle = force ? { ...style } : { ...item?.data?.style, ...style };
        clearBlank(newStyle);
        console.log('newStyle', newStyle);
        const newNodeItem = {
          ...item,
          ...rest,
          data: {
            ...item?.data,
            ...restData,
            style: newStyle,
          },
        };
        console.log('newNodeItem', newNodeItem);
        return newNodeItem;
      }
      return item;
    });
    if (!flag) {
      newNodes.push(nodeData);
    }
    const newData = { ...data, nodes: newNodes };
    const newPage = await page.update({ data: newData });
    ctx.body = newPage;

    return ctx;
  })
  .addTo(app);
app
  .route({
    path: 'page',
    key: 'delete',
  })
  .define({
    validator: {
      id: {
        required: true,
        type: 'string',
      },
    },
  })
  .define(async (ctx) => {
    const id = ctx.query.id;
    const page = await PageModel.findByPk(id);
    if (page) {
      await page.destroy();
    }
    ctx.body = page;
    return ctx;
  })
  .addTo(app);

app
  .route({
    path: 'page',
    key: 'addDemo',
  })
  .define(async (ctx) => {
    const id = uuidv4();
    const data = {
      // id: 'container-1',
      id,
      title: 'demo',
      description: 'demo',
      type: 'conainer',
      data: {
        edges: [
          {
            id: 'e1',
            // source: 'container-1',
            source: id,
            target: 'container-2',
          },
          {
            id: 'e2',
            // source: 'container-1',
            source: id,
            target: 'container-3',
          },
          {
            id: 'e3',
            source: 'container-2',
            target: 'container-4',
          },
        ],
        nodes: [
          {
            // id: 'container-1',
            id,
            type: 'container',
            data: {
              label: '开始',
              title: 'demo-hello-world',
              cid: 'a6652ce0-82fb-432a-a6b0-2033a655b02c',
              root: true,
              style: {
                border: '1px solid black',
              },
            },
            position: {
              x: 50,
              y: 125,
            },
          },
          {
            id: 'container-2',
            type: 'container',
            data: {
              label: '容器',
              title: 'demo-child-01',
              cid: '67e5b2ff-98dc-43ab-8ad9-9b062096f8eb',
              style: {
                color: 'green',
                position: 'absolute',
                border: '1px solid black',
                top: '100px',
                left: '100px',
                width: '200px',
                height: '200px',
              },
              shadowRoot: true,
            },
            position: {
              x: 350,
              y: 125,
            },
          },
          {
            id: 'container-3',
            type: 'container',
            data: {
              label: '容器',
              title: 'demo-child-03',
              cid: '208c3e36-dc7d-46af-b2f0-81d5f43c974d',
              style: {
                color: 'green',
                position: 'absolute',
                border: '1px solid green',
                top: '100px',
                left: '100px',
                width: '200px',
                height: '200px',
              },
            },
            position: {
              x: 350,
              y: 325,
            },
          },
          {
            id: 'container-4',
            type: 'container',
            data: {
              label: '容器',
              title: 'demo-child-04',
              cid: '170c0b55-8c13-4d6e-bf35-3f935d979a0d',
              style: {
                color: 'green',
                position: 'absolute',
                border: '1px solid green',
                top: '100px',
                left: '400px',
                width: '200px',
                height: '200px',
              },
            },
            position: {
              x: 650,
              y: 125,
            },
          },
        ],
        viewport: {},
      },
    };
    try {
      const page = await PageModel.create(data);
      ctx.body = page;
    } catch (e) {
      console.log('error', e);
      throw new CustomError('addDemo error');
    }
  })
  .addTo(app);

app
  .route({
    path: 'page',
    key: 'getDeck',
  })
  .define<any>(async (ctx) => {
    const id = ctx.query.id;
    if (!id) {
      throw new CustomError('id is required');
    }

    try {
      const page = await PageModel.findByPk(id);
      if (!page) {
        throw new CustomError(404, 'panel not found');
      }
      const pageData = await getDeck(page);
      ctx.body = pageData;
    } catch (e) {
      console.log('error', e);
      throw new CustomError(e.message || 'get error');
    }
  })
  .addTo(app);