cnhis-design-vue 2.1.121 → 2.1.122

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cnhis-design-vue",
-  "version": "2.1.121",
+  "version": "2.1.122",
   "description": "前端业务UI库",
   "keyword": "cnhis-design-vue vue cnhis",
   "homepage": "http://dv.cnhis.com/",

package/packages/fabric-chart/src/FabricChart.vue

@@ -2,7 +2,7 @@
   <div class="c-fabric-chart" :style="{ width: canvasWidth }">
     <fabric-canvas ref="canvasEle" v-bind="$attrs" :templateData="templateData" v-if="rendercanvas">
       <fabric-grid></fabric-grid>
-      <fabric-text-group v-if="hasXScalevalue" :templateData="templateData" v-on="$listeners"></fabric-text-group>
+      <fabric-text-group ref="otherGroups" v-if="hasXScalevalue" :templateData="templateData" v-on="$listeners"></fabric-text-group>
       <fabric-scale-value v-if="hasTable" :templateData="templateData"></fabric-scale-value>
       <fabric-lines v-if="hasTopTable" ref="lines" :linesObj="templateData.top" v-on="$listeners"></fabric-lines>
       <fabric-polylines
@@ -113,6 +113,9 @@ export default create({
     repaintLine() {
       this.$refs.lines?.repaintLine();
     },
+    updateExtracorporealCirculation() {
+      this.$refs.otherGroups?.updateExtracorporealCirculation();
+    },
     toDataURL(option) {
       return this.$refs.canvasEle.toDataURL(option);
     },

package/packages/fabric-chart/src/fabric-chart/FabricTextGroup.vue

@@ -100,7 +100,7 @@ export default {
       this.drawBorder();
       // this.canvas.renderAll();
       if (this.templateData.bottom) {
-        this.drawExtracorporealCirculation(this.extracorporealCirculation);
+        this.drawExtracorporealCirculation();
         this.drawBottomTextDataGroup(this.templateData.bottom);
       }
     },
@@ -485,7 +485,8 @@ export default {
       });
       this.canvas.add(title);
       // textList.push(title);
-      const baseY = endY + 2; // 目前固定10像素的下边距
+      const _endY = this.extracorporealCirculationHeight ? endY + this.extracorporealCirculationHeight : endY;
+      const baseY = _endY + 2; // 目前固定10像素的下边距
       const baseYLimit = endY - 2; // 目前固定10像素的上边距
       const lineHeightText = (obj.style?.fontSize || 12) + 2;
       const lineHeightImg = (obj.iconStyle?.height || 12) + 2;

package/packages/fabric-chart/src/mixins/drawExtracorporealCirculation.js

@@ -1,16 +1,23 @@
 import cloneDeep from 'lodash/cloneDeep';
+import vexutils, { moment } from '@/utils/vexutils';
 
 export default {
   name: 'drawExtracorporealCirculation',
   data() {
     this.extracorporealCirculation = cloneDeep(this.templateData.bottom?.extracorporealCirculation);
     this.extracorporealCirculationObjs = [];
+    this.extracorporealCirculationHeight = 0;
     return {};
   },
   components: {},
   methods: {
-    drawExtracorporealCirculation(extracorporealCirculation) {
+    updateExtracorporealCirculation() {
+      this.extracorporealCirculation = cloneDeep(this.templateData.bottom?.extracorporealCirculation);
+      this.drawExtracorporealCirculation();
+    },
+    drawExtracorporealCirculation() {
       const { endX, originX, endY, markHeight, canvasWidth } = this.propItems;
+      const extracorporealCirculation = this.extracorporealCirculation;
       if (!markHeight || !extracorporealCirculation || !extracorporealCirculation.list?.length) {
         return;
       }
@@ -32,19 +39,26 @@ export default {
 
         let prevShadowBox;
         xList.forEach((x, i) => {
+          if (isInvalid(x)) return;
+
           const nextX = xList[i + 1];
           const prevX = xList[i - 1];
           if (isValid(x) || isValid(nextX)) {
             const x1 = isValid(x) ? x : originX;
-            const x2 = isValid(nextX) ? nextX : endX;
+            const x2 = isValid(nextX) ? nextX : isInvalid(nextX) ? null : endX;
             const prevX1 = isValid(prevX) ? prevX : originX;
             const shadowBox = {};
-            if (i < xList.length - 1) {
+            if (i < xList.length - 1 && x2) {
               shadowBox.params = [x1, x2, y2, [0, 2].includes(i) ? extracorporealCirculationStyle : ascendAortaStyle];
               shadowBox.shadowObjs = this.drawShadowBox(...shadowBox.params);
             }
             if (isValid(x)) {
               const key = getKey(i);
+              const currentTime = moment()
+                .clone()
+                .format('YYYY-MM-DD HH:mm');
+              const currentTimeX = this.computedX(currentTime);
+              const limitX2 = x < currentTimeX && isValid(currentTimeX) ? currentTimeX : x;
               const optLine = this.drawOptLine([x, endY, x, y2], {
                 origin: {
                   index,
@@ -53,7 +67,8 @@ export default {
                 },
                 limitX: {
                   x1: i === 0 ? prevEndX ?? originX : prevX1,
-                  x2
+                  x2: x2 || limitX2,
+                  isCurrentTime: !x2 && index === list.length - 1
                 },
                 ...([1, 2, 3].includes(i) ? { leftShadowBox: prevShadowBox } : {}),
                 ...([0, 1, 2].includes(i) ? { rightShadowBox: shadowBox } : {})
@@ -63,7 +78,7 @@ export default {
                 prevLine = optLine;
               }
               if (i === 0 && prevLine) {
-                prevLine.limitX.x2 = shadowBox.params[0];
+                prevLine.limitX.x2 = x1;
               }
             }
             prevShadowBox = shadowBox;
@@ -71,9 +86,16 @@ export default {
         });
       });
 
+      if (this.extracorporealCirculationObjs.length) {
+        this.extracorporealCirculationHeight = height;
+      }
+
       function isValid(x) {
         return x && x > 0 && x < canvasWidth;
       }
+      function isInvalid(x) {
+        return typeof x === 'undefined' || x === '';
+      }
       function getKey(i) {
         switch (i) {
           case 0:
@@ -108,6 +130,14 @@ export default {
       if (this.eventStyle.evented) {
         optLine.on('moving', () => {
           const { left, limitX } = optLine;
+          const { canvasWidth } = this.propItems;
+          const currentTime = moment()
+            .clone()
+            .format('YYYY-MM-DD HH:mm');
+          const currentTimeX = this.computedX(currentTime);
+          if (limitX.isCurrentTime && limitX.x2 < currentTimeX && currentTimeX > 0 && currentTimeX < canvasWidth) {
+            limitX.x2 = currentTimeX;
+          }
           if (left < limitX.x1) {
             optLine.setCoords().set({ x1: limitX.x1, x2: limitX.x1 });
           }

package/packages/full-calendar/src/FullCalendar.vue

@@ -641,6 +641,10 @@ export default create({
 
         .fc-col-header-cell-cushion {
           font-weight: normal;
+          & > span {
+            padding: 10px 0;
+            display: inline-block;
+          }
         }
 
         .fc-more-popover {
@@ -719,8 +723,7 @@ export default create({
         }
 
         .month-header {
-          height: 60px;
-          line-height: 60px;
+          padding: 10px 0;
           font-size: 14px;
           font-weight: normal;
           color: #212121;

package/packages/full-calendar/src/components/ListTag.vue

@@ -9,7 +9,7 @@
         </div>
         <div class="list-tag__right">
           <div v-for="(item, index) in data.list" :key="index">
-            <tag v-bind="$attrs" v-on="$listeners" :item="item" :title="item.title" :state="data.state" :avatar="item.avatar" :isAllDay="item.isAllDay"></tag>
+            <tag v-bind="$attrs" v-on="$listeners" :item="item" :title="item.title" :state="item.state" :avatar="item.avatar" :isAllDay="item.isAllDay"></tag>
           </div>
         </div>
       </li>

package/packages/full-calendar/src/components/Tag.vue

@@ -1,9 +1,9 @@
 <template>
   <div :class="['event-tag', 'event-tag-' + viewType, { 'event-tag--active': isActive }, { 'event-tag-allday': isAllDay }]" @click.stop="clickTag" ref="tagRef">
     <div :class="['event-tag__main', statusClass[state]]">
-      <span class="event-tag__main__text-time" v-if="viewType === 'list'">{{ timeRange }}</span>
-      <span class="event-tag__main__text-title">{{ title }}</span>
-      <div :class="['right-operate', { 'right-operate-hasBtn': hasBtns }]">
+      <span :class="['event-tag__main__text-time', state == 2 ? 'text--deleted' : '']" v-if="viewType === 'list'">{{ timeRange }}</span>
+      <span :class="['event-tag__main__text-title', state == 2 ? 'text--deleted' : '']">{{ title }}</span>
+      <div :class="['right-operate', { 'right-operate-hasBtn': hasBtns }]" v-if="state != 2">
         <!-- <img :src="avatar" class="avatar-icon" alt="" /> -->
         <span class="calendar-quick-btn-wrap" v-if="hasBtns">
           <span v-for="btn in btns" :key="btn.type" @click.stop="() => clickListBtn(btn)" class="calendar-quick-btn">
@@ -261,6 +261,10 @@ export default {
       overflow: hidden;
       white-space: nowrap;
       text-overflow: ellipsis;
+      &.text--deleted {
+        text-decoration: line-through;
+        color: #7f7f7f;
+      }
     }
     &__text-time {
       flex: 0 0 150px;

package/packages/full-calendar/src/components/TagDetail.vue

@@ -2,7 +2,7 @@
   <div class="tag-detail-wrpper">
     <div class="header">
       <p>日程详情</p>
-      <div class="btn-wrap">
+      <div class="btn-wrap" v-if="item.state != 2">
         <span class="btn-item" v-for="btn in btns" :key="btn.type" @click.stop="() => clickListBtn(btn)">
           <a-icon v-if="btn.type === 'close'" :type="btn.type" :style="{ fontSize: '16px' }" />
           <a-tooltip v-else :title="btn.name" overlayClassName="tippy-tooltip">