cnhis-design-vue 2.1.32 → 2.1.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cnhis-design-vue",
-  "version": "2.1.32",
+  "version": "2.1.34",
   "description": "前端业务UI库",
   "keyword": "cnhis-design-vue vue cnhis",
   "homepage": "http://dv.cnhis.com/",
@@ -104,4 +104,4 @@
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
     }
   }
-}
+}

package/packages/big-table/src/utils/tableParse.js

@@ -59,38 +59,25 @@ export function parseCombinationValue(value, setting) {
 
 // 格式化renderItem
 export function formatFieldText(row, field, fieldList, fieldListOriginal, isTimeAxisRenderNew, isTimeAxisExpand) {
-  // 轨迹组件需要重新处理 时间显示
-  if (isTimeAxisRenderNew && field.fieldType.includes('DATE')) {
-    let key = field.columnName;
-    if (!isTimeAxisExpand) {
-      key = field.columnName + '_fold';
-    }
-    let text = row[key];
-    return text;
-  }
-  const formatText = text => (text ? text : String(text) === '0' ? '0' : '');
-  const haveValue = val => {
-    return val !== undefined && val !== '';
-  };
   const findField = (columnName, fieldList) => {
     return fieldList.find(item => item.columnName === columnName);
   };
-  let html = formatText(row[field.columnName]);
 
-  // 主字段没有值，则不展示
-  if (!haveValue(html)) {
-    return '';
-  }
+  const haveValue = val => val !== undefined && val !== '';
 
-  const { mergedFeildExpression } = field.settingObj;
-  if (mergedFeildExpression) {
+  const formatText = text => (text ? text : String(text) === '0' ? '0' : '');
+
+  const parseMergedFeildExpression = function(mergedFeildExpression, config) {
+    const { row, fieldListOriginal, html } = config;
     let passList = [];
 
     // 合并字段
+    // 自定义合并规则，当主字段为空则不合并，任一拼接字段为空，则不合并所有拼接字段。
     const regexp = /#{(.+?)\}/g;
     let formatHtml = mergedFeildExpression.replace(regexp, (match, p1) => {
       let findFieldItem = findField(p1, fieldListOriginal);
-      passList.push(haveValue(row[p1]) && findFieldItem);
+      let hasVal = haveValue(row[p1]) && findFieldItem;
+      passList.push(hasVal);
       // 格式化匹配到的合并字段对应的数据项
       if (findFieldItem && this?.formatData) {
         let cloneRow = JSON.parse(JSON.stringify(row));
@@ -106,13 +93,28 @@ export function formatFieldText(row, field, fieldList, fieldListOriginal, isTime
     });
 
     let pass = passList.every(b => b);
-    /* 如果任意次字段值为空 || 无字段权限
-      => 只展示主字段的值 */
+    // 如果任意次字段值为空 || 无字段权限 => 只展示主字段的值
     if (!pass) {
-      return html;
+      return { pass: false, formatHtml: html };
     }
+    return { pass: true, formatHtml };
+  };
+
+  // 分隔合并规则，当主字段为空则不合并，某拼接字段为空则不合并该拼接字段，允许输入空格。
+  const parseMergedSeparator = function(html, config) {
+    let { field, row } = config;
+    let { mergedFeild, mergedSeparator } = field.settingObj;
+    mergedSeparator = mergedSeparator ?? '';
+    mergedFeild = mergedFeild.split(',');
+    if (!mergedFeild.length) return html;
+    mergedFeild.unshift(field.columnName);
+    let feildRes = mergedFeild.map(v => row[v]).filter(v => !!v || v === 0);
+    return feildRes.join(mergedSeparator);
+  };
 
-    // 赋值原字段样式
+  // 赋值原字段样式
+  const getOriginStyle = (formatHtml, config) => {
+    let { field, row, fieldList } = config;
     let originColumnNameColorList = findField(field.columnName, fieldList)?.colorAndIcon || [];
     let findC = originColumnNameColorList.find(c =>
       vexutils.parseCondition(
@@ -129,16 +131,54 @@ export function formatFieldText(row, field, fieldList, fieldListOriginal, isTime
     );
 
     let originColumnNameColor = findC?.color || 'inherit';
-    const regexp2 = /color(:|;)(.+?)(;|")/g;
-    formatHtml = formatHtml.replace(regexp2, (match, p1, p2, p3 = '') => {
-      return p3;
-    });
+    // const regexp2 = /color(:|;)(.+?)(;|")/g;
+    // formatHtml = formatHtml.replace(regexp2, (match, p1, p2, p3 = '') => {
+    //   return p3;
+    // });
 
     formatHtml = `<span style="color: ${originColumnNameColor};">${formatHtml}</span>`;
     return formatHtml;
+  };
+
+  // 轨迹组件需要重新处理 时间显示
+  if (isTimeAxisRenderNew && field.fieldType.includes('DATE')) {
+    let key = field.columnName;
+    if (!isTimeAxisExpand) {
+      key = field.columnName + '_fold';
+    }
+    let text = row[key];
+    return text;
+  }
+
+  let html = formatText(row[field.columnName]);
+
+  // 主字段没有值，则不展示
+  if (!haveValue(html)) {
+    return '';
+  }
+
+  // 合并策略
+  // mergedType 字符串 0-分隔符合并 1-自定义合并
+  // mergedSeparator 分隔合并规则，当主字段为空则不合并，某拼接字段为空则不合并该拼接字段，允许输入空格。
+  // mergedFeildExpression 自定义合并规则，当主字段为空则不合并，任一拼接字段为空，则不合并所有拼接字段。
+  const { mergedType, mergedSeparator, mergedFeild, mergedFeildExpression } = field.settingObj;
+  // 原来的规则只有mergedFeildExpression, mergedType/mergedSeparator是新加的
+  if (!mergedType && !mergedFeildExpression) return html;
+  if (mergedType === '1' && !mergedFeildExpression) return html;
+  if (mergedType === '0' && (!mergedFeild || !mergedSeparator)) return html;
+  let formatHtml = html;
+  if (mergedType === '0') {
+    formatHtml = parseMergedSeparator(html, { field, row });
+  } else if (mergedFeildExpression) {
+    let obj = parseMergedFeildExpression(mergedFeildExpression, { row, fieldListOriginal, html });
+    formatHtml = obj.formatHtml;
+    if (!obj.pass) return formatHtml;
+  }
+  if (mergedType || mergedFeildExpression) {
+    return getOriginStyle(formatHtml, { field, row, fieldList });
   }
 
-  return html;
+  return formatHtml;
 }
 
 // imgs => imgArr

package/packages/fabric-chart/src/const/defaultVaule.js

@@ -1,59 +1,59 @@
-const data = {
-  style: {
-    evented: false,
-    selectable: false
-  },
-  rectStyle: {
-    fill: 'transparent',
-    stroke: '#999',
-    strokeWidth: 1
-  },
-  textStyle: {
-    fontFamily: '微软雅黑',
-    fontSize: 12,
-    fill: '#000',
-    lineHeight: 1
-  },
-  borderStyle: {
-    stroke: '#999',
-    strokeWidth: 1,
-    selectable: false,
-    evented: false
-  },
-  // 折线图中的点
-  pointStyle: {
-    fill: '#ffffff', // 填充色
-    stroke: '#000000', // 描边色
-    originX: 'center',
-    originY: 'center'
-  },
-  // 折线图中的线
-  lineStyle: {
-    stroke: '#000', // 描边色
-    strokeWidth: 1, // 描边宽度
-    originX: 'center',
-    originY: 'center'
-  },
-  topSpaceHeight: 10, // templateData.top.spaceHeight
-  topSpaceGridNumber: 3, // templateData.top.xScalevalue.spaceGridNumber
-  leftSpaceGridNumber: 2, // templateData.left.leftYScalevalue.spaceGridNumber
-  rightSpaceGridNumber: 2, // templateData.right.rightYScalevalue.spaceGridNumber
-  topTotal: {
-    title: '总量',
-    width: 0,
-    style: {
-      fontFamily: '微软雅黑',
-      fontSize: 12,
-      fill: '#000',
-      lineHeight: 1
-    }
-  },
-  criticalStyle: { // 危急值样式
-    stroke: 'purple', // 颜色 默认 #999
-    strokeWidth: 1, // 线宽 默认 1
-    strokeDashArray: [0, 0] // 实线设置 默认[0, 0]
-  },
-  bottomNumberLeftSpace: 10 // 底部标记的序号与标记之间的距离
-};
-
-export default data;
+const data = {
+  style: {
+    evented: false,
+    selectable: false
+  },
+  rectStyle: {
+    fill: 'transparent',
+    stroke: '#999',
+    strokeWidth: 1
+  },
+  textStyle: {
+    fontFamily: '微软雅黑',
+    fontSize: 12,
+    fill: '#000',
+    lineHeight: 1
+  },
+  borderStyle: {
+    stroke: '#999',
+    strokeWidth: 1,
+    selectable: false,
+    evented: false
+  },
+  // 折线图中的点
+  pointStyle: {
+    fill: '#ffffff', // 填充色
+    stroke: '#000000', // 描边色
+    originX: 'center',
+    originY: 'center'
+  },
+  // 折线图中的线
+  lineStyle: {
+    stroke: '#000', // 描边色
+    strokeWidth: 1, // 描边宽度
+    originX: 'center',
+    originY: 'center'
+  },
+  topSpaceHeight: 10, // templateData.top.spaceHeight
+  topSpaceGridNumber: 3, // templateData.top.xScalevalue.spaceGridNumber
+  leftSpaceGridNumber: 2, // templateData.left.leftYScalevalue.spaceGridNumber
+  rightSpaceGridNumber: 2, // templateData.right.rightYScalevalue.spaceGridNumber
+  topTotal: {
+    title: '总量',
+    width: 0,
+    style: {
+      fontFamily: '微软雅黑',
+      fontSize: 12,
+      fill: '#000',
+      lineHeight: 1
+    }
+  },
+  criticalStyle: { // 危急值样式
+    stroke: 'purple', // 颜色 默认 #999
+    strokeWidth: 1, // 线宽 默认 1
+    strokeDashArray: [0, 0] // 实线设置 默认[0, 0]
+  },
+  bottomNumberLeftSpace: 10 // 底部标记的序号与标记之间的距离
+};
+
+export default data;

package/packages/fabric-chart/src/fabric-chart2/FabricTop.vue

@@ -1,172 +1,172 @@
-<script>
-import fabricCommon from '../mixins/fabricCommon';
-import draw from '../mixins/draw';
-import defaultVaule from '../const/defaultVaule';
-
-export default {
-  name: 'fabric-top2',
-  mixins: [fabricCommon, draw],
-  props: {
-    templateData: {
-      type: Object,
-      required: true
-    }
-  },
-  data() {
-    return {};
-  },
-  mounted() {
-    this.$nextTick(() => {
-      this.init();
-    });
-  },
-  computed: {
-    girdLineStyle() {
-      return Object.assign({}, defaultVaule.borderStyle, this.templateData.borderStyle || {});
-    }
-  },
-  methods: {
-    init() {
-      this.drawTop(this.templateData.top);
-      this.canvas.renderAll();
-    },
-    drawTop(top) {
-      let list = [];
-      // 日期
-      this.drawTopDate(top, list);
-      // 上午/下午
-      this.drawTopDay(top, list);
-      // 时间刻度
-      this.drawTopTime(top, list);
-      const group = list.length > 0 ? new this.fabric.Group([...list], { ...defaultVaule.style }) : null;
-      group && group.sendToBack(); // 向下跳底层
-      group && this.canvas.add(group);
-    },
-    drawTopTime(top, list) {
-      const { originX, originY, xCellWidth, table } = this.propItems;
-      const dateHeight = top.date?.height || 0;
-      const dayHeight = top.dayHeight || 0;
-      const height = originY - dateHeight - dayHeight;
-      const titleHeight = dayHeight + height;
-      // 标题
-      const title = this.drawTextGroup(
-        {
-          width: originX,
-          height: titleHeight,
-          ...defaultVaule.rectStyle
-        },
-        {
-          text: String(top.xScalevalue.title),
-          ...defaultVaule.textStyle,
-          ...top.textGroupStyle
-        },
-        {
-          left: 0,
-          top: dateHeight
-        }
-      );
-      list.push(title);
-
-      // 时间列表
-      let timeList = [];
-      for (let j = 0; j < table.mainXCell; j++) {
-        timeList.push(top.xScalevalue.list);
-      }
-      timeList.flat().forEach((v, i) => {
-        const left = originX + i * xCellWidth;
-        const textGroup = this.drawTextGroup(
-          {
-            width: xCellWidth,
-            height
-          },
-          {
-            text: String(v),
-            ...defaultVaule.textStyle,
-            ...top.textGroupStyle
-          },
-          {
-            left,
-            top: dateHeight + dayHeight
-          }
-        );
-        list.push(textGroup);
-      });
-    },
-    drawTopDay(top, list) {
-      if (!top.dayHeight) return false;
-      const { originX, xCellWidth, gridXNumber, table } = this.propItems;
-      const height = top.dayHeight;
-      // 上午下午列表
-      const width = xCellWidth * table.subSecondXCell;
-      const dayList = gridXNumber / table.subSecondXCell;
-      for (let i = 0; i < dayList; i++) {
-        const left = originX + i * width;
-        const value = i % 2 === 0 ? '上午' : '下午';
-        const textGroup = this.drawTextGroup(
-          {
-            width,
-            height
-          },
-          {
-            text: String(value),
-            ...defaultVaule.textStyle,
-            ...top.textGroupStyle
-          },
-          {
-            left,
-            top: top.date.height || 0
-          }
-        );
-        list.push(textGroup);
-      }
-    },
-    drawTopDate(top, list) {
-      if (!top.date.height) return false;
-      const { originX, xCellWidth, table } = this.propItems;
-      const height = top.date.height;
-      // 标题
-      const title = this.drawTextGroup(
-        {
-          width: originX,
-          height,
-          ...defaultVaule.rectStyle
-        },
-        {
-          text: String(top.date.title),
-          ...defaultVaule.textStyle,
-          ...top.textGroupStyle
-        },
-        {
-          left: 0,
-          top: 0
-        }
-      );
-      list.push(title);
-      // 日期列表
-      const width = xCellWidth * table.subXCell;
-      top.date.list.forEach((v, i) => {
-        const left = originX + i * width;
-        const textGroup = this.drawTextGroup(
-          {
-            width,
-            height
-          },
-          {
-            text: String(v),
-            ...defaultVaule.textStyle,
-            ...top.textGroupStyle
-          },
-          {
-            left,
-            top: 0
-          }
-        );
-        list.push(textGroup);
-      });
-    }
-  },
-  render(h) {
-    return this.$slots.default ? h('div', this.$slots.default) : undefined;
-  }
-};
-</script>
+<script>
+import fabricCommon from '../mixins/fabricCommon';
+import draw from '../mixins/draw';
+import defaultVaule from '../const/defaultVaule';
+
+export default {
+  name: 'fabric-top2',
+  mixins: [fabricCommon, draw],
+  props: {
+    templateData: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {};
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.init();
+    });
+  },
+  computed: {
+    girdLineStyle() {
+      return Object.assign({}, defaultVaule.borderStyle, this.templateData.borderStyle || {});
+    }
+  },
+  methods: {
+    init() {
+      this.drawTop(this.templateData.top);
+      this.canvas.renderAll();
+    },
+    drawTop(top) {
+      let list = [];
+      // 日期
+      this.drawTopDate(top, list);
+      // 上午/下午
+      this.drawTopDay(top, list);
+      // 时间刻度
+      this.drawTopTime(top, list);
+      const group = list.length > 0 ? new this.fabric.Group([...list], { ...defaultVaule.style }) : null;
+      group && group.sendToBack(); // 向下跳底层
+      group && this.canvas.add(group);
+    },
+    drawTopTime(top, list) {
+      const { originX, originY, xCellWidth, table } = this.propItems;
+      const dateHeight = top.date?.height || 0;
+      const dayHeight = top.dayHeight || 0;
+      const height = originY - dateHeight - dayHeight;
+      const titleHeight = dayHeight + height;
+      // 标题
+      const title = this.drawTextGroup(
+        {
+          width: originX,
+          height: titleHeight,
+          ...defaultVaule.rectStyle
+        },
+        {
+          text: String(top.xScalevalue.title),
+          ...defaultVaule.textStyle,
+          ...top.textGroupStyle
+        },
+        {
+          left: 0,
+          top: dateHeight
+        }
+      );
+      list.push(title);
+
+      // 时间列表
+      let timeList = [];
+      for (let j = 0; j < table.mainXCell; j++) {
+        timeList.push(top.xScalevalue.list);
+      }
+      timeList.flat().forEach((v, i) => {
+        const left = originX + i * xCellWidth;
+        const textGroup = this.drawTextGroup(
+          {
+            width: xCellWidth,
+            height
+          },
+          {
+            text: String(v),
+            ...defaultVaule.textStyle,
+            ...top.textGroupStyle
+          },
+          {
+            left,
+            top: dateHeight + dayHeight
+          }
+        );
+        list.push(textGroup);
+      });
+    },
+    drawTopDay(top, list) {
+      if (!top.dayHeight) return false;
+      const { originX, xCellWidth, gridXNumber, table } = this.propItems;
+      const height = top.dayHeight;
+      // 上午下午列表
+      const width = xCellWidth * table.subSecondXCell;
+      const dayList = gridXNumber / table.subSecondXCell;
+      for (let i = 0; i < dayList; i++) {
+        const left = originX + i * width;
+        const value = i % 2 === 0 ? '上午' : '下午';
+        const textGroup = this.drawTextGroup(
+          {
+            width,
+            height
+          },
+          {
+            text: String(value),
+            ...defaultVaule.textStyle,
+            ...top.textGroupStyle
+          },
+          {
+            left,
+            top: top.date.height || 0
+          }
+        );
+        list.push(textGroup);
+      }
+    },
+    drawTopDate(top, list) {
+      if (!top.date.height) return false;
+      const { originX, xCellWidth, table } = this.propItems;
+      const height = top.date.height;
+      // 标题
+      const title = this.drawTextGroup(
+        {
+          width: originX,
+          height,
+          ...defaultVaule.rectStyle
+        },
+        {
+          text: String(top.date.title),
+          ...defaultVaule.textStyle,
+          ...top.textGroupStyle
+        },
+        {
+          left: 0,
+          top: 0
+        }
+      );
+      list.push(title);
+      // 日期列表
+      const width = xCellWidth * table.subXCell;
+      top.date.list.forEach((v, i) => {
+        const left = originX + i * width;
+        const textGroup = this.drawTextGroup(
+          {
+            width,
+            height
+          },
+          {
+            text: String(v),
+            ...defaultVaule.textStyle,
+            ...top.textGroupStyle
+          },
+          {
+            left,
+            top: 0
+          }
+        );
+        list.push(textGroup);
+      });
+    }
+  },
+  render(h) {
+    return this.$slots.default ? h('div', this.$slots.default) : undefined;
+  }
+};
+</script>

package/packages/form-table/src/components/table-component/table-month-picker/table-month-picker.vue

@@ -1,5 +1,7 @@
 <template>
-  <a-month-picker
+  <a-date-picker
+    mode="month"
+    format="YYYY-MM"
     v-if="!isDetail || row[item.val_key]"
     v-model="row[item.val_key]"
     :ref="'monthPicker-' + item.val_key"