From d88a5ff6467cbdfd0488151a018a410f2e27b1d6 Mon Sep 17 00:00:00 2001
From: xingyu4j <xingyu4j@vip.qq.com>
Date: Fri, 9 May 2025 14:39:04 +0800
Subject: [PATCH] feat: layouts

---
 .../web-naive/src/layouts/components/help.vue | 90 +++++++++++++++++++
 .../layouts/components/tenant-dropdown.vue    | 62 +++++++++++++
 2 files changed, 152 insertions(+)
 create mode 100644 apps/web-naive/src/layouts/components/help.vue
 create mode 100644 apps/web-naive/src/layouts/components/tenant-dropdown.vue

diff --git a/apps/web-naive/src/layouts/components/help.vue b/apps/web-naive/src/layouts/components/help.vue
new file mode 100644
index 00000000..e30d6ea8
--- /dev/null
+++ b/apps/web-naive/src/layouts/components/help.vue
@@ -0,0 +1,90 @@
+<script lang="ts" setup>
+import { useVbenModal, VbenButton, VbenButtonGroup } from '@vben/common-ui';
+import { openWindow } from '@vben/utils';
+
+import { NImage, NTag } from 'naive-ui';
+
+import { $t } from '#/locales';
+
+const [Modal, modalApi] = useVbenModal({
+  draggable: true,
+  overlayBlur: 5,
+  footer: false,
+  onCancel() {
+    modalApi.close();
+  },
+});
+</script>
+<template>
+  <Modal class="w-[40%]" :title="$t('ui.widgets.qa')">
+    <div class="mt-2 flex flex-col">
+      <div class="mt-2 flex flex-row">
+        <VbenButtonGroup class="basis-1/3" :gap="2" border size="large">
+          <p class="p-2">项目地址:</p>
+          <VbenButton
+            variant="link"
+            @click="
+              openWindow('https://gitee.com/yudaocode/yudao-ui-admin-vben')
+            "
+          >
+            Gitee
+          </VbenButton>
+          <VbenButton
+            variant="link"
+            @click="
+              openWindow('https://github.com/yudaocode/yudao-ui-admin-vben')
+            "
+          >
+            Github
+          </VbenButton>
+        </VbenButtonGroup>
+
+        <VbenButtonGroup class="basis-1/3" :gap="2" border size="large">
+          <p class="p-2">issues:</p>
+          <VbenButton
+            variant="link"
+            @click="
+              openWindow(
+                'https://gitee.com/yudaocode/yudao-ui-admin-vben/issues',
+              )
+            "
+          >
+            Gitee
+          </VbenButton>
+          <VbenButton
+            variant="link"
+            @click="
+              openWindow(
+                'https://github.com/yudaocode/yudao-ui-admin-vben/issues',
+              )
+            "
+          >
+            Github
+          </VbenButton>
+        </VbenButtonGroup>
+
+        <VbenButtonGroup class="basis-1/3" :gap="2" border size="large">
+          <p class="p-2">开发文档:</p>
+          <VbenButton
+            variant="link"
+            @click="openWindow('https://doc.iocoder.cn/quick-start/')"
+          >
+            项目文档
+          </VbenButton>
+          <VbenButton variant="link" @click="openWindow('https://antdv.com/')">
+            antdv 文档
+          </VbenButton>
+        </VbenButtonGroup>
+      </div>
+      <p class="mt-2 flex justify-center">
+        <span>
+          <NImage src="/wx-xingyu.png" alt="数舵科技" />
+        </span>
+      </p>
+      <p class="mt-2 flex justify-center pt-4 text-sm italic">
+        本项目采用<NTag color="blue">MIT</NTag>开源协议，个人与企业可100%
+        免费使用。
+      </p>
+    </div>
+  </Modal>
+</template>
diff --git a/apps/web-naive/src/layouts/components/tenant-dropdown.vue b/apps/web-naive/src/layouts/components/tenant-dropdown.vue
new file mode 100644
index 00000000..b56dde48
--- /dev/null
+++ b/apps/web-naive/src/layouts/components/tenant-dropdown.vue
@@ -0,0 +1,62 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'naive-ui/es/select';
+
+import type { SystemTenantApi } from '#/api/system/tenant';
+
+import { onMounted, ref } from 'vue';
+
+import { useAccess } from '@vben/access';
+import { isTenantEnable, useTabs } from '@vben/hooks';
+import { useAccessStore } from '@vben/stores';
+
+import { NSelect } from 'naive-ui';
+
+import { message } from '#/adapter/naive';
+import { getSimpleTenantList } from '#/api/system/tenant';
+import { $t } from '#/locales';
+
+const { closeOtherTabs, refreshTab } = useTabs();
+
+const { hasAccessByCodes } = useAccess();
+const accessStore = useAccessStore();
+
+const tenantEnable = isTenantEnable();
+
+const value = ref<number>(accessStore.visitTenantId ?? undefined); // 当前访问的租户 ID
+const tenants = ref<SystemTenantApi.Tenant[]>([]); // 租户列表
+
+async function handleChange(id: SelectValue) {
+  // 设置访问租户 ID
+  accessStore.setVisitTenantId(id as number);
+  // 关闭其他标签页，只保留当前页
+  await closeOtherTabs();
+  // 刷新当前页面
+  await refreshTab();
+  // 提示切换成功
+  const tenant = tenants.value.find((item) => item.id === id);
+  if (tenant) {
+    message.success(`切换当前租户为: ${tenant.name}`);
+  }
+}
+
+onMounted(async () => {
+  if (!tenantEnable) {
+    return;
+  }
+  tenants.value = await getSimpleTenantList();
+});
+</script>
+<template>
+  <div v-if="tenantEnable && hasAccessByCodes(['system:tenant:visit'])">
+    <NSelect
+      v-model:value="value"
+      :field-names="{ label: 'name', value: 'id' }"
+      :options="tenants"
+      :placeholder="$t('page.tenant.placeholder')"
+      :dropdown-style="{ position: 'fixed', zIndex: 1666 }"
+      allow-clear
+      class="w-40"
+      @change="handleChange"
+    />
+  </div>
+</template>