diff --git a/backend/src/main/java/com/ipsos/provider/mysql/MysqlQueryProvider.java b/backend/src/main/java/com/ipsos/provider/mysql/MysqlQueryProvider.java
index d4e4cf7..01841ce 100644
--- a/backend/src/main/java/com/ipsos/provider/mysql/MysqlQueryProvider.java
+++ b/backend/src/main/java/com/ipsos/provider/mysql/MysqlQueryProvider.java
@@ -222,7 +222,7 @@ public class MysqlQueryProvider extends QueryProvider {
                 }
                 String fieldAlias = String.format(SQLConstants.FIELD_ALIAS_Y_PREFIX, i);
                 // 处理纵轴字段
-                yFields.add(getYFields(y, originField, fieldAlias));
+                yFields.add(getYFields(y, originField, fieldAlias, table));
                 // 处理纵轴过滤
                 yWheres.addAll(getYWheres(y, originField, fieldAlias));
                 // 处理纵轴排序
@@ -976,7 +976,7 @@ public class MysqlQueryProvider extends QueryProvider {
         return list;
     }
 
-    private SQLObj getYFields(ChartViewFieldDTO y, String originField, String fieldAlias) {
+    private SQLObj getYFields(ChartViewFieldDTO y, String originField, String fieldAlias, String tableName) {
         String fieldName = "";
         if (StringUtils.equalsIgnoreCase(y.getOriginName(), "*")) {
             fieldName = MySQLConstants.AGG_COUNT;
@@ -987,6 +987,8 @@ public class MysqlQueryProvider extends QueryProvider {
                 String cast = String.format(MySQLConstants.CAST, originField, y.getDeType() == 2 ? MySQLConstants.DEFAULT_INT_FORMAT : MySQLConstants.DEFAULT_FLOAT_FORMAT);
                 String agg = String.format(MySQLConstants.AGG_FIELD, y.getSummary(), cast);
                 fieldName = String.format(MySQLConstants.CAST, agg, MySQLConstants.DEFAULT_FLOAT_FORMAT);
+            } else if (StringUtils.equalsIgnoreCase(y.getSummary(), "ratio")) {
+                fieldName = "sum(" + originField + ")/(SELECT sum(" + y.getOriginName() + ") FROM " + tableName + ")*100";
             } else {
                 String cast = String.format(MySQLConstants.CAST, originField, y.getDeType() == 2 ? MySQLConstants.DEFAULT_INT_FORMAT : MySQLConstants.DEFAULT_FLOAT_FORMAT);
                 fieldName = String.format(MySQLConstants.AGG_FIELD, y.getSummary(), cast);
@@ -997,6 +999,9 @@ public class MysqlQueryProvider extends QueryProvider {
                 .fieldAlias(fieldAlias)
                 .build();
     }
+    private SQLObj getYFields(ChartViewFieldDTO y, String originField, String fieldAlias) {
+        return this.getYFields(y, originField, fieldAlias, null);
+    }
 
     private List<SQLObj> getYWheres(ChartViewFieldDTO y, String originField, String fieldAlias) {
         List<SQLObj> list = new ArrayList<>();
diff --git a/data/ehcache/users_info.data b/data/ehcache/users_info.data
index cb78739..ae933d1 100644
Binary files a/data/ehcache/users_info.data and b/data/ehcache/users_info.data differ
diff --git a/data/ehcache/users_info.index b/data/ehcache/users_info.index
index 71e995c..a6d7c47 100644
Binary files a/data/ehcache/users_info.index and b/data/ehcache/users_info.index differ
diff --git a/data/ehcache/users_permissions_info.data b/data/ehcache/users_permissions_info.data
index 5a04321..71bb4c2 100644
Binary files a/data/ehcache/users_permissions_info.data and b/data/ehcache/users_permissions_info.data differ
diff --git a/data/ehcache/users_permissions_info.index b/data/ehcache/users_permissions_info.index
index b9e45cd..3a2f7a0 100644
Binary files a/data/ehcache/users_permissions_info.index and b/data/ehcache/users_permissions_info.index differ
diff --git a/data/ehcache/users_roles_info.data b/data/ehcache/users_roles_info.data
index 434d9a1..a97a73e 100644
Binary files a/data/ehcache/users_roles_info.data and b/data/ehcache/users_roles_info.data differ
diff --git a/data/ehcache/users_roles_info.index b/data/ehcache/users_roles_info.index
index d7719b6..8489806 100644
Binary files a/data/ehcache/users_roles_info.index and b/data/ehcache/users_roles_info.index differ
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 8720f15..93c94ac 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -672,6 +672,7 @@ export default {
     min: '最小值',
     stddev_pop: '标准差',
     var_pop: '方差',
+    ratio: '百分比',
     quick_calc: '快速计算',
     show_name_set: '显示名设置',
     color: '颜色',
diff --git a/frontend/src/views/chart/components/drag-item/ChartDragItem.vue b/frontend/src/views/chart/components/drag-item/ChartDragItem.vue
index 7276b28..957b148 100644
--- a/frontend/src/views/chart/components/drag-item/ChartDragItem.vue
+++ b/frontend/src/views/chart/components/drag-item/ChartDragItem.vue
@@ -40,7 +40,7 @@
       </span>
       <span class="item-span-style" :title="item.name">{{ item.name }}</span>
       <span v-if="item.summary" class="summary-span">{{
-        $t("chart." + item.summary)
+        $t('chart.' + item.summary)
       }}</span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
@@ -86,7 +86,7 @@
             item.name
           }}</span>
           <span v-if="item.summary" class="summary-span">{{
-            $t("chart." + item.summary)
+            $t('chart.' + item.summary)
           }}</span>
           <i
             class="el-icon-arrow-down el-icon--right"
@@ -104,10 +104,10 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-notebook-2" />
-                  <span>{{ $t("chart.summary") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.summary) }})</span
-                  >
+                  <span>{{ $t('chart.summary') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.summary) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -115,66 +115,59 @@
                 <el-dropdown-item
                   v-if="
                     item.id === 'count' ||
-                    item.deType === 0 ||
-                    item.deType === 1
+                      item.deType === 0 ||
+                      item.deType === 1
                   "
                   :command="beforeSummary('count')"
-                  >{{ $t("chart.count") }}</el-dropdown-item
-                >
+                >{{ $t('chart.count') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('sum')"
-                  >{{ $t("chart.sum") }}</el-dropdown-item
-                >
+                >{{ $t('chart.sum') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('avg')"
-                  >{{ $t("chart.avg") }}</el-dropdown-item
-                >
+                >{{ $t('chart.avg') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('max')"
-                  >{{ $t("chart.max") }}</el-dropdown-item
-                >
+                >{{ $t('chart.max') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('min')"
-                  >{{ $t("chart.min") }}</el-dropdown-item
-                >
+                >{{ $t('chart.min') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('stddev_pop')"
-                  >{{ $t("chart.stddev_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.stddev_pop') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('var_pop')"
-                  >{{ $t("chart.var_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.var_pop') }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -189,31 +182,31 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-c-scale-to-original" />
-                  <span>{{ $t("chart.dateStyle") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.dateStyle) }})</span
-                  >
+                  <span>{{ $t('chart.dateStyle') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.dateStyle) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeDateStyle('y')">{{
-                  $t("chart.y")
+                  $t('chart.y')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeDateStyle('y_M')">{{
-                  $t("chart.y_M")
+                  $t('chart.y_M')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeDateStyle('y_M_d')">{{
-                  $t("chart.y_M_d")
+                  $t('chart.y_M_d')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeDateStyle('H_m_s')">{{
-                  $t("chart.H_m_s")
+                  $t('chart.H_m_s')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeDateStyle('y_M_d_H_m')">{{
-                  $t("chart.y_M_d_H_m")
+                  $t('chart.y_M_d_H_m')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeDateStyle('y_M_d_H_m_s')">{{
-                  $t("chart.y_M_d_H_m_s")
+                  $t('chart.y_M_d_H_m_s')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -228,20 +221,20 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-timer" />
-                  <span>{{ $t("chart.datePattern") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.datePattern) }})</span
-                  >
+                  <span>{{ $t('chart.datePattern') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.datePattern) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
-                <el-dropdown-item :command="beforeDatePattern('date_sub')"
-                  >{{ $t("chart.date_sub") }}(1990-01-01)</el-dropdown-item
-                >
-                <el-dropdown-item :command="beforeDatePattern('date_split')"
-                  >{{ $t("chart.date_split") }}(1990/01/01)</el-dropdown-item
-                >
+                <el-dropdown-item
+                  :command="beforeDatePattern('date_sub')"
+                >{{ $t('chart.date_sub') }}(1990-01-01)</el-dropdown-item>
+                <el-dropdown-item
+                  :command="beforeDatePattern('date_split')"
+                >{{ $t('chart.date_split') }}(1990/01/01)</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -259,22 +252,22 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-sort" />
-                  <span>{{ $t("chart.sort") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.sort) }})</span
-                  >
+                  <span>{{ $t('chart.sort') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.sort) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeSort('none')">{{
-                  $t("chart.none")
+                  $t('chart.none')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('asc')">{{
-                  $t("chart.asc")
+                  $t('chart.asc')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{
-                  $t("chart.desc")
+                  $t('chart.desc')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -284,7 +277,7 @@
             divided
             :command="beforeClickItem('remove')"
           >
-            <span>{{ $t("chart.delete") }}</span>
+            <span>{{ $t('chart.delete') }}</span>
           </el-dropdown-item>
         </el-dropdown-menu>
       </span>
@@ -294,94 +287,94 @@
 
 <script>
 export default {
-  name: "ChartDragItem",
+  name: 'ChartDragItem',
   props: {
     param: {
       type: Object,
-      required: true,
+      required: true
     },
     item: {
       type: Object,
-      required: true,
+      required: true
     },
     index: {
       type: Number,
-      required: true,
+      required: true
     },
     conf: {
       type: String,
-      required: true,
-    },
+      required: true
+    }
   },
   data() {
-    return {};
+    return {}
   },
   mounted() {},
   methods: {
     clickItem(param) {
       if (!param) {
-        return;
+        return
       }
       switch (param.type) {
-        case "remove":
-          this.removeItem();
-          break;
+        case 'remove':
+          this.removeItem()
+          break
         default:
-          break;
+          break
       }
     },
     beforeClickItem(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     sort(param) {
       // console.log(param)
-      this.item.sort = param.type;
-      this.$emit("onItemChange", this.item);
+      this.item.sort = param.type
+      this.$emit('onItemChange', this.item)
     },
     beforeSort(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     summary(param) {
       // console.log(param)
-      this.item.summary = param.type;
-      this.$emit("onItemChange", this.item);
+      this.item.summary = param.type
+      this.$emit('onItemChange', this.item)
     },
     beforeSummary(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     removeItem() {
-      this.item.index = this.index;
-      this.$emit("onItemRemove", this.item);
+      this.item.index = this.index
+      this.$emit('onItemRemove', this.item)
     },
 
     dateStyle(param) {
       // console.log(param)
-      this.item.dateStyle = param.type;
-      this.$emit("onItemChange", this.item);
+      this.item.dateStyle = param.type
+      this.$emit('onItemChange', this.item)
     },
     beforeDateStyle(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     datePattern(param) {
       // console.log(param)
-      this.item.datePattern = param.type;
-      this.$emit("onItemChange", this.item);
+      this.item.datePattern = param.type
+      this.$emit('onItemChange', this.item)
     },
     beforeDatePattern(type) {
       return {
-        type: type,
-      };
-    },
-  },
-};
+        type: type
+      }
+    }
+  }
+}
 </script>
 
 <style scoped>
diff --git a/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue b/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
index b2b2a81..dd1bb29 100644
--- a/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
+++ b/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
@@ -57,8 +57,7 @@
       <span
         v-if="chart.type !== 'table-info' && item.summary"
         class="summary-span"
-        >{{ $t("chart." + item.summary) }}</span
-      >
+      >{{ $t('chart.' + item.summary) }}</span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
       <span class="el-dropdown-link">
@@ -120,8 +119,7 @@
           <span
             v-if="chart.type !== 'table-info' && item.summary"
             class="summary-span"
-            >{{ $t("chart." + item.summary) }}</span
-          >
+          >{{ $t('chart.' + item.summary) }}</span>
           <i
             class="el-icon-arrow-down el-icon--right"
             style="position: absolute; top: 6px; right: 10px"
@@ -138,19 +136,19 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-s-data" />
-                  <span>{{ $t("chart.chart_type") }}</span>
+                  <span>{{ $t('chart.chart_type') }}</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeSwitch('bar')">{{
-                  $t("chart.chart_bar")
+                  $t('chart.chart_bar')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSwitch('line')">{{
-                  $t("chart.chart_line")
+                  $t('chart.chart_line')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSwitch('scatter')">{{
-                  $t("chart.chart_scatter")
+                  $t('chart.chart_scatter')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -168,10 +166,10 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-notebook-2" />
-                  <span>{{ $t("chart.summary") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.summary) }})</span
-                  >
+                  <span>{{ $t('chart.summary') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.summary) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -179,66 +177,59 @@
                 <el-dropdown-item
                   v-if="
                     item.id === 'count' ||
-                    item.deType === 0 ||
-                    item.deType === 1
+                      item.deType === 0 ||
+                      item.deType === 1
                   "
                   :command="beforeSummary('count')"
-                  >{{ $t("chart.count") }}</el-dropdown-item
-                >
+                >{{ $t('chart.count') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('sum')"
-                  >{{ $t("chart.sum") }}</el-dropdown-item
-                >
+                >{{ $t('chart.sum') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('avg')"
-                  >{{ $t("chart.avg") }}</el-dropdown-item
-                >
+                >{{ $t('chart.avg') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('max')"
-                  >{{ $t("chart.max") }}</el-dropdown-item
-                >
+                >{{ $t('chart.max') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('min')"
-                  >{{ $t("chart.min") }}</el-dropdown-item
-                >
+                >{{ $t('chart.min') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('stddev_pop')"
-                  >{{ $t("chart.stddev_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.stddev_pop') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('var_pop')"
-                  >{{ $t("chart.var_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.var_pop') }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -268,22 +259,22 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-sort" />
-                  <span>{{ $t("chart.sort") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.sort) }})</span
-                  >
+                  <span>{{ $t('chart.sort') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.sort) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeSort('none')">{{
-                  $t("chart.none")
+                  $t('chart.none')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('asc')">{{
-                  $t("chart.asc")
+                  $t('chart.asc')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{
-                  $t("chart.desc")
+                  $t('chart.desc')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -292,21 +283,21 @@
             icon="el-icon-files"
             :command="beforeClickItem('filter')"
           >
-            <span>{{ $t("chart.filter") }}...</span>
+            <span>{{ $t('chart.filter') }}...</span>
           </el-dropdown-item>
           <el-dropdown-item
             icon="el-icon-edit-outline"
             divided
             :command="beforeClickItem('rename')"
           >
-            <span>{{ $t("chart.show_name_set") }}</span>
+            <span>{{ $t('chart.show_name_set') }}</span>
           </el-dropdown-item>
           <el-dropdown-item
             icon="el-icon-delete"
             divided
             :command="beforeClickItem('remove')"
           >
-            <span>{{ $t("chart.delete") }}</span>
+            <span>{{ $t('chart.delete') }}</span>
           </el-dropdown-item>
         </el-dropdown-menu>
       </span>
@@ -316,110 +307,110 @@
 
 <script>
 export default {
-  name: "QuotaExtItem",
+  name: 'QuotaExtItem',
   props: {
     param: {
       type: Object,
-      required: true,
+      required: true
     },
     item: {
       type: Object,
-      required: true,
+      required: true
     },
     index: {
       type: Number,
-      required: true,
+      required: true
     },
     chart: {
       type: Object,
-      required: true,
-    },
+      required: true
+    }
   },
   data() {
-    return {};
+    return {}
   },
   mounted() {},
   methods: {
     clickItem(param) {
       if (!param) {
-        return;
+        return
       }
       switch (param.type) {
-        case "rename":
-          this.showRename();
-          break;
-        case "remove":
-          this.removeItem();
-          break;
-        case "filter":
-          this.editFilter();
-          break;
+        case 'rename':
+          this.showRename()
+          break
+        case 'remove':
+          this.removeItem()
+          break
+        case 'filter':
+          this.editFilter()
+          break
         default:
-          break;
+          break
       }
     },
     beforeClickItem(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     summary(param) {
       // console.log(param)
-      this.item.summary = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.summary = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSummary(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     switchChartType(param) {
       // console.log(param)
-      this.item.chartType = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.chartType = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSwitch(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     quickCalc(param) {},
     beforeQuickCalc(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     sort(param) {
       // console.log(param)
-      this.item.sort = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.sort = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSort(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     showRename() {
-      this.item.index = this.index;
-      this.item.renameType = "quotaExt";
-      this.$emit("onNameEdit", this.item);
+      this.item.index = this.index
+      this.item.renameType = 'quotaExt'
+      this.$emit('onNameEdit', this.item)
     },
     removeItem() {
-      this.item.index = this.index;
-      this.item.removeType = "quotaExt";
-      this.$emit("onQuotaItemRemove", this.item);
+      this.item.index = this.index
+      this.item.removeType = 'quotaExt'
+      this.$emit('onQuotaItemRemove', this.item)
     },
     editFilter() {
-      this.item.index = this.index;
-      this.item.filterType = "quotaExt";
-      this.$emit("editItemFilter", this.item);
-    },
-  },
-};
+      this.item.index = this.index
+      this.item.filterType = 'quotaExt'
+      this.$emit('editItemFilter', this.item)
+    }
+  }
+}
 </script>
 
 <style scoped>
diff --git a/frontend/src/views/chart/components/drag-item/QuotaItem.vue b/frontend/src/views/chart/components/drag-item/QuotaItem.vue
index 734c9c6..53909cd 100644
--- a/frontend/src/views/chart/components/drag-item/QuotaItem.vue
+++ b/frontend/src/views/chart/components/drag-item/QuotaItem.vue
@@ -57,8 +57,7 @@
       <span
         v-if="chart.type !== 'table-info' && item.summary"
         class="summary-span"
-        >{{ $t("chart." + item.summary) }}</span
-      >
+      >{{ $t('chart.' + item.summary) }}</span>
     </el-tag>
     <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
       <span class="el-dropdown-link">
@@ -120,8 +119,7 @@
           <span
             v-if="chart.type !== 'table-info' && item.summary"
             class="summary-span"
-            >{{ $t("chart." + item.summary) }}</span
-          >
+          >{{ $t('chart.' + item.summary) }}</span>
           <i
             class="el-icon-arrow-down el-icon--right"
             style="position: absolute; top: 6px; right: 10px"
@@ -138,19 +136,19 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-s-data" />
-                  <span>{{ $t("chart.chart_type") }}</span>
+                  <span>{{ $t('chart.chart_type') }}</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeSwitch('bar')">{{
-                  $t("chart.chart_bar")
+                  $t('chart.chart_bar')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSwitch('line')">{{
-                  $t("chart.chart_line")
+                  $t('chart.chart_line')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSwitch('scatter')">{{
-                  $t("chart.chart_scatter")
+                  $t('chart.chart_scatter')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -168,10 +166,10 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-notebook-2" />
-                  <span>{{ $t("chart.summary") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.summary) }})</span
-                  >
+                  <span>{{ $t('chart.summary') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.summary) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
@@ -179,66 +177,67 @@
                 <el-dropdown-item
                   v-if="
                     item.id === 'count' ||
-                    item.deType === 0 ||
-                    item.deType === 1
+                      item.deType === 0 ||
+                      item.deType === 1
                   "
                   :command="beforeSummary('count')"
-                  >{{ $t("chart.count") }}</el-dropdown-item
-                >
+                >{{ $t('chart.count') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('sum')"
-                  >{{ $t("chart.sum") }}</el-dropdown-item
-                >
+                >{{ $t('chart.sum') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('avg')"
-                  >{{ $t("chart.avg") }}</el-dropdown-item
-                >
+                >{{ $t('chart.avg') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('max')"
-                  >{{ $t("chart.max") }}</el-dropdown-item
-                >
+                >{{ $t('chart.max') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('min')"
-                  >{{ $t("chart.min") }}</el-dropdown-item
-                >
+                >{{ $t('chart.min') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('stddev_pop')"
-                  >{{ $t("chart.stddev_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.stddev_pop') }}</el-dropdown-item>
                 <el-dropdown-item
                   v-if="
                     item.id !== 'count' &&
-                    item.deType !== 0 &&
-                    item.deType !== 1
+                      item.deType !== 0 &&
+                      item.deType !== 1
                   "
                   :command="beforeSummary('var_pop')"
-                  >{{ $t("chart.var_pop") }}</el-dropdown-item
-                >
+                >{{ $t('chart.var_pop') }}</el-dropdown-item>
+                <el-dropdown-item
+                  v-if="
+                    item.id !== 'count' &&
+                      item.deType !== 0 &&
+                      item.deType !== 1
+                  "
+                  :command="beforeSummary('ratio')"
+                >{{ $t('chart.ratio') }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -268,22 +267,22 @@
               <span class="el-dropdown-link inner-dropdown-menu">
                 <span>
                   <i class="el-icon-sort" />
-                  <span>{{ $t("chart.sort") }}</span>
-                  <span class="summary-span-item"
-                    >({{ $t("chart." + item.sort) }})</span
-                  >
+                  <span>{{ $t('chart.sort') }}</span>
+                  <span
+                    class="summary-span-item"
+                  >({{ $t('chart.' + item.sort) }})</span>
                 </span>
                 <i class="el-icon-arrow-right el-icon--right" />
               </span>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item :command="beforeSort('none')">{{
-                  $t("chart.none")
+                  $t('chart.none')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('asc')">{{
-                  $t("chart.asc")
+                  $t('chart.asc')
                 }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{
-                  $t("chart.desc")
+                  $t('chart.desc')
                 }}</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -292,21 +291,21 @@
             icon="el-icon-files"
             :command="beforeClickItem('filter')"
           >
-            <span>{{ $t("chart.filter") }}...</span>
+            <span>{{ $t('chart.filter') }}...</span>
           </el-dropdown-item>
           <el-dropdown-item
             icon="el-icon-edit-outline"
             divided
             :command="beforeClickItem('rename')"
           >
-            <span>{{ $t("chart.show_name_set") }}</span>
+            <span>{{ $t('chart.show_name_set') }}</span>
           </el-dropdown-item>
           <el-dropdown-item
             icon="el-icon-delete"
             divided
             :command="beforeClickItem('remove')"
           >
-            <span>{{ $t("chart.delete") }}</span>
+            <span>{{ $t('chart.delete') }}</span>
           </el-dropdown-item>
         </el-dropdown-menu>
       </span>
@@ -316,109 +315,109 @@
 
 <script>
 export default {
-  name: "QuotaItem",
+  name: 'QuotaItem',
   props: {
     param: {
       type: Object,
-      required: true,
+      required: true
     },
     item: {
       type: Object,
-      required: true,
+      required: true
     },
     index: {
       type: Number,
-      required: true,
+      required: true
     },
     chart: {
       type: Object,
-      required: true,
-    },
+      required: true
+    }
   },
   data() {
-    return {};
+    return {}
   },
   mounted() {},
   methods: {
     clickItem(param) {
       if (!param) {
-        return;
+        return
       }
       switch (param.type) {
-        case "rename":
-          this.showRename();
-          break;
-        case "remove":
-          this.removeItem();
-          break;
-        case "filter":
-          this.editFilter();
-          break;
+        case 'rename':
+          this.showRename()
+          break
+        case 'remove':
+          this.removeItem()
+          break
+        case 'filter':
+          this.editFilter()
+          break
         default:
-          break;
+          break
       }
     },
     beforeClickItem(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     summary(param) {
-      this.item.summary = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.summary = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSummary(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     switchChartType(param) {
       // console.log(param)
-      this.item.chartType = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.chartType = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSwitch(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     quickCalc(param) {},
     beforeQuickCalc(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
 
     sort(param) {
       // console.log(param)
-      this.item.sort = param.type;
-      this.$emit("onQuotaItemChange", this.item);
+      this.item.sort = param.type
+      this.$emit('onQuotaItemChange', this.item)
     },
     beforeSort(type) {
       return {
-        type: type,
-      };
+        type: type
+      }
     },
     showRename() {
-      this.item.index = this.index;
-      this.item.renameType = "quota";
-      this.$emit("onNameEdit", this.item);
+      this.item.index = this.index
+      this.item.renameType = 'quota'
+      this.$emit('onNameEdit', this.item)
     },
     removeItem() {
-      this.item.index = this.index;
-      this.item.removeType = "quota";
-      this.$emit("onQuotaItemRemove", this.item);
+      this.item.index = this.index
+      this.item.removeType = 'quota'
+      this.$emit('onQuotaItemRemove', this.item)
     },
     editFilter() {
-      this.item.index = this.index;
-      this.item.filterType = "quota";
-      this.$emit("editItemFilter", this.item);
-    },
-  },
-};
+      this.item.index = this.index
+      this.item.filterType = 'quota'
+      this.$emit('editItemFilter', this.item)
+    }
+  }
+}
 </script>
 
 <style scoped>
diff --git a/frontend/src/views/system/datasource/form.vue b/frontend/src/views/system/datasource/form.vue
index 453b9cf..aedce1e 100644
--- a/frontend/src/views/system/datasource/form.vue
+++ b/frontend/src/views/system/datasource/form.vue
@@ -8,14 +8,14 @@
       <el-icon name="back" class="back-button" @click.native="backToList" />
       {{
         params &&
-        params.id &&
-        params.showModel &&
-        params.showModel === "show" &&
-        !canEdit
-          ? $t("datasource.show_info")
-          : formType == "add"
-          ? $t("datasource.create")
-          : $t("datasource.modify")
+          params.id &&
+          params.showModel &&
+          params.showModel === 'show' &&
+          !canEdit
+          ? $t('datasource.show_info')
+          : formType == 'add'
+            ? $t('datasource.create')
+            : $t('datasource.modify')
       }}
     </template>
     <div>
@@ -28,10 +28,10 @@
             size="small"
             :disabled="
               params &&
-              params.id &&
-              params.showModel &&
-              params.showModel === 'show' &&
-              !canEdit
+                params.id &&
+                params.showModel &&
+                params.showModel === 'show' &&
+                !canEdit
             "
             label-width="auto"
             label-position="right"
@@ -49,7 +49,7 @@
                 class="select-width"
                 :disabled="
                   formType == 'modify' ||
-                  (formType === 'add' && params && !!params.type)
+                    (formType === 'add' && params && !!params.type)
                 "
                 @change="changeType()"
               >
@@ -99,13 +99,11 @@
               <el-radio
                 v-model="form.configuration.connectionType"
                 label="sid"
-                >{{ $t("datasource.oracle_sid") }}</el-radio
-              >
+              >{{ $t('datasource.oracle_sid') }}</el-radio>
               <el-radio
                 v-model="form.configuration.connectionType"
                 label="serviceName"
-                >{{ $t("datasource.oracle_service_name") }}</el-radio
-              >
+              >{{ $t('datasource.oracle_service_name') }}</el-radio>
             </el-form-item>
 
             <el-form-item
@@ -152,7 +150,7 @@
             <el-form-item
               v-if="
                 form.configuration.dataSourceType == 'jdbc' &&
-                form.type !== 'oracle'
+                  form.type !== 'oracle'
               "
               :label="$t('datasource.extra_params')"
             >
@@ -177,20 +175,20 @@
             <el-form-item
               v-if="
                 form.type == 'oracle' ||
-                form.type == 'sqlServer' ||
-                form.type == 'pg'
+                  form.type == 'sqlServer' ||
+                  form.type == 'pg'
               "
             >
               <el-button icon="el-icon-plus" size="mini" @click="getSchema()">
-                {{ $t("datasource.get_schema") }}
+                {{ $t('datasource.get_schema') }}
               </el-button>
             </el-form-item>
 
             <el-form-item
               v-if="
                 form.type == 'oracle' ||
-                form.type == 'sqlServer' ||
-                form.type == 'pg'
+                  form.type == 'sqlServer' ||
+                  form.type == 'pg'
               "
               :label="$t('datasource.schema')"
             >
@@ -298,11 +296,9 @@
                   :label="$t('datasource.table_name')"
                 >
                   <template slot-scope="scope">
-                    <span
-                      ><i class="el-icon-coin" />&nbsp;&nbsp;{{
-                        scope.row
-                      }}</span
-                    >
+                    <span><i class="el-icon-coin" />&nbsp;&nbsp;{{
+                      scope.row
+                    }}</span>
                   </template>
                 </el-table-column>
               </el-table>
@@ -334,8 +330,8 @@
                       <span
                         v-if="
                           scope.row.fieldType.indexOf('CHAR') >= 0 ||
-                          scope.row.fieldType.indexOf('TEXT') >= 0 ||
-                          scope.row.fieldType.indexOf('BLOB') >= 0
+                            scope.row.fieldType.indexOf('TEXT') >= 0 ||
+                            scope.row.fieldType.indexOf('BLOB') >= 0
                         "
                       >
                         <svg-icon
@@ -343,13 +339,13 @@
                           class="field-icon-text"
                         />
                         <span class="field-class">{{
-                          $t("dataset.text")
+                          $t('dataset.text')
                         }}</span>
                       </span>
                       <span
                         v-if="
                           scope.row.fieldType.indexOf('DATE') >= 0 ||
-                          scope.row.fieldType.indexOf('TIME') >= 0
+                            scope.row.fieldType.indexOf('TIME') >= 0
                         "
                       >
                         <svg-icon
@@ -357,15 +353,15 @@
                           class="field-icon-time"
                         />
                         <span class="field-class">{{
-                          $t("dataset.time")
+                          $t('dataset.time')
                         }}</span>
                       </span>
                       <span
                         v-if="
                           scope.row.fieldType.indexOf('INT') >= 0 ||
-                          scope.row.fieldType.indexOf('FLOAT') >= 0 ||
-                          scope.row.fieldType.indexOf('DOUBLE') >= 0 ||
-                          scope.row.fieldType.indexOf('DECIMAL') >= 0
+                            scope.row.fieldType.indexOf('FLOAT') >= 0 ||
+                            scope.row.fieldType.indexOf('DOUBLE') >= 0 ||
+                            scope.row.fieldType.indexOf('DECIMAL') >= 0
                         "
                       >
                         <svg-icon
@@ -373,17 +369,16 @@
                           class="field-icon-value"
                         />
                         <span class="field-class">{{
-                          $t("dataset.value")
+                          $t('dataset.value')
                         }}</span>
                         <span
                           v-if="
                             scope.row.fieldType.indexOf('FLOAT') >= 0 ||
-                            scope.row.fieldType.indexOf('DOUBLE') >= 0 ||
-                            scope.row.fieldType.indexOf('DECIMAL') >= 0
+                              scope.row.fieldType.indexOf('DOUBLE') >= 0 ||
+                              scope.row.fieldType.indexOf('DECIMAL') >= 0
                           "
                           class="field-class"
-                          >{{ "(" + $t("dataset.float") + ")" }}</span
-                        >
+                        >{{ '(' + $t('dataset.float') + ')' }}</span>
                       </span>
                       <span>({{ scope.row.fieldType }})</span>
                     </span>
@@ -423,8 +418,7 @@
                 : hasDataPermission('manage', params.privileges)
             "
             @click="validaDatasource"
-            >{{ $t("commons.validate") }}</el-button
-          >
+          >{{ $t('commons.validate') }}</el-button>
           <el-button
             v-if="
               formType === 'add'
@@ -433,8 +427,7 @@
             "
             type="primary"
             @click="save"
-            >{{ $t("commons.save") }}</el-button
-          >
+          >{{ $t('commons.save') }}</el-button>
         </div>
         <div v-else slot="footer" class="dialog-footer">
           <el-button
@@ -444,8 +437,7 @@
                 : hasDataPermission('manage', params.privileges)
             "
             @click="validaDatasource"
-            >{{ $t("commons.validate") }}</el-button
-          >
+          >{{ $t('commons.validate') }}</el-button>
           <el-button
             v-if="
               formType === 'add'
@@ -454,8 +446,7 @@
             "
             type="primary"
             @click="changeEdit"
-            >{{ $t("commons.edit") }}</el-button
-          >
+          >{{ $t('commons.edit') }}</el-button>
         </div>
       </div>
     </div>
@@ -463,168 +454,168 @@
 </template>
 
 <script>
-import LayoutContent from "@/components/business/LayoutContent";
-import { post } from "@/api/dataset/dataset";
+import LayoutContent from '@/components/business/LayoutContent'
+import { post } from '@/api/dataset/dataset'
 import {
   addDs,
   editDs,
   getSchema,
   validateDs,
-  validateDsById,
-} from "@/api/system/datasource";
-import { $confirm } from "@/utils/message";
+  validateDsById
+} from '@/api/system/datasource'
+import { $confirm } from '@/utils/message'
 
 export default {
-  name: "DsForm",
+  name: 'DsForm',
   components: { LayoutContent },
   props: {
     params: {
       type: Object,
-      default: null,
-    },
+      default: null
+    }
   },
   data() {
     return {
       form: {
         configuration: {
           initialPoolSize: 5,
-          extraParams: "",
+          extraParams: '',
           minPoolSize: 5,
           maxPoolSize: 50,
           maxIdleTime: 30,
           acquireIncrement: 5,
           idleConnectionTestPeriod: 5,
-          connectTimeout: 5,
-        },
+          connectTimeout: 5
+        }
       },
       rule: {
         name: [
           {
             required: true,
-            message: this.$t("datasource.input_name"),
-            trigger: "blur",
+            message: this.$t('datasource.input_name'),
+            trigger: 'blur'
           },
           {
             min: 2,
             max: 25,
-            message: this.$t("datasource.input_limit_2_25", [2, 25]),
-            trigger: "blur",
-          },
+            message: this.$t('datasource.input_limit_2_25', [2, 25]),
+            trigger: 'blur'
+          }
         ],
         desc: [
           {
             min: 0,
             max: 50,
-            message: this.$t("datasource.input_limit_0_50"),
-            trigger: "blur",
-          },
+            message: this.$t('datasource.input_limit_0_50'),
+            trigger: 'blur'
+          }
         ],
         type: [
           {
             required: true,
-            message: this.$t("datasource.please_choose_type"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_choose_type'),
+            trigger: 'change'
+          }
         ],
-        "configuration.dataBase": [
+        'configuration.dataBase': [
           {
             required: true,
-            message: this.$t("datasource.please_input_data_base"),
-            trigger: "blur",
-          },
+            message: this.$t('datasource.please_input_data_base'),
+            trigger: 'blur'
+          }
         ],
-        "configuration.connectionType": [
+        'configuration.connectionType': [
           {
             required: true,
-            message: this.$t("datasource.please_select_oracle_type"),
-            trigger: "blur",
-          },
+            message: this.$t('datasource.please_select_oracle_type'),
+            trigger: 'blur'
+          }
         ],
-        "configuration.username": [
+        'configuration.username': [
           {
             required: true,
-            message: this.$t("datasource.please_input_user_name"),
-            trigger: "blur",
-          },
+            message: this.$t('datasource.please_input_user_name'),
+            trigger: 'blur'
+          }
         ],
-        "configuration.password": [
+        'configuration.password': [
           {
             required: true,
-            message: this.$t("datasource.please_input_password"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_password'),
+            trigger: 'change'
+          }
         ],
-        "configuration.host": [
+        'configuration.host': [
           {
             required: true,
-            message: this.$t("datasource.please_input_host"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_host'),
+            trigger: 'change'
+          }
         ],
-        "configuration.url": [
+        'configuration.url': [
           {
             required: true,
-            message: this.$t("datasource.please_input_url"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_url'),
+            trigger: 'change'
+          }
         ],
-        "configuration.port": [
+        'configuration.port': [
           {
             required: true,
-            message: this.$t("datasource.please_input_port"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_port'),
+            trigger: 'change'
+          }
         ],
-        "configuration.initialPoolSize": [
+        'configuration.initialPoolSize': [
           {
             required: true,
-            message: this.$t("datasource.please_input_initial_pool_size"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_initial_pool_size'),
+            trigger: 'change'
+          }
         ],
-        "configuration.minPoolSize": [
+        'configuration.minPoolSize': [
           {
             required: true,
-            message: this.$t("datasource.please_input_min_pool_size"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_min_pool_size'),
+            trigger: 'change'
+          }
         ],
-        "configuration.maxPoolSize": [
+        'configuration.maxPoolSize': [
           {
             required: true,
-            message: this.$t("datasource.please_input_max_pool_size"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_max_pool_size'),
+            trigger: 'change'
+          }
         ],
-        "configuration.maxIdleTime": [
+        'configuration.maxIdleTime': [
           {
             required: true,
-            message: this.$t("datasource.please_input_max_idle_time"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_max_idle_time'),
+            trigger: 'change'
+          }
         ],
-        "configuration.acquireIncrement": [
+        'configuration.acquireIncrement': [
           {
             required: true,
-            message: this.$t("datasource.please_input_acquire_increment"),
-            trigger: "change",
-          },
+            message: this.$t('datasource.please_input_acquire_increment'),
+            trigger: 'change'
+          }
         ],
-        "configuration.connectTimeout": [
+        'configuration.connectTimeout': [
           {
             required: true,
-            message: this.$t("datasource.please_input_connect_timeout"),
-            trigger: "change",
-          },
-        ],
+            message: this.$t('datasource.please_input_connect_timeout'),
+            trigger: 'change'
+          }
+        ]
       },
       allTypes: [
         {
-          name: "mysql",
-          label: "MySQL",
-          type: "jdbc",
+          name: 'mysql',
+          label: 'MySQL',
+          type: 'jdbc',
           extraParams:
-            "characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true",
+            'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true'
         },
         // { name: 'oracle', label: 'Oracle', type: 'jdbc'},
         // { name: 'pg', label: 'PostgreSQL', type: 'jdbc', extraParams: '' },
@@ -632,18 +623,18 @@ export default {
         // { name: 'ds_doris', label: 'Doris', type: 'jdbc', extraParams: 'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true' },
         // { name: 'ck', label: 'ClickHouse', type: 'jdbc', extraParams: '' }
         {
-          name: "mariadb",
-          label: "MariaDB",
-          type: "jdbc",
+          name: 'mariadb',
+          label: 'MariaDB',
+          type: 'jdbc',
           extraParams:
-            "characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true",
+            'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true'
         },
         {
-          name: "sqlServer",
-          label: "SQL Server",
-          type: "jdbc",
-          extraParams: "",
-        },
+          name: 'sqlServer',
+          label: 'SQL Server',
+          type: 'jdbc',
+          extraParams: ''
+        }
       ],
       schemas: [],
       canEdit: false,
@@ -654,100 +645,100 @@ export default {
       tableLoading: false,
       tableFields: [],
       showTableFields: false,
-      dataList: [],
-    };
+      dataList: []
+    }
   },
   watch: {
     form: {
       handler(val, old) {
         if (val.id) {
-          const _this = this;
-          post("/datasource/getTables", { id: val.id }).then((response) => {
-            _this.tables = response.data;
-            _this.tableData = [];
+          const _this = this
+          post('/datasource/getTables', { id: val.id }).then((response) => {
+            _this.tables = response.data
+            _this.tableData = []
             _this.tables.forEach((item) => {
-              _this.tableData.push(item.name);
-            });
-            _this.showTableList = _this.tableData.length > 0;
-          });
+              _this.tableData.push(item.name)
+            })
+            _this.showTableList = _this.tableData.length > 0
+          })
         }
       },
-      deep: true,
-    },
+      deep: true
+    }
   },
   created() {
     if (this.params && this.params.id) {
-      const row = this.params;
-      this.edit(row);
+      const row = this.params
+      this.edit(row)
     } else {
-      this.create();
+      this.create()
       if (this.params && this.params.type) {
-        this.setType();
+        this.setType()
       }
     }
   },
   mounted() {},
   methods: {
     handleCurrentChange(row) {
-      const _this = this;
-      const ds = JSON.parse(JSON.stringify(this.form));
-      ds.configuration = JSON.stringify(ds.configuration);
-      this.tableLoading = true;
-      post("/datasource/getData/" + row + "/10", ds)
+      const _this = this
+      const ds = JSON.parse(JSON.stringify(this.form))
+      ds.configuration = JSON.stringify(ds.configuration)
+      this.tableLoading = true
+      post('/datasource/getData/' + row + '/10', ds)
         .then((response) => {
-          _this.tableFields = response.data.fieldList;
-          _this.showTableFields = _this.tableFields.length > 0;
-          _this.dataList = response.data.dataList;
+          _this.tableFields = response.data.fieldList
+          _this.showTableFields = _this.tableFields.length > 0
+          _this.dataList = response.data.dataList
         })
         .finally((_) => {
-          this.tableLoading = false;
-        });
+          this.tableLoading = false
+        })
     },
     setType() {
-      this.form.type = this.params.type;
+      this.form.type = this.params.type
       this.form.configuration = {
         initialPoolSize: 5,
-        extraParams: "",
+        extraParams: '',
         minPoolSize: 5,
         maxPoolSize: 50,
         maxIdleTime: 30,
         acquireIncrement: 5,
         idleConnectionTestPeriod: 5,
-        connectTimeout: 5,
-      };
-      this.changeType();
+        connectTimeout: 5
+      }
+      this.changeType()
     },
     changeEdit() {
-      this.canEdit = true;
-      this.formType = "modify";
+      this.canEdit = true
+      this.formType = 'modify'
     },
     create() {
-      this.formType = "add";
-      this.canEdit = true;
+      this.formType = 'add'
+      this.canEdit = true
     },
     edit(row) {
-      this.formType = "modify";
-      this.form = Object.assign({}, row);
-      this.originConfiguration = this.form.configuration;
-      this.form.configuration = JSON.parse(this.form.configuration);
+      this.formType = 'modify'
+      this.form = Object.assign({}, row)
+      this.originConfiguration = this.form.configuration
+      this.form.configuration = JSON.parse(this.form.configuration)
     },
     reset() {
-      this.$refs.dsForm.resetFields();
+      this.$refs.dsForm.resetFields()
     },
     save() {
       if (
         !this.form.configuration.schema &&
-        (this.form.type === "oracle" || this.form.type === "sqlServer")
+        (this.form.type === 'oracle' || this.form.type === 'sqlServer')
       ) {
-        this.$message.error(this.$t("datasource.please_choose_schema"));
-        return;
+        this.$message.error(this.$t('datasource.please_choose_schema'))
+        return
       }
       if (
-        this.form.configuration.dataSourceType === "jdbc" &&
+        this.form.configuration.dataSourceType === 'jdbc' &&
         this.form.configuration.port <= 0
       ) {
-        this.$message.error(this.$t("datasource.port_no_less_then_0"));
-        return;
+        this.$message.error(this.$t('datasource.port_no_less_then_0'))
+        return
       }
       if (
         this.form.configuration.initialPoolSize < 0 ||
@@ -758,118 +749,118 @@ export default {
         this.form.configuration.idleConnectionTestPeriod < 0 ||
         this.form.configuration.connectTimeout < 0
       ) {
-        this.$message.error(this.$t("datasource.no_less_then_0"));
-        return;
+        this.$message.error(this.$t('datasource.no_less_then_0'))
+        return
       }
       this.$refs.dsForm.validate((valid) => {
         if (valid) {
-          const method = this.formType === "add" ? addDs : editDs;
-          const form = JSON.parse(JSON.stringify(this.form));
-          form.configuration = JSON.stringify(form.configuration);
+          const method = this.formType === 'add' ? addDs : editDs
+          const form = JSON.parse(JSON.stringify(this.form))
+          form.configuration = JSON.stringify(form.configuration)
           if (
-            this.formType !== "add" &&
+            this.formType !== 'add' &&
             this.originConfiguration !== form.configuration
           ) {
-            $confirm(this.$t("datasource.edit_datasource_msg"), () => {
+            $confirm(this.$t('datasource.edit_datasource_msg'), () => {
               method(form).then((res) => {
-                this.$success(this.$t("commons.save_success"));
-                this.refreshTree();
-                this.backToList();
-              });
-            });
+                this.$success(this.$t('commons.save_success'))
+                this.refreshTree()
+                this.backToList()
+              })
+            })
           } else {
             method(form).then((res) => {
-              this.$success(this.$t("commons.save_success"));
-              this.refreshTree();
-              this.backToList();
-            });
+              this.$success(this.$t('commons.save_success'))
+              this.refreshTree()
+              this.backToList()
+            })
           }
         } else {
-          return false;
+          return false
         }
-      });
+      })
     },
     getSchema() {
       this.$refs.dsForm.validate((valid) => {
         if (valid) {
-          const data = JSON.parse(JSON.stringify(this.form));
-          data.configuration = JSON.stringify(data.configuration);
+          const data = JSON.parse(JSON.stringify(this.form))
+          data.configuration = JSON.stringify(data.configuration)
           getSchema(data).then((res) => {
-            this.schemas = res.data;
-            this.$success(this.$t("commons.success"));
-          });
+            this.schemas = res.data
+            this.$success(this.$t('commons.success'))
+          })
         } else {
-          return false;
+          return false
         }
-      });
+      })
     },
     validaDatasource() {
-      if (!this.form.configuration.schema && this.form.type === "oracle") {
-        this.$message.error(this.$t("datasource.please_choose_schema"));
-        return;
+      if (!this.form.configuration.schema && this.form.type === 'oracle') {
+        this.$message.error(this.$t('datasource.please_choose_schema'))
+        return
       }
       if (
-        this.form.configuration.dataSourceType === "jdbc" &&
+        this.form.configuration.dataSourceType === 'jdbc' &&
         this.form.configuration.port <= 0
       ) {
-        this.$message.error(this.$t("datasource.port_no_less_then_0"));
-        return;
+        this.$message.error(this.$t('datasource.port_no_less_then_0'))
+        return
       }
       this.$refs.dsForm.validate((valid) => {
         if (valid) {
-          const data = JSON.parse(JSON.stringify(this.form));
-          data.configuration = JSON.stringify(data.configuration);
-          if (data.showModel === "show" && !this.canEdit) {
+          const data = JSON.parse(JSON.stringify(this.form))
+          data.configuration = JSON.stringify(data.configuration)
+          if (data.showModel === 'show' && !this.canEdit) {
             validateDsById(data.id)
               .then((res) => {
                 if (res.success) {
-                  this.$success(this.$t("datasource.validate_success"));
+                  this.$success(this.$t('datasource.validate_success'))
                 } else {
-                  this.$error(this.$t(res.message));
+                  this.$error(this.$t(res.message))
                 }
-                this.refreshTree();
+                this.refreshTree()
               })
               .catch((res) => {
-                this.$error(res.message);
-              });
+                this.$error(res.message)
+              })
           } else {
             validateDs(data)
               .then((res) => {
                 if (res.success) {
-                  this.tableData = res.data;
-                  console.log(this.tableData);
-                  this.showTableList = true;
-                  this.$success(this.$t("datasource.validate_success"));
+                  this.tableData = res.data
+                  console.log(this.tableData)
+                  this.showTableList = true
+                  this.$success(this.$t('datasource.validate_success'))
                 } else {
-                  this.$error(this.$t(res.message));
+                  this.$error(this.$t(res.message))
                 }
               })
               .catch((res) => {
-                this.$error(res.message);
-              });
+                this.$error(res.message)
+              })
           }
         } else {
-          return false;
+          return false
         }
-      });
+      })
     },
     changeType() {
       for (let i = 0; i < this.allTypes.length; i++) {
         if (this.allTypes[i].name === this.form.type) {
-          this.form.configuration.dataSourceType = this.allTypes[i].type;
-          this.form.configuration.extraParams = this.allTypes[i].extraParams;
+          this.form.configuration.dataSourceType = this.allTypes[i].type
+          this.form.configuration.extraParams = this.allTypes[i].extraParams
         }
       }
     },
     backToList() {
-      this.$emit("switch-component", {});
+      this.$emit('switch-component', {})
       // this.$router.push({ name: 'datasource' })
     },
     refreshTree() {
-      this.$emit("refresh-left-tree");
-    },
-  },
-};
+      this.$emit('refresh-left-tree')
+    }
+  }
+}
 </script>
 <style lang="scss" scoped>
 .back-button {
diff --git a/plugins/plugin-interface/src/main/java/com/ipsos/plugins/xpack/auth/service/impl/AuthXpackDefaultService.java b/plugins/plugin-interface/src/main/java/com/ipsos/plugins/xpack/auth/service/impl/AuthXpackDefaultService.java
new file mode 100644
index 0000000..0fcd547
--- /dev/null
+++ b/plugins/plugin-interface/src/main/java/com/ipsos/plugins/xpack/auth/service/impl/AuthXpackDefaultService.java
@@ -0,0 +1,2 @@
+package com.ipsos.plugins.xpack.auth.service.impl;public class AuthXpackDefaultService {
+}