Set server and fetch client occassionally

2022-11-26 22:17:05 +08:00 · 2022-11-26 22:17:05 +08:00 · f32c3d09ce
parent 25951d19fd
commit f32c3d09ce
8 changed files with 70 additions and 91 deletions
--- a/app.go
+++ b/app.go
@ -22,8 +22,8 @@ func (a *App) startup(ctx context.Context) {
 	// Perform your setup here
 	// 在这里执行初始化设置
 	a.ctx = ctx
-	internal.Connect()
-	internal.DoHelo()
+	// internal.Connect("")
+	// internal.DoHelo()
 }

 // domReady is called after the front-end dom has been loaded
@ -68,3 +68,9 @@ func (a *App) FetchClients() []string {
 func (a *App) SendMessage(to string, content string) {
 	internal.DoSend(content, to)
 }
+
+func (a *App) SetIP(ip string) {
+	internal.DoExit()
+	internal.Connect(ip)
+	internal.DoHelo()
+}
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from "vue-i18n";
-import { NH1, NLayout, NLayoutContent, NLayoutHeader, NLayoutSider, NP, NConfigProvider, useOsTheme, darkTheme } from 'naive-ui'
+import { NH1, NLayout, NLayoutContent, NLayoutHeader, NLayoutSider, NP, NConfigProvider, useOsTheme, darkTheme, NMessageProvider } from 'naive-ui'
 import ConversationItemVue from "./components/ConversationItem.vue";
 import SiderVue from "./components/Sider.vue";
 const { t, availableLocales: languages, locale } = useI18n();
@ -24,21 +24,23 @@ document.body.addEventListener("click", function (event) {

  <body class="h-screen overflow-y-hidden">
    <n-config-provider :theme="theme">
-      <n-layout>
-        <n-layout-header class="h-16">
-          <n-h1 prefix="bar" class="m-4">
-            Socket Chatroom
-          </n-h1>
-        </n-layout-header>
-        <n-layout has-sider>
-          <n-layout-sider class="h-screen overflow-y-scroll">
-            <sider-vue />
-          </n-layout-sider>
-          <n-layout-content class="h-screen overflow-y-hidden">
-            <router-view class="h-screen" />
-          </n-layout-content>
+      <n-message-provider>
+        <n-layout>
+          <n-layout-header class="h-16">
+            <n-h1 prefix="bar" class="m-4">
+              Socket Chatroom
+            </n-h1>
+          </n-layout-header>
+          <n-layout has-sider>
+            <n-layout-sider class="h-screen overflow-y-scroll">
+              <sider-vue />
+            </n-layout-sider>
+            <n-layout-content class="h-screen overflow-y-hidden">
+              <router-view class="h-screen" />
+            </n-layout-content>
+          </n-layout>
        </n-layout>
-      </n-layout>
+      </n-message-provider>
    </n-config-provider>
  </body>
 </template>
--- a/frontend/src/components/Sider.vue
+++ b/frontend/src/components/Sider.vue
@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router';
 import ConversationItemVue from './ConversationItem.vue';
-import { reactive, ref } from 'vue';
+import { reactive, ref, onMounted } from 'vue';
+import { FetchClients } from '../../wailsjs/go/main/App';
 const users = reactive([
    "10.0.0.1",
    "10.0.0.2",
@ -19,10 +20,20 @@ const users = reactive([
 ])
 const router = useRouter();

+onMounted(async () => {
+    // fetch clients every 5 seconds
+    setInterval(async () => {
+        console.log("Fetching clients");
+        const clients = await FetchClients();
+        users.splice(0, users.length, ...clients);
+    }, 5000);
+
+});
+
 </script>

 <template>
-    <div class="h-full overflow-y-scroll">
+    <div class="h-full">
        <div v-for="user in users" :key="user">
            <conversation-item-vue :name="user" @nav-to-conversation="(dest) => router.push('/conversation/' + dest)" />
        </div>
--- a/frontend/src/views/HomeView.vue
+++ b/frontend/src/views/HomeView.vue
@ -1,77 +1,24 @@
 <script setup lang="ts">
-import { useI18n } from "vue-i18n";
+import { ref } from "vue";
+import { NInput, NButton, useMessage,NH1,NP,NA } from "naive-ui";
+import { SetIP } from "../../wailsjs/go/main/App";

-import HelloWorld from "@/components/HelloWorld.vue";
+const serverIP = ref("")
+const message = useMessage()

-const { t } = useI18n();
+function setIP() {
+  SetIP(serverIP.value)
+  console.log("Trying to set server IP", serverIP.value);
+  message.success("设置成功")
+}
 </script>

 <template>
-  <div class="home">
-    <!-- Logo -->
-    <img class="logo" alt="Vue logo" src="../assets/logo.png" />
-    <HelloWorld :msg="t('homepage.welcome')" />
-    <!-- Bottom button -->
-    <div class="link">
-      <a
-        href="https://wails.io/docs/gettingstarted/installation"
-        class="btn start"
-        >{{ t("homepage.getting-started") }}</a
-      >
-      <a
-        href="https://github.com/misitebao/wails-template-vue"
-        class="btn star"
-        >{{ t("homepage.star-me") }}</a
-      >
+    <div class="w-1/3 absolute left-1/2 top-1/2 mt-20 translate-x-[-50%] translate-y-[-50%] justify-center">
+      <n-h1>请设定服务器 IP 地址</n-h1>
+      <n-input v-model:value="serverIP" type="text" placeholder="服务器地址" />
+      <div class="h-3" />
+      <n-button secondary type="primary" @click="setIP()">设定</n-button>
+      <n-p>by @cyp0633, <n-a href="https://github.com/cyp0633/socket-chatroom">GitHub</n-a></n-p>
    </div>
-    <router-link to="/conversation/0:0:0:0">前往 Conversation</router-link>
-  </div>
 </template>
-
-<style lang="scss">
-.home {
-  .logo {
-    display: block;
-    width: 620px;
-    height: 280px;
-    margin: 10px auto 10px;
-  }
-  .link {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    align-items: center;
-    justify-content: center;
-    margin: 18px auto;
-    .btn {
-      display: block;
-      width: 150px;
-      height: 50px;
-      line-height: 50px;
-      padding: 0 5px;
-      margin: 0 30px;
-      border-radius: 8px;
-      text-align: center;
-      font-weight: 700;
-      font-size: 16px;
-      white-space: nowrap;
-      text-decoration: none;
-      cursor: pointer;
-      &.start {
-        background-color: #fd0404;
-        color: #ffffff;
-        &:hover {
-          background-color: #ec2e2e;
-        }
-      }
-      &.star {
-        background-color: #ffffff;
-        color: #fd0404;
-        &:hover {
-          background-color: #f3f3f3;
-        }
-      }
-    }
-  }
-}
-</style>
--- a/frontend/wailsjs/go/main/App.d.ts
+++ b/frontend/wailsjs/go/main/App.d.ts
@ -7,3 +7,5 @@ export function FetchClients():Promise<Array<string>>;
 export function FetchMessages(arg1:string):Promise<Array<internal.Message>>;

 export function SendMessage(arg1:string,arg2:string):Promise<void>;
+
+export function SetIP(arg1:string):Promise<void>;
--- a/frontend/wailsjs/go/main/App.js
+++ b/frontend/wailsjs/go/main/App.js
@ -13,3 +13,7 @@ export function FetchMessages(arg1) {
 export function SendMessage(arg1, arg2) {
  return window['go']['main']['App']['SendMessage'](arg1, arg2);
 }
+
+export function SetIP(arg1) {
+  return window['go']['main']['App']['SetIP'](arg1);
+}
--- a/go.mod
+++ b/go.mod
@ -4,6 +4,7 @@ go 1.18

 require (
 	github.com/robfig/cron/v3 v3.0.1
+	github.com/seancfoley/ipaddress-go v1.4.1
 	github.com/wailsapp/wails/v2 v2.2.0
 	go.uber.org/zap v1.23.0
 )
@ -26,7 +27,6 @@ require (
 	github.com/rivo/uniseg v0.4.3 // indirect
 	github.com/samber/lo v1.35.0 // indirect
 	github.com/seancfoley/bintree v1.1.0 // indirect
-	github.com/seancfoley/ipaddress-go v1.4.1 // indirect
 	github.com/tkrajina/go-reflector v0.5.6 // indirect
 	github.com/valyala/bytebufferpool v1.0.0 // indirect
 	github.com/valyala/fasttemplate v1.2.2 // indirect
--- a/internal/protocol.go
+++ b/internal/protocol.go
@ -12,8 +12,11 @@ import (
 var conn *net.Conn

 // 尝试连接服务器
-func Connect() {
-	c, err := net.DialTimeout("tcp", "localhost:65432", 2*time.Second)
+func Connect(ip string) {
+	if ip == "" {
+		ip = "127.0.0.1"
+	}
+	c, err := net.DialTimeout("tcp", ip+":65432", 2*time.Second)
 	if err != nil {
 		Logger.Panic("Failed to connect to server", zap.Error(err))
 	}
@ -110,6 +113,10 @@ func DoPull() {
 var exitRegex = regexp.MustCompile(`^OK`)

 func DoExit() {
+	if conn == nil {
+		Logger.Info("Trying to connect a closed connection")
+		return
+	}
 	c := *conn
 	str := "EXIT"
 	_, err := c.Write([]byte(str))