Merge remote-tracking branch 'origin/master'

DataRoom/dataroom-core/pom.xml

@@ -6,7 +6,7 @@
     <parent>
         <groupId>com.gccloud</groupId>
         <artifactId>dataroom</artifactId>
-        <version>1.0.1.2023083001.Alpha</version>
+        <version>1.0.1.2023090501.Alpha</version>
     </parent>
 
     <artifactId>dataroom-core</artifactId>

DataRoom/dataroom-core/src/main/java/com/gccloud/dataroom/core/constant/PageDesignConstant.java

@@ -151,6 +151,11 @@ public interface PageDesignConstant {
              * 飞线地图
              */
             String FLY_MAP = "flyMap";
+
+            /**
+             * Tab切换
+             */
+            String TAB_CHART = "chartTab";
         }
     }
 

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

@@ -0,0 +1,43 @@
+package com.gccloud.dataroom.core.module.chart.components;
+
+import com.gccloud.dataroom.core.constant.PageDesignConstant;
+import com.gccloud.dataroom.core.module.chart.bean.Chart;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Data;
+
+import java.util.List;
+
+/**
+ * tab切换
+ * @author hongyang
+ * @version 1.0
+ * @date 2023/8/24 17:03
+ */
+@Data
+public class ChartTabChart extends Chart{
+
+
+    @ApiModelProperty(notes = "类型")
+    private String type = PageDesignConstant.BigScreen.Type.TAB_CHART;
+
+    @ApiModelProperty(notes = "个性化")
+    private Customize customize = new Customize();
+
+    @Data
+    public static class Customize {
+
+        @ApiModelProperty(notes = "组件tab列表")
+        private List tabList;
+
+        @ApiModelProperty(notes = "字体大小")
+        private Integer fontSize;
+
+        @ApiModelProperty(notes = "字体粗细")
+        private Integer fontWeight;
+
+        @ApiModelProperty(notes = "字体颜色")
+        private String color;
+
+    }
+
+}

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

@@ -16,6 +16,9 @@ import java.util.List;
 @Data
 public class CustomComponentChart extends Chart {
 
+    @ApiModelProperty(notes = "父编码")
+    private String parentCode;
+
     @ApiModelProperty(notes = "版本")
     private String version;
 

DataRoom/dataroom-server/pom.xml

@@ -6,7 +6,7 @@
     <parent>
         <groupId>com.gccloud</groupId>
         <artifactId>dataroom</artifactId>
-        <version>1.0.1.2023083001.Alpha</version>
+        <version>1.0.1.2023090501.Alpha</version>
     </parent>
 
     <artifactId>dataroom-server</artifactId>
@@ -29,7 +29,7 @@
         <dependency>
             <groupId>com.gccloud</groupId>
             <artifactId>dataroom-core</artifactId>
-            <version>1.0.1.2023083001.Alpha</version>
+            <version>1.0.1.2023090501.Alpha</version>
         </dependency>
 
         <dependency>

DataRoom/pom.xml

@@ -12,7 +12,7 @@
 
     <groupId>com.gccloud</groupId>
     <artifactId>dataroom</artifactId>
-    <version>1.0.1.2023083001.Alpha</version>
+    <version>1.0.1.2023090501.Alpha</version>
 
     <packaging>pom</packaging>
     <description>基于G2Plot、Echarts的大屏设计服务端，具备设计、预览能力，支持MySQL、Oracle、PostgreSQL、Groovy等数据集接入

data-room-ui/packages/BizComponent/Preview.vue

@@ -40,7 +40,6 @@ export default {
         // eslint-disable-next-line prefer-const, no-unused-vars
         let title = ''
 
-        let chartType = ''
         // eslint-disable-next-line prefer-const, no-unused-vars
         let data = []
         let g2Plots=g2Plot
@@ -56,7 +55,6 @@ export default {
           setting,
           echarts,
           g2Plots,
-          chartType
         }
       },
       set (val) {}
@@ -194,17 +192,17 @@ export default {
 
 <style lang="scss" scoped>
 .bs-remote-preview {
-  // position: absolute;
+  position: absolute;
-  height: 88%;
+  min-height: 100%;
   min-width: 100%;
   overflow: hidden;
   box-sizing: border-box;
 
   .remote-preview-inner-wrap {
-    // position: absolute;
+    position: absolute;
-    height: 100%;
+    height: calc(100% - 40px);
     width: 100%;
-    // overflow: auto;
+    overflow: auto;
     padding: 20px;
     background-color: var(--bs-background-1);
   }

data-room-ui/packages/BizComponent/config/defaultEchartsConfig.js

@@ -0,0 +1,186 @@
+/*
+ * @description: 此处是业务组件的代码案例
+ * @Date: 2023-06-06 15:45:07
+ */
+
+// vue 组件片段
+export const defaultEchartsVueContent = `
+<!-- 这是一个代码案例 -->
+<template>
+  <div
+	 :id="chatId"
+	 style="width: 100%;height: 100%"
+	/>
+</template>
+<script>
+
+export default {
+
+  name: 'TestA',
+  components: {
+  },
+  // 业务组件提供的props
+  props: {
+    config: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data () {
+    return {
+	  chart: null,
+    }
+  },
+  // 计算属性
+  computed: {
+   chatId(){
+	 return 'echarts' + this.config.code
+   }
+  },
+  methods: {
+	//响应式变化组件大小方法，无需改动
+	onResize () {
+      this.chart.resize({
+        animation: {
+          duration: 300,
+          easing: 'linear'
+          // delay: 500,
+        }
+      })
+    },
+    // 初始化图表
+    newChart (config) {
+	  let option = config.option
+	  const xList=config.option.data.map(item=> item[config.option.xField])
+	  const yList=config.option.data.map(item=> item[config.option.yField])
+	  option.xAxis.data=xList
+	  option.series[0].data=yList
+	  const dom = document.getElementById(this.chatId)
+      this.chart = config.echarts.init(dom)
+      this.chart.setOption(option,true)
+    },
+  },
+  mounted(){
+   this.newChart(this.config)
+	//响应式变化组件大小，无需改动
+	const dragSelect = document.querySelector("#"+this.chatId)
+    let pre = Date.now()
+    const wait = 300
+    const resizeObserver = new ResizeObserver(entries => {
+      const now = Date.now()
+      if (now - pre >= wait) {
+        setTimeout(() => {
+          this.onResize()
+        }, wait)
+        pre = Date.now()
+      }
+    })
+    resizeObserver.observe(dragSelect)
+  },
+}
+</script>
+<style lang="scss" scoped>
+// 此处书写样式，支持scss
+
+</style>
+`
+
+// 配置 片段
+export const defaultEchartsSettingContent = `
+// 这是一个配置案例
+//  组件备注名称
+const title = 'echarts案例'
+
+// 右侧配置项
+const setting = [
+   {
+    label: '维度',
+    // 设置组件类型， select / input / colorPicker
+    type: 'select',
+    // 字段
+    field: 'xField',
+    optionField: 'xField', // 对应options中的字段
+    // 是否多选
+    multiple: false,
+    // 绑定的值
+    value: '',
+    // tab页。 data: 数据， custom: 自定义
+    tabName: 'data'
+  },
+  {
+    label: '指标',
+    // 设置组件类型
+    type: 'select',
+    // 字段
+    field: 'yField',
+    // 对应options中的字段
+    optionField: 'yField',
+    // 是否多选
+    multiple: false,
+    value: '',
+    tabName: 'data'
+  },
+  {
+    label: 'x轴类型',
+    type: 'input',
+    field: 'xAxis_type',
+    optionField: 'xAxis.type',
+    value: 'category',
+    tabName: 'custom',
+    groupName: 'xAxis'
+  },
+  {
+    label: 'y轴类型',
+    type: 'input',
+    field: 'yAxis_type',
+    optionField: 'yAxis.type',
+    value: 'value',
+    tabName: 'custom',
+    groupName: 'yAxis'
+  }
+]
+
+// 模拟数据
+const data = [
+  { Date: '2010-01', scales: 1998 },
+  { Date: '2010-02', scales: 1850 },
+  { Date: '2010-03', scales: 1720 },
+  { Date: '2010-04', scales: 1818 },
+  { Date: '2010-05', scales: 1920 },
+  { Date: '2010-06', scales: 1802 },
+  { Date: '2010-07', scales: 1945 },
+  { Date: '2010-08', scales: 1856 },
+  { Date: '2010-09', scales: 2107 },
+  { Date: '2010-10', scales: 2140 }
+]
+
+const option = {
+  // 数据将要放入到哪个字段中
+  dataKey: 'data',
+  data,
+  color: '',
+  appendPadding: [16, 16, 16, 16], // 设置图标的边距
+  xField: 'Date',
+  yField: 'scales',
+  smooth: true,
+  xAxis: {
+    type:'category',
+	  data: []
+   },
+  yAxis: {
+    type: 'value'
+   },
+  series:[
+	{
+	  data: [],
+	  type:'line'
+    }
+  ]
+}
+
+export default {
+  title,
+  option,
+  setting
+}
+`

data-room-ui/packages/BizComponent/config/defaultG2Config.js

@@ -9,7 +9,7 @@ export const defaultG2VueContent = `
 <template>
   <div
 	 :id="chatId"
-	 style="width: 100%;height: 300px"
+	 style="width: 100%;height: 100%"
 	/>
 </template>
 <script>
@@ -264,7 +264,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',
@@ -275,7 +275,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoHide',
     optionField: 'xAxis.label.autoHide',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/BizComponent/index.vue

@@ -28,7 +28,7 @@
           <div class="code-tab-header">
             <div class="code-tab-left">
               <div class="code-tab">组件模板</div>
-              <div class="code-tab-btn">
+              <div class="code-tab-btn" @click="change('echarts')">
                 echarts组件
               </div>
               <div class="code-tab-btn" @click="change('g2')">
@@ -130,6 +130,7 @@ import CusBtn from 'data-room-ui/BigScreenDesign/BtnLoading'
 import BizComponentPreview from './Preview'
 import { getBizComponentInfo, updateBizComponent } from 'data-room-ui/js/api/bigScreenApi'
 import { defaultSettingContent, defaultVueContent } from './config/defaultBizConfig'
+import { defaultEchartsSettingContent, defaultEchartsVueContent } from './config/defaultEchartsConfig'
 import { defaultG2SettingContent, defaultG2VueContent } from './config/defaultG2Config'
 import { codemirror } from 'vue-codemirror'
 import 'codemirror/lib/codemirror.css'
@@ -238,6 +239,9 @@ export default {
       }else if(val=='base'){
         this.form.settingContent=defaultSettingContent
         this.form.vueContent=defaultVueContent
+      }else if(val=='echarts'){
+        this.form.settingContent= defaultEchartsSettingContent
+        this.form.vueContent=defaultEchartsVueContent
       }
     },
     change(val) {

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

@@ -321,7 +321,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',
@@ -332,7 +332,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoHide',
     optionField: 'xAxis.label.autoHide',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/折线图/基础折线点图.js

@@ -312,7 +312,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',
@@ -323,7 +323,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoHide',
     optionField: 'xAxis.label.autoHide',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/折线图/基础曲线图.js

@@ -212,7 +212,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',
@@ -223,7 +223,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoHide',
     optionField: 'xAxis.label.autoHide',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -338,7 +338,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoHide',
     optionField: 'xAxis.label.autoHide',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -293,7 +293,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -289,7 +289,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -345,7 +345,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -459,7 +459,7 @@ const setting = [
     type: 'switch',
     field: 'yAxis_label_autoRotate',
     optionField: 'yAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/柱状图/分组柱状图.js

@@ -331,7 +331,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js

@@ -331,7 +331,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -252,7 +252,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js

@@ -331,7 +331,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -338,7 +338,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

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

@@ -296,7 +296,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',

data-room-ui/packages/G2Plots/面积图/渐变色面积图.js

@@ -242,7 +242,7 @@ const setting = [
     type: 'switch',
     field: 'xAxis_label_autoRotate',
     optionField: 'xAxis.label.autoRotate',
-    value: false,
+    value: true,
     active: true,
     inactive: false,
     tabName: 'custom',