import { computed, ref } from 'vue';
import { cloneDeep } from 'lodash-es';
import { FormSchema } from '@/components/Form';
import { useDictStore } from '@/store/modules/dict';
import { List as TenantList } from '@/api/imTenant';

const dict = useDictStore();

export const tenantOptions = ref<any[]>([]);

export class State {
  public tenantId = 0;
  public tenantName = '';
  public id = 0;
  public platform = 'android';
  public channel = 'stable';
  public latestVersion = '1.0.0';
  public minSupportedVersion = '1.0.0';
  public updateType = 'none';
  public releaseNotes = '';
  public storeUrl = '';
  public packageUrl = '';
  public checksum = '';
  public remindAfterSeconds = 0;
  public publishedAt = '';
  public updatedAt = '';

  constructor(state?: Partial<State>) {
    if (state) Object.assign(this, state);
  }
}

export function newState(state: State | Record<string, any> | null): State {
  if (state !== null) {
    if (state instanceof State) return cloneDeep(state);
    return new State(state);
  }
  return new State();
}

export const schemas = ref<FormSchema[]>([
  {
    field: 'tenantId',
    component: 'NSelect',
    label: '租户',
    componentProps: {
      clearable: false,
      options: computed(() => tenantOptions.value),
      placeholder: '请选择租户',
    },
  },
  {
    field: 'platform',
    component: 'NSelect',
    label: '平台',
    componentProps: {
      clearable: true,
      options: computed(() => dict.getOptions('ImAppPlatformOptions')),
      placeholder: '请选择平台',
    },
  },
  {
    field: 'channel',
    component: 'NInput',
    label: '渠道',
    componentProps: {
      clearable: true,
      placeholder: '请输入渠道',
    },
  },
]);

export const columns = [
  {
    title: '平台',
    key: 'platform',
    align: 'left',
    width: 100,
    render(row: State) {
      return dict.getLabel('ImAppPlatformOptions', row.platform) || row.platform;
    },
  },
  { title: '渠道', key: 'channel', align: 'left', width: 100 },
  { title: '最新版本', key: 'latestVersion', align: 'left', width: 120 },
  { title: '最低支持', key: 'minSupportedVersion', align: 'left', width: 120 },
  {
    title: '更新类型',
    key: 'updateType',
    align: 'left',
    width: 110,
    render(row: State) {
      return dict.getLabel('ImAppUpdateTypeOptions', row.updateType) || row.updateType;
    },
  },
  { title: '再次提醒', key: 'remindAfterSeconds', align: 'left', width: 110 },
  { title: '商店地址', key: 'storeUrl', align: 'left', width: 220 },
  { title: '安装包地址', key: 'packageUrl', align: 'left', width: 220 },
  { title: '发布时间', key: 'publishedAt', align: 'left', width: 180 },
  { title: '更新时间', key: 'updatedAt', align: 'left', width: 180 },
];

export const rules = {
  platform: { required: true, trigger: ['blur', 'change'], type: 'string', message: '请选择平台' },
  channel: { required: true, trigger: ['blur', 'input'], type: 'string', message: '请输入渠道' },
  latestVersion: {
    required: true,
    trigger: ['blur', 'input'],
    type: 'string',
    message: '请输入最新版本',
  },
  minSupportedVersion: {
    required: true,
    trigger: ['blur', 'input'],
    type: 'string',
    message: '请输入最低支持版本',
  },
  updateType: {
    required: true,
    trigger: ['blur', 'change'],
    type: 'string',
    message: '请选择更新类型',
  },
};

export function loadOptions() {
  dict.loadOptions(['ImAppPlatformOptions', 'ImAppUpdateTypeOptions']);
}

export async function loadTenantOptions() {
  const res = await TenantList({ page: 1, perPage: 100 });
  tenantOptions.value = (res?.list || []).map((item) => ({
    label: `${item.name}（${item.code}）`,
    value: item.id,
  }));
  return tenantOptions.value;
}