yangchunjin/SoonDesign
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

网页端：平台桥与部署修复（宝塔/Nginx）

Browse Source 
- lib/platform：网页 Electron 统一 bridge/web/electron，子目录 API 基路径、返回首页跳站点根、路径末尾斜杠兼容
- index/design*.web.html：网页入口，web.js 加缓存参数避免旧脚本缓存
- api：PHP 读写 soon；文档说明目录权限与 Nginx
- lib/design*、lib/index：与 platformBridge 对接及网页侧逻辑
- 公共资源 JsBarcode/jr-qrcode；文档与 package/README/.gitignore 等同步更新

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
24kycj
2026-05-09 18:57:53 +08:00
parent ee6ef462ca
commit 2e6578247e
27 changed files with 6606 additions and 3542 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.web.html
+166
View File
@@ -0,0 +1,166 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>SoonDesign</title>
<link rel="stylesheet" href="./layui/css/layui.css">
<style>
* { box-sizing: border-box; }
html, body {
width: 100%; height: 100%; overflow: hidden; margin: 0; padding: 0;
background-color: #1E1E1E;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-webkit-user-select: none;
}
.layui-fluid.main { height: 100%; padding: 0; display: flex; flex-direction: column; }
.layui-row { height: 100%; display: flex; }
.layui-col-md2 {
width: 260px !important; flex-shrink: 0;
background-color: #31373D; border-right: 1px solid #1E1E1E;
height: 100%; overflow-y: auto;
}
.left { padding: 20px; }
.left h1 {
font-size: 18px; color: #fff; margin-bottom: 25px;
border-left: 4px solid #009688; padding-left: 10px;
line-height: 1; font-weight: 500;
}
.left .card { margin-bottom: 25px; cursor: pointer; }
.left .rect {
width: 100%; height: 150px;
background-color: #252A2E; border: 1px solid #444; border-radius: 4px;
display: flex; flex-direction: column;
align-items: center; justify-content: center;
transition: all 0.3s; position: relative;
}
.left .rect:hover { border-color: #009688; background-color: #3E464F; transform: translateY(-2px); }
.left .rect img {
width: 80px; height: 80px; object-fit: contain;
margin-bottom: 15px;
}
.left .rect1 img { transform: none !important; }
.left .tip { color: #ccc; font-size: 13px; text-align: center; }
.layui-col-md10 {
flex: 1; background-color: #1E252D; height: 100%;
overflow: hidden; position: relative;
}
.right { padding: 30px; height: 100%; display: flex; flex-direction: column; }
#openfile {
background-color: #009688; border: none; height: 34px; line-height: 34px;
padding: 0 20px; font-size: 13px; border-radius: 3px; margin-right: 20px;
color: #fff; cursor: pointer;
}
.recent { font-size: 18px; color: #ddd; vertical-align: middle; font-weight: 500; }
.card-list {
margin-top: 20px; flex: 1; overflow-y: auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 30px; align-content: start;
padding: 10px; padding-bottom: 40px;
}
.card-list .rect {
width: 100%;
height: 160px;
background-color: #252A2E;
border: 1px solid #333;
border-radius: 6px;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
transition: all 0.2s;
position: relative;
cursor: pointer;
overflow: hidden;
}
.card-list .rect:hover { border-color: #009688; background-color: #3E464F; }
.card-list .rect img {
width: 100%;
height: 135px;
object-fit: contain;
margin-bottom: 0;
background-color: #1E1E1E;
border-radius: 4px;
padding: 2px;
transition: transform 0.3s;
}
.card-list .rect1 img { transform: scale(0.8); }
.card-list .rect1:hover img { transform: scale(0.85); }
.card-list .tip {
color: #aaa; font-size: 12px; width: 100%; text-align: center;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
height: 25px; line-height: 25px;
}
.card-list .rect:hover .tip { color: #fff; }
.rect:not(.rect1) { position: relative; }
.rect:not(.rect1)::after {
content: ''; position: absolute; left: 50%;
top: 50%;
transform: translate(-50%, calc(-50% - 12.5px));
width: 24px; height: 24px;
border-radius: 50%; background-color: #252A2E;
box-shadow: inset 0 0 2px rgba(0,0,0,0.8);
border: 1px solid rgba(255,255,255,0.1);
z-index: 10; pointer-events: none;
}
.left .rect:not(.rect1)::after {
width: 16px; height: 16px;
transform: translate(-50%, calc(-50% - 15px));
}
#language_select {
position: absolute; top: 30px; right: 30px;
background-color: #31373D; color: #ccc;
border: 1px solid #444; padding: 5px;
height: 30px; width: 100px;
z-index: 999; outline: none;
}
</style>
</head>
<body>
<div class="layui-fluid main">
<div class="layui-row">
<div class="layui-col-md2">
<div class="left">
<h1 language="m" zh="新建" ozh="新建" en="New"></h1>
<div class="card" id="new1">
<div class="rect">
<img src="./public/images/bg_1.png">
<div class="tip" language="m" zh="空白光盘模板" ozh="空白光碟模闆" en="Disc Template"></div>
</div>
</div>
<div class="card" id="new2">
<div class="rect rect1">
<img src="./public/images/bg_2.png">
<div class="tip" language="m" zh="空白卡片模板" ozh="空白卡片模闆" en="Card Template"></div>
</div>
</div>
</div>
</div>
<div class="layui-col-md10">
<div class="right">
<div>
<button class="layui-btn layui-btn-normal" id="openfile" language="m" zh="打开其他文件" ozh="打開其他文件" en="Open"></button>
<span class="recent" language="m" zh="最近文件" ozh="最近文件" en="Recent Files"></span>
</div>
<div class="card-list"></div>
</div>
<select class="ui-select" id="language_select">
<option value='zh'>中文-简体</option>
<option value='ozh'>中文-繁體</option>
<option value='en'>English</option>
</select>
</div>
</div>
</div>
<script src="./layui/layui.js"></script>
<script src="./lib/platform/web.js?v=basepath2"></script>
<script src="./lib/index.js"></script>
</body>
</html>