perf: 支持ftp上传

packages/ui/certd-client/src/components/vip-button/index.vue

@@ -1,20 +1,13 @@
 <template>
-  <div class="layout-vip isPlus">
+  <div class="layout-vip isPlus" @click="openUpgrade">
     <contextHolder />
-    <fs-icon icon="mingcute:vip-1-line"></fs-icon>
-    <div class="text">
-      <template v-if="userStore.isPlus">
-        <a-tooltip>
-          <template #title> 到期时间：{{ expireTime }} </template>
-          <span @click="openUpgrade">{{ texts.plus }}</span>
-        </a-tooltip>
-      </template>
-      <template v-else>
-        <a-tooltip>
-          <template #title> 升级专业版，享受更多VIP特权 </template>
-          <span @click="openUpgrade"> {{ texts.free }} {{ expiredDays }} </span>
-        </a-tooltip>
-      </template>
+    <fs-icon icon="mingcute:vip-1-line" :title="text.title" />
+
+    <div v-if="mode !== 'icon'" class="text">
+      <a-tooltip>
+        <template #title> {{ text.title }}</template>
+        <span>{{ text.name }}</span>
+      </a-tooltip>
     </div>
   </div>
 </template>
@@ -26,24 +19,53 @@ import { message, Modal } from "ant-design-vue";
 import * as api from "./api";
 import { useSettingStore } from "/@/store/modules/settings";
 
-const props = defineProps<{
-  mode?: "button" | "nav";
-}>();
-type Texts = {
-  plus: string;
-  free: string;
+const props = withDefaults(
+  defineProps<{
+    mode?: "button" | "nav" | "icon";
+  }>(),
+  {
+    mode: "button"
+  }
+);
+type Text = {
+  name: string;
+  title?: string;
 };
-const texts = computed<Texts>(() => {
-  if (props.mode === "button") {
-    return {
-      plus: "专业版已开通",
-      free: "此为专业版功能"
-    };
+const text = computed<Text>(() => {
+  const map = {
+    isPlus: {
+      button: {
+        name: "专业版已开通",
+        title: "到期时间：" + expireTime.value
+      },
+      icon: {
+        name: "",
+        title: "专业版已开通"
+      },
+      nav: {
+        name: "专业版",
+        title: "到期时间：" + expireTime.value
+      }
+    },
+    free: {
+      button: {
+        name: "此为专业版功能",
+        title: "升级专业版，享受更多VIP特权"
+      },
+      icon: {
+        name: "",
+        title: "此为专业版功能"
+      },
+      nav: {
+        name: "免费版",
+        title: "升级专业版，享受更多VIP特权"
+      }
+    }
+  };
+  if (userStore.isPlus) {
+    return map.isPlus[props.mode];
   } else {
-    return {
-      plus: "专业版",
-      free: "免费版"
-    };
+    return map.free[props.mode];
   }
 });
 
@@ -86,6 +108,7 @@ async function doActive() {
 const settingStore = useSettingStore();
 const computedSiteId = computed(() => settingStore.installInfo?.siteId);
 const [modal, contextHolder] = Modal.useModal();
+
 function openUpgrade() {
   const placeholder = "请输入激活码";
   modal.confirm({
@@ -137,6 +160,7 @@ function openUpgrade() {
   justify-content: center;
   height: 100%;
   cursor: pointer;
+
   &.isPlus {
     color: #c5913f;
   }