网络状态

app/wails/frontend/components.d.ts

@@ -21,6 +21,7 @@ declare module 'vue' {
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
     MemoryUsage: typeof import('./src/components/system/memory/MemoryUsage.vue')['default']
     MemoryUsageChart: typeof import('./src/components/system/memory/MemoryUsageChart.vue')['default']
+    NetworkCounter: typeof import('./src/components/system/network/NetworkCounter.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     TabScaffold: typeof import('./src/components/scaffold/TabScaffold.vue')['default']

app/wails/frontend/src/components/system/network/NetworkCounter.vue

@@ -0,0 +1,27 @@
+<script setup>
+import {useNetworkSumCounter, useNetworkSumRate} from "src/utils/system/network";
+import {bytesToSizeWithUnit} from "src/utils/file/file";
+
+const networkSumCounter = useNetworkSumCounter()
+const networkSumRate = useNetworkSumRate()
+</script>
+
+<template>
+    <div>实时下载速度:</div>
+    <div> {{bytesToSizeWithUnit(networkSumRate.recv)}}/s </div>
+
+    <div>
+        接收: {{bytesToSizeWithUnit(networkSumCounter.bytesRecv || 0)}}
+    </div>
+
+    <div>实时上传速度:</div>
+    <div>{{bytesToSizeWithUnit(networkSumRate.sent)}}/s </div>
+
+    <div>
+        发送: {{bytesToSizeWithUnit(networkSumCounter.bytesSent || 0)}}
+    </div>
+</template>
+
+<style scoped>
+
+</style>

app/wails/frontend/src/utils/system/index.js

@@ -1,4 +1,4 @@
-import {GetCpuUsage, GetVirtualMemory} from "frontend/wailsjs/go/system/InfoUtils";
+import {GetCpuUsage, GetNetworkCounter, GetVirtualMemory} from "frontend/wailsjs/go/system/InfoUtils";
 import {computed, reactive, ref, watch} from "vue";
 import {asyncComputed} from "@vueuse/core";
 import {bytesToSizeWithUnit} from "src/utils/file/file";

app/wails/frontend/src/utils/system/network.ts

@@ -0,0 +1,53 @@
+import {computed, reactive} from "vue";
+import {net} from "frontend/wailsjs/go/models";
+import IOCountersStat = net.IOCountersStat;
+import {GetNetworkCounter} from "frontend/wailsjs/go/system/InfoUtils";
+
+let network = reactive({
+    counter: {
+        data: <IOCountersStat[]>[],
+        interval: <any>undefined
+    },
+    sumCounter: {
+        rate: {
+            recv: 0,
+            sent: 0,
+        },
+        data: <IOCountersStat>{},
+        interval: <any>undefined
+    }
+})
+
+
+function loopNetworkSumCounter(){
+    clearInterval(network.sumCounter.interval)
+    function loop(){
+        GetNetworkCounter(true).then(result=> {
+            network.sumCounter.rate.recv = result[0].bytesRecv - network.sumCounter.data.bytesRecv
+            network.sumCounter.rate.sent = result[0].bytesSent - network.sumCounter.data.bytesSent
+
+            network.sumCounter.data = result[0]
+        })
+        network.sumCounter.interval = setTimeout(()=>{
+            loop()
+        },1000)
+    }
+    loop()
+}
+
+
+export function useNetworkSumCounter(){
+    if(network.sumCounter.interval == null){
+        loopNetworkSumCounter()
+    }
+
+    return computed(()=> network.sumCounter.data)
+}
+
+export function useNetworkSumRate(){
+    if(network.sumCounter.interval == null){
+        loopNetworkSumCounter()
+    }
+
+    return computed(()=> network.sumCounter.rate)
+}

app/wails/frontend/src/views/tabs/home/Home.vue

@@ -44,6 +44,7 @@ import CPUUsage from "src/components/system/cpu/CPUUsage.vue";
 import MemoryUsage from "src/components/system/memory/MemoryUsage.vue";
 import CPUUsageChart from "src/components/system/cpu/CPUUsageChart.vue";
 import MemoryUsageChart from "src/components/system/memory/MemoryUsageChart.vue";
+import NetworkCounter from "src/components/system/network/NetworkCounter.vue";
 function switchLocale(){
     console.log(globalConfigState.ui.value.locale)
     if(globalConfigState.ui.value.locale.name === 'zh-cn'){
@@ -108,6 +109,9 @@ const generateData = (
                 </template>
             </MemoryUsage>
         </el-col>
+        <el-col :span="4">
+            <NetworkCounter></NetworkCounter>
+        </el-col>
     </el-row>
 
     <el-row>

app/wails/frontend/wailsjs/go/models.ts

@@ -299,6 +299,38 @@ export namespace net {
 		    return a;
 		}
 	}
+	export class IOCountersStat {
+	    name: string;
+	    bytesSent: number;
+	    bytesRecv: number;
+	    packetsSent: number;
+	    packetsRecv: number;
+	    errin: number;
+	    errout: number;
+	    dropin: number;
+	    dropout: number;
+	    fifoin: number;
+	    fifoout: number;
+	
+	    static createFrom(source: any = {}) {
+	        return new IOCountersStat(source);
+	    }
+	
+	    constructor(source: any = {}) {
+	        if ('string' === typeof source) source = JSON.parse(source);
+	        this.name = source["name"];
+	        this.bytesSent = source["bytesSent"];
+	        this.bytesRecv = source["bytesRecv"];
+	        this.packetsSent = source["packetsSent"];
+	        this.packetsRecv = source["packetsRecv"];
+	        this.errin = source["errin"];
+	        this.errout = source["errout"];
+	        this.dropin = source["dropin"];
+	        this.dropout = source["dropout"];
+	        this.fifoin = source["fifoin"];
+	        this.fifoout = source["fifoout"];
+	    }
+	}
 
 }
 

app/wails/frontend/wailsjs/go/system/InfoUtils.d.ts

@@ -24,6 +24,8 @@ export function GetIOCounters():Promise<{[key: string]: disk.IOCountersStat}>;
 
 export function GetNetWorkConnection():Promise<Array<net.ConnectionStat>>;
 
+export function GetNetworkCounter(arg1:boolean):Promise<Array<net.IOCountersStat>>;
+
 export function GetProcessInfo(arg1:number):Promise<system.ProcessDTO>;
 
 export function GetProcesses():Promise<Array<system.ProcessDTO>>;

app/wails/frontend/wailsjs/go/system/InfoUtils.js

@@ -38,6 +38,10 @@ export function GetNetWorkConnection() {
   return window['go']['system']['InfoUtils']['GetNetWorkConnection']();
 }
 
+export function GetNetworkCounter(arg1) {
+  return window['go']['system']['InfoUtils']['GetNetworkCounter'](arg1);
+}
+
 export function GetProcessInfo(arg1) {
   return window['go']['system']['InfoUtils']['GetProcessInfo'](arg1);
 }

app/wails/pkg/system/network.go

@@ -6,3 +6,8 @@ func (i *InfoUtils) GetNetWorkConnection() []net.ConnectionStat {
 	info, _ := net.Connections("all")
 	return info
 }
+
+func (i *InfoUtils) GetNetworkCounter(all bool) []net.IOCountersStat {
+	info, _ := net.IOCounters(!all)
+	return info
+}