24kycj
ebe191b06d
- 会员改为永久激活方案；云端文件不再拦截非会员；预览弹窗内导出/打印才校验 - 首页最近文件支持本地记录，登录后与云端合并；移除独立会员页与订阅页 - 模板库入库管理：soon_templates 表、Admin 上传 CRUD、/templates 轻量列表与按需下载 Co-authored-by: Cursor <cursoragent@cursor.com>
697 lines
44 KiB
HTML
697 lines
44 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
<meta name="description" content="SoonDesign 在线卡证设计">
|
|
<link rel="icon" href="../assets/images/favicon.ico">
|
|
<title>Soon Design</title>
|
|
<link rel="stylesheet" href="../vendor/layui/css/layui.css">
|
|
<link rel="stylesheet" href="../assets/css/layer-soon.css">
|
|
<link rel="stylesheet" href="../assets/css/portal.css">
|
|
<link rel="stylesheet" href="../assets/css/design.css">
|
|
<link rel="stylesheet" href="../assets/css/subscribe-gate.css">
|
|
<style>
|
|
/* 标尺样式 */
|
|
.ruler-container {
|
|
position: relative;
|
|
background-color: #2C2C2C;
|
|
border: 1px solid #1E1E1E;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ruler-horizontal {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
height: 20px;
|
|
/* 改为更明显的颜色，不透明度提高到 0.9 */
|
|
background-color: rgba(44, 44, 44, 0.9) !important;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
z-index: 1000;
|
|
/* 鼠标移上去显示上下调整箭头，提示可拖拽 */
|
|
cursor: row-resize;
|
|
}
|
|
|
|
.ruler-vertical {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 20px;
|
|
/* 改为更明显的颜色，不透明度提高到 0.9 */
|
|
background-color: rgba(44, 44, 44, 0.9) !important;
|
|
border-right: 1px solid rgba(255, 255, 255, 0.2);
|
|
z-index: 1000;
|
|
/* 鼠标移上去显示左右调整箭头 */
|
|
cursor: col-resize;
|
|
}
|
|
|
|
.ruler-corner {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
background-color: rgba(44, 44, 44, 0.9) !important;
|
|
border-right: 1px solid rgba(255, 255, 255, 0.2);
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
z-index: 1001;
|
|
}
|
|
|
|
.canvas-wrapper {
|
|
position: relative;
|
|
}
|
|
|
|
/* 拖拽过程中的辅助线样式 */
|
|
.guide-line-drag {
|
|
position: absolute;
|
|
background-color: #0066FF;
|
|
/* 深蓝色高亮 */
|
|
z-index: 9999;
|
|
pointer-events: none;
|
|
/* 让鼠标穿透，不影响拖拽事件 */
|
|
box-shadow: 0 0 6px #0066FF;
|
|
/* 增强发光效果 */
|
|
opacity: 0.9;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="soon-design-page">
|
|
|
|
<div id="portal-topbar"></div>
|
|
|
|
<div class="layui-fluid main" style="display: none">
|
|
<div class="layui-row" style="height: 100%;width: 100%">
|
|
<div class="col-right">
|
|
<div class="tools-bar right-bar">
|
|
|
|
<div class="mode2">
|
|
<div class="tool">
|
|
<img src="../assets/images/top24.png" id="top_alignment" language="t" zh="顶部对齐" ozh="頂部對齊"
|
|
en="Top Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/bottom24.png" id="bottom_alignment" language="t" zh="底部对齐"
|
|
ozh="底部對齊" en="Bottom Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/center_y24.png" id="center_y_alignment" language="t" zh="居中对齐"
|
|
ozh="居中對齊" en="Center Alignment" />
|
|
</div>
|
|
</div>
|
|
<div class="mode2" style="margin-left: 2px;border-right: 0px">
|
|
<div class="tool">
|
|
<img src="../assets/images/left24.png" id="left_alignment" language="t" zh="左对齐" ozh="左對齊"
|
|
en="Left Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/right24.png" id="right_alignment" language="t" zh="右对齐" ozh="右對齊"
|
|
en="Right Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/center_x24.png" id="center_x_alignment" language="t" zh="居中对齐"
|
|
ozh="居中對齊" en="Center Alignment" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="object_attribute">
|
|
<div class="component-title" zh="对象属性" ozh="對象屬性" en="Object Properties" language="m"></div>
|
|
<div>
|
|
<div class="component-line">
|
|
<span class="name" zh="类型：" ozh="類型：" en="Type:" language="m"></span>
|
|
<span id="component_type" zh="背景" ozh="背景" en="Background" language="m"></span>
|
|
</div>
|
|
<div id="base_control">
|
|
<div class="component-line">
|
|
<div class="ui-button" id="up_obj" language="m" zh="移至上层" ozh="移至上層" en="upper layer">
|
|
</div>
|
|
<div class="ui-button" id="down_obj" language="m" zh="移至下层" ozh="移至下層" en="upper layer">
|
|
</div>
|
|
<div class="pic_bg" id="set_bg" language="m" zh="设为背景" ozh="設爲背景"
|
|
en="Set as background">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name">X:</span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 80px" id="text_x" />
|
|
|
|
<span class="name">Y:</span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 80px" id="text_y" />
|
|
<div style="height: 20px;width: 20px;display: inline-block;" class="ui-radio" id="lock">
|
|
<img src="../assets/images/unlock20.png" id="lock_img">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name">H:</span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 80px" id="text_h" />
|
|
<span class="name">W:</span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 80px" id="text_w" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="角度：" ozh="角度：" en="Angle"></span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 80px" id="text_r" />
|
|
<img src="../assets/images/rotate20.png" language="t" zh="旋转90°" ozh="旋轉90°"
|
|
en="Rotate 90°" id="rotate" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="使用黑色带打印：" ozh="使用黑色帶打印：" en="Print use K:"></span>
|
|
<input type="checkbox" name="text_black" id="text_black" class="radio">
|
|
</div>
|
|
</div>
|
|
<div id="pic_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="透明度：" ozh="透明度：" en="Opacity:"></span>
|
|
<div id="pic_op"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
<!-- <div class="component-line">
|
|
<span class="name" language="m" zh="使用黑色带打印：" ozh="使用黑色帶打印：" en="Print use K:"></span>
|
|
<input type="checkbox" name="pic_black" id="pic_black" class="radio">
|
|
</div>
|
|
-->
|
|
</div>
|
|
<div id="out_pic_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字段名：" ozh="字段名：" en="Field Name:"></span>
|
|
<input type="text" id="out_pic_field_name" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="透明度：" ozh="透明度：" en="Opacity:"></span>
|
|
<div id="out_pic_op"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
<!--
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="使用黑色带打印：" ozh="使用黑色帶打印：" en="Print use K:"></span>
|
|
<input type="checkbox" name="out_pic_black" id="out_pic_black" class="radio">
|
|
</div>
|
|
-->
|
|
</div>
|
|
<div id="text_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" style="position: relative;top:-45px" language="m" zh="文本：" ozh="文本："
|
|
en="Text:">文本:</span>
|
|
<textarea rows="3" style="height: 60px" id="text_text"></textarea>
|
|
</div>
|
|
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字体：" ozh="字體：" en="Fonts:"></span>
|
|
<select class="ui-select" id="text_font_family">
|
|
</select>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字号：" ozh="字號：" en="Size:"></span>
|
|
<input min="1" max="300" step="0.5" lay-affix="number" type="number" class="ui-input"
|
|
style="width: 50%" id="text_size" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="text_color" class="input_color">
|
|
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="text_italics">
|
|
<img src="../assets/images/italics24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="text_underline">
|
|
<img src="../assets/images/underline24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="text_bold">
|
|
<img src="../assets/images/bold24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="text_linethrough">
|
|
<img src="../assets/images/linethrough24.png">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="背景颜色：" ozh="背景顏色：" en="Background color:"></span>
|
|
<input type="color" id="text_back_color" class="input_color">
|
|
<div class="transparent-button" id="text_back_transparent" language="m" zh="透明" ozh="透明"
|
|
en="Transparent"></div>
|
|
</div>
|
|
</div>
|
|
<div id="circle_text_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" style="position: relative;top:-45px" language="m" zh="圆形文本："
|
|
ozh="圆形文本：" en="Circle Text:">圆形文本:</span>
|
|
<textarea rows="3" style="height: 60px" id="circle_text_text"></textarea>
|
|
</div>
|
|
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字体：" ozh="字體：" en="Fonts:"></span>
|
|
<select class="ui-select" id="circle_text_font_family">
|
|
</select>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字号：" ozh="字號：" en="Size:"></span>
|
|
<div id="circle_text_size"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="直径：" ozh="直径：" en="Diameter:"></span>
|
|
<div id="circle_text_diameter"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="中心辅助调整圆弧：" ozh="中心輔助調整圓弧："
|
|
en="Adjust the arc using the center:"></span>
|
|
<input type="checkbox" name="circle_text_center" id="circle_text_center" class="radio">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="circle_text_color" class="input_color">
|
|
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="circle_text_italics">
|
|
<img src="../assets/images/italics24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="circle_text_bold">
|
|
<img src="../assets/images/bold24.png">
|
|
</div>
|
|
</div>
|
|
<!-- <div class="component-line">
|
|
<span class="name" language="m" zh="背景颜色：" ozh="背景顏色：" en="Background color:"></span>
|
|
<input type="color" id="circle_text_back_color" class="input_color">
|
|
<div class="transparent-button" id="circle_text_back_transparent" language="m" zh="透明" ozh="透明"
|
|
en="Transparent"></div>
|
|
</div> -->
|
|
</div>
|
|
<div id="out_text_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字段名：" ozh="字段名：" en="Field Name:"></span>
|
|
<input type="text" id="out_text_field_name" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="示例数据" ozh="示例數據" en="Sample Text:"></span>
|
|
<input type="text" id="out_text_text" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字体：" ozh="字體：" en="Font:"></span>
|
|
<select class="ui-select" id="out_text_font_family">
|
|
</select>
|
|
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字号：" ozh="字號：" en="Size:"></span>
|
|
<input min="1" max="300" step="0.5" lay-affix="number" type="number" class="ui-input"
|
|
style="width: 50%" id="out_text_size" />
|
|
</div>
|
|
<div class="component-line"
|
|
style="margin-left: 2px;display: flex; align-items: center;gap: 10px;">
|
|
<span class="name" language="m" zh="对齐方式：" ozh="對齊方式：" en="Alignment:"></span>
|
|
<div class="mode2"
|
|
style="margin-left: 2px;border: none;display: flex; align-items: center;gap: 10px;">
|
|
<div class="tool">
|
|
<img src="../assets/images/left24.png" id="out_left_alignment" language="t"
|
|
zh="左对齐" ozh="左對齊" en="Left Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/right24.png" id="out_right_alignment" language="t"
|
|
zh="右对齐" ozh="右對齊" en="Right Alignment" />
|
|
</div>
|
|
<div class="tool">
|
|
<img src="../assets/images/center_x24.png" id="out_center_alignment" language="t"
|
|
zh="居中对齐" ozh="居中對齊" en="Center Alignment" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="out_text_color" class="input_color">
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="out_text_italics">
|
|
<img src="../assets/images/italics24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="out_text_underline">
|
|
<img src="../assets/images/underline24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="out_text_bold">
|
|
<img src="../assets/images/bold24.png">
|
|
</div>
|
|
<div style="height: 24px;width: 24px;display: inline-block;position: relative;bottom: 4px;"
|
|
class="ui-radio" id="out_text_linethrough">
|
|
<img src="../assets/images/linethrough24.png">
|
|
</div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="背景颜色：" ozh="背景顏色：" en="Background color:"></span>
|
|
<input type="color" id="out_text_back_color" class="input_color">
|
|
<div class="transparent-button" id="out_text_back_transparent" language="m" zh="透明"
|
|
ozh="透明" en="Transparent"></div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="如果文本被截断，则作业失败" ozh="如果文本被截斷，則作業失敗"
|
|
en="If the text is truncated, the operation fails"></span>
|
|
<input type="checkbox" name="exceed" id="exceed" class="radio">
|
|
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="自动换行：" ozh="自動換行：" en="Automatic line feed:"></span>
|
|
<input type="checkbox" name="autoWrap" id="autoWrap" class="radio">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="固定大小：" ozh="固定大小：" en="Fixed Size:"></span>
|
|
<input type="checkbox" name="fixSize" id="fixSize" class="radio">
|
|
</div>
|
|
</div>
|
|
<div id="rect_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="填充：" ozh="填充：" en="Fill:"></span>
|
|
<input type="color" id="rect_color" class="input_color">
|
|
<div class="transparent-button" id="rect_transparent" language="m" zh="透明" ozh="透明"
|
|
en="Transparent"></div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="边框：" ozh="邊框：" en="Border:"></span>
|
|
<input type="color" id="rect_stroke" class="input_color">
|
|
<div class="transparent-button" id="rect_stroke_transparent" language="m" zh="透明"
|
|
ozh="透明" en="Transparent"></div>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50px;height:25px;position:relative;bottom:2px"
|
|
id="rect_stroke_width" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="圆角：" ozh="圓角：" en="Radius:"></span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50px;height:25px;position:relative;bottom:2px" id="rect_radius" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="透明度：" ozh="透明度：" en="Opacity:"></span>
|
|
<div id="rect_op"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="line_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="line_color" class="input_color">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="虚线间距：" ozh="虛線間距：" en="Spacing:"></span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50%" id="line_dist" />
|
|
</div>
|
|
</div>
|
|
<div id="circle_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="填充：" ozh="填充：" en="Fill:"></span>
|
|
<input type="color" id="circle_color" class="input_color">
|
|
<div class="transparent-button" id="circle_transparent" language="m" zh="透明" ozh="透明"
|
|
en="Transparent"></div>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="边框：" ozh="邊框：" en="Border:"></span>
|
|
<input type="color" id="circle_stroke" class="input_color">
|
|
<div class="transparent-button" id="circle_stroke_transparent" language="m" zh="透明"
|
|
ozh="透明" en="Transparent"></div>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50px;height:25px;position:relative;bottom:2px"
|
|
id="circle_stroke_width" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="透明度：" ozh="透明度：" en="Opacity:"></span>
|
|
<div id="circle_op"
|
|
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="qrcode_Controll" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字段名：" ozh="字段名：" en="Field Name:"></span>
|
|
<input type="text" id="qrcode_field_name" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="qrcode_color" class="input_color">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="示例数据" ozh="示例數據" en="Sample Text:"></span>
|
|
<input type="text" id="qrcode_val" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
</div>
|
|
<div id="barcode_controll" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字段名：" ozh="字段名：" en="Field Name:"></span>
|
|
<input type="text" id="barcode_field_name" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="示例数据" ozh="示例數據" en="Sample Text:"></span>
|
|
<input type="text" id="barcode_val" class="ui-input" style="width: 50%" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="取消文字：" ozh="取消文字：" en="Cancel text:"></span>
|
|
<input type="checkbox" name="barcode_show" id="barcode_show" class="radio">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字体：" ozh="字體：" en="Font:"></span>
|
|
<select class="ui-select" id="barcode_font_family">
|
|
</select>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字号：" ozh="字號：" en="Size:"></span>
|
|
<input min="1" max="300" step="0.5" lay-affix="number" type="number" class="ui-input"
|
|
style="width: 50%" id="barcode_size" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="barcode_color" class="input_color">
|
|
</div>
|
|
</div>
|
|
<div id="counter_control" class="control">
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字体：" ozh="字體：" en="Font:"></span>
|
|
<select class="ui-select" id="count_font_family">
|
|
</select>
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="字号：" ozh="字號：" en="Size:"></span>
|
|
<input min="1" max="300" step="0.5" lay-affix="number" type="number" class="ui-input"
|
|
style="width: 50%" id="count_size" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
|
|
<input type="color" id="counter_color" class="input_color">
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="起始：" ozh="起始：" en="Start:"></span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50%" id="counter_start" />
|
|
</div>
|
|
<div class="component-line">
|
|
<span class="name" language="m" zh="增量：" ozh="增量：" en="Incremental:"></span>
|
|
<input type="text" oninput="value=value.replace(/[^\d]/g,'')" class="ui-input"
|
|
style="width: 50%" id="counter_add" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="obj_list">
|
|
<div class="component-title" language="m" zh="对象列表" ozh="對象列錶" en="Object List"></div>
|
|
<div class="obj_list">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-left" style="height: 100%">
|
|
<div class="tools-bar left-bar">
|
|
<div class="mode-left">
|
|
<div class="mode-warp">
|
|
<div class="img-warp" id="new">
|
|
<img src="../assets/images/newfile24.png" language="t" zh="新建模板 CTRL+N" ozh="新建模闆"
|
|
en="New template" />
|
|
</div>
|
|
<div class="img-warp" id="open">
|
|
<img src="../assets/images/open24.png" language="t" zh="打开模板 CTRL+O" ozh="打開模闆 CTRL+O"
|
|
en="Open Template CTRL+O" />
|
|
</div>
|
|
|
|
<div class="img-warp" id="save">
|
|
<img src="../assets/images/save24.png" language="t" zh="保存模板 CTRL+S" ozh="保存模闆 CTRL+S"
|
|
en="Save Template CTRL+S" />
|
|
</div>
|
|
<div class="img-warp" id="output">
|
|
<img src="../assets/images/output24.png" language="t" zh="另存为 CTRL+SHIFT+S"
|
|
ozh="另存為 CTRL+SHIFT+S" en="Save as CTRL+SHIFT+S" />
|
|
</div>
|
|
|
|
<div class="line"></div>
|
|
|
|
<div class="img-warp">
|
|
<img src="../assets/images/previous24.png" id="previous" language="t" zh="撤销 CTRL+Z"
|
|
ozh="撤銷 CTRL+Z" en="Revocation CTRL+Z" />
|
|
</div>
|
|
<div class="img-warp">
|
|
<img src="../assets/images/next24.png" id="next" language="t" zh="恢复 CTRL+Y"
|
|
ozh="恢復 CTRL+Y" en="Recovery CTRL+Y" />
|
|
</div>
|
|
<div class="img-warp">
|
|
<img src="../assets/images/clean24.png" id="clean" language="t" zh="清空 CTRL+SHIFT+DEL"
|
|
ozh="清空 CTRL+SHIFT+DEL" en="Clear CTRL+SHIFT+DEL" />
|
|
</div>
|
|
<div class="img-warp">
|
|
<img src="../assets/images/delete24.png" id="delete" language="t" zh="删除 CTRL+DEL"
|
|
ozh="刪除 CTRL+DEL" en="Delete CTRL+DEL" />
|
|
</div>
|
|
<div class="img-warp" id="copy">
|
|
<img src="../assets/images/copy24.png" language="t" zh="复制 CTRL+C" ozh="複製 CTRL+C"
|
|
en="Copy CTRL+C" />
|
|
</div>
|
|
<div class="img-warp" id="paste">
|
|
<img src="../assets/images/paste24.png" language="t" zh="粘贴 CTRL+V" ozh="粘貼 CTRL+V"
|
|
en="Paste CTRL+V" />
|
|
</div>
|
|
|
|
<div class="line"></div>
|
|
|
|
<div class="ui-button ui-button-active img-warp" id="front_side">
|
|
<span language="m" zh="正面" ozh="正面" en="Front"></span>
|
|
</div>
|
|
<div class="ui-button img-warp" id="back_side">
|
|
<span language="m" zh="背面" ozh="背面" en="Back"></span>
|
|
</div>
|
|
<div class="line"></div>
|
|
|
|
<div class="ui-button img-warp" id="version_change">
|
|
<span language="m" zh="切换" ozh="切换" en="Swap"></span>
|
|
</div>
|
|
|
|
<div class="line"></div>
|
|
|
|
<div class="img-warp">
|
|
<img src="../assets/images/about24.png" id="about" language="t" zh="关于我们" ozh="關於我們"
|
|
en="About Us" />
|
|
</div>
|
|
<div class="img-warp">
|
|
<img src="../assets/images/help24.png" id="help" language="t" zh="帮助文档" ozh="幫助文檔"
|
|
en="Help" />
|
|
</div>
|
|
|
|
<div class="line"></div>
|
|
<select class="ui-select" id="language_select" style="margin-left: 10px">
|
|
<option value='zh'>中文-简体</option>
|
|
<option value='ozh'>中文-繁體</option>
|
|
<option value='en'>English</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="mode3">
|
|
<button type="button" class="layui-btn layui-btn-primary white" id="display" language="m"
|
|
zh="预览效果" ozh="預覽效果" en="Display"></button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<div class="left">
|
|
<div class="tool" language="t" zh="图片" ozh="圖片" en="Picture">
|
|
<img src="../assets/images/images.svg" id="addPic" />
|
|
</div>
|
|
<div class="tool" language="t" zh="合成图片" ozh="合成圖片" en="Synthetic Picture">
|
|
<img src="../assets/images/images_add.svg" id="addOutPic" />
|
|
</div>
|
|
<div class="tool" language="t" zh="文本" ozh="文本" en="Text">
|
|
<img src="../assets/images/text.svg" id="addText" />
|
|
</div>
|
|
<div class="tool" language="t" zh="圆形文本" ozh="圆形文本" en="Circle Text">
|
|
<img src="../assets/images/text3.svg" id="addCircleText" />
|
|
</div>
|
|
<div class="tool" language="t" zh="合成文本" ozh="合成文本" en="Synthetic Text">
|
|
<img src="../assets/images/text2.svg" id="addOutText" />
|
|
</div>
|
|
<div class="tool" language="t" zh="方块" ozh="方塊" en="Rect">
|
|
<img src="../assets/images/rect.svg" id="addRect" />
|
|
</div>
|
|
<div class="tool" language="t" zh="圆形" ozh="圓形" en="Circle">
|
|
<img src="../assets/images/round.svg" id="addCircle" />
|
|
</div>
|
|
<div class="tool" language="t" zh="直线" ozh="直線" en="Line">
|
|
<img src="../assets/images/line.svg" id="addLine" />
|
|
</div>
|
|
<div class="tool" language="t" zh="二维码" ozh="二維碼" en="QR Code">
|
|
<img src="../assets/images/qrcode.svg" id="addQrCode" />
|
|
</div>
|
|
<div class="tool" language="t" zh="条形码" ozh="條形碼" en="Bar Code">
|
|
<img src="../assets/images/barcode.svg" id="addBarCode" />
|
|
</div>
|
|
<div class="tool" language="t" zh="计数器" ozh="計數器" en="Counter">
|
|
<img src="../assets/images/counter.svg" id="addCounter" />
|
|
</div>
|
|
</div>
|
|
<div class="right" style="background-color: #1E252D">
|
|
<div style="background-color: #1E252D;" id="canvas-div">
|
|
<div class="canvas-wrapper">
|
|
<div class="ruler-corner"></div>
|
|
<canvas class="ruler-horizontal" id="ruler-h"></canvas>
|
|
<canvas class="ruler-vertical" id="ruler-v"></canvas>
|
|
<div style="margin-left: 20px; margin-top: 20px;">
|
|
<canvas id="canvas1"></canvas>
|
|
<canvas id="canvas2"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="footer" style="background-color: #31373D">
|
|
<div id="posText" style="display: inline-block">X : Y : </div>
|
|
<div id="zoomSlide" style="width: 300px;display: none"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 类型改变 -->
|
|
<canvas style="display: none" id="barcode"></canvas>
|
|
<img id="source_front" src="../assets/images/front_bg1_2.png" style="display: none" />
|
|
<img id="source_front2" src="../assets/images/front_bg2_2.png" style="display: none" />
|
|
<img id="source_back" src="../assets/images/back_bg_2.png" style="display: none" />
|
|
</div>
|
|
</div>
|
|
|
|
<script src="../vendor/js/fabric2.min.js"></script>
|
|
<script src="../vendor/js/guideLines2.js"></script>
|
|
<script src="../vendor/js/print.min.js"></script>
|
|
<script src="../vendor/js/crypto-js.min.js"></script>
|
|
<script src="../vendor/js/jspdf.umd.min.js"></script>
|
|
<script src="../config/local.js"></script>
|
|
<script src="../js/common/auth-redirect.js"></script>
|
|
<script src="../js/common/auth-session.js"></script>
|
|
<script src="../js/common/member-pay-core.js"></script>
|
|
<script src="../js/common/cloud-files.js"></script>
|
|
<script src="../js/common/asset-base.js"></script>
|
|
<script src="../js/common/portal-topbar.js"></script>
|
|
<script src="../js/common/portal-auth.js"></script>
|
|
<script src="../vendor/layui/layui.js"></script>
|
|
<script src="../vendor/js/qrcode.min.js"></script>
|
|
<script src="../js/common/soon-toast.js"></script>
|
|
<script src="../js/common/member-login-gate.js"></script>
|
|
<script src="../js/common/member-activate.js"></script>
|
|
<script src="../js/platform/web.js?v=basepath2"></script>
|
|
<script src="../vendor/js/jr-qrcode.js"></script>
|
|
<script src="../vendor/js/JsBarcode.all.min.js"></script>
|
|
<script src="../js/common/fabric-ext.js"></script>
|
|
<script src="../js/design2.js"></script>
|
|
<script>
|
|
if (window.SoonPortalTopbar) SoonPortalTopbar.mount('#portal-topbar', { variant: 'design' });
|
|
if (window.soonPortalAuth) soonPortalAuth.init({ logoutReload: false });
|
|
if (window.soonLoadMembership) {
|
|
window.soonLoadMembership().then(function () {
|
|
if (window.soonRefreshPortalIdentity) window.soonRefreshPortalIdentity();
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|