更新流程

Reviewed-on: #3

src/api/etl/etl.js

@@ -38,4 +38,11 @@ export function extractDataName() {
   })
 }
 
+export function selectByTableName(tableName) {
+  return request({
+    url: '/integration/task/selectByTableName?tableName='+tableName,
+    method: 'post',
+  })
+}
+
 

src/api/property/astr.js

@@ -1,9 +1,8 @@
 import request from '@/utils/request'
 
-export function getSelectList(data) {
+export function getExtractDataTableNameList() {
   return request({
-    url: '/property/dataSource/dataName',
+    url: '/property/dataRunName/extractDataTableName',
     method: 'post',
-    data: data
   })
 }

src/api/property/property.js

@@ -48,9 +48,10 @@ export function selectHandleClick(data) {
   })
 }
 
-export function extractDataName() {
+export function extractDataName(data) {
   return request({
     url: '/property/dataRunName/extractDataName',
     method: 'post',
+    data: data
   })
 }

src/views/components/task/index.vue

@@ -0,0 +1,106 @@
+<template>
+  <div>
+    <div>
+      <el-dialog
+        title="提示"
+        :visible.sync="dialogVisible"
+        width="30%"
+      >
+      <span>
+          <el-radio-group v-model="labelPosition" size="small">
+          <el-radio-button label="left">左对齐</el-radio-button>
+          <el-radio-button label="right">右对齐</el-radio-button>
+          <el-radio-button label="top">顶部对齐</el-radio-button>
+        </el-radio-group>
+        <div style="margin: 20px;"></div>
+        <el-form :label-position="labelPosition" label-width="80px" :model="tableMsg">
+          <el-form-item label="任务id">
+            <el-input v-model="tableMsg.id" :disabled="true"></el-input>
+          </el-form-item>
+          <el-form-item label="数据库id">
+            <el-input v-model="tableMsg.databaseId" :disabled="true"></el-input>
+          </el-form-item>
+          <el-form-item label="数据表">
+                  <el-cascader
+                    v-model="tableMsg.tableName"
+                    :options="tables"
+                    :props="{ expandTrigger: 'hover',value:'id',label:'name',children:'tableNames' }"
+                    @change="handleChange"></el-cascader>
+          </el-form-item>
+          <el-form-item label="表别名">
+            <el-input v-model="tableMsg.tableAsField"></el-input>
+          </el-form-item>
+        </el-form>
+      </span>
+        <span slot="footer" class="dialog-footer">
+    <el-button @click="dialogVisible = false">取 消</el-button>
+    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+  </span>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+import {extractDataName} from "../../../api/etl/etl";
+
+export default {
+  name: "task",
+  //import引入的组件需要注入到对象中才能使用"
+  components: {},
+  props: {},
+  data() {
+    //这里存放数据"
+
+    return {
+      labelPosition: 'right',
+      dialogVisible:false,
+      tableMsg:{},
+      tables:{}
+    };
+  },
+  //计算属性 类似于data概念",
+  computed: {},
+  //监控data中的数据变化",
+  watch: {},
+  //方法集合",
+  methods: {
+    handleChange(value) {
+      console.log(value);
+    },
+    getDatabaseMessage(){
+      this.dialogVisible = true
+      extractDataName().then(res => {
+        console.log(res);
+        this.tables = res.data
+      })
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）",
+  created() {
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）",
+  mounted() {
+  },
+  beforeCreate() {
+  }, //生命周期 - 创建之前",
+  beforeMount() {
+  }, //生命周期 - 挂载之前",
+  beforeUpdate() {
+  }, //生命周期 - 更新之前",
+  updated() {
+  }, //生命周期 - 更新之后",
+  beforeDestroy() {
+  }, //生命周期 - 销毁之前",
+  destroyed() {
+  }, //生命周期 - 销毁完成",
+  activated() {
+  } //如果页面有keep-alive缓存功能，这个函数会触发",
+};
+
+</script>
+<style scoped>
+
+</style>

src/views/etl/task/taskInfo.vue

@@ -48,7 +48,44 @@
       </span>
       <span slot="footer" class="dialog-footer">
     <el-button @click="dialogVisible = false">取 消</el-button>
-    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+    <el-button type="primary" @click="nextOne()">下一步</el-button>
+  </span>
+    </el-dialog>
+
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible1"
+      width="30%"
+      >
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        tooltip-effect="dark"
+        style="width: 100%"
+        @selection-change="handleSelectionChange">
+        <el-table-column
+          type="selection"
+          width="55">
+        </el-table-column>
+        <el-table-column
+          label="日期"
+          width="120">
+          <template slot-scope="scope">{{ scope.row.date }}</template>
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="姓名"
+          width="120">
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="地址"
+          show-overflow-tooltip>
+        </el-table-column>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+    <el-button @click="dialogVisible1 = false">取 消</el-button>
+    <el-button type="primary" @click="dialogVisible1 = false">确 定</el-button>
   </span>
     </el-dialog>
   </div>
@@ -56,14 +93,19 @@
 
 <script>
 import { Graph } from "@antv/x6";
-import {extractDataName} from "../../../api/etl/etl";
+import {extractDataName, selectByTableName} from "../../../api/etl/etl";
 
 export default {
   name: "antvX6",
   data() {
     return {
+      tableData:[],
+      dialogVisible1: false,
       tables:{},
-      tableMsg:{},
+      tableMsg:{
+        tableName:"",
+        tableAsField:""
+      },
       labelPosition: 'right',
       dialogVisible:false,
       curSelectNode: "",
@@ -93,8 +135,22 @@ export default {
     };
   },
   methods: {
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    nextOne(){
+      let tableAsField = this.tableMsg.tableAsField;
+      let tableName = this.tableMsg.tableName;
+      selectByTableName(tableName).then(res => {
+          this.dialogVisible1 = true
+          this.tableData = res.data
+          console.log(res);
+      })
+      this.dialogVisible = false
+    },
     handleChange(value) {
-      console.log(value);
+
+      this.tableMsg.tableName = value[1]
     },
     getDatabaseMessage(){
         this.dialogVisible = true

src/views/property/astr/index.vue

@@ -4,13 +4,6 @@
     <el-container>
       <el-aside width="300px">
         <el-tree :data="dataName" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
-
-        <el-select v-model="dataName" placeholder="请选择">
-          <el-option
-            v-for="item in dataName"
-            :value="item.value">
-          </el-option>
-        </el-select>
       </el-aside>
       <el-container>
         <el-header>Header</el-header>
@@ -49,7 +42,7 @@
 <script>
 //这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
 //例如：import 《组件名称》 from '《组件路径》,
-import { getSelectList } from '@/api/property/astr'
+import { getExtractDataTableNameList } from '@/api/property/astr'
 
 export default {
   //import引入的组件需要注入到对象中才能使用"
@@ -75,7 +68,7 @@ export default {
   //方法集合",
   methods: {
     getSelectList(){
-      getSelectList().then(res=>{
+      getExtractDataTableNameList().then(res=>{
         console.log(res.data)
         this.dataName=res.data
       })