cnhis-design-vue 2.1.66 → 2.1.69

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

@@ -127,12 +127,11 @@ export default {
       this.canvas.on('mouse:up', event => {
         if (event.button === 3) {
           const { x, y } = event.pointer;
-          const { originX, originY, endX, endY } = this.$propItems();
-          if (!(x < originX || x > endX || y < originY || y > endY)) {
+          if (this.isGridLimit(x, y)) {
             this.activeEvent = event;
-            document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            !this.isAddEventListenerContextmenu && document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            this.isAddEventListenerContextmenu = true;
           }
-          // this.willUpdateLine = line;
         }
         // 左键松开鼠标-批量删除
         this.isSelectArea = false;
@@ -464,7 +463,7 @@ export default {
           top: top - 5
         });
       };
-      const isDraw = (isMaxOrMin, maxOrMin) => isMaxOrMin && (!maxOrMin?.flickerable || attr !== 'critical');
+      const isDraw = (isMaxOrMin, maxOrMin) => isMaxOrMin && !maxOrMin?.flickerable;
 
       if (isDraw(isMax, max)) {
         const line = drawLine(max);
@@ -490,7 +489,7 @@ export default {
      */
     drawPolyline(polyline, polylineIndex, polylineType, polylineTypeId) {
       const { originY, endY } = this.propItems;
-      const { pointAttr, lineAttr, list = [], critical = {} } = polyline;
+      const { pointAttr, lineAttr, list = [], critical = {}, diffValue = {} } = polyline;
       this._iconClassName = polyline.type === 'img' && pointAttr.iconClassName ? pointAttr.iconClassName : '';
 
       const pointList = [];
@@ -566,17 +565,24 @@ export default {
         this.canvas.add(...lineList, ...res);
 
         // 缓存需要闪烁的节点
-        const { max, min } = critical;
-        if (max?.flickerable || min?.flickerable) {
-          const maxVal = max?.value;
-          const minVal = min?.value;
-          if (maxVal && max?.flickerable) {
-            this.flickerablePoints.push(...res.filter(point => +point.__value >= +maxVal));
-          }
-          if (minVal && min?.flickerable) {
-            this.flickerablePoints.push(...res.filter(point => +point.__value <= +minVal));
+        setFlickerablePoints.call(this, critical);
+        setFlickerablePoints.call(this, diffValue);
+        function setFlickerablePoints(diffObj) {
+          const { max, min } = diffObj;
+          if (max?.flickerable || min?.flickerable) {
+            const maxVal = max?.value;
+            const minVal = min?.value;
+            if (maxVal && max?.flickerable) {
+              this.flickerablePoints.push(...res.filter(point => +point.__value >= +maxVal).filter(point => !this.flickerablePoints.some(_point => isSamePoint(point, _point))));
+            }
+            if (minVal && min?.flickerable) {
+              this.flickerablePoints.push(...res.filter(point => +point.__value <= +minVal).filter(point => !this.flickerablePoints.some(_point => isSamePoint(point, _point))));
+            }
           }
         }
+        function isSamePoint(point, _point) {
+          return point.polylineTypeId == _point.polylineTypeId && point.polylineIndex === _point.polylineIndex && point.pointIndex === _point.pointIndex;
+        }
       });
 
       const params = { polyline, polylineIndex, polylineType, polylineTypeId };
@@ -1015,14 +1021,15 @@ export default {
       }
     },
     // 打开右键菜单
-    openRightModal(event) {
+    openRightModal() {
+      const { clientX, pageX, clientY, pageY } = this.activeEvent.e;
       this.rightPos = {
-        clientX: event.e.clientX || event.e.pageX,
-        clientY: event.e.clientY || event.e.pageY
+        clientX: clientX ?? pageX,
+        clientY: clientY ?? pageY
       };
       this.isRightVisible = false;
-      const target = event.target;
-      const id = target ? target.id : '';
+      const target = this.activeEvent.target;
+      const id = target?.id || '';
       this.$nextTick(() => {
         if (id && id.includes('_polylinePoint_')) {
           this._currentPoint = target;

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

@@ -117,23 +117,24 @@ export default {
       this.canvas.on('mouse:up', event => {
         if (event.button === 3) {
           const { x, y } = event.pointer;
-          const { originX, originY, endX, endY } = this.$propItems();
-          if (!(x < originX || x > endX || y < originY || y > endY)) {
+          if (this.isGridLimit(x, y)) {
             this.activeEvent = event;
-            document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            !this.isAddEventListenerContextmenu && document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            this.isAddEventListenerContextmenu = true;
           }
         }
       });
     },
     // 打开右键菜单
-    openRightModal(event) {
+    openRightModal() {
+      const { clientX, pageX, clientY, pageY } = this.activeEvent.e;
       this.rightPos = {
-        clientX: event.e.clientX || event.e.pageX,
-        clientY: event.e.clientY || event.e.pageY
+        clientX: clientX ?? pageX,
+        clientY: clientY ?? pageY
       };
       this.isRightVisible = false;
-      const target = event.target;
-      const id = target ? target.id : '';
+      const target = this.activeEvent.target;
+      const id = target?.id || '';
       this.$nextTick(() => {
         if (id && id.includes('_other')) {
           this._currentPoint = target || '';

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

@@ -7,7 +7,8 @@ export default {
         y: 0
       },
       dropTimer: null,
-      isRightVisible: false
+      isRightVisible: false,
+      isAddEventListenerContextmenu: false
     };
   },
   watch: {
@@ -79,13 +80,12 @@ export default {
       event.preventDefault();
       const x = event.offsetX;
       const y = event.offsetY;
-      const { originX, originY, endX, endY } = this.$propItems();
-      if (!(x < originX || x > endX || y < originY || y > endY)) {
+      if (this.isGridLimit(x, y)) {
         this._active = {
           left: x,
           top: y
         };
-        this.openRightModal(this.activeEvent);
+        this.openRightModal();
       }
       return false;
     },

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

@@ -31,18 +31,6 @@ export default {
     }
   },
   methods: {
-    // 根据x轴坐标获取对应的时间点
-    // getXValue(left) {
-    //   const { xScaleList, xScaleCell, originX } = this.propItems;
-    //   const minScale = Math.min(...xScaleList);
-    //   const time = minScale + (left - originX) / xScaleCell;
-    //   let d = new Date(time);
-    //   const month = `00${d.getMonth() + 1}`.slice(-2);
-    //   const day = `00${d.getDate()}`.slice(-2);
-    //   const hours = `00${d.getHours()}`.slice(-2);
-    //   const minute = `00${d.getMinutes()}`.slice(-2);
-    //   return `${d.getFullYear()}-${month}-${day} ${hours}:${minute}`;
-    // },
     getXValue(left) {
       const { xScaleCellList, originX, endX, xScaleList } = this.propItems;
       let time;
@@ -80,16 +68,14 @@ export default {
       !~index && (index = xScaleCellList.length);
       const obj = xScaleCellList[index - 1];
       return obj.x + (time - obj.time) / obj.xScaleTime;
+    },
+    isGridLimit(x, y) {
+      const { originX, originY, endX, endY } = this.propItems;
+      return x >= originX && x <= endX && y >= originY && y <= endY;
+    },
+    isTopTreeAndGridLimit(x, y) {
+      const { endX, endYTop, originYTop } = this.propItems;
+      return x >= 0 && x <= endX && y >= originYTop && y <= endYTop;
     }
-    // // 根据时间戳计算x轴坐标
-    // cumputedX(value) {
-    //   if (!value) {
-    //     return '';
-    //   }
-    //   const { xScaleList, xScaleCell, originX } = this.propItems;
-    //   const time = new Date(value).getTime();
-    //   const minScale = Math.min(...xScaleList);
-    //   return originX + (time - minScale) * xScaleCell;
-    // },
   }
 };

package/packages/scale-view/formitem/r-choice.vue

@@ -17,6 +17,7 @@
         :value="o[choiceUseKey]"
         :disabled="isLock"
         :style="{ color: choiceColor(o) }"
+        :class="{'choice-radio-presuffix':showPreSuffix(o)}"
       >
         <template v-if="showImgWrap(o)">
           <span class="scale-choice-img-wrap" @click.stop.prevent>
@@ -28,11 +29,11 @@
         </template>
         <template>
           <template v-if="isRadioItem && showPreSuffix(o)">
-            <span
+            <template
               v-if="o.prefix"
               class="prefix-span"
               :style="{ color: choiceColor(o) }"
-            >{{ o.prefix }}</span>
+            >{{ o.prefix }}</template>
             <a-input
               v-model="optionsPreSuffixObj[o.key]"
               :disabled="isLock || inputLock"
@@ -40,11 +41,11 @@
               :style="{ color: choiceColor(o) }"
               placeholder="请输入"
             />
-            <span
+            <template
               v-if="o.suffix"
               class="suffix-span"
               :style="{ color: choiceColor(o) }"
-            >{{ o.suffix }}</span>
+            >{{ o.suffix }}</template>
           </template>
           <span v-else :style="{ color: choiceColor(o) }">{{ o.label }}</span>
           <a-input
@@ -76,6 +77,7 @@
           :value="o[choiceUseKey]"
           :disabled="isLock"
           :style="{ color: choiceColor(o) }"
+          :class="{'choice-checkbox-presuffix':showPreSuffix(o)}"
         >
           <template v-if="showImgWrap(o)">
             <span class="scale-choice-img-wrap" @click.stop.prevent>
@@ -87,11 +89,11 @@
           </template>
           <template>
             <template v-if="isCheckboxItem && showPreSuffix(o)">
-              <span
+              <template
                 v-if="o.prefix"
                 class="prefix-span"
                 :style="{ color: choiceColor(o) }"
-              >{{ o.prefix }}</span>
+              >{{ o.prefix }}</template>
               <a-input
                 v-model="optionsPreSuffixObj[o.key]"
                 :disabled="isLock || inputLock"
@@ -99,11 +101,11 @@
                 :style="{ color: choiceColor(o) }"
                 placeholder="请输入"
               />
-              <span
+              <template
                 v-if="o.suffix"
                 class="suffix-span"
                 :style="{ color: choiceColor(o) }"
-              >{{ o.suffix }}</span>
+              >{{ o.suffix }}</template>
             </template>
             <span
               v-else
@@ -630,13 +632,8 @@ export default {
       border-color: transparent !important;
       border-bottom: 1px solid #d9d9d9 !important;
     }
-    .prefix-span {
-      padding-right: 8px;
-    }
-    .suffix-span {
-      padding-left: 8px;
-    }
   }
+  
   /deep/ .ant-select {
     min-width: 160px;
   }
@@ -726,6 +723,24 @@ export default {
     /deep/ .ant-checkbox-inner {
       vertical-align: top;
     }
+
+    /deep/ .choice-radio-presuffix,
+    /deep/ .choice-checkbox-presuffix {
+      width: 100%;
+      box-sizing: border-box;
+      > span:last-child {
+        display: inline-table;
+        width: calc(100% - 20px);
+        max-width: calc(100% - 20px);
+        flex-wrap: wrap;
+      }
+      input {
+        flex: unset;
+        width: unset;
+        max-width: 300px;
+        min-width: 80px;
+      }
+    }
   }
 }
 </style>

package/packages/table-filter/src/base-search-com/BaseSearch.vue

@@ -47,13 +47,16 @@
           <slot name="classification"></slot>
           <li v-if="showQuickSearch" ref="quickSearchLi">
             <a-button class="search-default" type="default" @click="foldQuickSearch">
-              <svg-icon icon-class="anniushaixuan" style="color: #2463F4; margin-right: 6px"></svg-icon>
+              <svg-icon icon-class="anniushaixuan" style="color: inherit; margin-right: 6px"></svg-icon>
               筛选 {{ qqConObjCount ? `(${qqConObjCount})` : '' }}
             </a-button>
           </li>
           <!-- start--筛选外显--start -->
           <template v-for="item in outSearchFieldList">
-            <outQuickSearch :key="item.id + item.random_key" :item="item" :ref="item.columnName + item.random_key" :filterApiConfig="filterApiConfigOutSearch" @outFilterChange="outFilterChange"></outQuickSearch>
+            <li class="outQuickSearch-li" v-if="item.isRender" :key="item._frontId">
+              <RenderWidget style="margin: 0 8px 8px 0" :cfg="item" v-model="item.value" @outFilterChange="outFilterChange" />
+            </li>
+            <outQuickSearch v-else :key="item.id + item.random_key" :item="item" :ref="item.columnName + item.random_key" :filterApiConfig="filterApiConfigOutSearch" @outFilterChange="outFilterChange"></outQuickSearch>
           </template>
           <!-- end--筛选外显--end -->
 
@@ -65,7 +68,7 @@
           </template>
           <!-- end--筛选外显 跨表--end -->
 
-          <li v-if="isShowSetting('hideSearch') && !showRelatedTreeBtn" ref="inputSearchLi" class="baseSearch-input-search">
+          <li v-if="isShowInputSearch" ref="inputSearchLi" class="baseSearch-input-search">
             <template v-if="outSearchFieldList && outSearchFieldList.length">
               <slot name="searchInput" :width="(searchInputWidth || inputSearchW)" :searchPlaceHolder="searchPlaceHolder" :showPlaceholderPrefix="showPlaceholderPrefix" :type="'outSearch'">
                 <a-input
@@ -116,6 +119,13 @@
               查询
             </a-button>
           </li>
+          <!-- 无外显字段查询，且隐藏模糊搜索 -->
+          <li v-if="showApiSearch">
+            <a-button type="primary" @click="apiSearch" style="margin: 0 8px 8px 0">
+              <a-icon type="search" style="margin-right: 6px" />
+              查询
+            </a-button>
+          </li>
           <li v-if="showResetFilterBtn">
             <a-button @click="handleReset" style="margin: 0 8px 8px 0">
               <svg-icon icon-class="xitongtubiaoliebiaocaozuoanniushanchu" style="margin-right: 6px"></svg-icon>
@@ -412,6 +422,8 @@ import preventReClick from '@/directive/preventReClick';
 import getBtnIcon from '../components/button-icon/getBtnIcon.js';
 import ButtonGroup from '../components/button-group/ButtonGroup.vue';
 
+import RenderWidget from '../components/render-widget/index.vue';
+
 const EVALUATEList = [
   {
     label: '一星',
@@ -465,6 +477,9 @@ export default create({
       type: Number,
       default: 0
     },
+    searchInputPlaceHolder: {
+      type: String,
+    },
     onSearch: Function,
     rowBtnList: {
       type: Array,
@@ -611,9 +626,13 @@ export default create({
       default: 1000
     },
     isCardNewBatch: {type: Boolean, deafult: false},
-    isBatchSelect: {type: [Number, Boolean, String], default: ''}
+    isBatchSelect: {type: [Number, Boolean, String], default: ''},
+    isAvailableApiType:  {type: Boolean, deafult: false},
+    apiSearch: Function,
+    tableDataType: String
   },
   components: {
+    RenderWidget,
     [Button.name]: Button,
     [Icon.name]: Icon,
     [Dropdown.name]: Dropdown,
@@ -794,6 +813,8 @@ export default create({
       };
     },
     searchPlaceHolder() {
+      if (this.searchInputPlaceHolder) return this.searchInputPlaceHolder;
+
       if (!this.useFieldList?.length || this.showRelatedTreeBtn) return '请输入关键字搜索';
       let str = '';
       let strList = this.useFieldList
@@ -807,6 +828,9 @@ export default create({
       return str || '请输入关键字搜索';
     },
     showRelatedSearch() {
+      // sql类型的列表, 且有筛选外显的时候不展示平铺列表的search
+      if (this.relatedSqlOutSearch) return false;
+      if (this.isAvailableApiType) return false;
       return this.showRelatedTreeBtn && this.isShowSetting('hideSearch');
     },
     showQuickSearch() {
@@ -820,6 +844,18 @@ export default create({
     },
     isCard() {
       return this.TypeOfDisplay === 'cardNew' && this.isBatchSelect == 1
+    },
+    showApiSearch(){
+      return !this.outSearchFieldList?.length && this.isAvailableApiType
+    },
+    // sql类型的列表, 且有筛选外显的时候不展示平铺列表的search
+    relatedSqlOutSearch() {
+      return this.tableDataType === 'SQL' && !!this.outSearchFieldList?.length
+    },
+    isShowInputSearch() {
+      if(!this.isShowSetting('hideSearch')) return false;
+      if(!this.showRelatedTreeBtn) return true;
+      return this.relatedSqlOutSearch;
     }
   },
   data() {
@@ -1765,7 +1801,13 @@ export default create({
       }
 
       // 如有配置默认值
-      if (this.outSearchFieldList.some(v => !!v.explicitDefaultVal)) {
+      const isSetDefVal = this.outSearchFieldList.some(v => {
+        if (this.isRender(v)) {
+          return this.isExistDefValByRenderWidget(v);
+        }
+        return !!v.explicitDefaultVal
+      });
+      if (isSetDefVal) {
         this.$emit('outSearchInit');
         if ('reset' != config?.type) {
           this.outFilterChange({ type: 'outSearchInit' });
@@ -2026,7 +2068,13 @@ export default create({
      * 获取外显检索的默认值设置
      */
     handleGetOutSearchInitValue() {
-      if (this.outSearchFieldList.some(v => !!v.explicitDefaultVal)) {
+      const isSetDefVal = this.outSearchFieldList.some(v => {
+        if (this.isRender(v)) {
+          return this.isExistDefValByRenderWidget(v);
+        }
+        return !!v.explicitDefaultVal
+      });
+      if (isSetDefVal) {
         let conObj = this.getConObjParams() || [];
         return conObj;
       }

package/packages/table-filter/src/classification/Classification-com.vue

@@ -420,7 +420,11 @@
       :tableId="tableId"
       :classifyModal="classifyModal"
       :filterApiConfig="filterApiConfig"
-    />
+    >
+      <template #searchCondition="{ attrs, listeners }">
+        <slot name="searchCondition" :attrs="attrs" :listeners="listeners"></slot>
+      </template>
+    </set-classification>
   </div>
 </template>
 

package/packages/table-filter/src/components/c-tree-select/tree-select.vue

@@ -15,7 +15,7 @@
     :allowClear="item.explicitRequired != 1"
     treeNodeFilterProp="title"
     ref="quickInputSelect"
-    :placeholder="`请选择${item.alias || item.title}`"
+    :placeholder="item.placeholder || `请选择${item.alias || item.title}`"
   >
     <a-icon slot="suffixIcon" type="smile" />
     <span class="init-key-loading" v-if="key === '_init_key_'" slot="title" slot-scope="{ key, value }" style="color: #08c">

package/packages/table-filter/src/components/multi-select/multi-select.vue

@@ -2,7 +2,7 @@
   <a-select
     :mode="mode"
     v-if="item.com == 'SelectMui'"
-    :placeholder="`请选择${item.alias || item.title}`"
+    :placeholder="item.placeholder || `请选择${item.alias || item.title}`"
     :style="{width: `${item.advanceColWidth||160}px`}"
     :dropdownMatchSelectWidth="false"
     :maxTagCount="handleMaxTagCount(item)"

package/packages/table-filter/src/components/out-quick-search/out-quick-search.vue

@@ -9,7 +9,7 @@
           margin: '0 8px 8px 0',
           'font-family': item.PASSWORDTYPE ? 'text-security-disc' : 'inherit'
         }"
-        :placeholder="`搜索${item.alias || item.title}`"
+        :placeholder="item.placeholder || `搜索${item.alias || item.title}`"
         v-model="item.value"
         allowClear
       >
@@ -55,7 +55,7 @@
       @change="outFilterChange"
       @ok="outFilterChange"
       v-model="item.value"
-      :placeholder="`请选择${item.alias || item.title}`"
+      :placeholder="item.placeholder || `请选择${item.alias || item.title}`"
       v-if="item.com == 'DayPicker'"
       style="margin: 0 8px 8px 0"
       :showTime="false"

package/packages/table-filter/src/components/render-widget/components/CheckboxGroup.vue

@@ -0,0 +1,52 @@
+<template>
+  <CheckboxGroup v-bind="$attrs" :value="valueCp" @change="onChange"></CheckboxGroup>
+</template>
+
+<script>
+import { Checkbox } from 'ant-design-vue';
+
+export default {
+  inheritAttrs: false,
+  components: {
+    CheckboxGroup: Checkbox.Group,
+  },
+  props: {
+    value: {
+      type: [Array, String, Number],
+    },
+    multiple: {
+      type: Boolean,
+      default: false,
+    }
+  },
+  model: {
+    prop: "value",
+    event: "update:value"
+  },
+  computed: {
+    valueCp: {
+      set(val) {
+        this.$emit("update:value", val);
+      },
+      get() {
+        return Array.isArray(this.value) ? this.value : this.value ? [this.value] : [];
+      }
+    }
+  },
+  methods: {
+    filterNewVal(val) {
+      return val.filter((v) => !this.valueCp.includes(v));
+    },
+    onChange(val) {
+      if (!this.multiple && Array.isArray(val)) {
+        this.valueCp = this.filterNewVal(val)[0];
+        return;
+      }
+      this.valueCp = val;
+    },
+  },
+}
+
+</script>
+<style lang='less'>
+</style>

package/packages/table-filter/src/components/render-widget/components/Select.vue

@@ -0,0 +1,51 @@
+<template>
+   <Select v-bind="$attrs" v-on="$listeners" v-model="valueCp" :maxTagCount="maxTagCount" :maxTagPlaceholder="maxTagPlaceholder"></Select>
+</template>
+
+<script>
+import { Select } from 'ant-design-vue';
+
+export default {
+  inheritAttrs: false,
+  components: {
+    Select,
+  },
+  props: {
+    value: {
+      type: [Array, String, Number],
+    },
+    componentCfg: {
+      type: Object
+    }
+  },
+  model: {
+    prop: "value",
+    event: "update:value"
+  },
+  computed: {
+    valueCp: {
+      set(val) {
+        this.$emit("update:value", val);
+      },
+      get() {
+        return this.value;
+      }
+    },
+    maxTagCount() {
+      if (!Array.isArray(this.value)) return undefined;
+      const len = this.value.length || 0;
+      return len > 1 ? 0 : 1;
+    },
+  },
+  methods: {
+    maxTagPlaceholder() {
+      if (!Array.isArray(this.value)) return undefined;
+      const { alias, title } = this.componentCfg;
+      const len = this.value.length || 0;
+      return this.value.length > 1 ? `已选${len}个${alias || title}` : "";
+    }
+  },
+}
+</script>
+<style lang='less'>
+</style>

package/packages/table-filter/src/components/render-widget/components/index.js

@@ -0,0 +1,7 @@
+import CheckboxGroup from './CheckboxGroup.vue';
+import Select from './Select.vue';
+
+export {
+  CheckboxGroup,
+  Select
+}

package/packages/table-filter/src/components/render-widget/enums.js

@@ -0,0 +1,29 @@
+export const WidgetTypeEnums = {
+  INPUT_NUMBER: "NUMBER",
+  INPUT: "TEXT",
+  SELECT: "SELECT",
+  DATE: "DATE",
+  DATE_TIME: "DATETIME",
+  CHECKBOX_GROUP: 'CHECKBOX_GROUP',
+}
+
+export const DatePresetValEnums = {
+  CUSTOM: "CUSTOM", // 自定义输入，特殊处理
+
+  NOW: "NOW",
+  TODAY: "TODAY",
+  TODAY_START: "TODAY_START",
+  TODAY_END: "TODAY_END",
+  TOMORROW: "TOMORROW",
+  TOMORROW_START: "TOMORROW_START",
+  TOMORROW_END: "TOMORROW_END",
+  YESTERDAY: "YESTERDAY",
+  YESTERDAY_START: "YESTERDAY_START",
+  YESTERDAY_END: "YESTERDAY_END",
+
+  WEEK_START: "THIS_WEEK_START",
+  WEEK_END: "THIS_WEEK_END",
+
+  MONTH_START: "THIS_MONTH_START",
+  MONTH_END: "THIS_MONTH_END",
+};