修改

src/utils/validate.js

@@ -482,4 +482,21 @@ export function formatBagParmas (param = {}) {
   const nPobj = {}
   const nPobjs = ['PNRNO', 'luggageNum', 'carrierFlights', 'carrierFlightsDate'].map(item => nPobj[item] = null)
   return _.assign(nPobj, nParam)
+}
+
+//根据auth_id获取表头
+export function getTableCols (auth_id) {
+  if (!auth_id) return []
+  const pageAuths = store.state.auth.authArrs ?? []
+  const pageAuthArrs = pageAuths.filter(item => item['superiorid'] == auth_id)
+  //获取table权限
+  const pageAuthtables = pageAuthArrs.filter(item => item.pagetype == 'table')
+  const authTableObj = pageAuthtables[0]
+  //获取当前页面table的配置
+  const { pagename, pageconfigurationid, serviceid, pagecode, userpermissionsid, defaultfilter, selected, triggerserviceid } = authTableObj
+  const tableColumnArrs = pageAuths.filter(item => item['superiorid'] == pageconfigurationid && item['pagetype'] == 'column')
+  const returnData = [...tableColumnArrs]
+  const tableColsCopy = _.cloneDeep(returnData).filter((item) => item.isdisplay != 0)
+  const tableColsCopyOrder = _.orderBy(tableColsCopy, ['displaynumber'], ['asc'])
+  return listToTree(tableColsCopyOrder, 'groupid', 'pagecode')
 }

src/views/dataAccessPage/components/accessPageNode copy.vue

@@ -0,0 +1,372 @@
+<template>
+  <div class="accessPageNode">
+    <div style="height: 100%;" class="accessPageNode-items">
+      <nodeBtn v-for="(item,index) in nodeItems" :nodeIndex="index" :nodeItem="item" :nodeTxt="item.algorithmname" :isLine="item.isLine" :isDel="item.isDel" :key="index" @handleAdd="handleAdd" @handleDel="handleDel" @handleEdit="handleEdit" />
+    </div>
+    <PublicPageDialog class="advancedNode" :dialog-title="dialogTitle" dialogSize="600px" :dialog-drawer="advancedDrawer" @handleClose="advancedClose" @handleSubmit="advancedTable">
+      <div v-if="!tabFlag" class="nodeForm">
+        <el-form :inline="true" :model="formInline" class="nodeForm-inline">
+          <el-form-item label="分类">
+            <el-select size="small" v-model="formInline.algorithmtype" @change="changeSelect('algorithmtype',formInline.algorithmtype)" clearable placeholder="全部分类">
+              <el-option v-for="(item,index) in selectType" :key="index" :label="item.name" :value="item.code"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" style="margin-top: 20px">
+          <template v-if="selectAlgorithm.length">
+            <el-radio-group style="width: 100%;" v-model="radio3" size="small">
+              <el-row :gutter="20">
+                <el-col style="margin-bottom: 20px;" v-for="(item,index) in selectAlgorithm" :key="index" :span="8">
+                  <el-radio :label="item.id" border>{{ item.name }}</el-radio>
+                </el-col>
+              </el-row>
+            </el-radio-group>
+          </template>
+          <template v-else>
+            <el-empty description="暂无数据"></el-empty>
+          </template>
+        </div>
+      </div>
+      <div v-else class="nodeItemForm">
+        <el-form ref="ruleForm" :model="tableForm" label-width="100px">
+          <el-row :gutter="20">
+            <el-col :span="24">
+              <el-form-item prop="algorithmname" label="算法名称">
+                <el-input size="small" v-model="tableForm.algorithmname" placeholder="请输入" />
+              </el-form-item>
+            </el-col>
+            <el-col v-if="formatData(formInline.algorithmtype) == 'java' || formatData(formInline.algorithmtype) == 'db' || formatData(formInline.algorithmtype) == 'kafka'" :span="24">
+              <el-form-item prop="datasourceid" label="数据源">
+                <el-select size="small" v-model="tableForm.datasourceid" @change="changeSelectSocure('datasourceid')" placeholder="请选择">
+                  <el-option v-for="(item,index) in selectSource" :key="index" :label="item.datasourcedescribe" :value="item.datasourceid"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="formatData(formInline.algorithmtype) != 'js'" :span="24">
+              <el-form-item prop="targetsource" label="数据源目标">
+                <el-input size="small" v-model="tableForm.targetsource"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item prop="executionorder" label="执行排序">
+                <el-input size="small" v-model="tableForm.executionorder"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item prop="algorithmdescription" label="算法说明">
+                <el-input size="small" v-model="tableForm.algorithmdescription"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item prop="computingexpression" label="计算表达式">
+                <el-input size="small" type="textarea" v-model="tableForm.computingexpression"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item prop="preconditions" label="执行条件">
+                <el-input size="small" type="textarea" v-model="tableForm.preconditions"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item prop="preparameterset" label="前置条件参数">
+                <el-input size="small" type="textarea" v-model="tableForm.preparameterset"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="tableData" border style="width: 100%">
+          <el-table-column v-for="col in tableCols" :key="col.pagecode" :prop="col.pagecode" :label="col.pagename" :width="col.displaywidth+'px'">
+            <template slot-scope="scope">
+              <el-input size="small" v-model="scope.row[col.pagecode]" placeholder="请输入参数名" />
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </PublicPageDialog>
+  </div>
+</template>
+
+<script>
+import PublicPageDialog from '@/components/PublicPageDialog'
+import nodeBtn from './accessPageNodeBtn.vue'
+import { Query, newData, modifyData, moveData } from "@/api/webApi"
+import { formatChange, getTableCols } from '@/utils/validate'
+export default {
+  name: 'AccessPageNode',
+  components: { nodeBtn, PublicPageDialog },
+  props: {
+    msgContent: {
+      type: Object,
+      default: () => new Object()
+    }
+  },
+  data () {
+    return {
+      loading: false,
+      tabFlag: false,
+      nodeItems: [
+        {
+          algorithmname: '开始',
+          isLine: true,
+          isDel: false
+        }
+      ],
+      formInline: {
+        algorithmtype: '',
+      },
+      tableForm: {
+        serviceid: '',
+        preconditions: '',
+        algorithmtype: '',
+        algorithmname: '',
+        algorithmsourcelibraryid: '',
+        executionorder: '',
+        targetsource: '',
+        datasourceid: '',
+        computingexpression: '',
+        algorithmdescription: '',
+        preparameterset: ''
+      },
+      nodeIndex: '',
+      tableCols: [],
+      selectType: [],
+      selectAlgorithm: [],
+      selectSource: [],
+      radio3: '',
+      dialogTitle: '添加步骤',
+      advancedDrawer: false,
+      tableDrawer: false,
+      tableData: [],
+      pageServiceId: 15,
+      pageTableId: 24,
+      type: 'add'
+    }
+  },
+  watch: {
+    radio3: {
+      handler (val) {
+        if (val) {
+          this.tabFlag = true
+          // this.getSelectData('datatable', 20, { superiorid: val })
+        }
+      },
+      deep: true
+    },
+    msgContent: {
+      handler (row) {
+        this.setTableData(row)
+      },
+      deep: true,
+      immediate: true
+    },
+  },
+  mounted () {
+    this.tableCols = getTableCols(233)
+    this.getSelectData('algorithmtype', 20, { type: 'category' })
+  },
+  methods: {
+    async getSelectData (pagecode, serviceid, datacontent) {
+      this.loading = true
+      try {
+        datacontent = { filter: datacontent }
+        const { code, returnData } = await Query({ serviceid: serviceid, datacontent, event: '0', page: 1, size: 9999 })
+        if (code && returnData?.length) {
+          this.setFormSelectData(pagecode, returnData)
+        }
+      } catch (error) {
+        this.$message.error(error)
+      }
+      this.loading = false
+    },
+    //设置数据
+    setTableData (row) {
+      if (row && Object.keys(row).length) {
+        const { passparameters } = row
+        const filterItem = this.formatDefault(passparameters, row)
+        if (!Object.keys(filterItem).length) return
+        this.nodeItems = this.nodeItems.splice(0, 1)
+        this.getSelectData('nodedata', 15, filterItem)
+      }
+    },
+    //格式化传递参数数据
+    formatDefault (item, data = {}) {
+      if (typeof item != 'string') return {}
+      const filterItem = {}
+      const parameters = item.replace('{', '').replace('}', '')
+      const parametersSplit = parameters?.split(',')
+      parametersSplit.map(item => {
+        const [key, val] = item?.split(':')
+        filterItem[key] = data[val]
+      })
+      return filterItem
+    },
+    //获取表单下拉数据
+    changeSelect (name, code) {
+      switch (name) {
+        case 'algorithmtype':
+          const nstr = _.cloneDeep(code).toString().toLocaleLowerCase()
+          const item = this.selectType.filter(item => item.code == code)
+          if (!item?.length) return
+          const id = item[0].id
+          this.getSelectData('algorithmname', 20, { superiorid: id })
+          this.getSelectData('datasourceid', 12, { datasourcetype: code })
+          break;
+        default:
+          break;
+      }
+    },
+    setFormSelectData (name, returnData) {
+      switch (name) {
+        case 'serviceid':
+          this.selectService = [...returnData]
+          break;
+        case 'algorithmtype':
+          this.selectType = [...returnData]
+          break;
+        case 'algorithmname':
+          this.selectAlgorithm = [...returnData]
+          break;
+        case 'datasourceid':
+          this.selectSource = [...returnData]
+          break
+        case 'datatable':
+          this.tableData = [...returnData]
+          break
+        case 'nodedata':
+          //executionorder
+          const newItems = _.orderBy([...returnData], ['executionorder'], ['desc'])
+          this.nodeItems = [...this.nodeItems, ...newItems]
+          break
+        default:
+          break;
+      }
+    },
+    //步骤新增
+    handleAdd (obj) {
+      this.type = 'add'
+      this.advancedDrawer = obj.flag
+      this.tableData = []
+    },
+    //步骤编辑
+    handleEdit (item) {
+      const data = _.cloneDeep(item)
+      const { algorithmlibraryid } = data
+      if (!algorithmlibraryid) return
+      this.advancedDrawer = true
+      this.tabFlag = true
+      this.tableForm = data
+      this.getSelectData('datatable', 24, { algorithmlibraryid })
+    },
+    //步骤删除
+    handleDel (obj) {
+      this.type = 'del'
+      const item = _.cloneDeep(obj)
+      const { algorithmname } = item
+      this.$confirm(`确认要删除 ${algorithmname} 这条信息吗?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.generalDataReception(3, this.formatDataNull(item), 'algorithmlibraryid')
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    //弹框关闭
+    advancedClose () {
+      this.clearState()
+    },
+    //弹框确定
+    advancedTable () {
+      console.log(this.tableData)
+      return
+      const data = _.cloneDeep(this.tableForm)
+      data.serviceid = this.msgContent.serviceid
+      data.algorithmtype = this.formInline.algorithmtype
+      data.algorithmsourcelibraryid = this.radio3
+      const event = this.type == 'add' ? 1 : this.type == 'edit' ? 2 : 3
+      this.generalDataReception(event, this.formatDataNull(data))
+    },
+    //状态清除
+    clearState () {
+      this.formInline.algorithmtype = ''
+      this.radio3 = ''
+      this.selectAlgorithm = []
+      for (const key in this.tableForm) {
+        if (Object.hasOwnProperty.call(this.tableForm, key)) {
+          this.tableForm[key] = null
+        }
+      }
+      this.advancedDrawer = false
+      this.tabFlag = false
+      this.loading = false
+      this.tableDrawer = false
+    },
+    formatDataNull (params) {
+      const obj = _.cloneDeep(params)
+      for (const key in obj) {
+        if (Object.hasOwnProperty.call(obj, key)) {
+          const element = obj[key]
+          if (!element) {
+            obj[key] = null
+          }
+        }
+      }
+      return obj
+    },
+    //表格-增/删/改
+    async generalDataReception (event, data, key) {
+      try {
+        const params = {
+          serviceid: this.pageServiceId,
+          datacontent: formatChange(data, event, key),
+          event: `${event}`,
+        };
+        const { code } =
+          event == 1
+            ? await newData(params)
+            : event == 2
+              ? await modifyData(params)
+              : await moveData(params);
+        if (code == 0) {
+          this.$message.success("操作成功")
+          this.restTable()
+          this.clearState()
+        } else {
+          this.$message.error("操作失败")
+          this.clearState()
+        }
+      } catch (error) {
+        this.clearState()
+        console.log(error)
+      }
+    },
+    restTable () {
+      this.setTableData(this.msgContent)
+    },
+    formatData (name) {
+      return typeof name == 'string' ? name.toLocaleLowerCase() : name
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.accessPageNode {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  justify-content: center;
+  align-items: center;
+  overflow-y: scroll;
+  &-items {
+    text-align: center;
+  }
+  .advancedNode {
+    text-align: left;
+  }
+}
+</style>

src/views/dataAccessPage/components/accessPageNode.vue

@@ -1,92 +1,16 @@
 <template>
   <div class="accessPageNode">
     <div style="height: 100%;" class="accessPageNode-items">
-      <nodeBtn v-for="(item,index) in nodeItems" :nodeIndex="index" :nodeItem="item" :nodeTxt="item.algorithmname" :isLine="item.isLine" :isDel="item.isDel" :key="index" @handleAdd="handleAdd" @handleDel="handleDel" @handleEdit="handleEdit" />
+      <node-btn v-for="(item,index) in nodeItems" :nodeIndex="index" :nodeItem="item" :nodeTxt="item.algorithmname" :isLine="item.isLine" :isDel="item.isDel" :key="index" @handleAdd="handleAdd" @handleDel="handleDel" @handleEdit="handleEdit" />
     </div>
     <PublicPageDialog class="advancedNode" :dialog-title="dialogTitle" dialogSize="600px" :dialog-drawer="advancedDrawer" @handleClose="advancedClose" @handleSubmit="advancedTable">
-      <div v-if="!tabFlag" class="nodeForm">
-        <el-form :inline="true" :model="formInline" class="nodeForm-inline">
-          <el-form-item label="分类">
-            <el-select size="small" v-model="formInline.algorithmtype" @change="changeSelect('algorithmtype',formInline.algorithmtype)" clearable placeholder="全部分类">
-              <el-option v-for="(item,index) in selectType" :key="index" :label="item.name" :value="item.code"></el-option>
-            </el-select>
-          </el-form-item>
-        </el-form>
-        <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" style="margin-top: 20px">
-          <template v-if="selectAlgorithm.length">
-            <el-radio-group style="width: 100%;" v-model="radio3" size="small">
-              <el-row :gutter="20">
-                <el-col style="margin-bottom: 20px;" v-for="(item,index) in selectAlgorithm" :key="index" :span="8">
-                  <el-radio :label="item.id" border>{{ item.name }}</el-radio>
-                </el-col>
-              </el-row>
-            </el-radio-group>
-          </template>
-          <template v-else>
-            <el-empty description="暂无数据"></el-empty>
-          </template>
-        </div>
-      </div>
-      <div v-else class="nodeItemForm">
-        <el-form ref="ruleForm" :model="tableForm" label-width="100px">
-          <el-row :gutter="20">
-            <el-col :span="24">
-              <el-form-item prop="algorithmname" label="算法名称">
-                <el-input size="small" v-model="tableForm.algorithmname" placeholder="请输入" />
-              </el-form-item>
-            </el-col>
-            <el-col v-if="formatData(formInline.algorithmtype) == 'java' || formatData(formInline.algorithmtype) == 'db' || formatData(formInline.algorithmtype) == 'kafka'" :span="24">
-              <el-form-item prop="datasourceid" label="数据源">
-                <el-select size="small" v-model="tableForm.datasourceid" @change="changeSelectSocure('datasourceid')" placeholder="请选择">
-                  <el-option v-for="(item,index) in selectSource" :key="index" :label="item.datasourcedescribe" :value="item.datasourceid"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col v-if="formatData(formInline.algorithmtype) != 'js'" :span="24">
-              <el-form-item prop="targetsource" label="数据源目标">
-                <el-input size="small" v-model="tableForm.targetsource"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item prop="executionorder" label="执行排序">
-                <el-input size="small" v-model="tableForm.executionorder"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item prop="algorithmdescription" label="算法说明">
-                <el-input size="small" v-model="tableForm.algorithmdescription"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item prop="computingexpression" label="计算表达式">
-                <el-input size="small" type="textarea" v-model="tableForm.computingexpression"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item prop="preconditions" label="执行条件">
-                <el-input size="small" type="textarea" v-model="tableForm.preconditions"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item prop="preparameterset" label="前置条件参数">
-                <el-input size="small" type="textarea" v-model="tableForm.preparameterset"></el-input>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </el-form>
-        <el-table :data="tableData" border style="width: 100%">
-          <el-table-column prop="name" label="参数名">
-            <template slot-scope="scope">
-              <el-input size="small" v-model="scope.row.name" placeholder="请输入参数名" />
-            </template>
-          </el-table-column>
-          <el-table-column prop="code" label="参数订阅规则">
-            <template slot-scope="scope">
-              <el-input size="small" v-model="scope.row.code" placeholder="请输入参数订阅规则" />
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
+      <template v-if="!tabFlag">
+        <node-class />
+      </template>
+      <template v-else>
+        <node-form />
+        <node-table />
+      </template>
     </PublicPageDialog>
   </div>
 </template>
@@ -94,11 +18,14 @@
 <script>
 import PublicPageDialog from '@/components/PublicPageDialog'
 import nodeBtn from './accessPageNodeBtn.vue'
+import nodeClass from './nodeClass.vue'
+import nodeForm from './nodeForm.vue'
+import nodeTable from './nodeTable.vue'
 import { Query, newData, modifyData, moveData } from "@/api/webApi"
-import { formatChange } from '@/utils/validate'
+import { formatChange, getTableCols } from '@/utils/validate'
 export default {
   name: 'AccessPageNode',
-  components: { nodeBtn, PublicPageDialog },
+  components: { nodeBtn, PublicPageDialog, nodeClass, nodeForm, nodeTable },
   props: {
     msgContent: {
       type: Object,
@@ -116,49 +43,14 @@ export default {
           isDel: false
         }
       ],
-      formInline: {
-        algorithmtype: '',
-      },
-      tableForm: {
-        serviceid: '',
-        preconditions: '',
-        algorithmtype: '',
-        algorithmname: '',
-        algorithmsourcelibraryid: '',
-        executionorder: '',
-        targetsource: '',
-        datasourceid: '',
-        computingexpression: '',
-        algorithmdescription: '',
-        preparameterset: ''
-      },
-      editTableForm: {
-        name: '',
-        code: ''
-      },
-      nodeIndex: '',
-      selectType: [],
-      selectAlgorithm: [],
-      selectSource: [],
-      radio3: '',
       dialogTitle: '添加步骤',
       advancedDrawer: false,
-      tableDrawer: false,
-      tableData: [],
       pageServiceId: 15,
+      pageTableId: 24,
       type: 'add'
     }
   },
   watch: {
-    radio3: {
-      handler (val) {
-        if (val) {
-          this.tabFlag = true
-          this.getSelectData('datatable', 20, { superiorid: val })
-        }
-      },
-      deep: true
-    },
     msgContent: {
       handler (row) {
         this.setTableData(row)
@@ -206,21 +98,7 @@ export default {
       })
       return filterItem
     },
-    //获取表单下拉数据
-    changeSelect (name, code) {
-      switch (name) {
-        case 'algorithmtype':
-          const nstr = _.cloneDeep(code).toString().toLocaleLowerCase()
-          const item = this.selectType.filter(item => item.code == code)
-          if (!item?.length) return
-          const id = item[0].id
-          this.getSelectData('algorithmname', 20, { superiorid: id })
-          this.getSelectData('datasourceid', 12, { datasourcetype: code })
-          break;
-        default:
-          break;
-      }
-    },
+
     setFormSelectData (name, returnData) {
       switch (name) {
         case 'serviceid':
@@ -239,7 +117,9 @@ export default {
           this.tableData = [...returnData]
           break
         case 'nodedata':
-          this.nodeItems = [...this.nodeItems, ...returnData]
+          //executionorder
+          const newItems = _.orderBy([...returnData], ['executionorder'], ['desc'])
+          this.nodeItems = [...this.nodeItems, ...newItems]
           break
         default:
           break;
@@ -249,14 +129,17 @@ export default {
     handleAdd (obj) {
       this.type = 'add'
       this.advancedDrawer = obj.flag
-      this.nodeIndex = obj.nodeIndex
+      this.tableData = []
     },
     //步骤编辑
     handleEdit (item) {
+      const data = _.cloneDeep(item)
+      const { algorithmlibraryid } = data
+      if (!algorithmlibraryid) return
       this.advancedDrawer = true
       this.tabFlag = true
-      const data = _.cloneDeep(item)
       this.tableForm = data
+      this.getSelectData('datatable', 24, { algorithmlibraryid })
     },
     //步骤删除
     handleDel (obj) {
@@ -282,7 +165,6 @@ export default {
     },
     //弹框确定
     advancedTable () {
-      console.log(this.tableData)
       return
       const data = _.cloneDeep(this.tableForm)
       data.serviceid = this.msgContent.serviceid
@@ -291,33 +173,11 @@ export default {
       const event = this.type == 'add' ? 1 : this.type == 'edit' ? 2 : 3
       this.generalDataReception(event, this.formatDataNull(data))
     },
-    //编辑弹框-打开
-    editTable (row) {
-      this.tableDrawer = true
-      this.editTableForm = _.cloneDeep(row)
-    },
-    //编辑弹框-关闭
-    tableClose () {
-      this.tableDrawer = false
-    },
-    //编辑弹框-确定
-    tableSubmit () {
-      this.tableDrawer = false
-    },
     //状态清除
     clearState () {
-      this.formInline.algorithmtype = ''
-      this.radio3 = ''
-      this.selectAlgorithm = []
-      for (const key in this.tableForm) {
-        if (Object.hasOwnProperty.call(this.tableForm, key)) {
-          this.tableForm[key] = null
-        }
-      }
       this.advancedDrawer = false
       this.tabFlag = false
       this.loading = false
-      this.tableDrawer = false
     },
     formatDataNull (params) {
       const obj = _.cloneDeep(params)

src/views/dataAccessPage/components/nodeClass.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="nodeClass">
+    <el-form :inline="true" :model="formInline" class="nodeForm-inline">
+      <el-form-item label="分类">
+        <el-select size="small" v-model="formInline.algorithmtype" @change="changeSelect('algorithmtype',formInline.algorithmtype)" clearable placeholder="全部分类">
+          <el-option v-for="(item,index) in selectType" :key="index" :label="item.name" :value="item.code"></el-option>
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" style="margin-top: 20px">
+      <template v-if="selectAlgorithm.length">
+        <el-radio-group style="width: 100%;" v-model="algorithmid" size="small">
+          <el-row :gutter="20">
+            <el-col style="margin-bottom: 20px;" v-for="(item,index) in selectAlgorithm" :key="index" :span="8">
+              <el-radio :label="item.id" border>{{ item.name }}</el-radio>
+            </el-col>
+          </el-row>
+        </el-radio-group>
+      </template>
+      <template v-else>
+        <el-empty description="暂无数据"></el-empty>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getQueryData } from '../utils/index'
+export default {
+  name: 'NodeClass',
+  data () {
+    return {
+      loading: false,
+      selectAlgorithm: [],
+      selectType: [],
+      formInline: {
+        algorithmtype: '',
+      },
+      algorithmid: ''
+    }
+  },
+  mounted () {
+    this.getSelectData('algorithmtype', 20, { type: 'category' })
+  },
+  methods: {
+    async getSelectData (pagecode, serviceid, datacontent) {
+      if (pagecode != 'algorithmtype') {
+        this.loading = true
+      }
+      const { code, returnData } = await getQueryData(serviceid, datacontent)
+      if (code == 0) this.setFormSelectData(pagecode, returnData)
+      this.loading = false
+    },
+    setFormSelectData (name, returnData) {
+      switch (name) {
+        case 'algorithmtype':
+          this.selectType = [...returnData]
+          break;
+        case 'algorithmname':
+          this.selectAlgorithm = [...returnData]
+          break;
+        case 'datasourceid':
+          sessionStorage.setItem('nodeDatasource', JSON.stringify([...returnData]))
+          break
+        default:
+          break;
+      }
+    },
+    //获取表单下拉数据
+    changeSelect (name, code) {
+      switch (name) {
+        case 'algorithmtype':
+          const item = this.selectType.filter(item => item.code == code)
+          const id = item[0].id
+          this.getSelectData('algorithmname', 20, { superiorid: id })
+          this.getSelectData('datasourceid', 12, { datasourcetype: code })
+          break;
+        default:
+          break;
+      }
+    },
+  }
+}
+</script>
+
+<style>
+</style>

src/views/dataAccessPage/components/nodeForm.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="nodeForm">
+    <el-form ref="ruleForm" :model="tableForm" label-width="100px">
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item prop="algorithmname" label="算法名称">
+            <el-input size="small" v-model="tableForm.algorithmname" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+        <el-col v-if="formatData(algorithmtype) == 'java' || formatData(algorithmtype) == 'db' || formatData(algorithmtype) == 'kafka'" :span="24">
+          <el-form-item prop="datasourceid" label="数据源">
+            <el-select size="small" v-model="tableForm.datasourceid" placeholder="请选择">
+              <el-option v-for="(item,index) in selectSource" :key="index" :label="item.datasourcedescribe" :value="item.datasourceid"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col v-if="formatData(algorithmtype) != 'js'" :span="24">
+          <el-form-item prop="targetsource" label="数据源目标">
+            <el-input size="small" v-model="tableForm.targetsource"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item prop="executionorder" label="执行排序">
+            <el-input size="small" v-model="tableForm.executionorder"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item prop="algorithmdescription" label="算法说明">
+            <el-input size="small" v-model="tableForm.algorithmdescription"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item prop="computingexpression" label="计算表达式">
+            <el-input size="small" type="textarea" v-model="tableForm.computingexpression"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item prop="preconditions" label="执行条件">
+            <el-input size="small" type="textarea" v-model="tableForm.preconditions"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item prop="preparameterset" label="前置条件参数">
+            <el-input size="small" type="textarea" v-model="tableForm.preparameterset"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'NodeForm',
+  props: {
+    algorithmtype: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      tableForm: {
+        serviceid: '',
+        preconditions: '',
+        algorithmtype: '',
+        algorithmname: '',
+        algorithmsourcelibraryid: '',
+        executionorder: '',
+        targetsource: '',
+        datasourceid: '',
+        computingexpression: '',
+        algorithmdescription: '',
+        preparameterset: ''
+      },
+    }
+  },
+  methods: {
+    formatData (name) {
+      return typeof name == 'string' ? name.toLocaleLowerCase() : name
+    },
+  }
+}
+</script>
+
+<style>
+</style>

src/views/dataAccessPage/components/nodeTable.vue

@@ -0,0 +1,27 @@
+<template>
+  <div class="nodeTable">
+    <el-table :data="tableData" border style="width: 100%">
+      <el-table-column v-for="col in tableCols" :key="col.pagecode" :prop="col.pagecode" :label="col.pagename" :width="col.displaywidth+'px'">
+        <template slot-scope="scope">
+          <el-input size="small" v-model="scope.row[col.pagecode]" :placeholder="'请输入'+col.pagename" />
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import { formatChange, getTableCols } from '@/utils/validate'
+export default {
+  name: 'NodeTable',
+  data () {
+    return {
+      tableCols: [],
+      tableData: []
+    }
+  }
+}
+</script>
+
+<style>
+</style>

src/views/dataAccessPage/utils/index.js

@@ -0,0 +1,6 @@
+import { Query, newData, modifyData, moveData } from "@/api/webApi"
+
+export function getQueryData (serviceid, datacontent) {
+  datacontent = { filter: datacontent }
+  return Query({ serviceid: serviceid, datacontent, event: '0', page: 1, size: 9999 })
+}