add: 样式兼容 mac

Author: cyz-home

README.md

@@ -13,4 +13,12 @@
 
 ```bash
 wails dev
-```
+```
+
+### 按照固定版本 Wails CLI v2.8.0
+go install github.com/wailsapp/wails/v2/cmd/[email protected]
+
+
+wails build  -platform  windows/amd64
+wails build  -platform  darwin/universal
+wails build  -platform  linux/amd64

apps/controllers/binlog.go

@@ -36,8 +36,6 @@ type DetailsList struct {
 }
 
 func (b Binlog) GetDetailsList(id int64, search *SearchBinlog) (*DetailsList, error) {
-	ctx.LogDebug("req", search)
-
 	data, ok := orm.NewOrmUploadLogs().WhereId(id).First()
 	if !ok {
 		return nil, errors.New("data not is exist")
@@ -46,7 +44,7 @@ func (b Binlog) GetDetailsList(id int64, search *SearchBinlog) (*DetailsList, er
 	database, table := data.Database, data.Table
 	model := orm.NewOrmBinlog(database, table).Order("id DESC").Order("id DESC")
 	if search.Table != "" {
-		model.Where("table = ?", search.Table)
+		model.Where("tables = ?", search.Table)
 	}
 	if search.Event != "" {
 		model.Where("event = ?", search.Event)

apps/controllers/files.go

@@ -2,6 +2,7 @@ package controllers
 
 import (
 	"changeme/apps/ctx"
+	"changeme/apps/datas"
 	"changeme/apps/mysql"
 	"changeme/apps/orm"
 	"github.com/wailsapp/wails/v2/pkg/runtime"
@@ -45,6 +46,14 @@ func (f *Files) GetDecodeRowCount() uint64 {
 	return mysql.DecodeRowCount
 }
 
+func (f *Files) ClearAllData() {
+	path, _ := datas.GetDataDir("mysql-binlog-ui/")
+	path = datas.ToPath(path)
+
+	// 删除所有目录
+	os.RemoveAll(path)
+}
+
 type TitleData struct {
 	List  []*orm.UploadLogs
 	Total int64

apps/controllers/help.go

@@ -1,6 +1,7 @@
 package controllers
 
 import (
+	"os"
 	"os/exec"
 	"runtime"
 )
@@ -27,3 +28,7 @@ func (h *Help) OpenURL(url string) error {
 
 	return exec.Command(cmd, args...).Start()
 }
+
+func (h *Help) Exit() {
+	os.Exit(0)
+}

frontend/src/layouts/HeaderView.vue

@@ -1,9 +1,18 @@
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+
+import { Exit } from "@wailsjs/go/controllers/Help";
+import {WindowFullscreen, WindowMinimise} from "@wailsjs/runtime";
+
+</script>
 
 <template>
   <div>
     <div class="header-logo">
-      <div class="right-angle-triangle"></div>
+      <div class="window-controls">
+        <div class="button red" @click="Exit"></div>
+        <div class="button yellow" @click="WindowMinimise"></div>
+        <div class="button green" @click="WindowFullscreen"></div>
+      </div>
     </div>
 
     <div>
@@ -15,7 +24,7 @@
 <style scoped>
 .header-logo {
   position: absolute;
-  right: 20px;
+  left: 13px;
   height: 100%;
   box-sizing: border-box;
   padding-top: 9px;
@@ -29,19 +38,29 @@
   padding-top: 10px;
 }
 
-.right-angle-triangle {
-  width: 20px;
-  height: 20px;
-  background: linear-gradient(
-    45deg,
-    rgb(231, 210, 210),
-    orange,
-    yellow,
-    rgb(255, 255, 255),
-    rgb(214, 214, 242),
-    rgb(211, 195, 224),
-    violet
-  );
-  transform: rotate(45deg);
+.window-controls {
+  display: flex;
+  gap: 8px;
+  border-radius: 6px;
+  width: fit-content;
+  margin: 4px auto;
+}
+
+.window-controls .button {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background-color: red;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.window-controls .button.yellow {
+  background-color: #fdbc40;
+}
+
+.window-controls .button.green {
+  background-color: #34c84a;
 }
 </style>

frontend/src/views/BinlogView.vue

@@ -4,7 +4,7 @@ import LogsList from "./binlog/LogsList.vue";
 import {
   GetSystemFile,
   GetDecodeRowCount,
-  SaveToSqlite,
+  SaveToSqlite, ClearAllData,
 } from "@wailsjs/go/controllers/Files";
 import { ElMessageBox } from "element-plus";
 import { fa, tr } from "element-plus/es/locale/index.mjs";
@@ -28,6 +28,14 @@ const handleClose = (done: () => void) => {
 
 const childRef = ref();
 
+const submitClear = () => {
+  ElMessageBox.confirm("清空所有数据?").then(() => {
+    ClearAllData().then(()=>{
+      childRef.value.doSomething();
+    })
+  });
+};
+
 const submitUpload = () => {
   GetSystemFile().then((res) => {
     if (res != "") {
@@ -63,6 +71,10 @@ const submitUpload = () => {
       <el-button type="primary" @click="submitUpload">
         Import Binlog File
       </el-button>
+
+      <el-button type="primary" @click="submitClear">
+        Clear ALL
+      </el-button>
     </div>
 
     <LogsList ref="childRef" />

frontend/src/views/binlog/LogsList.vue

@@ -79,9 +79,10 @@ defineExpose({ doSomething });
         prop="Database"
         label="Database"
         :formatter="dateDatabase"
+        min-width="100px"
       />
-      <el-table-column prop="Table" label="Table" width="100px" />
-      <el-table-column prop="FileSize" label="FileSize/MB" width="120px" />
+      <el-table-column prop="Table" label="Table" min-width="100px" />
+      <el-table-column prop="FileSize" label="FileSize/MB" min-width="120px" />
       <el-table-column
         prop="Timestamp"
         label="Timestamp"

frontend/src/views/db/DbDetails.vue

@@ -99,6 +99,7 @@ const handleCurrentChange = (val: number) => {
         <el-select v-model="formInline.Event" placeholder="event" clearable>
           <el-option label="insert" value="insert" />
           <el-option label="update" value="update" />
+          <el-option label="delete" value="delete" />
         </el-select>
       </el-form-item>
       <el-form-item>

frontend/wailsjs/go/controllers/Files.d.ts

@@ -2,6 +2,8 @@
 // This file is automatically generated. DO NOT EDIT
 import {controllers} from '../models';
 
+export function ClearAllData():Promise<void>;
+
 export function DeleteFile(arg1:number):Promise<void>;
 
 export function GetDecodeRowCount():Promise<number>;

frontend/wailsjs/go/controllers/Files.js

@@ -2,6 +2,10 @@
 // Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
 // This file is automatically generated. DO NOT EDIT
 
+export function ClearAllData() {
+  return window['go']['controllers']['Files']['ClearAllData']();
+}
+
 export function DeleteFile(arg1) {
   return window['go']['controllers']['Files']['DeleteFile'](arg1);
 }