chore: tour

packages/ui/certd-client/src/components/tutorial/simple-steps.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-steps :current="3" class="mt-10" size="small" :items="steps" @click="goPipeline"></a-steps>
+  <a-steps :current="3" class="mt-10 simple-steps" size="small" :items="steps" @click="goPipeline"></a-steps>
 </template>
 
-<script lang="ts" setup>
+<script lang="tsx" setup>
 import { useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 
@@ -11,14 +11,26 @@ const { t } = useI18n();
 type Step = {
   title: string;
   description?: string;
+  icon?: any;
 };
 
 import { ref } from "vue";
+import { mitter } from "/@/utils/util.mitt";
 
-const steps = ref<Step[]>([{ title: t("certd.steps.createPipeline") }, { title: t("certd.steps.addTask") }, { title: t("certd.steps.scheduledRun") }]);
+const steps = ref<Step[]>([
+  { title: t("certd.steps.createPipeline"), icon: <fs-icon icon="tabler:circle-number-1-filled"></fs-icon> },
+  { title: t("certd.steps.addTask"), icon: <fs-icon icon="tabler:circle-number-2-filled"></fs-icon> },
+  { title: t("certd.steps.scheduledRun"), icon: <fs-icon icon="tabler:circle-number-3-filled"></fs-icon> },
+]);
 
-const router = useRouter();
 function goPipeline() {
-  router.push({ path: "/certd/pipeline" });
+  mitter.emit("openTutorialModal");
 }
 </script>
+<style lang="less">
+.simple-steps {
+  .fs-icon {
+    font-size: 18px !important;
+  }
+}
+</style>

packages/ui/certd-client/src/components/tutorial/tutorial-steps.vue

@@ -255,7 +255,7 @@ function previewMask() {
     flex: 1;
     padding: 20px;
     .text {
-      width: 350px;
+      width: 400px;
       display: flex;
       flex-direction: column;
       align-items: center;

packages/ui/certd-client/src/layout/components/menu/index.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script lang="tsx" setup>
-import { ref, watch, defineOptions } from "vue";
+import { ref, watch } from "vue";
 import { routerUtils } from "/@/utils/util.router";
 import { useRoute } from "vue-router";
 import { utils } from "@fast-crud/fast-crud";

packages/ui/certd-client/src/locales/langs/en-US/guide.ts

@@ -3,9 +3,9 @@ export default {
     title: "Create Certificate Application Pipeline",
     description: "Demonstrate how to configure a certificate application task",
     items: {
-      tutorialTitle: "Tutorial Demo Content",
-      tutorialDesc1: "This tutorial demonstrates how to automatically apply for a certificate and deploy it to Nginx",
-      tutorialDesc2: "Only 3 steps, fully automatic application and deployment",
+      tutorialTitle: "This tutorial demonstrates how to automatically apply for a certificate and deploy it to Nginx",
+      tutorialDesc1: "Only 3 steps, fully automatic application and deployment",
+      tutorialDesc2: "",
       createTitle: "Create Certificate Pipeline",
       createDesc: "Click to add a certificate pipeline and fill in the certificate application information",
       successTitle: "Pipeline Created Successfully",

packages/ui/certd-client/src/locales/langs/zh-CN/guide.ts

@@ -3,9 +3,9 @@ export default {
     title: "创建证书申请流水线",
     description: "演示证书申请任务如何配置",
     items: {
-      tutorialTitle: "教程演示内容",
-      tutorialDesc1: "本教程演示如何自动申请证书并部署到Nginx上",
-      tutorialDesc2: "仅需3步，全自动申请部署证书",
+      tutorialTitle: "本教程演示如何自动申请证书并部署到Nginx上",
+      tutorialDesc1: "仅需3步，全自动申请部署证书",
+      tutorialDesc2: "",
       createTitle: "创建证书流水线",
       createDesc: "点击添加证书流水线，填写证书申请信息",
       successTitle: "流水线创建成功",

packages/ui/certd-client/src/views/framework/home/dashboard/index.vue

@@ -292,9 +292,9 @@ onMounted(async () => {
   loadLatestVersion();
   loadCount();
   loadPluginGroups();
-  // if (count.value.pipelineCount === 0) {
-  tourHandleOpen(true);
-  // }
+  if (count.value.pipelineCount === 0) {
+    tourHandleOpen(true);
+  }
 });
 
 function openUpgradeUrl() {
@@ -346,9 +346,9 @@ function useTour() {
   });
 
   const tourHandleOpen = (val: boolean): void => {
-    // if (LocalStorage.get("home-tour-off")) {
-    //   return;
-    // }
+    if (LocalStorage.get("home-tour-off")) {
+      return;
+    }
     initSteps();
     tour.value.open = val;
   };