diff --git a/src/components/settings/LibrarySettings.vue b/src/components/settings/LibrarySettings.vue
index 192477e..bd77985 100644
--- a/src/components/settings/LibrarySettings.vue
+++ b/src/components/settings/LibrarySettings.vue
@@ -1,15 +1,248 @@
 <template>
-  <div class="text-center">
+  <div class="text-center" v-if="libraryStore.libraries?.length === 0">
     <n-icon class="text-7xl">
       <DocumentOutline />
     </n-icon>
     <p>Amber 可以索引您的文档中的内容</p>
-    <div  class="mt-3 mb-2">
-      <n-button>创建</n-button>
+    <div class="mt-3 mb-2">
+      <n-button @click="showCreateLibraryDialog = true">创建</n-button>
     </div>
   </div>
+
+  <div v-else>
+    <div class="mb-3">
+      <n-button tertiary @click="showCreateLibraryDialog = true">
+        新建资料库
+      </n-button>
+    </div>
+    <!-- 资料库列表 -->
+    <n-list hoverable clickable>
+      <n-list-item
+        v-for="c in libraryStore.libraries"
+        :key="c.id"
+        @click.stop="showEditDialog(c)"
+      >
+        <n-thing>
+          <div class="flex justify-between items-center">
+            <div class="truncate block">
+              {{ c.name }}
+            </div>
+            <div>
+              <n-button
+                quaternary
+                circle
+                type="info"
+                @click.stop="showEditDialog(c)"
+              >
+                <template #icon>
+                  <n-icon size="16" class="cursor-pointer">
+                    <SettingsOutline />
+                  </n-icon>
+                </template>
+              </n-button>
+            </div>
+          </div>
+        </n-thing>
+      </n-list-item>
+    </n-list>
+  </div>
+
+  <!-- 创建 -->
+  <n-drawer
+    placement="left"
+    v-model:show="showCreateLibraryDialog"
+    :width="drawerWidth"
+  >
+    <n-drawer-content closable title="创建资料库">
+      <div v-if="currentLibrary">
+        <n-form>
+          <n-form-item label="资料库名称">
+            <n-input
+              v-model:value="createLibrary.name"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-form-item label="描述资料库">
+            <n-input
+              v-model:value="createLibrary.description"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-button type="primary" @click="newLibrary"> 创建 </n-button>
+        </n-form>
+      </div>
+    </n-drawer-content>
+  </n-drawer>
+
+  <!-- 填写文档 -->
+  <n-drawer
+    placement="left"
+    v-model:show="showCreateDocumentDialog"
+    :width="drawerWidth"
+  >
+    <n-drawer-content closable title="新建文档">
+      <div v-if="currentLibrary">
+        <n-form>
+          <n-form-item label="文档名称">
+            <n-input
+              v-model:value="createDocument.name"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-form-item label="文档内容">
+            <n-input
+              type="textarea"
+              v-model:value="createDocument.content"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-button type="primary" @click="newDocument"> 创建 </n-button>
+        </n-form>
+      </div>
+    </n-drawer-content>
+  </n-drawer>
+
+  <!-- 编辑 -->
+  <n-drawer
+    placement="left"
+    v-model:show="showEditLibraryDialog"
+    :width="drawerWidth"
+  >
+    <n-drawer-content closable title="编辑资料库">
+      <div v-if="currentLibrary">
+        <n-form>
+          <n-form-item label="资料库名称">
+            <n-input
+              v-model:value="currentLibrary.name"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-form-item label="描述资料库">
+            <n-input
+              v-model:value="currentLibrary.description"
+              @keydown.enter.prevent
+            />
+          </n-form-item>
+
+          <n-form-item label="描述资料库">
+            默认？
+            <n-switch v-model:value="currentLibrary.default" />
+          </n-form-item>
+
+          <n-space>
+            <n-button type="primary" @click="updateLibrary"> 更新 </n-button>
+
+            <n-popconfirm @positive-click="remove(currentLibrary.id ?? 0)">
+              <template #trigger>
+                <n-button class="ml-10" type="warning"> 删除 </n-button>
+              </template>
+              删除后，将无法恢复
+            </n-popconfirm>
+          </n-space>
+        </n-form>
+      </div>
+      <n-divider />
+
+      <div>
+        <div class="mt-3 mb-2">
+          <n-button @click="showCreateDocumentDialog = true">上传文档</n-button>
+        </div>
+      </div>
+    </n-drawer-content>
+  </n-drawer>
 </template>
 
 <script lang="ts" setup>
-import { DocumentOutline } from "@vicons/ionicons5";
+import {
+  EntityDocument,
+  EntityLibrary,
+  SchemaDocumentCreateRequest,
+} from "@/api";
+import getApi from "@/plugins/api";
+import { useLibraryStore } from "@/stores/libraries";
+import { useIsMobile } from "@/utils/composables";
+import {
+  TrashBinOutline,
+  SettingsOutline,
+  DocumentOutline,
+} from "@vicons/ionicons5";
+import { AxiosError } from "axios";
+import { useMessage } from "naive-ui";
+
+const libraryStore = useLibraryStore();
+const showCreateLibraryDialog = ref(false);
+const showEditLibraryDialog = ref(false);
+const showCreateDocumentDialog = ref(false);
+const currentLibrary: Ref<EntityLibrary> = ref({});
+const createLibrary: Ref<EntityLibrary> = ref({});
+const isMobile = useIsMobile();
+const message = useMessage();
+const drawerWidth = computed(() => {
+  if (isMobile.value) {
+    return window.innerWidth;
+  } else {
+    return window.innerWidth * 0.6;
+  }
+});
+const createDocument: Ref<SchemaDocumentCreateRequest> = ref({
+  name: "",
+  content: "",
+});
+const libraryDocuments: Ref<EntityDocument[]> = ref([]);
+const showEditDialog = (library: EntityLibrary) => {
+  currentLibrary.value = library;
+  showEditLibraryDialog.value = true;
+};
+const updateLibrary = async () => {
+  if (currentLibrary.value.id) {
+    await getApi().Library.apiV1LibrariesIdPut(currentLibrary.value.id, {
+      name: currentLibrary.value.name ?? "",
+      description: currentLibrary.value.description ?? "",
+      default: currentLibrary.value.default ?? false,
+    });
+  }
+};
+
+const newLibrary = async () => {
+  if (createLibrary.value.name) {
+    await getApi()
+      .Library.apiV1LibrariesPost({
+        name: createLibrary.value.name,
+        description: createLibrary.value.description,
+      })
+      .then((r) => {
+        showCreateLibraryDialog.value = false;
+      })
+      .catch((e: AxiosError) => {
+        // @ts-ignore ...
+        message.error(e.response?.data.message ?? "创建失败");
+      })
+      .finally(() => {
+        libraryStore.updateLibraries();
+      });
+  }
+};
+
+const remove = async (id: number) => {
+  await getApi().Library.apiV1LibrariesIdDelete(id);
+  libraryStore.updateLibraries();
+};
+
+const newDocument = async () => {
+  if (currentLibrary.value.id) {
+    await getApi().Library.apiV1LibrariesIdDocumentsPost(
+      currentLibrary.value.id,
+      createDocument.value
+    );
+  }
+};
+
+onMounted(() => {
+  libraryStore.updateLibraries();
+});
 </script>
diff --git a/src/components/settings/MemorySettings.vue b/src/components/settings/MemorySettings.vue
index 6856693..5291554 100644
--- a/src/components/settings/MemorySettings.vue
+++ b/src/components/settings/MemorySettings.vue
@@ -27,7 +27,7 @@
             <div>
               <n-popconfirm @positive-click="deleteMemory(c)">
                 <template #trigger>
-                  <n-button quaternary circle type="info">
+                  <n-button quaternary circle type="warning">
                     <template #icon>
                       <n-icon size="16" class="cursor-pointer">
                         <TrashBinOutline />
diff --git a/src/components/settings/ToolSettings.vue b/src/components/settings/ToolSettings.vue
index 302711b..20b10dc 100644
--- a/src/components/settings/ToolSettings.vue
+++ b/src/components/settings/ToolSettings.vue
@@ -22,7 +22,7 @@
             <div>
               <n-popconfirm @positive-click="remove(c.id ?? 0)">
                 <template #trigger>
-                  <n-button quaternary circle type="info">
+                  <n-button quaternary circle type="warning">
                     <template #icon>
                       <n-icon size="16" class="cursor-pointer">
                         <TrashBinOutline />
diff --git a/src/stores/libraries.ts b/src/stores/libraries.ts
new file mode 100644
index 0000000..bcbcd9d
--- /dev/null
+++ b/src/stores/libraries.ts
@@ -0,0 +1,19 @@
+import { defineStore } from "pinia";
+import { EntityLibrary } from "../api";
+import getApi from "@/plugins/api";
+
+export const useLibraryStore = defineStore("libraries", {
+  persist: false,
+  state: () => ({
+    libraries: <EntityLibrary[] | undefined>[],
+  }),
+  actions: {
+    updateLibraries() {
+      getApi()
+        .Library.apiV1LibrariesGet()
+        .then((r) => {
+          this.libraries = r.data.data ?? [];
+        });
+    },
+  },
+});