@silly_yi/easyprint-designer 0.1.0

package/README.md

@@ -0,0 +1,137 @@
+# EasyPrint Designer
+
+EasyPrint Designer 是一个轻量级、高性能的 Web 端报表设计器与打印生成器。它基于 HTML5 Canvas 和 jQuery 构建，不依赖任何重型框架，可以轻松集成到任何 Web 项目中（如 React, Vue, Angular 或原生 JS）。
+
+![License](https://img.shields.io/npm/l/@silly_yi/easyprint-designer)
+![Version](https://img.shields.io/npm/v/@silly_yi/easyprint-designer)
+
+## 功能特性
+
+- 🎨 **可视化设计器**：直观的拖拽式界面，所见即所得的设计体验。
+- 📄 **丰富组件**：支持文本、矩形、直线、图片、条形码、二维码等基础组件。
+- 📊 **高级表格**：
+  - 支持动态数据行绑定。
+  - **自动分页**：表格内容超出页面高度时，自动切割并延伸至下一页。
+  - **自动合计**：可配置指定列自动计算总和，并在底部追加合计行。
+  - 跨页表头自动重复。
+- 🔢 **页面管理**：支持自定义纸张尺寸（A4, A3 等）、页边距设置以及自动页码生成。
+- 🔌 **数据绑定**：强大的 JavaScript 动态渲染函数支持（类似 `{{ data.field }}` 的逻辑，但更灵活）。
+- 🖨️ **高质量导出**：
+  - **PDF**：原生支持生成多页 PDF 文档。
+  - **图片**：支持导出高清（Retina 适配）JPG/PNG 图片（多页报表自动打包为 ZIP）。
+- 📦 **零重依赖**：体积小巧，无框架运行时依赖。
+
+## 安装
+
+### 使用 NPM
+
+```bash
+npm install @silly_yi/easyprint-designer
+```
+
+
+## 使用指南
+
+### 1. 引入设计器 (Designer)
+
+集成设计器，允许用户进行模板编辑。
+
+```html
+<div id="designer-container" style="height: 100vh;"></div>
+
+<script type="module">
+  import { create } from 'easyprint-designer';
+  // 样式会自动注入，无需手动引入 CSS！
+
+  const designer = create(document.getElementById('designer-container'), {
+    // 可选的初始化参数
+  });
+
+  // 加载已有配置
+  designer.setConfig({
+    page: { widthMm: 210, heightMm: 297, paper: "A4" },
+    elements: []
+  });
+
+  // 获取当前配置用于保存
+  const config = designer.getConfig();
+  console.log(config);
+</script>
+```
+
+如果使用全局脚本（script 标签）：
+
+```html
+<script>
+  const designer = EasyPrintDesigner.create(document.getElementById('designer-container'));
+</script>
+```
+
+### 2. 引入预览器 (Previewer)
+
+使用真实数据渲染报表。
+
+```html
+<div id="preview-container"></div>
+
+<script type="module">
+  import { preview } from 'easyprint-designer';
+
+  const templateConfig = { ... }; // 从数据库加载的模板配置
+  const reportData = {
+    orderNo: "ORD-123",
+    items: [{ name: "商品 A", price: 100 }, { name: "商品 B", price: 200 }]
+  };
+
+  const previewer = preview(document.getElementById('preview-container'), templateConfig, {
+    data: reportData
+  });
+
+  // 导出操作
+  // previewer.exportPDF("report.pdf");
+  // previewer.exportJPG("report.jpg"); // 如果有多页，会自动下载 ZIP 包
+</script>
+```
+
+## 数据绑定说明
+
+所有组件都支持通过 `renderFn` 属性进行动态渲染。这是一个字符串形式的 JavaScript 函数体。
+
+**可用变量:**
+- `data`: 传递给预览器的完整数据对象。
+- `rowIndex`: (仅表格) 当前行的索引。
+- `rowItem`: (仅表格) 当前行的数据对象。
+
+**示例:**
+
+*   **文本组件**:
+    ```javascript
+    return "订单号: " + data.orderNo;
+    ```
+
+*   **表格单元格**:
+    ```javascript
+    return rowItem.price.toFixed(2);
+    ```
+
+*   **条形码/二维码**:
+    ```javascript
+    return data.trackingCode;
+    ```
+
+## 开发
+
+```bash
+# 安装依赖
+npm install
+
+# 启动开发服务器
+npm run dev
+
+# 构建生产版本
+npm run build
+```
+
+## 开源协议
+
+MIT

package/dist/chunk-LOROXNH3.mjs

@@ -0,0 +1,41 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+var __commonJS = (cb, mod) => function __require2() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+
+export {
+  __require,
+  __commonJS,
+  __toESM,
+  __publicField
+};
+//# sourceMappingURL=chunk-LOROXNH3.mjs.map

package/dist/chunk-LOROXNH3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-SL6FLXZG.mjs

@@ -0,0 +1,14 @@
+// node_modules/@babel/runtime/helpers/esm/typeof.js
+function _typeof(o) {
+  "@babel/helpers - typeof";
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
+    return typeof o2;
+  } : function(o2) {
+    return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
+  }, _typeof(o);
+}
+
+export {
+  _typeof
+};
+//# sourceMappingURL=chunk-SL6FLXZG.mjs.map

package/dist/chunk-SL6FLXZG.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../node_modules/@babel/runtime/helpers/esm/typeof.js"],"sourcesContent":["function _typeof(o) {\n  \"@babel/helpers - typeof\";\n\n  return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) {\n    return typeof o;\n  } : function (o) {\n    return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o;\n  }, _typeof(o);\n}\nexport { _typeof as default };"],"mappings":";AAAA,SAAS,QAAQ,GAAG;AAClB;AAEA,SAAO,UAAU,cAAc,OAAO,UAAU,YAAY,OAAO,OAAO,WAAW,SAAUA,IAAG;AAChG,WAAO,OAAOA;AAAA,EAChB,IAAI,SAAUA,IAAG;AACf,WAAOA,MAAK,cAAc,OAAO,UAAUA,GAAE,gBAAgB,UAAUA,OAAM,OAAO,YAAY,WAAW,OAAOA;AAAA,EACpH,GAAG,QAAQ,CAAC;AACd;","names":["o"]}