yh-hiprint 2.2.5 → 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>
@@ -265,39 +277,48 @@
   </el-dialog>
 </template>
 <script setup lang="ts">
-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";
+// @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';
+
+interface HiprintTemplate {
+  setPaper: (width: number, height: number) => void;
+  zoom: (scale: number) => void;
+  getJson: () => any;
+  clear: () => void;
+}
 
 const route = useRoute();
-const { paperType, paperWidth, paperHeight, setPaper } = usePaper();
+const hiprintTemplate = ref<HiprintTemplate | null>(null);
+
+const {paperType, paperWidth, paperHeight, setPaper} = usePaper();
 function setPaperHandler(type) {
   setPaper(type, () => {
-    hiprintTemplate.value.setPaper(paperWidth.value, paperHeight.value);
+    hiprintTemplate.value?.setPaper(paperWidth.value, paperHeight.value);
   });
 }
 
-const hiprintTemplate = ref(null);
 const canvasRef = ref();
-const { scaleValue, scalePercentage, canZoomIn, canZoomOut, zoomIn, zoomOut } = useScale(() => {
-  hiprintTemplate.value.zoom(scaleValue.value);
+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',
       },
     ],
   });
@@ -323,39 +344,38 @@ 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({
-      title: "警告",
-      message: "模板配置不存在，请检查",
+      message: '模板配置不存在，请检查',
     });
   }
 }
 
 function saveConfig() {
   let arr = [].concat(formCode.value);
-  let json = hiprintTemplate.value.getJson();
+  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: '恭喜模板保存成功',
       });
     });
 }
@@ -364,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,
@@ -379,7 +399,7 @@ watch(
         })
       );
     } else {
-      hiprintTemplate.value?.setFields("");
+      hiprintTemplate.value?.setFields('');
     }
   },
   {
@@ -389,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() {
@@ -419,11 +439,11 @@ function init() {
             options: [],
           },
           {
-            name: "样式",
+            name: '样式',
             options: [
               {
-                name: "scale",
-                after: "transform",
+                name: 'scale',
+                after: 'transform',
                 hidden: false,
               },
             ],
@@ -431,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,
           },
         ],
@@ -449,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,
               },
             ],
@@ -468,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,
@@ -490,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;
 
@@ -508,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);
@@ -518,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;
@@ -531,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('模板有错误，请返回列表手动修改或这清空模板！');
     }
   }
 }
@@ -548,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);
@@ -566,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/hiprintPreview.vue

@@ -17,8 +17,22 @@ import { useRoute } from "vue-router";
 import axios from "@/libs/api.request.js";
 import { hiprint } from "yh-hiprint";
 
+function getQuery(){
+  let query = {}
+  try {
+    decodeURIComponent(location.hash).split("?")[1].split('&').forEach(str => {
+      let strArr = str.split("=");
+      query[strArr[0]] = strArr[1];
+    })
+  } catch (error) {
+    console.error("hiprint Preview getQuery on error:",error);
+  }
+  return query
+}
+
 onMounted(() => {
-  let query = route.query;
+  let query = getQuery();
+  debugger;
   if (query.code) {
     sessionStorage.printQuery = JSON.stringify(query);
     getData(query);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yh-hiprint",
-  "version": "2.2.5",
+  "version": "2.2.7",
   "description": "Hiprint for Vue3 by NoahLiu in ForceCon in Hunan Changesha",
   "main": "index.js",
   "types": "index.d.ts",