修改

src/views/dataAccessPage/components/accessPageNode.vue

@@ -333,7 +333,11 @@ export default {
     },
     async tableColumnData (event = 2, msgs = [], key = 'algorithmparametersid') {
       const res = msgs.length == 0 ? this.$refs['nodeTable'].tableData : msgs
-      if (!res.length) return
+      if (!res.length) {
+        this.restTable()
+        this.clearState()
+        return
+      }
       // this.tabLoadFlag = true
       const items = _.cloneDeep(res)
       const datas = []

src/views/dataAccessPage/components/advanceQuery.vue

@@ -0,0 +1,570 @@
+<template>
+  <div class="AdvancedQuery">
+    <div class="AdvancedQuery_from">
+      <el-scrollbar style="height: 100%" :horizontal="false">
+        <el-form ref="paramsForm" class="query-params" :model="paramsForm" :rules="paramsForm.validateRules">
+          <el-row class="query-params-wrapper">
+            <el-col v-for="(row, rowIndex) in paramsForm.params" class="query-params-wrapper-list flex-wrap" :key="rowIndex" :span="24">
+              <el-form-item v-for="(col, colIndex) in paramsTableCols" :key="colIndex" :prop="'params.' + rowIndex + '.' + col.prop" :rules="paramsForm.validateRules[col.prop]">
+                <template v-if="
+                  col.prop === 'comparisonOperator' ||
+                  col.inputType[rowIndex] === 'select'
+                ">
+                  <el-select filterable clearable size="small" v-model="row[col.prop]" placeholder="请选择" @change="
+                    value => {
+                      selectChangeHandler(value, rowIndex, colIndex)
+                    }
+                  ">
+                    <el-option v-for="(option, i) in col.options[rowIndex]" :key="i" :value="option.value" :label="option.label" />
+                  </el-select>
+                </template>
+                <template v-else-if="col.inputType === 'select'">
+                  <el-input v-model="row[col.prop]" size="small" placeholder="请输入" />
+                </template>
+                <template v-else-if="
+                  ['varchar', 'text', 'longtext'].includes(
+                    col.inputType[rowIndex]
+                  )
+                ">
+                  <el-input v-model="row[col.prop]" size="small" placeholder="请输入" :disabled="
+                    col.prop === 'paramValue' && paramsForm.disabled[rowIndex]
+                  " />
+                </template>
+                <template v-else-if="col.inputType === 'connector'">
+                  <div v-if="row.connector" class="clickable-toggle" @click="toggle(rowIndex)">
+                    {{ row.connector === 'and' ? '并且' : '或者' }}
+                  </div>
+                  <div v-else class="clickable-add" @click="addParamsHandler">
+                    <span class="el-icon-circle-plus-outline"></span>
+                  </div>
+                </template>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-scrollbar>
+    </div>
+    <div v-if="adList" class="AdvancedQuery_list">
+      <el-scrollbar style="height: 100%" :horizontal="false">
+        <div v-for="(item,index) in catchOptions" :key="index">
+          <div style="cursor: pointer;" class="flex">
+            <span @click="queryRecover(item)" class="AdvancedQuery_list_text">{{ item.itemKey }}</span>
+            <el-popconfirm @confirm="queryConfirm(item,index)" :title="'确定删除'+item.itemKey+'吗？'">
+              <el-button slot="reference" type="text">删除</el-button>
+            </el-popconfirm>
+          </div>
+          <el-divider v-if="catchOptions.length != index+1"></el-divider>
+        </div>
+      </el-scrollbar>
+    </div>
+  </div>
+</template>
+
+<script>
+import { parseTime } from '@/utils/index'
+import { mapGetters } from 'vuex'
+import { Query } from "@/api/webApi"
+const comparisonOperatorOptions = [
+  {
+    label: '小于',
+    value: '<',
+  },
+  {
+    label: '大于',
+    value: '>',
+  },
+  {
+    label: '等于',
+    value: '=',
+  },
+  {
+    label: '不等于',
+    value: '!=',
+  },
+  {
+    label: '不为空',
+    value: 'notNull',
+  },
+  {
+    label: '包含',
+    value: 'like',
+  },
+]
+export default {
+  name: 'AdvancedQueryForm',
+  props: {
+    selectOptions: {
+      type: Array,
+      default: () => []
+    },
+    adList: {
+      type: Boolean,
+      default: true
+    },
+    adDep: {
+      type: Number,
+      default: 1
+    }
+  },
+  data () {
+    return {
+      queryContent: [],
+      catchOptions: JSON.parse(localStorage.getItem(this.$route.path)) || [],
+      catchOptionsAll: [JSON.parse(localStorage.getItem(this.$route.path))] || [],
+      flightDate: new Array(2).fill(parseTime(new Date(), '{y}-{m}-{d}')),
+      paramsForm: {
+        params: [],
+        validateRules: {
+          paramKey: [
+            {
+              required: true,
+              message: '请输入值',
+              trigger: ['change', 'blur'],
+            },
+          ],
+          paramValue: [
+            {
+              required: true,
+              message: '请输入值',
+              trigger: ['change', 'blur'],
+            },
+          ],
+        },
+        disabled: [],
+      },
+      checkValue: '',
+      paramsTableCols: [
+        {
+          prop: 'paramKey',
+          // label: '项',
+          inputType: 'select',
+          options: [],
+        },
+        {
+          prop: 'comparisonOperator',
+          // label: '比较符',
+          inputType: 'select',
+          options: new Array(2).fill(
+            comparisonOperatorOptions
+          ),
+        },
+        {
+          prop: 'paramValue',
+          // label: '值',
+          inputType: [],
+          options: [],
+        },
+        {
+          prop: 'delete',
+          inputType: 'delete',
+        },
+        {
+          prop: 'connector',
+          // label: '连接',
+          inputType: 'connector',
+        },
+      ],
+      columnSet: {},
+    }
+  },
+  computed: {
+    ...mapGetters(['authMsg']),
+  },
+  watch: {
+    'paramsForm.params': {
+      handler (params) {
+        const { length } = params
+        params[length - 1].connector = ''
+        if (params[length - 2] && !params[length - 2].connector) {
+          params[length - 2].connector = 'and'
+        }
+      },
+    },
+    adDep: {
+      handler () {
+        this.queryHandler()
+      },
+      deep: true
+    },
+    selectOptions: {
+      handler (arr) {
+        if (arr && arr.length) {
+          const datas = []
+          const types = []
+          this.paramsForm.params = []
+          arr.forEach(item => {
+            if (isNaN(item.value) && !isNaN(Date.parse(item.value))) {
+              types.push('date')
+            } else {
+              types.push('text')
+            }
+            const paramValue = ['is Null', 'is not Null'].includes(
+              item.comparisonOperator
+            )
+              ? ' '
+              : item.value
+            const obj = {
+              // leftBrackets: item.left,
+              paramKey: item.column,
+              comparisonOperator: item.comparator,
+              // rightBrackets: item.right,
+              paramValue,
+              connector: item.connector,
+            }
+            datas.push(obj)
+          })
+          this.queryHandler()
+          setTimeout(() => {
+            this.paramsTableCols[1].options = new Array(arr.length).fill(
+              comparisonOperatorOptions.slice(0, 5).reverse()
+            )
+            this.paramsTableCols[2].inputType = types
+            this.paramsForm.params = datas
+          }, 200)
+        } else {
+          this.paramsForm.params = []
+        }
+      },
+      deep: true,
+      immediate: true,
+    }
+  },
+  mounted () {
+    this.queryHandler()
+  },
+  methods: {
+    queryHandler () {
+      this.columnSet = {}
+      this.paramsTableCols[0].options = []
+      const colDatas = this.authMsg
+      if (colDatas?.length) {
+        // const columns = colDatas.filter(item => item.isfiltercolumn)
+        const columns = colDatas.filter(item => item.isfiltercolumn)
+        const datas = _.orderBy(columns, ['displaynumber'], ['asc', 'desc'])
+        this.getColumnSet(datas)
+      }
+      if (!this.paramsForm.params.length) {
+        this.addParamsHandler()
+      }
+    },
+    advancedQueryHandler (Jump = false) {
+      try {
+        this.$refs['paramsForm'].validate(valid => {
+          if (!valid) {
+            throw new Error()
+          }
+        })
+        const queryContent = []
+        const params = this.paramsForm.params
+        const len = params.length
+        for (let i = 0; i < len; i++) {
+          const prev = params[i - 1]
+          const current = params[i]
+          const next = params[i + 1]
+          const value = ['is Null', 'is not Null'].includes(
+            current.comparisonOperator
+          )
+            ? ''
+            : current.paramValue
+          const obj = {
+            column: current.paramKey,
+            comparator: current.comparisonOperator,
+            value,
+            connector: current.connector,
+          }
+          if (
+            !prev ||
+            prev.connector === 'and' ||
+            (prev.paramKey && prev.paramKey !== current.paramKey)
+          ) {
+            obj.left = '('
+          } else {
+            obj.left = ''
+          }
+          if (
+            !next ||
+            current.connector === 'and' ||
+            (next.paramKey && next.paramKey !== current.paramKey)
+          ) {
+            obj.right = ')'
+          } else {
+            obj.right = ''
+          }
+          queryContent.push(obj)
+        }
+        this.queryContent = queryContent
+        if (!Jump) {
+          this.sendColData()
+        }
+      } catch (error) {
+        error.message && this.$message.error(error.message)
+      }
+    },
+    sendColData () {
+      this.$emit('getAdvancedQueryData', this.queryContent)
+    },
+    addParamsHandler () {
+      this.paramsTableCols[2].inputType.push('text')
+      this.paramsForm.params.push({
+        paramKey: '',
+        comparisonOperator: '',
+        paramValue: '',
+        connector: '',
+      })
+    },
+    async selectChangeHandler (value, rowIndex, colIndex) {
+      if (colIndex === 0) {
+        // const datas = this.tableColMunt.filter(item => item.columnName == value)
+        const { datatype, dropdownlistid, dropdownlistlabel, dropdownlist, defaultparameters } = this.columnSet[value]
+        // const { dataType, options } = datas[0]
+        // 下拉框发生改变清空之前的数据
+        this.paramsForm.params[rowIndex].paramValue = ''
+        if (datatype === 'date') {
+          this.paramsTableCols[1].options[rowIndex] = comparisonOperatorOptions
+            .slice(0, 5)
+            .reverse()
+          this.paramsTableCols[2].inputType[rowIndex] = 'date'
+        } else if (datatype === 'datetime') {
+          this.paramsTableCols[1].options[rowIndex] = comparisonOperatorOptions
+            .slice(0, 5)
+            .reverse()
+          this.paramsTableCols[2].inputType[rowIndex] = 'datetime'
+        } else if (dropdownlist || dropdownlist == 0) {
+          const datacontent = defaultparameters ? { filter: this.formatDefault(defaultparameters) } : { filter: { 1: 1 } }
+          const { code, returnData } = await Query({ serviceid: dropdownlist, datacontent, event: '0', page: 1, size: 9999 })
+          if (code == 0 && returnData?.length) {
+            returnData.map(item => {
+              item.label = item[dropdownlistlabel],
+                item.value = item[dropdownlistid]
+            })
+          }
+          this.paramsTableCols[1].options[rowIndex] =
+            comparisonOperatorOptions.slice(4, 5)
+          this.paramsTableCols[2].inputType[rowIndex] = 'select'
+          this.paramsTableCols[2].options[rowIndex] = returnData || []
+          this.paramsForm.params[rowIndex].paramValue = ''
+        } else if (datatype === 'number') {
+          this.paramsTableCols[1].options[rowIndex] = comparisonOperatorOptions
+            .slice(0, 5)
+            .reverse()
+          this.paramsTableCols[2].inputType[rowIndex] = 'number'
+          this.paramsForm.params[rowIndex].paramValue = ''
+        } else {
+          this.paramsTableCols[1].options[rowIndex] =
+            comparisonOperatorOptions.slice(4)
+          this.paramsTableCols[2].inputType[rowIndex] = 'text'
+        }
+        this.paramsForm.params[rowIndex].comparisonOperator =
+          this.paramsTableCols[1].options[rowIndex][0].value
+      } else if (colIndex === 1) {
+        if (['is Null', 'is not Null'].includes(value)) {
+          this.paramsForm.params[rowIndex].paramValue = ' '
+          this.paramsForm.disabled[rowIndex] = true
+        } else {
+          this.paramsForm.disabled[rowIndex] = false
+        }
+      }
+    },
+    //格式化传递参数数据
+    formatDefault (item) {
+      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] = val
+      })
+      return filterItem
+    },
+    inputHold (value) {
+      this.checkValue = value
+    },
+    inputLimit (value, rowIndex) {
+      if (!/^[\-|\+]?((([1-9][0-9]*)|0)(\.[0-9]{0,2})?)?$/.test(value)) {
+        this.paramsForm.params[rowIndex].paramValue = this.checkValue
+      }
+    },
+    inputFix (value, rowIndex) {
+      if (value?.at(-1) === '.') {
+        this.paramsForm.params[rowIndex].paramValue = value.slice(0, -1)
+      }
+    },
+    deleteParam (rowIndex) {
+      if (this.paramsTableCols[2].inputType.length > 1 && this.paramsForm.params.length > 1) {
+        this.paramsTableCols[2].inputType.splice(rowIndex, 1)
+        this.paramsForm.params.splice(rowIndex, 1)
+        this.paramsForm.disabled.splice(rowIndex, 1)
+      }
+    },
+    toggle (rowIndex) {
+      const { connector } = this.paramsForm.params[rowIndex]
+      this.paramsForm.params[rowIndex].connector =
+        connector === 'and' ? 'or' : 'and'
+    },
+    getColumnSet (columnSet) {
+      const reflect = {}
+      columnSet.forEach(async item => {
+        if (!this.columnSet[item.pagecode]) {
+          this.columnSet[item.pagecode] = item
+
+          this.paramsTableCols[0].options.push({
+            label: item.pagename,
+            value: item.pagecode,
+          })
+        }
+      })
+    },
+    //重置
+    advancedRestCollect () {
+      this.paramsTableCols[2].inputType = []
+      this.paramsForm.params = []
+      this.queryHandler()
+      this.$nextTick(() => {
+        this.$refs['paramsForm'].resetFields()
+      })
+    },
+    //收藏
+    advancedQueryCollect () {
+      this.advancedQueryHandler(true)
+      if (!this.queryContent.length) return
+      this.$prompt('请输入收藏标题', '收藏', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        inputPattern: /^.+$/,
+        inputErrorMessage: '请输入收藏标题'
+      }).then(({ value }) => {
+        this.catchOptionsAll.push(this.queryContent)
+        const catchItem = {
+          itemId: this.catchOptionsAll.length,
+          itemKey: value,
+          itemVal: this.catchOptionsAll?.at(-1)
+        }
+        this.catchOptions.push(catchItem)
+        localStorage.setItem(this.$route.path, JSON.stringify(this.catchOptions))
+        this.$message.success('收藏成功')
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '取消输入'
+        });
+      });
+    },
+    //删除收藏
+    queryConfirm (item, index) {
+      const catchCopy = this.catchOptions
+      catchCopy.splice(index, 1)
+      this.catchOptionsAll = []
+      this.catchOptionsAll = [catchCopy]
+      localStorage.setItem(this.$route.path, JSON.stringify(catchCopy))
+    },
+    //收藏查询
+    queryRecover (item) {
+      const { itemVal } = item
+      this.queryRecoverFunc(itemVal)
+    },
+    //查询恢复
+    queryRecoverFunc (itemArray) {
+      if (!itemArray.length) return
+      const [datas, types] = [[], []]
+      itemArray.forEach(item => {
+        if (isNaN(item.value) && !isNaN(Date.parse(item.value))) {
+          types.push('date')
+        } else {
+          types.push('text')
+        }
+        const paramValue = ['is Null', 'is not Null'].includes(
+          item.comparisonOperator
+        )
+          ? ' '
+          : item.value
+        const obj = {
+          // leftBrackets: item.left,
+          paramKey: item.column,
+          comparisonOperator: item.comparator,
+          // rightBrackets: item.right,
+          paramValue,
+          connector: item.connector,
+        }
+        datas.push(obj)
+      })
+      this.queryHandler()
+      setTimeout(() => {
+        this.paramsTableCols[1].options = new Array(itemArray.length).fill(
+          comparisonOperatorOptions.slice(0, 5).reverse()
+        )
+        this.paramsTableCols[2].inputType = types
+        this.paramsForm.params = datas
+      }, 200)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AdvancedQuery {
+  height: calc(100vh - 172px);
+  position: relative;
+  width: 100%;
+  &_from {
+    height: 80%;
+  }
+  &_list {
+    height: 20%;
+  }
+  .query-params-wrapper-list {
+    .el-form-item {
+      margin-right: 10px;
+      &:nth-child(3) {
+        margin-right: 0;
+      }
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+  }
+  .clickable-delete {
+    width: 39px;
+    height: 32px;
+    text-align: center;
+    line-height: 32px;
+    font-size: 20px;
+    margin-top: 4px;
+    border: 1px solid #dcdfe6;
+    border-left: none;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+    border-radius: 2px;
+    cursor: pointer;
+  }
+  .clickable-toggle {
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    text-decoration: underline;
+    color: #409eff;
+    cursor: pointer;
+  }
+  .clickable-add {
+    height: 32px;
+    text-align: center;
+    margin-top: 4px;
+    font-size: 20px;
+    cursor: pointer;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .clickable-wrapper {
+      width: 20px;
+      height: 20px;
+      line-height: 28px;
+      border-radius: 50%;
+      border: 1px solid #409eff;
+      color: #409eff;
+    }
+    &:hover .clickable-wrapper {
+      background-color: #409eff;
+      color: #fff;
+    }
+  }
+}
+</style>

src/views/dataAccessPage/components/nodeForm.vue

@@ -31,7 +31,7 @@
         </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-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" -->
@@ -47,12 +47,15 @@
         </el-col> -->
       </el-row>
     </el-form>
+    <nodeType ref="nodeType" />
   </div>
 </template>
 
 <script>
+import nodeType from './nodeType.vue'
 export default {
   name: 'NodeForm',
+  components: { nodeType },
   props: {
     algorithmtype: {
       type: String,
@@ -95,6 +98,9 @@ export default {
     formatData (name) {
       return typeof name == 'string' ? name.toLocaleLowerCase() : name
     },
+    setPreconditions () {
+      // this.$refs['nodeType'].showCron = true
+    }
   }
 }
 </script>

src/views/dataAccessPage/components/nodeType.vue

@@ -0,0 +1,44 @@
+<template>
+  <el-dialog title="生成执行条件" width="700px" top="10px" :close-on-click-modal="false" append-to-body :visible.sync="showCron">
+    <div class="content">
+      <advanceQuery ref="advanceQuery" :selectOptions="selectOptions" @getAdvancedQueryData="getAdvancedQueryData" />
+      <div style="text-align: right;" class="d-foot">
+        <el-button @click="showCron=false" size="small">取消</el-button>
+        <el-button @click="handleSubmit" type="primary" size="small">确定</el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import advanceQuery from './advanceQuery.vue'
+export default {
+  name: 'NodeType',
+  components: { advanceQuery },
+  data () {
+    return {
+      showCron: false,
+      selectOptions: [],
+      dataRules: ''
+    }
+  },
+  methods: {
+    getAdvancedQueryData (dataRules = []) {
+      const ndataRules = [...dataRules]
+      if (!ndataRules.length) return
+      let str = ''
+      ndataRules.map(({ column, comparator, value }) => {
+        if (comparator == 'like') {
+          str += column
+        }
+      })
+    },
+    handleSubmit () {
+      this.$refs['advanceQuery'].advancedQueryHandler()
+    }
+  }
+}
+</script>
+
+<style>
+</style>