dz2.1/src/views/dataAccessPage/components/nodeForm.vue

<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="算法说明">
            <span slot="label">
              算法说明
              <el-tooltip content="算法说明" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input size="small" v-model="tableForm.algorithmdescription"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="preconditions" label="执行条件">
            <span slot="label">
              执行条件
              <el-tooltip content="执行条件" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input size="small" type="textarea" @focus="setPreconditions" v-model="tableForm.preconditions"></el-input>
          </el-form-item>
        </el-col>
        <!-- v-if="formatData(algorithmtype) == 'js'" :span="24" -->
        <el-col>
          <el-form-item prop="computingexpression" label="计算表达式">
            <span slot="label">
              计算表达式
              <el-tooltip content="计算表达式" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <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="preparameterset" label="前置条件参数">
            <el-input size="small" type="textarea" v-model="tableForm.preparameterset"></el-input>
          </el-form-item>
        </el-col> -->
      </el-row>
    </el-form>
    <nodeType ref="nodeType" @getColumnData="getColumnData" />
  </div>
</template>

<script>
import nodeType from './nodeType.vue'
export default {
  name: 'NodeForm',
  components: { nodeType },
  props: {
    algorithmtype: {
      type: String,
      default: ''
    },
    nodeForm: {
      type: Object,
      default: () => new Object()
    }
  },
  data () {
    return {
      tableForm: {
        serviceid: '',
        preconditions: '',
        algorithmname: '',
        algorithmsourcelibraryid: '',
        executionorder: '',
        targetsource: '',
        datasourceid: '',
        computingexpression: '',
        algorithmdescription: sessionStorage.getItem('nodeTreeTxt') || '',
        preparameterset: ''
      },
      selectSource: JSON.parse(sessionStorage.getItem('nodeDatasource')) || []
    }
  },
  watch: {
    nodeForm: {
      handler (obj) {
        if (Object.keys(obj).length) {
          this.tableForm = _.cloneDeep(obj)
        }
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    formatData (name) {
      return typeof name == 'string' ? name.toLocaleLowerCase() : name
    },
    setPreconditions () {
      this.$refs['nodeType'].showCron = true
    },
    getColumnData (str) {
      this.$set(this.tableForm, 'preconditions', str)
    }
  }
}
</script>

<style>
</style>