chore: project detail join approve

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

@@ -1,5 +1,6 @@
 import { dict } from "@fast-crud/fast-crud";
 import { GetMyProjectList } from "./project/api";
+import { request } from "/@/api/service";
 
 const projectPermissionDict = dict({
   data: [
@@ -65,8 +66,16 @@ const myProjectDict = dict({
 });
 
 const userDict = dict({
-  url: "/sys/authority/user/getSimpleUsers",
+  url: "/basic/user/getSimpleUsers",
   value: "id",
+  getData: async () => {
+    const res = await request({
+      url: "/basic/user/getSimpleUsers",
+      method: "POST",
+    });
+    return res;
+  },
+  immediate: false,
   onReady: ({ dict }) => {
     for (const item of dict.data) {
       item.label = item.nickName || item.username || item.phoneCode + item.mobile;

packages/ui/certd-client/src/views/certd/project/detail/api.ts

@@ -1,6 +1,6 @@
 import { request } from "/src/api/service";
 
-const apiPrefix = "/enterprise/myProjectMember";
+const apiPrefix = "/enterprise/projectMember";
 const userApiPrefix = "/sys/authority/user";
 export async function GetList(query: any) {
   return await request({
@@ -65,3 +65,13 @@ export async function GetUserSimpleByIds(query: any) {
     data: query,
   });
 }
+
+export async function ApproveJoin(id: any) {
+  return await request({
+    url: "/enterprise/project/approveJoin",
+    method: "post",
+    data: {
+      id,
+    },
+  });
+}

packages/ui/certd-client/src/views/certd/project/detail/crud.tsx

@@ -7,6 +7,7 @@ import { useSettingStore } from "/@/store/settings";
 import { useUserStore } from "/@/store/user";
 import { useI18n } from "/src/locales";
 import { useDicts } from "../../dicts";
+import { useApprove } from "./use";
 
 export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
   const router = useRouter();
@@ -34,8 +35,9 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
   const settingStore = useSettingStore();
   const selectedRowKeys: Ref<any[]> = ref([]);
   context.selectedRowKeys = selectedRowKeys;
-
-  const { userDict } = useDicts();
+  const { hasActionPermission } = context;
+  const { userDict, projectMemberStatusDict, projectPermissionDict } = useDicts();
+  const { openApproveDialog } = useApprove();
 
   return {
     crudOptions: {
@@ -118,13 +120,7 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
         permission: {
           title: t("certd.ent.projectPermission"),
           type: "dict-select",
-          dict: dict({
-            data: [
-              { label: t("certd.ent.permission.read"), value: "read", color: "cyan" },
-              { label: t("certd.ent.permission.write"), value: "write", color: "blue" },
-              { label: t("certd.ent.permission.admin"), value: "admin", color: "green" },
-            ],
-          }),
+          dict: projectPermissionDict,
           search: {
             show: true,
           },
@@ -135,6 +131,50 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
             width: 200,
           },
         },
+        status: {
+          title: t("certd.ent.projectMemberStatus"),
+          type: "dict-select",
+          dict: projectMemberStatusDict,
+          search: {
+            show: true,
+          },
+          form: {
+            show: true,
+          },
+          column: {
+            width: 200,
+            cellRender: ({ row }) => {
+              let approveButton: any = "";
+              if (row.status === "pending" && hasActionPermission("admin")) {
+                approveButton = (
+                  <fs-button
+                    class="ml-2"
+                    type="primary"
+                    size="small"
+                    onClick={async () => {
+                      openApproveDialog({
+                        id: row.id,
+                        permission: row.permission,
+                        onSubmit: async (form: any) => {
+                          await api.ApproveJoin(form);
+                          crudExpose.doRefresh();
+                        },
+                      });
+                    }}
+                  >
+                    审批
+                  </fs-button>
+                );
+              }
+              return (
+                <div class="flex items-center">
+                  <fs-values-format model-value={row.status} dict={projectMemberStatusDict}></fs-values-format>
+                  {approveButton}
+                </div>
+              );
+            },
+          },
+        },
         createTime: {
           title: t("certd.createTime"),
           type: "datetime",

packages/ui/certd-client/src/views/certd/project/detail/index.vue

@@ -3,8 +3,14 @@
     <template #header>
       <div class="title">
         {{ t("certd.ent.projectDetailManager") }}
-        <span class="sub">
-          {{ t("certd.ent.projectDetailDescription") }}
+        <span class="sub flex-inline items-center">
+          项目名称 ：<a-tag color="green">{{ project?.name }}</a-tag>
+          <a-divider type="vertical"></a-divider>
+          管理员：<fs-values-format :model-value="project.adminId" :dict="userDict" color="green"></fs-values-format>
+          <!-- <a-divider type="vertical"></a-divider>
+          <fs-values-format :model-value="project.permission" :dict="projectPermissionDict"></fs-values-format>
+          <a-divider type="vertical"></a-divider>
+          <fs-values-format :model-value="project.status" :dict="projectMemberStatusDict"></fs-values-format> -->
         </span>
       </div>
     </template>
@@ -19,13 +25,17 @@
 </template>
 
 <script lang="ts" setup>
-import { onActivated, onMounted } from "vue";
+import { onActivated, onMounted, Ref, ref } from "vue";
 import { useFs } from "@fast-crud/fast-crud";
 import createCrudOptions from "./crud";
 import { message, Modal } from "ant-design-vue";
 import { DeleteBatch } from "./api";
 import { useI18n } from "/src/locales";
 import { useRoute } from "vue-router";
+import { useProjectStore } from "/@/store/project";
+import { request } from "/@/api/service";
+import { useDicts } from "../../dicts";
+import { useCrudPermission } from "/@/plugin/permission";
 
 const { t } = useI18n();
 
@@ -35,11 +45,38 @@ defineOptions({
 
 const route = useRoute();
 const projectIdStr = route.query.projectId as string;
-const projectId = Number(projectIdStr);
+let projectId = Number(projectIdStr);
+const projectStore = useProjectStore();
+if (!projectId) {
+  projectId = projectStore.currentProject?.id;
+}
+
+const { projectPermissionDict, projectMemberStatusDict, userDict } = useDicts();
+
+const project: Ref<any> = ref({});
+
+async function loadProjectDetail() {
+  if (projectId) {
+    const res = await request({
+      url: `/enterprise/project/detail`,
+      method: "post",
+      params: {
+        projectId,
+      },
+    });
+    project.value = res;
+  }
+}
 
 const context: any = {
   projectId,
+  permission: {
+    isProjectPermission: true,
+    projectPermission: "admin",
+  },
 };
+const { hasActionPermission } = useCrudPermission(context);
+context.hasActionPermission = hasActionPermission;
 const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context });
 
 const selectedRowKeys = context.selectedRowKeys;
@@ -61,7 +98,8 @@ const handleBatchDelete = () => {
 };
 
 // 页面打开后获取列表数据
-onMounted(() => {
+onMounted(async () => {
+  await loadProjectDetail();
   crudExpose.doRefresh();
 });
 onActivated(async () => {

packages/ui/certd-client/src/views/certd/project/detail/use.ts

@@ -0,0 +1,46 @@
+import { dict } from "@fast-crud/fast-crud";
+import { useDicts } from "../../dicts";
+import { useFormDialog } from "/@/use/use-dialog";
+
+export function useApprove() {
+  const { openFormDialog } = useFormDialog();
+  const { projectPermissionDict, projectMemberStatusDict, userDict } = useDicts();
+  function openApproveDialog({ id, permission, onSubmit }: { id: any; permission: any; onSubmit: any }) {
+    openFormDialog({
+      title: "审批加入申请",
+      columns: {
+        permission: {
+          title: "成员权限",
+          type: "dict-select",
+          dict: projectPermissionDict,
+        },
+        status: {
+          title: "审批结果",
+          type: "dict-radio",
+          dict: dict({
+            data: [
+              {
+                label: "通过",
+                value: "approved",
+              },
+              {
+                label: "拒绝",
+                value: "rejected",
+              },
+            ],
+          }),
+        },
+      },
+      onSubmit: onSubmit,
+      initialForm: {
+        id: id,
+        permission: permission,
+        status: "approved",
+      },
+    });
+  }
+
+  return {
+    openApproveDialog,
+  };
+}

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

@@ -16,19 +16,22 @@
                 <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 class="flex-col items-center">
+                <div>管理员： <fs-values-format :model-value="project.adminId" :dict="userDict"></fs-values-format></div>
+                <div class="flex items-center mt-2">
+                  <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 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)">
+              <span v-if="!project.status || project.status === 'rejected'" class="flex-inline items-center text-blue-500" :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)">
+              <span v-if="project.status === 'pending' || project.status === 'approved'" class="flex-inline items-center text-red-500" :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>
@@ -48,14 +51,13 @@ 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 { projectMemberStatusDict, projectPermissionDict, userDict } = useDicts();
 
 const projects = ref<any[]>([]);