add ai delete

2026-03-31 16:43:40 +08:00 · 2025-05-29 17:09:29 +08:00
parent 55884bb1a1
commit 10bee7c656
14 changed files with 355 additions and 17 deletions
--- a/frontend/src/views/AiChatView.vue
+++ b/frontend/src/views/AiChatView.vue
@@ -17,12 +17,21 @@
            <div class="markdown-content markdown-body text-base font-normal py-2.5 text-gray-900 "
              v-html="renderMarkdown(chatElement.content)">
            </div>
-            <button v-if="chatElement.type === 'action' && chatElement.command" type="button"
-              @click="commandActionMap[chatElement.command!]"
+            <button
+              v-if="chatElement.type === 'action' && (chatElement.command === 'CREATE_USER' || chatElement.command === 'CREATE_DEPARTMENT')"
+              type="button" @click="commandActionMap[chatElement.command!]"
              class="px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
              {{
              commandContentMap[chatElement.command!]
              }}</button>
+            <InputButton
+              bgColor="bg-red-700 hover:bg-red-800 focus:ring-red-300 text-white focus:ring-4 focus:outline-none"
+              size="sm" :content="commandContentMap[chatElement.command!]" :handleSubmit="handleDeleteUserClick"
+              v-if="chatElement.command === 'DELETE_USER'" />
+            <InputButton
+              bgColor="bg-red-700 hover:bg-red-800 focus:ring-red-300 text-white focus:ring-4 focus:outline-none"
+              size="sm" :content="commandContentMap[chatElement.command!]" :handleSubmit="handleDeleteDepartmentClick"
+              v-if="chatElement.command === 'DELETE_DEPARTMENT'" />
          </div>
        </div>
      </li>
@@ -54,6 +63,24 @@
            帮我创建用户?
          </span>
        </button>
+        <button @click.prevent="() => handleSendClick('删除用户', true)" class=" inline-flex items-center justify-center p-0.5
+          mb-2 me-2 overflow-hidden font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-500
+          to-pink-500 group-hover:from-purple-500 group-hover:to-pink-500 hover:text-white dark:text-white focus:ring-4
+          focus:outline-none focus:ring-purple-200 cursor-pointer dark:focus:ring-purple-800">
+          <span
+            class="px-3 py-2 text-xs transition-all ease-in duration-75 bg-white dark:bg-gray-900 rounded-md group-hover:bg-transparent group-hover:dark:bg-transparent">
+            删除用户
+          </span>
+        </button>
+        <button @click.prevent="() => handleSendClick('删除部门', true)" class=" inline-flex items-center justify-center p-0.5
+          mb-2 me-2 overflow-hidden font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-500
+          to-pink-500 group-hover:from-purple-500 group-hover:to-pink-500 hover:text-white dark:text-white focus:ring-4
+          focus:outline-none focus:ring-purple-200 cursor-pointer dark:focus:ring-purple-800">
+          <span
+            class="px-3 py-2 text-xs transition-all ease-in duration-75 bg-white dark:bg-gray-900 rounded-md group-hover:bg-transparent group-hover:dark:bg-transparent">
+            删除部门
+          </span>
+        </button>
        <button @click.prevent="() => handleSendClick('请帮我创建部门', true)" class="inline-flex items-center justify-center p-0.5 mb-2 me-2 overflow-hidden font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-500 to-pink-500 group-hover:from-purple-500 group-hover:to-pink-500 hover:text-white dark:text-white focus:ring-4 focus:outline-none focus:ring-purple-200 
        cursor-pointer dark:focus:ring-purple-800">
          <span
@@ -99,11 +126,19 @@
    userUpsertModal!.hide();
  }">
  </UserUpsertModal>
+  <UserDeleteModal :id="'user-delete-modal'" :closeModal="() => {
+    currentDeleteUsername = undefined
+    userDeleteModal!.hide();
+  }" :onSubmit="handleDeleteUserSubmit" title="确定删除该用户吗" content="删除用户"></UserDeleteModal>
  <DepartmentUpsertModal :id="'department-upsert-modal'" :onSubmit="handleUpsertDepartmentSubmit" :closeModal="() => {
    availableDepartments = undefined
    departmentUpsertModal!.hide();
  }" :availableDepartments="availableDepartments">
  </DepartmentUpsertModal>
+  <DepartmentDeleteModal :id="'department-delete-modal'" :closeModal="() => {
+    currentDeleteDepartmentName = undefined
+    departmentDeleteModal!.hide();
+  }" :onSubmit="handleDeleteDepartmentSubmit" title="确定删除该部门吗" content="删除部门"></DepartmentDeleteModal>
 </template>

 <script setup lang="ts">
@@ -124,6 +159,10 @@ import type { UserUpsertSubmitModel } from "../types/user";
 import { useDepartmentQuery } from "@/composables/department/useDepartmentQuery";
 import { useDepartmentUpsert } from "@/composables/department/useDepartmentUpsert";
 import type { DepartmentUpsertModel } from "@/types/department";
+import UserDeleteModal from "@/components/PopupModal.vue";
+import { useAiAction } from "@/composables/ai/useAiAction";
+import DepartmentDeleteModal from "@/components/PopupModal.vue";
+import InputButton from "@/components/InputButton.vue";

 const { messages, chat, isLoading, cancel, actionChat } = useAiChat();
 const { user } = useUserStore();
@@ -135,6 +174,11 @@ const alertStore = useAlertStore();
 const isCommandMode = ref(false);
 const userUpsert = useUserUpsert();
 const departmentUpsert = useDepartmentUpsert();
+const userDeleteModal = ref<ModalInterface>();
+const { deleteUserByUsername, deleteDepartmentByName } = useAiAction();
+const departmentDeleteModal = ref<ModalInterface>();
+const currentDeleteUsername = ref<string>();
+const currentDeleteDepartmentName = ref<string>();

 const { availableDepartments, fetchAvailableDepartments } =
 	useDepartmentQuery();
@@ -147,11 +191,19 @@ const commandActionMap: Record<string, () => void> = {
 		fetchAvailableDepartments();
 		departmentUpsertModal.value?.show();
 	},
+	DELETE_USER: () => {
+		userDeleteModal.value?.show();
+	},
+	DELETE_DEPARTMENT: () => {
+		departmentDeleteModal.value?.show();
+	},
 };

 const commandContentMap: Record<string, string> = {
 	CREATE_USER: "创建用户",
 	CREATE_DEPARTMENT: "创建部门",
+	DELETE_USER: "删除用户",
+	DELETE_DEPARTMENT: "删除部门",
 };

 const toggleMode = () => {
@@ -184,6 +236,20 @@ const renderMarkdown = (content: string | undefined) => {
 //   console.log('处理后HTML:', renderMarkdown(newVal[newVal.length - 1]));
 // }, { deep: true });

+const handleDeleteUserClick = (input: string) => {
+	currentDeleteUsername.value = input;
+	nextTick(() => {
+		userDeleteModal.value?.show();
+	});
+};
+
+const handleDeleteDepartmentClick = (input: string) => {
+	currentDeleteDepartmentName.value = input;
+	nextTick(() => {
+		departmentDeleteModal.value?.show();
+	});
+};
+
 const handleUpsertUserSubmit = async (data: UserUpsertSubmitModel) => {
 	await userUpsert.upsertUser(data);
 	userUpsertModal.value?.hide();
@@ -204,6 +270,24 @@ const handleUpsertDepartmentSubmit = async (
 	});
 };

+const handleDeleteUserSubmit = async () => {
+	await deleteUserByUsername(currentDeleteUsername.value!);
+	userDeleteModal.value?.hide();
+	alertStore.showAlert({
+		content: "操作成功",
+		level: "success",
+	});
+};
+
+const handleDeleteDepartmentSubmit = async () => {
+	await deleteDepartmentByName(currentDeleteDepartmentName.value!);
+	departmentDeleteModal.value?.hide();
+	alertStore.showAlert({
+		content: "操作成功",
+		level: "success",
+	});
+};
+
 watch(
 	messages,
 	async () => {
@@ -266,6 +350,24 @@ onMounted(async () => {
 			id: "user-upsert-modal",
 		},
 	);
+	const $userDeleteModalElement: HTMLElement | null =
+		document.querySelector("#user-delete-modal");
+	userDeleteModal.value = new Modal(
+		$userDeleteModalElement,
+		{},
+		{
+			id: "user-delete-modal",
+		},
+	);
+	const $departmentDeleteModalElement: HTMLElement | null =
+		document.querySelector("#department-delete-modal");
+	departmentDeleteModal.value = new Modal(
+		$departmentDeleteModalElement,
+		{},
+		{
+			id: "department-delete-modal",
+		},
+	);
 	const $departmentUpsertModalElement: HTMLElement | null =
 		document.querySelector("#department-upsert-modal");
 	departmentUpsertModal.value = new Modal(
--- a/frontend/src/views/UserView.vue
+++ b/frontend/src/views/UserView.vue
@@ -114,8 +114,8 @@
                  <span>编辑</span>
                </button>
                <button class="flex items-center justify-center whitespace-nowrap gap-x-1
-              bg-red-700 hover:bg-red-800 focus:outline-none focus:ring-red-300  
-                text-white focus:ring-4 focus:outline-nonefont-medium rounded-lg text-sm px-4 py-2.5"
+              bg-red-700 hover:bg-red-800 focus:ring-red-300  
+                text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-4 py-2.5"
                  @click="handleDeleteUserClick(user)" type="button">
                  <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                    <path fill-rule="evenodd"