From a9bab9f93a19aa5f99ef2b411f78210111a13262 Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Thu, 25 Apr 2024 00:51:05 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E7=B3=BB=E7=BB=9F=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/api/admin/setting/[[...path]]/route.ts    |  38 ++++-
 .../components/admin-setting-table.tsx        | 144 +++++++++++++++++-
 lib/auth.ts                                   |   2 +-
 3 files changed, 176 insertions(+), 8 deletions(-)

diff --git a/app/api/admin/setting/[[...path]]/route.ts b/app/api/admin/setting/[[...path]]/route.ts
index 5413ea07b..98d234c61 100644
--- a/app/api/admin/setting/[[...path]]/route.ts
+++ b/app/api/admin/setting/[[...path]]/route.ts
@@ -12,9 +12,45 @@ async function handle(
   // console.log('----', pathname, searchParams, params.path)
   if (method === "GET" && !params.path) {
     const all_setting = await prisma.setting.findMany();
-    console.log("all_setting,", all_setting);
+    // console.log("all_setting,", all_setting);
     return NextResponse.json({ result: all_setting });
   }
+  if (method === "POST" && !params.path) {
+    try {
+      const setting_instance = await prisma.setting.create({
+        data: await req.json(),
+      });
+      // console.log('-------', setting_instance)
+      return NextResponse.json({ result: setting_instance });
+    } catch (e) {
+      console.log("[insert setting] error,", e);
+    }
+  }
+
+  if (method === "PUT" && params.path) {
+    try {
+      const setting_key = params.path[0];
+      const setting_instance = await prisma.setting.update({
+        where: {
+          key: setting_key,
+        },
+        data: await req.json(),
+      });
+      return NextResponse.json({ result: setting_instance });
+    } catch {}
+  }
+
+  if (method === "DELETE" && params.path) {
+    try {
+      const setting_key = params.path[0];
+      const setting_instance = await prisma.setting.delete({
+        where: {
+          key: setting_key,
+        },
+      });
+      return NextResponse.json({ result: setting_instance });
+    } catch {}
+  }
 
   return NextResponse.json({ error: "当前方法不支持" }, { status: 405 });
 }
diff --git a/app/app/(admin)/components/admin-setting-table.tsx b/app/app/(admin)/components/admin-setting-table.tsx
index 0660e9e88..2ff3d7ab5 100644
--- a/app/app/(admin)/components/admin-setting-table.tsx
+++ b/app/app/(admin)/components/admin-setting-table.tsx
@@ -1,11 +1,101 @@
 "use client";
 import type { FormProps } from "antd";
-import { Button, Checkbox, Form, Input, Table } from "antd";
+import {
+  Button,
+  Checkbox,
+  Form,
+  Input,
+  Modal,
+  Space,
+  Table,
+  TableColumnsType,
+  Radio,
+  Flex,
+} from "antd";
 import { useEffect, useState } from "react";
 import { Setting } from "@prisma/client";
 
 function SettingForm() {
+  const [modal, contextHolder] = Modal.useModal();
+  const [form] = Form.useForm();
+
   const [setting, setSetting] = useState<Setting[]>([]);
+  const [isModalVisible, setIsModalVisible] = useState(false);
+  const openModal = () => setIsModalVisible(true);
+  const closeModal = () => setIsModalVisible(false);
+
+  const handleFormSubmit = async (record: Setting) => {
+    console.log("-------", record);
+  };
+
+  const handelDel = (record: Setting) => {
+    fetch(`/api/admin/setting/${record.key}`, {
+      method: "DELETE",
+      credentials: "include",
+    })
+      .then((response) => response.json())
+      .then((result) => {
+        console.log("删除成功，", result);
+      });
+  };
+
+  const handleEdit = (method: "POST" | "PUT", record: Setting | undefined) => {
+    modal.confirm({
+      title: "编辑设置",
+      content: (
+        <Form
+          form={form}
+          labelCol={{ span: 4 }}
+          wrapperCol={{ span: 18 }}
+          layout="horizontal"
+          initialValues={record}
+          preserve={false}
+        >
+          <Form.Item
+            name="key"
+            label="key"
+            rules={[{ required: true, message: "请输入key" }]}
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item
+            name="value"
+            label="value"
+            rules={[{ required: true, message: "请输入value" }]}
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item
+            name="type"
+            label="type"
+            rules={[{ required: true, message: "请输入type" }]}
+          >
+            <Radio.Group>
+              <Radio.Button value="string">string</Radio.Button>
+              <Radio.Button value="boolean">boolean</Radio.Button>
+              <Radio.Button value="number">number</Radio.Button>
+            </Radio.Group>
+          </Form.Item>
+        </Form>
+      ),
+      onOk: () => {
+        const setting_key = method === "PUT" ? record?.key : "";
+        form.validateFields().then((values) => {
+          console.log("提交，，，", values);
+          fetch(`/api/admin/setting/${setting_key}`, {
+            method: method,
+            credentials: "include",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(values),
+          })
+            .then((response) => response.json())
+            .then((result) => {
+              console.log("创建结果，", result);
+            });
+        });
+      },
+    });
+  };
 
   useEffect(() => {
     fetch("/api/admin/setting", {
@@ -18,7 +108,7 @@ function SettingForm() {
       });
   }, []);
 
-  const columns = [
+  const columns: TableColumnsType<Setting> = [
     {
       title: "key",
       dataIndex: "key",
@@ -37,14 +127,56 @@ function SettingForm() {
       dataIndex: "",
       key: "key",
       render: (_, record) => (
-        <>
-          <Button>编辑</Button>
-        </>
+        <Space size="small">
+          <a type="link" onClick={() => handleEdit("PUT", record)}>
+            编辑
+          </a>
+          <a type="link" onClick={() => handelDel(record)}>
+            删除
+          </a>
+        </Space>
       ),
     },
   ];
 
-  return <Table dataSource={setting} columns={columns} />;
+  return (
+    <>
+      <Flex vertical>
+        <Button type="link" onClick={() => handleEdit("POST", undefined)}>
+          创建
+        </Button>
+        <Table dataSource={setting} columns={columns} />
+      </Flex>
+      {contextHolder}
+    </>
+  );
 }
 
+// const EditFormModal = ({ visible, onClose, onSubmit, initialData }) => {
+//   const [formData, setFormData] = useState(initialData);
+//   const handleFormChange = (changeVlaue, allValues) => {
+//     setFormData(allValues);
+//   };
+//
+//   const handleSubmit = () => {
+//     onSubmit(formData);
+//     onClose();
+//   }
+//
+//   return (
+//       <Modal
+//           title="编辑设置"
+//           open={visible}
+//           onCancel={onClose}
+//           footer={[
+//               <Button key="cancel" onClick={onClose}>取消</Button>,
+//               <Button key="submit" type="primary" onClick={handleSubmit}>提交</Button>,
+//           ]}
+//       >
+// 123
+//       </Modal>
+//   )
+//
+// }
+
 export default SettingForm;
diff --git a/lib/auth.ts b/lib/auth.ts
index 88ae4396b..2060a20b6 100644
--- a/lib/auth.ts
+++ b/lib/auth.ts
@@ -219,7 +219,7 @@ async function getSetting(key: string) {
       key: key
     }
   })
-  console.log('setting,------', setting)
+  // console.log('setting,------', setting)
   if (!setting) {
     return null;
   }