refactor: 升级框架补充

packages/effects/common-ui/src/components/doc-alert/doc-alert.vue

@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { DocAlertProps } from './types';
+
+import { ref } from 'vue';
+
+import { isDocAlertEnable } from '@vben/hooks';
+
+import { VbenIcon } from '@vben-core/shadcn-ui';
+import { openWindow } from '@vben-core/shared/utils';
+
+defineOptions({
+  name: 'DocAlert',
+});
+
+const props = defineProps<DocAlertProps>();
+
+/** 控制组件显示状态 */
+const isVisible = ref(true);
+
+function goToUrl() {
+  openWindow(props.url);
+}
+
+function close() {
+  isVisible.value = false;
+}
+</script>
+<template>
+  <div
+    role="alert"
+    v-if="isDocAlertEnable() && isVisible"
+    class="border-primary bg-primary/10 relative my-2 flex h-8 w-full items-center gap-2 rounded-md border p-2"
+  >
+    <span class="grid shrink-0 place-items-center">
+      <VbenIcon icon="mdi:information-outline" class="text-primary size-5" />
+    </span>
+    <div class="text-primary min-w-0 flex-1 font-sans text-sm leading-none">
+      <span class="inline-block">【{{ title }}】</span>
+      <a
+        class="hover:text-success cursor-pointer break-all"
+        @click="goToUrl"
+        :title="url"
+      >
+        文档地址：{{ url }}
+      </a>
+    </div>
+    <span class="grid shrink-0 cursor-pointer place-items-center">
+      <VbenIcon
+        icon="mdi:close"
+        class="text-primary size-5 hover:text-red-500"
+        @click="close"
+      />
+    </span>
+  </div>
+</template>

packages/effects/common-ui/src/components/doc-alert/index.ts

@@ -0,0 +1,2 @@
+export { default as DocAlert } from './doc-alert.vue';
+export * from './types';

packages/effects/common-ui/src/components/doc-alert/types.ts

@@ -0,0 +1,4 @@
+export interface DocAlertProps {
+  title: string;
+  url: string;
+}

packages/effects/common-ui/src/ui/authentication/doc-link.vue

@@ -0,0 +1,48 @@
+<script setup lang="ts">
+defineOptions({
+  name: 'DocLink',
+});
+</script>
+
+<template>
+  <div class="w-full sm:mx-auto md:max-w-md">
+    <div class="mt-4 flex items-center justify-between">
+      <span class="border-input w-[35%] border-b dark:border-gray-600"></span>
+      <span class="text-muted-foreground text-center text-xs uppercase">
+        萌新必读
+      </span>
+      <span class="border-input w-[35%] border-b dark:border-gray-600"></span>
+    </div>
+
+    <div class="mt-4 flex w-full justify-between">
+      <a
+        href="https://doc.iocoder.cn/"
+        target="_blank"
+        class="text-primary hover:text-primary/80 text-sm"
+      >
+        📚 开发指南
+      </a>
+      <a
+        href="https://doc.iocoder.cn/video/"
+        target="_blank"
+        class="text-primary hover:text-primary/80 text-sm"
+      >
+        🔥 视频教程
+      </a>
+      <a
+        href="https://www.iocoder.cn/Interview/good-collection/"
+        target="_blank"
+        class="text-primary hover:text-primary/80 text-sm"
+      >
+        ⚡ 面试手册
+      </a>
+      <a
+        href="http://static.yudao.iocoder.cn/mp/xinyu370.jpeg"
+        target="_blank"
+        class="text-primary hover:text-primary/80 text-sm"
+      >
+        🤝 外包咨询
+      </a>
+    </div>
+  </div>
+</template>

packages/effects/layouts/src/widgets/help/help.vue

@@ -0,0 +1,104 @@
+<script lang="ts" setup>
+import { $t } from '@vben/locales';
+import { openWindow } from '@vben/utils';
+
+import { useVbenModal } from '@vben-core/popup-ui';
+import { Badge, VbenButton, VbenButtonGroup } from '@vben-core/shadcn-ui';
+
+import { useMagicKeys, whenever } from '@vueuse/core';
+
+defineOptions({
+  name: 'Help',
+});
+
+const keys = useMagicKeys();
+whenever(keys['Alt+KeyH']!, () => {
+  modalApi.open();
+});
+
+const [Modal, modalApi] = useVbenModal({
+  draggable: true,
+  overlayBlur: 5,
+  footer: false,
+  onCancel() {
+    modalApi.close();
+  },
+});
+</script>
+<template>
+  <Modal class="w-1/3" :title="$t('ui.widgets.qa')">
+    <div class="mt-2 flex flex-col">
+      <div class="mt-2 flex flex-col">
+        <VbenButtonGroup class="basis-1/3" :gap="2" border size="large">
+          <p class="w-24 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="w-24 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="w-24 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>
+      <div class="mt-2 flex justify-start">
+        <p class="w-24 p-2">软件外包:</p>
+        <img
+          src="/wx-xingyu.png"
+          alt="数舵科技"
+          class="cursor-pointer"
+          @click="openWindow('https://shuduokeji.com')"
+        />
+      </div>
+      <p class="mt-2 flex justify-center pt-4 text-sm italic">
+        本项目采用 <Badge class="mx-2" variant="destructive">MIT</Badge>
+        开源协议，个人与企业可100% 免费使用。
+      </p>
+    </div>
+  </Modal>
+</template>

packages/effects/layouts/src/widgets/help/index.ts

@@ -0,0 +1 @@
+export { default as Help } from './help.vue';

packages/effects/layouts/src/widgets/tenant-dropdown/index.ts

@@ -0,0 +1 @@
+export { default as TenantDropdown } from './tenant-dropdown.vue';

packages/effects/layouts/src/widgets/tenant-dropdown/tenant-dropdown.vue

@@ -0,0 +1,83 @@
+<script lang="ts" setup>
+import { computed } from 'vue';
+
+import { IconifyIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
+
+import {
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@vben-core/shadcn-ui';
+
+interface Tenant {
+  id?: number;
+  name: string;
+  packageId: number;
+  contactName: string;
+  contactMobile: string;
+  accountCount: number;
+  expireTime: Date;
+  website: string;
+  status: number;
+}
+
+defineOptions({
+  name: 'TenantDropdown',
+});
+
+const props = defineProps<{
+  tenantList?: Tenant[];
+  visitTenantId?: null | number;
+}>();
+
+const emit = defineEmits(['success']);
+
+// 租户列表
+const tenants = computed(() => props.tenantList ?? []);
+
+async function handleChange(id: number | undefined) {
+  if (!id) {
+    return;
+  }
+  const tenant = tenants.value.find((item) => item.id === id);
+
+  emit('success', tenant);
+}
+</script>
+<template>
+  <DropdownMenu>
+    <DropdownMenuTrigger>
+      <Button
+        variant="outline"
+        class="hover:bg-accent ml-1 mr-2 h-8 w-32 cursor-pointer rounded-full p-1.5"
+      >
+        <IconifyIcon icon="lucide:align-justify" class="mr-4" />
+        {{ $t('page.tenant.placeholder') }}
+        <!-- {{ tenants.find((item) => item.id === visitTenantId)?.name }} -->
+      </Button>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent class="w-40 p-0 pb-1">
+      <DropdownMenuGroup>
+        <DropdownMenuItem
+          v-for="tenant in tenants"
+          :key="tenant.id"
+          :disabled="tenant.id === visitTenantId"
+          class="mx-1 flex cursor-pointer items-center rounded-sm py-1 leading-8"
+          @click="handleChange(tenant.id)"
+        >
+          <template v-if="tenant.id === visitTenantId">
+            <IconifyIcon icon="lucide:check" class="mr-2" />
+            {{ tenant.name }}
+          </template>
+          <template v-else>
+            {{ tenant.name }}
+          </template>
+        </DropdownMenuItem>
+      </DropdownMenuGroup>
+    </DropdownMenuContent>
+  </DropdownMenu>
+</template>

packages/effects/plugins/src/markmap/index.ts

@@ -0,0 +1,5 @@
+export { default as MarkdownIt } from 'markdown-it';
+export { Transformer } from 'markmap-lib';
+export { Toolbar } from 'markmap-toolbar';
+
+export * from 'markmap-view';