vue2-client 1.12.28 → 1.12.30

package/src/base-client/components/common/XReportGrid/XReport.vue

@@ -2,31 +2,28 @@
   <div>
     <!--  骨架屏  -->
     <a-card v-if="showSkeleton">
-      <a-skeleton active/>
+      <a-skeleton active />
     </a-card>
     <!--   主体表格   -->
     <XReportDesign
-      @updateImg="updateImg"
       @selectRow="selectRow"
       @slotRendered="slotRendered"
       v-if="scanFinish"
-      :show-img-in-cell="showImgInCell"
-      :img-prefix="imgPrefix"
-      :use-oss-for-img="useOssForImg"
       :display-only="displayOnly"
-      :config="type === 'display' ? originalConfig : activeConfig"
-      :slot-config-name="type === 'display' ? undefined : activatedSlotName"
-      :for-display="type === 'display'"
+      :config="originalConfig"
+      :slot-config-name="undefined"
+      :for-display="true"
       ref="XReportDesign"
       :server-name="serverName"
       :env="env"
       :show-title="showTitle"
-      :no-padding="noPadding"
-      :no-top-border="noTopBorder"
-      :show-images="hasImages"
-      :image-list="imageList">
+    >
     </XReportDesign>
-    <a-row type="flex" justify="end" v-if="showSaveButton">
+    <a-row
+      type="flex"
+      justify="end"
+      v-if="showSaveButton"
+    >
       <a-space>
         <a-button @click="saveConfig">
           提交
@@ -65,107 +62,109 @@ export default {
       type: Array,
       default: () => {
         return []
-      }
+      },
     },
     // 控制用户权限，user和admin
     authority: {
       type: String,
-      default: 'user'
+      default: 'user',
     },
     // 是否为编辑模式
     editMode: {
       type: Boolean,
-      default: true
+      default: true,
     },
     // 配置名
     configName: {
       type: String,
-      required: true
+      required: true,
     },
     // 插槽名
     activatedSlotName: {
       type: String,
-      default: undefined
+      default: undefined,
     },
     // 本地配��，调试用
     localConfig: {
       type: Object,
-      default: undefined
+      default: undefined,
     },
     // 兼容老版本配置
     dontFormat: {
       type: Boolean,
-      default: true
+      default: true,
     },
     showImgInCell: {
       type: Boolean,
-      default: false
+      default: false,
     },
     // 数据
     configData: {
       type: Object,
-      default: undefined
+      default: undefined,
     },
     // 命名空间
     serverName: {
       type: String,
-      default: process.env.VUE_APP_SYSTEM_NAME
+      default: process.env.VUE_APP_SYSTEM_NAME,
     },
     // 环境
     env: {
       type: String,
-      default: 'prod'
+      default: 'prod',
     },
     // 只做展示
     displayOnly: {
       type: Boolean,
-      default: true
+      default: true,
     },
     // 表格没有边距
     noPadding: {
       type: Boolean,
-      default: true
+      default: true,
     },
     // 表格没有上边框，与noPadding搭配可以实现连续表格
     noTopBorder: {
       type: Boolean,
-      default: false
+      default: false,
     },
     // 是否展示标题
     showTitle: {
       type: Boolean,
-      default: true
+      default: true,
     },
     // 是否展示保存按钮
     showSaveButton: {
       type: Boolean,
-      default: false
+      default: false,
     },
     // 是否将组件注册到外层提供的容器中，方便外侧统一保存
     registerMap: {
       type: Array,
-      default: undefined
+      default: undefined,
     },
     // 是否小插件模式，小插件模式不会有各种边境
     isWidget: {
       type: Boolean,
-      default: false
+      default: false,
     },
     // 图片是否使用OSS来保存
     useOssForImg: {
       type: Boolean,
-      default: true
+      default: true,
     },
     // 图片上传后添加前缀
     imgPrefix: {
       type: String,
-      default: undefined
-    }
+      default: undefined,
+    },
   },
   components: {
-    XAddReport: () => import('@vue2-client/base-client/components/common/XAddReport'),
-    XReportDrawer: () => import('@vue2-client/base-client/components/common/XReportDrawer'),
-    XReportDesign
+    XAddReport: () =>
+      import('@vue2-client/base-client/components/common/XAddReport'),
+    XReportDrawer: () =>
+      import('@vue2-client/base-client/components/common/XReportDrawer'),
+    XReportDesign,
   },
   data () {
     return {
@@ -198,7 +197,7 @@ export default {
       dataCache: undefined,
       // 判断哪些数据被更改了，存储对应的key
       diff: [],
-      globalData: {}
+      globalData: {},
     }
   },
   beforeDestroy () {
@@ -208,10 +207,15 @@ export default {
     // 如果配置名更改了，重新获取配置
     configName (val) {
       if (val) {
-        getConfigByName(this.configName, undefined, res => {
-          this.config = res
-          this.configInit()
-        }, this.env === 'dev')
+        getConfigByName(
+          this.configName,
+          undefined,
+          (res) => {
+            this.config = res
+            this.configInit()
+          },
+          this.env === 'dev'
+        )
       }
     },
     // 如果本地配置更改了，重新初始化
@@ -223,7 +227,7 @@ export default {
           this.config = val
           this.configInit()
         }
-      }
+      },
     },
   },
   provide () {
@@ -265,12 +269,20 @@ export default {
       const outputList = []
       for (const lst of inputList) {
         // 如果列表为空或只有一个元素，则所有元素相等。比较列表中每个元素是否与第一个元素相等
-        if (lst.length >= 1 && !lst.every(x => Array.isArray(x) || Array.isArray(lst[0]) || x.rowSpan === lst[0].rowSpan)) {
-            operationList = lst
-            break // 使用 break 退出整个循环
+        if (
+          lst.length >= 1 &&
+          !lst.every(
+            (x) =>
+              Array.isArray(x) ||
+              Array.isArray(lst[0]) ||
+              x.rowSpan === lst[0].rowSpan
+          )
+        ) {
+          operationList = lst
+          break // 使用 break 退出整个循环
         } else {
-            // 被操作的行
-            operationIndex += 1
+          // 被操作的行
+          operationIndex += 1
         }
       }
 
@@ -278,62 +290,61 @@ export default {
 
       // 没有需要合并的行,直接返回
       if (operationList.length === 0) {
-          return inputList
+        return inputList
       } else {
-          // 当前行的最大值
-          const maxRow = Math.max(...operationList.map(item => item.rowSpan))
-          let mergeIndexCol = 0
-          for (let index = 0; index < operationList.length; index++) {
-              const row = operationList[index]
-              let rowSpan = row.rowSpan
-              // 需要合并的行
-              let mergeIndexRow = operationIndex + 1
-              // 存放合并后的行
-              const rows = []
-              // 添加当前行
-              if (rowSpan < maxRow && mergeIndexRow < inputList.length) {
-                rows.push([row])
-              }
-              // 当前需要被操作并且操作行没有超出列表的高度
-              while (rowSpan < maxRow && mergeIndexRow < inputList.length) {
-                  rowSpan += inputList[mergeIndexRow][mergeIndexCol].rowSpan
-                  // 放一行到合并结果
-                  rows.push([inputList[mergeIndexRow][mergeIndexCol]])
-                  if (mergeIndexRow > maxMergeRow) {
-                      // 记录最多操作到了哪行
-                      maxMergeRow = mergeIndexRow
-                  }
-                  mergeIndexRow++
-              }
-              // operation_list赋值, 没有变化的，不处理
-              if (rows.length !== 0) {
-                operationList[index] = rows
-              }
-              if (row.rowSpan !== maxRow) {
-                  mergeIndexCol++ // 操作列转为下一列
-              }
+        // 当前行的最大值
+        const maxRow = Math.max(...operationList.map((item) => item.rowSpan))
+        let mergeIndexCol = 0
+        for (let index = 0; index < operationList.length; index++) {
+          const row = operationList[index]
+          let rowSpan = row.rowSpan
+          // 需要合并的行
+          let mergeIndexRow = operationIndex + 1
+          // 存放合并后的行
+          const rows = []
+          // 添加当前行
+          if (rowSpan < maxRow && mergeIndexRow < inputList.length) {
+            rows.push([row])
+          }
+          // 当前需要被操作并且操作行没有超出列表的高度
+          while (rowSpan < maxRow && mergeIndexRow < inputList.length) {
+            rowSpan += inputList[mergeIndexRow][mergeIndexCol].rowSpan
+            // 放一行到合并结果
+            rows.push([inputList[mergeIndexRow][mergeIndexCol]])
+            if (mergeIndexRow > maxMergeRow) {
+              // 记录最多操作到了哪行
+              maxMergeRow = mergeIndexRow
+            }
+            mergeIndexRow++
+          }
+          // operation_list赋值, 没有变化的，不处理
+          if (rows.length !== 0) {
+            operationList[index] = rows
           }
+          if (row.rowSpan !== maxRow) {
+            mergeIndexCol++ // 操作列转为下一列
+          }
+        }
       }
 
       // 组成outputlist, operation_list前部填入
       let putindex = 0
       while (operationIndex > 0) {
-          outputList.push(inputList[putindex])
-          putindex++
-          operationIndex -= 1
+        outputList.push(inputList[putindex])
+        putindex++
+        operationIndex -= 1
       }
 
       outputList.push(operationList)
 
       // 组成outputlist, operation_list后部填入
       while (maxMergeRow < inputList.length - 1) {
-          outputList.push(inputList[maxMergeRow + 1])
-          maxMergeRow += 1
+        outputList.push(inputList[maxMergeRow + 1])
+        maxMergeRow += 1
       }
 
       return this.transformArray(outputList)
     },
-
     // 根据名字从注册到组件中获取组件
     getComponentByName (componentName) {
       console.log('内部取组件', this.$options.name, componentName)
@@ -360,7 +371,7 @@ export default {
         selectedId: selectedId,
         mixinData: mixinData,
         outEnv: outEnv,
-        attr
+        attr,
       })
     },
     openDrawer (configName, selectedId, mixinData, outEnv = {}, attr = {}) {
@@ -370,7 +381,7 @@ export default {
         selectedId,
         mixinData,
         outEnv,
-        attr
+        attr,
       })
     },
     // 向外暴露图片修改后的数据，某些外部需要自己管理图片的保存与修改
@@ -385,15 +396,19 @@ export default {
         tempData = this.originalConfig.data
       } else {
         const tempDataKeys = Object.keys(this.activeConfig.tempData)
-        tempDataKeys.forEach(key => {
-          this.changeDeepObject(this.activeConfig.data, key, this.activeConfig.tempData[key])
+        tempDataKeys.forEach((key) => {
+          this.changeDeepObject(
+            this.activeConfig.data,
+            key,
+            this.activeConfig.tempData[key]
+          )
         })
         tempData = this.activeConfig.data
       }
       // 对比数据的差异
       this.diff = []
       this.compareProps(tempData, this.dataCache)
-      this.diff.forEach(eachDiff => {
+      this.diff.forEach((eachDiff) => {
         const arr = eachDiff.split('.')
         let targetData = tempData[arr[0]]
         if (arr.length !== 1) {
@@ -419,7 +434,10 @@ export default {
             this.diff.push(path + key)
           }
           // 如果都是对象，并且存在同样的key，递归子key
-        } else if (typeof obj1[key] === 'object' && typeof obj2[key] === 'object') {
+        } else if (
+          typeof obj1[key] === 'object' &&
+          typeof obj2[key] === 'object'
+        ) {
           this.compareProps(obj1[key], obj2[key], path + key + '.')
           // 如果不是obj，对比其数据
         } else if (obj1[key] !== obj2[key]) {
@@ -474,9 +492,9 @@ export default {
       const slotsDeclare = config.slotsDeclare
       const total = slotsDeclare.length
       let count = 0
-      slotsDeclare.forEach(declare => {
-        config.columns.forEach(row => {
-          row.forEach(cell => {
+      slotsDeclare.forEach((declare) => {
+        config.columns.forEach((row) => {
+          row.forEach((cell) => {
             if (cell.slotConfig === declare) {
               count++
             }
@@ -491,7 +509,10 @@ export default {
       for (let i = 0; i < this.config.columns.length; i++) {
         // 对原始数组进行递归，依次将该位置拆分为三个部分，当前处理位置之前的，当前处理位置，当前处理位置之后的
         const before = this.config.columns.slice(0, i)
-        const after = this.config.columns.slice(i + 1, this.config.columns.length)
+        const after = this.config.columns.slice(
+          i + 1,
+          this.config.columns.length
+        )
 
         // 将当前处理的数组交给处理的方法
         const x = this.checkRow(this.config.columns[i])
@@ -501,7 +522,7 @@ export default {
         // 拼接之前的数组
         if (before.length > 0) {
           if (before.length >= 1) {
-            before.forEach(item => {
+            before.forEach((item) => {
               newArr.push(item)
             })
           } else {
@@ -525,7 +546,7 @@ export default {
         // 拼接之后的数组
         if (after.length > 0) {
           if (after.length >= 1) {
-            after.forEach(item => {
+            after.forEach((item) => {
               newArr.push(item)
             })
           } else {
@@ -575,21 +596,22 @@ export default {
       let forEachCount = 0
 
       // 标记所有数据
-      rowArr.forEach(cell => {
+      rowArr.forEach((cell) => {
         forEachCount++
         // 如果该行没有rowspan则默认其为1，不要影响统计结果
         if (!cell.rowSpan) {
           cell.rowSpan = 0
         }
 
-        if (cell.text && total !== 0) { // 如果遇到了下一个声明行，证明rowspan少了一行，需要补充一个占位格
+        if (cell.text && total !== 0) {
+          // 如果遇到了下一个声明行，证明rowspan少了一行，需要补充一个占位格
           const nullObj = {
             type: 'placeHolderColumn',
             order: subRowIndex,
             noBoarder: true,
             needSplit: true,
             colSpan: preColSpan,
-            dontShowRow: true
+            dontShowRow: true,
           }
           subRowIndex++
           waitForAddArr.push(nullObj)
@@ -597,7 +619,10 @@ export default {
           count = 0
           titleCellFlag = false
           firstSubLine = false
-        } else if ((total !== count + cell.rowSpan) && forEachCount === rowArr.length) {
+        } else if (
+          total !== count + cell.rowSpan &&
+          forEachCount === rowArr.length
+        ) {
           // 如果没有遇到了下一个声明行，但已经是当前行最后一个数据，也证明rowspan少了一行，需要补充一个占位格
           const nullObj = {
             type: 'placeHolderColumn',
@@ -605,7 +630,7 @@ export default {
             noBoarder: true,
             needSplit: true,
             colSpan: preColSpan,
-            dontShowRow: true
+            dontShowRow: true,
           }
           subRowIndex++
           waitForAddArr.push(nullObj)
@@ -624,13 +649,15 @@ export default {
           subRowIndex = 1
           cell.show = true
           cell.showRowSpan = total
-        } else if (cell.rowSpan > 0 && !titleCellFlag && firstSubLine) { // 判断是否为声明行后首行，因为首行不需要移动
+        } else if (cell.rowSpan > 0 && !titleCellFlag && firstSubLine) {
+          // 判断是否为声明行后首行，因为首行不需要移动
           count += cell.rowSpan
           firstSubLine = false
           cell.noBoarder = true
           cell.show = true
           cell.showRowSpan = total
-        } else if (cell.rowSpan > 0 && !titleCellFlag && !firstSubLine) { // 既非声明行，也非首行，需要移动
+        } else if (cell.rowSpan > 0 && !titleCellFlag && !firstSubLine) {
+          // 既非声明行，也非首行，需要移动
           count += cell.rowSpan
           // cell.type = 'notShow'
           cell.needSplit = true
@@ -639,7 +666,10 @@ export default {
           subRowIndex++
 
           // 如果之前添加过空行补充位置，刚好最后一位还有内容，将其互换
-          if (forEachCount === rowArr.length && !waitForAddArr[waitForAddArr.length - 1].dataIndex) {
+          if (
+            forEachCount === rowArr.length &&
+            !waitForAddArr[waitForAddArr.length - 1].dataIndex
+          ) {
             waitForAddArr[waitForAddArr.length - 1].order += 1
             cell.order -= 1
             waitForAddArr.push(cell)
@@ -660,14 +690,14 @@ export default {
       })
 
       // 将所有不需要移动的放入original
-      rowArr.forEach(cell => {
+      rowArr.forEach((cell) => {
         if (cell.needSplit !== true) {
           original.push(cell)
         }
       })
 
       // 增加新的数组
-      waitForAddArr.forEach(cell => {
+      waitForAddArr.forEach((cell) => {
         const target = cell.order
         // if (cell.type === 'notShow') {
         //   cell.type = 'inputs'
@@ -684,7 +714,7 @@ export default {
 
       // 如果没有新增，将单元格边框设置为显示
       if (addArr.length < 1) {
-        original.forEach(cell => {
+        original.forEach((cell) => {
           if (cell.type === 'input' || cell.type === 'inputs') {
             cell.noBoarder = false
           }
@@ -693,7 +723,7 @@ export default {
 
       return {
         old: original,
-        add: addArr
+        add: addArr,
       }
     },
     // 扫描配置，如果有插槽则拼接插槽
@@ -705,7 +735,10 @@ export default {
           if (columnsArr[i][j].type === 'slot') {
             const targetName = columnsArr[i][j].slotConfig
             // 找不到目标插槽配置
-            if (!this.configFromWeb[targetName] || !this.configFromWeb[targetName].columns) {
+            if (
+              !this.configFromWeb[targetName] ||
+              !this.configFromWeb[targetName].columns
+            ) {
               console.error('无法找到目标插槽的配置！')
               return
             }
@@ -716,9 +749,13 @@ export default {
             let after = config.columns.slice(i + 1, config.columns.length)
 
             const addArr = []
-            for (let k = 0; k < this.configFromWeb[targetName].columns.length; k++) {
+            for (
+              let k = 0;
+              k < this.configFromWeb[targetName].columns.length;
+              k++
+            ) {
               const temp = []
-              this.configFromWeb[targetName].columns[k].forEach(cell => {
+              this.configFromWeb[targetName].columns[k].forEach((cell) => {
                 temp.push(cell)
               })
               addArr.push(temp)
@@ -728,7 +765,7 @@ export default {
             // 拼接之前的数组
             if (before.length > 0) {
               if (before.length >= 1) {
-                before.forEach(item => {
+                before.forEach((item) => {
                   newArr.push(item)
                 })
               } else {
@@ -736,7 +773,7 @@ export default {
               }
             }
 
-            addArr.forEach(arr => {
+            addArr.forEach((arr) => {
               newArr.push(arr)
             })
 
@@ -748,7 +785,7 @@ export default {
             }
             if (after.length > 0) {
               if (after.length >= 1) {
-                after.forEach(item => {
+                after.forEach((item) => {
                   newArr.push(item)
                 })
               } else {
@@ -763,11 +800,20 @@ export default {
               config.slotsDeclare = []
             }
 
-            if (config.data.images && this.configFromWeb[targetName].data.images) {
-              config.data.images = { ...config.data.images, ...this.configFromWeb[targetName].data.images }
+            if (
+              config.data.images &&
+              this.configFromWeb[targetName].data.images
+            ) {
+              config.data.images = {
+                ...config.data.images,
+                ...this.configFromWeb[targetName].data.images,
+              }
               delete this.configFromWeb[targetName].data.images
             }
-            config.data = { ...config.data, ...this.configFromWeb[targetName].data }
+            config.data = {
+              ...config.data,
+              ...this.configFromWeb[targetName].data,
+            }
           }
         }
       }
@@ -776,7 +822,7 @@ export default {
     // 扫描所有插槽名
     scanConfigName (config, resut) {
       if (config.slotsDeclare) {
-        config.slotsDeclare.forEach(name => {
+        config.slotsDeclare.forEach((name) => {
           resut.push(name)
         })
       }
@@ -794,11 +840,16 @@ export default {
         let count = 0
 
         // 挨个获取插槽
-        waitForDownloadSlotName.forEach(configName => {
-          getConfigByName(configName, this.serverName, res => {
-            this.configFromWeb[configName] = res
-            count++
-          }, this.env === 'dev')
+        waitForDownloadSlotName.forEach((configName) => {
+          getConfigByName(
+            configName,
+            this.serverName,
+            (res) => {
+              this.configFromWeb[configName] = res
+              count++
+            },
+            this.env === 'dev'
+          )
         })
 
         // 使用定时器循环判断锁状态，用于多个插槽，要等待统一获取完成之后，再进行下一步初始化
@@ -838,20 +889,26 @@ export default {
       this.activeConfig = this.config
       this.showSkeleton = false
       // 判断是否有动态Index
-      this.activeConfig.columns.forEach(row => {
-        row.forEach(cell => {
+      this.activeConfig.columns.forEach((row) => {
+        row.forEach((cell) => {
           if (cell.dynamicDataIndex === true) {
             // 如果有动态index，取其函数，运行函数得到真实index保存
             // eslint-disable-next-line no-eval
-            const func = eval('(' + cell.customFunctionForDynamicDataIndex + ')')
+            const func = eval(
+              '(' + cell.customFunctionForDynamicDataIndex + ')'
+            )
             cell.dataIndex = func(this.config)
           }
           // 处理 自定义函数的旧逻辑
-          if (['action', 'click'].includes(cell.eventType) && cell.customFunction && !cell.events) {
+          if (
+            ['action', 'click'].includes(cell.eventType) &&
+            cell.customFunction &&
+            !cell.events
+          ) {
             cell.events = []
             cell.events.push({
               type: cell.eventType,
-              customFunction: cell.customFunction
+              customFunction: cell.customFunction,
             })
           }
         })
@@ -859,39 +916,32 @@ export default {
       // 将数据复制到临时数据中，带有@@@的数据，我们将其整体作为一个key保存，当编辑完成后，再将其解析，回填到需要的数据中
       this.activeConfig.tempData = {}
       // 是否有@@@深层引用
-      this.activeConfig.columns.forEach(row => {
-        row.forEach(cell => {
+      this.activeConfig.columns.forEach((row) => {
+        row.forEach((cell) => {
           // 将@@@解析
-          if (cell.dataIndex !== undefined && cell.dataIndex.indexOf('@@@') !== -1) {
-            this.activeConfig.tempData[cell.dataIndex] = this.getDeepObject(this.activeConfig.data, cell.dataIndex)
+          if (
+            cell.dataIndex !== undefined &&
+            cell.dataIndex.indexOf('@@@') !== -1
+          ) {
+            this.activeConfig.tempData[cell.dataIndex] = this.getDeepObject(
+              this.activeConfig.data,
+              cell.dataIndex
+            )
           }
         })
       })
 
       // 对配置进行转换
       console.log('转换前配置', this.config)
-      this.originalConfig.columns = this.transformArray(JSON.parse(JSON.stringify(this.config.columns)))
+      this.originalConfig.columns = this.transformArray(
+        JSON.parse(JSON.stringify(this.config.columns))
+      )
       console.log('转换后的列描述', this.originalConfig.columns)
 
       this.$nextTick(() => {
         this.scanFinish = true
       })
     },
-    // 初始化JSON配置
-    jsonConfigInit () {
-      if (this.configData === undefined) {
-        console.error('未找到数据！')
-      } else {
-        this.originalConfig = Object.assign({}, this.config)
-        this.originalConfig.data = JSON.parse(JSON.stringify(this.configData))
-        this.type = 'display'
-        // this.onlyDisplay = true
-        this.showSkeleton = false
-        this.$nextTick(() => {
-          this.scanFinish = true
-        })
-      }
-    },
   },
   beforeMount () {
     // 如果只是展示
@@ -912,23 +962,28 @@ export default {
       this.configInit()
     } else {
       // 如果本地配置没有值，则从琉璃中获取
-      getConfigByName(this.configName, this.serverName, res => {
-        this.config = JSON.parse(JSON.stringify(res))
-        if (this.configData !== undefined) {
-          this.config.data = this.configData
-        }
-        if (this.config.data.images === undefined) {
-          this.config.data.images = {}
-        }
-        this.configInit()
-      }, this.env === 'dev')
+      getConfigByName(
+        this.configName,
+        this.serverName,
+        (res) => {
+          this.config = JSON.parse(JSON.stringify(res))
+          if (this.configData !== undefined) {
+            this.config.data = this.configData
+          }
+          if (this.config.data.images === undefined) {
+            this.config.data.images = {}
+          }
+          this.configInit()
+        },
+        this.env === 'dev'
+      )
     }
   },
   computed: {
     ...mapState('account', { currUser: 'user' }),
     widget () {
       return this.isWidget // 返回isWidget的值
-    }
+    },
   },
   mounted () {
     // 如果外界传来了registerMap，我们将本VM对象注册到map中
@@ -943,7 +998,7 @@ export default {
         this.dataCache = JSON.parse(JSON.stringify(this.config.data))
       }
     }
-  }
+  },
 }
 </script>