重构：文件系统模块化架构，优化应用启动流程
This commit is contained in:
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Go Desk</title>
|
||||
<title>U-Desk</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
375
web/package-lock.json
generated
375
web/package-lock.json
generated
@@ -1,20 +1,34 @@
|
||||
{
|
||||
"name": "go-desk-web",
|
||||
"name": "u-desk-web",
|
||||
"version": "1.0.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "go-desk-web",
|
||||
"name": "u-desk-web",
|
||||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"@arco-design/web-vue": "^2.54.0",
|
||||
"@codemirror/commands": "^6.10.1",
|
||||
"@codemirror/highlight": "^0.19.8",
|
||||
"@codemirror/lang-cpp": "^6.0.3",
|
||||
"@codemirror/lang-css": "^6.3.1",
|
||||
"@codemirror/lang-go": "^6.0.1",
|
||||
"@codemirror/lang-html": "^6.4.11",
|
||||
"@codemirror/lang-java": "^6.0.2",
|
||||
"@codemirror/lang-javascript": "^6.2.4",
|
||||
"@codemirror/lang-json": "^6.0.2",
|
||||
"@codemirror/lang-markdown": "^6.5.0",
|
||||
"@codemirror/lang-php": "^6.0.2",
|
||||
"@codemirror/lang-python": "^6.2.1",
|
||||
"@codemirror/lang-rust": "^6.0.2",
|
||||
"@codemirror/lang-sql": "^6.10.0",
|
||||
"@codemirror/language": "^6.12.1",
|
||||
"@codemirror/legacy-modes": "^6.5.2",
|
||||
"@codemirror/state": "^6.5.3",
|
||||
"@codemirror/theme-one-dark": "^6.1.3",
|
||||
"@codemirror/view": "^6.39.8",
|
||||
"marked": "^17.0.1",
|
||||
"vue": "^3.5.26"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -109,6 +123,134 @@
|
||||
"@lezer/common": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight": {
|
||||
"version": "0.19.8",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/highlight/-/highlight-0.19.8.tgz",
|
||||
"integrity": "sha512-v/lzuHjrYR8MN2mEJcUD6fHSTXXli9C1XGYpr+ElV6fLBIUhMTNKR3qThp611xuWfXfwDxeL7ppcbkM/MzPV3A==",
|
||||
"deprecated": "As of 0.20.0, this package has been split between @lezer/highlight and @codemirror/language",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/view": "^0.19.39",
|
||||
"@lezer/common": "^0.15.0",
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight/node_modules/@codemirror/language": {
|
||||
"version": "0.19.10",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/language/-/language-0.19.10.tgz",
|
||||
"integrity": "sha512-yA0DZ3RYn2CqAAGW62VrU8c4YxscMQn45y/I9sjBlqB1e2OTQLg4CCkMBuMSLXk4xaqjlsgazeOQWaJQOKfV8Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.5",
|
||||
"@lezer/lr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight/node_modules/@codemirror/state": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/state/-/state-0.19.9.tgz",
|
||||
"integrity": "sha512-psOzDolKTZkx4CgUqhBQ8T8gBc0xN5z4gzed109aF6x7D7umpDRoimacI/O6d9UGuyl4eYuDCZmDFr2Rq7aGOw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/text": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight/node_modules/@codemirror/view": {
|
||||
"version": "0.19.48",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/view/-/view-0.19.48.tgz",
|
||||
"integrity": "sha512-0eg7D2Nz4S8/caetCTz61rK0tkHI17V/d15Jy0kLOT8dTLGGNJUponDnW28h2B6bERmPlVHKh8MJIr5OCp1nGw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/rangeset": "^0.19.5",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"style-mod": "^4.0.0",
|
||||
"w3c-keyname": "^2.2.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight/node_modules/@lezer/common": {
|
||||
"version": "0.15.12",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/common/-/common-0.15.12.tgz",
|
||||
"integrity": "sha512-edfwCxNLnzq5pBA/yaIhwJ3U3Kz8VAUOTRg0hhxaizaI1N+qxV7EXDv/kLCkLeq2RzSFvxexlaj5Mzfn2kY0Ig==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@codemirror/highlight/node_modules/@lezer/lr": {
|
||||
"version": "0.15.8",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/lr/-/lr-0.15.8.tgz",
|
||||
"integrity": "sha512-bM6oE6VQZ6hIFxDNKk8bKPa14hqFrV07J/vHGOeiAbJReIaQXmkVb6xQu4MR+JBTLa5arGRyAAjJe1qaQt3Uvg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-cpp": {
|
||||
"version": "6.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-cpp/-/lang-cpp-6.0.3.tgz",
|
||||
"integrity": "sha512-URM26M3vunFFn9/sm6rzqrBzDgfWuDixp85uTY49wKudToc2jTHUrKIGGKs+QWND+YLofNNZpxcNGRynFJfvgA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@lezer/cpp": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-css": {
|
||||
"version": "6.3.1",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-css/-/lang-css-6.3.1.tgz",
|
||||
"integrity": "sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.0.0",
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@lezer/common": "^1.0.2",
|
||||
"@lezer/css": "^1.1.7"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-go": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-go/-/lang-go-6.0.1.tgz",
|
||||
"integrity": "sha512-7fNvbyNylvqCphW9HD6WFnRpcDjr+KXX/FgqXy5H5ZS0eC5edDljukm/yNgYkwTsgp2busdod50AOTIy6Jikfg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.0.0",
|
||||
"@codemirror/language": "^6.6.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@lezer/common": "^1.0.0",
|
||||
"@lezer/go": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-html": {
|
||||
"version": "6.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-html/-/lang-html-6.4.11.tgz",
|
||||
"integrity": "sha512-9NsXp7Nwp891pQchI7gPdTwBuSuT3K65NGTHWHNJ55HjYcHLllr0rbIZNdOzas9ztc1EUVBlHou85FFZS4BNnw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.0.0",
|
||||
"@codemirror/lang-css": "^6.0.0",
|
||||
"@codemirror/lang-javascript": "^6.0.0",
|
||||
"@codemirror/language": "^6.4.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@codemirror/view": "^6.17.0",
|
||||
"@lezer/common": "^1.0.0",
|
||||
"@lezer/css": "^1.1.0",
|
||||
"@lezer/html": "^1.3.12"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-java": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-java/-/lang-java-6.0.2.tgz",
|
||||
"integrity": "sha512-m5Nt1mQ/cznJY7tMfQTJchmrjdjQ71IDs+55d1GAa8DGaB8JXWsVCkVT284C3RTASaY43YknrK2X3hPO/J3MOQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@lezer/java": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-javascript": {
|
||||
"version": "6.2.4",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-javascript/-/lang-javascript-6.2.4.tgz",
|
||||
@@ -124,6 +266,67 @@
|
||||
"@lezer/javascript": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-json": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-json/-/lang-json-6.0.2.tgz",
|
||||
"integrity": "sha512-x2OtO+AvwEHrEwR0FyyPtfDUiloG3rnVTSZV1W8UteaLL8/MajQd8DpvUb2YVzC+/T18aSDv0H9mu+xw0EStoQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@lezer/json": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-markdown": {
|
||||
"version": "6.5.0",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-markdown/-/lang-markdown-6.5.0.tgz",
|
||||
"integrity": "sha512-0K40bZ35jpHya6FriukbgaleaqzBLZfOh7HuzqbMxBXkbYMJDxfF39c23xOgxFezR+3G+tR2/Mup+Xk865OMvw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.7.1",
|
||||
"@codemirror/lang-html": "^6.0.0",
|
||||
"@codemirror/language": "^6.3.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@codemirror/view": "^6.0.0",
|
||||
"@lezer/common": "^1.2.1",
|
||||
"@lezer/markdown": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-php": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-php/-/lang-php-6.0.2.tgz",
|
||||
"integrity": "sha512-ZKy2v1n8Fc8oEXj0Th0PUMXzQJ0AIR6TaZU+PbDHExFwdu+guzOA4jmCHS1Nz4vbFezwD7LyBdDnddSJeScMCA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/lang-html": "^6.0.0",
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@lezer/common": "^1.0.0",
|
||||
"@lezer/php": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-python": {
|
||||
"version": "6.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-python/-/lang-python-6.2.1.tgz",
|
||||
"integrity": "sha512-IRjC8RUBhn9mGR9ywecNhB51yePWCGgvHfY1lWN/Mrp3cKuHr0isDKia+9HnvhiWNnMpbGhWrkhuWOc09exRyw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.3.2",
|
||||
"@codemirror/language": "^6.8.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@lezer/common": "^1.2.1",
|
||||
"@lezer/python": "^1.1.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-rust": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-rust/-/lang-rust-6.0.2.tgz",
|
||||
"integrity": "sha512-EZaGjCUegtiU7kSMvOfEZpaCReowEf3yNidYu7+vfuGTm9ow4mthAparY5hisJqOHmJowVH3Upu+eJlUji6qqA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@lezer/rust": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-sql": {
|
||||
"version": "6.10.0",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lang-sql/-/lang-sql-6.10.0.tgz",
|
||||
@@ -152,6 +355,15 @@
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/legacy-modes": {
|
||||
"version": "6.5.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/legacy-modes/-/legacy-modes-6.5.2.tgz",
|
||||
"integrity": "sha512-/jJbwSTazlQEDOQw2FJ8LEEKVS72pU0lx6oM54kGpL8t/NJ2Jda3CZ4pcltiKTdqYSRk3ug1B3pil1gsjA6+8Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lint": {
|
||||
"version": "6.9.2",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/lint/-/lint-6.9.2.tgz",
|
||||
@@ -163,6 +375,25 @@
|
||||
"crelt": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/rangeset": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/rangeset/-/rangeset-0.19.9.tgz",
|
||||
"integrity": "sha512-V8YUuOvK+ew87Xem+71nKcqu1SXd5QROMRLMS/ljT5/3MCxtgrRie1Cvild0G/Z2f1fpWxzX78V0U4jjXBorBQ==",
|
||||
"deprecated": "As of 0.20.0, this package has been merged into @codemirror/state",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/rangeset/node_modules/@codemirror/state": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/state/-/state-0.19.9.tgz",
|
||||
"integrity": "sha512-psOzDolKTZkx4CgUqhBQ8T8gBc0xN5z4gzed109aF6x7D7umpDRoimacI/O6d9UGuyl4eYuDCZmDFr2Rq7aGOw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/text": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/state": {
|
||||
"version": "6.5.3",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/state/-/state-6.5.3.tgz",
|
||||
@@ -172,6 +403,25 @@
|
||||
"@marijn/find-cluster-break": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/text": {
|
||||
"version": "0.19.6",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/text/-/text-0.19.6.tgz",
|
||||
"integrity": "sha512-T9jnREMIygx+TPC1bOuepz18maGq/92q2a+n4qTqObKwvNMg+8cMTslb8yxeEDEq7S3kpgGWxgO1UWbQRij0dA==",
|
||||
"deprecated": "As of 0.20.0, this package has been merged into @codemirror/state",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@codemirror/theme-one-dark": {
|
||||
"version": "6.1.3",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/theme-one-dark/-/theme-one-dark-6.1.3.tgz",
|
||||
"integrity": "sha512-NzBdIvEJmx6fjeremiGp3t/okrLPYT0d9orIc7AFun8oZcRk58aejkqhv6spnz4MLAevrKNPMQYXEWMg4s+sKA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.0.0",
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@codemirror/view": "^6.0.0",
|
||||
"@lezer/highlight": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/view": {
|
||||
"version": "6.39.8",
|
||||
"resolved": "https://registry.npmmirror.com/@codemirror/view/-/view-6.39.8.tgz",
|
||||
@@ -636,6 +886,39 @@
|
||||
"integrity": "sha512-PNGcolp9hr4PJdXR4ix7XtixDrClScvtSCYW3rQG106oVMOOI+jFb+0+J3mbeL/53g1Zd6s0kJzaw6Ri68GmAA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@lezer/cpp": {
|
||||
"version": "1.1.5",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/cpp/-/cpp-1.1.5.tgz",
|
||||
"integrity": "sha512-DIhSXmYtJKLehrjzDFN+2cPt547ySQ41nA8yqcDf/GxMc+YM736xqltFkvADL2M0VebU5I+3+4ks2Vv+Kyq3Aw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/css": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/css/-/css-1.3.0.tgz",
|
||||
"integrity": "sha512-pBL7hup88KbI7hXnZV3PQsn43DHy6TWyzuyk2AO9UyoXcDltvIdqWKE1dLL/45JVZ+YZkHe1WVHqO6wugZZWcw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/go": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/go/-/go-1.0.1.tgz",
|
||||
"integrity": "sha512-xToRsYxwsgJNHTgNdStpcvmbVuKxTapV0dM0wey1geMMRc9aggoVyKgzYp41D2/vVOx+Ii4hmE206kvxIXBVXQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/highlight": {
|
||||
"version": "1.2.3",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/highlight/-/highlight-1.2.3.tgz",
|
||||
@@ -645,6 +928,28 @@
|
||||
"@lezer/common": "^1.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/html": {
|
||||
"version": "1.3.13",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/html/-/html-1.3.13.tgz",
|
||||
"integrity": "sha512-oI7n6NJml729m7pjm9lvLvmXbdoMoi2f+1pwSDJkl9d68zGr7a9Btz8NdHTGQZtW2DA25ybeuv/SyDb9D5tseg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/java": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/java/-/java-1.1.3.tgz",
|
||||
"integrity": "sha512-yHquUfujwg6Yu4Fd1GNHCvidIvJwi/1Xu2DaKl/pfWIA2c1oXkVvawH3NyXhCaFx4OdlYBVX5wvz2f7Aoa/4Xw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/javascript": {
|
||||
"version": "1.5.4",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/javascript/-/javascript-1.5.4.tgz",
|
||||
@@ -656,6 +961,17 @@
|
||||
"@lezer/lr": "^1.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/json": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/json/-/json-1.0.3.tgz",
|
||||
"integrity": "sha512-BP9KzdF9Y35PDpv04r0VeSTKDeox5vVr3efE7eBbx3r4s3oNLfunchejZhjArmeieBH+nVOpgIiBJpEAv8ilqQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/lr": {
|
||||
"version": "1.4.5",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/lr/-/lr-1.4.5.tgz",
|
||||
@@ -665,6 +981,49 @@
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/markdown": {
|
||||
"version": "1.6.3",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/markdown/-/markdown-1.6.3.tgz",
|
||||
"integrity": "sha512-jpGm5Ps+XErS+xA4urw7ogEGkeZOahVQF21Z6oECF0sj+2liwZopd2+I8uH5I/vZsRuuze3OxBREIANLf6KKUw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.5.0",
|
||||
"@lezer/highlight": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/php": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/php/-/php-1.0.5.tgz",
|
||||
"integrity": "sha512-W7asp9DhM6q0W6DYNwIkLSKOvxlXRrif+UXBMxzsJUuqmhE7oVU+gS3THO4S/Puh7Xzgm858UNaFi6dxTP8dJA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/python": {
|
||||
"version": "1.1.18",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/python/-/python-1.1.18.tgz",
|
||||
"integrity": "sha512-31FiUrU7z9+d/ElGQLJFXl+dKOdx0jALlP3KEOsGTex8mvj+SoE1FgItcHWK/axkxCHGUSpqIHt6JAWfWu9Rhg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/rust": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@lezer/rust/-/rust-1.0.2.tgz",
|
||||
"integrity": "sha512-Lz5sIPBdF2FUXcWeCu1//ojFAZqzTQNRga0aYv6dYXqJqPfMdCAI0NzajWUd4Xijj1IKJLtjoXRPMvTKWBcqKg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.2.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@marijn/find-cluster-break": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/@marijn/find-cluster-break/-/find-cluster-break-1.0.2.tgz",
|
||||
@@ -959,6 +1318,18 @@
|
||||
"@jridgewell/sourcemap-codec": "^1.5.5"
|
||||
}
|
||||
},
|
||||
"node_modules/marked": {
|
||||
"version": "17.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/marked/-/marked-17.0.1.tgz",
|
||||
"integrity": "sha512-boeBdiS0ghpWcSwoNm/jJBwdpFaMnZWRzjA6SkUMYb40SVaN1x7mmfGKp0jvexGcx+7y2La5zRZsYFZI6Qpypg==",
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"marked": "bin/marked.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 20"
|
||||
}
|
||||
},
|
||||
"node_modules/nanoid": {
|
||||
"version": "3.3.11",
|
||||
"funding": [
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "go-desk-web",
|
||||
"name": "u-desk-web",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
@@ -10,11 +10,25 @@
|
||||
"dependencies": {
|
||||
"@arco-design/web-vue": "^2.54.0",
|
||||
"@codemirror/commands": "^6.10.1",
|
||||
"@codemirror/highlight": "^0.19.8",
|
||||
"@codemirror/lang-cpp": "^6.0.3",
|
||||
"@codemirror/lang-css": "^6.3.1",
|
||||
"@codemirror/lang-go": "^6.0.1",
|
||||
"@codemirror/lang-html": "^6.4.11",
|
||||
"@codemirror/lang-java": "^6.0.2",
|
||||
"@codemirror/lang-javascript": "^6.2.4",
|
||||
"@codemirror/lang-json": "^6.0.2",
|
||||
"@codemirror/lang-markdown": "^6.5.0",
|
||||
"@codemirror/lang-php": "^6.0.2",
|
||||
"@codemirror/lang-python": "^6.2.1",
|
||||
"@codemirror/lang-rust": "^6.0.2",
|
||||
"@codemirror/lang-sql": "^6.10.0",
|
||||
"@codemirror/language": "^6.12.1",
|
||||
"@codemirror/legacy-modes": "^6.5.2",
|
||||
"@codemirror/state": "^6.5.3",
|
||||
"@codemirror/theme-one-dark": "^6.1.3",
|
||||
"@codemirror/view": "^6.39.8",
|
||||
"marked": "^17.0.1",
|
||||
"vue": "^3.5.26"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -1 +1 @@
|
||||
1fcf61f2f95666be3cda4149328a0c09
|
||||
b9906c1fd8b30922e23d654093282ace
|
||||
158
web/src/App.vue
158
web/src/App.vue
@@ -2,9 +2,11 @@
|
||||
<a-layout class="layout">
|
||||
<a-layout-header class="header">
|
||||
<div class="header-content">
|
||||
<h2>Go Desk</h2>
|
||||
<div class="header-left">
|
||||
<h2>U-Desk</h2>
|
||||
</div>
|
||||
<a-tabs v-model:active-key="activeTab" class="header-tabs">
|
||||
<a-tab-pane key="db-cli" title="数据库客户端"/>
|
||||
<a-tab-pane key="db-cli" title="数据库"/>
|
||||
<a-tab-pane key="file-system" title="文件管理"/>
|
||||
<a-tab-pane key="user" title="用户查询"/>
|
||||
<a-tab-pane key="device" title="设备调用测试"/>
|
||||
@@ -13,11 +15,34 @@
|
||||
<a-tooltip content="版本更新">
|
||||
<a-button type="text" @click="showUpdateModal = true">
|
||||
<template #icon>
|
||||
<icon-sync />
|
||||
<IconSync />
|
||||
</template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
<ThemeToggle />
|
||||
|
||||
<!-- 窗口控制按钮 -->
|
||||
<div class="window-controls">
|
||||
<div class="window-control-btn" @click="handleMinimize" title="最小化">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12">
|
||||
<rect x="0" y="5" width="12" height="2" fill="currentColor"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="window-control-btn" @click="handleMaximize" :title="isMaximized ? '还原' : '最大化'">
|
||||
<svg v-if="!isMaximized" width="12" height="12" viewBox="0 0 12 12">
|
||||
<rect x="1" y="1" width="10" height="10" fill="none" stroke="currentColor" stroke-width="1.5"/>
|
||||
</svg>
|
||||
<svg v-else width="12" height="12" viewBox="0 0 12 12">
|
||||
<rect x="2" y="0" width="10" height="10" fill="none" stroke="currentColor" stroke-width="1.5"/>
|
||||
<rect x="0" y="2" width="10" height="10" fill="none" stroke="currentColor" stroke-width="1.5"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="window-control-btn close-btn" @click="handleClose" title="关闭">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1 1L11 11M11 1L1 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-layout-header>
|
||||
@@ -108,16 +133,65 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {onMounted, ref} from 'vue'
|
||||
import {onMounted, ref, watch} from 'vue'
|
||||
import {Message} from '@arco-design/web-vue'
|
||||
import {
|
||||
IconMinus,
|
||||
IconFullscreen,
|
||||
IconFullscreenExit,
|
||||
IconClose,
|
||||
IconSync
|
||||
} from '@arco-design/web-vue/es/icon'
|
||||
import DeviceTest from './components/DeviceTest.vue'
|
||||
import DbCli from './views/db-cli/index.vue'
|
||||
import ThemeToggle from './components/ThemeToggle.vue'
|
||||
import UpdatePanel from './components/UpdatePanel.vue'
|
||||
import FileSystem from './components/FileSystem.vue'
|
||||
|
||||
const activeTab = ref('db-cli')
|
||||
// 存储键
|
||||
const ACTIVE_TAB_STORAGE_KEY = 'app-active-tab'
|
||||
|
||||
// 从 localStorage 恢复上次打开的区域，默认为 'db-cli'
|
||||
const activeTab = ref(localStorage.getItem(ACTIVE_TAB_STORAGE_KEY) || 'db-cli')
|
||||
const showUpdateModal = ref(false)
|
||||
const isMaximized = ref(false)
|
||||
|
||||
// 监听 activeTab 变化，自动保存到 localStorage
|
||||
watch(activeTab, (newTab) => {
|
||||
localStorage.setItem(ACTIVE_TAB_STORAGE_KEY, newTab)
|
||||
})
|
||||
|
||||
// 窗口控制方法
|
||||
const handleMinimize = async () => {
|
||||
try {
|
||||
if (window.go?.main?.App?.WindowMinimize) {
|
||||
await window.go.main.App.WindowMinimize()
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('最小化窗口失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
const handleMaximize = async () => {
|
||||
try {
|
||||
if (window.go?.main?.App?.WindowMaximize) {
|
||||
await window.go.main.App.WindowMaximize()
|
||||
isMaximized.value = await window.go.main.App.WindowIsMaximized()
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('最大化窗口失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
const handleClose = async () => {
|
||||
try {
|
||||
if (window.go?.main?.App?.WindowClose) {
|
||||
await window.go.main.App.WindowClose()
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('关闭窗口失败:', error)
|
||||
}
|
||||
}
|
||||
const loading = ref(false)
|
||||
const formModel = ref({
|
||||
keyword: '',
|
||||
@@ -219,6 +293,8 @@ onMounted(() => {
|
||||
.header {
|
||||
background: var(--color-bg-2);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
user-select: none;
|
||||
--wails-draggable: drag; /* Wails 拖拽属性 */
|
||||
}
|
||||
|
||||
.header-content {
|
||||
@@ -229,6 +305,13 @@ onMounted(() => {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 150px;
|
||||
--wails-draggable: drag; /* 左侧标题区域可拖拽 */
|
||||
}
|
||||
|
||||
.header-content h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
@@ -244,11 +327,49 @@ onMounted(() => {
|
||||
.header-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-left: 20px;
|
||||
min-width: 200px;
|
||||
justify-content: flex-end;
|
||||
--wails-draggable: no-drag; /* 按钮区域不响应拖拽 */
|
||||
}
|
||||
|
||||
.window-controls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 12px;
|
||||
padding-left: 12px;
|
||||
border-left: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.window-control-btn {
|
||||
width: 40px;
|
||||
height: 28px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.15s;
|
||||
color: var(--color-text-2);
|
||||
--wails-draggable: no-drag; /* 窗口控制按钮不响应拖拽 */
|
||||
}
|
||||
|
||||
.window-control-btn:hover {
|
||||
background: var(--color-fill-2);
|
||||
color: var(--color-text-1);
|
||||
}
|
||||
|
||||
.window-control-btn.close-btn:hover {
|
||||
background: #e81123;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.window-control-btn svg {
|
||||
display: block;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 20px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
background: var(--color-bg-1);
|
||||
@@ -262,3 +383,28 @@ onMounted(() => {
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Wails 拖拽样式 -->
|
||||
<style>
|
||||
.header {
|
||||
--wails-draggable: drag;
|
||||
}
|
||||
|
||||
/* 所有按钮类元素都不可拖拽 */
|
||||
.header-actions,
|
||||
.window-control-btn {
|
||||
--wails-draggable: no-drag;
|
||||
}
|
||||
|
||||
/* tabs 的具体 tab 项不可拖拽，但空白区域可以拖拽 */
|
||||
.arco-tabs-tab {
|
||||
--wails-draggable: no-drag;
|
||||
}
|
||||
|
||||
/* Arco Design 按钮不可拖拽 */
|
||||
.arco-btn,
|
||||
.arco-select,
|
||||
.arco-tooltip {
|
||||
--wails-draggable: no-drag;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -71,7 +71,11 @@ export async function writeFile(path: string, content: string): Promise<void> {
|
||||
if (!window.go?.main?.App?.WriteFile) {
|
||||
throw new Error('WriteFile API 不可用')
|
||||
}
|
||||
await window.go.main.App.WriteFile(path, content)
|
||||
// 确保传递的是字符串类型
|
||||
await window.go.main.App.WriteFile({
|
||||
path: String(path),
|
||||
content: String(content)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -84,6 +88,26 @@ export async function deletePath(path: string): Promise<void> {
|
||||
await window.go.main.App.DeletePath(path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建目录
|
||||
*/
|
||||
export async function createDir(path: string): Promise<void> {
|
||||
if (!window.go?.main?.App?.CreateDir) {
|
||||
throw new Error('CreateDir API 不可用')
|
||||
}
|
||||
await window.go.main.App.CreateDir(path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建文件
|
||||
*/
|
||||
export async function createFile(path: string): Promise<void> {
|
||||
if (!window.go?.main?.App?.CreateFile) {
|
||||
throw new Error('CreateFile API 不可用')
|
||||
}
|
||||
await window.go.main.App.CreateFile(path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取环境变量
|
||||
*/
|
||||
@@ -93,3 +117,103 @@ export async function getEnvVars(): Promise<Record<string, string>> {
|
||||
}
|
||||
return await window.go.main.App.GetEnvVars()
|
||||
}
|
||||
|
||||
/**
|
||||
* 列出 zip 文件内容
|
||||
*/
|
||||
export async function listZipContents(zipPath: string): Promise<File[]> {
|
||||
console.log('[API] listZipContents 调用:', zipPath)
|
||||
if (!window.go?.main?.App?.ListZipContents) {
|
||||
throw new Error('ListZipContents API 不可用')
|
||||
}
|
||||
try {
|
||||
const result = await window.go.main.App.ListZipContents(zipPath)
|
||||
console.log('[API] listZipContents 结果:', result?.length || 0, '个文件')
|
||||
return result
|
||||
} catch (error) {
|
||||
console.error('[API] listZipContents 错误:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从 zip 文件中提取单个文件内容
|
||||
*/
|
||||
export async function extractFileFromZip(zipPath: string, filePath: string): Promise<string> {
|
||||
console.log('[API] extractFileFromZip 调用:', { zipPath, filePath })
|
||||
if (!window.go?.main?.App?.ExtractFileFromZip) {
|
||||
throw new Error('ExtractFileFromZip API 不可用')
|
||||
}
|
||||
try {
|
||||
const result = await window.go.main.App.ExtractFileFromZip(zipPath, filePath)
|
||||
console.log('[API] extractFileFromZip 成功, 内容长度:', result?.length || 0)
|
||||
return result
|
||||
} catch (error) {
|
||||
console.error('[API] extractFileFromZip 错误:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从 zip 文件中提取单个文件到临时目录
|
||||
* 返回临时文件的完整路径，适用于图片等二进制文件
|
||||
*/
|
||||
export async function extractFileFromZipToTemp(zipPath: string, filePath: string): Promise<string> {
|
||||
console.log('[API] extractFileFromZipToTemp 调用:', { zipPath, filePath })
|
||||
if (!window.go?.main?.App?.ExtractFileFromZipToTemp) {
|
||||
throw new Error('ExtractFileFromZipToTemp API 不可用')
|
||||
}
|
||||
try {
|
||||
const result = await window.go.main.App.ExtractFileFromZipToTemp(zipPath, filePath)
|
||||
console.log('[API] extractFileFromZipToTemp 成功, 临时文件路径:', result)
|
||||
return result
|
||||
} catch (error) {
|
||||
console.error('[API] extractFileFromZipToTemp 错误:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取 zip 文件中特定文件的信息
|
||||
*/
|
||||
export async function getZipFileInfo(zipPath: string, filePath: string): Promise<File> {
|
||||
console.log('[API] getZipFileInfo 调用:', { zipPath, filePath })
|
||||
if (!window.go?.main?.App?.GetZipFileInfo) {
|
||||
throw new Error('GetZipFileInfo API 不可用')
|
||||
}
|
||||
try {
|
||||
const result = await window.go.main.App.GetZipFileInfo(zipPath, filePath)
|
||||
console.log('[API] getZipFileInfo 结果:', result)
|
||||
return result
|
||||
} catch (error) {
|
||||
console.error('[API] getZipFileInfo 错误:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 使用系统默认程序打开文件或目录
|
||||
*/
|
||||
export async function openPath(path: string): Promise<void> {
|
||||
console.log('[API] openPath 调用:', path)
|
||||
if (!window.go?.main?.App?.OpenPath) {
|
||||
throw new Error('OpenPath API 不可用')
|
||||
}
|
||||
try {
|
||||
await window.go.main.App.OpenPath(path)
|
||||
console.log('[API] openPath 成功')
|
||||
} catch (error) {
|
||||
console.error('[API] openPath 错误:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取本地文件服务器URL
|
||||
*/
|
||||
export async function getFileServerURL(): Promise<string> {
|
||||
if (!window.go?.main?.App?.GetFileServerURL) {
|
||||
throw new Error('GetFileServerURL API 不可用')
|
||||
}
|
||||
return await window.go.main.App.GetFileServerURL()
|
||||
}
|
||||
|
||||
287
web/src/components/CodeEditor.vue
Normal file
287
web/src/components/CodeEditor.vue
Normal file
@@ -0,0 +1,287 @@
|
||||
<template>
|
||||
<div ref="editorContainer" class="codemirror-editor"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, watch, onBeforeUnmount } from 'vue'
|
||||
import { EditorView, lineNumbers, highlightActiveLineGutter } from '@codemirror/view'
|
||||
import { EditorState } from '@codemirror/state'
|
||||
import { defaultKeymap, history, historyKeymap } from '@codemirror/commands'
|
||||
import { javascript } from '@codemirror/lang-javascript'
|
||||
import { java } from '@codemirror/lang-java'
|
||||
import { python } from '@codemirror/lang-python'
|
||||
import { go } from '@codemirror/lang-go'
|
||||
import { cpp } from '@codemirror/lang-cpp'
|
||||
import { rust } from '@codemirror/lang-rust'
|
||||
import { php } from '@codemirror/lang-php'
|
||||
import { json } from '@codemirror/lang-json'
|
||||
import { markdown } from '@codemirror/lang-markdown'
|
||||
import { html } from '@codemirror/lang-html'
|
||||
import { css } from '@codemirror/lang-css'
|
||||
import { oneDark } from '@codemirror/theme-one-dark'
|
||||
import { keymap } from '@codemirror/view'
|
||||
import { bracketMatching } from '@codemirror/language'
|
||||
import { useTheme } from '@/composables/useTheme'
|
||||
|
||||
// 使用主题系统
|
||||
const { isDark } = useTheme()
|
||||
|
||||
/**
|
||||
* 文件扩展名到语言的映射
|
||||
*/
|
||||
const LANGUAGE_MAP = {
|
||||
// JavaScript/TypeScript
|
||||
'js': javascript(),
|
||||
'jsx': javascript({ jsx: true }),
|
||||
'ts': javascript({ typescript: true }),
|
||||
'tsx': javascript({ typescript: true, jsx: true }),
|
||||
'mjs': javascript(),
|
||||
'cjs': javascript(),
|
||||
|
||||
// JSON
|
||||
'json': json(),
|
||||
|
||||
// Java
|
||||
'java': java(),
|
||||
|
||||
// Python
|
||||
'py': python(),
|
||||
|
||||
// Go
|
||||
'go': go(),
|
||||
|
||||
// C/C++
|
||||
'c': cpp(),
|
||||
'cpp': cpp(),
|
||||
'cc': cpp(),
|
||||
'cxx': cpp(),
|
||||
'h': cpp(),
|
||||
'hpp': cpp(),
|
||||
'hxx': cpp(),
|
||||
|
||||
// Rust
|
||||
'rs': rust(),
|
||||
|
||||
// PHP
|
||||
'php': php(),
|
||||
|
||||
// Markdown
|
||||
'md': markdown(),
|
||||
'markdown': markdown(),
|
||||
|
||||
// HTML
|
||||
'html': html(),
|
||||
'htm': html(),
|
||||
|
||||
// CSS
|
||||
'css': css(),
|
||||
'scss': css(),
|
||||
'sass': css(),
|
||||
'less': css(),
|
||||
}
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
fileExtension: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modelValue'])
|
||||
|
||||
const editorContainer = ref(null)
|
||||
let view = null
|
||||
|
||||
// 根据主题动态创建编辑器配置
|
||||
const createExtensions = () => {
|
||||
const extensions = [
|
||||
lineNumbers(),
|
||||
highlightActiveLineGutter(),
|
||||
history(),
|
||||
keymap.of(defaultKeymap),
|
||||
keymap.of(historyKeymap),
|
||||
bracketMatching(),
|
||||
EditorView.updateListener.of((update) => {
|
||||
if (update.docChanged) {
|
||||
emit('update:modelValue', update.state.doc.toString())
|
||||
}
|
||||
}),
|
||||
EditorView.theme({
|
||||
'&': {
|
||||
height: '100%',
|
||||
fontSize: '13px'
|
||||
},
|
||||
'.cm-scroller': {
|
||||
overflow: 'auto',
|
||||
fontFamily: 'Consolas, Monaco, Courier New, monospace'
|
||||
},
|
||||
'.cm-content': {
|
||||
padding: '8px',
|
||||
minHeight: '100%'
|
||||
},
|
||||
'.cm-line': {
|
||||
padding: '0 0'
|
||||
},
|
||||
'&.cm-focused': {
|
||||
outline: 'none'
|
||||
}
|
||||
})
|
||||
]
|
||||
|
||||
// 根据主题添加 One Dark
|
||||
if (isDark.value) {
|
||||
extensions.push(oneDark)
|
||||
}
|
||||
|
||||
// 添加语言支持
|
||||
const langSupport = LANGUAGE_MAP[props.fileExtension]
|
||||
if (langSupport) {
|
||||
extensions.push(langSupport)
|
||||
}
|
||||
|
||||
return extensions
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (!editorContainer.value) return
|
||||
|
||||
const state = EditorState.create({
|
||||
doc: props.modelValue,
|
||||
extensions: createExtensions()
|
||||
})
|
||||
|
||||
view = new EditorView({
|
||||
state,
|
||||
parent: editorContainer.value
|
||||
})
|
||||
})
|
||||
|
||||
// 监听外部内容变化
|
||||
watch(() => props.modelValue, (newValue) => {
|
||||
if (view && newValue !== view.state.doc.toString()) {
|
||||
view.dispatch({
|
||||
changes: {
|
||||
from: 0,
|
||||
to: view.state.doc.length,
|
||||
insert: newValue
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// 监听主题变化，重新创建编辑器
|
||||
watch(isDark, () => {
|
||||
if (view) {
|
||||
view.destroy()
|
||||
const state = EditorState.create({
|
||||
doc: view.state.doc.toString(),
|
||||
extensions: createExtensions()
|
||||
})
|
||||
view = new EditorView({
|
||||
state,
|
||||
parent: editorContainer.value
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// 监听文件扩展名变化，重新创建编辑器
|
||||
watch(() => props.fileExtension, () => {
|
||||
if (view) {
|
||||
view.destroy()
|
||||
const state = EditorState.create({
|
||||
doc: view.state.doc.toString(),
|
||||
extensions: createExtensions()
|
||||
})
|
||||
view = new EditorView({
|
||||
state,
|
||||
parent: editorContainer.value
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
if (view) {
|
||||
view.destroy()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 全局语法高亮样式（适用于亮色主题） */
|
||||
.cm-editor:not(.cm-theme-dark) .tok-keyword {
|
||||
color: #d73a49;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-string {
|
||||
color: #032f62;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-number {
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-comment {
|
||||
color: #6a737d;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-function {
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-operator {
|
||||
color: #d73a49;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-class-name {
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-property {
|
||||
color: #e36209;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-tag {
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-attribute {
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-variableName {
|
||||
color: #e36209;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-variableName2 {
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.cm-editor:not(.cm-theme-dark) .tok-def {
|
||||
color: #6f42c1;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
.codemirror-editor {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
:deep(.cm-editor) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:deep(.cm-scroller) {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:deep(.cm-content) {
|
||||
padding: 8px;
|
||||
}
|
||||
</style>
|
||||
@@ -83,9 +83,19 @@
|
||||
</a-space>
|
||||
</a-card>
|
||||
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="12">
|
||||
<!-- 文件列表和内容区域 -->
|
||||
<div class="file-panels-container">
|
||||
<!-- 文件列表面板 -->
|
||||
<div
|
||||
class="file-panel-left"
|
||||
:style="{ width: filePanelWidth.left + '%' }"
|
||||
>
|
||||
<a-card size="small" title="文件列表">
|
||||
<template #extra>
|
||||
<span style="font-size: 12px; color: #999;">
|
||||
宽度: {{ filePanelWidth.left.toFixed(1) }}%
|
||||
</span>
|
||||
</template>
|
||||
<a-list
|
||||
:data="fileList"
|
||||
:loading="fileLoading"
|
||||
@@ -117,9 +127,29 @@
|
||||
</template>
|
||||
</a-list>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
</div>
|
||||
|
||||
<!-- 水平拖拽条 -->
|
||||
<div
|
||||
class="resize-handle-horizontal"
|
||||
@mousedown="startHorizontalResize"
|
||||
title="← 拖拽调整宽度 →"
|
||||
>
|
||||
<div class="resize-handle-bar-horizontal"></div>
|
||||
<div class="resize-handle-bar-horizontal"></div>
|
||||
</div>
|
||||
|
||||
<!-- 文件内容面板 -->
|
||||
<div
|
||||
class="file-panel-right"
|
||||
:style="{ width: filePanelWidth.right + '%' }"
|
||||
>
|
||||
<a-card size="small" title="文件内容">
|
||||
<template #extra>
|
||||
<span style="font-size: 12px; color: #999;">
|
||||
宽度: {{ filePanelWidth.right.toFixed(1) }}%
|
||||
</span>
|
||||
</template>
|
||||
<a-space direction="vertical" :size="8" style="width: 100%">
|
||||
<div
|
||||
class="file-content-wrapper"
|
||||
@@ -140,13 +170,14 @@
|
||||
</div>
|
||||
<a-space>
|
||||
<a-button type="primary" @click="readFile" :loading="fileLoading">读取文件</a-button>
|
||||
<a-button @click="writeFile" :loading="fileLoading">写入文件</a-button>
|
||||
<a-button @click="writeFile" :loading="fileLoading" v-if="canSaveFile">写入文件</a-button>
|
||||
<a-button danger @click="deleteFile" :loading="fileLoading">删除</a-button>
|
||||
<a-button @click="clearContent" v-if="canClearContent">清空</a-button>
|
||||
</a-space>
|
||||
</a-space>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</a-space>
|
||||
</a-card>
|
||||
|
||||
@@ -166,44 +197,91 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {computed, onMounted, ref, watch} from 'vue'
|
||||
import {computed, onMounted, ref} from 'vue'
|
||||
import {Message, Modal} from '@arco-design/web-vue'
|
||||
import {
|
||||
getSystemInfo,
|
||||
getCPUInfo,
|
||||
getMemoryInfo,
|
||||
getDiskInfo,
|
||||
getEnvVars,
|
||||
listDir,
|
||||
readFile as readFileApi,
|
||||
writeFile as writeFileApi,
|
||||
deletePath,
|
||||
getEnvVars
|
||||
readFile as readFileApi
|
||||
} from '@/api'
|
||||
|
||||
// localStorage 键名
|
||||
const STORAGE_KEYS = {
|
||||
FILE_PATH: 'device-test-file-path',
|
||||
FILE_LIST: 'device-test-file-list',
|
||||
FILE_CONTENT: 'device-test-file-content',
|
||||
PATH_HISTORY: 'device-test-path-history',
|
||||
FILE_CONTENT_HEIGHT: 'device-test-file-content-height',
|
||||
FAVORITE_FILES: 'device-test-favorite-files'
|
||||
// 导入公共工具函数和常量
|
||||
import { STORAGE_KEYS, DEFAULTS } from '@/utils/constants'
|
||||
import { formatBytes } from '@/utils/fileUtils'
|
||||
|
||||
// 导入 composables
|
||||
import { useFileOperations } from '@/composables/useFileOperations'
|
||||
import { useFavoriteFiles } from '@/composables/useFavoriteFiles'
|
||||
import { useLocalStorage } from '@/composables/useLocalStorage'
|
||||
|
||||
// ========== 使用 Composables ==========
|
||||
|
||||
// 文件操作
|
||||
const {
|
||||
filePath,
|
||||
fileContent,
|
||||
fileList,
|
||||
fileLoading,
|
||||
writeFile,
|
||||
deleteFile,
|
||||
} = useFileOperations({
|
||||
onSuccess: (operation, data) => {
|
||||
console.log(`[DeviceTest] ${operation} 成功:`, data)
|
||||
},
|
||||
onError: (operation, error) => {
|
||||
console.error(`[DeviceTest] ${operation} 失败:`, error)
|
||||
}
|
||||
})
|
||||
|
||||
// 收藏功能
|
||||
const {
|
||||
favoriteFiles,
|
||||
isFavorite,
|
||||
toggleFavorite,
|
||||
removeFavorite,
|
||||
} = useFavoriteFiles(STORAGE_KEYS.DEVICE_TEST.FAVORITE_FILES)
|
||||
|
||||
// localStorage管理
|
||||
const { storedValue: fileContentHeight } = useLocalStorage(
|
||||
STORAGE_KEYS.DEVICE_TEST.FILE_CONTENT_HEIGHT,
|
||||
DEFAULTS.DEFAULT_CONTENT_HEIGHT
|
||||
)
|
||||
|
||||
const { storedValue: filePanelWidth } = useLocalStorage(
|
||||
STORAGE_KEYS.DEVICE_TEST.PANEL_WIDTH,
|
||||
{ left: 50, right: 50 }
|
||||
)
|
||||
|
||||
const { storedValue: pathHistory } = useLocalStorage(
|
||||
STORAGE_KEYS.DEVICE_TEST.PATH_HISTORY,
|
||||
[]
|
||||
)
|
||||
|
||||
// ========== 立即清理旧的文件内容缓存 ==========
|
||||
// 在组件初始化之前清理，防止加载大文件导致空白
|
||||
try {
|
||||
const oldContent = localStorage.getItem(STORAGE_KEYS.DEVICE_TEST.FILE_CONTENT)
|
||||
if (oldContent) {
|
||||
console.log('[DeviceTest] 清理旧的文件内容缓存')
|
||||
localStorage.removeItem(STORAGE_KEYS.DEVICE_TEST.FILE_CONTENT)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('[DeviceTest] 清理缓存失败:', error)
|
||||
}
|
||||
|
||||
// ========== DeviceTest 特有功能 ==========
|
||||
|
||||
const systemInfo = ref(null)
|
||||
const cpuInfo = ref(null)
|
||||
const memoryInfo = ref(null)
|
||||
const diskInfo = ref(null)
|
||||
const filePath = ref('')
|
||||
const fileContent = ref('')
|
||||
const fileList = ref([])
|
||||
const fileLoading = ref(false)
|
||||
const envVars = ref(null)
|
||||
const envLoading = ref(false)
|
||||
const pathHistory = ref([]) // 路径历史记录
|
||||
const fileContentHeight = ref(200) // 文件内容区域高度（默认200px）
|
||||
const isResizing = ref(false) // 是否正在拖拽
|
||||
const favoriteFiles = ref([]) // 收藏的文件列表
|
||||
const isBinaryFile = ref(false) // 是否为二进制文件信息展示
|
||||
|
||||
const diskColumns = [
|
||||
{title: '设备', dataIndex: 'device', width: 120},
|
||||
@@ -227,6 +305,8 @@ const envTableData = computed(() => {
|
||||
}))
|
||||
})
|
||||
|
||||
// ========== 系统信息功能 ==========
|
||||
|
||||
const refreshSystemInfo = async () => {
|
||||
try {
|
||||
systemInfo.value = await getSystemInfo()
|
||||
@@ -239,6 +319,20 @@ const refreshSystemInfo = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
const loadEnvVars = async () => {
|
||||
envLoading.value = true
|
||||
try {
|
||||
envVars.value = await getEnvVars()
|
||||
} catch (error) {
|
||||
console.error('加载环境变量失败:', error)
|
||||
Message.error('加载环境变量失败: ' + (error.message || error))
|
||||
} finally {
|
||||
envLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// ========== 列出目录（重写以添加历史记录） ==========
|
||||
|
||||
const listDirectory = async () => {
|
||||
if (!filePath.value) {
|
||||
Message.error('请输入目录路径')
|
||||
@@ -259,81 +353,13 @@ const listDirectory = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 自动完成选择处理
|
||||
// ========== 路径操作 ==========
|
||||
|
||||
const onPathSelect = (value) => {
|
||||
filePath.value = value
|
||||
listDirectory()
|
||||
}
|
||||
|
||||
const readFile = async () => {
|
||||
if (!filePath.value) {
|
||||
Message.error('请输入文件路径')
|
||||
return
|
||||
}
|
||||
|
||||
// 添加到历史记录
|
||||
addToHistory(filePath.value)
|
||||
|
||||
fileLoading.value = true
|
||||
try {
|
||||
fileContent.value = await readFileApi(filePath.value)
|
||||
} catch (error) {
|
||||
console.error('读取文件失败:', error)
|
||||
Message.error('读取文件失败: ' + (error.message || error))
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const writeFile = async () => {
|
||||
if (!filePath.value) {
|
||||
Message.error('请输入文件路径')
|
||||
return
|
||||
}
|
||||
fileLoading.value = true
|
||||
try {
|
||||
await writeFileApi(filePath.value, fileContent.value)
|
||||
Message.success('文件写入成功')
|
||||
} catch (error) {
|
||||
console.error('写入文件失败:', error)
|
||||
Message.error('写入文件失败: ' + (error.message || error))
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const deleteFile = async () => {
|
||||
if (!filePath.value) {
|
||||
Message.error('请输入文件路径')
|
||||
return
|
||||
}
|
||||
|
||||
Modal.confirm({
|
||||
title: '确认删除',
|
||||
content: `确定要删除 ${filePath.value} 吗？`,
|
||||
onOk: async () => {
|
||||
fileLoading.value = true
|
||||
try {
|
||||
await deletePath(filePath.value)
|
||||
Message.success('删除成功')
|
||||
filePath.value = ''
|
||||
fileContent.value = ''
|
||||
fileList.value = []
|
||||
} catch (error) {
|
||||
console.error('删除失败:', error)
|
||||
Message.error('删除失败: ' + (error.message || error))
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const selectFile = (path) => {
|
||||
filePath.value = path
|
||||
addToHistory(path)
|
||||
}
|
||||
|
||||
const browseDirectory = () => {
|
||||
const path = prompt('请输入目录路径（例如: C:\\Users）')
|
||||
if (path) {
|
||||
@@ -342,161 +368,136 @@ const browseDirectory = () => {
|
||||
}
|
||||
}
|
||||
|
||||
const loadEnvVars = async () => {
|
||||
envLoading.value = true
|
||||
try {
|
||||
envVars.value = await getEnvVars()
|
||||
} catch (error) {
|
||||
console.error('加载环境变量失败:', error)
|
||||
Message.error('加载环境变量失败: ' + (error.message || error))
|
||||
} finally {
|
||||
envLoading.value = false
|
||||
}
|
||||
}
|
||||
// ========== 路径历史记录 ==========
|
||||
|
||||
const formatBytes = (bytes) => {
|
||||
if (!bytes) return '0 B'
|
||||
const unit = 1024
|
||||
if (bytes < unit) return bytes + ' B'
|
||||
const exp = Math.floor(Math.log(bytes) / Math.log(unit))
|
||||
return (bytes / Math.pow(unit, exp)).toFixed(2) + ' ' + 'KMGTPE'[exp - 1] + 'B'
|
||||
}
|
||||
|
||||
// 开始拖拽
|
||||
const startResize = (e) => {
|
||||
isResizing.value = true
|
||||
const startY = e.clientY
|
||||
const startHeight = fileContentHeight.value
|
||||
|
||||
const onMouseMove = (moveEvent) => {
|
||||
if (!isResizing.value) return
|
||||
|
||||
const deltaY = moveEvent.clientY - startY
|
||||
const newHeight = startHeight + deltaY
|
||||
|
||||
// 限制高度范围
|
||||
if (newHeight >= 100 && newHeight <= 800) {
|
||||
fileContentHeight.value = newHeight
|
||||
}
|
||||
}
|
||||
|
||||
const onMouseUp = () => {
|
||||
isResizing.value = false
|
||||
document.removeEventListener('mousemove', onMouseMove)
|
||||
document.removeEventListener('mouseup', onMouseUp)
|
||||
|
||||
// 保存高度到 localStorage
|
||||
saveToStorage(STORAGE_KEYS.FILE_CONTENT_HEIGHT, fileContentHeight.value.toString())
|
||||
}
|
||||
|
||||
document.addEventListener('mousemove', onMouseMove)
|
||||
document.addEventListener('mouseup', onMouseUp)
|
||||
}
|
||||
|
||||
// 从 localStorage 加载数据
|
||||
const loadFromStorage = () => {
|
||||
try {
|
||||
const savedPath = localStorage.getItem(STORAGE_KEYS.FILE_PATH)
|
||||
const savedFileList = localStorage.getItem(STORAGE_KEYS.FILE_LIST)
|
||||
const savedFileContent = localStorage.getItem(STORAGE_KEYS.FILE_CONTENT)
|
||||
const savedHistory = localStorage.getItem(STORAGE_KEYS.PATH_HISTORY)
|
||||
const savedHeight = localStorage.getItem(STORAGE_KEYS.FILE_CONTENT_HEIGHT)
|
||||
const savedFavorites = localStorage.getItem(STORAGE_KEYS.FAVORITE_FILES)
|
||||
|
||||
if (savedPath) filePath.value = savedPath
|
||||
if (savedFileList) fileList.value = JSON.parse(savedFileList)
|
||||
if (savedFileContent) fileContent.value = savedFileContent
|
||||
if (savedHistory) pathHistory.value = JSON.parse(savedHistory)
|
||||
if (savedFavorites) favoriteFiles.value = JSON.parse(savedFavorites)
|
||||
if (savedHeight) {
|
||||
const height = parseInt(savedHeight)
|
||||
if (!isNaN(height) && height >= 100 && height <= 800) {
|
||||
fileContentHeight.value = height
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('从 localStorage 加载数据失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 保存到 localStorage
|
||||
const saveToStorage = (key, value) => {
|
||||
try {
|
||||
if (typeof value === 'string') {
|
||||
localStorage.setItem(key, value)
|
||||
} else {
|
||||
localStorage.setItem(key, JSON.stringify(value))
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('保存到 localStorage 失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 添加到历史记录
|
||||
const addToHistory = (path) => {
|
||||
if (!path || path.trim() === '') return
|
||||
|
||||
// 移除重复项
|
||||
const index = pathHistory.value.indexOf(path)
|
||||
if (index > -1) {
|
||||
pathHistory.value.splice(index, 1)
|
||||
}
|
||||
|
||||
// 添加到开头
|
||||
pathHistory.value.unshift(path)
|
||||
|
||||
// 限制历史记录数量
|
||||
if (pathHistory.value.length > 20) {
|
||||
pathHistory.value = pathHistory.value.slice(0, 20)
|
||||
}
|
||||
|
||||
saveToStorage(STORAGE_KEYS.PATH_HISTORY, pathHistory.value)
|
||||
}
|
||||
|
||||
// 检查是否已收藏
|
||||
const isFavorite = (path) => {
|
||||
return favoriteFiles.value.some(fav => fav.path === path)
|
||||
}
|
||||
// ========== 文件选择（重写以添加历史记录） ==========
|
||||
|
||||
// 切换收藏状态
|
||||
const toggleFavorite = (item) => {
|
||||
const index = favoriteFiles.value.findIndex(fav => fav.path === item.path)
|
||||
const selectFile = (path) => {
|
||||
if (!path) return
|
||||
|
||||
if (index > -1) {
|
||||
// 已收藏，取消收藏
|
||||
favoriteFiles.value.splice(index, 1)
|
||||
Message.info('已取消收藏: ' + item.name)
|
||||
filePath.value = path
|
||||
addToHistory(path)
|
||||
|
||||
const item = fileList.value.find(f => f.path === path)
|
||||
|
||||
// 如果 fileList 为空或找不到该文件，尝试读取
|
||||
if (!item) {
|
||||
readFile()
|
||||
return
|
||||
}
|
||||
|
||||
if (item.is_dir) {
|
||||
listDirectory()
|
||||
} else {
|
||||
// 未收藏，添加收藏
|
||||
favoriteFiles.value.push({
|
||||
path: item.path,
|
||||
name: item.name,
|
||||
is_dir: item.is_dir
|
||||
})
|
||||
Message.success('已收藏: ' + item.name)
|
||||
}
|
||||
|
||||
// 保存到 localStorage
|
||||
saveToStorage(STORAGE_KEYS.FAVORITE_FILES, favoriteFiles.value)
|
||||
}
|
||||
|
||||
// 移除收藏
|
||||
const removeFavorite = (path) => {
|
||||
const index = favoriteFiles.value.findIndex(fav => fav.path === path)
|
||||
if (index > -1) {
|
||||
const name = favoriteFiles.value[index].name
|
||||
favoriteFiles.value.splice(index, 1)
|
||||
saveToStorage(STORAGE_KEYS.FAVORITE_FILES, favoriteFiles.value)
|
||||
Message.info('已取消收藏: ' + name)
|
||||
readFile()
|
||||
}
|
||||
}
|
||||
|
||||
// 打开收藏的文件
|
||||
// ========== 文件读取（重写以跳过二进制文件） ==========
|
||||
|
||||
const readFile = async () => {
|
||||
if (!filePath.value) {
|
||||
Message.error('请输入文件路径')
|
||||
return
|
||||
}
|
||||
|
||||
addToHistory(filePath.value)
|
||||
|
||||
// 检查文件扩展名
|
||||
const ext = filePath.value.split('.').pop()?.toLowerCase() || ''
|
||||
const binaryExts = ['exe', 'dll', 'so', 'dylib', 'zip', 'rar', '7z', 'tar', 'gz', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'mp3', 'mp4', 'avi', 'mkv', 'png', 'jpg', 'jpeg', 'gif', 'bmp', 'ico']
|
||||
|
||||
if (binaryExts.includes(ext)) {
|
||||
showBinaryFileInfo(ext)
|
||||
return
|
||||
}
|
||||
|
||||
fileLoading.value = true
|
||||
isBinaryFile.value = false // 标记为文本文件
|
||||
try {
|
||||
const content = await readFileApi(filePath.value)
|
||||
|
||||
// 检查文件大小（提高到2MB，合理的大文件支持）
|
||||
const maxDisplaySize = 2 * 1024 * 1024 // 2MB
|
||||
if (content.length > maxDisplaySize) {
|
||||
fileContent.value = content.substring(0, maxDisplaySize) + '\n\n... (文件过大，已截断，仅显示前 2MB) ...'
|
||||
// 大文件警告改为控制台日志
|
||||
console.warn(`文件过大 (${(content.length / 1024).toFixed(2)} KB)，已截断显示`)
|
||||
} else {
|
||||
fileContent.value = content
|
||||
}
|
||||
|
||||
// 文件读取成功，静默无提示
|
||||
} catch (error) {
|
||||
Message.error('读取文件失败: ' + error.message)
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// ========== 显示二进制文件信息 ==========
|
||||
|
||||
const showBinaryFileInfo = (ext) => {
|
||||
const file = fileList.value.find(f => f.path === filePath.value)
|
||||
if (!file) {
|
||||
Message.warning('无法找到文件信息')
|
||||
return
|
||||
}
|
||||
|
||||
// 设置为二进制文件信息展示状态
|
||||
isBinaryFile.value = true
|
||||
|
||||
const extDisplay = ext.toUpperCase()
|
||||
const sizeDisplay = formatBytes(file.size)
|
||||
|
||||
// 判断文件类型
|
||||
let fileType = '二进制文件'
|
||||
if (['png', 'jpg', 'jpeg', 'gif', 'bmp', 'ico'].includes(ext)) fileType = '图片文件'
|
||||
else if (['mp3', 'wav', 'flac'].includes(ext)) fileType = '音频文件'
|
||||
else if (['mp4', 'avi', 'mkv', 'mov'].includes(ext)) fileType = '视频文件'
|
||||
else if (['exe', 'dll', 'so'].includes(ext)) fileType = '可执行文件'
|
||||
else if (['zip', 'rar', '7z', 'tar', 'gz'].includes(ext)) fileType = '压缩文件'
|
||||
else if (['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'].includes(ext)) fileType = '文档文件'
|
||||
|
||||
fileContent.value = `╔════════════════════════════════════════════════════════════╗
|
||||
║ 📄 ${fileType} - ${extDisplay} ║
|
||||
╠════════════════════════════════════════════════════════════╣
|
||||
║ ║
|
||||
║ 📁 文件名: ${file.name.padEnd(40)}║
|
||||
║ 📂 完整路径: ${filePath.value} ║
|
||||
║ ║
|
||||
║ 📊 大小: ${sizeDisplay.padEnd(10)} (${file.size.toLocaleString()} 字节) ║
|
||||
║ 📅 修改时间: ${file.mod_time} ║
|
||||
║ 🏷️ 类型: ${fileType.padEnd(15)} (${extDisplay}) ║
|
||||
║ ║
|
||||
║ ℹ️ 这是二进制文件，不支持文本预览 ║
|
||||
║ 如需查看或编辑，请使用专门的工具 ║
|
||||
║ ║
|
||||
╚════════════════════════════════════════════════════════════╝`
|
||||
|
||||
Message.info(`已加载 ${fileType} 信息`)
|
||||
}
|
||||
|
||||
// ========== 打开收藏的文件 ==========
|
||||
|
||||
const openFavoriteFile = (path) => {
|
||||
filePath.value = path
|
||||
addToHistory(path)
|
||||
|
||||
// 判断是文件还是目录
|
||||
const fav = favoriteFiles.value.find(f => f.path === path)
|
||||
if (fav && fav.is_dir) {
|
||||
listDirectory()
|
||||
@@ -505,21 +506,83 @@ const openFavoriteFile = (path) => {
|
||||
}
|
||||
}
|
||||
|
||||
// 监听数据变化自动保存
|
||||
watch(filePath, (newPath) => {
|
||||
saveToStorage(STORAGE_KEYS.FILE_PATH, newPath)
|
||||
// ========== 计算属性：按钮显示控制 ==========
|
||||
|
||||
// 是否可以保存文件（只有文本文件可以保存）
|
||||
const canSaveFile = computed(() => {
|
||||
return !isBinaryFile.value && fileContent.value !== ''
|
||||
})
|
||||
|
||||
watch(fileContent, (newContent) => {
|
||||
saveToStorage(STORAGE_KEYS.FILE_CONTENT, newContent)
|
||||
// 是否可以清空内容
|
||||
const canClearContent = computed(() => {
|
||||
return !isBinaryFile.value && fileContent.value !== ''
|
||||
})
|
||||
|
||||
watch(fileList, (newList) => {
|
||||
saveToStorage(STORAGE_KEYS.FILE_LIST, newList)
|
||||
}, { deep: true })
|
||||
// ========== 拖拽调整高度 ==========
|
||||
|
||||
const startResize = (e) => {
|
||||
const startY = e.clientY
|
||||
const startHeight = fileContentHeight.value
|
||||
|
||||
const onMouseMove = (moveEvent) => {
|
||||
const deltaY = moveEvent.clientY - startY
|
||||
const newHeight = startHeight + deltaY
|
||||
|
||||
if (newHeight >= 100 && newHeight <= 800) {
|
||||
fileContentHeight.value = newHeight
|
||||
}
|
||||
}
|
||||
|
||||
const onMouseUp = () => {
|
||||
document.removeEventListener('mousemove', onMouseMove)
|
||||
document.removeEventListener('mouseup', onMouseUp)
|
||||
localStorage.setItem(
|
||||
STORAGE_KEYS.DEVICE_TEST.FILE_CONTENT_HEIGHT,
|
||||
fileContentHeight.value.toString()
|
||||
)
|
||||
}
|
||||
|
||||
document.addEventListener('mousemove', onMouseMove)
|
||||
document.addEventListener('mouseup', onMouseUp)
|
||||
}
|
||||
|
||||
// ========== 水平拖拽调整面板宽度 ==========
|
||||
|
||||
const startHorizontalResize = (e) => {
|
||||
const container = e.target.closest('.file-panels-container')
|
||||
if (!container) return
|
||||
|
||||
const startX = e.clientX
|
||||
const containerWidth = container.offsetWidth
|
||||
const startLeftWidth = (filePanelWidth.value.left / 100) * containerWidth
|
||||
|
||||
const onMouseMove = (moveEvent) => {
|
||||
const deltaX = moveEvent.clientX - startX
|
||||
const newLeftWidth = startLeftWidth + deltaX
|
||||
const newLeftPercent = (newLeftWidth / containerWidth) * 100
|
||||
|
||||
if (newLeftPercent >= 20 && newLeftPercent <= 80) {
|
||||
filePanelWidth.value.left = newLeftPercent
|
||||
filePanelWidth.value.right = 100 - newLeftPercent
|
||||
}
|
||||
}
|
||||
|
||||
const onMouseUp = () => {
|
||||
document.removeEventListener('mousemove', onMouseMove)
|
||||
document.removeEventListener('mouseup', onMouseUp)
|
||||
localStorage.setItem(
|
||||
STORAGE_KEYS.DEVICE_TEST.PANEL_WIDTH,
|
||||
JSON.stringify(filePanelWidth.value)
|
||||
)
|
||||
}
|
||||
|
||||
document.addEventListener('mousemove', onMouseMove)
|
||||
document.addEventListener('mouseup', onMouseUp)
|
||||
}
|
||||
|
||||
// ========== 初始化 ==========
|
||||
|
||||
onMounted(() => {
|
||||
loadFromStorage()
|
||||
refreshSystemInfo()
|
||||
})
|
||||
</script>
|
||||
@@ -535,6 +598,78 @@ onMounted(() => {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
/* 文件面板容器 */
|
||||
.file-panels-container {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
align-items: stretch;
|
||||
min-height: 400px;
|
||||
}
|
||||
|
||||
/* 左侧面板 */
|
||||
.file-panel-left {
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 右侧面板 */
|
||||
.file-panel-right {
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 水平拖拽手柄 */
|
||||
.resize-handle-horizontal {
|
||||
width: 8px;
|
||||
cursor: col-resize;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: transparent;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
margin-left: -4px;
|
||||
margin-right: -4px;
|
||||
}
|
||||
|
||||
.resize-handle-horizontal::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 3px;
|
||||
height: 100%;
|
||||
background: var(--color-border-2);
|
||||
border-left: 1px solid var(--color-border-2);
|
||||
border-right: 1px solid var(--color-border-2);
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.resize-handle-horizontal:hover::before {
|
||||
background: var(--color-fill-2);
|
||||
border-color: rgb(var(--primary-6));
|
||||
}
|
||||
|
||||
.resize-handle-horizontal::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 2px;
|
||||
height: 40px;
|
||||
background: var(--color-border-3);
|
||||
border-radius: 1px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
|
||||
.resize-handle-horizontal:hover::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 水平拖拽手柄的视觉指示条（已删除，改用 ::after 伪元素）*/
|
||||
|
||||
/* 文件内容区域容器 */
|
||||
.file-content-wrapper {
|
||||
position: relative;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -383,14 +383,18 @@ onMounted(async () => {
|
||||
await loadConfig()
|
||||
|
||||
// 监听下载进度事件
|
||||
window.EventsOn('download-progress', onDownloadProgress)
|
||||
window.EventsOn('download-complete', onDownloadComplete)
|
||||
if (window.runtime?.EventsOn) {
|
||||
window.runtime.EventsOn('download-progress', onDownloadProgress)
|
||||
window.runtime.EventsOn('download-complete', onDownloadComplete)
|
||||
}
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
// 取消事件监听
|
||||
window.EventsOff('download-progress')
|
||||
window.EventsOff('download-complete')
|
||||
if (window.runtime?.EventsOff) {
|
||||
window.runtime.EventsOff('download-progress')
|
||||
window.runtime.EventsOff('download-complete')
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
272
web/src/composables/useFavoriteFiles.js
Normal file
272
web/src/composables/useFavoriteFiles.js
Normal file
@@ -0,0 +1,272 @@
|
||||
/**
|
||||
* 收藏夹管理 composable
|
||||
*
|
||||
* @module composables/useFavoriteFiles
|
||||
* @description 封装收藏夹的增删改查逻辑，支持持久化存储
|
||||
*/
|
||||
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { Message } from '@arco-design/web-vue'
|
||||
import { useLocalStorage } from './useLocalStorage'
|
||||
|
||||
/**
|
||||
* 收藏夹 composable
|
||||
* @param {string} storageKey - localStorage 键名
|
||||
* @param {Object} [options] - 配置选项
|
||||
* @param {number} [options.maxLength=50] - 最大收藏数量
|
||||
* @param {Function} [options.onAdd] - 添加收藏回调
|
||||
* @param {Function} [options.onRemove] - 移除收藏回调
|
||||
* @returns {UseFavoriteFilesReturn} 收藏夹操作API
|
||||
*
|
||||
* @example
|
||||
* const {
|
||||
* favoriteFiles,
|
||||
* isFavorite,
|
||||
* toggleFavorite,
|
||||
* removeFavorite,
|
||||
* clearAll
|
||||
* } = useFavoriteFiles('app-favorites')
|
||||
*
|
||||
* // 在模板中使用
|
||||
* <a-button @click="toggleFavorite(file)">
|
||||
* <icon-star-fill v-if="isFavorite(file.path)" />
|
||||
* <icon-star v-else />
|
||||
* </a-button>
|
||||
*/
|
||||
export function useFavoriteFiles(storageKey, options = {}) {
|
||||
const {
|
||||
maxLength = 50,
|
||||
onAdd = () => {},
|
||||
onRemove = () => {},
|
||||
} = options
|
||||
|
||||
// 使用 localStorage composable 管理收藏列表
|
||||
const { storedValue: favoriteFiles, load, save } = useLocalStorage(
|
||||
storageKey,
|
||||
[]
|
||||
)
|
||||
|
||||
/**
|
||||
* 判断文件/目录是否已收藏
|
||||
* @param {string} path - 文件/目录路径
|
||||
* @returns {boolean} 是否已收藏
|
||||
*/
|
||||
const isFavorite = (path) => {
|
||||
if (!path || !Array.isArray(favoriteFiles.value)) {
|
||||
return false
|
||||
}
|
||||
return favoriteFiles.value.some(fav => fav.path === path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 切换收藏状态
|
||||
* @param {Object} item - 文件/目录信息
|
||||
* @param {string} item.path - 路径
|
||||
* @param {string} item.name - 名称
|
||||
* @param {boolean} item.is_dir - 是否为目录
|
||||
* @returns {boolean} 操作后是否为收藏状态
|
||||
*/
|
||||
const toggleFavorite = (item) => {
|
||||
if (!item || !item.path) {
|
||||
Message.warning('无效的文件信息')
|
||||
return false
|
||||
}
|
||||
|
||||
const index = favoriteFiles.value.findIndex(fav => fav.path === item.path)
|
||||
|
||||
if (index > -1) {
|
||||
// 已收藏，执行取消收藏
|
||||
favoriteFiles.value.splice(index, 1)
|
||||
save(favoriteFiles.value)
|
||||
|
||||
onRemove(item)
|
||||
Message.info(`已取消收藏: ${item.name}`)
|
||||
return false
|
||||
} else {
|
||||
// 未收藏，执行添加收藏
|
||||
if (favoriteFiles.value.length >= maxLength) {
|
||||
Message.warning(`收藏夹已满，最多只能收藏 ${maxLength} 项`)
|
||||
return false
|
||||
}
|
||||
|
||||
favoriteFiles.value.push({
|
||||
path: item.path,
|
||||
name: item.name,
|
||||
is_dir: item.is_dir || false,
|
||||
created_at: Date.now(), // 添加时间戳
|
||||
})
|
||||
|
||||
save(favoriteFiles.value)
|
||||
|
||||
onAdd(item)
|
||||
Message.success(`已收藏: ${item.name}`)
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 移除收藏
|
||||
* @param {string} path - 文件/目录路径
|
||||
* @returns {boolean} 是否成功移除
|
||||
*/
|
||||
const removeFavorite = (path) => {
|
||||
if (!path) {
|
||||
Message.warning('请提供有效的路径')
|
||||
return false
|
||||
}
|
||||
|
||||
const index = favoriteFiles.value.findIndex(fav => fav.path === path)
|
||||
|
||||
if (index === -1) {
|
||||
Message.warning('该路径不在收藏夹中')
|
||||
return false
|
||||
}
|
||||
|
||||
const item = favoriteFiles.value[index]
|
||||
favoriteFiles.value.splice(index, 1)
|
||||
|
||||
save(favoriteFiles.value)
|
||||
|
||||
onRemove(item)
|
||||
Message.info(`已取消收藏: ${item.name}`)
|
||||
return true
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开收藏的文件/目录
|
||||
* @param {string} path - 文件/目录路径
|
||||
* @param {Function} onOpen - 打开回调函数
|
||||
* @returns {Promise<boolean>} 是否成功打开
|
||||
*/
|
||||
const openFavorite = async (path, onOpen) => {
|
||||
if (!path || !onOpen) {
|
||||
return false
|
||||
}
|
||||
|
||||
const item = favoriteFiles.value.find(fav => fav.path === path)
|
||||
if (!item) {
|
||||
Message.warning('收藏项不存在')
|
||||
return false
|
||||
}
|
||||
|
||||
return await onOpen(item)
|
||||
}
|
||||
|
||||
/**
|
||||
* 清空所有收藏
|
||||
* @param {boolean} [confirm=true] - 是否需要确认
|
||||
* @returns {boolean} 是否成功清空
|
||||
*/
|
||||
const clearAll = (confirm = true) => {
|
||||
const executeClear = () => {
|
||||
const count = favoriteFiles.value.length
|
||||
favoriteFiles.value = []
|
||||
save([])
|
||||
|
||||
Message.success(`已清空 ${count} 个收藏项`)
|
||||
return true
|
||||
}
|
||||
|
||||
if (!confirm) {
|
||||
return executeClear()
|
||||
}
|
||||
|
||||
// 使用原生 confirm（简单场景）
|
||||
if (window.confirm(`确定要清空所有 ${favoriteFiles.value.length} 个收藏项吗？`)) {
|
||||
return executeClear()
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取收藏列表（按创建时间排序）
|
||||
* @param {string} [order='desc'] - 排序方式：'asc'或'desc'
|
||||
* @returns {Array} 排序后的收藏列表
|
||||
*/
|
||||
const getSortedFavorites = (order = 'desc') => {
|
||||
const sorted = [...favoriteFiles.value]
|
||||
sorted.sort((a, b) => {
|
||||
const timeA = a.created_at || 0
|
||||
const timeB = b.created_at || 0
|
||||
return order === 'desc' ? timeB - timeA : timeA - timeB
|
||||
})
|
||||
return sorted
|
||||
}
|
||||
|
||||
/**
|
||||
* 按名称搜索收藏
|
||||
* @param {string} keyword - 搜索关键词
|
||||
* @returns {Array} 匹配的收藏列表
|
||||
*/
|
||||
const searchFavorites = (keyword) => {
|
||||
if (!keyword || !keyword.trim()) {
|
||||
return favoriteFiles.value
|
||||
}
|
||||
|
||||
const lowerKeyword = keyword.toLowerCase().trim()
|
||||
return favoriteFiles.value.filter(fav =>
|
||||
fav.name.toLowerCase().includes(lowerKeyword) ||
|
||||
fav.path.toLowerCase().includes(lowerKeyword)
|
||||
)
|
||||
}
|
||||
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
load()
|
||||
})
|
||||
|
||||
return {
|
||||
// 状态
|
||||
favoriteFiles,
|
||||
|
||||
// 方法
|
||||
isFavorite,
|
||||
toggleFavorite,
|
||||
removeFavorite,
|
||||
openFavorite,
|
||||
clearAll,
|
||||
getSortedFavorites,
|
||||
searchFavorites,
|
||||
load,
|
||||
save,
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @typedef {Object} UseFavoriteFilesReturn
|
||||
* @property {Ref<Array>} favoriteFiles - 收藏列表
|
||||
* @property {Function} isFavorite - 判断是否已收藏
|
||||
* @property {Function} toggleFavorite - 切换收藏状态
|
||||
* @property {Function} removeFavorite - 移除收藏
|
||||
* @property {Function} openFavorite - 打开收藏项
|
||||
* @property {Function} clearAll - 清空所有收藏
|
||||
* @property {Function} getSortedFavorites - 获取排序后的列表
|
||||
* @property {Function} searchFavorites - 搜索收藏
|
||||
* @property {Function} load - 手动加载数据
|
||||
* @property {Function} save - 手动保存数据
|
||||
*/
|
||||
|
||||
/**
|
||||
* 创建多个收藏夹管理实例
|
||||
* @param {Object} config - 配置对象
|
||||
* @returns {Object} 收藏夹管理实例集合
|
||||
*
|
||||
* @example
|
||||
* const {
|
||||
* filesystemFavs,
|
||||
* deviceTestFavs
|
||||
* } = createMultipleFavorites({
|
||||
* filesystem: 'app-filesystem-favorites',
|
||||
* deviceTest: 'app-device-test-favorites'
|
||||
* })
|
||||
*/
|
||||
export function createMultipleFavorites(config) {
|
||||
const result = {}
|
||||
|
||||
Object.keys(config).forEach(key => {
|
||||
result[key] = useFavoriteFiles(config[key])
|
||||
})
|
||||
|
||||
return result
|
||||
}
|
||||
372
web/src/composables/useFileOperations.js
Normal file
372
web/src/composables/useFileOperations.js
Normal file
@@ -0,0 +1,372 @@
|
||||
/**
|
||||
* 文件操作逻辑封装
|
||||
*
|
||||
* @module composables/useFileOperations
|
||||
* @description 封装所有文件操作逻辑，提供统一的错误处理和状态管理
|
||||
*/
|
||||
|
||||
import { ref, watch } from 'vue'
|
||||
import { Message, Modal } from '@arco-design/web-vue'
|
||||
import {
|
||||
listDir,
|
||||
readFile as readFileApi,
|
||||
writeFile as writeFileApi,
|
||||
deletePath as deletePathApi,
|
||||
} from '@/api'
|
||||
|
||||
/**
|
||||
* LocalStorage 键名
|
||||
*/
|
||||
const STORAGE_KEY_LAST_PATH = 'app-filesystem-last-path'
|
||||
|
||||
/**
|
||||
* 文件操作 composable
|
||||
* @param {Object} [options] - 配置选项
|
||||
* @param {Function} [options.onSuccess] - 操作成功回调
|
||||
* @param {Function} [options.onError] - 操作失败回调
|
||||
* @returns {UseFileOperationsReturn} 文件操作API
|
||||
*
|
||||
* @example
|
||||
* const {
|
||||
* filePath,
|
||||
* fileContent,
|
||||
* fileList,
|
||||
* fileLoading,
|
||||
* listDirectory,
|
||||
* readFile,
|
||||
* writeFile,
|
||||
* deleteFile
|
||||
* } = useFileOperations({
|
||||
* onSuccess: (operation, data) => console.log(operation, data),
|
||||
* onError: (operation, error) => console.error(operation, error)
|
||||
* })
|
||||
*/
|
||||
export function useFileOperations(options = {}) {
|
||||
const { onSuccess = () => {}, onError = () => {} } = options
|
||||
|
||||
// ========== 响应式状态 ==========
|
||||
|
||||
/**
|
||||
* 当前文件/目录路径
|
||||
* @type {Ref<string>}
|
||||
*/
|
||||
// 从 localStorage 恢复上次路径
|
||||
const savedPath = localStorage.getItem(STORAGE_KEY_LAST_PATH)
|
||||
const filePath = ref(savedPath || '')
|
||||
|
||||
/**
|
||||
* 文件内容
|
||||
* @type {Ref<string>}
|
||||
*/
|
||||
const fileContent = ref('')
|
||||
|
||||
/**
|
||||
* 文件列表
|
||||
* @type {Ref<Array>}
|
||||
*/
|
||||
const fileList = ref([])
|
||||
|
||||
/**
|
||||
* 加载状态
|
||||
* @type {Ref<boolean>}
|
||||
*/
|
||||
const fileLoading = ref(false)
|
||||
|
||||
/**
|
||||
* 正在删除状态（防止并发删除）
|
||||
* @type {Ref<boolean>}
|
||||
*/
|
||||
const isDeleting = ref(false)
|
||||
|
||||
// ========== 文件操作方法 ==========
|
||||
|
||||
/**
|
||||
* 列出目录内容
|
||||
* @param {string} [path] - 目录路径，不传则使用当前路径
|
||||
* @returns {Promise<boolean>} 是否成功
|
||||
*/
|
||||
const listDirectory = async (path) => {
|
||||
const targetPath = path || filePath.value
|
||||
|
||||
if (!targetPath) {
|
||||
Message.error('请输入目录路径')
|
||||
return false
|
||||
}
|
||||
|
||||
fileLoading.value = true
|
||||
try {
|
||||
const result = await listDir(targetPath)
|
||||
fileList.value = result
|
||||
|
||||
if (!path) {
|
||||
// 如果没有传参，更新当前路径
|
||||
filePath.value = targetPath
|
||||
}
|
||||
|
||||
onSuccess('listDirectory', { path: targetPath, count: result.length })
|
||||
return true
|
||||
} catch (error) {
|
||||
onError('listDirectory', error)
|
||||
Message.error(`列出目录失败: ${error.message || error}`)
|
||||
return false
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取文件内容
|
||||
* @param {string} [path] - 文件路径，不传则使用当前路径
|
||||
* @returns {Promise<boolean>} 是否成功
|
||||
*/
|
||||
const readFile = async (path) => {
|
||||
const targetPath = path || filePath.value
|
||||
|
||||
if (!targetPath) {
|
||||
Message.error('请输入文件路径')
|
||||
return false
|
||||
}
|
||||
|
||||
fileLoading.value = true
|
||||
try {
|
||||
const content = await readFileApi(targetPath)
|
||||
fileContent.value = content
|
||||
|
||||
if (!path) {
|
||||
filePath.value = targetPath
|
||||
}
|
||||
|
||||
onSuccess('readFile', { path: targetPath })
|
||||
// 文件读取成功，静默无提示
|
||||
return true
|
||||
} catch (error) {
|
||||
onError('readFile', error)
|
||||
Message.error(`读取文件失败: ${error.message || error}`)
|
||||
return false
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 写入文件内容
|
||||
* @param {string} [content] - 要写入的内容，不传则使用当前内容
|
||||
* @param {string} [path] - 文件路径，不传则使用当前路径
|
||||
* @param {string} [fileName] - 文件名，用于成功提示显示
|
||||
* @param {boolean} [isShortcut=false] - 是否是快捷键触发（快捷键不显示提示）
|
||||
* @returns {Promise<boolean>} 是否成功
|
||||
*/
|
||||
const writeFile = async (content, path, fileName, isShortcut = false) => {
|
||||
// 忽略事件对象（当点击按钮时 Vue 会传递事件对象）
|
||||
const targetContent = (content !== undefined && typeof content === 'string') ? content : fileContent.value
|
||||
const targetPath = (path !== undefined && typeof path === 'string') ? path : filePath.value
|
||||
|
||||
if (!targetPath) {
|
||||
Message.error('请输入文件路径')
|
||||
return false
|
||||
}
|
||||
|
||||
fileLoading.value = true
|
||||
try {
|
||||
await writeFileApi(targetPath, targetContent)
|
||||
|
||||
if (content !== undefined) {
|
||||
fileContent.value = targetContent
|
||||
}
|
||||
if (path) {
|
||||
filePath.value = path
|
||||
}
|
||||
|
||||
onSuccess('writeFile', { path: targetPath })
|
||||
|
||||
// 差异化反馈：快捷键不显示提示，按钮点击显示轻提示
|
||||
if (!isShortcut) {
|
||||
// 按钮点击保存：显示轻量 Toast 提示
|
||||
if (fileName && typeof fileName === 'string') {
|
||||
Message.success({
|
||||
content: `✓ ${fileName} 已保存`,
|
||||
duration: 1500, // 1.5秒后自动消失
|
||||
position: 'bottom' // 底部显示，不打断操作
|
||||
})
|
||||
} else {
|
||||
Message.success({
|
||||
content: '文件已保存',
|
||||
duration: 1500,
|
||||
position: 'bottom'
|
||||
})
|
||||
}
|
||||
}
|
||||
// 快捷键保存：无提示（静默成功）
|
||||
|
||||
return true
|
||||
} catch (error) {
|
||||
onError('writeFile', error)
|
||||
// 保存失败：总是显示醒目错误提示（需手动关闭）
|
||||
Message.error({
|
||||
content: `文件保存失败: ${error.message || error}`,
|
||||
duration: 5000, // 错误提示显示更久
|
||||
closable: true // 允许手动关闭
|
||||
})
|
||||
return false
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除文件或目录
|
||||
* 🔒 安全修复：移除 confirm 参数，始终需要用户确认，防止绕过
|
||||
* 🔒 安全修复：添加并发删除检查，防止批量删除攻击
|
||||
* @param {string} [path] - 文件路径，不传则使用当前路径
|
||||
* @returns {Promise<boolean>} 用户是否确认及操作是否成功
|
||||
*/
|
||||
const deleteFile = async (path) => {
|
||||
const targetPath = path || filePath.value
|
||||
|
||||
if (!targetPath) {
|
||||
Message.error('请输入文件路径')
|
||||
return false
|
||||
}
|
||||
|
||||
// 🔒 安全修复：添加调用频率限制（防止批量删除攻击）
|
||||
if (isDeleting.value) {
|
||||
Message.warning('正在删除中，请稍候...')
|
||||
return false
|
||||
}
|
||||
|
||||
const executeDelete = async () => {
|
||||
isDeleting.value = true
|
||||
fileLoading.value = true
|
||||
try {
|
||||
await deletePathApi(targetPath)
|
||||
|
||||
// 清空状态
|
||||
filePath.value = ''
|
||||
fileContent.value = ''
|
||||
fileList.value = []
|
||||
|
||||
onSuccess('deleteFile', { path: targetPath })
|
||||
Message.success('删除成功')
|
||||
return true
|
||||
} catch (error) {
|
||||
onError('deleteFile', error)
|
||||
Message.error(`删除失败: ${error.message || error}`)
|
||||
return false
|
||||
} finally {
|
||||
fileLoading.value = false
|
||||
isDeleting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 🔒 安全修复：始终显示确认对话框，无法绕过
|
||||
return new Promise((resolve) => {
|
||||
Modal.confirm({
|
||||
title: '⚠️ 确认删除',
|
||||
content: `确定要删除 ${targetPath} 吗？此操作不可恢复！`,
|
||||
okText: '确定删除',
|
||||
cancelText: '取消',
|
||||
okButtonProps: { status: 'danger' }, // 红色按钮提醒危险
|
||||
onOk: async () => {
|
||||
const result = await executeDelete()
|
||||
resolve(result)
|
||||
},
|
||||
onCancel: () => {
|
||||
resolve(false)
|
||||
},
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 选择文件（智能判断是文件还是目录）
|
||||
* @param {string} path - 文件/目录路径
|
||||
* @param {Array} fileListData - 文件列表数据
|
||||
* @returns {Promise<boolean>} 是否成功
|
||||
*/
|
||||
const selectFile = async (path, fileListData) => {
|
||||
if (!path) return false
|
||||
|
||||
filePath.value = path
|
||||
|
||||
// 从文件列表中查找该项
|
||||
const item = fileListData.find(f => f.path === path)
|
||||
|
||||
if (!item) {
|
||||
// 如果列表中找不到，尝试根据路径判断
|
||||
// 简单判断：路径以 / 或 \ 结尾可能是目录
|
||||
const isDir = path.endsWith('/') || path.endsWith('\\')
|
||||
if (isDir) {
|
||||
return await listDirectory(path)
|
||||
} else {
|
||||
return await readFile(path)
|
||||
}
|
||||
}
|
||||
|
||||
if (item.is_dir) {
|
||||
// 是目录，列出内容
|
||||
return await listDirectory(path)
|
||||
} else {
|
||||
// 是文件，读取内容
|
||||
return await readFile(path)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 清空所有状态
|
||||
*/
|
||||
const clearAll = () => {
|
||||
filePath.value = ''
|
||||
fileContent.value = ''
|
||||
fileList.value = []
|
||||
}
|
||||
|
||||
// ========== 持久化 ==========
|
||||
|
||||
/**
|
||||
* 监听路径变化，自动保存到 localStorage
|
||||
* 用于下次启动时恢复上次访问的路径
|
||||
*/
|
||||
watch(filePath, (newPath) => {
|
||||
try {
|
||||
if (newPath) {
|
||||
localStorage.setItem(STORAGE_KEY_LAST_PATH, newPath)
|
||||
} else {
|
||||
localStorage.removeItem(STORAGE_KEY_LAST_PATH)
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn('[useFileOperations] 保存路径失败:', e)
|
||||
}
|
||||
})
|
||||
|
||||
// ========== 返回公共API ==========
|
||||
|
||||
return {
|
||||
// 状态
|
||||
filePath,
|
||||
fileContent,
|
||||
fileList,
|
||||
fileLoading,
|
||||
|
||||
// 方法
|
||||
listDirectory,
|
||||
readFile,
|
||||
writeFile,
|
||||
deleteFile,
|
||||
selectFile,
|
||||
clearAll,
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @typedef {Object} UseFileOperationsReturn
|
||||
* @property {Ref<string>} filePath - 当前文件路径
|
||||
* @property {Ref<string>} fileContent - 文件内容
|
||||
* @property {Ref<Array>} fileList - 文件列表
|
||||
* @property {Ref<boolean>} fileLoading - 加载状态
|
||||
* @property {Function} listDirectory - 列出目录
|
||||
* @property {Function} readFile - 读取文件
|
||||
* @property {Function} writeFile - 写入文件
|
||||
* @property {Function} deleteFile - 删除文件
|
||||
* @property {Function} selectFile - 智能选择文件
|
||||
* @property {Function} clearAll - 清空所有状态
|
||||
*/
|
||||
258
web/src/composables/useLocalStorage.js
Normal file
258
web/src/composables/useLocalStorage.js
Normal file
@@ -0,0 +1,258 @@
|
||||
/**
|
||||
* localStorage 响应式封装
|
||||
*
|
||||
* @module composables/useLocalStorage
|
||||
* @description 提供响应式的 localStorage 数据持久化能力，自动同步数据变化
|
||||
*/
|
||||
|
||||
import { ref, watch, onMounted } from 'vue'
|
||||
|
||||
/**
|
||||
* 创建响应式的 localStorage 绑定
|
||||
* @param {string} key - localStorage 键名
|
||||
* @param {*} defaultValue - 默认值
|
||||
* @param {Object} [options] - 配置选项
|
||||
* @param {boolean} [options.deep=true] - 是否深度监听对象变化
|
||||
* @param {boolean} [options.immediate=true] - 是否立即加载
|
||||
* @returns {UseLocalStorageReturn} 响应式数据和操作方法
|
||||
*
|
||||
* @example
|
||||
* // 基础用法
|
||||
* const { storedValue, load, save, clear } = useLocalStorage('app-user-name', 'Guest')
|
||||
*
|
||||
* // 对象用法
|
||||
* const { storedValue } = useLocalStorage('app-settings', { theme: 'light' })
|
||||
*
|
||||
* @see {@link https://vueuse.org/core/useLocalStorage/} 参考 VueUse 的实现
|
||||
*/
|
||||
export function useLocalStorage(key, defaultValue, options = {}) {
|
||||
const {
|
||||
deep = true, // 深度监听
|
||||
immediate = true, // 立即加载
|
||||
serializer = JSON, // 序列化器
|
||||
onError = (error) => console.error('localStorage操作失败:', error),
|
||||
} = options
|
||||
|
||||
// 响应式数据
|
||||
const storedValue = ref(defaultValue)
|
||||
|
||||
/**
|
||||
* 从 localStorage 加载数据
|
||||
* @returns {boolean} 是否加载成功
|
||||
*/
|
||||
const load = () => {
|
||||
try {
|
||||
const item = localStorage.getItem(key)
|
||||
if (item === null || item === undefined) {
|
||||
storedValue.value = defaultValue
|
||||
return false
|
||||
}
|
||||
|
||||
// 解析数据
|
||||
const parsed = serializer.parse(item)
|
||||
storedValue.value = parsed
|
||||
return true
|
||||
} catch (error) {
|
||||
onError(error)
|
||||
storedValue.value = defaultValue
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存数据到 localStorage
|
||||
* @param {*} value - 要保存的值
|
||||
* @returns {boolean} 是否保存成功
|
||||
*/
|
||||
const save = (value) => {
|
||||
try {
|
||||
const serialized = serializer.stringify(value)
|
||||
localStorage.setItem(key, serialized)
|
||||
return true
|
||||
} catch (error) {
|
||||
onError(error)
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除 localStorage 中的数据
|
||||
* @returns {boolean} 是否清除成功
|
||||
*/
|
||||
const clear = () => {
|
||||
try {
|
||||
localStorage.removeItem(key)
|
||||
storedValue.value = defaultValue
|
||||
return true
|
||||
} catch (error) {
|
||||
onError(error)
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 监听数据变化自动保存
|
||||
watch(
|
||||
storedValue,
|
||||
(newValue) => {
|
||||
save(newValue)
|
||||
},
|
||||
{ deep }
|
||||
)
|
||||
|
||||
// 组件挂载时加载数据
|
||||
if (immediate) {
|
||||
onMounted(() => {
|
||||
load()
|
||||
})
|
||||
}
|
||||
|
||||
return {
|
||||
/**
|
||||
* 响应式数据值
|
||||
* @type {Ref<any>}
|
||||
*/
|
||||
storedValue,
|
||||
|
||||
/**
|
||||
* 手动加载数据
|
||||
* @type {() => boolean}
|
||||
*/
|
||||
load,
|
||||
|
||||
/**
|
||||
* 手动保存数据
|
||||
* @type {(value: any) => boolean}
|
||||
*/
|
||||
save,
|
||||
|
||||
/**
|
||||
* 清除数据
|
||||
* @type {() => boolean}
|
||||
*/
|
||||
clear,
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @typedef {Object} UseLocalStorageReturn
|
||||
* @property {Ref<any>} storedValue - 响应式数据
|
||||
* @property {() => boolean} load - 手动加载函数
|
||||
* @property {(value: any) => boolean} save - 手动保存函数
|
||||
* @property {() => boolean} clear - 清除数据函数
|
||||
*/
|
||||
|
||||
/**
|
||||
* 批量管理多个 localStorage 键
|
||||
* @param {Object} config - 配置对象，键为localStorage键名，值为默认值
|
||||
* @returns {Object} 响应式数据对象
|
||||
*
|
||||
* @example
|
||||
* const {
|
||||
* theme: themeRef,
|
||||
* language: languageRef,
|
||||
* settings: settingsRef
|
||||
* } = useMultiLocalStorage({
|
||||
* 'app-theme': 'light',
|
||||
* 'app-language': 'zh-CN',
|
||||
* 'app-settings': { fontSize: 14 }
|
||||
* })
|
||||
*/
|
||||
export function useMultiLocalStorage(config) {
|
||||
const result = {}
|
||||
|
||||
Object.keys(config).forEach(key => {
|
||||
const { storedValue } = useLocalStorage(key, config[key])
|
||||
result[key] = storedValue
|
||||
})
|
||||
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* localStorage 辅助工具函数
|
||||
*/
|
||||
export const localStorageHelpers = {
|
||||
/**
|
||||
* 检查 localStorage 是否可用
|
||||
* @returns {boolean}
|
||||
*/
|
||||
isAvailable() {
|
||||
try {
|
||||
const test = '__localStorage_test__'
|
||||
localStorage.setItem(test, test)
|
||||
localStorage.removeItem(test)
|
||||
return true
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取 localStorage 使用大小（近似值）
|
||||
* @returns {number} 大小（字节）
|
||||
*/
|
||||
getSize() {
|
||||
let total = 0
|
||||
for (let key in localStorage) {
|
||||
if (localStorage.hasOwnProperty(key)) {
|
||||
total += localStorage[key].length + key.length
|
||||
}
|
||||
}
|
||||
return total
|
||||
},
|
||||
|
||||
/**
|
||||
* 清空所有 localStorage 数据（谨慎使用）
|
||||
* @param {string[]} [excludeKeys] - 要排除的键名列表
|
||||
*/
|
||||
clearAll(excludeKeys = []) {
|
||||
const keysToRemove = []
|
||||
for (let i = 0; i < localStorage.length; i++) {
|
||||
const key = localStorage.key(i)
|
||||
if (!excludeKeys.includes(key)) {
|
||||
keysToRemove.push(key)
|
||||
}
|
||||
}
|
||||
keysToRemove.forEach(key => localStorage.removeItem(key))
|
||||
},
|
||||
|
||||
/**
|
||||
* 导出所有 localStorage 数据为 JSON
|
||||
* @returns {string} JSON 字符串
|
||||
*/
|
||||
exportToJSON() {
|
||||
const data = {}
|
||||
for (let i = 0; i < localStorage.length; i++) {
|
||||
const key = localStorage.key(i)
|
||||
data[key] = localStorage.getItem(key)
|
||||
}
|
||||
return JSON.stringify(data, null, 2)
|
||||
},
|
||||
|
||||
/**
|
||||
* 从 JSON 导入 localStorage 数据
|
||||
* @param {string} jsonString - JSON 字符串
|
||||
* @param {boolean} [merge=false] - 是否合并（false则清空后导入）
|
||||
* @returns {number} 导入的键数量
|
||||
*/
|
||||
importFromJSON(jsonString, merge = false) {
|
||||
try {
|
||||
const data = JSON.parse(jsonString)
|
||||
|
||||
if (!merge) {
|
||||
localStorageHelpers.clearAll()
|
||||
}
|
||||
|
||||
let count = 0
|
||||
Object.keys(data).forEach(key => {
|
||||
localStorage.setItem(key, data[key])
|
||||
count++
|
||||
})
|
||||
|
||||
return count
|
||||
} catch (error) {
|
||||
console.error('导入失败:', error)
|
||||
return 0
|
||||
}
|
||||
},
|
||||
}
|
||||
302
web/src/utils/constants.js
Normal file
302
web/src/utils/constants.js
Normal file
@@ -0,0 +1,302 @@
|
||||
/**
|
||||
* 应用全局常量配置
|
||||
*
|
||||
* @module utils/constants
|
||||
* @description 集中管理所有应用常量，避免硬编码和重复定义
|
||||
*/
|
||||
|
||||
/**
|
||||
* localStorage 键名管理
|
||||
* @description 统一的localStorage键名规范，避免冲突和重复
|
||||
*
|
||||
* 命名规范：app-{feature}-{key}
|
||||
* - app: 应用级前缀
|
||||
* - feature: 功能模块标识（filesystem/device-test等）
|
||||
* - key: 具体的数据项
|
||||
*/
|
||||
export const STORAGE_KEYS = {
|
||||
// 文件系统模块
|
||||
FILESYSTEM: {
|
||||
FILE_PATH: 'app-filesystem-file-path',
|
||||
FILE_LIST: 'app-filesystem-file-list',
|
||||
FILE_CONTENT: 'app-filesystem-file-content',
|
||||
PATH_HISTORY: 'app-filesystem-path-history',
|
||||
FILE_CONTENT_HEIGHT: 'app-filesystem-file-content-height',
|
||||
PANEL_WIDTH: 'app-filesystem-panel-width',
|
||||
SIDEBAR_VISIBLE: 'app-filesystem-sidebar-visible',
|
||||
FAVORITE_FILES: 'app-filesystem-favorite-files',
|
||||
EDIT_MODE: 'app-filesystem-edit-mode', // HTML/Markdown 编辑模式状态
|
||||
},
|
||||
|
||||
// 设备测试模块
|
||||
DEVICE_TEST: {
|
||||
FILE_PATH: 'app-device-test-file-path',
|
||||
FILE_LIST: 'app-device-test-file-list',
|
||||
FILE_CONTENT: 'app-device-test-file-content',
|
||||
PATH_HISTORY: 'app-device-test-path-history',
|
||||
FILE_CONTENT_HEIGHT: 'app-device-test-file-content-height',
|
||||
PANEL_WIDTH: 'app-device-test-panel-width',
|
||||
FAVORITE_FILES: 'app-device-test-favorite-files',
|
||||
},
|
||||
|
||||
// 通用配置
|
||||
COMMON: {
|
||||
THEME: 'app-common-theme',
|
||||
LANGUAGE: 'app-common-language',
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件扩展名分类
|
||||
* @description 用于文件类型识别和图标映射
|
||||
*/
|
||||
export const FILE_EXTENSIONS = {
|
||||
// 图片文件
|
||||
IMAGE: ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'svg', 'webp', 'ico', 'heic', 'heif'],
|
||||
|
||||
// 视频文件
|
||||
VIDEO_BROWSER: ['mp4', 'webm', 'ogg', 'mov', 'm4v'], // 浏览器原生支持
|
||||
VIDEO_EXTERNAL: ['avi', 'mkv', 'wmv', 'flv', 'rmvb', '3gp', 'ts', 'mts'], // 需要外部播放器
|
||||
|
||||
// 音频文件
|
||||
AUDIO: ['mp3', 'wav', 'flac', 'aac', 'ogg', 'm4a', 'opus', 'webm'],
|
||||
|
||||
// 文档文件
|
||||
DOCUMENT: ['doc', 'docx', 'pdf', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'rtf', 'odt', 'ods', 'odp'],
|
||||
|
||||
// 压缩文件
|
||||
ARCHIVE: ['zip', 'rar', '7z', 'tar', 'gz', 'bz2', 'xz', 'z', 'cab', 'iso'],
|
||||
|
||||
// 代码文件
|
||||
CODE: [
|
||||
'js', 'ts', 'jsx', 'tsx', 'vue', 'py', 'java', 'c', 'cpp', 'h', 'go', 'rs', 'php', 'rb', 'cs', 'swift', 'kt',
|
||||
'scala', 'html', 'htm', 'css', 'scss', 'sass', 'less', 'json', 'xml', 'yaml', 'yml', 'sql', 'sh', 'bat', 'ps1'
|
||||
],
|
||||
|
||||
// 数据库文件
|
||||
DATABASE: ['db', 'sqlite', 'mdb', 'accdb'],
|
||||
|
||||
// 可执行文件
|
||||
EXECUTABLE: ['exe', 'msi', 'app', 'dmg', 'deb', 'rpm', 'dll', 'so'],
|
||||
|
||||
// 字体文件
|
||||
FONT: ['ttf', 'otf', 'woff', 'woff2', 'eot'],
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件类型图标映射
|
||||
* @description 根据文件扩展名返回对应的图标
|
||||
*/
|
||||
export const FILE_ICONS = {
|
||||
// 图片
|
||||
IMAGE: '🖼️',
|
||||
|
||||
// 视频
|
||||
VIDEO: '🎬',
|
||||
|
||||
// 音频
|
||||
AUDIO: '🎵',
|
||||
|
||||
// 文档
|
||||
PDF: '📕',
|
||||
DOC: '📘',
|
||||
XLS: '📗',
|
||||
PPT: '📙',
|
||||
TXT: '📃',
|
||||
DOCUMENT: '📄',
|
||||
|
||||
// 压缩包
|
||||
ARCHIVE: '📦',
|
||||
|
||||
// 代码
|
||||
CODE: '💻',
|
||||
|
||||
// 编程语言特定图标
|
||||
JAVA: '☕',
|
||||
GO: '🐹',
|
||||
PYTHON: '🐍',
|
||||
JAVASCRIPT: '📜',
|
||||
TYPESCRIPT: '💠',
|
||||
HTML: '🌐',
|
||||
CSS: '🎨',
|
||||
SQL: '🗃️',
|
||||
JSON: '📋',
|
||||
XML: '📰',
|
||||
YAML: '⚙️',
|
||||
SHELL: '🐚',
|
||||
C: '🔷',
|
||||
CPP: '🔶',
|
||||
RUST: '🦀',
|
||||
PHP: '🐘',
|
||||
RUBY: '💎',
|
||||
|
||||
// 数据库
|
||||
DATABASE: '🗄️',
|
||||
|
||||
// 可执行文件
|
||||
EXECUTABLE: '⚙️',
|
||||
|
||||
// 字体
|
||||
FONT: '🔤',
|
||||
|
||||
// 文件夹
|
||||
FOLDER: '📁',
|
||||
|
||||
// 默认文件
|
||||
FILE: '📄',
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件类型到图标的映射表
|
||||
* @description 扩展名 -> 图标 的快速查找表
|
||||
*/
|
||||
export const FILE_ICON_MAP = new Map()
|
||||
|
||||
// 初始化图标映射表
|
||||
const initIconMap = () => {
|
||||
// 图片
|
||||
FILE_EXTENSIONS.IMAGE.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.IMAGE))
|
||||
|
||||
// 视频
|
||||
FILE_EXTENSIONS.VIDEO_BROWSER.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.VIDEO))
|
||||
FILE_EXTENSIONS.VIDEO_EXTERNAL.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.VIDEO))
|
||||
|
||||
// 音频
|
||||
FILE_EXTENSIONS.AUDIO.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.AUDIO))
|
||||
|
||||
// 文档
|
||||
FILE_EXTENSIONS.DOCUMENT.forEach(ext => {
|
||||
if (ext === 'pdf') FILE_ICON_MAP.set(ext, FILE_ICONS.PDF)
|
||||
else if (['doc', 'docx'].includes(ext)) FILE_ICON_MAP.set(ext, FILE_ICONS.DOC)
|
||||
else if (['xls', 'xlsx'].includes(ext)) FILE_ICON_MAP.set(ext, FILE_ICONS.XLS)
|
||||
else if (['ppt', 'pptx'].includes(ext)) FILE_ICON_MAP.set(ext, FILE_ICONS.PPT)
|
||||
else if (ext === 'txt') FILE_ICON_MAP.set(ext, FILE_ICONS.TXT)
|
||||
else FILE_ICON_MAP.set(ext, FILE_ICONS.DOCUMENT)
|
||||
})
|
||||
|
||||
// 压缩文件
|
||||
FILE_EXTENSIONS.ARCHIVE.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.ARCHIVE))
|
||||
|
||||
// 代码文件（通用）
|
||||
FILE_EXTENSIONS.CODE.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.CODE))
|
||||
|
||||
// 编程语言特定图标
|
||||
const langIcons = {
|
||||
// Java
|
||||
'java': FILE_ICONS.JAVA,
|
||||
// Go
|
||||
'go': FILE_ICONS.GO,
|
||||
// Python
|
||||
'py': FILE_ICONS.PYTHON,
|
||||
'pyw': FILE_ICONS.PYTHON,
|
||||
// JavaScript/TypeScript
|
||||
'js': FILE_ICONS.JAVASCRIPT,
|
||||
'jsx': FILE_ICONS.JAVASCRIPT,
|
||||
'ts': FILE_ICONS.TYPESCRIPT,
|
||||
'tsx': FILE_ICONS.TYPESCRIPT,
|
||||
'mjs': FILE_ICONS.JAVASCRIPT,
|
||||
'cjs': FILE_ICONS.JAVASCRIPT,
|
||||
// Web
|
||||
'html': FILE_ICONS.HTML,
|
||||
'htm': FILE_ICONS.HTML,
|
||||
'xhtml': FILE_ICONS.HTML,
|
||||
'css': FILE_ICONS.CSS,
|
||||
'scss': FILE_ICONS.CSS,
|
||||
'sass': FILE_ICONS.CSS,
|
||||
'less': FILE_ICONS.CSS,
|
||||
// Data
|
||||
'json': FILE_ICONS.JSON,
|
||||
'xml': FILE_ICONS.XML,
|
||||
'yaml': FILE_ICONS.YAML,
|
||||
'yml': FILE_ICONS.YAML,
|
||||
// Shell
|
||||
'sh': FILE_ICONS.SHELL,
|
||||
'bash': FILE_ICONS.SHELL,
|
||||
'zsh': FILE_ICONS.SHELL,
|
||||
'fish': FILE_ICONS.SHELL,
|
||||
'cmd': FILE_ICONS.SHELL,
|
||||
'bat': FILE_ICONS.SHELL,
|
||||
'ps1': FILE_ICONS.SHELL,
|
||||
// C/C++
|
||||
'c': FILE_ICONS.C,
|
||||
'h': FILE_ICONS.C,
|
||||
'cpp': FILE_ICONS.CPP,
|
||||
'hpp': FILE_ICONS.CPP,
|
||||
'cc': FILE_ICONS.CPP,
|
||||
'cxx': FILE_ICONS.CPP,
|
||||
// Rust
|
||||
'rs': FILE_ICONS.RUST,
|
||||
// PHP
|
||||
'php': FILE_ICONS.PHP,
|
||||
// Ruby
|
||||
'rb': FILE_ICONS.RUBY,
|
||||
'gem': FILE_ICONS.RUBY,
|
||||
// SQL
|
||||
'sql': FILE_ICONS.SQL,
|
||||
}
|
||||
|
||||
Object.keys(langIcons).forEach(ext => FILE_ICON_MAP.set(ext, langIcons[ext]))
|
||||
|
||||
// 数据库
|
||||
FILE_EXTENSIONS.DATABASE.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.DATABASE))
|
||||
|
||||
// 可执行文件
|
||||
FILE_EXTENSIONS.EXECUTABLE.slice(0, 6).forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.EXECUTABLE))
|
||||
|
||||
// 字体
|
||||
FILE_EXTENSIONS.FONT.forEach(ext => FILE_ICON_MAP.set(ext, FILE_ICONS.FONT))
|
||||
}
|
||||
|
||||
// 执行初始化
|
||||
initIconMap()
|
||||
|
||||
/**
|
||||
* 常用路径快捷方式
|
||||
* @description 系统常用路径的emoji标识
|
||||
*/
|
||||
export const PATH_ICONS = {
|
||||
DESKTOP: '🖥️',
|
||||
DOCUMENTS: '📁',
|
||||
DOWNLOADS: '📥',
|
||||
HOME: '🏠',
|
||||
ROOT: '📂',
|
||||
DRIVE: '💿',
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件大小单位
|
||||
* @description 用于文件大小格式化的单位数组
|
||||
*/
|
||||
export const BYTE_UNITS = ['B', 'KMGTPE']
|
||||
|
||||
/**
|
||||
* 默认配置值
|
||||
*/
|
||||
export const DEFAULTS = {
|
||||
// 路径历史最大记录数
|
||||
MAX_HISTORY_LENGTH: 20,
|
||||
|
||||
// 收藏夹最大数量
|
||||
MAX_FAVORITES_LENGTH: 50,
|
||||
|
||||
// 文件内容高度范围（px）
|
||||
MIN_CONTENT_HEIGHT: 100,
|
||||
MAX_CONTENT_HEIGHT: 800,
|
||||
DEFAULT_CONTENT_HEIGHT: 200,
|
||||
|
||||
// 面板宽度范围（%）
|
||||
MIN_PANEL_WIDTH: 20,
|
||||
MAX_PANEL_WIDTH: 80,
|
||||
DEFAULT_PANEL_WIDTH: 50,
|
||||
|
||||
// 侧边栏宽度（px）
|
||||
SIDEBAR_WIDTH: 220,
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件大小格式化配置
|
||||
*/
|
||||
export const FILE_SIZE_FORMAT = {
|
||||
UNIT: 1024, // 使用1024进制（KiB, MiB等）
|
||||
DECIMAL_PLACES: 2, // 保留小数位数
|
||||
}
|
||||
81
web/src/utils/debugLog.js
Normal file
81
web/src/utils/debugLog.js
Normal file
@@ -0,0 +1,81 @@
|
||||
/**
|
||||
* 调试日志工具
|
||||
*
|
||||
* 通过环境变量控制调试日志输出
|
||||
* 开发环境：输出详细日志
|
||||
* 生产环境：仅输出错误
|
||||
*/
|
||||
|
||||
// 检测是否为开发环境
|
||||
const isDevelopment = import.meta.env.DEV || import.meta.env.MODE === 'development'
|
||||
|
||||
/**
|
||||
* 调试日志输出（仅开发环境）
|
||||
* @param {...any} args - 要输出的参数
|
||||
*/
|
||||
export const debugLog = (...args) => {
|
||||
if (isDevelopment) {
|
||||
console.log('[FileSystem]', ...args)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 警告日志（所有环境）
|
||||
* @param {...any} args - 要输出的参数
|
||||
*/
|
||||
export const debugWarn = (...args) => {
|
||||
console.warn('[FileSystem]', ...args)
|
||||
}
|
||||
|
||||
/**
|
||||
* 错误日志（所有环境）
|
||||
* @param {...any} args - 要输出的参数
|
||||
*/
|
||||
export const debugError = (...args) => {
|
||||
console.error('[FileSystem]', ...args)
|
||||
}
|
||||
|
||||
/**
|
||||
* 分组日志开始（仅开发环境）
|
||||
* @param {string} label - 分组标签
|
||||
*/
|
||||
export const debugGroup = (label) => {
|
||||
if (isDevelopment) {
|
||||
console.group(`[FileSystem] ${label}`)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 分组日志结束（仅开发环境）
|
||||
*/
|
||||
export const debugGroupEnd = () => {
|
||||
if (isDevelopment) {
|
||||
console.groupEnd()
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 条件日志（仅在满足条件时输出）
|
||||
* @param {boolean} condition - 是否输出
|
||||
* @param {...any} args - 要输出的参数
|
||||
*/
|
||||
export const debugIf = (condition, ...args) => {
|
||||
if (isDevelopment && condition) {
|
||||
console.log('[FileSystem]', ...args)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 性能日志（仅开发环境）
|
||||
* @param {string} label - 性能标签
|
||||
* @param {Function} fn - 要测量的函数
|
||||
*/
|
||||
export const debugTime = (label, fn) => {
|
||||
if (isDevelopment) {
|
||||
console.time(`[FileSystem] ${label}`)
|
||||
const result = fn()
|
||||
console.timeEnd(`[FileSystem] ${label}`)
|
||||
return result
|
||||
}
|
||||
return fn()
|
||||
}
|
||||
321
web/src/utils/fileUtils.js
Normal file
321
web/src/utils/fileUtils.js
Normal file
@@ -0,0 +1,321 @@
|
||||
/**
|
||||
* 文件工具函数集合
|
||||
*
|
||||
* @module utils/fileUtils
|
||||
* @description 提供文件相关的通用工具函数，避免代码重复
|
||||
*/
|
||||
|
||||
import { FILE_ICON_MAP, FILE_ICONS, BYTE_UNITS, FILE_SIZE_FORMAT, FILE_EXTENSIONS } from './constants'
|
||||
|
||||
/**
|
||||
* 格式化文件大小
|
||||
* @param {number} bytes - 文件大小（字节）
|
||||
* @returns {string} 格式化后的文件大小字符串
|
||||
*
|
||||
* @example
|
||||
* formatBytes(1024) // "1.00 KB"
|
||||
* formatBytes(1048576) // "1.00 MB"
|
||||
* formatBytes(0) // "0 B"
|
||||
*/
|
||||
export function formatBytes(bytes) {
|
||||
if (!bytes || bytes === 0) return '0 B'
|
||||
|
||||
const unit = FILE_SIZE_FORMAT.UNIT
|
||||
const decimals = FILE_SIZE_FORMAT.DECIMAL_PLACES
|
||||
|
||||
if (bytes < unit) return bytes + ' B'
|
||||
|
||||
const exp = Math.floor(Math.log(bytes) / Math.log(unit))
|
||||
const value = bytes / Math.pow(unit, exp)
|
||||
const unitSymbol = BYTE_UNITS[1][exp - 1] + 'B'
|
||||
|
||||
return value.toFixed(decimals) + ' ' + unitSymbol
|
||||
}
|
||||
|
||||
/**
|
||||
* 从文件路径中提取文件名
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {string} 文件名
|
||||
*
|
||||
* @example
|
||||
* getFileName('/home/user/docs/file.txt') // "file.txt"
|
||||
* getFileName('C:\\Users\\user\\file.txt') // "file.txt"
|
||||
* getFileName('file.txt') // "file.txt"
|
||||
*/
|
||||
export function getFileName(path) {
|
||||
if (!path) return ''
|
||||
|
||||
// 统一分隔符为正斜杠
|
||||
const normalizedPath = path.replace(/\\/g, '/')
|
||||
|
||||
// 分割路径并取最后一部分
|
||||
const parts = normalizedPath.split('/')
|
||||
|
||||
return parts[parts.length - 1] || path
|
||||
}
|
||||
|
||||
/**
|
||||
* 从文件路径中提取文件扩展名
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {string} 扩展名（小写，不含点号）
|
||||
*
|
||||
* @example
|
||||
* getFileExtension('/path/to/file.txt') // "txt"
|
||||
* getFileExtension('/path/to/file.TXT') // "txt"
|
||||
* getFileExtension('/path/to/file') // ""
|
||||
*/
|
||||
export function getFileExtension(path) {
|
||||
if (!path) return ''
|
||||
|
||||
const fileName = getFileName(path)
|
||||
const lastDotIndex = fileName.lastIndexOf('.')
|
||||
|
||||
if (lastDotIndex === -1 || lastDotIndex === fileName.length - 1) {
|
||||
return ''
|
||||
}
|
||||
|
||||
return fileName.substring(lastDotIndex + 1).toLowerCase()
|
||||
}
|
||||
|
||||
/**
|
||||
* 根据文件信息获取对应的图标
|
||||
* @param {Object} fileInfo - 文件信息对象
|
||||
* @param {boolean} fileInfo.is_dir - 是否为目录
|
||||
* @param {string} fileInfo.name - 文件名
|
||||
* @returns {string} 文件图标（emoji）
|
||||
*
|
||||
* @example
|
||||
* getFileIcon({ is_dir: true }) // "📁"
|
||||
* getFileIcon({ is_dir: false, name: 'image.png' }) // "🖼️"
|
||||
* getFileIcon({ is_dir: false, name: 'document.pdf' }) // "📕"
|
||||
*/
|
||||
export function getFileIcon(fileInfo) {
|
||||
if (!fileInfo) return FILE_ICONS.FILE
|
||||
|
||||
// 如果是目录
|
||||
if (fileInfo.is_dir) {
|
||||
return FILE_ICONS.FOLDER
|
||||
}
|
||||
|
||||
// 获取文件扩展名
|
||||
const ext = getFileExtension(fileInfo.name)
|
||||
|
||||
// 从映射表中查找图标
|
||||
return FILE_ICON_MAP.get(ext) || FILE_ICONS.FILE
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断文件是否为图片
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为图片文件
|
||||
*/
|
||||
export function isImageFile(path) {
|
||||
const ext = getFileExtension(path)
|
||||
return FILE_EXTENSIONS.IMAGE.includes(ext)
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断文件是否为视频
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为视频文件
|
||||
*/
|
||||
export function isVideoFile(path) {
|
||||
const ext = getFileExtension(path)
|
||||
return [...FILE_EXTENSIONS.VIDEO_BROWSER, ...FILE_EXTENSIONS.VIDEO_EXTERNAL].includes(ext)
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断文件是否为音频
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为音频文件
|
||||
*/
|
||||
export function isAudioFile(path) {
|
||||
const ext = getFileExtension(path)
|
||||
return FILE_EXTENSIONS.AUDIO.includes(ext)
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断文件是否为PDF
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为PDF文件
|
||||
*/
|
||||
export function isPdfFile(path) {
|
||||
return getFileExtension(path) === 'pdf'
|
||||
}
|
||||
|
||||
/**
|
||||
* 规范化文件路径（将反斜杠转换为正斜杠，并进行URL编码）
|
||||
* @param {string} path - 原始路径
|
||||
* @param {boolean} encode - 是否进行URL编码（用于URL路径）
|
||||
* @returns {string} 规范化后的路径
|
||||
*
|
||||
* @example
|
||||
* normalizeFilePath('C:\\Users\\user\\file.txt') // "C:/Users/user/file.txt"
|
||||
* normalizeFilePath('/home/user/file.txt') // "/home/user/file.txt"
|
||||
* normalizeFilePath('E:/中文路径/file.pdf', true) // "E:/%E4%B8%AD%E6%96%87%E8%B7%AF%E5%BE%84/file.pdf"
|
||||
*/
|
||||
export function normalizeFilePath(path, encode = false) {
|
||||
if (!path) return ''
|
||||
const normalized = path.replace(/\\/g, '/')
|
||||
|
||||
// 如果需要编码，则使用 encodeURIComponent
|
||||
if (encode) {
|
||||
const parts = normalized.split('/')
|
||||
// 只对包含需要编码字符的路径段进行编码
|
||||
// Windows 路径格式: E:/path/to/file，第一部分是盘符（如 E:），不应编码
|
||||
return parts.map((segment, index) => {
|
||||
// 盘符部分（如 "E:"）不编码
|
||||
if (index === 0 && /^[A-Za-z]:$/.test(segment)) {
|
||||
return segment
|
||||
}
|
||||
// 检查是否需要编码（包含非ASCII字符或特殊字符）
|
||||
if (/[^A-Za-z0-9\-_.~]/.test(segment)) {
|
||||
return encodeURIComponent(segment)
|
||||
}
|
||||
return segment
|
||||
}).join('/')
|
||||
}
|
||||
|
||||
return normalized
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取文件类型的友好名称
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {string} 文件类型名称
|
||||
*
|
||||
* @example
|
||||
* getFileTypeName('image.png') // "PNG图片"
|
||||
* getFileTypeName('document.pdf') // "PDF文档"
|
||||
* getFileTypeName('unknown.xyz') // "XYZ文件"
|
||||
*/
|
||||
export function getFileTypeName(path) {
|
||||
const ext = getFileExtension(path)
|
||||
const extUpper = ext.toUpperCase()
|
||||
|
||||
// 图片
|
||||
if (['JPG', 'JPEG', 'PNG', 'GIF', 'BMP', 'SVG', 'WEBP'].includes(extUpper)) {
|
||||
return `${extUpper}图片`
|
||||
}
|
||||
|
||||
// 视频
|
||||
if (['MP4', 'WEBM', 'AVI', 'MKV'].includes(extUpper)) {
|
||||
return `${extUpper}视频`
|
||||
}
|
||||
|
||||
// 音频
|
||||
if (['MP3', 'WAV', 'FLAC', 'AAC'].includes(extUpper)) {
|
||||
return `${extUpper}音频`
|
||||
}
|
||||
|
||||
// PDF
|
||||
if (extUpper === 'PDF') {
|
||||
return 'PDF文档'
|
||||
}
|
||||
|
||||
// 文档
|
||||
if (['DOC', 'DOCX', 'XLS', 'XLSX', 'PPT', 'PPTX'].includes(extUpper)) {
|
||||
return `${extUpper}文档`
|
||||
}
|
||||
|
||||
// 代码
|
||||
if (['JS', 'TS', 'PY', 'JAVA', 'GO', 'RS', 'CPP'].includes(extUpper)) {
|
||||
return `${extUpper}代码`
|
||||
}
|
||||
|
||||
// 默认返回扩展名
|
||||
return ext ? `${extUpper}文件` : '文件'
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断文件是否为二进制文件
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为二进制文件
|
||||
*/
|
||||
export function isBinaryFile(path) {
|
||||
const ext = getFileExtension(path)
|
||||
const binaryExtensions = [
|
||||
'exe', 'dll', 'so', 'dylib', // 可执行文件
|
||||
'zip', 'rar', '7z', 'tar', 'gz', 'bz2', // 压缩文件
|
||||
'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', // Office文档
|
||||
'jpg', 'jpeg', 'png', 'gif', 'bmp', 'mp3', 'mp4', // 媒体文件
|
||||
'eot', 'ttf', 'otf', 'woff', 'woff2', // 字体文件
|
||||
]
|
||||
return binaryExtensions.includes(ext)
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查路径是否为绝对路径
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {boolean} 是否为绝对路径
|
||||
*
|
||||
* @example
|
||||
* isAbsolutePath('C:\\Users') // true (Windows)
|
||||
* isAbsolutePath('/home/user') // true (Unix)
|
||||
* isAbsolutePath('folder/file') // false
|
||||
*/
|
||||
export function isAbsolutePath(path) {
|
||||
if (!path) return false
|
||||
|
||||
// Windows路径：盘符开头
|
||||
if (/^[A-Za-z]:\\/.test(path)) return true
|
||||
|
||||
// Unix路径：以 / 开头
|
||||
if (path.startsWith('/')) return true
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
/**
|
||||
* 拼接路径片段
|
||||
* @param {...string} parts - 路径片段
|
||||
* @returns {string} 拼接后的路径
|
||||
*
|
||||
* @example
|
||||
* joinPaths('/home', 'user', 'docs') // "/home/user/docs"
|
||||
* joinPaths('C:\\Users', 'user') // "C:\\Users\\user"
|
||||
*/
|
||||
export function joinPaths(...parts) {
|
||||
return parts.join('/').replace(/\/+/g, '/')
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取父目录路径
|
||||
* @param {string} path - 文件路径
|
||||
* @returns {string} 父目录路径
|
||||
*
|
||||
* @example
|
||||
* getParentPath('/home/user/docs/file.txt') // "/home/user/docs"
|
||||
* getParentPath('/home/user/docs/') // "/home/user"
|
||||
*/
|
||||
export function getParentPath(path) {
|
||||
if (!path) return ''
|
||||
|
||||
const normalizedPath = normalizeFilePath(path)
|
||||
const lastSlashIndex = normalizedPath.lastIndexOf('/')
|
||||
|
||||
if (lastSlashIndex <= 0) {
|
||||
return '/' // 根目录
|
||||
}
|
||||
|
||||
return normalizedPath.substring(0, lastSlashIndex)
|
||||
}
|
||||
|
||||
/**
|
||||
* 清理文件名，移除非法字符
|
||||
* @param {string} filename - 原始文件名
|
||||
* @param {string} [replacement='_'] - 替换字符
|
||||
* @returns {string} 清理后的文件名
|
||||
*
|
||||
* @example
|
||||
* sanitizeFileName('file/name.txt') // "file_name.txt"
|
||||
* sanitizeFileName('file:name.txt', '-') // "file-name.txt"
|
||||
*/
|
||||
export function sanitizeFileName(filename, replacement = '_') {
|
||||
if (!filename) return ''
|
||||
|
||||
// Windows不允许的字符: < > : " / \ | ? *
|
||||
const illegalChars = /[<>:"/\\|?*]/g
|
||||
|
||||
return filename.replace(illegalChars, replacement)
|
||||
}
|
||||
@@ -11,7 +11,49 @@ export default defineConfig({
|
||||
},
|
||||
build: {
|
||||
outDir: 'dist',
|
||||
emptyOutDir: true
|
||||
emptyOutDir: true,
|
||||
rollupOptions: {
|
||||
output: {
|
||||
manualChunks: {
|
||||
'codemirror': [
|
||||
'@codemirror/view',
|
||||
'@codemirror/state',
|
||||
'@codemirror/language',
|
||||
'@codemirror/commands',
|
||||
'@codemirror/lang-javascript',
|
||||
'@codemirror/lang-java',
|
||||
'@codemirror/lang-python',
|
||||
'@codemirror/lang-html',
|
||||
'@codemirror/lang-css',
|
||||
'@codemirror/lang-markdown',
|
||||
'@codemirror/lang-sql'
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
optimizeDeps: {
|
||||
include: [
|
||||
'@codemirror/view',
|
||||
'@codemirror/state',
|
||||
'@codemirror/language',
|
||||
'@codemirror/commands',
|
||||
'@codemirror/lang-javascript',
|
||||
'@codemirror/lang-java',
|
||||
'@codemirror/lang-python',
|
||||
'@codemirror/lang-html',
|
||||
'@codemirror/lang-css',
|
||||
'@codemirror/lang-markdown',
|
||||
'@codemirror/lang-sql',
|
||||
'@codemirror/legacy-modes/mode/go',
|
||||
'@codemirror/legacy-modes/mode/clike',
|
||||
'@codemirror/legacy-modes/mode/ruby',
|
||||
'@codemirror/legacy-modes/mode/rust',
|
||||
'@codemirror/legacy-modes/mode/shell',
|
||||
'@codemirror/legacy-modes/mode/yaml',
|
||||
'@codemirror/legacy-modes/mode/xml'
|
||||
]
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user