<template>
  <SimpleScrollbar>
    <div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
      <ACard
        :title="t('page.portal.title')"
        :bordered="false"
        :body-style="{ flex: 1, overflow: 'hidden' }"
        class="flex-col-stretch sm:flex-1-hidden card-wrapper"
      >
        <template #extra>
          <div class="flex items-center gap-4">
            <!-- 站点选择 -->
            <a-select
              v-model:value="selectedSiteId"
              :loading="siteLoading"
              :placeholder="t('page.portal.selectSite')"
              style="width: 200px"
              @change="handleSiteChange"
            >
              <a-select-option
                v-for="site in siteList"
                :key="site.siteId"
                :value="site.siteId"
              >
                {{ site.name }}
              </a-select-option>
            </a-select>

            <!-- 表格操作组件 -->
            <TableHeaderOperation
              v-model:columns="columnChecks"
              :loading="tableLoading"
              :show-delete="false"
              @add="handleAdd"
              @refresh="getData"
            />
          </div>
        </template>

        <!-- 表格 -->
        <ATable
          :columns="columns"
          :data-source="tableData"
          :loading="tableLoading"
          :pagination="{
            ...mobilePagination,
            total: mobilePagination.total,
            current: searchParams.pageNum,
            pageSize: searchParams.pageSize,
            showTotal: (total: number) => `${t('page.portal.total')} ${total} `
          }"
          @change="(pagination) => {
            searchParams.pageNum = pagination.current;
            searchParams.pageSize = pagination.pageSize;
            getData();
          }"
        >
          <template #bodyCell="{ column, record }">
            <template v-if="column.key === 'operate'">
              <div class="flex items-center justify-center gap-2">
                <a-tooltip :title="t('common.edit')">
                  <a-button
                    type="link"
                    size="small"
                    @click="() => handleEdit(record)"
                  >
                    <template #icon>
                      <EditOutlined />
                    </template>
                  </a-button>
                </a-tooltip>

                <a-tooltip :title="t('common.delete')">
                  <a-button
                    type="link"
                    size="small"
                    class="text-red-500"
                    @click="() => handleDelete(record)"
                  >
                    <template #icon>
                      <DeleteOutlined />
                    </template>
                  </a-button>
                </a-tooltip>
              </div>
            </template>
          </template>
        </ATable>
      </ACard>

      <!-- 添加门户对话框 -->
      <a-modal
        v-model:visible="addVisible"
        :title="t('page.portal.addPortal')"
        @ok="handleAddConfirm"
        width="600px"
      >
        <a-form
          :model="addForm"
          :rules="addRules"
          :label-col="{ span: 6 }"
          :wrapper-col="{ span: 16 }"
          layout="horizontal"
          ref="formRef"
        >
          <a-form-item name="name" :label="t('page.portal.name')">
            <a-input v-model:value="addForm.name" />
          </a-form-item>

          <a-form-item name="enable" :label="t('page.portal.enable')">
            <a-switch v-model:checked="addForm.enable" />
          </a-form-item>

          <a-form-item name="ssidList" :label="t('page.portal.ssid')">
            <a-tree-select
              v-model:value="addForm.ssidList"
              :tree-data="treeData"
              :loading="ssidLoading"
              :placeholder="t('page.portal.selectSsid')"
              multiple
              tree-checkable
              :tree-default-expand-all="true"
              :show-checked-strategy="TreeSelect.SHOW_CHILD"
              style="width: 100%"
            />
          </a-form-item>

          <!-- 外部Portal服务器配置 -->
          <a-form-item name="externalPortal" :label="t('page.portal.externalPortal')">
            <div class="flex-col gap-2">
              <!-- URL输入框 -->
              <a-form-item
                :name="['externalPortal', 'serverUrl']"
                :label="t('page.portal.url')"
              >
                <a-input-group compact>
                  <a-select
                    v-model:value="addForm.externalPortal.serverUrlScheme"
                    style="width: 30%"
                  >
                    <a-select-option value="http">http://</a-select-option>
                    <a-select-option value="https">https://</a-select-option>
                  </a-select>
                  <a-input
                    v-model:value="addForm.externalPortal.serverUrl"
                    style="width: 70%"
                    :placeholder="t('page.portal.enterUrl')"
                  />
                </a-input-group>
              </a-form-item>
            </div>
          </a-form-item>

          <!-- 身份验证时间配置项，仅在非外部Portal认证时显示 -->
          <a-form-item
            v-if="addForm.authType !== 4"
            name="authTimeout"
            :label="t('page.portal.authTimeout')"
          >
            <a-input-group compact>
              <a-input-number
                v-model:value="addForm.authTimeout.customTimeout"
                style="width: 60%"
                :min="1"
                :max="getMaxTimeout(addForm.authTimeout.customTimeoutUnit)"
              />
              <a-select
                v-model:value="addForm.authTimeout.customTimeoutUnit"
                style="width: 40%"
              >
                <a-select-option :value="1">{{ t('page.portal.timeUnit.min') }}</a-select-option>
                <a-select-option :value="2">{{ t('page.portal.timeUnit.hour') }}</a-select-option>
                <a-select-option :value="3">{{ t('page.portal.timeUnit.day') }}</a-select-option>
              </a-select>
            </a-input-group>
          </a-form-item>

          <!--          <a-form-item name="noAuth" :label="t('page.portal.dailyLimit')">-->
          <!--            <a-checkbox v-model:checked="addForm.noAuth.dailyLimitEnable">-->
          <!--              {{ t('page.portal.enableDailyLimit') }}-->
          <!--            </a-checkbox>-->
          <!--          </a-form-item>-->

          <a-form-item name="httpsRedirectEnable" :label="t('page.portal.httpsRedirect')">
            <a-checkbox v-model:checked="addForm.httpsRedirectEnable">
              {{ t('page.portal.enableHttpsRedirect') }}
            </a-checkbox>
          </a-form-item>
        </a-form>
      </a-modal>

      <!-- 添加编辑门户对话框 -->
      <a-modal
        v-model:visible="editVisible"
        :title="t('page.portal.editPortal')"
        @ok="handleEditConfirm"
        width="600px"
      >
        <a-form
          :model="editForm"
          :rules="addRules"
          :label-col="{ span: 6 }"
          :wrapper-col="{ span: 16 }"
          layout="horizontal"
          ref="editFormRef"
        >
          <a-form-item name="name" :label="t('page.portal.name')">
            <a-input v-model:value="editForm.name" />
          </a-form-item>

          <a-form-item name="enable" :label="t('page.portal.enable')">
            <a-switch v-model:checked="editForm.enable" />
          </a-form-item>

          <a-form-item name="ssidList" :label="t('page.portal.ssid')">
            <a-tree-select
              v-model:value="editForm.ssidList"
              :tree-data="treeData"
              :loading="ssidLoading"
              :placeholder="t('page.portal.selectSsid')"
              multiple
              tree-checkable
              :tree-default-expand-all="true"
              :show-checked-strategy="TreeSelect.SHOW_CHILD"
              style="width: 100%"
            />
          </a-form-item>

          <!-- 外部Portal服务器配置 -->
          <a-form-item name="externalPortal" :label="t('page.portal.externalPortal')">
            <div class="flex-col gap-2">
              <!-- URL输入框 -->
              <a-form-item
                :name="['externalPortal', 'serverUrl']"
                :label="t('page.portal.url')"
              >
                <a-input-group compact>
                  <a-select
                    v-model:value="editForm.externalPortal.serverUrlScheme"
                    style="width: 30%"
                  >
                    <a-select-option value="http">http://</a-select-option>
                    <a-select-option value="https">https://</a-select-option>
                  </a-select>
                  <a-input
                    v-model:value="editForm.externalPortal.serverUrl"
                    style="width: 70%"
                    :placeholder="t('page.portal.enterUrl')"
                  />
                </a-input-group>
              </a-form-item>
            </div>
          </a-form-item>

          <!-- 身份验证时间配置项，仅在非外部Portal认证时显示 -->
          <a-form-item
            v-if="editForm.authType !== 4"
            name="authTimeout"
            :label="t('page.portal.authTimeout')"
          >
            <a-input-group compact>
              <a-input-number
                v-model:value="editForm.authTimeout.customTimeout"
                style="width: 60%"
                :min="1"
                :max="getMaxTimeout(editForm.authTimeout.customTimeoutUnit)"
              />
              <a-select
                v-model:value="editForm.authTimeout.customTimeoutUnit"
                style="width: 40%"
              >
                <a-select-option :value="1">{{ t('page.portal.timeUnit.min') }}</a-select-option>
                <a-select-option :value="2">{{ t('page.portal.timeUnit.hour') }}</a-select-option>
                <a-select-option :value="3">{{ t('page.portal.timeUnit.day') }}</a-select-option>
              </a-select>
            </a-input-group>
          </a-form-item>

          <a-form-item name="httpsRedirectEnable" :label="t('page.portal.httpsRedirect')">
            <a-checkbox v-model:checked="editForm.httpsRedirectEnable">
              {{ t('page.portal.enableHttpsRedirect') }}
            </a-checkbox>
          </a-form-item>
        </a-form>
      </a-modal>
    </div>
  </SimpleScrollbar>
</template>

<script setup lang="ts">
import { SimpleScrollbar } from '~/packages/materials/src';
import { ref, onMounted, watch } from 'vue';
import { Card as ACard, Table as ATable, message, TreeSelect, Modal } from 'ant-design-vue';
import { useI18n } from 'vue-i18n';
import {
  fetchSiteList,
  fetchPortalList,
  fetchSsidList,
  addPortal,
  getPortalConfig,
  updatePortalConfig,
  deletePortal
} from '@/service/api/auth';
import { DeleteOutlined, EditOutlined } from '@ant-design/icons-vue';
import { useTable } from '@/hooks/common/table';
import type { TreeSelectProps } from 'ant-design-vue';

const { t } = useI18n();

// 站点相关
const siteList = ref<Api.Site.SiteInfo[]>([]);
const selectedSiteId = ref<string>('');
const siteLoading = ref(false);

// 使用 useTable hook
const {
  columns,
  columnChecks,
  data: tableData,
  loading: tableLoading,
  getData,
  mobilePagination,
  searchParams,
} = useTable<Api.Portal.Portal>({
  apiFn: async (params) => {
    if (!selectedSiteId.value) {
      return {
        data: {
          rows: [],
          total: 0
        }
      };
    }
    return fetchPortalList(selectedSiteId.value, {
      pageNum: params.pageNum || 1,
      pageSize: params.pageSize || 10
    });
  },
  rowKey: 'id',
  columns: () => [
    {
      title: t('page.portal.name'),
      dataIndex: 'name',
      key: 'name',
      width: 150
    },
    {
      title: 'SSID',
      dataIndex: 'ssidNames',
      key: 'ssidNames',
      width: 200,
      customRender: ({ text }: { text: string[] }) => {
        return text ? text.join(', ') : '-';
      }
    },
    {
      title: t('page.portal.authType'),
      dataIndex: 'authType',
      key: 'authType',
      width: 150,
      customRender: ({ text }: { text: number }) => {
        const authTypeMap: Record<number, string> = {
          0: t('page.portal.auth.none'),
          1: t('page.portal.auth.simplePassword'),
          2: t('page.portal.auth.externalRadius'),
          4: t('page.portal.auth.externalPortal'),
          11: t('page.portal.auth.hotspot'),
          15: t('page.portal.auth.ldap')
        };
        return authTypeMap[text] || text;
      }
    },
    {
      title: t('common.operate'),
      key: 'operate',
      width: 120,
      fixed: 'right',
      align: 'center'
    }
  ]
});

// 获取站点列表
const getSiteList = async () => {
  siteLoading.value = true;
  const { data, error } = await fetchSiteList({
    pageNum: 1,
    pageSize: 100
  });

  if (!error) {
    siteList.value = data.rows || [];
    // 如果有站点数据，默认选择第一个
    if (siteList.value.length > 0) {
      selectedSiteId.value = siteList.value[0].siteId;
      // 获取第一个站点的数据
      await getData();
    }
  }
  siteLoading.value = false;
};

// 处理站点变更
const handleSiteChange = async (value: string) => {
  selectedSiteId.value = value;
  await getData();
};

// 组件挂载时获取站点列表
onMounted(() => {
  getSiteList();
});

// 添加表单相关
const addVisible = ref(false);
const formRef = ref();
const ssidList = ref<Api.Portal.SsidInfo[]>([]);
const ssidLoading = ref(false);
const treeData = ref<TreeSelectProps['treeData']>([]);

// URL 格式校验正则
const URL_PATTERN = new RegExp(
  '^(([-a-zA-Z0-9@:%._+~#=]{2,256}\\.[a-z]{2,63})|(((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)(\\.)){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)))' +
  '((:([1-9]|[1-9]\\d|[1-9]\\d{2}|[1-9]\\d{3}|[1-5]\\d{4}|6[0-4]\\d{3}|65[0-4]\\d{2}|655[0-2]\\d|6553[0-5]))?)' +
  '(/[-a-zA-Z0-9@:%_+.~#?&//=]*)?$'
);

const addForm = ref({
  name: '',
  enable: true,  // 默认启用
  ssidList: [],
  authType: 4,  // 固定为外部 Portal 认证
  authTimeout: {
    customTimeout: 8,  // 默认超时时间
    customTimeoutUnit: 2  // 默认单位为小时
  },
  noAuth: {
    dailyLimitEnable: false  // 默认不启用每日限额
  },
  httpsRedirectEnable: false,  // 默认不启用 HTTPS 重定向
  landingPage: 1,  // 默认登录页面
  pageType: 2,  // 默认页面类型
  importedPortalPage: {
    id: 'test'  // 默认导入的门户页面 ID
  },
  externalPortal: {
    hostType: 2,  // 默认外部 Portal 服务器类型
    serverUrl: '',  // 默认服务器 URL
    serverUrlScheme: 'http'  // 默认协议
  },
  portalCustomize: {  // 新增的默认参数
    defaultLanguage: 1,
    backgroundPictureId: '',
    logoPictureId: '',
    logoDisplay: true,
    inputBoxColor: '',
    inputBoxOpacity: 0,
    inputTextColor: '',
    inputTextOpacity: 0,
    buttonColor: '',
    buttonOpacity: 0,
    buttonTextColor: '',
    buttonTextOpacity: 0,
    buttonText: '',
    // formAuthButtonText: '',
    welcomeEnable: true,
    // welcomeInformation: '',
    // welcomeTextColor: '',
    welcomeTextOpacity: 0,
    welcomeTextFontSize: 0,
    termsOfServiceEnable: true,
    termsOfServiceText: '',
    termsOfServiceFontSize: 0,
    termsOfServiceUrlTexts: [
      {
        content: '',
        text: ''
      }
    ],
    copyrightEnable: false,
    copyright: '',
    // copyrightTextColor: '',
    // copyrightTextOpacity: 0,
    copyrightTextFontSize: 12,
    redirectionCountDownEnable: true,
    advertisement: {
      enable: false,
      pictureIds: [],
      // totalDuration: 0,
      // pictureInterval: 0,
      // skipEnable: true
    }
  }
});

const addRules = {
  name: [
    { required: true, message: t('page.portal.nameRequired'), trigger: 'blur' }
  ],
  ssidList: [
    {
      validator: (_rule: any, value: Record<string, string>) => {
        if (Object.keys(value).length === 0) {
          return Promise.reject(t('page.portal.ssidRequired'));
        }
        return Promise.resolve();
      },
      trigger: 'change'
    }
  ],
  externalPortal: [
    {
      validator: (_rule: any, value: Api.Portal.ExternalPortal) => {
        if (addForm.value.authType === 4) {
          if (!value.serverUrl) {
            return Promise.reject(t('page.portal.urlRequired'));
          }
          // URL 格式校验
          if (!URL_PATTERN.test(value.serverUrl)) {
            return Promise.reject(t('page.portal.invalidUrl'));
          }
        }
        return Promise.resolve();
      }
    }
  ]
};

// 获取 SSID 列表
const getSsidList = async () => {
  if (!selectedSiteId.value) return;

  ssidLoading.value = true;
  const { data, error } = await fetchSsidList(selectedSiteId.value);

  if (!error) {
    // 转换数据为树形结构
    treeData.value = data.map((group: Api.Portal.WlanGroup) => ({
      title: group.wlanName,
      value: group.wlanId, // 这个值不会被选中,只是为了符合树结构
      key: group.wlanId,
      selectable: false, // 禁止选择父节点
      children: group.ssidList.map((ssid: Api.Portal.SsidInfo) => ({
        title: ssid.ssidName,
        value: ssid.ssidId,
        key: ssid.ssidId,
        isLeaf: true
      }))
    }));
  } else {
    message.error(t('common.error'));
  }

  ssidLoading.value = false;
};

// 根据时间单位获取最大超时时间
const getMaxTimeout = (unit: number) => {
  switch (unit) {
    case 1: return 1000000; // 分钟
    case 2: return 10000;   // 小时
    case 3: return 1000;    // 天
    default: return 1000000;
  }
};

// 处理添加
const handleAdd = async () => {
  addVisible.value = true;
  await getSsidList();
};

// 修改添加确认处理函数
const handleAddConfirm = async () => {
  await formRef.value?.validate();

  const hide = message.loading(t('common.loading'), 0);

  // 创建一个新对象来存储要提交的数据
  const submitData = {
    ...addForm.value,
    // 这里可以直接使用默认值
    authType: 4,  // 固定为外部 Portal 认证
    authTimeout: {
      customTimeout: 8,
      customTimeoutUnit: 2
    },
    noAuth: {
      dailyLimitEnable: false
    },
    httpsRedirectEnable: false,
    landingPage: 1,
    pageType: 2,
    importedPortalPage: {
      id: 'test'
    },
    externalPortal: {
      hostType: 2,
      serverUrl: addForm.value.externalPortal.serverUrl,  // 确保从 addForm 中获取 serverUrl
      serverUrlScheme: addForm.value.externalPortal.serverUrlScheme
    },
    portalCustomize: {  // 新增的默认参数
      defaultLanguage: 1,
      backgroundPictureId: '',
      logoPictureId: '',
      logoDisplay: true,
      inputBoxColor: "#ffffff",
      inputBoxOpacity: 100,
      inputTextColor: "#2B2B2B",
      inputTextOpacity: 100,
      buttonColor: "#00778C",
      buttonOpacity: 100,
      buttonTextColor: "#FFFFFF",
      buttonTextOpacity: 100,
      buttonText: "Log In",
      // formAuthButtonText: '',
      welcomeEnable: false,
      // welcomeInformation: '',
      // welcomeTextColor: '',
      welcomeTextOpacity: 100,
      welcomeTextFontSize: 12,
      termsOfServiceEnable: false,
      termsOfServiceText: "I agree to Terms of Service",
      termsOfServiceFontSize: 12,
      termsOfServiceUrlTexts: [
        {
          content: "By accepting this agreement and accessing the wireless network, you acknowledge that you are of legal age, you have read and understood, and agree to be bound by this agreement.",
          text: "Terms of Service"
        }
      ],
      copyrightEnable: false,
      copyright: '',
      // copyrightTextColor: '',
      // copyrightTextOpacity: 0,
      copyrightTextFontSize: 12,
      redirectionCountDownEnable: true,
      advertisement: {
        enable: false,
        pictureIds: [],
        // totalDuration: 0,
        // pictureInterval: 0,
        // skipEnable: true
      }
    }
  };

  const { error } = await addPortal(selectedSiteId.value, submitData);

  hide();
  if (!error) {
    message.success(t('page.portal.addSuccess'));
    addVisible.value = false;
    getData(); // 刷新列表
  }
};

// 添加响应式变量
const currentPortalId = ref<string>('');
const editVisible = ref(false);
const editFormRef = ref();
const editForm = ref({
  name: '',
  enable: true,  // 默认启用
  ssidList: [],
  authType: 4,  // 固定为外部 Portal 认证
  authTimeout: {
    customTimeout: 8,  // 默认超时时间
    customTimeoutUnit: 2  // 默认单位为小时
  },
  httpsRedirectEnable: false,  // 默认不启用 HTTPS 重定向
  landingPage: 1,  // 默认登录页面
  pageType: 2,  // 默认页面类型
  importedPortalPage: {
    id: 'test'  // 默认导入的门户页面 ID
  },
  externalPortal: {
    hostType: 2,  // 默认外部 Portal 服务器类型
    serverUrl: '',  // 默认服务器 URL
    serverUrlScheme: 'http'  // 默认协议
  },
  portalCustomize: {  // 新增的默认参数
    defaultLanguage: 1,
    backgroundPictureId: '',
    logoPictureId: '',
    logoDisplay: true,
    inputBoxColor: "#ffffff",
    inputBoxOpacity: 100,
    inputTextColor: "#2B2B2B",
    inputTextOpacity: 100,
    buttonColor: "#00778C",
    buttonOpacity: 100,
    buttonTextColor: "#FFFFFF",
    buttonTextOpacity: 100,
    buttonText: "Log In",
    // formAuthButtonText: '',
    welcomeEnable: false,
    // welcomeInformation: '',
    // welcomeTextColor: '',
    welcomeTextOpacity: 100,
    welcomeTextFontSize: 12,
    termsOfServiceEnable: false,
    termsOfServiceText: "I agree to Terms of Service",
    termsOfServiceFontSize: 12,
    termsOfServiceUrlTexts: [
      {
        content: "By accepting this agreement and accessing the wireless network, you acknowledge that you are of legal age, you have read and understood, and agree to be bound by this agreement.",
        text: "Terms of Service"
      }
    ],
    copyrightEnable: false,
    copyright: '',
    // copyrightTextColor: '',
    // copyrightTextOpacity: 0,
    copyrightTextFontSize: 12,
    redirectionCountDownEnable: true,
    advertisement: {
      enable: false,
      pictureIds: [],
      // totalDuration: 0,
      // pictureInterval: 0,
      // skipEnable: true
    }
  }
});

// 处理编辑按钮点击
const handleEdit = async (record: Api.Portal.Portal) => {
  currentPortalId.value = record.id;
  editVisible.value = true;

  // 获取 SSID 列表
  await getSsidList();

  // 获取当前门户的配置
  const hide = message.loading(t('common.loading'), 0);
  const { data, error } = await getPortalConfig(selectedSiteId.value, currentPortalId.value);
  hide();

  if (!error && data) {
    // 移除 noAuth 字段后再赋值
    const { noAuth, ...configWithoutNoAuth } = data;
    editForm.value = configWithoutNoAuth;
  }
};

// 修改编辑确认处理函数
const handleEditConfirm = async () => {
  await editFormRef.value?.validate();

  const hide = message.loading(t('common.loading'), 0);

  const submitData = {
    name: editForm.value.name,
    enable: editForm.value.enable,
    ssidList: editForm.value.ssidList,
    authType: 4,  // 固定为外部 Portal 认证
    httpsRedirectEnable: editForm.value.httpsRedirectEnable,
    landingPage: 1,
    pageType: 2,
    importedPortalPage: {
      id: 'test'
    },
    authTimeout: {
      customTimeout: 8,
      customTimeoutUnit: 2
    },
    externalPortal: {
      hostType: 2,
      serverUrl: editForm.value.externalPortal.serverUrl,
      serverUrlScheme: editForm.value.externalPortal.serverUrlScheme
    },
    portalCustomize: {  // 新增的默认参数
      defaultLanguage: 1,
      backgroundPictureId: '',
      logoPictureId: '',
      logoDisplay: true,
      inputBoxColor: "#ffffff",
      inputBoxOpacity: 100,
      inputTextColor: "#2B2B2B",
      inputTextOpacity: 100,
      buttonColor: "#00778C",
      buttonOpacity: 100,
      buttonTextColor: "#FFFFFF",
      buttonTextOpacity: 100,
      buttonText: "Log In",
      // formAuthButtonText: '',
      welcomeEnable: false,
      // welcomeInformation: '',
      // welcomeTextColor: '',
      welcomeTextOpacity: 100,
      welcomeTextFontSize: 12,
      termsOfServiceEnable: false,
      termsOfServiceText: "I agree to Terms of Service",
      termsOfServiceFontSize: 12,
      termsOfServiceUrlTexts: [
        {
          content: "By accepting this agreement and accessing the wireless network, you acknowledge that you are of legal age, you have read and understood, and agree to be bound by this agreement.",
          text: "Terms of Service"
        }
      ],
      copyrightEnable: false,
      copyright: '',
      // copyrightTextColor: '',
      // copyrightTextOpacity: 0,
      copyrightTextFontSize: 12,
      redirectionCountDownEnable: true,
      advertisement: {
        enable: false,
        pictureIds: [],
        // totalDuration: 0,
        // pictureInterval: 0,
        // skipEnable: true
      }
    }
  };

  const { error } = await updatePortalConfig(selectedSiteId.value, currentPortalId.value, submitData);

  hide();
  if (!error) {
    message.success(t('page.portal.updateSuccess'));
    editVisible.value = false;
    getData(); // 刷新列表
  }
};

// 添加删除门户的 API 函数
const handleDelete = (record: Api.Portal.Portal) => {
  Modal.confirm({
    title: t('page.portal.confirmDelete'),
    content: t('page.portal.deleteConfirmContent', { name: record.name }),
    okText: t('common.confirm'),
    cancelText: t('common.cancel'),
    onOk: async () => {
      const hide = message.loading(t('common.loading'), 0);
      const { error } = await deletePortal(selectedSiteId.value, record.id);
      hide();

      if (!error) {
        message.success(t('page.portal.deleteSuccess'));
        getData(); // 刷新列表
      }
    }
  });
};
</script>

<style scoped>
.card-wrapper {
  margin-top: 16px;
}
</style>
