diff --git a/.gitignore b/.gitignore
index 677be40..ef2dbaf 100644
--- a/.gitignore
+++ b/.gitignore
@@ -57,5 +57,6 @@ pnpm-debug.log*
 
 package-lock.json
 
+../conf/data/ehcache
+../data
 
-conf/data/ehcache
\ No newline at end of file
diff --git a/backend/src/main/java/com/ipsos/datasource/controller/DatasourceController.java b/backend/src/main/java/com/ipsos/datasource/controller/DatasourceController.java
index b539835..ac61d7b 100644
--- a/backend/src/main/java/com/ipsos/datasource/controller/DatasourceController.java
+++ b/backend/src/main/java/com/ipsos/datasource/controller/DatasourceController.java
@@ -4,6 +4,7 @@ import com.github.pagehelper.Page;
 import com.github.pagehelper.PageHelper;
 import com.github.xiaoymin.knife4j.annotations.ApiSupport;
 import com.ipsos.base.domain.Datasource;
+import com.ipsos.datasource.dto.TableFiled;
 import com.ipsos.dto.DatasourceDTO;
 import com.ipsos.commons.utils.AuthUtils;
 import com.ipsos.commons.utils.PageUtils;
@@ -20,6 +21,7 @@ import springfox.documentation.annotations.ApiIgnore;
 
 import javax.annotation.Resource;
 import java.util.List;
+import java.util.Map;
 
 @Api(tags = "数据源：数据源管理")
 @ApiSupport(order = 30)
@@ -83,6 +85,18 @@ public class DatasourceController {
         return datasourceService.getTables(datasource);
     }
 
+    @ApiOperation("查询表字段")
+    @PostMapping("/getFields/{tableName}")
+    public List<TableFiled> getFields(@RequestBody Datasource datasource, @PathVariable String tableName) throws Exception {
+        return datasourceService.getFields(datasource, tableName);
+    }
+
+    @ApiOperation("查询表字段")
+    @PostMapping("/getData/{tableName}/{fetchSize}")
+    public Map<String, List> getData(@RequestBody Datasource datasource, @PathVariable String tableName, @PathVariable Integer fetchSize) throws Exception {
+        return datasourceService.getDataByDatasource(datasource, tableName, fetchSize);
+    }
+
     @ApiIgnore
     @PostMapping("/getSchema")
     public List<String> getSchema(@RequestBody Datasource datasource) throws Exception {
diff --git a/backend/src/main/java/com/ipsos/datasource/service/DatasourceService.java b/backend/src/main/java/com/ipsos/datasource/service/DatasourceService.java
index 18752a9..ee298dd 100644
--- a/backend/src/main/java/com/ipsos/datasource/service/DatasourceService.java
+++ b/backend/src/main/java/com/ipsos/datasource/service/DatasourceService.java
@@ -30,6 +30,7 @@ import com.ipsos.datasource.dto.*;
 import com.ipsos.datasource.request.DatasourceRequest;
 import com.ipsos.exception.DataEaseException;
 import com.ipsos.i18n.Translator;
+import com.ipsos.provider.QueryProvider;
 import com.ipsos.service.dataset.DataSetGroupService;
 import com.ipsos.service.message.DeMsgutil;
 
@@ -96,30 +97,31 @@ public class DatasourceService {
         List<DatasourceDTO> datasourceDTOS = extDataSourceMapper.queryUnion(request);
         datasourceDTOS.forEach(datasourceDTO -> {
             DatasourceTypes datasourceType = DatasourceTypes.valueOf(datasourceDTO.getType());
-            try{
+            try {
                 switch (datasourceType) {
                     case mysql:
                     case mariadb:
                     case de_doris:
                     case ds_doris:
-                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), MysqlConfiguration.class)) );
+                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), MysqlConfiguration.class)));
                         break;
                     case sqlServer:
-                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), SqlServerConfiguration.class)) );
+                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), SqlServerConfiguration.class)));
                         break;
                     case oracle:
-                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), OracleConfiguration.class)) );
+                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), OracleConfiguration.class)));
                         break;
                     case pg:
-                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), PgConfiguration.class)) );
+                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), PgConfiguration.class)));
                         break;
                     case ck:
-                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), CHConfiguration.class)) );
+                        datasourceDTO.setConfiguration(JSONObject.toJSONString(new Gson().fromJson(datasourceDTO.getConfiguration(), CHConfiguration.class)));
                         break;
                     default:
                         break;
                 }
-            }catch (Exception ignore){}
+            } catch (Exception ignore) {
+            }
 
         });
         return datasourceDTOS;
@@ -143,8 +145,8 @@ public class DatasourceService {
         DatasetTableExample example = new DatasetTableExample();
         example.createCriteria().andDataSourceIdEqualTo(datasourceId);
         List<DatasetTable> datasetTables = datasetTableMapper.selectByExample(example);
-        if(CollectionUtils.isNotEmpty(datasetTables)){
-            DataEaseException.throwException(datasetTables.size() +  Translator.get("i18n_datasource_not_allow_delete_msg"));
+        if (CollectionUtils.isNotEmpty(datasetTables)) {
+            DataEaseException.throwException(datasetTables.size() + Translator.get("i18n_datasource_not_allow_delete_msg"));
         }
         Datasource datasource = datasourceMapper.selectByPrimaryKey(datasourceId);
         datasourceMapper.deleteByPrimaryKey(datasourceId);
@@ -166,8 +168,8 @@ public class DatasourceService {
             DatasourceRequest datasourceRequest = new DatasourceRequest();
             datasourceRequest.setDatasource(datasource);
             datasourceProvider.checkStatus(datasourceRequest);
-            return ResultHolder.success("Success");
-        }catch (Exception e){
+            return ResultHolder.success(datasourceProvider.getTables(datasourceRequest));
+        } catch (Exception e) {
             return ResultHolder.error("Datasource is invalid: " + e.getMessage());
         }
 
@@ -175,8 +177,8 @@ public class DatasourceService {
 
     public ResultHolder validate(String datasourceId) {
         Datasource datasource = datasourceMapper.selectByPrimaryKey(datasourceId);
-        if(datasource == null){
-            return ResultHolder.error("Can not find datasource: "+ datasourceId);
+        if (datasource == null) {
+            return ResultHolder.error("Can not find datasource: " + datasourceId);
         }
         try {
             DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
@@ -184,11 +186,11 @@ public class DatasourceService {
             datasourceRequest.setDatasource(datasource);
             datasourceProvider.checkStatus(datasourceRequest);
             datasource.setStatus("Success");
-            return ResultHolder.success("Success");
-        }catch (Exception e){
+            return ResultHolder.success(datasourceProvider.getTables(datasourceRequest));
+        } catch (Exception e) {
             datasource.setStatus("Error");
             return ResultHolder.error("Datasource is invalid: " + e.getMessage());
-        }finally {
+        } finally {
             datasourceMapper.updateByPrimaryKey(datasource);
         }
     }
@@ -200,6 +202,14 @@ public class DatasourceService {
         return datasourceProvider.getSchema(datasourceRequest);
     }
 
+    public ResultHolder getTablesByDS(Datasource datasource) throws Exception {
+        DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
+        DatasourceRequest datasourceRequest = new DatasourceRequest();
+        datasourceRequest.setDatasource(datasource);
+        datasourceProvider.checkStatus(datasourceRequest);
+        return ResultHolder.success(datasourceProvider.getTables(datasourceRequest));
+    }
+
     public List<DBTableDTO> getTables(Datasource datasource) throws Exception {
         Datasource ds = datasourceMapper.selectByPrimaryKey(datasource.getId());
         DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
@@ -244,6 +254,27 @@ public class DatasourceService {
         return datasourceMapper.selectByPrimaryKey(id);
     }
 
+    public List<TableFiled> getFields(Datasource datasource, String tableName) throws Exception {
+        DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
+        DatasourceRequest datasourceRequest = new DatasourceRequest();
+        datasourceRequest.setDatasource(datasource);
+        QueryProvider qp = ProviderFactory.getQueryProvider(datasource.getType());
+        datasourceRequest.setQuery(qp.convertTableToSql(tableName, datasource));
+        return datasourceProvider.fetchResultField(datasourceRequest);
+    }
+
+    public Map<String, List> getDataByDatasource(Datasource datasource, String tableName, Integer fetchSize) throws Exception {
+        DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
+        DatasourceRequest datasourceRequest = new DatasourceRequest();
+        datasourceRequest.setDatasource(datasource);
+        QueryProvider qp = ProviderFactory.getQueryProvider(datasource.getType());
+        datasourceRequest.setQuery(qp.convertTableToSql(tableName, datasource));
+        datasourceRequest.setFetchSize(fetchSize);
+        datasourceRequest.setPageable(true);
+        datasourceRequest.setPreviewData(true);
+        return datasourceProvider.fetchResultAndField(datasourceRequest);
+    }
+
     public void initAllDataSourceConnectionPool() {
         List<Datasource> datasources = datasourceMapper.selectByExampleWithBLOBs(new DatasourceExample());
         datasources.forEach(datasource -> {
@@ -267,7 +298,7 @@ public class DatasourceService {
         }
     }
 
-    public void updateDatasourceStatus(){
+    public void updateDatasourceStatus() {
         List<Datasource> datasources = datasourceMapper.selectByExampleWithBLOBs(new DatasourceExample());
         datasources.forEach(datasource -> {
             // checkAndUpdateDatasourceStatus(datasource);
@@ -275,7 +306,7 @@ public class DatasourceService {
         });
     }
 
-    private void checkAndUpdateDatasourceStatus(Datasource datasource){
+    private void checkAndUpdateDatasourceStatus(Datasource datasource) {
         try {
             DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
             DatasourceRequest datasourceRequest = new DatasourceRequest();
@@ -287,7 +318,7 @@ public class DatasourceService {
         }
     }
 
-    private void checkAndUpdateDatasourceStatus(Datasource datasource, Boolean withMsg){
+    private void checkAndUpdateDatasourceStatus(Datasource datasource, Boolean withMsg) {
         try {
             DatasourceProvider datasourceProvider = ProviderFactory.getProvider(datasource.getType());
             DatasourceRequest datasourceRequest = new DatasourceRequest();
@@ -301,14 +332,14 @@ public class DatasourceService {
             if (!StringUtils.equals(temp.getStatus(), "Error")) {
                 sendWebMsg(datasource);
                 datasourceMapper.updateByPrimaryKeySelective(datasource);
-            }            
-            
+            }
+
         }
     }
 
 
     private void sendWebMsg(Datasource datasource) {
-        
+
         String id = datasource.getId();
         AuthURD authURD = AuthUtils.authURDR(id);
         Set<Long> userIds = AuthUtils.userIdsByURD(authURD);
@@ -318,10 +349,10 @@ public class DatasourceService {
             Map<String, Object> param = new HashMap<>();
             param.put("id", id);
             param.put("name", datasource.getName());
-            
-            
+
+
             String content = "数据源【" + datasource.getName() + "】无效";
-            
+
             DeMsgutil.sendMsg(userId, typeId, 1L, content, gson.toJson(param));
         });
     }
diff --git a/backend/src/main/java/com/ipsos/dto/DatasourceDTO.java b/backend/src/main/java/com/ipsos/dto/DatasourceDTO.java
index fd04324..0ac0292 100644
--- a/backend/src/main/java/com/ipsos/dto/DatasourceDTO.java
+++ b/backend/src/main/java/com/ipsos/dto/DatasourceDTO.java
@@ -4,6 +4,8 @@ import com.ipsos.base.domain.Datasource;
 import io.swagger.annotations.ApiModelProperty;
 import lombok.Data;
 
+import java.util.List;
+
 /**
  * Author: wangjiahao
  * Date: 2021-05-18
@@ -15,4 +17,6 @@ public class DatasourceDTO extends Datasource {
     @ApiModelProperty("权限")
     private String privileges;
 
+    private List<String> tables;
+
 }
diff --git a/backend/src/main/resources/application.properties b/backend/src/main/resources/application.properties
index ee5b2e2..c9ac912 100644
--- a/backend/src/main/resources/application.properties
+++ b/backend/src/main/resources/application.properties
@@ -36,8 +36,10 @@ knife4j.setting.enableAfterScript=false
 
 app.version=@project.version@
 
+
 logging.file.path=conf/logs/${spring.application.name}
 
+
 # view
 spring.resources.static-locations=classpath:/templates/,classpath:/static/
 
diff --git a/backend/src/main/resources/ehcache/ehcache.xml b/backend/src/main/resources/ehcache/ehcache.xml
index fcc8043..ced8631 100644
--- a/backend/src/main/resources/ehcache/ehcache.xml
+++ b/backend/src/main/resources/ehcache/ehcache.xml
@@ -8,6 +8,7 @@
         java.io.tmpdir - 默认临时文件路径
     -->
     <diskStore path="conf/data/ehcache"/>
+
     <!--
         name:缓存名称。
         maxElementsInMemory:jvm缓存最大数目
@@ -139,4 +140,4 @@
     />
 
 
-</ehcache>
\ No newline at end of file
+</ehcache>
diff --git a/data/ehcache/jdbc_provider_cache.index b/conf/data/ehcache/jdbc_provider_cache.index
similarity index 100%
rename from data/ehcache/jdbc_provider_cache.index
rename to conf/data/ehcache/jdbc_provider_cache.index
diff --git a/conf/data/ehcache/users_info.data b/conf/data/ehcache/users_info.data
index 8ffb46d..e69de29 100644
Binary files a/conf/data/ehcache/users_info.data and b/conf/data/ehcache/users_info.data differ
diff --git a/conf/data/ehcache/users_info.index b/conf/data/ehcache/users_info.index
index 5c37992..711006c 100644
Binary files a/conf/data/ehcache/users_info.index and b/conf/data/ehcache/users_info.index differ
diff --git a/conf/data/ehcache/users_permissions_info.data b/conf/data/ehcache/users_permissions_info.data
index e2b8837..e69de29 100644
Binary files a/conf/data/ehcache/users_permissions_info.data and b/conf/data/ehcache/users_permissions_info.data differ
diff --git a/conf/data/ehcache/users_permissions_info.index b/conf/data/ehcache/users_permissions_info.index
index 247bfaf..711006c 100644
Binary files a/conf/data/ehcache/users_permissions_info.index and b/conf/data/ehcache/users_permissions_info.index differ
diff --git a/conf/data/ehcache/users_roles_info.data b/conf/data/ehcache/users_roles_info.data
index 9fe4a58..e69de29 100644
Binary files a/conf/data/ehcache/users_roles_info.data and b/conf/data/ehcache/users_roles_info.data differ
diff --git a/conf/data/ehcache/users_roles_info.index b/conf/data/ehcache/users_roles_info.index
index e050547..711006c 100644
Binary files a/conf/data/ehcache/users_roles_info.index and b/conf/data/ehcache/users_roles_info.index differ
diff --git a/data/ehcache/users_info.data b/data/ehcache/users_info.data
index 70b70ba..cb78739 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 03be58e..71e995c 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 b5f9a12..5a04321 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 658d674..b9e45cd 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 b1d9576..434d9a1 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 14b8a9b..d7719b6 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/en.js b/frontend/src/lang/en.js
index 0a98859..d9e9963 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -934,6 +934,7 @@ export default {
     dimension_or_quota: 'Dimension Or Quota'
   },
   dataset: {
+    column_length: 'Length',
     sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',
     datalist: 'Data Set',
     name: 'DataSet Name',
diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js
index a1e7aa4..9d81d53 100644
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@@ -935,6 +935,7 @@ export default {
     dimension_or_quota: '維度或指標'
   },
   dataset: {
+    column_length: '长度',
     sheet_warn: '有多個 Sheet 頁，默認抽取第一個',
     datalist: '數據集',
     name: '數據集名稱',
@@ -1530,4 +1531,3 @@ export default {
     placeholder: '請選擇年份'
   }
 }
-
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 84972f7..473bbc6 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -936,6 +936,7 @@ export default {
     dimension_or_quota: '维度或指标'
   },
   dataset: {
+    column_length: '长度',
     sheet_warn: '有多个 Sheet 页，默认抽取第一个',
     datalist: '数据集',
     name: '数据集名称',
@@ -1111,6 +1112,7 @@ export default {
     excel_info_3: '3、Excel文件大小请确保在500M以内。'
   },
   datasource: {
+    table_name: '表名',
     datasource: '数据源',
     please_select_left: '请从左侧选择数据源',
     show_info: '数据源信息',
diff --git a/frontend/src/views/system/datasource/form.vue b/frontend/src/views/system/datasource/form.vue
index 8dbea18..aedce1e 100644
--- a/frontend/src/views/system/datasource/form.vue
+++ b/frontend/src/views/system/datasource/form.vue
@@ -1,112 +1,453 @@
 <template>
-  <layout-content :header="formType=='add' ? $t('datasource.create') : $t('datasource.modify')">
+  <layout-content
+    :header="
+      formType == 'add' ? $t('datasource.create') : $t('datasource.modify')
+    "
+  >
     <template v-slot:header>
       <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 &&
+          params.id &&
+          params.showModel &&
+          params.showModel === 'show' &&
+          !canEdit
+          ? $t('datasource.show_info')
+          : formType == 'add'
+            ? $t('datasource.create')
+            : $t('datasource.modify')
+      }}
     </template>
     <div>
+      <el-row :gutter="25">
+        <el-col :span="8">
+          <el-form
+            ref="dsForm"
+            :model="form"
+            :rules="rule"
+            size="small"
+            :disabled="
+              params &&
+                params.id &&
+                params.showModel &&
+                params.showModel === 'show' &&
+                !canEdit
+            "
+            label-width="auto"
+            label-position="right"
+          >
+            <el-form-item :label="$t('commons.name')" prop="name">
+              <el-input v-model="form.name" autocomplete="off" />
+            </el-form-item>
+            <el-form-item :label="$t('commons.description')" prop="desc">
+              <el-input v-model="form.desc" autocomplete="off" />
+            </el-form-item>
+            <el-form-item :label="$t('datasource.type')" prop="type">
+              <el-select
+                v-model="form.type"
+                :placeholder="$t('datasource.please_choose_type')"
+                class="select-width"
+                :disabled="
+                  formType == 'modify' ||
+                    (formType === 'add' && params && !!params.type)
+                "
+                @change="changeType()"
+              >
+                <el-option
+                  v-for="item in allTypes"
+                  :key="item.name"
+                  :label="item.label"
+                  :value="item.name"
+                />
+              </el-select>
+            </el-form-item>
 
-      <el-form ref="dsForm" :model="form" :rules="rule" size="small" :disabled="params && params.id && params.showModel && params.showModel === 'show' && !canEdit " label-width="auto" label-position="right">
-        <el-form-item :label="$t('commons.name')" prop="name">
-          <el-input v-model="form.name" autocomplete="off" />
-        </el-form-item>
-        <el-form-item :label="$t('commons.description')" prop="desc">
-          <el-input v-model="form.desc" autocomplete="off" />
-        </el-form-item>
-        <el-form-item :label="$t('datasource.type')" prop="type">
-          <el-select v-model="form.type" :placeholder="$t('datasource.please_choose_type')" class="select-width" :disabled="formType=='modify' || (formType==='add' && params && !!params.type)" @change="changeType()">
-            <el-option
-              v-for="item in allTypes"
-              :key="item.name"
-              :label="item.label"
-              :value="item.name"
-            />
-          </el-select>
-        </el-form-item>
-
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.host')" prop="configuration.host">
-          <el-input v-model="form.configuration.host" autocomplete="off" />
-        </el-form-item>
-        <el-form-item v-if="form.configuration.dataSourceType=='es'" :label="$t('datasource.datasource_url')" prop="configuration.url">
-          <el-input v-model="form.configuration.url" :placeholder="$t('datasource.please_input_datasource_url')"  autocomplete="off" />
-        </el-form-item>
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.data_base')" prop="configuration.dataBase">
-          <el-input v-model="form.configuration.dataBase" autocomplete="off" />
-        </el-form-item>
-
-        <el-form-item v-if="form.type=='oracle'" :label="$t('datasource.oracle_connection_type')" prop="configuration.connectionType">
-          <el-radio v-model="form.configuration.connectionType" label="sid">{{ $t('datasource.oracle_sid') }}</el-radio>
-          <el-radio v-model="form.configuration.connectionType" label="serviceName">{{ $t('datasource.oracle_service_name') }}</el-radio>
-        </el-form-item>
-
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.user_name')"  prop="configuration.username">
-          <el-input v-model="form.configuration.username" autocomplete="off" />
-        </el-form-item>
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.password')"  prop="configuration.password">
-          <el-input v-model="form.configuration.password" autocomplete="off" show-password />
-        </el-form-item>
-        <el-form-item v-if="form.configuration.dataSourceType=='es'" :label="$t('datasource.user_name')"  >
-          <el-input v-model="form.configuration.esUsername" autocomplete="off" />
-        </el-form-item>
-        <el-form-item v-if="form.configuration.dataSourceType=='es'" :label="$t('datasource.password')"  >
-          <el-input v-model="form.configuration.esPassword" autocomplete="off" show-password />
-        </el-form-item>
-
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc' && form.type!=='oracle'" :label="$t('datasource.extra_params')"  >
-          <el-input v-model="form.configuration.extraParams" autocomplete="off" />
-        </el-form-item>
-
-        <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.port')" prop="configuration.port" >
-          <el-input v-model="form.configuration.port" autocomplete="off" type="number" min="0" />
-        </el-form-item>
-        <el-form-item v-if="form.type=='oracle' || form.type=='sqlServer' || form.type=='pg'">
-          <el-button icon="el-icon-plus" size="mini" @click="getSchema()">
-            {{ $t('datasource.get_schema') }}
-          </el-button>
-        </el-form-item>
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'jdbc'"
+              :label="$t('datasource.host')"
+              prop="configuration.host"
+            >
+              <el-input v-model="form.configuration.host" autocomplete="off" />
+            </el-form-item>
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'es'"
+              :label="$t('datasource.datasource_url')"
+              prop="configuration.url"
+            >
+              <el-input
+                v-model="form.configuration.url"
+                :placeholder="$t('datasource.please_input_datasource_url')"
+                autocomplete="off"
+              />
+            </el-form-item>
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'jdbc'"
+              :label="$t('datasource.data_base')"
+              prop="configuration.dataBase"
+            >
+              <el-input
+                v-model="form.configuration.dataBase"
+                autocomplete="off"
+              />
+            </el-form-item>
 
-        <el-form-item v-if="form.type=='oracle' || form.type=='sqlServer' || form.type=='pg'" :label="$t('datasource.schema')">
-          <el-select v-model="form.configuration.schema" filterable :placeholder="$t('datasource.please_choose_schema')" class="select-width">
-            <el-option
-              v-for="item in schemas"
-              :key="item"
-              :label="item"
-              :value="item"
-            />
-          </el-select>
-        </el-form-item>
-        <el-collapse v-if="form.configuration.dataSourceType=='jdbc'">
-          <el-collapse-item :title="$t('datasource.priority')" name="1">
+            <el-form-item
+              v-if="form.type == 'oracle'"
+              :label="$t('datasource.oracle_connection_type')"
+              prop="configuration.connectionType"
+            >
+              <el-radio
+                v-model="form.configuration.connectionType"
+                label="sid"
+              >{{ $t('datasource.oracle_sid') }}</el-radio>
+              <el-radio
+                v-model="form.configuration.connectionType"
+                label="serviceName"
+              >{{ $t('datasource.oracle_service_name') }}</el-radio>
+            </el-form-item>
 
-            <el-form-item :label="$t('datasource.initial_pool_size')" prop="configuration.initialPoolSize">
-              <el-input v-model="form.configuration.initialPoolSize" autocomplete="off" type="number" min="0" size="small" />
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'jdbc'"
+              :label="$t('datasource.user_name')"
+              prop="configuration.username"
+            >
+              <el-input
+                v-model="form.configuration.username"
+                autocomplete="off"
+              />
             </el-form-item>
-            <el-form-item :label="$t('datasource.min_pool_size')" prop="configuration.minPoolSize">
-              <el-input v-model="form.configuration.minPoolSize" autocomplete="off" type="number" min="0" />
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'jdbc'"
+              :label="$t('datasource.password')"
+              prop="configuration.password"
+            >
+              <el-input
+                v-model="form.configuration.password"
+                autocomplete="off"
+                show-password
+              />
             </el-form-item>
-            <el-form-item :label="$t('datasource.max_pool_size')" prop="configuration.maxPoolSize">
-              <el-input v-model="form.configuration.maxPoolSize" autocomplete="off" type="number" min="0" />
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'es'"
+              :label="$t('datasource.user_name')"
+            >
+              <el-input
+                v-model="form.configuration.esUsername"
+                autocomplete="off"
+              />
             </el-form-item>
-            <el-form-item :label="$t('datasource.max_idle_time')" prop="configuration.maxIdleTime">
-              <el-input v-model="form.configuration.maxIdleTime" autocomplete="off" type="number" min="0" />
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'es'"
+              :label="$t('datasource.password')"
+            >
+              <el-input
+                v-model="form.configuration.esPassword"
+                autocomplete="off"
+                show-password
+              />
             </el-form-item>
-            <el-form-item :label="$t('datasource.acquire_increment')" prop="configuration.acquireIncrement">
-              <el-input v-model="form.configuration.acquireIncrement" autocomplete="off" type="number" min="0" />
+
+            <el-form-item
+              v-if="
+                form.configuration.dataSourceType == 'jdbc' &&
+                  form.type !== 'oracle'
+              "
+              :label="$t('datasource.extra_params')"
+            >
+              <el-input
+                v-model="form.configuration.extraParams"
+                autocomplete="off"
+              />
             </el-form-item>
-            <el-form-item :label="$t('datasource.connect_timeout')" prop="configuration.connectTimeout">
-              <el-input v-model="form.configuration.connectTimeout" autocomplete="off" type="number" min="0" />
+
+            <el-form-item
+              v-if="form.configuration.dataSourceType == 'jdbc'"
+              :label="$t('datasource.port')"
+              prop="configuration.port"
+            >
+              <el-input
+                v-model="form.configuration.port"
+                autocomplete="off"
+                type="number"
+                min="0"
+              />
+            </el-form-item>
+            <el-form-item
+              v-if="
+                form.type == 'oracle' ||
+                  form.type == 'sqlServer' ||
+                  form.type == 'pg'
+              "
+            >
+              <el-button icon="el-icon-plus" size="mini" @click="getSchema()">
+                {{ $t('datasource.get_schema') }}
+              </el-button>
             </el-form-item>
 
-          </el-collapse-item>
-        </el-collapse>
-      </el-form>
-      <div v-if="canEdit" slot="footer" class="dialog-footer">
-        <el-button v-if="formType==='add'?true: hasDataPermission('manage',params.privileges)" @click="validaDatasource">{{ $t('commons.validate') }}</el-button>
-        <el-button v-if="formType==='add'?true: hasDataPermission('manage',params.privileges)" type="primary" @click="save">{{ $t('commons.save') }}</el-button>
-      </div>
-      <div v-else slot="footer" class="dialog-footer">
-        <el-button v-if="formType==='add'?true: hasDataPermission('manage',params.privileges)" @click="validaDatasource">{{ $t('commons.validate') }}</el-button>
-        <el-button v-if="formType==='add'?true: hasDataPermission('manage',params.privileges)" type="primary" @click="changeEdit">{{ $t('commons.edit') }}</el-button>
+            <el-form-item
+              v-if="
+                form.type == 'oracle' ||
+                  form.type == 'sqlServer' ||
+                  form.type == 'pg'
+              "
+              :label="$t('datasource.schema')"
+            >
+              <el-select
+                v-model="form.configuration.schema"
+                filterable
+                :placeholder="$t('datasource.please_choose_schema')"
+                class="select-width"
+              >
+                <el-option
+                  v-for="item in schemas"
+                  :key="item"
+                  :label="item"
+                  :value="item"
+                />
+              </el-select>
+            </el-form-item>
+            <el-collapse v-if="form.configuration.dataSourceType == 'jdbc'">
+              <el-collapse-item :title="$t('datasource.priority')" name="1">
+                <el-form-item
+                  :label="$t('datasource.initial_pool_size')"
+                  prop="configuration.initialPoolSize"
+                >
+                  <el-input
+                    v-model="form.configuration.initialPoolSize"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                    size="small"
+                  />
+                </el-form-item>
+                <el-form-item
+                  :label="$t('datasource.min_pool_size')"
+                  prop="configuration.minPoolSize"
+                >
+                  <el-input
+                    v-model="form.configuration.minPoolSize"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                  />
+                </el-form-item>
+                <el-form-item
+                  :label="$t('datasource.max_pool_size')"
+                  prop="configuration.maxPoolSize"
+                >
+                  <el-input
+                    v-model="form.configuration.maxPoolSize"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                  />
+                </el-form-item>
+                <el-form-item
+                  :label="$t('datasource.max_idle_time')"
+                  prop="configuration.maxIdleTime"
+                >
+                  <el-input
+                    v-model="form.configuration.maxIdleTime"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                  />
+                </el-form-item>
+                <el-form-item
+                  :label="$t('datasource.acquire_increment')"
+                  prop="configuration.acquireIncrement"
+                >
+                  <el-input
+                    v-model="form.configuration.acquireIncrement"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                  />
+                </el-form-item>
+                <el-form-item
+                  :label="$t('datasource.connect_timeout')"
+                  prop="configuration.connectTimeout"
+                >
+                  <el-input
+                    v-model="form.configuration.connectTimeout"
+                    autocomplete="off"
+                    type="number"
+                    min="0"
+                  />
+                </el-form-item>
+              </el-collapse-item>
+            </el-collapse>
+          </el-form>
+        </el-col>
+        <el-col :span="16">
+          <el-row :gutter="20">
+            <el-col :span="10">
+              <el-table
+                v-if="showTableList"
+                v-loading="tableLoading"
+                :data="tableData"
+                highlight-current-row
+                :border="true"
+                max-height="460"
+                @current-change="handleCurrentChange"
+              >
+                <el-table-column
+                  prop="date"
+                  :label="$t('datasource.table_name')"
+                >
+                  <template slot-scope="scope">
+                    <span><i class="el-icon-coin" />&nbsp;&nbsp;{{
+                      scope.row
+                    }}</span>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-col>
+            <el-col :span="14">
+              <el-table
+                v-if="showTableFields"
+                :border="true"
+                max-height="460"
+                :data="tableFields"
+                size="mini"
+              >
+                <el-table-column
+                  property="fieldName"
+                  :label="$t('dataset.field_name')"
+                />
+                <el-table-column
+                  property="fieldSize"
+                  :label="$t('dataset.column_length')"
+                  width="70"
+                />
+                <el-table-column
+                  property="fieldType"
+                  :label="$t('dataset.field_type')"
+                  width="160"
+                >
+                  <template slot-scope="scope">
+                    <span style="margin-left: 8px">
+                      <span
+                        v-if="
+                          scope.row.fieldType.indexOf('CHAR') >= 0 ||
+                            scope.row.fieldType.indexOf('TEXT') >= 0 ||
+                            scope.row.fieldType.indexOf('BLOB') >= 0
+                        "
+                      >
+                        <svg-icon
+                          icon-class="field_text"
+                          class="field-icon-text"
+                        />
+                        <span class="field-class">{{
+                          $t('dataset.text')
+                        }}</span>
+                      </span>
+                      <span
+                        v-if="
+                          scope.row.fieldType.indexOf('DATE') >= 0 ||
+                            scope.row.fieldType.indexOf('TIME') >= 0
+                        "
+                      >
+                        <svg-icon
+                          icon-class="field_time"
+                          class="field-icon-time"
+                        />
+                        <span class="field-class">{{
+                          $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
+                        "
+                      >
+                        <svg-icon
+                          icon-class="field_value"
+                          class="field-icon-value"
+                        />
+                        <span class="field-class">{{
+                          $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
+                          "
+                          class="field-class"
+                        >{{ '(' + $t('dataset.float') + ')' }}</span>
+                      </span>
+                      <span>({{ scope.row.fieldType }})</span>
+                    </span>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="24">
+              <el-table
+                v-if="showTableFields"
+                :border="true"
+                :data="dataList"
+                style="width: 100%; margin-top: 34px"
+                max-height="250"
+                size="mini"
+              >
+                <el-table-column
+                  v-for="(field, index) in tableFields"
+                  :key="field.fieldName"
+                  :prop="index + ''"
+                  :show-overflow-tooltip="true"
+                  :label="field.fieldName"
+                />
+              </el-table>
+            </el-col>
+          </el-row>
+        </el-col>
+      </el-row>
+      <div class="validated">
+        <div v-if="canEdit" slot="footer" class="dialog-footer">
+          <el-button
+            v-if="
+              formType === 'add'
+                ? true
+                : hasDataPermission('manage', params.privileges)
+            "
+            @click="validaDatasource"
+          >{{ $t('commons.validate') }}</el-button>
+          <el-button
+            v-if="
+              formType === 'add'
+                ? true
+                : hasDataPermission('manage', params.privileges)
+            "
+            type="primary"
+            @click="save"
+          >{{ $t('commons.save') }}</el-button>
+        </div>
+        <div v-else slot="footer" class="dialog-footer">
+          <el-button
+            v-if="
+              formType === 'add'
+                ? true
+                : hasDataPermission('manage', params.privileges)
+            "
+            @click="validaDatasource"
+          >{{ $t('commons.validate') }}</el-button>
+          <el-button
+            v-if="
+              formType === 'add'
+                ? true
+                : hasDataPermission('manage', params.privileges)
+            "
+            type="primary"
+            @click="changeEdit"
+          >{{ $t('commons.edit') }}</el-button>
+        </div>
       </div>
     </div>
   </layout-content>
@@ -114,7 +455,14 @@
 
 <script>
 import LayoutContent from '@/components/business/LayoutContent'
-import { addDs, editDs, getSchema, validateDs, validateDsById } from '@/api/system/datasource'
+import { post } from '@/api/dataset/dataset'
+import {
+  addDs,
+  editDs,
+  getSchema,
+  validateDs,
+  validateDsById
+} from '@/api/system/datasource'
 import { $confirm } from '@/utils/message'
 
 export default {
@@ -141,40 +489,183 @@ export default {
         }
       },
       rule: {
-        name: [{ required: true, message: this.$t('datasource.input_name'), trigger: 'blur' },
-          { min: 2, max: 25, 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' }],
-        type: [{ required: true, message: this.$t('datasource.please_choose_type'), trigger: 'change' }],
-        'configuration.dataBase': [{ required: true, message: this.$t('datasource.please_input_data_base'), trigger: 'blur' }],
-        'configuration.connectionType': [{ required: true, message: this.$t('datasource.please_select_oracle_type'), trigger: 'blur' }],
-        'configuration.username': [{ required: true, message: this.$t('datasource.please_input_user_name'), trigger: 'blur' }],
-        'configuration.password': [{ required: true, message: this.$t('datasource.please_input_password'), trigger: 'change' }],
-        'configuration.host': [{ required: true, message: this.$t('datasource.please_input_host'), trigger: 'change' }],
-        'configuration.url': [{ required: true, message: this.$t('datasource.please_input_url'), trigger: 'change' }],
-        'configuration.port': [{ required: true, message: this.$t('datasource.please_input_port'), trigger: 'change' }],
-        'configuration.initialPoolSize': [{ required: true, message: this.$t('datasource.please_input_initial_pool_size'), trigger: 'change' }],
-        'configuration.minPoolSize': [{ required: true, message: this.$t('datasource.please_input_min_pool_size'), trigger: 'change' }],
-        'configuration.maxPoolSize': [{ required: true, message: this.$t('datasource.please_input_max_pool_size'), trigger: 'change' }],
-        'configuration.maxIdleTime': [{ required: true, message: this.$t('datasource.please_input_max_idle_time'), trigger: 'change' }],
-        'configuration.acquireIncrement': [{ required: true, message: this.$t('datasource.please_input_acquire_increment'), trigger: 'change' }],
-        'configuration.connectTimeout': [{ required: true, message: this.$t('datasource.please_input_connect_timeout'), trigger: 'change' }]
+        name: [
+          {
+            required: true,
+            message: this.$t('datasource.input_name'),
+            trigger: 'blur'
+          },
+          {
+            min: 2,
+            max: 25,
+            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'
+          }
+        ],
+        type: [
+          {
+            required: true,
+            message: this.$t('datasource.please_choose_type'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.dataBase': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_data_base'),
+            trigger: 'blur'
+          }
+        ],
+        'configuration.connectionType': [
+          {
+            required: true,
+            message: this.$t('datasource.please_select_oracle_type'),
+            trigger: 'blur'
+          }
+        ],
+        'configuration.username': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_user_name'),
+            trigger: 'blur'
+          }
+        ],
+        'configuration.password': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_password'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.host': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_host'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.url': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_url'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.port': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_port'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.initialPoolSize': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_initial_pool_size'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.minPoolSize': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_min_pool_size'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.maxPoolSize': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_max_pool_size'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.maxIdleTime': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_max_idle_time'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.acquireIncrement': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_acquire_increment'),
+            trigger: 'change'
+          }
+        ],
+        'configuration.connectTimeout': [
+          {
+            required: true,
+            message: this.$t('datasource.please_input_connect_timeout'),
+            trigger: 'change'
+          }
+        ]
       },
       allTypes: [
-        { name: 'mysql', label: 'MySQL', type: 'jdbc', extraParams: 'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true'},
+        {
+          name: 'mysql',
+          label: 'MySQL',
+          type: 'jdbc',
+          extraParams:
+            'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true'
+        },
         // { name: 'oracle', label: 'Oracle', type: 'jdbc'},
         // { name: 'pg', label: 'PostgreSQL', type: 'jdbc', extraParams: '' },
         // { name: 'es', label: 'Elasticsearch', type: 'es' },
         // { 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', extraParams: 'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true' },
-        { name: 'sqlServer', label: 'SQL Server', type: 'jdbc', extraParams: ''}
-        ],
+        {
+          name: 'mariadb',
+          label: 'MariaDB',
+          type: 'jdbc',
+          extraParams:
+            'characterEncoding=UTF-8&connectTimeout=5000&useSSL=false&allowPublicKeyRetrieval=true'
+        },
+        {
+          name: 'sqlServer',
+          label: 'SQL Server',
+          type: 'jdbc',
+          extraParams: ''
+        }
+      ],
       schemas: [],
       canEdit: false,
-      originConfiguration: {}
+      originConfiguration: {},
+      tables: [],
+      tableData: [],
+      showTableList: false,
+      tableLoading: false,
+      tableFields: [],
+      showTableFields: false,
+      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 = []
+            _this.tables.forEach((item) => {
+              _this.tableData.push(item.name)
+            })
+            _this.showTableList = _this.tableData.length > 0
+          })
+        }
+      },
+      deep: true
     }
   },
-
   created() {
     if (this.params && this.params.id) {
       const row = this.params
@@ -186,9 +677,23 @@ export default {
       }
     }
   },
-  mounted() {
-  },
+  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)
+        .then((response) => {
+          _this.tableFields = response.data.fieldList
+          _this.showTableFields = _this.tableFields.length > 0
+          _this.dataList = response.data.dataList
+        })
+        .finally((_) => {
+          this.tableLoading = false
+        })
+    },
     setType() {
       this.form.type = this.params.type
       this.form.configuration = {
@@ -221,34 +726,50 @@ export default {
       this.$refs.dsForm.resetFields()
     },
     save() {
-      if (!this.form.configuration.schema && (this.form.type === 'oracle' || this.form.type === 'sqlServer')) {
+      if (
+        !this.form.configuration.schema &&
+        (this.form.type === 'oracle' || this.form.type === 'sqlServer')
+      ) {
         this.$message.error(this.$t('datasource.please_choose_schema'))
         return
       }
-      if (this.form.configuration.dataSourceType === 'jdbc' && this.form.configuration.port <= 0) {
+      if (
+        this.form.configuration.dataSourceType === 'jdbc' &&
+        this.form.configuration.port <= 0
+      ) {
         this.$message.error(this.$t('datasource.port_no_less_then_0'))
         return
       }
-      if (this.form.configuration.initialPoolSize < 0 || this.form.configuration.minPoolSize < 0 || this.form.configuration.maxPoolSize < 0 || this.form.configuration.maxIdleTime < 0 ||
-        this.form.configuration.acquireIncrement < 0 || this.form.configuration.idleConnectionTestPeriod < 0 || this.form.configuration.connectTimeout < 0) {
+      if (
+        this.form.configuration.initialPoolSize < 0 ||
+        this.form.configuration.minPoolSize < 0 ||
+        this.form.configuration.maxPoolSize < 0 ||
+        this.form.configuration.maxIdleTime < 0 ||
+        this.form.configuration.acquireIncrement < 0 ||
+        this.form.configuration.idleConnectionTestPeriod < 0 ||
+        this.form.configuration.connectTimeout < 0
+      ) {
         this.$message.error(this.$t('datasource.no_less_then_0'))
         return
       }
-      this.$refs.dsForm.validate(valid => {
+      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)
-          if (this.formType !== 'add' && this.originConfiguration !== form.configuration) {
+          if (
+            this.formType !== 'add' &&
+            this.originConfiguration !== form.configuration
+          ) {
             $confirm(this.$t('datasource.edit_datasource_msg'), () => {
-              method(form).then(res => {
+              method(form).then((res) => {
                 this.$success(this.$t('commons.save_success'))
                 this.refreshTree()
                 this.backToList()
               })
             })
           } else {
-            method(form).then(res => {
+            method(form).then((res) => {
               this.$success(this.$t('commons.save_success'))
               this.refreshTree()
               this.backToList()
@@ -260,11 +781,11 @@ export default {
       })
     },
     getSchema() {
-      this.$refs.dsForm.validate(valid => {
+      this.$refs.dsForm.validate((valid) => {
         if (valid) {
           const data = JSON.parse(JSON.stringify(this.form))
           data.configuration = JSON.stringify(data.configuration)
-          getSchema(data).then(res => {
+          getSchema(data).then((res) => {
             this.schemas = res.data
             this.$success(this.$t('commons.success'))
           })
@@ -278,35 +799,45 @@ export default {
         this.$message.error(this.$t('datasource.please_choose_schema'))
         return
       }
-      if (this.form.configuration.dataSourceType === 'jdbc' && this.form.configuration.port <= 0) {
+      if (
+        this.form.configuration.dataSourceType === 'jdbc' &&
+        this.form.configuration.port <= 0
+      ) {
         this.$message.error(this.$t('datasource.port_no_less_then_0'))
         return
       }
-      this.$refs.dsForm.validate(valid => {
+      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) {
-            validateDsById(data.id).then(res => {
-              if (res.success) {
-                this.$success(this.$t('datasource.validate_success'))
-              } else {
-                this.$error(this.$t(res.message))
-              }
-              this.refreshTree()
-            }).catch(res => {
-              this.$error(res.message)
-            })
+            validateDsById(data.id)
+              .then((res) => {
+                if (res.success) {
+                  this.$success(this.$t('datasource.validate_success'))
+                } else {
+                  this.$error(this.$t(res.message))
+                }
+                this.refreshTree()
+              })
+              .catch((res) => {
+                this.$error(res.message)
+              })
           } else {
-            validateDs(data).then(res => {
-              if (res.success) {
-                this.$success(this.$t('datasource.validate_success'))
-              } else {
-                this.$error(this.$t(res.message))
-              }
-            }).catch(res => {
-              this.$error(res.message)
-            })
+            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'))
+                } else {
+                  this.$error(this.$t(res.message))
+                }
+              })
+              .catch((res) => {
+                this.$error(res.message)
+              })
           }
         } else {
           return false
@@ -322,7 +853,7 @@ export default {
       }
     },
     backToList() {
-      this.$emit('switch-component', { })
+      this.$emit('switch-component', {})
       // this.$router.push({ name: 'datasource' })
     },
     refreshTree() {
@@ -332,7 +863,6 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-
 .back-button {
   cursor: pointer;
   margin-right: 10px;
@@ -344,9 +874,13 @@ export default {
 }
 
 .el-input {
-  width: 300px;
+  max-width: 300px;
 }
 .el-select {
-  width: 300px;
+  max-width: 300px;
+}
+div.validated {
+  position: fixed;
+  bottom: 10%;
 }
 </style>
diff --git a/quartz-spring-boot-starter/pom.xml b/quartz-spring-boot-starter/pom.xml
index 1c12d8b..52fa46e 100644
--- a/quartz-spring-boot-starter/pom.xml
+++ b/quartz-spring-boot-starter/pom.xml
@@ -51,6 +51,7 @@
             <plugin>
                 <groupId>org.apache.maven.plugins</groupId>
                 <artifactId>maven-source-plugin</artifactId>
+                <version>3.2.1</version>
                 <executions>
                     <execution>
                         <id>attach-sources</id>
@@ -63,6 +64,7 @@
             <plugin>
                 <groupId>org.apache.maven.plugins</groupId>
                 <artifactId>maven-javadoc-plugin</artifactId>
+                <version>3.3.1</version>
                 <executions>
                     <execution>
                         <id>attach-javadocs</id>
@@ -101,4 +103,4 @@
             <url>https://oss.sonatype.org/service/local/staging/deploy/maven2</url>
         </repository>
     </distributionManagement>
-</project>
\ No newline at end of file
+</project>