模版导出功能开发

gaoluyang

2024-07-09 a3304021d69b1c9bcb56ccaf9c556edaebc5e5e7

模版导出功能开发

 src/components/tool/excel.vue

@@ -39,7 +39,6 @@
</template>

<script>
import {exportExcel} from '../../util/downExcelByLuckSheet'
    // import { data } from 'jquery';
    export default {
        props: ['data', 'execlTitle'],
@@ -120,10 +119,11 @@
                    cellFormat: false // 设置单元格格式
                },
                option.myFolderUrl = this.LOCATIONVUE + '/',
                // option.functionButton = '<i class="save_i el-icon-info" title="系统支持的变量：&#10样品编号&#10样品型号&#10序号&#10检验项&#10检验子项&#10设备名称&#10设备编码&#10单位&#10要求值&#10试验方法 | 检测方法&#10最终值&#10结论&#10计算值&#10检验值"></i><button onClick="excelExport()" class="save">导出</button><button onClick="excelClosed()" class="save">保存</button>'
                option.functionButton = '<i class="save_i el-icon-info" title="系统支持的变量：&#10样品编号&#10样品型号&#10序号&#10检验项&#10检验子项&#10设备名称&#10设备编码&#10单位&#10要求值&#10试验方法 | 检测方法&#10最终值&#10结论&#10计算值&#10检验值"></i><button onClick="excelClosed()" class="save">保存</button>'
        console.log(luckysheet)
                luckysheet.create(option)
            }
            },
        }
    }
</script>

 src/components/view/b2-standard-template.vue

@@ -73,6 +73,8 @@
<script>
    import ValueTable from '../tool/value-table.vue'
    import Excel from '../tool/excel.vue'
  // import XLSX from 'xlsx'
  // import XLSXS from 'xlsx-style'
    export default {
        components: {
            ValueTable,
@@ -129,6 +131,7 @@
            this.entityCopy = this.HaveJson(this.componentData.entity)
            this.getPower()
            window.excelClosed = this.closed
            // window.excelExport = this.excelExport
        },
        methods: {
            refreshTable() {
@@ -224,6 +227,220 @@
                    this.isShow = false
                })
            },
      // excelExport () {
      //   let data = luckysheet.toJson()
      //   let allSheetData = luckysheet.getluckysheetfile();
      //   let sheet1 = allSheetData[0];
      //   console.log('allSheetData---', allSheetData)
      //   let downOriginData = sheet1.data;
      //   let arr = [];  // 所有的单元格数据组成的二维数组
      //   let bgConfig = {};
      //   let faObj = {};
      //   let fsObj = {};
      //   let fcObj = {};
      //   let percentageReg = /%$/;
      //   let cellValue = null;
      //
      //   //列下标 数字转字母
      //   function chatatABC(n){
      //     var orda = 'a'.charCodeAt(0);
      //     var ordz = 'z'.charCodeAt(0);
      //     var len = ordz - orda + 1;
      //     var s = "";
      //     while( n >= 0 ) {
      //       s = String.fromCharCode(n % len + orda) + s;
      //       n = Math.floor(n / len) - 1;
      //     }
      //     return s.toUpperCase();
      //   }
      //   //转化颜色
      //   function getHexColor(color) {
      //     let values = color
      //       .replace(/rgba?\(/, '')
      //       .replace(/\)/, '')
      //       .replace(/[\s+]/g, '')
      //       .split(',')
      //     let a = parseFloat(values[3] || 1),
      //       r = Math.floor(a * parseInt(values[0]) + (1 - a) * 255),
      //       g = Math.floor(a * parseInt(values[1]) + (1 - a) * 255),
      //       b = Math.floor(a * parseInt(values[2]) + (1 - a) * 255)
      //     return '#' +
      //       ('0' + r.toString(16)).slice(-2) +
      //       ('0' + g.toString(16)).slice(-2) +
      //       ('0' + b.toString(16)).slice(-2)
      //   }
      //   // 获取单元格的背景色
      //   function setBackground(row, col, bg) {
      //     console.log('bg----', bg)
      //     let colA = chatatABC(col);
      //     let key = colA + (row + 1);
      //     bgConfig[key] = getHexColor(bg).replace(/\#?/, '');
      //   }
      //   // 获取单元格的字体样式
      //   function setFontStyle(row, col, fa, fs, fc) {
      //     console.log('fc---', fc)
      //     let colA = chatatABC(col);
      //     let key = colA + (row + 1);
      //     faObj[key] = fa; // 字体名称
      //     fsObj[key] = fs; // 字体大小
      //     fcObj[key] = fc ? getHexColor(fc).replace(/\#?/, '') : ''; // 字体颜色
      //   }
      //
      //   // 判断值类型是否为百分比 %
      //   function isPercentage(value) {
      //     return percentageReg.test(value.m) && value.ct && value.ct.t === 'n'
      //   }
      //
      //   // 获取二维数组
      //   for (let row = 0; row < downOriginData.length; row++) {
      //     let arrRow = [];
      //     for (let col = 0; col < downOriginData[row].length; col++) {
      //       if (cellValue != downOriginData[row][col]) {
      //         // 处理单元格的背景颜色
      //         if (downOriginData[row][col].bg) {
      //           setBackground(row, col, downOriginData[row][col].bg)
      //         }
      //         // 处理单元格字体
      //         if (downOriginData[row][col].v) {
      //           setFontStyle(row, col, downOriginData[row][col].ct.fa, downOriginData[row][col].fs, downOriginData[row][col].fc);
      //         }
      //         if (downOriginData[row][col].ct != null && downOriginData[row][col].ct.t == 'd') {
      //           //  d为时间格式  2019-01-01   或者2019-01-01 10:10:10
      //           arrRow.push(new Date(downOriginData[row][col].m.replace(/\-/g, '/'))) //兼容IE
      //         } else if (downOriginData[row][col].m && isPercentage(downOriginData[row][col])) {
      //           //百分比问题
      //           arrRow.push(downOriginData[row][col].m)
      //         } else {
      //           arrRow.push(downOriginData[row][col].v)
      //         }
      //       }
      //     }
      //     arr.push(arrRow)
      //   }
      //   let opts = {
      //     dateNF: 'm/d/yy h:mm',
      //     cellDates: true,
      //     cellStyles: true
      //   }
      //   let ws = XLSX.utils.aoa_to_sheet(arr, opts)
      //   console.log('ws----', ws)
      //   let reg = /[\u4e00-\u9fa5]/g;
      //   for (let key in ws) {
      //     let item = ws[key]
      //     if (item.t === 'd') {
      //       if (item.w) {
      //         //时间格式的设置
      //         let arr = item.w.split(' ')
      //         if (arr[1] && arr[1] == '0:00') {
      //           ws[key].z = 'm/d/yy'
      //         } else {
      //           item.z = 'yyyy/m/d h:mm:ss'
      //         }
      //       }
      //     } else if (item.t === 's') {
      //       //百分比设置格式
      //       if (item.v && !item.v.match(reg) && item.v.indexOf('%') > -1) {
      //         item.t = 'n'
      //         item.z = '0.00%'
      //         item.v = Number.parseFloat(item.v) / 100
      //       }
      //       else if (item.v && item.v.match(reg)) {
      //         //含有中文的设置居中样式
      //         item['s'] = {
      //           alignment: { vertical: 'center', horizontal: 'center' }
      //         }
      //       }
      //     }
      //     // 设置单元格样式
      //     if (bgConfig[key] && item.v) {
      //       ws[key]['s'] = {
      //         alignment: { vertical: 'center', horizontal: 'center' },
      //         fill: { fgColor: { rgb: bgConfig[key] }},
      //         border: {
      //           top: { style: 'thin', color: { theme: "1" } },
      //           bottom: { style: 'thin', color: { theme: "1" } },
      //           left: { style: 'thin', color: { theme: "1" } },
      //           right: { style: 'thin', color: { theme: "1" } }
      //         },
      //         font: {
      //           color: { rgb: fcObj[key] },
      //           size: fsObj[key],
      //           name: faObj[key],
      //         }
      //       }
      //     }
      //   }
      //   let name = 'sheet1';
      //   let tmpWB = {
      //     SheetNames: [name], //保存的表标题
      //     Sheets: {
      //       [name]: Object.assign({},ws)//内容
      //     }
      //   }
      //   let mergeConfig = sheet1.config.merge
      //   let mergeArr = [];
      //   if (JSON.stringify(mergeConfig) !== '{}') {
      //     mergeArr = handleMergeData(mergeConfig)
      //     console.log('mergeArr', mergeArr)
      //     tmpWB.Sheets[name]['!merges'] = mergeArr
      //   }
      //   //处理合并单元格config数据
      //   function handleMergeData(origin) {　　let result = []
      //     if (origin instanceof Object) {
      //       var r = "r",
      //         c = "c",
      //         cs = "cs",
      //         rs = "rs";
      //       for (var key in origin) {
      //         var startR = origin[key][r];
      //         var endR = origin[key][r];
      //         var startC = origin[key][c];
      //         var endC = origin[key][c];
      //
      //         // 如果只占一行 为1 如果占两行 为2
      //         if (origin[key][cs] > 0) {
      //           endC = startC + (origin[key][cs] - 1);
      //         }
      //         if (origin[key][rs] > 0) {
      //           endR = startR + (origin[key][rs] - 1);
      //         }
      //         // s为合并单元格的开始坐标  e为结束坐标
      //         var obj = { s: { "r": startR, "c": startC }, e: { "r": endR, "c": endC } }
      //         result.push(obj)
      //       }
      //     }　　return result
      //   }
      //   function s2ab(s) {
      //     if (typeof ArrayBuffer !== 'undefined') {
      //       var buf = new ArrayBuffer(s.length);
      //       var view = new Uint8Array(buf);
      //       for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
      //       return buf;
      //     } else {
      //       var buf = new Array(s.length);
      //       for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
      //       return buf;
      //     }
      //   }
      //   function saveAs(obj, fileName) {
      //     var tmpa = document.createElement("a");
      //     tmpa.download = fileName || "download";
      //     tmpa.href = URL.createObjectURL(obj);
      //     tmpa.click();
      //     setTimeout(function () {
      //       URL.revokeObjectURL(obj);
      //     }, 100);
      //   }
      //
      //   ws = new Blob(
      //     [
      //       s2ab(
      //         XLSXS.write(tmpWB, { bookType: 'xlsx', bookSST: false, type: 'binary' })//这里的数据是用来定义导出的格式类型
      //       )
      //     ]
      //   )
      //   saveAs(ws, data.title + '.xlsx')
      // },
            isClose(done) {
                this.$confirm('是否需要保存?', "警告", {
                    confirmButtonText: "确定",