cloud-web-corejs 1.0.54-dev.57 → 1.0.54-dev.58

package/src/components/xform/form-designer/form-widget/dialog/importDialog.vue

@@ -66,7 +66,7 @@
       v-el-drag-dialog
     >
       <div>
-        <div class="import-box">
+        <div class="import-box" v-loading="importLoading" :element-loading-text="loadingTitle" style="margin-bottom: 30px;">
           <div class="tips">
             {{ $t2('导入中，请勿关闭当前窗口', 'components.excelImport.tip2') }}
             <!-- <span class="fr">耗时：<em class="time-txt">0 时 0 分 0 秒 </em></span> -->
@@ -130,12 +130,20 @@
                   <div class="clearfix screen-btns">
                     <div class="fl">
                       <vxe-button status="primary" class="button-sty" icon="el-icon-upload2" @click="exportToExcel()">
-                        导出
+                        {{ $t1('导出') }}
                       </vxe-button>
                     </div>
                     <div class="fr"></div>
                   </div>
                 </template>
+                <template #attachment="{row,column}">
+                  <base-attachment :option="{
+                      title: column.title,
+                      rows: row[column.field],
+                      showViewButton: true,
+                      edit:false
+                    }" />
+                </template>
               </vxe-grid>
             </div>
           </div>

package/src/components/xform/form-designer/form-widget/dialog/importDialogMixin.js

@@ -1,5 +1,7 @@
 /**version-1.0*/
 import {read, utils} from 'xlsx'
+import axios from 'axios';
+import SparkMD5 from "spark-md5";
 
 let tmixins = {};
 var XLSX = window.XLSX || {read, utils};
@@ -42,7 +44,13 @@ tmixins = {
       option: {},
       showContent: false,
       resOption: {},
-      fileCellFields: []
+      fileCellFields: [],
+      importLoading: false,
+      loadingTitle: null,
+      loadingPercent: 0,
+      handleRowSize: 1,
+
+      headerRows: 3
     }
   },
   created() {
@@ -89,7 +97,8 @@ tmixins = {
         let col = {
           field: oriCol.field,
           title: oriCol.title,
-          width: 150
+          width: 150,
+          ...oriCol.otherConfig
         };
         if (index == 0) {
           col.fixed = 'left';
@@ -156,6 +165,7 @@ tmixins = {
       }
     },
     dialogClose1() {
+      this.importLoading = false;
       if (!this.showImportDialog2) {
         this.$emit("update:visiable", false);
         this.showContent = false;
@@ -229,6 +239,14 @@ tmixins = {
         return
       }
 
+      this.uploadFile(() => {
+        this.importLoading = false;
+        this.handleBeforeImport(file, resultData, () => {
+          callback && callback()
+        })
+      })
+      return
+
       let reportTemplate = this.getReportTemplate();
       let formCode = reportTemplate?.formCode;
       let scriptCode = importOption.importScriptCode || "import"
@@ -408,10 +426,16 @@ tmixins = {
                 isUnique = true;
               }
 
+              let otherConfig = {};
               let isFile = false;
               if (field.startsWith('attachments_')) {
                 that.fileCellFields.push(field)
                 isFile = true
+                otherConfig = {
+                  slots: {
+                    default: 'attachment'
+                  }
+                }
               }
 
               let col = {
@@ -420,7 +444,8 @@ tmixins = {
                 width: 100,
                 isNeed: isNeed,
                 isUnique: isUnique,
-                isFile
+                isFile,
+                otherConfig
               };
               cols.push(col);
             }
@@ -502,7 +527,7 @@ tmixins = {
       // let reqData = this.getReqFormData();
       let fileCellFields = this.fileCellFields;
       let formData = {
-        [entity]: data
+        [entity]: {...data}
       }
       if (fileCellFields.length) {
         fileCellFields.forEach(field => {
@@ -528,7 +553,7 @@ tmixins = {
     syncDataForImport(opts) {
       let that = this;
       var multi = this.option.multi;
-      var resultData = opts.data;
+      var resultData = this.resultData;
       var datas = resultData.data;
       var titles = resultData.titles;
       var fields = resultData.fields;
@@ -659,7 +684,7 @@ tmixins = {
             }
 
           } else {
-            var data = datas[index];
+            var data = that.resultData.data[index];
             data.impSeq = index;
             data.impNumber = index + 4;
             excNum = 1;
@@ -719,7 +744,7 @@ tmixins = {
                   return;
                 }
               } else {
-                var data = datas[index];
+                var data = that.resultData.data[index];
                 data._resultType = resultMsg.type;
                 data._resultContent = (resultMsg.type == "success") ? this.$t2('导入成功', 'components.excelImport.importSucess') : resultMsg.content;
 
@@ -906,7 +931,358 @@ tmixins = {
           loadingObj && loadingObj.close();
         }, 200);
       });
+    },
+
+    //begin
+    fileParse(file, type = "base64", callback) {
+      let fileRead = new FileReader();
+      if (type === "base64") {
+        fileRead.readAsDataURL(file);
+      } else if (type === "buffer") {
+        fileRead.readAsArrayBuffer(file);
+      }
+      fileRead.onload = (ev) => {
+        callback(ev.target.result)
+      };
+    },
+    uploadFile(callback) {
+      let that = this;
+      that.loadingPercent = 0;
+      that.loadingTitle = `上传导入文件  0%`;
+      let file = this.fileRaw;
+      let uploadChunkSize = 5;
+      this.importLoading = true;
+      this.fileUploadCallback = callback;
+      this.fileParse(file, "buffer", (buffer) => {
+        let spark = new SparkMD5.ArrayBuffer(),
+          chunkSize = uploadChunkSize * 1024 * 1024, // Read in chunks of 2MB
+          chunks = Math.ceil(file.size / chunkSize),
+          hash,
+          suffix;
+        spark.append(buffer);
+        hash = spark.end();
+        let md5 = hash;
+        let nameSplit = /\.([0-9a-zA-Z]+)$/i.exec(file.name);
+
+        suffix = (nameSplit && nameSplit.length > 1) ? nameSplit[1] : '';
+
+        let chunkParam = {
+          fullFile: file,
+          chunkSize: chunkSize,
+          chunks: chunks,
+          chunkIndex: 0,
+          md5: hash,
+          uuid: '',
+          name: file.name
+        };
+        file.chunkParam = chunkParam;
+
+        this.sendRequest(file);
+      });
+    },
+    async sendRequest(fullFile) {
+      let that = this;
+      let uploadUrl = USER_PREFIX + '/excel_import/uploadFile';
+      let chunkParam = fullFile.chunkParam;
+      let target = that.$refs.upload;
+      let abort;
+      let config = {
+        headers: {
+          'Content-Type': 'multipart/form-data'
+        },
+        cancelToken: new axios.CancelToken(function executor(c) {
+          abort = c;
+          fullFile.abort = c;
+        }),
+        onUploadProgress: progressEvent => {
+          let start = chunkParam.start;
+          let uploadedSize = start + Math.floor(chunkParam.currentSize *
+            progressEvent
+              .loaded / progressEvent.total);
+          let percent = Math.floor((uploadedSize * 100) / fullFile.size);
+          if (percent == 100) {
+            percent = 99;
+          }
+          that.loadingPercent = percent;
+          // that.loadingTitle = `上传导入文件  ${percent}%`;
+          that.$set(that, 'loadingTitle', `上传导入文件  ${percent}%`)
+        },
+        // failMsg: false,
+        modal: false,
+        callback: res1 => {
+          if (res1.type == "success") {
+            let uuid = res1.objx.uuid;
+            chunkParam.uuid = uuid;
+            if (preFormData.chunk + 1 >= preFormData.chunks) {
+              let mergeData = {
+                name: chunkParam.name,
+                md5: chunkParam.md5,
+                uuid: uuid,
+              };
+              let _param = {
+                mergeData: mergeData,
+                chunkParam: chunkParam
+              };
+              setTimeout(() => {
+                this.mergeFile(_param);
+              }, 100)
+
+
+            } else {
+              chunkParam.chunkIndex = chunkParam.chunkIndex + 1;
+              chunkParam.uuid = uuid;
+              setTimeout(() => {
+                this.sendRequest(fullFile);
+              }, 100)
+            }
+          } else {
+            this.dialogClose1();
+          }
+          return res1;
+        },
+        error: (err) => {
+          console.log(err);
+          this.dialogClose1();
+        }
+      }; //添加请求头
+
+      let chunkIndex = chunkParam.chunkIndex;
+      let chunkSize = chunkParam.chunkSize;
+      var start = chunkIndex * chunkSize,
+        end = start + chunkSize >= fullFile.size ? fullFile.size : start + chunkParam.chunkSize;
+      chunkParam.currentSize = end - start;
+      chunkParam.start = start;
+      chunkParam.end = end;
+
+      let preFormData = {
+        file: fullFile.slice(start, end),
+        name: fullFile.name,
+        chunks: chunkParam.chunks,
+        chunk: chunkIndex,
+        md5: chunkParam.md5,
+        uuid: chunkParam.uuid
+      };
+
+      let formData = new FormData();
+      Object.keys(preFormData).forEach(key => {
+        formData.append(key, preFormData[key]);
+      });
+
+      let req = this.$http.post(uploadUrl, formData, config);
+      req.abort = () => {
+        abort(this.$t2('取消上传', 'components.VabUpload.cancelUpload'));
+      }
+    },
+    mergeFile(param) {
+      let that = this;
+      let mergeData = param.mergeData;
+      let chunkParam = param.chunkParam;
+      let fullFile = chunkParam.fullFile;
+      let mergeUrl = USER_PREFIX + '/excel_import/mergeChunk';
+      let target = this.$refs.upload;
+      this.$http({
+        url: mergeUrl,
+        method: 'post',
+        data: mergeData,
+        failMsg: false,
+        modal: false,
+        cancelToken: new axios.CancelToken(function executor(c) {
+          if (fullFile) fullFile.abort = c;
+        }),
+        callback: res => {
+          if (res.type == "success") {
+            that.loadingPercent = 100;
+            that.loadingTitle = `上传导入文件  100%`;
+            setTimeout(() => {
+              this.checkImportData()
+            }, 100)
+          } else {
+            this.dialogClose1();
+          }
+        },
+        error: e => {
+          console.log(err);
+          this.dialogClose1();
+        }
+      });
+    },
+    checkImportData() {
+      let that = this;
+      that.loadingPercent = 0;
+      that.loadingTitle = `校验导入文件中的图片数据格式  0%`;
+      let fullFile = this.fileRaw;
+      let chunkParam = fullFile.chunkParam;
+
+      this.$http({
+        url: USER_PREFIX + '/excel_import/checkData',
+        method: 'post',
+        data: {
+          name: chunkParam.name,
+          md5: chunkParam.md5,
+          uuid: chunkParam.uuid
+        },
+        failMsg: false,
+        modal: false,
+        cancelToken: new axios.CancelToken(function executor(c) {
+          if (fullFile) fullFile.abort = c;
+        }),
+        onUploadProgress: progressEvent => {
+          let percent = Math.floor((progressEvent
+            .loaded * 100) / progressEvent.total);
+          if (percent == 100) {
+            percent = 99;
+          }
+          that.loadingPercent = percent;
+          // that.loadingTitle = `校验导入文件中的图片数据格式  ${percent}%`;
+          that.$set(that, 'loadingTitle', `校验导入文件中的图片数据格式  ${percent}%`)
+        },
+        callback: res => {
+          if (res.type == "success") {
+            that.loadingPercent = 100;
+            that.loadingTitle = `校验导入文件中的图片数据格式  100%`;
+            this.handleImageData();
+          } else {
+            this.dialogClose1();
+          }
+        },
+        error: e => {
+          console.log(err);
+          this.dialogClose1();
+        }
+      });
+    },
+    handleImageData() {
+      let that = this;
+      that.loadingPercent = 0;
+      that.loadingTitle = `存储导入文件中的图片  0%`;
+      this.getImportData(0)
+    },
+    getImportData(index) {
+      let that = this;
+      let rowSize = this.handleRowSize;
+      let fullFile = this.fileRaw;
+      let chunkParam = fullFile.chunkParam;
+      let rowDatas = this.resultData.data;
+      let size = rowDatas.length;
+      let currentLineNo = index + 1;
+      let rowNumber = index + 3;
+      let startRow = index + 3;
+      let endRow = index + 3 + rowSize - 1;
+      this.$http({
+        url: USER_PREFIX + '/excel_import/getData',
+        method: 'post',
+        data: {
+          name: chunkParam.name,
+          md5: chunkParam.md5,
+          uuid: chunkParam.uuid,
+          startRow: startRow,
+          endRow: endRow,
+        },
+        failMsg: false,
+        modal: false,
+        cancelToken: new axios.CancelToken(function executor(c) {
+          if (fullFile) fullFile.abort = c;
+        }),
+        callback: res => {
+          if (res.type == "success") {
+            let rows = res?.objx?.datas || []
+            let fileCellFields = this.fileCellFields
+            rows.forEach((row) => {
+              let rowIndex = row.row - 3;
+              let item = rowDatas[rowIndex]
+              Object.keys(row).forEach(key => {
+                if (fileCellFields.includes(key)) {
+                  let value = row[key] || []
+                  if (!Array.isArray(value)) {
+                    value = [value];
+                  }
+                  item[key] = value;
+                }
+              })
+            })
+            let cIndex = index + rowSize - 1;
+            let percent = Math.floor(((cIndex + 1) * 100) / size);
+            that.loadingPercent = percent;
+            that.loadingTitle = `存储导入文件中的图片  ${percent}%`;
+            if (cIndex + 1 < size) {
+              this.getImportData(cIndex + 1)
+            } else {
+              this.fileUploadCallback();
+            }
+          } else {
+            this.dialogClose1();
+          }
+        },
+        error: e => {
+          this.dialogClose1();
+        }
+      });
+    },
+    async generateNewExcel() {
+
+      let file = this.fileRaw
+      try {
+        // 1. 读取原始文件
+        const workbook = XLSX.read(file, {type: 'binary'});
+        const sheetName = workbook.SheetNames[0];
+        const rawData = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName]);
+
+        // 2. 提取表头和数据
+        const headers = rawData.slice(0, this.headerRows);
+        const bodyData = rawData.slice(this.headerRows);
+
+        let exporLineNos = [];
+        if (this.resultType) {
+          exporLineNos = this.successRows.map(item => (item.impNumber - 1))
+        } else {
+          exporLineNos = this.failRows.map(item => (item.impNumber - 1))
+        }
+        // 3. 应用筛选规则
+        let selectRule = (row, index) => {
+          return exporLineNos.includes(index);
+        }
+        const filteredData = bodyData.filter((row, index) => {
+            return selectRule(row, index + this.headerRows)
+          }
+          // this.selectRule(row, index + this.headerRows) // 注意索引转换
+        );
+
+        // 4. 合并数据
+        const newData = [...headers, ...filteredData];
+
+        // 5. 生成新文件
+        const newWorkbook = XLSX.utils.book_new();
+        const newSheet = XLSX.utils.aoa_to_sheet(newData);
+        XLSX.utils.book_append_sheet(newWorkbook, newSheet, 'Sheet1');
+
+        // 6. 下载文件
+        const blob = XLSX.write(newWorkbook, {
+          bookType: 'xlsx',
+          type: 'array'
+        });
+
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        let fileName = null;
+        if (this.resultType) {
+          fileName = `导入结果（成功）.xlsx`;
+        } else {
+          fileName = `导入结果（失败）.xlsx`;
+        }
+        a.download = fileName;
+        a.click();
+
+        // 7. 更新进度
+        this.progress = 100;
+        setTimeout(() => this.progress = 0, 1000);
+
+      } catch (error) {
+        console.error('处理文件时出错:', error);
+        alert('文件处理失败！');
+      }
     }
+    //end
   }
 };
 export const mixins = tmixins;

package/src/components/xform/form-designer/setting-panel/property-editor/event-handler/onAfterConfirmFile-editor.vue

@@ -0,0 +1,30 @@
+<template>
+  <el-form-item label="onAfterConfirmFile" label-width="150px">
+    <a href="javascript:void(0);" class="a-link link-oneLind" @click="editEventHandler('onAfterConfirmFile', eventParams)">
+      <span>{{ optionModel.onAfterConfirmFile }}</span>
+      <i class="el-icon-edit"></i>
+    </a>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "../../../../../../components/xform/utils/i18n";
+import eventMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/event-handler/eventMixin";
+
+export default {
+  name: "onAfterConfirmFile-editor",
+  mixins: [i18n, eventMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return {
+      eventParams: ["attachments", "fileInfos"],
+    };
+  },
+};
+</script>
+
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/propertyRegister.js

@@ -212,6 +212,7 @@ const EVENT_PROPERTIES = {
   'onAppendButtonClick': 'onAppendButtonClick-editor',
   'onSearchConfirm': 'onSearchConfirm-editor',
   'onSearchClear': 'onSearchClear-editor',
+  'onAfterConfirmFile': 'onAfterConfirmFile-editor',
 
   //容器
   'onSubFormRowAdd': 'onSubFormRowAdd-editor',

package/src/components/xform/form-designer/widget-panel/widgetsConfig.js

@@ -2513,6 +2513,7 @@ export const advancedFields = [
       entityTableDesc: null,
       onCreated: "this.loadDataDefaultHandle();",
       onMounted: "",
+      onAfterConfirmFile:"",
       vabUpload: 1,
       formScriptEnabled: true,
       formScriptCode: "getList",
@@ -2922,6 +2923,7 @@ export const advancedFields = [
       entityTableDesc: null,
       onCreated: "",
       onMounted: "",
+      onAfterConfirmFile:"",
       wfFlag: 1,
       wfEdit: false,
       enabledByWf: false,