Merge remote-tracking branch 'origin/dev' into pr@devfix_panel-filter

Dockerfile

-#FROM registry.cn-qingdao.aliyuncs.com/dataease/fabric8-java-alpine-openjdk8-jre
-FROM alpine
-
-RUN echo -e 'http://mirrors.aliyun.com/alpine/v3.15/main/\nhttp://mirrors.aliyun.com/alpine/v3.15/community/' > /etc/apk/repositories 
-
-RUN apk add openjdk8 chromium chromium-chromedriver fontconfig --no-cache --allow-untrusted
-
-ADD simsun.ttc /usr/share/fonts/
-
-RUN cd /usr/share/fonts/ \
-    && mkfontscale \
-    && mkfontdir \
-    && fc-cache -fv
+FROM registry.cn-qingdao.aliyuncs.com/dataease/fabric8-java-alpine-openjdk8-jre
 
 ARG IMAGE_TAG
 

backend/src/main/java/io/dataease/dto/chart/ChartFieldCompareCustomDTO.java

+package io.dataease.dto.chart;
+
+import lombok.Data;
+
+import java.util.List;
+
+/**
+ * @Author gin
+ * @Date 2021/12/9 2:48 下午
+ */
+@Data
+public class ChartFieldCompareCustomDTO {
+    private String field;
+    private String calcType;
+    private String timeType;
+    private String currentTime;
+    private String compareTime;
+    private List<String> currentTimeRange;
+    private List<String> compareTimeRange;
+
+}

backend/src/main/java/io/dataease/dto/chart/ChartFieldCompareDTO.java

+package io.dataease.dto.chart;
+
+import lombok.Data;
+
+/**
+ * @Author gin
+ * @Date 2021/12/9 2:48 下午
+ */
+@Data
+public class ChartFieldCompareDTO {
+    private String type;
+    private String resultData;
+    private String field;
+    private ChartFieldCompareCustomDTO custom;
+}

backend/src/main/java/io/dataease/dto/chart/ChartViewFieldDTO.java

@@ -46,4 +46,6 @@ public class ChartViewFieldDTO implements Serializable {
     private Integer extField;
 
     private String chartType;
+
+    private ChartFieldCompareDTO compareCalc;
 }

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

+package io.dataease.service.chart;
+
+/**
+ * @Author gin
+ * @Date 2021/12/9 3:58 下午
+ */
+public class ChartConstants {
+    public static final String YEAR_MOM = "year_mom";
+    public static final String MONTH_MOM = "month_mom";
+    public static final String YEAR_YOY = "year_yoy";
+    public static final String DAY_MOM = "day_mom";
+    public static final String MONTH_YOY = "month_yoy";
+}

frontend/src/views/chart/components/compare/CompareEdit.vue

@@ -63,10 +63,8 @@ export default {
     // 过滤xaxis，extStack所有日期字段
     initFieldList() {
       const xAxis = JSON.parse(this.chart.xaxis)
-      const extStack = JSON.parse(this.chart.extStack)
       const t1 = xAxis.filter(ele => { return ele.deType === 1 })
-      const t2 = extStack.filter(ele => { return ele.deType === 1 })
-      this.fieldList = t1.concat(t2)
+      this.fieldList = t1
       // 如果没有选中字段，则默认选中第一个
       if ((!this.compareItem.compareCalc.field || this.compareItem.compareCalc.field === '') && this.fieldList.length > 0) {
         this.compareItem.compareCalc.field = this.fieldList[0].id

frontend/src/views/chart/components/drag-item/ChartDragItem.vue

@@ -11,6 +11,9 @@
       </span>
       <span class="item-span-style" :title="item.name">{{ item.name }}</span>
       <span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span>
+      <span v-if="item.deType === 1" class="summary-span">
+        {{ $t('chart.' + item.dateStyle) }}
+      </span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
       <span class="el-dropdown-link">
@@ -25,6 +28,9 @@
           </span>
           <span class="item-span-style" :title="item.name">{{ item.name }}</span>
           <span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span>
+          <span v-if="item.deType === 1" class="summary-span">
+            {{ $t('chart.' + item.dateStyle) }}
+          </span>
           <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
         </el-tag>
         <el-dropdown-menu slot="dropdown">
@@ -239,7 +245,7 @@ export default {
 
   .item-span-style{
     display: inline-block;
-    width: 80px;
+    width: 70px;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
@@ -254,6 +260,6 @@ export default {
     margin-left: 4px;
     color: #878d9f;
     position: absolute;
-    right: 30px;
+    right: 25px;
   }
 </style>

frontend/src/views/chart/components/drag-item/DimensionItem.vue

@@ -10,6 +10,9 @@
         <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
       </span>
       <span class="item-span-style" :title="item.name">{{ item.name }}</span>
+      <span v-if="item.deType === 1" class="summary-span">
+        {{ $t('chart.' + item.dateStyle) }}
+      </span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
       <span class="el-dropdown-link">
@@ -23,6 +26,9 @@
             <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
           </span>
           <span class="item-span-style" :title="item.name">{{ item.name }}</span>
+          <span v-if="item.deType === 1" class="summary-span">
+            {{ $t('chart.' + item.dateStyle) }}
+          </span>
           <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
         </el-tag>
         <el-dropdown-menu slot="dropdown">
@@ -32,7 +38,7 @@
                 <span>
                   <i class="el-icon-sort" />
                   <span>{{ $t('chart.sort') }}</span>
-                  <span class="summary-span">({{ $t('chart.'+item.sort) }})</span>
+                  <span class="summary-span-item">({{ $t('chart.'+item.sort) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -53,7 +59,7 @@
                 <span>
                   <i class="el-icon-c-scale-to-original" />
                   <span>{{ $t('chart.dateStyle') }}</span>
-                  <span class="summary-span">({{ $t('chart.'+item.dateStyle) }})</span>
+                  <span class="summary-span-item">({{ $t('chart.'+item.dateStyle) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -73,7 +79,7 @@
                 <span>
                   <i class="el-icon-timer" />
                   <span>{{ $t('chart.datePattern') }}</span>
-                  <span class="summary-span">({{ $t('chart.'+item.datePattern) }})</span>
+                  <span class="summary-span-item">({{ $t('chart.'+item.datePattern) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -215,7 +221,9 @@ export default {
 
   .summary-span{
     margin-left: 4px;
-    color: #878d9f;;
+    color: #878d9f;
+    position: absolute;
+    right: 25px;
   }
 
   .inner-dropdown-menu{
@@ -227,9 +235,14 @@ export default {
 
   .item-span-style{
     display: inline-block;
-    width: 80px;
+    width: 70px;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
   }
+
+  .summary-span-item{
+    margin-left: 4px;
+    color: #878d9f;
+  }
 </style>

frontend/src/views/chart/components/drag-item/QuotaExtItem.vue

@@ -14,7 +14,7 @@
       </span>
       <span class="item-span-style" :title="item.name">{{ item.name }}</span>
       <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
-        {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
+        {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
       </span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
@@ -33,7 +33,7 @@
           </span>
           <span class="item-span-style" :title="item.name">{{ item.name }}</span>
           <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
-            {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
+            {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
           </span>
           <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
         </el-tag>
@@ -97,15 +97,15 @@
             <el-dropdown placement="right-start" size="mini" style="width: 100%" @command="quickCalc">
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
-                  <i class="el-icon-crop" />
-                  <span>{{ $t('chart.yoy_label') }}</span>
+                  <i class="el-icon-s-grid" />
+                  <span>{{ $t('chart.quick_calc') }}</span>
                   <span class="summary-span-item">({{ !item.compareCalc ? $t('chart.none') : $t('chart.' + item.compareCalc.type) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeQuickCalc('none')">{{ $t('chart.none') }}</el-dropdown-item>
-                <el-dropdown-item :disabled="disableEditCompare" :command="beforeQuickCalc('setting')">{{ $t('commons.setting') }}...</el-dropdown-item>
+                <el-dropdown-item :disabled="disableEditCompare" :command="beforeQuickCalc('setting')">{{ $t('chart.yoy_label') }}...</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -191,14 +191,11 @@ export default {
     },
     isEnableCompare() {
       const xAxis = JSON.parse(this.chart.xaxis)
-      const extStack = JSON.parse(this.chart.extStack)
       const t1 = xAxis.filter(ele => {
         return ele.deType === 1
       })
-      const t2 = extStack.filter(ele => {
-        return ele.deType === 1
-      })
-      if (t1.length > 0 || t2.length > 0) {
+      // 暂时只支持类别轴/维度的时间类型字段，且视图中有且只有一个时间字段
+      if (t1.length === 1 && this.chart.type !== 'text' && this.chart.type !== 'gauge' && this.chart.type !== 'liquid') {
         this.disableEditCompare = false
       } else {
         this.disableEditCompare = true

frontend/src/views/chart/components/drag-item/QuotaItem.vue

@@ -14,7 +14,7 @@
       </span>
       <span class="item-span-style" :title="item.name">{{ item.name }}</span>
       <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
-        {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
+        {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
       </span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
@@ -33,7 +33,7 @@
           </span>
           <span class="item-span-style" :title="item.name">{{ item.name }}</span>
           <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
-            {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
+            {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
           </span>
           <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
         </el-tag>
@@ -97,15 +97,15 @@
             <el-dropdown placement="right-start" size="mini" style="width: 100%" @command="quickCalc">
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
-                  <i class="el-icon-crop" />
-                  <span>{{ $t('chart.yoy_label') }}</span>
+                  <i class="el-icon-s-grid" />
+                  <span>{{ $t('chart.quick_calc') }}</span>
                   <span class="summary-span-item">({{ !item.compareCalc ? $t('chart.none') : $t('chart.' + item.compareCalc.type) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeQuickCalc('none')">{{ $t('chart.none') }}</el-dropdown-item>
-                <el-dropdown-item :disabled="disableEditCompare" :command="beforeQuickCalc('setting')">{{ $t('commons.setting') }}...</el-dropdown-item>
+                <el-dropdown-item :disabled="disableEditCompare" :command="beforeQuickCalc('setting')">{{ $t('chart.yoy_label') }}...</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -188,14 +188,11 @@ export default {
     },
     isEnableCompare() {
       const xAxis = JSON.parse(this.chart.xaxis)
-      const extStack = JSON.parse(this.chart.extStack)
       const t1 = xAxis.filter(ele => {
         return ele.deType === 1
       })
-      const t2 = extStack.filter(ele => {
-        return ele.deType === 1
-      })
-      if ((t1.length > 0 || t2.length > 0) && this.chart.type !== 'text' && this.chart.type !== 'gauge' && this.chart.type !== 'liquid') {
+      // 暂时只支持类别轴/维度的时间类型字段，且视图中有且只有一个时间字段
+      if (t1.length === 1 && this.chart.type !== 'text' && this.chart.type !== 'gauge' && this.chart.type !== 'liquid') {
         this.disableEditCompare = false
       } else {
         this.disableEditCompare = true

frontend/src/views/dataset/add/AddUnion.vue

@@ -16,7 +16,7 @@
     <el-divider />
     <div>
       <el-form :inline="true" style="display: flex;align-items: center;justify-content: space-between;">
-        <el-form-item class="form-item">
+        <el-form-item class="form-item" :label="$t('commons.name')">
           <el-input v-model="name" size="mini" :placeholder="$t('commons.name')" clearable />
         </el-form-item>
         <el-form-item class="form-item">
@@ -59,7 +59,7 @@
     </div>
 
     <!--选择数据集-->
-    <el-dialog v-if="selectDsDialog" v-dialogDrag :title="$t('chart.select_dataset')" :visible="selectDsDialog" :show-close="false" width="360px" class="dialog-css">
+    <el-dialog v-if="selectDsDialog" v-dialogDrag :title="$t('chart.select_dataset')" :visible="selectDsDialog" :show-close="false" width="400px" class="dialog-css">
       <dataset-group-selector-tree :fix-height="true" show-mode="union" :custom-type="customType" @getTable="firstDs" />
       <div slot="footer" class="dialog-footer">
         <el-button size="mini" @click="closeSelectDs()">{{ $t('dataset.cancel') }}</el-button>
@@ -337,4 +337,8 @@ export default {
 .preview-style >>> .el-drawer .el-drawer__body{
   padding: 0 16px 10px!important;
 }
+.form-item >>> .el-form-item__label{
+  font-size: 12px!important;
+  font-weight: 400!important;
+}
 </style>

frontend/src/views/dataset/add/union/NodeItem.vue

@@ -28,7 +28,7 @@
     </div>
 
     <!--选择数据集-->
-    <el-dialog v-if="selectDsDialog" v-dialogDrag :title="$t('chart.select_dataset')" :visible="selectDsDialog" :show-close="false" width="360px" class="dialog-css">
+    <el-dialog v-if="selectDsDialog" v-dialogDrag :title="$t('chart.select_dataset')" :visible="selectDsDialog" :show-close="false" width="400px" class="dialog-css">
       <dataset-group-selector-tree :fix-height="true" show-mode="union" :custom-type="customType" :mode="currentNode.currentDs.mode" @getTable="firstDs" />
       <div slot="footer" class="dialog-footer">
         <el-button size="mini" @click="closeSelectDs()">{{ $t('dataset.cancel') }}</el-button>
@@ -37,7 +37,7 @@
     </el-dialog>
 
     <!--编辑单个数据集字段-->
-    <el-dialog v-if="editField" v-dialogDrag :title="$t('dataset.field_select')" :visible="editField" :show-close="false" width="360px" class="dialog-css">
+    <el-dialog v-if="editField" v-dialogDrag :title="$t('dataset.field_select')" :visible="editField" :show-close="false" width="400px" class="dialog-css">
       <union-field-edit :node="currentNode" />
       <div slot="footer" class="dialog-footer">
         <el-button size="mini" @click="closeEditField()">{{ $t('dataset.cancel') }}</el-button>

frontend/src/views/dataset/common/DatasetGroupSelectorTree.vue

@@ -173,7 +173,7 @@ export default {
       },
       isTreeSearch: false,
       treeStyle: this.fixHeight ? {
-        height: '200px',
+        height: '300px',
         overflow: 'auto'
       } : {}
     }