结构调整

app/wails/frontend/package.json.md5

@@ -1 +1 @@
-65a151a5092c94d18dcc017ea27c6d61
+d09bd561bfdf7ff46efd368fe8aa4abe

app/wails/frontend/src/components/system/cpu/CPUUsage.vue

@@ -1,5 +1,5 @@
 <script setup>
-import {useCpuUsage} from "src/utils/system";
+import {useCpuUsage} from "src/utils/system/cpu";
 import {computed} from "vue";
 const props = defineProps({
     showLabel: {

app/wails/frontend/src/components/system/cpu/CPUUsageChart.vue

@@ -1,5 +1,5 @@
 <script setup>
-import {useCpuUsage} from "src/utils/system";
+import {useCpuUsage} from "src/utils/system/cpu";
 import {computed, onMounted, reactive, ref, watch} from "vue";
 import * as echarts from "echarts";
 import moment from "moment";
@@ -65,7 +65,6 @@ const chart = reactive({
     },
     yAxis: {
         type: 'value',
-        boundaryGap: [0, '100%'],
         splitLine: {
             show: false
         },

app/wails/frontend/src/components/system/memory/MemoryUsage.vue

@@ -1,5 +1,5 @@
 <script setup>
-import {useMemoryTotalSize, useMemoryUsage, useMemoryUsageSize} from "src/utils/system";
+import {useMemoryTotalSize, useMemoryUsage, useMemoryUsageSize} from "src/utils/system/memory";
 const props = defineProps({
     showLabel: {
         default: true

app/wails/frontend/src/components/system/memory/MemoryUsageChart.vue

@@ -1,11 +1,8 @@
 <script setup>
 import {
-    useCpuUsage,
+    useMemoryTotalSizeWithByte,
-    useMemoryTotalSize, useMemoryTotalSizeWithByte,
-    useMemoryUsage,
-    useMemoryUsageSize,
     useMemoryUsageSizeWithByte
-} from "src/utils/system";
+} from "src/utils/system/memory";
 import {computed, onMounted, reactive, ref, watch} from "vue";
 import * as echarts from "echarts";
 import moment from "moment";
@@ -40,9 +37,6 @@ const props = defineProps({
 })
 const memoryTotal = useMemoryTotalSizeWithByte()
 const memoryUsage = useMemoryUsageSizeWithByte()
-const singleUsage = computed(()=>{
-    return memoryUsage.value || 0
-})
 const colors = [
     { color: '#f56c6c', percentage: 100 },
     { color: '#e6a23c', percentage: 80 },
@@ -139,7 +133,7 @@ onMounted(()=>{
     chartInst.setOption(chart)
     chartInst.resize()
 
-    watch(singleUsage,(v)=>{
+    watch(memoryUsage,(v)=>{
         chart.visualMap = getVisualMap()
         let data = chart.series[0].data
         data.push({

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

@@ -15,7 +15,7 @@ const props = defineProps({
     },
     labelPosition :{
         type: String,
-        default: "center",
+        default: "85",
     },
     labelStyle: {
         type: Object,
@@ -118,7 +118,7 @@ onMounted(()=>{
     chartInst.setOption(chart)
     chartInst.resize()
 
-    watch(netWorkSumRate.value,(v)=>{
+    watch(netWorkSumRate,(v)=>{
         let upload = chart.series[0].data
         upload.push({
             name: moment().format("HH:mm:ss"),

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

@@ -0,0 +1,26 @@
+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";
+
+let cpu = reactive({
+    usage: {
+        data: <number[]>[],
+        interval: <NodeJS.Timeout | undefined>undefined
+    },
+
+})
+
+export function useCpuUsage(){
+    clearInterval(cpu.usage.interval)
+
+    function loop(){
+        GetCpuUsage().then(result=>cpu.usage.data = result)
+        cpu.usage.interval = setTimeout(()=>{
+            loop()
+        },1000)
+    }
+
+    loop()
+    return computed(()=>cpu.usage.data)
+}

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

@@ -1,90 +0,0 @@
-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";
-
-let stat =  reactive({
-    cpu : {
-        usage: {
-            data: [],
-            interval: null
-        },
-    },
-    memory: {
-        data: {},
-        interval: null,
-        usage: {
-            data: 0,
-        }
-    }
-})
-
-
-export function useCpuUsage(){
-    clearInterval(stat.cpu.usage.interval)
-
-    function loop(){
-        GetCpuUsage().then(result=>stat.cpu.usage.data = result)
-        stat.cpu.usage.interval = setTimeout(()=>{
-            loop()
-        },1000)
-    }
-
-    loop()
-    return computed(()=>stat.cpu.usage.data)
-}
-
-function loopMemory(){
-    clearInterval(stat.memory.interval)
-    function loop(){
-        GetVirtualMemory().then(result=> {
-            stat.memory.data = result
-            stat.memory.usage.data = result.usedPercent
-        })
-        stat.memory.interval = setTimeout(()=>{
-            loop()
-        },1000)
-    }
-    loop()
-}
-
-export function useMemoryUsage(){
-    if(stat.memory.usage.interval == null){
-        loopMemory()
-    }
-
-    return computed(()=> Number((stat.memory.usage.data || 0).toFixed(2)))
-}
-
-
-export function useMemoryUsageSizeWithByte(){
-    if(stat.memory.usage.interval == null){
-        loopMemory()
-    }
-
-    return computed(()=> stat.memory.data.used || 0)
-}
-
-export function useMemoryUsageSize(){
-    if(stat.memory.usage.interval == null){
-        loopMemory()
-    }
-
-    return computed(()=> bytesToSizeWithUnit(stat.memory.data.used || 0))
-}
-
-export function useMemoryTotalSize(){
-    if(stat.memory.usage.interval == null){
-        loopMemory()
-    }
-
-    return computed(()=> bytesToSizeWithUnit(stat.memory.data.total || 0))
-}
-
-export function useMemoryTotalSizeWithByte(){
-    if(stat.memory.usage.interval == null){
-        loopMemory()
-    }
-
-    return computed(()=> stat.memory.data.total || 0)
-}

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

@@ -0,0 +1,64 @@
+import {reactive, computed} from "vue";
+import {GetVirtualMemory} from "frontend/wailsjs/go/system/InfoUtils";
+import {bytesToSizeWithUnit} from "src/utils/file/file";
+import {mem} from "frontend/wailsjs/go/models";
+import VirtualMemoryStat = mem.VirtualMemoryStat;
+
+const memory = reactive({
+    data: <VirtualMemoryStat>{},
+    interval: <NodeJS.Timeout | undefined>undefined,
+})
+
+function loopMemory(){
+    clearInterval(memory.interval)
+    function loop(){
+        GetVirtualMemory().then(result=> {
+            memory.data = result
+        })
+        memory.interval = setTimeout(()=>{
+            loop()
+        },1000)
+    }
+    loop()
+}
+
+export function useMemoryUsage(){
+    if(memory.interval == null){
+        loopMemory()
+    }
+
+    return computed(()=> Number((memory.data.usedPercent || 0).toFixed(2)))
+}
+
+
+export function useMemoryUsageSizeWithByte(){
+    if(memory.interval == null){
+        loopMemory()
+    }
+
+    return computed(()=> memory.data.used || 0)
+}
+
+export function useMemoryUsageSize(){
+    if(memory.interval == null){
+        loopMemory()
+    }
+
+    return computed(()=> bytesToSizeWithUnit(memory.data.used || 0))
+}
+
+export function useMemoryTotalSize(){
+    if(memory.interval == null){
+        loopMemory()
+    }
+
+    return computed(()=> bytesToSizeWithUnit(memory.data.total || 0))
+}
+
+export function useMemoryTotalSizeWithByte(){
+    if(memory.interval == null){
+        loopMemory()
+    }
+
+    return computed(()=> memory.data.total || 0)
+}

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

@@ -1,9 +1,9 @@
-import {computed, reactive} from "vue";
+import {computed, reactive, ref, toRefs, toValue} from "vue";
 import {net} from "frontend/wailsjs/go/models";
 import IOCountersStat = net.IOCountersStat;
 import {GetNetworkCounter} from "frontend/wailsjs/go/system/InfoUtils";
 
-let network = reactive({
+const network = reactive({
     counter: {
         data: <IOCountersStat[]>[],
         interval: <any>undefined
@@ -60,7 +60,7 @@ export function useNetworkSumCounter(){
         loopNetworkSumCounter()
     }
 
-    return computed(()=> network.sumCounter.data)
+    return network.sumCounter.data
 }
 
 export function useNetworkSumRate(){
@@ -68,5 +68,5 @@ export function useNetworkSumRate(){
         loopNetworkSumCounter()
     }
 
-    return computed(()=> network.sumCounter.rate)
+    return network.sumCounter.rate
 }