feat: refine createchannel

frog-software · Jan 28, 2024 · 0a855c0 · 0a855c0
1 parent 5a98c48
commit 0a855c0
Show file tree

Hide file tree

Showing 2 changed files with 67 additions and 53 deletions.
diff --git a/src/routes/createChannel.svelte b/src/routes/createChannel.svelte
@@ -9,13 +9,17 @@
   let isLoading = false; // 新增：用于跟踪提交状态
 
   async function handleCreate() {
-    isLoading = true; 
+    isLoading = true;
 
     // 检查频道名是否已存在
-    const existingChannels = await pb.collection("channels").getFullList({filter: `channelName = "${channelName}"`});
+    const existingChannels = await pb
+      .collection("channels")
+      .getFullList({ filter: `channelName = "${channelName}"` });
     if (existingChannels.length > 0) {
-      alert("A channel with this name already exists. Please choose a different name.");
-      isLoading = false;  
+      alert(
+        "A channel with this name already exists. Please choose a different name.",
+      );
+      isLoading = false;
       return;
     }
 
@@ -27,11 +31,11 @@
     try {
       const createdChannel = await pb.collection("channels").create(data);
       alert("Channel created successfully");
-      isLoading = false;  
+      isLoading = false;
       push("/main");
     } catch (error) {
       alert("ERROR: " + error.message);
-      isLoading = false;  
+      isLoading = false;
     }
   }
 </script>
@@ -40,10 +44,19 @@
 
 <form on:submit|preventDefault={handleCreate} class="channel-form">
   <div class="form-group">
-    <input type="text" bind:value={channelName} placeholder="Channel Name" class="form1-control" />
+    <input
+      type="text"
+      bind:value={channelName}
+      placeholder="Channel Name"
+      class="form1-control"
+    />
   </div>
   <div class="form-group">
-    <textarea bind:value={channelDescription} placeholder="Channel Description" class="form-control"></textarea>
+    <textarea
+      bind:value={channelDescription}
+      placeholder="Channel Description"
+      class="form-control"
+    ></textarea>
   </div>
   {#if isLoading}
     <p>Loading...</p>
@@ -53,50 +66,50 @@
 </form>
 
 <style>
-.channel-form {
-  max-width: 500px;
-  margin: auto;
-  padding: 20px;
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-}
+  .channel-form {
+    max-width: 500px;
+    margin: auto;
+    padding: 20px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  }
 
-.form-group {
-  margin-bottom: 15px;
-}
-.form1-control {
-  max-width: 500px;
-  max-height: 200px;
-  width: 100%;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  box-sizing: border-box;
-}
-.form-control {
-  max-width: 500px;
-  max-height: 200px;
-  min-width: 300px;
-  min-height: 100px;
-  width: 100%;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  box-sizing: border-box;
-}
+  .form-group {
+    margin-bottom: 15px;
+  }
+  .form1-control {
+    max-width: 500px;
+    max-height: 200px;
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    box-sizing: border-box;
+  }
+  .form-control {
+    max-width: 500px;
+    max-height: 200px;
+    min-width: 300px;
+    min-height: 100px;
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    box-sizing: border-box;
+  }
 
-.btn-submit {
-  margin: auto;
-  width: 100%;
-  padding: 10px;
-  border: none;
-  background-color: #007bff;
-  color: white;
-  border-radius: 4px;
-  cursor: pointer;
-  transition: background-color 0.3s;
-}
+  .btn-submit {
+    margin: auto;
+    width: 100%;
+    padding: 10px;
+    border: none;
+    background-color: #007bff;
+    color: white;
+    border-radius: 4px;
+    cursor: pointer;
+    transition: background-color 0.3s;
+  }
 
-.btn-submit:hover {
-  background-color: #0056b3;
-}
-</style>
+  .btn-submit:hover {
+    background-color: #0056b3;
+  }
+</style>
diff --git a/src/routes/searchChannel.svelte b/src/routes/searchChannel.svelte
@@ -56,7 +56,8 @@
     {#each searchResults as channel}
       <li>
         <strong>{channel.channelName}</strong>
-        <button on:click={() => ToChannel(channel.channelName)}>访问频道</button>
+        <button on:click={() => ToChannel(channel.channelName)}>访问频道</button
+        >
       </li>
     {/each}
   </ul>