cloud-web-corejs 1.0.54-dev.8 → 1.0.54-dev.800

package/src/components/xform/form-designer/form-widget/field-widget/mixins/date-limit-mixin.js

@@ -0,0 +1,222 @@
+/* 日期组件的最小日期、默认值支持配置为「当前时间」，此处统一解析 */
+export const DATE_VALUE_TYPE_NOW = "now";
+
+export default {
+  methods: {
+    getDateLimitOptions() {
+      return this.field.options || {};
+    },
+    isNowDateValueType(valueType) {
+      return valueType === DATE_VALUE_TYPE_NOW;
+    },
+    /* 按组件的valueFormat格式化，valueFormat为空时picker的值为Date对象 */
+    formatDateValue(date, valueFormat) {
+      if (!valueFormat) {
+        return date;
+      }
+      if (valueFormat === "timestamp") {
+        return date.getTime();
+      }
+      const pad = (val) => (val < 10 ? "0" + val : String(val));
+      const tokenMap = {
+        yyyy: String(date.getFullYear()),
+        yy: String(date.getFullYear()).slice(-2),
+        MM: pad(date.getMonth() + 1),
+        dd: pad(date.getDate()),
+        HH: pad(date.getHours()),
+        mm: pad(date.getMinutes()),
+        ss: pad(date.getSeconds()),
+      };
+      return valueFormat.replace(
+        /yyyy|yy|MM|dd|HH|mm|ss/g,
+        (token) => tokenMap[token]
+      );
+    },
+    /* 当前时间，dates（多选日期）类型的值为数组 */
+    getNowDateValue() {
+      const options = this.getDateLimitOptions();
+      const nowValue = this.formatDateValue(new Date(), options.valueFormat);
+      return options.type === "dates" ? [nowValue] : nowValue;
+    },
+    /* 最小日期：固定日期或当前时间 */
+    getDateLimitMinValue() {
+      const options = this.getDateLimitOptions();
+      if (this.isNowDateValueType(options.minDateType)) {
+        return new Date();
+      }
+      return options.minDate;
+    },
+    initDateLimitPickerOptions() {
+      const pickerOptions = { ...(this.pickerOptions || {}) };
+      if (["year", "month", "date", "datetime"].includes(this.field.options.type)) {
+        if (!pickerOptions.shortcuts) {
+          pickerOptions.shortcuts = [
+            {
+              text: this.$t1("此刻"),
+              onClick(picker) {
+                picker.$emit("pick", new Date());
+              },
+            },
+          ];
+        }
+      }
+      pickerOptions.disabledDate = (time) => this.isDateLimitDisabled(time);
+      this.pickerOptions = pickerOptions;
+    },
+    initDateLimitWatch() {
+      if (this.designState) {
+        return;
+      }
+      const { limitStartField, limitEndField } = this.getDateLimitOptions();
+      if (limitStartField) {
+        this.$watch(
+          () => this.getDateLimitLinkedValue(limitStartField),
+          () => {
+            this.initDateLimitPickerOptions();
+          }
+        );
+      }
+      if (limitEndField) {
+        this.$watch(
+          () => this.getDateLimitLinkedValue(limitEndField),
+          () => {
+            this.initDateLimitPickerOptions();
+          }
+        );
+      }
+    },
+    getDateLimitDataSource() {
+      return this.tableParam && this.tableParam.row
+        ? this.tableParam.row
+        : this.formModel;
+    },
+    getDateLimitLinkedValue(fieldName) {
+      if (!fieldName) {
+        return null;
+      }
+      const dataSource = this.getDateLimitDataSource();
+      return dataSource ? dataSource[fieldName] : null;
+    },
+    parseDateLimitValue(val) {
+      if (val === null || val === undefined || val === "") {
+        return null;
+      }
+      if (val instanceof Date) {
+        return isNaN(val.getTime()) ? null : val.getTime();
+      }
+      if (typeof val === "number") {
+        return isNaN(val) ? null : val;
+      }
+      const date = new Date(String(val).replace(/-/g, "/"));
+      return isNaN(date.getTime()) ? null : date.getTime();
+    },
+    normalizeDateLimitDayTime(time, isEnd) {
+      const date = new Date(time);
+      if (this.field.options.type === "datetime") {
+        return date.getTime();
+      }
+      date.setHours(isEnd ? 23 : 0, isEnd ? 59 : 0, isEnd ? 59 : 0, isEnd ? 999 : 0);
+      return date.getTime();
+    },
+    isDateLimitDisabled(time) {
+      const options = this.getDateLimitOptions();
+      const currentTime = time.getTime();
+
+      const minDate = this.parseDateLimitValue(this.getDateLimitMinValue());
+      if (minDate !== null && currentTime < this.normalizeDateLimitDayTime(minDate, false)) {
+        return true;
+      }
+
+      const maxDate = this.parseDateLimitValue(options.maxDate);
+      if (maxDate !== null && currentTime > this.normalizeDateLimitDayTime(maxDate, true)) {
+        return true;
+      }
+
+      if (options.limitStartField) {
+        const startTime = this.parseDateLimitValue(
+          this.getDateLimitLinkedValue(options.limitStartField)
+        );
+        if (startTime !== null && currentTime < this.normalizeDateLimitDayTime(startTime, false)) {
+          return true;
+        }
+      }
+
+      if (options.limitEndField) {
+        const endTime = this.parseDateLimitValue(
+          this.getDateLimitLinkedValue(options.limitEndField)
+        );
+        if (endTime !== null && currentTime > this.normalizeDateLimitDayTime(endTime, true)) {
+          return true;
+        }
+      }
+
+      return false;
+    },
+    isDateLimitViolated(value) {
+      if (value === null || value === undefined || value === "") {
+        return false;
+      }
+      const currentTime = this.parseDateLimitValue(value);
+      if (currentTime === null) {
+        return false;
+      }
+
+      const options = this.getDateLimitOptions();
+      const minDate = this.parseDateLimitValue(this.getDateLimitMinValue());
+      if (minDate !== null && currentTime < this.normalizeDateLimitDayTime(minDate, false)) {
+        return true;
+      }
+
+      const maxDate = this.parseDateLimitValue(options.maxDate);
+      if (maxDate !== null && currentTime > this.normalizeDateLimitDayTime(maxDate, true)) {
+        return true;
+      }
+
+      if (options.limitStartField) {
+        const startTime = this.parseDateLimitValue(
+          this.getDateLimitLinkedValue(options.limitStartField)
+        );
+        if (startTime !== null && currentTime < this.normalizeDateLimitDayTime(startTime, false)) {
+          return true;
+        }
+      }
+
+      if (options.limitEndField) {
+        const endTime = this.parseDateLimitValue(
+          this.getDateLimitLinkedValue(options.limitEndField)
+        );
+        if (endTime !== null && currentTime > this.normalizeDateLimitDayTime(endTime, true)) {
+          return true;
+        }
+      }
+
+      return false;
+    },
+    getDateLimitViolationMessage() {
+      const options = this.getDateLimitOptions();
+      if (options.limitEndField && !options.limitStartField) {
+        return "开始时间不能大于结束时间";
+      }
+      if (options.limitStartField && !options.limitEndField) {
+        return "结束时间不能小于开始时间";
+      }
+      return "日期超出允许范围";
+    },
+    /* 默认值配置为「当前时间」时，临时替换 defaultValue 后再走通用的取值逻辑 */
+    initDateFieldModel() {
+      const options = this.getDateLimitOptions();
+      if (!this.isNowDateValueType(options.defaultValueType)) {
+        this.initFieldModel();
+        return;
+      }
+
+      const rawDefaultValue = options.defaultValue;
+      options.defaultValue = this.getNowDateValue();
+      try {
+        this.initFieldModel();
+      } finally {
+        options.defaultValue = rawDefaultValue;
+      }
+    },
+  },
+};

package/src/components/xform/form-designer/form-widget/field-widget/mixins/echart-bar-mixin.js

@@ -3,7 +3,7 @@ import i18n from '../../../../../../components/xform/utils/i18n';
 import fieldMixin from '../../../../../../components/xform/form-designer/form-widget/field-widget/fieldMixin';
 
 import {deepClone} from '../../../../../../components/xform/utils/util';
-
+import {extendDeeply} from "@base/utils/index.js";
 import {use} from 'echarts/core';
 import {CanvasRenderer} from 'echarts/renderers';
 import {BarChart} from 'echarts/charts';
@@ -53,7 +53,6 @@ modules = {
       serieClone: {},
       showChart: true,
       colors: [
-
         {
           type: 'linear',
           x: 0.5,
@@ -206,6 +205,9 @@ modules = {
           delete chartOptions.yAxis.data;
         }
       }
+    },
+    chartOption() {
+      return this.field.options.echarBarOption
     }
   },
   beforeCreate() {
@@ -220,6 +222,7 @@ modules = {
     this.initEventHandler();
 
     this.handleOnCreated();
+    this.initOption();
     this.serieClone = deepClone(this.field.options.echarBarOption.series[0]);
   },
 
@@ -232,6 +235,37 @@ modules = {
   },
 
   methods: {
+    reflush(){
+      this.showChart = false;
+      this.$nextTick(()=>{
+        this.showChart = true
+      })
+    },
+    getColors(){
+      let chartColors = this.field.options.echarBarOption.colors || [];
+      let colors = [...chartColors, ...this.colors];
+      return colors
+    },
+    adjustColor() {
+      let colors = this.getColors();
+      let colorsSize = colors.length;
+      this.field.options.echarBarOption.series.forEach((serie, index) => {
+        if (colorsSize > index) {
+          if (serie.itemStyle) {
+            serie.itemStyle.color = colors[index]
+          } else {
+            serie.itemStyle = {
+              color: colors[index]
+            }
+          }
+        }
+      })
+    },
+    initOption() {
+      let echartConfig = this.handleCustomEvent(this.field.options.echartConfig) || {};
+      this.field.options.echarBarOption = extendDeeply(this.field.options.echarBarOption, echartConfig);
+      this.adjustColor();
+    },
     /*async loadData() {
       if (this.designState) {
         this.showChart = true;
@@ -342,21 +376,15 @@ modules = {
     },*/
     loadDataDefaultHandle() {
       let reportTemplate = this.getFormRef().reportTemplate;
-      let formCode = reportTemplate.formCode;
       let formScriptEnabled = this.field.options.formScriptEnabled || false;
       let scriptCode = this.field.options.formScriptCode
       if (!scriptCode) return;
       let accessParam = this.handleCustomEvent(this.field.options.formScriptParam)
       return this.formHttp({
         scriptCode: scriptCode,
-        data: {
-          formCode: formCode,
-          formVersion: reportTemplate.formVersion,
-          taBm: this.fieldKeyName,
-          data: {
-            ...accessParam
-          }
-        },
+        data: this.buildFormScriptData(reportTemplate, {
+          ...accessParam
+        }),
         callback: res => {
           let rows = res.objx || [];
           this.setValue(rows)
@@ -364,7 +392,7 @@ modules = {
       });
     },
     setValue(rows) {
-      this.showChart  = false;
+      this.showChart = false;
       let serieClone = this.serieClone;
       let resDatas = rows || [];
       let axisDatas = [];
@@ -383,14 +411,18 @@ modules = {
           nameDatas.push(resData.name);
         }
       });
-      let colors = this.colors;
+      let colors = this.getColors();
       let colorsSize = colors.length;
       nameDatas.forEach((nameItem, index) => {
         let serie = deepClone(serieClone);
         serie.name = nameItem;
-        if (serie.itemStyle) {
-          if (colorsSize > index) {
+        if (colorsSize > index) {
+          if (serie.itemStyle) {
             serie.itemStyle.color = colors[index]
+          } else {
+            serie.itemStyle = {
+              color: colors[index]
+            }
           }
         }
         let serieDatas = [];
@@ -409,9 +441,12 @@ modules = {
       let chartOptions = this.field.options.echarBarOption;
       chartOptions[this.alignField].data = axisDatas;
       chartOptions.series = newSeries;
-      this.$nextTick(()=>{
-        this.showChart  = true;
+      this.$nextTick(() => {
+        this.showChart = true;
       })
+    },
+    getChart() {
+      return this.$refs.chart;
     }
   }
 };

package/src/components/xform/form-designer/form-widget/field-widget/mixins/echart-category-mixin.js

@@ -9,6 +9,7 @@ import {CanvasRenderer} from 'echarts/renderers';
 import {LineChart} from 'echarts/charts';
 import {TitleComponent, TooltipComponent, LegendComponent} from 'echarts/components';
 import {THEME_KEY} from 'vue-echarts';
+import {extendDeeply} from "@base/utils/index.js";
 
 use([CanvasRenderer, LineChart, TitleComponent, TooltipComponent, LegendComponent]);
 let modules = {};
@@ -52,87 +53,8 @@ modules = {
       requestAccesses: [],
       requestAccess: null,
       serieClone: {},
-      showChart:true,
-      colors: [
-
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#08C084' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#97EACE' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#29ABE3' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#AADEF4' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#0044FE' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#97B3FF' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#75018A' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#C492CD' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#BF0104' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#E59697' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#FF8B01' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#FFCF95' // 100% 处的颜色
-          }],
-        },
-        {
-          type: 'linear',
-          x: 0.5,
-          y: 0.9,
-          r: 0.2,
-          colorStops: [{
-            offset: 1, color: '#FAFE09' // 0% 处的颜色
-          }, {
-            offset: 0, color: '#FCFFAF' // 100% 处的颜色
-          }],
-        }
-      ]
+      showChart: true,
+      colors: []
     };
   },
   computed: {
@@ -157,6 +79,9 @@ modules = {
         return height;
       }
       return '';
+    },
+    chartOption() {
+      return this.field.options.echarCategoryOption
     }
   },
   beforeCreate() {
@@ -171,6 +96,7 @@ modules = {
     this.initEventHandler();
 
     this.handleOnCreated();
+    this.initOption();
     this.serieClone = deepClone(this.field.options.echarCategoryOption.series[0]);
     // this.loadData();
   },
@@ -184,6 +110,38 @@ modules = {
   },
 
   methods: {
+    getColors() {
+      let chartColors = this.field.options.echarCategoryOption.colors || [];
+      let colors = [...chartColors, ...this.colors];
+      return colors
+    },
+    adjustColor() {
+      let colors = this.getColors();
+      let colorsSize = colors.length;
+      this.field.options.echarCategoryOption.series.forEach((serie, index) => {
+        if (colorsSize > index) {
+          if (serie.lineStyle) {
+            serie.lineStyle.color = colors[index]
+          } else {
+            serie.lineStyle = {
+              color: colors[index]
+            }
+          }
+          if (serie.itemStyle) {
+            serie.itemStyle.color = colors[index]
+          } else {
+            serie.itemStyle = {
+              color: colors[index]
+            }
+          }
+        }
+      })
+    },
+    initOption() {
+      let echartConfig = this.handleCustomEvent(this.field.options.echartConfig) || {};
+      this.field.options.echarCategoryOption = extendDeeply(this.field.options.echarCategoryOption, echartConfig);
+      this.adjustColor();
+    },
     /*async loadData() {
       if (this.designState) {
         return;
@@ -290,21 +248,15 @@ modules = {
     },*/
     loadDataDefaultHandle() {
       let reportTemplate = this.getFormRef().reportTemplate;
-      let formCode = reportTemplate.formCode;
       let formScriptEnabled = this.field.options.formScriptEnabled || false;
       let scriptCode = this.field.options.formScriptCode
       if (!scriptCode) return;
       let accessParam = this.handleCustomEvent(this.field.options.formScriptParam)
       return this.formHttp({
         scriptCode: scriptCode,
-        data: {
-          formCode: formCode,
-          formVersion: reportTemplate.formVersion,
-          taBm: this.fieldKeyName,
-          data: {
-            ...accessParam
-          }
-        },
+        data: this.buildFormScriptData(reportTemplate, {
+          ...accessParam
+        }),
         callback: res => {
           let rows = res.objx || [];
           this.setValue(rows)
@@ -312,7 +264,7 @@ modules = {
       });
     },
     setValue(rows) {
-      this.showChart  = false;
+      this.showChart = false;
       let serieClone = this.serieClone;
       let resDatas = rows || [];
       let axisDatas = [];
@@ -331,16 +283,28 @@ modules = {
           nameDatas.push(resData.name);
         }
       });
-      let colors = this.colors;
+      let colors = this.getColors();
       let colorsSize = colors.length;
       nameDatas.forEach((nameItem, index) => {
         let serie = deepClone(serieClone);
         serie.name = nameItem;
-        /*if (serie.lineStyle) {
-          if (colorsSize > index) {
+        if (colorsSize > index) {
+          if (serie.lineStyle) {
             serie.lineStyle.color = colors[index]
+          } else {
+            serie.lineStyle = {
+              color: colors[index]
+            }
           }
-        }*/
+          if (serie.itemStyle) {
+            serie.itemStyle.color = colors[index]
+          } else {
+            serie.itemStyle = {
+              color: colors[index]
+            }
+          }
+        }
+
         delete serie.lineStyle
 
         let serieDatas = [];
@@ -360,9 +324,12 @@ modules = {
       chartOptions.xAxis.data = axisDatas;
       chartOptions.series = newSeries;
 
-      this.$nextTick(()=>{
-        this.showChart  = true;
+      this.$nextTick(() => {
+        this.showChart = true;
       })
+    },
+    getChart() {
+      return this.$refs.chart;
     }
   }
 };

package/src/components/xform/form-designer/form-widget/field-widget/mixins/echart-pie-mixin.js

@@ -9,6 +9,7 @@ import {CanvasRenderer} from 'echarts/renderers';
 import {PieChart} from 'echarts/charts';
 import {TitleComponent, TooltipComponent, LegendComponent} from 'echarts/components';
 import {THEME_KEY} from 'vue-echarts';
+import {extendDeeply} from "@base/utils/index.js";
 
 use([CanvasRenderer, PieChart, TitleComponent, TooltipComponent, LegendComponent]);
 
@@ -53,6 +54,7 @@ modules = {
       requestAccess: null,
       serieClone: {},
       showChart: true,
+      colors:[]
     };
   },
   computed: {
@@ -77,6 +79,9 @@ modules = {
         return height;
       }
       return '';
+    },
+    chartOption() {
+      return this.field.options.echarPieOption
     }
   },
   beforeCreate() {
@@ -91,6 +96,7 @@ modules = {
     this.initEventHandler();
 
     this.handleOnCreated();
+    this.initOption();
     this.serieClone = deepClone(this.field.options.echarPieOption.series[0]);
     // this.loadData();
   },
@@ -104,6 +110,10 @@ modules = {
   },
 
   methods: {
+    initOption() {
+      let echartConfig = this.handleCustomEvent(this.field.options.echartConfig) || {};
+      this.field.options.echarPieOption = extendDeeply(this.field.options.echarPieOption, echartConfig);
+    },
     /*async loadData() {
       if (this.designState) {
         return;
@@ -161,21 +171,15 @@ modules = {
     },*/
     loadDataDefaultHandle() {
       let reportTemplate = this.getFormRef().reportTemplate;
-      let formCode = reportTemplate.formCode;
       let formScriptEnabled = this.field.options.formScriptEnabled || false;
       let scriptCode = this.field.options.formScriptCode
       if (!scriptCode) return;
       let accessParam = this.handleCustomEvent(this.field.options.formScriptParam)
       return this.formHttp({
         scriptCode: scriptCode,
-        data: {
-          formCode: formCode,
-          formVersion: reportTemplate.formVersion,
-          taBm: this.fieldKeyName,
-          data: {
-            ...accessParam
-          }
-        },
+        data: this.buildFormScriptData(reportTemplate, {
+          ...accessParam
+        }),
         callback: res => {
           let rows = res.objx || [];
           this.setValue(rows)
@@ -188,6 +192,9 @@ modules = {
       this.$nextTick(() => {
         this.showChart = true;
       })
+    },
+    getChart() {
+      return this.$refs.chart;
     }
   }
 };