chore: join project

packages/ui/certd-client/src/api/tools.ts

@@ -19,30 +19,30 @@ export function parse(jsonString = "{}", defaultValue = {}) {
 /**
  * @description 接口请求返回
  * @param {Any} data 返回值
- * @param {String} msg 状态信息
+ * @param {String} message 状态信息
  * @param {Number} code 状态码
  */
-export function response(data = {}, msg = "", code = 0) {
-  return [200, { code, msg, data }];
+export function response(data = {}, message = "", code = 0) {
+  return [200, { code, message, data }];
 }
 
 /**
  * @description 接口请求返回 正确返回
  * @param {Any} data 返回值
- * @param {String} msg 状态信息
+ * @param {String} message 状态信息
  */
-export function responseSuccess(data = {}, msg = "成功") {
-  return response(data, msg);
+export function responseSuccess(data = {}, message = "成功") {
+  return response(data, message);
 }
 
 /**
  * @description 接口请求返回 错误返回
  * @param {Any} data 返回值
- * @param {String} msg 状态信息
+ * @param {String} message 状态信息
  * @param {Number} code 状态码
  */
-export function responseError(data = {}, msg = "请求失败", code = 500) {
-  return response(data, msg, code);
+export function responseError(data = {}, message = "请求失败", code = 500) {
+  return response(data, message, code);
 }
 
 /**

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

@@ -218,6 +218,7 @@ export default {
     projectUserManager: "Project User Management",
     myProjectManager: "My Projects",
     myProjectDetail: "Project Detail",
+    projectJoin: "Join Project",
   },
   certificateRepo: {
     title: "Certificate Repository",
@@ -830,6 +831,9 @@ export default {
     fetchFailed: "Failed to fetch project list",
     applySuccess: "Application successful, waiting for admin approval",
     applyFailed: "Application failed, please try again later",
+    leave: "Leave Project",
+    leaveSuccess: "Leave project successful",
+    leaveFailed: "Leave project failed, please try again later",
   },
   addonSelector: {
     select: "Select",

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

@@ -224,6 +224,7 @@ export default {
     enterpriseSetting: "企业设置",
     myProjectManager: "我的项目",
     myProjectDetail: "项目详情",
+    projectJoin: "加入项目",
   },
   certificateRepo: {
     title: "证书仓库",
@@ -839,12 +840,15 @@ export default {
   project: {
     noProjectJoined: "您还没有加入任何项目",
     applyToJoin: "请申请加入项目以开始使用",
-    systemProjects: "系统项目列表",
+    projectList: "项目列表",
     createdAt: "创建时间",
     applyJoin: "申请加入",
-    noSystemProjects: "暂无系统项目",
+    noProjects: "暂无项目",
     fetchFailed: "获取项目列表失败",
     applySuccess: "申请成功，等待管理员审核",
     applyFailed: "申请失败，请稍后重试",
+    leave: "退出项目",
+    leaveSuccess: "退出项目成功",
+    leaveFailed: "退出项目失败，请稍后重试",
   },
 };

packages/ui/certd-client/src/router/guard.ts

@@ -10,7 +10,7 @@ import { usePermissionStore } from "/@/plugin/permission/store.permission";
 import util from "/@/plugin/permission/util.permission";
 import { useUserStore } from "/@/store/user";
 import { useProjectStore } from "../store/project";
-export const PROJECT_BLANK_PATH = "/certd/project/blank";
+export const PROJECT_JOIN_PATH = "/certd/project/join";
 function buildAccessedMenus(menus: any) {
   if (menus == null) {
     return;
@@ -131,10 +131,10 @@ function setupAccessGuard(router: Router) {
       if (projectStore.isEnterprise) {
         //加载我的项目
         await projectStore.init();
-        if (!projectStore.currentProject && to.path !== PROJECT_BLANK_PATH) {
+        if (!projectStore.currentProject && to.path !== PROJECT_JOIN_PATH) {
           //没有项目
           return {
-            path: PROJECT_BLANK_PATH,
+            path: PROJECT_JOIN_PATH,
             replace: true,
           };
         }

packages/ui/certd-client/src/router/source/modules/certd.ts

@@ -43,10 +43,10 @@ export const certdResources = [
         },
       },
       {
-        title: "certd.sysResources.myProjectBlank",
-        name: "MyProjectBlank",
-        path: "/certd/project/blank",
-        component: "/certd/project/blank.vue",
+        title: "certd.sysResources.projectJoin",
+        name: "ProjectJoin",
+        path: "/certd/project/join",
+        component: "/certd/project/join.vue",
         meta: {
           isMenu: false,
           show: true,

packages/ui/certd-client/src/views/certd/dicts.ts

@@ -24,6 +24,29 @@ const projectPermissionDict = dict({
   ],
 });
 
+const projectMemberStatusDict = dict({
+  data: [
+    {
+      value: "pending",
+      label: "待审核",
+      color: "orange",
+      icon: "material-symbols:hourglass-top",
+    },
+    {
+      value: "approved",
+      label: "已加入",
+      color: "green",
+      icon: "material-symbols:done-all",
+    },
+    {
+      value: "rejected",
+      label: "已拒绝",
+      color: "red",
+      icon: "material-symbols:close",
+    },
+  ],
+});
+
 const myProjectDict = dict({
   url: "/enterprise/project/list",
   getData: async () => {
@@ -56,5 +79,6 @@ export function useDicts() {
     projectPermissionDict,
     myProjectDict,
     userDict,
+    projectMemberStatusDict,
   };
 }

packages/ui/certd-client/src/views/certd/project/blank.vue

@@ -1,122 +0,0 @@
-<template>
-  <fs-page class="page-cert">
-    <template #header>
-      <div class="title">
-        {{ t("certd.sysResources.myProjectManager") }}
-      </div>
-    </template>
-    <div class="blank-container">
-      <div class="project-list-container">
-        <h3 class="text-lg font-medium mb-4">{{ t("certd.project.systemProjects") }}</h3>
-        <a-card v-for="project in projects" :key="project.id" :bordered="false" class="project-card">
-          <div class="project-card-content">
-            <div class="project-info">
-              <h4 class="text-md font-medium">{{ project.name }}</h4>
-              <p class="text-gray-500 text-sm">{{ t("certd.project.createdAt") }}: {{ formatDate(project.createTime) }}</p>
-            </div>
-            <a-button type="primary" @click="applyToJoin(project.id)">{{ t("certd.project.applyJoin") }}</a-button>
-          </div>
-        </a-card>
-        <div v-if="projects.length === 0" class="no-projects"></div>
-      </div>
-    </div>
-  </fs-page>
-</template>
-
-<script lang="ts" setup>
-import { ref, onMounted } from "vue";
-import { useI18n } from "/src/locales";
-import { message } from "ant-design-vue";
-import { request } from "/src/api/service";
-
-const { t } = useI18n();
-
-const projects = ref<any[]>([]);
-
-const getSystemProjects = async () => {
-  try {
-    // 假设这里调用获取系统项目列表的API
-    const response = await request({
-      url: "/enterprise/project/list",
-      method: "post",
-      data: { type: "system" }, // 假设type=system表示系统项目
-    });
-    projects.value = response || [];
-  } catch (error) {
-    message.error(t("certd.project.fetchFailed"));
-    console.error("获取项目列表失败:", error);
-  }
-};
-
-const applyToJoin = async (projectId: number) => {
-  try {
-    // 假设这里调用申请加入项目的API
-    await request({
-      url: "/enterprise/project/apply",
-      method: "post",
-      data: { projectId },
-    });
-    message.success(t("certd.project.applySuccess"));
-    // 申请成功后可以刷新页面或跳转到项目列表
-  } catch (error) {
-    message.error(t("certd.project.applyFailed"));
-    console.error("申请加入项目失败:", error);
-  }
-};
-
-const formatDate = (dateString: string) => {
-  if (!dateString) return "";
-  const date = new Date(dateString);
-  return date.toLocaleString();
-};
-
-onMounted(() => {
-  getSystemProjects();
-});
-</script>
-
-<style lang="less">
-.blank-container {
-  padding: 24px;
-  max-width: 1200px;
-  margin: 0 auto;
-}
-
-.empty-state {
-  margin-bottom: 48px;
-  text-align: center;
-}
-
-.empty-description {
-  margin-top: 16px;
-}
-
-.project-list-container {
-  margin-top: 32px;
-}
-
-.project-card {
-  margin-bottom: 16px;
-  transition: all 0.3s;
-
-  &:hover {
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-  }
-}
-
-.project-card-content {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.project-info {
-  flex: 1;
-}
-
-.no-projects {
-  margin-top: 24px;
-  padding: 48px 0;
-  text-align: center;
-}
-</style>

packages/ui/certd-client/src/views/certd/project/join.vue

@@ -0,0 +1,153 @@
+<template>
+  <fs-page class="page-project-join">
+    <template #header>
+      <div class="title">
+        {{ t("certd.sysResources.projectJoin") }}
+        <span v-if="projectStore.projects.length === 0" class="sub">{{ t("certd.project.noProjectJoined") }}</span>
+      </div>
+    </template>
+    <div class="project-container">
+      <h3 class="text-lg font-medium mb-4">{{ t("certd.project.projectList") }}</h3>
+      <div class="flex flex-wrap gap-4">
+        <div v-for="project in projects" :key="project.id" class="w-full md:w-1/4">
+          <a-card :bordered="true" class="project-card">
+            <div class="project-card-content">
+              <div class="project-info">
+                <h3 class="text-md font-bold title">{{ project.name }}</h3>
+                <p class="text-gray-500 text-sm">{{ formatDate(project.createTime) }}</p>
+              </div>
+              <div class="flex justify-between items-center">
+                <div v-if="project.status">
+                  <fs-values-format :model-value="project.status" :dict="projectMemberStatusDict"></fs-values-format>
+                </div>
+                <div v-if="project.permission"><fs-values-format :model-value="project.permission" :dict="projectPermissionDict"></fs-values-format></div>
+              </div>
+            </div>
+            <template #actions>
+              <span v-if="!project.status || project.status === 'rejected'" class="flex-inline items-center" :title="t('certd.project.applyJoin')" @click="applyToJoin(project.id)">
+                <fs-icon class="fs-18 mr-2" icon="mdi:checkbox-marked-circle-outline"></fs-icon>
+                {{ t("certd.project.applyJoin") }}
+              </span>
+              <span v-if="project.status === 'pending' || project.status === 'approved'" class="flex-inline items-center" :title="t('certd.project.leave')" @click="leaveProject(project.id)">
+                <fs-icon class="fs-18 mr-2" icon="mdi:arrow-right-thin-circle-outline"></fs-icon>
+                {{ t("certd.project.leave") }}
+              </span>
+            </template>
+          </a-card>
+        </div>
+      </div>
+    </div>
+  </fs-page>
+</template>
+
+<script lang="ts" setup>
+import { ref, onMounted } from "vue";
+import { useI18n } from "/src/locales";
+import { message, Modal } from "ant-design-vue";
+import { request } from "/src/api/service";
+import { useProjectStore } from "/@/store/project";
+import dayjs from "dayjs";
+import { useDicts } from "../dicts";
+import { modalProps } from "ant-design-vue/es/modal/Modal";
+
+defineOptions({
+  name: "ProjectJoin",
+});
+const { t } = useI18n();
+
+const { projectMemberStatusDict, projectPermissionDict } = useDicts();
+
+const projects = ref<any[]>([]);
+
+const projectStore = useProjectStore();
+
+const getSystemProjects = async () => {
+  try {
+    // 假设这里调用获取系统项目列表的API
+    const response = await request({
+      url: "/enterprise/project/all",
+      method: "post",
+    });
+    projects.value = response || [];
+  } catch (error) {
+    message.error(t("certd.project.fetchFailed"));
+    console.error("获取项目列表失败:", error);
+  }
+};
+
+const applyToJoin = async (projectId: number) => {
+  // 假设这里调用申请加入项目的API
+  Modal.confirm({
+    title: t("certd.project.applyJoin"),
+    content: t("certd.project.applyJoinConfirm"),
+    onOk: async () => {
+      await request({
+        url: "/enterprise/project/applyJoin",
+        method: "post",
+        data: { projectId },
+      });
+      message.success(t("certd.project.applySuccess"));
+      await getSystemProjects();
+      // 申请成功后可以刷新页面或跳转到项目列表
+    },
+  });
+};
+
+const formatDate = (dateString: string) => {
+  if (!dateString) {
+    return "";
+  }
+  return dayjs(dateString).format("YYYY-MM-DD HH:mm:ss");
+};
+
+onMounted(() => {
+  getSystemProjects();
+});
+
+async function leaveProject(projectId: number) {
+  // 假设这里调用退出项目的API
+  Modal.confirm({
+    title: t("certd.project.leave"),
+    content: t("certd.project.leaveConfirm"),
+    onOk: async () => {
+      await request({
+        url: "/enterprise/project/leave",
+        method: "post",
+        data: { projectId },
+      });
+      message.success(t("certd.project.leaveSuccess"));
+      // 退出成功后可以刷新页面或跳转到项目列表
+      await getSystemProjects();
+    },
+  });
+}
+</script>
+
+<style lang="less">
+.page-project-join {
+  .project-container {
+    padding: 24px;
+    margin: 0 auto;
+    .project-card {
+      margin-bottom: 16px;
+      transition: all 0.3s;
+
+      &:hover {
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+      }
+
+      .project-card-content {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+
+      .title {
+        font-size: 16px;
+        font-weight: bold;
+        margin-bottom: 8px;
+      }
+    }
+  }
+}
+</style>