import { h } from 'vue';
import { BasicColumn } from '/@/components/Table';
import { render } from '/@/utils/common/renderUtils';

const renderNum = (num, weight, backArr?: boolean, tag = 'div') => {
  let arr = [h(tag, { style: { color: '#0085ff' } }, num)];
  if (weight) {
    arr.push(h(tag, {}, (tag === 'span' ? '/' : '') + parseInt(weight).toFixed(2)));
  }
  if (backArr === true) {
    return arr;
  }
  return h('div', {}, arr);
};

export const renderStrandCell = (options) => {
  const { num, lengthJsonStr, clickCb, record, strandNo } = options;
  try {
    if (lengthJsonStr) {
      const lengthJson = JSON.parse(lengthJsonStr);
      const lengthKeys = Object.keys(lengthJson);
      if (lengthKeys.length) {
        return h('div', { style: { textAlign: 'left', padding: '20px 0 0' } }, [
          h('div', { style: { color: '#f50', position: 'absolute', top: '0px' } }, num),
          ...lengthKeys.map((key) => {
            return h('div', {}, [
              h(
                'span',
                {
                  style: { cursor: 'pointer' },
                  onClick() {
                    clickCb && clickCb({ record, size: key, strandNo });
                  },
                },
                Number(key) / 1000 + ': '
              ),
              h('span', { style: { color: '#0085ff' } }, lengthJson[key]),
            ]);
          }),
        ]);
      }

      return num;
    }
  } catch (error) {}
  return num;
};

// 列表数据
export const getColumns = ({ clickCb, openCompensateModal, heatNoClick }): BasicColumn[] => {
  return [
    {
      title: '#',
      align: 'center',
      dataIndex: 'columnIndex',
      ellipsis: false,
      width: 36,
      fixed: 'left',
    },
    {
      title: '炉号',
      align: 'center',
      dataIndex: 'heatNo',
      width: 90,
      fixed: 'left',
      customRender(opt) {
        return h('div', { style: { cursor: 'pointer' }, onClick: () => heatNoClick && heatNoClick(opt.record) }, [
          h('div', { style: { color: '#6bd000', position: 'absolute', top: '0px' } }, render.renderDict(opt.record.shiftGroup, 'lg_bz')),
          h('span', {}, opt.record.heatNo),
        ]);
      },
    },
    {
      title: '牌号',
      align: 'center',
      width: 80,
      dataIndex: 'brandNum',
      customRender(opt) {
        return render.renderDict(opt.record.brandNum, 'billet_spec');
      },
    },
    {
      title: '1流',
      width: 90,
      align: 'center',
      dataIndex: 'oneStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.oneStrandNo, lengthJsonStr: opt.record.oneLength, clickCb, record: opt.record, strandNo: 1 });
      },
    },
    {
      title: '2流',
      width: 90,
      align: 'center',
      dataIndex: 'twoStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.twoStrandNo, lengthJsonStr: opt.record.twoLength, clickCb, record: opt.record, strandNo: 2 });
      },
    },
    {
      title: '3流',
      width: 90,
      align: 'center',
      dataIndex: 'threeStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.threeStrandNo, lengthJsonStr: opt.record.threeLength, clickCb, record: opt.record, strandNo: 3 });
      },
    },
    {
      title: '4流',
      width: 90,
      align: 'center',
      dataIndex: 'fourStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.fourStrandNo, lengthJsonStr: opt.record.fourLength, clickCb, record: opt.record, strandNo: 4 });
      },
    },
    {
      title: '5流',
      width: 90,
      align: 'center',
      dataIndex: 'fiveStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.fiveStrandNo, lengthJsonStr: opt.record.fiveLength, clickCb, record: opt.record, strandNo: 5 });
      },
    },
    {
      title: '6流',
      width: 90,
      align: 'center',
      dataIndex: 'sixStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.sixStrandNo, lengthJsonStr: opt.record.sixLength, clickCb, record: opt.record, strandNo: 6 });
      },
    },
    {
      title: '7流',
      width: 90,
      align: 'center',
      dataIndex: 'sevenStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.sevenStrandNo, lengthJsonStr: opt.record.sevenLength, clickCb, record: opt.record, strandNo: 7 });
      },
    },
    {
      title: '8流',
      width: 90,
      align: 'center',
      dataIndex: 'eightStrandNo',
      customRender(opt) {
        return renderStrandCell({ num: opt.record.eightStrandNo, lengthJsonStr: opt.record.eightLength, clickCb, record: opt.record, strandNo: 8 });
      },
    },
    {
      title: '棒一',
      align: 'center',
      width: 75,
      dataIndex: 'directRolling',
      customRender({ record }) {
        const { hotSend, directRolling } = record;
        try {
          if (hotSend) {
            const obj = JSON.parse(hotSend);
            // return obj.hotSendTotalCount + ' / ' + obj.hotSendTotalWeight.toFixed(2);
            return renderNum(obj.hotSendTotalCount, obj.hotSendTotalWeight);
          }
          if (directRolling) {
            const obj = JSON.parse(directRolling);
            // return obj.directRollingTotalCount + ' / ' + obj.directRollingTotalWeight.toFixed(2);
            return renderNum(obj.directRollingTotalCount, obj.directRollingTotalWeight);
          }
        } catch (error) {}
        return '';
      },
    },
    {
      title: '热装',
      align: 'center',
      width: 75,
      dataIndex: 'hotCharge',
      customRender({ record }) {
        const { hotCharge } = record;
        try {
          if (hotCharge) {
            const obj = JSON.parse(hotCharge);
            // return obj.hotChargeTotalCount + ' / ' + obj.hotChargeTotalWeight.toFixed(2);
            return renderNum(obj.hotChargeTotalCount, obj.hotChargeTotalWeight);
          }
        } catch (error) {}
        return '';
      },
    },
    {
      title: '堆垛',
      align: 'center',
      width: 75,
      dataIndex: 'stacking',
      customRender({ record }) {
        const { stacking } = record;
        try {
          if (stacking) {
            const obj = JSON.parse(stacking);
            // return obj.stackingTotalCount + ' / ' + obj.stackingTotalWeight.toFixed(2);
            return renderNum(obj.stackingTotalCount, obj.stackingTotalWeight);
          }
        } catch (error) {}
        return '';
      },
    },
    {
      title: '定尺',
      align: 'center',
      width: 100,
      dataIndex: 'length',
      customRender({ record }) {
        const { length } = record;
        try {
          if (length) {
            const obj = JSON.parse(length);
            let lengthCC: any[] = [];
            Object.keys(obj).forEach((key) => {
              // lengthCC.push(h('div', {},  key + ' : ' + obj[key].lengthTotalCount + ' / ' + obj[key].lengthTotalWeight.toFixed(2)));
              const lengthStlArr = renderNum(obj[key].lengthTotalCount, null, true, 'span') as any[];
              lengthCC.push(h('div', {}, [h('span', {}, Number(key) / 1000 + ': '), ...lengthStlArr]));
            });
            return h('div', { style: { fontSize: '12px', textAlign: 'left' } }, lengthCC);
          }
        } catch (error) {}
        return '';
      },
    },
    {
      title: '总计',
      align: 'center',
      width: 75,
      dataIndex: 'totalInfo',
      customRender({ record }) {
        try {
          const { totalInfo, hotCharge, stacking, hotSend, directRolling } = record;
          if (totalInfo) {
            const obj = JSON.parse(totalInfo);
            // return obj.totalCount + ' / ' + obj.totalWeight;
            let quXiaongGen = 0;
            // 热装
            if (hotCharge) {
              const hotChargeObj = JSON.parse(hotCharge);
              quXiaongGen = quXiaongGen + (hotChargeObj.hotChargeTotalCount || 0);
            }
            // 堆垛
            if (stacking) {
              const stackingObj = JSON.parse(stacking);
              quXiaongGen = quXiaongGen + (stackingObj.stackingTotalCount || 0);
            }
            // 棒一或者高线
            if (directRolling) {
              const directRollingObj = JSON.parse(directRolling);
              quXiaongGen = quXiaongGen + (directRollingObj.directRollingTotalCount || 0);
            }
            if (hotSend) {
              const hotSendObj = JSON.parse(hotSend);
              quXiaongGen = quXiaongGen + (hotSendObj.hotSendTotalCount || 0);
            }

            return h(
              'div',
              {
                style: { cursor: 'pointer' },
                onClick: () => {
                  if (!record.heatNo) return;
                  openCompensateModal && openCompensateModal(record);
                },
              },
              // renderNum(
              //   h('span', {}, [h('span', {}, obj.totalCount), h('span', { style: { color: '#999' } }, '/' + (obj.totalCount - quXiaongGen))]),
              //   obj.totalWeight
              // )
              renderNum(
                h('span', {}, [h('span', {}, obj.totalCount)]),
                obj.totalWeight
              )
            );
          }
        } catch (error) {}
        return '';
      },
      customHeaderCell: (columns) => {
        return {
          style: {
            cursor: 'pointer',
          },
          onClick: () => {
            console.log('columns', columns);
            openCompensateModal && openCompensateModal(columns);
          },
        };
      },
    },
  ];
};