优化下载图片

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue

@@ -1,4 +1,5 @@
 <!-- eslint-disable vue/this-in-template -->
+
 <template>
   <div>
 
@@ -302,26 +303,25 @@
 </template>
 
 <script lang="ts" setup name="DynamicPropConfig">
-import {ElButton, ElLoading, ElMessageBox, ElSelect, ElSelectV2} from "element-plus";
+// @ts-nocheck
+import {ElButton, ElLoading,  ElSelect, ElSelectV2} from "element-plus";
 import {reactive, watch} from 'vue'
 import {useMessage} from "@/hooks/web/useMessage";
 import {DraftDesignDataApi} from "@/api/oms/draftdesigndata";
 import DraftDesign from "@/components/DraftDesign/index.vue";
 import {ShapeType} from "@/components/DraftDesign/config";
-import {createImageViewer} from "@/components/ImageViewer";
 import {ProductCareItemApi} from "@/api/oms/productcareitem";
 import {replaceDomain} from "@/utils";
 import * as FileApi from "@/api/infra/file";
-import {useLocaleStore} from "@/store/modules/locale";
 import {ProductInfoApi} from "@/api/oms/productinfo";
+//@ts-ignore
 import domtoimage from 'dom-to-image';
 import {GroupTypeEnum} from "@/components/DraftDesign/config/constant";
 import {useI18n} from "@/hooks/web/useI18n";
 
 const {t} = useI18n()
 
-// 动态属性配置
-const localeStore = useLocaleStore()
+
 const emit = defineEmits(['change', 'initSucceed'])
 const draftDesignEditRef = ref()
 const that = reactive({
@@ -371,7 +371,7 @@ const previewSize = computed(() => {
     height: imageSize.value.height * 10
   }
 })
-const currentLocale = computed(() => localeStore.getCurrentLocale)
+
 watch(() => that.currentZoom, () => {
   showPng();
 })
@@ -384,8 +384,8 @@ const querySearch = (queryString: string, cb: any) => {
 const imageSize = computed(() => {
   if (that.sizeInfo) {
     return {
-      width: that.sizeInfo.width,
-      height: that.sizeInfo.height
+      // @ts-ignore
+      width: that.sizeInfo.width,  height: that.sizeInfo.height
     }
   }
   return {
@@ -395,6 +395,7 @@ const imageSize = computed(() => {
 })
 const errorKeys = computed(() => {
   if (that.errorList && that.errorList.length > 0) {
+    // @ts-ignore
     return that.errorList.map(item => item.key)
   }
   return [];
@@ -405,19 +406,16 @@ const errorItem = (key, index) => {
 const errorInfo = (key, index) => {
   if (that.errorList && that.errorList.length > 0) {
     for (let i = 0; i < that.errorList.length; i++) {
+      // @ts-ignore
       if (that.errorList[i].key === `${key}_${index}`) {
+        // @ts-ignore
         return that.errorList[i].message
       }
     }
   }
   return ''
 }
-const imagePreview = (imgUrl: string) => {
-  createImageViewer({
-    zIndex: 9999999,
-    urlList: [imgUrl]
-  })
-}
+
 const getLabelName = (item) => {
   if (item.shape === ShapeType.vueShapeImage) {
     return item.groupName + "(icon):"
@@ -447,12 +445,14 @@ const handleSelect = (index: number, key: string) => {
     ...info.dataInfo[index],
   }
 }
+// @ts-ignore
 const changeData = (index: number, key: string) => {
 
   const info = that.propInfo[key];
   const infoList = getIngredientInfoListByType(info.groupType)
   let mapping = {}
   for (let i = 0; i < infoList.length; i++) {
+    // @ts-ignore
     mapping[infoList[i].label] = infoList[i].langMapping;
   }
 
@@ -501,6 +501,7 @@ const changeIconData = (index: number, key: string) => {
     const infoList = washingInfoListByType(info.groupType)
     let mapping = {}
     for (let i = 0; i < infoList.length; i++) {
+      // @ts-ignore
       mapping[infoList[i].label] = infoList[i].langMapping;
     }
     that.propInfo[key].processType = findProcessTypeIndex(index);
@@ -508,24 +509,29 @@ const changeIconData = (index: number, key: string) => {
     const allData = [...that.propInfo[key].dataInfo]
     const fLang = allData[0].locale;
     let m1 = mapping[allData[0].showLabel]
+    // @ts-ignore
     let url = infoList[0].url
 
     for (let i1 = 0; i1 < infoList.length; i1++) {
+      // @ts-ignore
       if (infoList[i1].value === allData[0].showLabel) {
+        // @ts-ignore
         url = infoList[i1].url
         break;
       }
     }
     allData[0].url = url
     if (m1) {
-
+      // @ts-ignore
       let ratio = allData[0].ratio
       for (let i = 0; i < allData.length; i++) {
         if (i > 0 && allData[i].locale === fLang) {
           ratio = allData[i].ratio
           m1 = mapping[allData[i].showLabel]
           for (let i1 = 0; i1 < infoList.length; i1++) {
+            // @ts-ignore
             if (infoList[i1].value === allData[i].showLabel) {
+              // @ts-ignore
               url = infoList[i1].url
               allData[0].url = url
               break;
@@ -553,7 +559,7 @@ const findProcessTypeIndex = (index) => {
 
   for (let i = 0; i < that.propOrderByList.length; i++) {
 
-    // 找到最后一个位置
+    // @ts-ignore 找到最后一个位置
     if (that.propOrderByList[i].shape === ShapeType.vueShapeImage) {
       processType++;
       if (index === i) {
@@ -582,10 +588,10 @@ const uploadFile = async (fileName) => {
     domtoimage.toBlob(svgElement, {
       width: that.svgWidth + 5,
       height: that.svgHeight + 5,
-      type: 'image/jpeg',
+      type: 'image/png',
       quality: 1
     }).then((blob) => {
-      const file = new File([blob], fileName, {type: 'image/jpeg'});
+      const file = new File([blob], fileName, {type: 'image/png'});
       FileApi.updateFile({file: file})
         .then((res) => {
           if (res.code === 0) {
@@ -1287,9 +1293,14 @@ const changeType = () => {
 const getPropInfo = () => {
   // 预览数据 保持缩放
   return new Promise((resolve) => {
+    if(  that.changeCount > 0){
+      useMessage().warning(t('designInfo.tipsDataChange'));
+      return;
+    }
     that.errorList = []
     that.changeCount = 0;
     that.restInfo = {...that.propInfo}
+
     checkPropInfo(that.propInfo).then(r => {
       that.pageConfig.propOrderByList = that.propOrderByList
       that.pageLoading = ElLoading.service({

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/DesignPropEdit.vue

@@ -588,10 +588,10 @@ const uploadFile = async (fileName) => {
     domtoimage.toBlob(svgElement, {
       width: that.svgWidth + 5,
       height: that.svgHeight + 5,
-      type: 'image/jpeg',
+      type: 'image/png',
       quality: 1
     }).then((blob) => {
-      const file = new File([blob], fileName, {type: 'image/jpeg'});
+      const file = new File([blob], fileName, {type: 'image/png'});
       FileApi.updateFile({file: file})
         .then((res) => {
           if (res.code === 0) {

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/index.vue

@@ -747,8 +747,8 @@ const toSVGData = (callback: (url: string) => void, options?: {
   }
 }) => {
 
-  let widthScale = 60 // options && options.widthScale ? options.widthScale : 5
-  let heightScale = 60 // options && options.heightScale ? options.heightScale : 5
+  let widthScale = 20 // options && options.widthScale ? options.widthScale : 5
+  let heightScale = 20 // options && options.heightScale ? options.heightScale : 5
   graph.toSVG((dataUri) => {
     that.previewUrl = dataUri;
     callback(that.previewUrl)