import type { TableData } from 'lib/type/TableData'
import In18FormDialog from '../../components/In18FormDialog.vue'
import { LOCALES } from '../../data/const'
import { categoryTypes } from '../../data/const'
import utils from 'lib/utils'
let types: any[] = []
const pathname = utils.getPathName()
types = categoryTypes.filter(item => pathname.includes(item.path))

const data: TableData = {
  async fetchFun(self, data) {
    const res = await self.api?.getDataList(data)
    return res
  },
  addNods: [
    (self: any) => {
      return (
        self.bean &&
        <In18FormDialog
          show={self.bean.showEditorDialog}
          id={self.bean.id}
          form={self.bean.form}
          locales={self.bean.locales}
          onClose={() => {
            self.bean.showEditorDialog = false;
            self.bean.id = null;
          }}
          onSubmit={async (data) => {
            if(data.id) {
              await self.api?.updateData({...data, id: String(data.id), category_id: String(data.category_id)})
            } else {
              await self.api?.addData({...data, category_id: String(data.category_id)})
            }
            self.bean.showEditorDialog = false;
            self.bean.id = null;
            self.methods.fetchData()
          }}
          translateApi={self.api?.translate}
          detailApi={async (id: number) => {
            const res = await self.api?.getDetail(id);
            const data = res.data;
            Object.keys(data).forEach((langKey) => {
              const langData = data[langKey];
              Object.keys(langData).forEach((fieldKey) => {
                const field = self.bean.form.find((f:any) => f.key === fieldKey);
                if (!field) return;
                data[langKey][fieldKey] = langData[fieldKey];
              })
            })
            return data
          }}
        />
      )
    }
  ],
  launchTask: [
    async (self: any) => {
      if (self.bean) {
        self.bean.id = null;
        self.bean.form = [
          {
            name: '分类',
            key: 'category_id',
            type: 'select',
            must: true,
            getItems: () => {
              return self.bean ? self.bean.processTypes : []
            },
            shouldTranslate: false,
          },
          {
            name: '标题',
            key: 'title',
            type: 'input',
            value: '',
            must: true,
            shouldTranslate: true,
          },
          {
            name: '内容',
            key: 'content',
            type: 'textarea',
            value: '',
            must: true,
            shouldTranslate: true,
          },
        ];
        self.bean.locales = LOCALES
      }
    },
    async (self: any) => {
      if (self.bean) {
        const types = ['process'] as const
        const results = await Promise.all(
          types.map((type) =>
            self.api?.getCategoryList({ page: 1, size: 1000, type })
          )
        )
        const toOptions = (items: any[]) => items.map((item: any) => ({ key: item.id, name: item.name }));
        
        [self.bean.processTypes] = results.map(
          (res) => toOptions(res?.data?.items ?? [])
        )
        console.log('processTypes', self.bean.processTypes)
      }
    }
  ],
  fliter: [
    {
      key: 'id',
      name: 'ID',
      type: 'input'
    },
    {
      key: 'lang',
      name: '语言',
      type: 'select',
      value: 'ZH',
      getItems: (self) => {
        return self.bean ? self.bean.locales : []
      }
    },
    {
      key: 'category_id',
      name: '分类',
      type: 'select',
      value: '',
      getItems: (self: any) => {
        return self.bean ? self.bean.processTypes : []
      },
    },
    {
      key: 'title',
      name: '标题',
      type: 'input'
    },
    {
      type: 'onlyFun',
      onlyFun: {
        title: '新建',
        type: ' ' as any,
        fun(self) {
          if(self.bean) {
            self.bean.id = null;
            self.bean.showEditorDialog = true;
          }
        }
      }
    },
  ],
  tableColumns: [
    {
      key: 'id',
      name: 'ID',
      width: '80px',
      showJson: '*'
    },
    {
      key: 'lang',
      name: '语言',
      width: '80px',
    },
    {
      key: 'category_name',
      name: '分类',
      width: '200px',
    },
    {
      key: 'title',
      name: '标题',
      width: '200px',
    },
    {
      key: 'content',
      name: '内容',
    },
    {
      key: 'create_time',
      name: '创建时间',
      width: '150px'
    },
    {
      key: 'table_tools',
      name: '操作',
      buttons: [
        {
          type: 'onlyFun',
          key: 'update',
          onlyFun: {
            title: '编辑',
            type: ' ' as any,
            fun(self, row) {
              if(self.bean) {
                self.bean.id = row.id;
                self.bean.showEditorDialog = true;
              }
            }
          }
        },
        {
          type: 'popoverConfirm',
          key: 'delete',
          confirm: {
            title: '删除',
            primary: 'id',
            subFun(self, data) {
              return self.api?.deleteData(data)
            }
          }
        }
      ]
    }
  ]
}

export default data
