Merge branch 'master' of github.com:gcpaas/DataRoom

DataRoom/dataroom-core/src/main/java/com/gccloud/dataroom/core/module/chart/components/CustomComponentChart.java

@@ -6,6 +6,7 @@ import io.swagger.annotations.ApiModelProperty;
 import lombok.Data;
 
 import java.util.List;
+import java.util.Map;
 
 /**
  * 自定义组件
@@ -38,7 +39,7 @@ public class CustomComponentChart extends Chart {
     private Object option;
 
     @ApiModelProperty(notes = "右侧面板自定义配置")
-    private List<Setting> setting;
+    private List<Map<String, Object>> setting;
 
     @ApiModelProperty(notes = "组件的唯一名称")
     private String name;

data-room-ui/packages/BasicComponents/CurrentTime/index.vue

@@ -31,8 +31,8 @@
 import moment from 'moment'
 import paramsMixins from 'data-room-ui/js/mixins/paramsMixins'
 import { settingToTheme } from 'data-room-ui/js/utils/themeFormatting'
-import cloneDeep from "lodash/cloneDeep";
-import {mapMutations, mapState} from 'vuex'
+import cloneDeep from 'lodash/cloneDeep'
+import { mapMutations, mapState } from 'vuex'
 export default {
   name: 'CurrentTime',
   mixins: [paramsMixins],

data-room-ui/packages/BasicComponents/DateTimePicker/index.vue

@@ -52,7 +52,7 @@ export default {
         if (val && val.customize && val.customize.formatType === 'custom') {
           // 解决时间格式化类型为自定义时，时间格式化类型和时间格式化值数据类型不匹配的问题
           this.$nextTick(() => {
-            this.value = toString(this.value)
+            this.config.customize.value = toString(this.config.customize.value)
           })
         }
       },
@@ -65,6 +65,10 @@ export default {
       document.querySelector(`.date-picker-${this.config.code}`).style.pointerEvents = 'none'
     }
     this.changeStyle(this.config)
+    // 将config.customize.value设置值为当前时间 ：
+    if (this.config.customize.value === '') {
+      this.config.customize.value = new Date()
+    }
   },
   beforeDestroy () {
   },

data-room-ui/packages/BasicComponents/DateTimePicker/setting.vue

@@ -137,13 +137,22 @@
                 />
                 <!-- HH表示小时（24小时制），mm表示分钟，ss表示秒 -->
                 <el-tooltip
-                  content="时间格式示例：yyyy表示年份，MM表示月份，dd表示日期，HH表示小时（24小时制），mm表示分钟，ss表示秒，具体可参考Element-UI官网的日期选择器的时间格式化部分"
                   placement="top"
                 >
                   <span
                     class="el-icon-question"
                     style="color:#9e9e9e"
                   />
+                  <div slot="content">
+                    时间格式示例：<br>
+                    yyyy：表示年份，<br>
+                    MM：表示月份，<br>
+                    dd：表示日期，<br>
+                    HH：表示小时（24小时制），<br>
+                    mm：表示分钟，<br>
+                    ss：表示秒，<br>
+                    具体可参考Element-UI官网的日期选择器的时间格式化部分。
+                  </div>
                 </el-tooltip>
               </div>
             </el-form-item>
@@ -193,7 +202,6 @@ export default {
       second: 'ss',
       // 时间格式化类型选项
       formatTypeOptions: [
-        { label: 'Date 对象', value: 'default' },
         { label: '时间戳', value: 'timestamp' },
         { label: '自定义', value: 'custom' }
       ],
@@ -213,10 +221,7 @@ export default {
   mounted () {},
   methods: {
     selectFormatType (type) {
-      if (type === 'default') {
-        this.config.customize.value = ''
-        this.config.customize.valueFormat = ''
-      } else if (type === 'timestamp') {
+      if (type === 'timestamp') {
         this.config.customize.value = 0
         this.config.customize.valueFormat = 'timestamp'
       } else if (type === 'custom') {

data-room-ui/packages/BasicComponents/DateTimePicker/settingConfig.js

@@ -31,10 +31,10 @@ const customConfig = {
     fontSize: 20,
     // 显示类型 year/month/date/week/ datetime/datetimerange/daterange
     type: 'datetime',
-    // 时间格式化类型:Date 对象（default），时间戳（timestamp），自定义（custom）
-    formatType: 'default',
+    // 时间格式化类型:时间戳（timestamp），自定义（custom）
+    formatType: 'custom',
     // 绑定值的格式
-    valueFormat: '',
+    valueFormat: 'yyyy-MM-dd HH:mm:ss',
     // 下拉框
     dropDownBox: {
       // 下拉框背景颜色

data-room-ui/packages/BasicComponents/TimePicker/index.vue

@@ -14,6 +14,7 @@
 </template>
 
 <script>
+import moment from 'moment'
 import cloneDeep from 'lodash/cloneDeep'
 import commonMixins from 'data-room-ui/js/mixins/commonMixins'
 import linkageMixins from 'data-room-ui/js/mixins/linkageMixins'
@@ -51,7 +52,7 @@ export default {
       handler: function (val) {
         if (val && val.customize && val.customize.formatType === 'custom') {
           this.$nextTick(() => {
-            this.value = toString(this.value)
+            this.config.customize.value = toString(this.config.customize.value)
           })
         }
       },
@@ -64,6 +65,14 @@ export default {
       // document.querySelector(`.time-picker-${this.config.code}`).style.pointerEvents = 'none'
     }
     this.changeStyle(this.config)
+    // 将config.customize.value设置值为当前时间 ：HH:mm:ss
+    // if (this.config.customize.value === '') {
+    //   this.config.customize.valueFormat = 'HH:mm:ss'
+    //   this.$nextTick(() => {
+    //     this.config.customize.value = moment(new Date()).format('HH:mm:ss')
+    //     console.log(this.config.customize.value)
+    //   })
+    // }
   },
   beforeDestroy () { },
   methods: {

data-room-ui/packages/BasicComponents/TimePicker/setting.vue

@@ -111,13 +111,19 @@
                   clearable
                 />
                 <el-tooltip
-                  content="时间格式示例：HH表示小时（24小时制），mm表示分钟，ss表示秒"
                   placement="top"
                 >
                   <span
                     class="el-icon-question"
                     style="color:#9e9e9e"
                   />
+                  <div slot="content">
+                    时间格式示例：<br>
+                    HH：表示小时（24小时制），<br>
+                    mm：表示分钟，<br>
+                    ss：表示秒，
+                    具体可参考Element-UI官网的日期选择器的时间格式化部分。
+                  </div>
                 </el-tooltip>
               </div>
             </el-form-item>
@@ -162,12 +168,8 @@ export default {
   },
   data () {
     return {
-      hour: 'HH',
-      minute: 'mm',
-      second: 'ss',
       // 时间格式化类型选项
       formatTypeOptions: [
-        { label: 'Date 对象', value: 'default' },
         { label: '时间戳', value: 'timestamp' },
         { label: '自定义', value: 'custom' }
       ]
@@ -177,10 +179,7 @@ export default {
   mounted () {},
   methods: {
     selectFormatType (type) {
-      if (type === 'default') {
-        this.config.customize.value = ''
-        this.config.customize.valueFormat = ''
-      } else if (type === 'timestamp') {
+      if (type === 'timestamp') {
         this.config.customize.value = 0
         this.config.customize.valueFormat = 'timestamp'
       } else if (type === 'custom') {

data-room-ui/packages/BasicComponents/TimePicker/settingConfig.js

@@ -39,10 +39,10 @@ const customConfig = {
     dropDownHoverFontColor: '#FFFFFF',
     // 下拉项激活文字颜色
     dropDownSelectedFontColor: '#409EFF',
-    // 时间格式化类型:Date 对象（default），时间戳（timestamp），自定义（custom）
-    formatType: 'default',
+    // 时间格式化类型:时间戳（timestamp），自定义（custom）
+    formatType: 'custom',
     // 绑定值的格式
-    valueFormat: ''
+    valueFormat: 'HH:mm:ss'
   }
 }
 export const dataConfig = {

data-room-ui/packages/G2Plots/折线图/多折线动画图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Line'
 // 标题
@@ -584,6 +584,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   xField: 'year',

data-room-ui/packages/G2Plots/折线图/多折线图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Line'
 // 标题
@@ -1276,6 +1276,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'year',
   yField: 'value',

data-room-ui/packages/G2Plots/折线图/多阶梯折线图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Line'
 // 标题
@@ -471,6 +471,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'month',
   yField: 'value',

data-room-ui/packages/G2Plots/折线图/折线趋势填充图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Line'
 // 标题
@@ -598,6 +598,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   xField: 'year',

data-room-ui/packages/G2Plots/条形图/分组条形图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Bar'
 // 标题
@@ -59,35 +59,35 @@ const setting = [
   },
   /** 样式配置 **/
   // 图表 graph
-  {
-    label: '条形样式',
-    type: 'select', // 设置组件类型
-    field: 'shape', // 字段
-    optionField: 'shape', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    value: 'default',
-    tabName: 'custom',
-    options: [
-      {
-        label: '实心条形',
-        value: 'default'
-      },
-      // {
-      //   label: '线性',
-      //   value: 'line'
-      // },
-      {
-        label: '空心条形',
-        value: 'hollow-rect'
-      },
-      {
-        label: '钉形',
-        value: 'tick'
-      }
-    ],
-    groupName: 'graph'
-  },
+  // {
+  //   label: '条形样式',
+  //   type: 'select', // 设置组件类型
+  //   field: 'shape', // 字段
+  //   optionField: 'shape', // 对应options中的字段
+  //   // 是否多选
+  //   multiple: false,
+  //   value: 'default',
+  //   tabName: 'custom',
+  //   options: [
+  //     {
+  //       label: '实心条形',
+  //       value: 'default'
+  //     },
+  //     // {
+  //     //   label: '线性',
+  //     //   value: 'line'
+  //     // },
+  //     {
+  //       label: '空心条形',
+  //       value: 'hollow-rect'
+  //     },
+  //     {
+  //       label: '钉形',
+  //       value: 'tick'
+  //     }
+  //   ],
+  //   groupName: 'graph'
+  // },
   {
     label: '圆角设置',
     // 设置组件类型
@@ -563,9 +563,10 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   isGroup: true,
-  shape: ' ',
+  // shape: ' ',
   xField: 'value',
   yField: 'label',
   legendEnable: false,

data-room-ui/packages/G2Plots/条形图/基础条形图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Bar'
 // 标题
@@ -46,35 +46,35 @@ const setting = [
   },
   /** 样式配置 **/
   // 图表 graph
-  {
-    label: '条形样式',
-    type: 'select', // 设置组件类型
-    field: 'shape', // 字段
-    optionField: 'shape', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    value: 'default',
-    tabName: 'custom',
-    options: [
-      {
-        label: '实心条形',
-        value: 'default'
-      },
-      // {
-      //   label: '线性',
-      //   value: 'line'
-      // },
-      {
-        label: '空心条形',
-        value: 'hollow-rect'
-      },
-      {
-        label: '钉形',
-        value: 'tick'
-      }
-    ],
-    groupName: 'graph'
-  },
+  // {
+  //   label: '条形样式',
+  //   type: 'select', // 设置组件类型
+  //   field: 'shape', // 字段
+  //   optionField: 'shape', // 对应options中的字段
+  //   // 是否多选
+  //   multiple: false,
+  //   value: 'default',
+  //   tabName: 'custom',
+  //   options: [
+  //     {
+  //       label: '实心条形',
+  //       value: 'default'
+  //     },
+  //     // {
+  //     //   label: '线性',
+  //     //   value: 'line'
+  //     // },
+  //     {
+  //       label: '空心条形',
+  //       value: 'hollow-rect'
+  //     },
+  //     {
+  //       label: '钉形',
+  //       value: 'tick'
+  //     }
+  //   ],
+  //   groupName: 'graph'
+  // },
   {
     label: '圆角设置',
     // 设置组件类型
@@ -506,10 +506,11 @@ const dataHandler = 'const yFieldValue = setting.find(settingItem=>settingItem.f
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'value',
   yField: 'year',
-  shape: 'default', // 条形图形状
+  // shape: 'default', // 条形图形状
   seriesField: 'year',
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   legendEnable: true,
@@ -528,6 +529,7 @@ const option = {
   },
   label: {
     position: 'middle',
+    layout:{},
     style: {
       fill: '#59F25F',
       opacity: 0,

data-room-ui/packages/G2Plots/漏斗图/分面漏斗图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Funnel'
 // 标题
@@ -244,6 +244,7 @@ const dataHandler = 'data = data.sort((a, b) => b[option.yField] - a[option.yFie
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   xField: 'stage',

data-room-ui/packages/G2Plots/漏斗图/基础漏斗图.js

@@ -242,6 +242,7 @@ const dataHandler = 'data = data.sort((a, b) => b[option.yField] - a[option.yFie
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   xField: 'stage',

data-room-ui/packages/G2Plots/漏斗图/对比漏斗图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Funnel'
 // 标题
@@ -244,6 +244,7 @@ const dataHandler = 'data = data.sort((a, b) => b[option.yField] - a[option.yFie
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   xField: 'stage',

data-room-ui/packages/G2Plots/矩形树图/基础矩形树图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Treemap'
 // 标题
@@ -193,6 +193,7 @@ const dataHandler = '// 转换数据格式\n' +
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
   colorField: 'name',

data-room-ui/packages/G2Plots/雷达图/分组雷达图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Radar'
 // 标题
@@ -271,6 +271,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'item',
   yField: 'score',

data-room-ui/packages/G2Plots/面积图/堆叠面积图.js

@@ -5,7 +5,7 @@
  */
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Area'
 // 标题
@@ -603,6 +603,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'date',
   yField: 'value',

data-room-ui/packages/G2Plots/饼图/基础环图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Pie'
 // 标题
@@ -315,6 +315,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   angleField: 'value',
   colorField: 'type',

data-room-ui/packages/G2Plots/饼图/基础饼图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Pie'
 // 标题
@@ -220,6 +220,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   legendEnable: false,
   legendLayout: 'vertical',

data-room-ui/packages/G2Plots/饼图/玫瑰图.js

@@ -1,6 +1,6 @@
 
 // 配置版本号
-const version = '2023092201'
+const version = '2023092501'
 // 分类
 const category = 'Rose'
 // 标题
@@ -182,6 +182,7 @@ const dataHandler = ''
 const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
+  renderer: 'canvas',
   data,
   xField: 'type',
   yField: 'value',

data-room-ui/packages/js/utils/getComponentConfig.js

@@ -278,7 +278,7 @@ export default function getComponentConfig (type) {
         name: '日期时间选择器',
         title: '日期时间选择器',
         icon: Icon.getNameList()[23],
-        className: 'com.gccloud.dataroom.core.module.chart.components.ScreenTimePickerChart',
+        className: 'com.gccloud.dataroom.core.module.chart.components.ScreenDateTimePickerChart',
         w: 260,
         h: 80,
         x: 0,