import type { DraftField } from '../../src/domain/draft';

import { mount } from '@vue/test-utils';
import Antd, { Input } from 'ant-design-vue';
import { describe, expect, it } from 'vitest';

import FieldDraftList from '../../src/components/FieldDraftList.vue';
import RepeatRowsPanel from '../../src/components/RepeatRowsPanel.vue';

function field(tag: string, alias: string): DraftField {
  return {
    alias,
    currentValue: '',
    documentValue: '',
    draftValue: '',
    internalId: tag,
    options: [],
    tag,
    type: 'text',
  };
}

describe('RepeatRowsPanel', () => {
  it('uses prototype controls only to expose the group and renders runtime rows in document order', async () => {
    const wrapper = mount(RepeatRowsPanel, {
      global: { plugins: [Antd] },
      props: {
        appendDisabled: false,
        disabled: false,
        errors: {},
        groups: [{
          activeRowCount: 2,
          groupCode: 'results',
          maxRows: 2,
          minRows: 1,
          rows: [
            { groupCode: 'results', rowId: 'row-1', rowOrder: 1, status: 'ACTIVE' },
            {
              deleteOperationCode: 'delete-2', deleteReason: '录入错误', groupCode: 'results',
              rowId: 'row-2', rowOrder: 2, status: 'DELETE_PREPARED',
            },
          ],
        }],
        fields: [
          field('eln.repeat.results.prototype.value', '原型值'),
          field('eln.repeat.results.row-1.value', '结果'),
          field('eln.repeat.results.row-1.unit', '单位'),
          field('eln.repeat.results.row-2.value', '结果'),
        ],
      },
    });

    expect(wrapper.findAll('[data-row-id]')).toHaveLength(2);
    expect(wrapper.text()).not.toContain('原型值');
    expect(wrapper.text()).toContain('2 / 2 行');
    expect(wrapper.get('[aria-label="新增 results 行"]').attributes('disabled')).toBeDefined();
    expect(wrapper.get('[aria-label="删除 results 第 1 行"]').attributes('disabled')).toBeDefined();
    await wrapper.setProps({ groups: [{
      activeRowCount: 2,
      groupCode: 'results',
      maxRows: 2,
      minRows: 0,
      rows: [
        { groupCode: 'results', rowId: 'row-1', rowOrder: 1, status: 'ACTIVE' },
        {
          deleteOperationCode: 'delete-2', deleteReason: '录入错误', groupCode: 'results',
          rowId: 'row-2', rowOrder: 2, status: 'DELETE_PREPARED',
        },
      ],
    }] });
    await wrapper.get('[aria-label="删除 results 第 1 行"]').trigger('click');
    wrapper.get('.repeat-delete-form').findComponent(Input).vm.$emit('update:value', '重新录入');
    await wrapper.vm.$nextTick();
    await wrapper.get('.delete-confirm').trigger('click');
    expect(wrapper.emitted('delete')).toEqual([['results', 'row-1', '重新录入']]);
    await wrapper.get('[aria-label="恢复 results 第 2 行"]').trigger('click');
    expect(wrapper.emitted('restore')).toEqual([['results', 'row-2']]);

    await wrapper.setProps({ groups: [{
      activeRowCount: 1, groupCode: 'results', maxRows: 3, minRows: 1,
      rows: [{ groupCode: 'results', rowId: 'row-1', rowOrder: 1, status: 'ACTIVE' }],
    }] });
    await wrapper.get('[aria-label="新增 results 行"]').trigger('click');
    expect(wrapper.emitted('append')).toEqual([['results']]);

    wrapper.findAllComponents(FieldDraftList)[0]!.vm.$emit(
      'update', 'eln.repeat.results.row-1.value', '合格',
    );
    expect(wrapper.emitted('update')).toEqual([
      ['eln.repeat.results.row-1.value', '合格'],
    ]);
  });
});