feat(视图):增加南丁格尔玫瑰图；spark sql 表名重命名

backend/src/main/java/io/dataease/service/chart/ChartViewService.java

@@ -123,7 +123,7 @@ public class ChartViewService {
         } else if (table.getMode() == 1) {// 抽取
             DataTableInfoDTO dataTableInfoDTO = new Gson().fromJson(table.getInfo(), DataTableInfoDTO.class);
             String tableName = dataTableInfoDTO.getTable() + "-" + table.getDataSourceId();// todo hBase table name maybe change
-            data = sparkCalc.getData(tableName, xAxis, yAxis, view.getId().split("-")[0]);
+            data = sparkCalc.getData(tableName, xAxis, yAxis, "tmp_" + view.getId().split("-")[0]);
         }
 
         // 图表组件可再扩展

frontend/src/icons/svg/pie-rose.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1617857636853" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="859" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M172.860952 769.462857c55.832381 66.072381 132.291048 92.769524 208.725334 88.064l4.412952-251.562667c-10.288762-4.705524-24.990476-4.705524-35.279238-15.725714L172.860952 769.487238z m239.616-404.041143l-5.90019-169.813333c-55.832381 0-97.01181 15.725714-142.57981 59.733333l76.434286 136.801524c24.990476-15.725714 45.592381-26.721524 72.045714-26.721524z m122.002286 125.781334h357.229714c0-273.554286-199.92381-490.544762-449.828571-490.544762v371.053714c47.030857 4.705524 92.598857 59.733333 92.598857 119.466667z m-5.875809 22.016c-4.412952 26.721524-24.990476 55.02781-45.592381 77.043809l361.642666 386.755048C951.978667 862.232381 1024 698.733714 1024 517.924571H528.579048v-4.705523z m-111.713524 97.475047h-4.412953V997.424762c111.713524-4.705524 219.014095-55.02781 301.348572-125.781333L463.920762 604.40381c-16.164571 6.290286-30.866286 6.290286-47.055238 6.290285z m-224.914286-92.769524c0 55.02781 20.577524 92.769524 51.44381 130.486858l91.136-77.04381c-14.701714-15.701333-24.990476-33.01181-30.866286-59.733333l-111.713524 6.290285z m113.176381-33.011809c0-33.01181 14.701714-55.02781 30.866286-77.04381L172.860952 186.197333C90.526476 245.930667 39.082667 338.70019 24.380952 447.146667l280.771048 37.741714c0 6.290286 0 0 0 0z" p-id="860"></path></svg>

frontend/src/lang/zh.js

@@ -693,7 +693,11 @@ export default {
     filter_null: '为空',
     filter_not_null: '不为空',
     filter_include: '包含',
-    filter_not_include: '不包含'
+    filter_not_include: '不包含',
+    rose_type: '玫瑰图模式',
+    radius_mode: '半径',
+    area_mode: '面积',
+    rose_radius: '圆角'
   },
   dataset: {
     datalist: '数据集',

frontend/src/views/chart/chart/chart.js

@@ -15,6 +15,8 @@ export const DEFAULT_SIZE = {
   lineArea: false,
   pieInnerRadius: 0,
   pieOuterRadius: 60,
+  pieRoseType: 'radius',
+  pieRoseRadius: 5,
   funnelWidth: 80,
   radarShape: 'polygon'
 }

frontend/src/views/chart/chart/pie/pie.js

@@ -50,3 +50,18 @@ export function basePieOption(chart_option, chart) {
   return chart_option
 }
 
+export function rosePieOption(chart_option, chart) {
+  basePieOption(chart_option, chart)
+  let customAttr = {}
+  if (chart.customAttr) {
+    customAttr = JSON.parse(chart.customAttr)
+    if (customAttr.size) {
+      chart_option.series[0].roseType = customAttr.size.pieRoseType
+      chart_option.series[0].itemStyle = {
+        borderRadius: customAttr.size.pieRoseRadius
+      }
+    }
+  }
+  return chart_option
+}
+

frontend/src/views/chart/components/ChartComponent.vue

@@ -8,7 +8,7 @@
 import { BASE_BAR, BASE_LINE, HORIZONTAL_BAR, BASE_PIE, BASE_FUNNEL, BASE_RADAR } from '../chart/chart'
 import { baseBarOption, stackBarOption, horizontalBarOption, horizontalStackBarOption } from '../chart/bar/bar'
 import { baseLineOption, stackLineOption } from '../chart/line/line'
-import { basePieOption } from '../chart/pie/pie'
+import { basePieOption, rosePieOption } from '../chart/pie/pie'
 import { baseFunnelOption } from '../chart/funnel/funnel'
 import { baseRadarOption } from '../chart/radar/radar'
 import eventBus from '@/components/canvas/utils/eventBus'
@@ -73,6 +73,8 @@ export default {
         chart_option = stackLineOption(JSON.parse(JSON.stringify(BASE_LINE)), chart)
       } else if (chart.type === 'pie') {
         chart_option = basePieOption(JSON.parse(JSON.stringify(BASE_PIE)), chart)
+      } else if (chart.type === 'pie-rose') {
+        chart_option = rosePieOption(JSON.parse(JSON.stringify(BASE_PIE)), chart)
       } else if (chart.type === 'funnel') {
         chart_option = baseFunnelOption(JSON.parse(JSON.stringify(BASE_FUNNEL)), chart)
       } else if (chart.type === 'radar') {

frontend/src/views/chart/components/shape-attr/SizeSelector.vue

@@ -57,6 +57,18 @@
             <el-form-item :label="$t('chart.pie_outer_radius')" class="form-item form-item-slider">
               <el-slider v-model="sizeForm.pieOuterRadius" show-input :show-input-controls="false" input-size="mini" :min="0" :max="100" @change="changeBarSizeCase" />
             </el-form-item>
+
+            <span v-if="chart.type && chart.type.includes('pie-rose')">
+              <el-form-item :label="$t('chart.rose_type')" class="form-item">
+                <el-radio-group v-model="sizeForm.pieRoseType" size="mini" @change="changeBarSizeCase">
+                  <el-radio-button label="radius">{{ $t('chart.radius_mode') }}</el-radio-button>
+                  <el-radio-button label="area">{{ $t('chart.area_mode') }}</el-radio-button>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item :label="$t('chart.rose_radius')" class="form-item form-item-slider">
+                <el-slider v-model="sizeForm.pieRoseRadius" show-input :show-input-controls="false" input-size="mini" :min="0" :max="100" @change="changeBarSizeCase" />
+              </el-form-item>
+            </span>
           </el-form>
 
           <el-form v-if="chart.type && chart.type.includes('funnel')" ref="sizeFormPie" :model="sizeForm" label-width="80px" size="mini">

frontend/src/views/chart/view/ChartEdit.vue

@@ -90,8 +90,15 @@
                 <div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
                   <el-radio value="line-stack" label="line-stack"><svg-icon icon-class="line-stack" class="chart-icon" /></el-radio>
                   <el-radio value="pie" label="pie"><svg-icon icon-class="pie" class="chart-icon" /></el-radio>
+                  <el-radio value="pie-rose" label="pie-rose"><svg-icon icon-class="pie-rose" class="chart-icon" /></el-radio>
                   <el-radio value="funnel" label="funnel"><svg-icon icon-class="funnel" class="chart-icon" /></el-radio>
                   <el-radio value="radar" label="radar"><svg-icon icon-class="radar" class="chart-icon" /></el-radio>
+                </div>
+                <div>
+                  <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
+                  <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
+                  <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
+                  <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
                   <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
                 </div>
               </el-radio-group>
@@ -321,7 +328,7 @@ export default {
       const view = JSON.parse(JSON.stringify(this.view))
       view.id = this.view.id
       view.sceneId = this.view.sceneId
-      view.name = this.table.name
+      view.name = this.view.name ? this.view.name : this.table.name
       view.tableId = this.view.tableId
       // view.xaxis.forEach(function(ele) {
       //   if (!ele.summary || ele.summary === '') {