import { ref, watch } from 'vue'

const defaultOptions = {
  left_fixed_key: 'id',// 左侧固定列
  right_fixed_key: 'operation', //右侧固定列
  show_operator: true, // 是否显示操作列
  show_check:true,
}

  /**
   * 是否为特殊题型，特指图文题、上传题
   */

function includeSpecialType(type) {
  return [12, 13,  14, 18].includes(type)
}

export default function useGeneratorTableColumns(columns, options = {}) {
  debugger;
  options = {...defaultOptions, ...options}
  const tableHeaders = ref([])
  function flatData(columns) {
    let columnsSing ={};
    let columnsType ={};
    let columnsMemo= {};
    if(options.show_check){
      columnsSing={
        title: '',
        key: 'is_mark',
        dataIndex: 'is_mark',
        align: 'center',
        width: 50,
        slots: {customRender: "is_mark" },
        fixed: 'left',
      }
      columnsType={
        title: '数据类型',
        key: 'type',
        dataIndex: 'type',
        align: 'center',
        width: 100,
        slots: {customRender: "type" },
        fixed: 'left',
      }
      columnsMemo={
        title: '标记原因',
        key: 'mark_des',
        dataIndex: 'mark_des',
        align: 'center',
        width: 100,
        slots: {customRender: "mark_des" },
        fixed: 'left',
      }
    }
    let result =  columns.reduce((previousValue, currentValue) => {
      const arr = Object.entries(currentValue).map(([key, value]) => ({
        ...value,
        key,
        dataIndex: key,
        width: key === options.left_fixed_key? 100: includeSpecialType(value.question_type) ? 300 : 200,
        fixed: key === options.left_fixed_key ? 'left': null,
        align: 'center',
        slots: {customRender: key },
      }));
      return previousValue.concat(arr);
    }, []);
    // 手动修改作答ID数组位置
    const snData = result.find(el=>el.key =='id')
    result = result.filter(el=>el.key!='id')

    // const snData = result.find(el=>el.key =='id')
    // result = result.filter(el=>el.key!='id')
    result.unshift(columnsMemo);
   // result.unshift(columnsType);
    if(snData)result.unshift(snData)
    result.unshift(columnsSing);
    if(options.show_operator) {
      result.push({
        title: '操作',
        key: 'operation',
        dataIndex: 'operation',
        width: 250,
        slots: {customRender: "operation" },
        fixed: 'right',
      })
    }
  
    return result
  }
  watch(columns, (data) => {
    if(data) {
      tableHeaders.value = flatData(data);
    }
  })
  return { columns, tableHeaders};
}