<template>
  <el-dialog v-model="dialogVisible" title="选择框架合同" width="900px" append-to-body>
    <el-form :model="queryParams" :inline="true" label-width="90px" style="margin-bottom: 12px">
      <el-form-item label="合同编号">
        <el-input v-model="queryParams.contractCode" placeholder="请输入合同编号" clearable @keyup.enter="getFrameworkContractList" />
      </el-form-item>
      <el-form-item label="合同名称">
        <el-input v-model="queryParams.contractName" placeholder="请输入合同名称" clearable @keyup.enter="getFrameworkContractList" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="getFrameworkContractList">搜索</el-button>
        <el-button icon="Refresh" @click="resetFrameworkContractQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-table :data="frameworkContractList" v-loading="loading" border @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="合同编号" prop="contractCode" min-width="150" />
      <el-table-column label="合同名称" prop="contractName" min-width="180" />
      <el-table-column label="框架合同有效期" prop="frameworkValidPeriod" width="160">
        <template #default="scope">
          <span>{{ parseTime(scope.row.frameworkValidPeriod, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getFrameworkContractList"
    />

    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmSelection">确 定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts" name="FrameworkContractSelectDialog">
import { listFrameworkContractInfo } from '@/api/oa/erp/contractInfo';
import type { ContractInfoQuery, ContractInfoVO } from '@/api/oa/erp/contractInfo/types';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const props = defineProps<{
  visible: boolean;
  currentContractId?: string | number;
}>();

const emit = defineEmits<{
  (e: 'update:visible', val: boolean): void;
  (e: 'confirm', row: ContractInfoVO): void;
}>();

const dialogVisible = ref(false);
const loading = ref(false);
const total = ref(0);
const frameworkContractList = ref<ContractInfoVO[]>([]);
const selectedFrameworkContracts = ref<ContractInfoVO[]>([]);
const selectedFrameworkContract = ref<ContractInfoVO | null>(null);

const queryParams = reactive<ContractInfoQuery>({
  pageNum: 1,
  pageSize: 10,
  contractCode: undefined,
  contractName: undefined,
  contractCategory: undefined,
  contractStatus: undefined,
  params: {}
});

watch(
  () => props.visible,
  (val) => {
    dialogVisible.value = val;
    if (val) {
      selectedFrameworkContracts.value = [];
      selectedFrameworkContract.value = null;
      getFrameworkContractList();
    }
  },
  { immediate: true }
);

watch(dialogVisible, (val) => {
  emit('update:visible', val);
});

const getFrameworkContractList = async () => {
  loading.value = true;
  try {
    const res = await listFrameworkContractInfo(queryParams as any);
    frameworkContractList.value = res.rows;
    total.value = res.total || 0;
  } finally {
    loading.value = false;
  }
};

const resetFrameworkContractQuery = () => {
  queryParams.pageNum = 1;
  queryParams.pageSize = 10;
  queryParams.contractCode = undefined;
  queryParams.contractName = undefined;
  queryParams.contractCategory = '3';
  queryParams.contractStatus = '3';
  queryParams.isFrameworkContract = '1';
  getFrameworkContractList();
};

const handleSelectionChange = (selection: ContractInfoVO[]) => {
  selectedFrameworkContracts.value = selection || [];
  if (!selection || selection.length === 0) {
    selectedFrameworkContract.value = null;
    return;
  }
  selectedFrameworkContract.value = selection[selection.length - 1];
};

const confirmSelection = () => {
  if (!selectedFrameworkContract.value) {
    proxy?.$modal.msgWarning('请先选择框架合同');
    return;
  }
  if (selectedFrameworkContracts.value.length > 1) {
    proxy?.$modal.msgWarning('只能选择一条框架合同');
    return;
  }
  emit('confirm', selectedFrameworkContract.value);
  dialogVisible.value = false;
};
</script>
