<template>
  <div class="page-container">
    <ProTable ref="tableRef" :columns="columns" :request="loadData" :toolbar="{ title: '许可证管理' }" :custom-row="(record: any) => ({ onClick: () => showChangeLog(record), style: { cursor: 'pointer' } })">
      <template #toolbar-actions>
        <a-button v-permission="'asset:license:add'" type="primary" @click="handleAdd"><PlusOutlined /> 新增许可证</a-button>
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'assigned_user_name'">
          <a-tag v-if="record.assigned_user_name" color="blue">{{ record.assigned_user_name }}</a-tag>
          <span v-else style="color:#999">未分配</span>
        </template>
        <template v-if="column.key === 'operations'">
          <a-space :size="4" @click.stop>
            <a-button v-permission="'asset:license:edit'" type="link" size="small" @click.stop="handleEdit(record)"><EditOutlined /> 编辑</a-button>
            <a-popconfirm v-permission="'asset:license:delete'" title="确认删除？" @confirm="handleDelete(record.id)">
              <a-button type="link" size="small" danger @click.stop><DeleteOutlined /> 删除</a-button>
            </a-popconfirm>
          </a-space>
        </template>
      </template>
    </ProTable>

    <a-modal v-model:open="visible" :title="isEdit ? '编辑许可证' : '新增许可证'" @ok="handleSubmit" width="700px">
      <a-form :model="form" :label-col="{ span: 6 }">
        <a-row :gutter="16">
          <a-col :span="12"><a-form-item label="软件名称" required><a-input v-model:value="form.name" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="序列号" required><a-input v-model:value="form.license_key" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="许可数量"><a-input-number v-model:value="form.total_seats" style="width:100%" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="责任人">
            <a-select v-model:value="form.assigned_to" show-search placeholder="请选择责任人" option-filter-prop="label" :options="userOptions" allow-clear />
          </a-form-item></a-col>
          <a-col :span="12"><a-form-item label="制造商">
            <a-select v-model:value="form.manufacturer_id" show-search placeholder="请选择制造商" option-filter-prop="label" :options="manufacturerOptions" allow-clear />
          </a-form-item></a-col>
          <a-col :span="12"><a-form-item label="分类">
            <a-select v-model:value="form.category_id" show-search placeholder="请选择分类" option-filter-prop="label" :options="categoryOptions" allow-clear />
          </a-form-item></a-col>
          <a-col :span="12"><a-form-item label="供应商">
            <a-select v-model:value="form.supplier_id" show-search placeholder="请选择供应商" option-filter-prop="label" :options="supplierOptions" allow-clear />
          </a-form-item></a-col>
          <a-col :span="12"><a-form-item label="最小库存"><a-input-number v-model:value="form.min_qty" style="width:100%" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="授权给"><a-input v-model:value="form.licensed_to_name" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="授权邮箱"><a-input v-model:value="form.licensed_to_email" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="采购日期"><a-input v-model:value="form.purchase_date" type="date" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="采购价格"><a-input-number v-model:value="form.purchase_cost" style="width:100%" /></a-form-item></a-col>
          <a-col :span="12"><a-form-item label="到期日期"><a-input v-model:value="form.expiration_date" type="date" /></a-form-item></a-col>
          <a-col :span="24"><a-form-item label="备注" :label-col="{ span: 3 }"><a-textarea v-model:value="form.notes" :rows="2" /></a-form-item></a-col>
        </a-row>
      </a-form>
    </a-modal>

    <a-modal v-model:open="logVisible" title="变更记录" width="800px" :footer="null">
      <a-table :columns="logColumns" :data-source="logData" :pagination="false" size="small" row-key="id">
        <template #bodyCell="{ column, record: row }">
          <template v-if="column.key === 'change_type'">
            <a-tag :color="row.change_type === 'create' ? 'green' : row.change_type === 'delete' ? 'red' : 'blue'">{{ row.change_type === 'create' ? '新增' : row.change_type === 'delete' ? '删除' : '修改' }}</a-tag>
          </template>
        </template>
      </a-table>
    </a-modal>
  </div>
</template>

<script setup lang="ts">
import { PlusOutlined, EditOutlined, DeleteOutlined } from "@antdv-next/icons";
import { message } from "antdv-next";
import { ref } from "vue";
import { licenseApi, changeRecordApi, findAssetManager, getCategoryList, getManufacturerList, getSupplierList, getUserList } from "@/api/asset";
import { useAuthStore } from "@/stores/auth";
import ProTable from "@/components/Pro/ProTable/index.vue";
import type { ProTableColumn } from "@/types/pro";

const authStore = useAuthStore();
const tableRef = ref();
const visible = ref(false); const isEdit = ref(false);
const form = ref<Record<string, unknown>>({});

const categoryOptions = ref<{ label: string; value: string }[]>([]);
const manufacturerOptions = ref<{ label: string; value: string }[]>([]);
const supplierOptions = ref<{ label: string; value: string }[]>([]);
const userOptions = ref<{ label: string; value: string }[]>([]);

const loadOptions = async () => {
  try {
    const [catRes, mfrRes, supRes, userRes]: any[] = await Promise.all([
      getCategoryList(),
      getManufacturerList(),
      getSupplierList(),
      getUserList(),
    ]);
    const extractData = (res: any) => (res.data || res) as any[];
    categoryOptions.value = (extractData(catRes) || []).map((c: any) => ({ label: c.name + ' [' + c.code + ']', value: c.id }));
    manufacturerOptions.value = (extractData(mfrRes) || []).map((m: any) => ({ label: m.name, value: m.id }));
    supplierOptions.value = (extractData(supRes) || []).map((s: any) => ({ label: s.name, value: s.id }));
    userOptions.value = ((userRes.data || userRes)?.list || []).map((u: any) => ({ label: u.nick_name || u.user_name, value: u.id }));
  } catch { /* ignore */ }
};

const logVisible = ref(false);
const logData = ref<Record<string, unknown>[]>([]);
const logColumns = [
  { title: "时间", dataIndex: "create_time", key: "create_time", width: 170 },
  { title: "变更类型", dataIndex: "change_type", key: "change_type", width: 80 },
  { title: "变更字段", dataIndex: "field_name", key: "field_name", width: 120 },
  { title: "旧值", dataIndex: "old_value", key: "old_value", ellipsis: true },
  { title: "新值", dataIndex: "new_value", key: "new_value", ellipsis: true },
  { title: "操作人", dataIndex: "operator_name", key: "operator_name", width: 100 },
];

const columns: ProTableColumn[] = [
  { title: "软件名称", dataIndex: "name", key: "name", search: true, searchType: "input" },
  { title: "序列号", dataIndex: "license_key", key: "license_key" },
  { title: "许可数量", dataIndex: "total_seats", key: "total_seats" },
  { title: "责任人", dataIndex: "assigned_user_name", key: "assigned_user_name" },
  { title: "制造商", dataIndex: "manufacturer_name", key: "manufacturer_name" },
  { title: "分类", dataIndex: "category_name", key: "category_name" },
  { title: "供应商", dataIndex: "supplier_name", key: "supplier_name" },
  { title: "到期日期", dataIndex: "expiration_date", key: "expiration_date" },
  { title: "采购价格", dataIndex: "purchase_cost", key: "purchase_cost" },
  { title: "操作", dataIndex: "operations", key: "operations", width: 200, fixed: "right" as const },
];

const loadData = async (params: Record<string, unknown>) => {
  try {
    const res: any = await licenseApi.page({ page: params.current, pageSize: params.pageSize, keyword: params.keyword });
    const pageData = res.data || res;
    return { data: pageData.list || [], total: pageData.total || 0, success: true };
  } catch { return { data: [], total: 0, success: false }; }
};

const showChangeLog = async (record: Record<string, unknown>) => {
  try {
    const res: any = await changeRecordApi.page({ asset_type: "license", asset_id: record.id, page: 1, pageSize: 200 });
    logData.value = (res.data || res).list || [];
    logVisible.value = true;
  } catch { message.error("获取变更记录失败"); }
};

const handleAdd = async () => {
  isEdit.value = false;
  form.value = {};
  await loadOptions();
  try {
    const res: any = await findAssetManager(authStore.user?.deptId);
    if (res.code === 1 && res.data) {
      form.value.assigned_to = res.data.id;
    }
  } catch { /* ignore */ }
  visible.value = true;
};
const handleEdit = async (r: Record<string, unknown>) => { isEdit.value = true; form.value = { ...r }; await loadOptions(); visible.value = true; };
const handleDelete = async (id: string) => {
  await licenseApi.del(id);
  message.success("删除成功");
  tableRef.value?.reload();
};
const handleSubmit = async () => {
  await licenseApi.save(form.value);
  message.success(isEdit.value ? "更新成功" : "创建成功");
  visible.value = false;
  tableRef.value?.reload();
};
</script>
