yh-hiprint 2.2.6 → 2.2.7

package/HiprintDesigner.vue

@@ -222,25 +222,37 @@
             label-position="top"
             size="small">
             <el-form-item label="表数据选择">
-              <el-select
-                v-model="listCode"
-                @change="tableFieldChange">
-                <el-option
-                  v-for="d in dataSourceList"
-                  :label="d.label"
-                  :value="d.value"></el-option>
-              </el-select>
+              <template v-if="formCode">
+                <el-select
+                  v-model="listCode"
+                  @change="tableFieldChange">
+                  <el-option
+                    v-for="d in dataSourceList"
+                    :label="d.label"
+                    :value="d.value"></el-option>
+                </el-select>
+              </template>
+              <template v-else>
+                <el-input
+                  v-model="listCode"
+                  @change="tableFieldChange"></el-input>
+              </template>
             </el-form-item>
             <el-row gutter="10">
               <el-col
                 :span="12"
                 v-for="col in currentElementObjColumns">
                 <el-form-item :label="col.title">
-                  <el-select v-model="col.field">
-                    <el-option
-                      v-for="d in listColumns"
-                      :value="d"></el-option>
-                  </el-select>
+                  <template v-if="formCode">
+                    <el-select v-model="col.field">
+                      <el-option
+                        v-for="d in listColumns"
+                        :value="d"></el-option>
+                    </el-select>
+                  </template>
+                  <template v-else>
+                    <el-input v-model="col.field"></el-input>
+                  </template>
                 </el-form-item>
               </el-col>
             </el-row>
@@ -266,11 +278,11 @@
 </template>
 <script setup lang="ts">
 // @ts-nocheck
-import { onMounted, ref, onActivated, onDeactivated, computed, watch } from "vue";
-import { hiprint, defaultElementTypeProvider, fontSize, scale, zIndex, panel, usePaper, useScale, useDataSource, jquery as $ } from "yh-hiprint";
-import { useRoute, onBeforeRouteUpdate } from "vue-router";
-import { ElMessageBox, ElMessage } from "element-plus";
-import axios from "@/libs/api.request";
+import {onMounted, ref, onActivated, onDeactivated, computed, watch} from 'vue';
+import {hiprint, defaultElementTypeProvider, fontSize, scale, zIndex, panel, usePaper, useScale, useDataSource, jquery as $} from 'yh-hiprint';
+import {useRoute, onBeforeRouteUpdate} from 'vue-router';
+import {ElMessageBox, ElMessage} from 'element-plus';
+import axios from '@/libs/api.request';
 
 interface HiprintTemplate {
   setPaper: (width: number, height: number) => void;
@@ -282,7 +294,7 @@ interface HiprintTemplate {
 const route = useRoute();
 const hiprintTemplate = ref<HiprintTemplate | null>(null);
 
-const { paperType, paperWidth, paperHeight, setPaper } = usePaper();
+const {paperType, paperWidth, paperHeight, setPaper} = usePaper();
 function setPaperHandler(type) {
   setPaper(type, () => {
     hiprintTemplate.value?.setPaper(paperWidth.value, paperHeight.value);
@@ -290,23 +302,23 @@ function setPaperHandler(type) {
 }
 
 const canvasRef = ref();
-const { scaleValue, scalePercentage, canZoomIn, canZoomOut, zoomIn, zoomOut } = useScale(() => {
+const {scaleValue, scalePercentage, canZoomIn, canZoomOut, zoomIn, zoomOut} = useScale(() => {
   hiprintTemplate.value?.zoom(scaleValue.value);
   canvasRef?.value.update();
 });
 
 const previewShow = ref(false);
-const previewHtml = ref("");
+const previewHtml = ref('');
 async function previewPrint() {
   let {
-    data: { list, json },
+    data: {list, json},
   } = await axios.request({
     url: `/printTemplate/data/${detailData.value.code}`,
-    method: "post",
-    type: "json",
+    method: 'post',
+    type: 'json',
     data: [
       {
-        code: "50101820",
+        code: '50101820',
       },
     ],
   });
@@ -332,11 +344,11 @@ async function previewPrint() {
     } else {
       list = [];
     }
-    previewHtml.value = new hiprint.PrintTemplate({ template: JSON.parse(json) }).getHtml(list)[0].innerHTML;
+    previewHtml.value = new hiprint.PrintTemplate({template: JSON.parse(json)}).getHtml(list)[0].innerHTML;
     previewShow.value = true;
   } else {
     ElMessage.warning({
-      message: "模板配置不存在，请检查",
+      message: '模板配置不存在，请检查',
     });
   }
 }
@@ -345,25 +357,25 @@ function saveConfig() {
   let arr = [].concat(formCode.value);
   let json = hiprintTemplate.value?.getJson();
   json.panels[0].printElements.forEach((item) => {
-    if (item.printElementType.type === "table") {
+    if (item.printElementType.type === 'table') {
       arr.push(item.options.field);
     }
   });
 
   axios
     .request({
-      url: "/printTemplate/save",
-      method: "post",
-      type: "json",
+      url: '/printTemplate/save',
+      method: 'post',
+      type: 'json',
       data: {
         id: detailData.value.id,
         json: JSON.stringify(json),
-        dsIds: arr.join(","),
+        dsIds: arr.join(','),
       },
     })
     .then((res) => {
       ElMessage.success({
-        message: "恭喜模板保存成功",
+        message: '恭喜模板保存成功',
       });
     });
 }
@@ -372,7 +384,7 @@ function clearPrint() {
   hiprintTemplate.value?.clear();
 }
 
-const { detailData, getDetail, listCode, dataSourceList, listColumns, formCode, formColumns, dataSourceForm, getDataSourceList } = useDataSource(axios);
+const {detailData, getDetail, listCode, dataSourceList, listColumns, formCode, formColumns, dataSourceForm, getDataSourceList} = useDataSource(axios);
 
 watch(
   () => formColumns.value,
@@ -387,7 +399,7 @@ watch(
         })
       );
     } else {
-      hiprintTemplate.value?.setFields("");
+      hiprintTemplate.value?.setFields('');
     }
   },
   {
@@ -397,15 +409,15 @@ watch(
 );
 let currentElementObj = ref(null);
 let currentElementObjColumns = computed(() => {
-  if (currentElementObj.value?.printElementType.type === "table") {
-    return currentElementObj.value.options.columns[0]["columns"] || [];
+  if (currentElementObj.value?.printElementType.type === 'table') {
+    return currentElementObj.value.options.columns[0]['columns'] || [];
   } else {
     return [];
   }
 });
 
 function tableFieldChange(val) {
-  currentElementObj.value.updateOption("field", val);
+  currentElementObj.value.updateOption('field', val);
 }
 
 function tableColumnCancel() {
@@ -427,11 +439,11 @@ function init() {
             options: [],
           },
           {
-            name: "样式",
+            name: '样式',
             options: [
               {
-                name: "scale",
-                after: "transform",
+                name: 'scale',
+                after: 'transform',
                 hidden: false,
               },
             ],
@@ -439,16 +451,16 @@ function init() {
         ],
         supportOptions: [
           {
-            name: "styler",
+            name: 'styler',
             hidden: true,
           },
           {
-            name: "scale",
-            after: "transform",
+            name: 'scale',
+            after: 'transform',
             hidden: false,
           },
           {
-            name: "formatter",
+            name: 'formatter',
             hidden: true,
           },
         ],
@@ -457,18 +469,18 @@ function init() {
         tabs: [
           {
             replace: true,
-            name: "基本",
+            name: '基本',
             options: [
               {
-                name: "field",
+                name: 'field',
                 hidden: false,
               },
               {
-                name: "src",
+                name: 'src',
                 hidden: false,
               },
               {
-                name: "fit",
+                name: 'fit',
                 hidden: false,
               },
             ],
@@ -476,21 +488,21 @@ function init() {
         ],
       },
       table: {
-        tabs: [{ options: [{ name: "field", hidden: true }] }],
+        tabs: [{options: [{name: 'field', hidden: true}]}],
       },
     });
 
-    hiprint.PrintElementTypeManager.buildByHtml($(".ep-draggable-item"));
-    $("#hiprint-printTemplate").empty();
+    hiprint.PrintElementTypeManager.buildByHtml($('.ep-draggable-item'));
+    $('#hiprint-printTemplate').empty();
     let template = JSON.parse(detailData.value.json) || panel;
     hiprintTemplate.value = new hiprint.PrintTemplate({
       template,
       onImageChooseClick: (target) => {},
       fontList: [
-        { title: "微软雅黑", value: "Microsoft YaHei" },
-        { title: "黑体", value: "STHeitiSC-Light" },
-        { title: "宋体", value: "SimSun" },
-        { title: "cursive", value: "cursive" },
+        {title: '微软雅黑', value: 'Microsoft YaHei'},
+        {title: '黑体', value: 'STHeitiSC-Light'},
+        {title: '宋体', value: 'SimSun'},
+        {title: 'cursive', value: 'cursive'},
       ],
       dataMode: 1,
       history: true,
@@ -498,11 +510,11 @@ function init() {
       onUpdateError: (e) => {
         console.error(e);
       },
-      settingContainer: "#PrintElementOptionSetting",
-      paginationContainer: ".hiprint-printPagination",
+      settingContainer: '#PrintElementOptionSetting',
+      paginationContainer: '.hiprint-printPagination',
     });
 
-    hiprintTemplate.value?.design("#hiprint-printTemplate", { grid: true });
+    hiprintTemplate.value?.design('#hiprint-printTemplate', {grid: true});
     scaleValue.value = hiprintTemplate.value.editingPanel.scale || 1;
     window.ht = hiprintTemplate.value;
 
@@ -516,7 +528,7 @@ function init() {
         })
       );
     }
-    $(".hiprint-designer").on("mousedown", ".hiprint-printElement", (e) => {
+    $('.hiprint-designer').on('mousedown', '.hiprint-printElement', (e) => {
       let t = e.currentTarget;
       let pes = hiprintTemplate.value?.editingPanel.printElements;
       let index = pes.map((item) => item.designTarget[0]).indexOf(t);
@@ -526,7 +538,7 @@ function init() {
         listCode.value = pe.options.field;
       }
     });
-    $("#PrintElementOptionSetting").on("input", "input[type=number]", ($el) => {
+    $('#PrintElementOptionSetting').on('input', 'input[type=number]', ($el) => {
       let val = parseInt($el.target.value);
       if (val < 1) {
         $el.target.value = 1;
@@ -539,8 +551,8 @@ function init() {
     console.log(error.message);
     clearPrint();
     hiprintTemplate.value = null;
-    if (error.message.indexOf("setTemplateId") > -1) {
-      ElMessageBox.alert("模板有错误，请返回列表手动修改或这清空模板！");
+    if (error.message.indexOf('setTemplateId') > -1) {
+      ElMessageBox.alert('模板有错误，请返回列表手动修改或这清空模板！');
     }
   }
 }
@@ -556,7 +568,7 @@ async function updateTemplate(code) {
     if (detailData.value && detailData.value.json) {
       let jsonObj = JSON.parse(detailData.value.json);
       hiprintTemplate.value?.update(jsonObj);
-      let { width, height } = jsonObj.panels[0];
+      let {width, height} = jsonObj.panels[0];
       paperWidth.value = width;
       paperHeight.value = height;
       hiprintTemplate.value?.setPaper(width, height);
@@ -574,7 +586,7 @@ async function updateTemplate(code) {
             paperNumberLeft: 430,
             paperNumberTop: 5,
             printElements: [],
-            watermarkOptions: { content: "", rotate: 25, timestamp: false, format: "YYYY-MM-DD HH:mm" },
+            watermarkOptions: {content: '', rotate: 25, timestamp: false, format: 'YYYY-MM-DD HH:mm'},
           },
         ],
       });

package/font-size.js

@@ -1,42 +1,42 @@
-import $ from "jquery";
-export default (function () {
-  function t() {
-    this.name = "fontSize"; // 重写的参数 key
-  }
-  // 涉及修改元素样式， 添加一个 css 方法
-  return (
-    (t.prototype.css = function (t, e) {
-      if (t && t.length) {
-        if (e) return t.css("font-size", e + "pt"), "font-size:" + e + "pt";
-        t[0].style.fontSize = "";
-      }
-      return null;
-    }),
-    // 创建 DOM
-    (t.prototype.createTarget = function () {
-      let list = [4, 5, 6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
-      let fontSizeList = '\n            <option value="" >默认</option>';
-      list.forEach(function (e) {
-        fontSizeList += '\n            <option value="' + e + '">' + e + "pt</option>";
-      });
-      this.target = $(' <div class="hiprint-option-item">\n        <div class="hiprint-option-item-label">\n        字体大小\n        </div>\n        <div class="hiprint-option-item-field">\n        <select class="auto-submit">        </select>\n        </div>\n    </div>');
-      this.target.find(".auto-submit").append($(fontSizeList));
-      return this.target;
-    }),
-    // 获取值
-    (t.prototype.getValue = function () {
-      var t = this.target.find("select").val();
-      if (t) return parseFloat(t.toString());
-    }),
-    // 设置值
-    (t.prototype.setValue = function (t) {
-      t && (this.target.find('option[value="' + t + '"]').length || this.target.find("select").prepend('<option value="' + t + '" >' + t + "</option>"));
-      this.target.find("select").val(t);
-    }),
-    // 销毁 DOM
-    (t.prototype.destroy = function () {
-      this.target.remove();
-    }),
-    t
-  );
-})();
+import $ from "jquery";
+export default (function () {
+  function t() {
+    this.name = "fontSize"; // 重写的参数 key
+  }
+  // 涉及修改元素样式， 添加一个 css 方法
+  return (
+    (t.prototype.css = function (t, e) {
+      if (t && t.length) {
+        if (e) return t.css("font-size", e + "pt"), "font-size:" + e + "pt";
+        t[0].style.fontSize = "";
+      }
+      return null;
+    }),
+    // 创建 DOM
+    (t.prototype.createTarget = function () {
+      let list = [4, 5, 6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
+      let fontSizeList = '\n            <option value="" >默认</option>';
+      list.forEach(function (e) {
+        fontSizeList += '\n            <option value="' + e + '">' + e + "pt</option>";
+      });
+      this.target = $(' <div class="hiprint-option-item">\n        <div class="hiprint-option-item-label">\n        字体大小\n        </div>\n        <div class="hiprint-option-item-field">\n        <select class="auto-submit">        </select>\n        </div>\n    </div>');
+      this.target.find(".auto-submit").append($(fontSizeList));
+      return this.target;
+    }),
+    // 获取值
+    (t.prototype.getValue = function () {
+      var t = this.target.find("select").val();
+      if (t) return parseFloat(t.toString());
+    }),
+    // 设置值
+    (t.prototype.setValue = function (t) {
+      t && (this.target.find('option[value="' + t + '"]').length || this.target.find("select").prepend('<option value="' + t + '" >' + t + "</option>"));
+      this.target.find("select").val(t);
+    }),
+    // 销毁 DOM
+    (t.prototype.destroy = function () {
+      this.target.remove();
+    }),
+    t
+  );
+})();