update

src/api/quality/checkjob.js

@@ -8,6 +8,36 @@ export function pageCheckJob(data) {
   })
 }
 
+export function saveCheckJob(data) {
+  return request({
+    url: '/data/quality/scheduleJobs',
+    method: 'post',
+    data: data
+  })
+}
+
+export function updateCheckJob(data) {
+  return request({
+    url: '/data/quality/scheduleJobs/' + data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+export function delCheckJob(id) {
+  return request({
+    url: '/data/quality/scheduleJobs/' + id,
+    method: 'delete'
+  })
+}
+
+export function delCheckJobs(ids) {
+  return request({
+    url: '/data/quality/scheduleJobs/batch/' + ids,
+    method: 'delete'
+  })
+}
+
 export function pauseCheckJob(id) {
   return request({
     url: '/data/quality/scheduleJobs/pause/' + id,

src/views/quality/checkjob/CheckJobAdd.vue

@@ -0,0 +1,169 @@
+<template>
+  <el-card class="box-card" shadow="always">
+    <div slot="header" class="clearfix">
+      <span>{{ title }}</span>
+      <el-button-group style="float: right;">
+        <el-button type="primary" size="mini" icon="el-icon-finished" :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
+        <el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
+      </el-button-group>
+    </div>
+    <div class="body-wrapper">
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="任务名称" prop="jobName">
+          <el-input v-model="form.jobName" placeholder="任务名称" />
+        </el-form-item>
+        <el-form-item label="任务类型" prop="jobType">
+          <el-select v-model="form.jobType" placeholder="请选择任务类型" @change="ruleItemSelectChanged">
+            <el-option
+              v-for="item in ruleItemOptions"
+              :key="item.typeId"
+              :label="item.typeName"
+              :value="item.typeId"
+            />
+          </el-select>
+        </el-form-item>
+        <el-divider content-position="left">任务配置</el-divider>
+        <el-form-item label="cron表达式" prop="cronExpression">
+          <el-input v-model="form.cronExpression" placeholder="cron表达式" />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-radio-group v-model="form.status">
+            <el-radio
+              v-for="dict in statusOptions"
+              :key="dict.id"
+              :label="dict.itemText"
+            >{{ dict.itemValue }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import { saveCheckJob } from '@/api/quality/checkjob'
+
+export default {
+  name: 'CheckJobAdd',
+  props: {
+    data: {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      title: '检测任务新增',
+      // 展示切换
+      showOptions: {
+        data: {},
+        showList: true,
+        showAdd: false,
+        showEdit: false,
+        showDetail: false
+      },
+      // 保存按钮
+      loadingOptions: {
+        loading: false,
+        loadingText: '保存',
+        isDisabled: false
+      },
+      // 表单参数
+      form: {
+        jobName: undefined,
+        jobType: undefined,
+        cronExpression: undefined,
+        beanName: 'qualityTask',
+        methodName: 'task',
+        status: '0'
+      },
+      // 表单校验
+      rules: {
+        jobName: [
+          { required: true, message: '任务名称不能为空', trigger: 'blur' }
+        ],
+        jobType: [
+          { required: true, message: '任务类型不能为空', trigger: 'change' }
+        ],
+        cronExpression: [
+          { required: true, message: 'cron表达式不能为空', trigger: 'blur' }
+        ]
+      },
+      // 状态数据字典
+      statusOptions: [],
+      // 规则级别数据字典
+      ruleLevelOptions: [],
+      // 核查类型数据字典
+      ruleItemOptions: [
+        { typeId: 'structure', typeName: '结构符合性' },
+        { typeId: 'content', typeName: '内容符合性' }
+      ],
+      sourceOptions: [],
+      tableOptions: [],
+      columnOptions: [],
+      dictTypeOptions: [],
+      relatedColumnOptions: []
+    }
+  },
+  created() {
+    this.form.jobType = this.data.jobType
+    this.getDicts('sys_common_status').then(response => {
+      if (response.success) {
+        this.statusOptions = response.data
+      }
+    })
+  },
+  methods: {
+    showCard() {
+      this.$emit('showCard', this.showOptions)
+    },
+    ruleItemSelectChanged(val) {
+      const item = this.ruleItemOptions.find(function (item) {
+        return item.typeId === val
+      })
+      this.form.jobType = item.typeId
+    },
+    /** 提交按钮 */
+    submitForm: function () {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          this.loadingOptions.loading = true
+          this.loadingOptions.loadingText = '保存中...'
+          this.loadingOptions.isDisabled = true
+          saveCheckJob(this.form).then(response => {
+            if (response.success) {
+              this.$message.success('保存成功')
+              setTimeout(() => {
+                // 2秒后跳转列表页
+                this.$emit('showCard', this.showOptions)
+              }, 2000)
+            } else {
+              this.$message.error('保存失败')
+              this.loadingOptions.loading = false
+              this.loadingOptions.loadingText = '保存'
+              this.loadingOptions.isDisabled = false
+            }
+          }).catch(() => {
+            this.loadingOptions.loading = false
+            this.loadingOptions.loadingText = '保存'
+            this.loadingOptions.isDisabled = false
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .el-card ::v-deep .el-card__body {
+    height: calc(100vh - 230px);
+    overflow-y: auto;
+  }
+</style>

src/views/quality/checkjob/CheckJobEdit.vue

@@ -0,0 +1,232 @@
+<template>
+  <el-card class="box-card" shadow="always">
+    <div slot="header" class="clearfix">
+      <span>{{ title }}</span>
+      <el-button-group style="float: right;">
+        <el-button v-if="active == 2" v-hasPerm="['metadata:datasource:edit']" size="mini" icon="el-icon-plus" round :loading="loadingOptions.loading" :disabled="loadingOptions.isDisabled" @click="submitForm">{{ loadingOptions.loadingText }}</el-button>
+        <el-button size="mini" icon="el-icon-back" @click="showCard">返回</el-button>
+      </el-button-group>
+    </div>
+    <div class="body-wrapper">
+      <el-steps :active="active" finish-status="success" align-center>
+        <el-step title="数据源信息" />
+        <el-step title="连接信息" />
+      </el-steps>
+      <el-form v-if="active == 1" ref="form" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="数据源类型" prop="dbType">
+          <el-select v-model="form.dbType">
+            <el-option
+              v-for="item in dbTypeOptions"
+              :key="item.id"
+              :label="item.itemValue"
+              :value="item.itemText"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="数据源名称" prop="sourceName">
+          <el-input v-model="form.sourceName" placeholder="请输入数据源名称" />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-radio-group v-model="form.status">
+            <el-radio
+              v-for="dict in statusOptions"
+              :key="dict.id"
+              :label="dict.itemText"
+            >{{ dict.itemValue }}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <el-form v-if="active == 2" ref="form2" :model="form2" :rules="rules2" label-width="80px">
+        <el-form-item label="主机" prop="host">
+          <el-input v-model="form2.host" placeholder="请输入主机" />
+        </el-form-item>
+        <el-form-item label="端口" prop="port">
+          <el-input v-model="form2.port" placeholder="请输入端口" />
+        </el-form-item>
+        <el-form-item v-if="form.dbType === '3' || form.dbType === '4'" label="服务名" prop="sid">
+          <el-input v-model="form2.sid" placeholder="请输入服务名" />
+        </el-form-item>
+        <el-form-item v-if="form.dbType !== '3' && form.dbType !== '4'" label="数据库" prop="dbName">
+          <el-input v-model="form2.dbName" placeholder="请输入数据库" />
+        </el-form-item>
+        <el-form-item label="用户名" prop="username">
+          <el-input v-model="form2.username" placeholder="请输入用户名" />
+        </el-form-item>
+        <el-form-item label="密码" prop="password">
+          <el-input v-model="form2.password" placeholder="请输入密码" />
+        </el-form-item>
+        <el-form-item>
+          <el-button v-hasPerm="['metadata:datasource:connect']" size="mini" type="primary" @click="handleCheckConnection">连通性检测</el-button>
+        </el-form-item>
+      </el-form>
+      <el-button v-if="active == 1" style="margin-top: 12px;" @click="handleNextStep">下一步</el-button>
+      <el-button v-if="active == 2" style="margin-top: 12px;" @click="handleLastStep">上一步</el-button>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import { getDataSource, updateDataSource, checkConnection } from '@/api/metadata/datasource'
+
+export default {
+  name: 'CheckJobEdit',
+  props: {
+    data: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      title: '数据源编辑',
+      // 展示切换
+      showOptions: {
+        data: {},
+        showList: true,
+        showAdd: false,
+        showEdit: false,
+        showDetail: false
+      },
+      // 保存按钮
+      loadingOptions: {
+        loading: false,
+        loadingText: '保存',
+        isDisabled: false
+      },
+      active: 1,
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        dbType: [
+          { required: true, message: '数据源类型不能为空', trigger: 'change' }
+        ],
+        sourceName: [
+          { required: true, message: '数据源名称不能为空', trigger: 'blur' }
+        ]
+      },
+      form2: {},
+      rules2: {
+        host: [
+          { required: true, message: '主机不能为空', trigger: 'blur' }
+        ],
+        port: [
+          { required: true, message: '端口不能为空', trigger: 'blur' }
+        ],
+        sid: [
+          { required: true, message: '服务名不能为空', trigger: 'blur' }
+        ],
+        dbName: [
+          { required: true, message: '数据库不能为空', trigger: 'blur' }
+        ],
+        username: [
+          { required: true, message: '用户名不能为空', trigger: 'blur' }
+        ],
+        password: [
+          { required: true, message: '密码不能为空', trigger: 'blur' }
+        ]
+      },
+      // 状态数据字典
+      statusOptions: [],
+      // 数据源类型数据字典
+      dbTypeOptions: []
+    }
+  },
+  created() {
+    console.log('id:' + this.data.id)
+    this.getDicts('sys_common_status').then(response => {
+      if (response.success) {
+        this.statusOptions = response.data
+      }
+    })
+    this.getDicts('data_db_type').then(response => {
+      if (response.success) {
+        this.dbTypeOptions = response.data
+      }
+    })
+  },
+  mounted() {
+    this.getDataSource(this.data.id)
+  },
+  methods: {
+    showCard() {
+      this.$emit('showCard', this.showOptions)
+    },
+    /** 获取详情 */
+    getDataSource: function(id) {
+      getDataSource(id).then(response => {
+        if (response.success) {
+          this.form = response.data
+          this.form2 = this.form.dbSchema
+        }
+      })
+    },
+    /** 步骤条下一步 */
+    handleNextStep() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          this.active++
+        }
+      })
+    },
+    /** 步骤条上一步 */
+    handleLastStep() {
+      this.active--
+    },
+    /** 检测数据库连通性 */
+    handleCheckConnection() {
+      this.$refs['form2'].validate(valid => {
+        if (valid) {
+          this.form.dbSchema = this.form2
+          checkConnection(this.form).then(response => {
+            if (response.success) {
+              this.$message.success('连接成功')
+            }
+          })
+        }
+      })
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs['form2'].validate(valid => {
+        if (valid) {
+          this.form.dbSchema = this.form2
+          this.loadingOptions.loading = true
+          this.loadingOptions.loadingText = '保存中...'
+          this.loadingOptions.isDisabled = true
+          updateDataSource(this.form).then(response => {
+            if (response.success) {
+              this.$message.success('保存成功')
+              setTimeout(() => {
+                // 2秒后跳转列表页
+                this.$emit('showCard', this.showOptions)
+              }, 2000)
+            } else {
+              this.$message.error('保存失败')
+              this.loadingOptions.loading = false
+              this.loadingOptions.loadingText = '保存'
+              this.loadingOptions.isDisabled = false
+            }
+          }).catch(() => {
+            this.loadingOptions.loading = false
+            this.loadingOptions.loadingText = '保存'
+            this.loadingOptions.isDisabled = false
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .el-card ::v-deep .el-card__body {
+    height: calc(100vh - 230px);
+    overflow-y: auto;
+  }
+</style>

src/views/quality/checkjob/CheckJobList.vue

@@ -1,5 +1,71 @@
 <template>
   <el-card class="box-card" shadow="always">
+    <el-form ref="queryForm" :model="queryParams" :inline="true">
+      <el-form-item label="任务名称" prop="sourceName">
+        <el-input
+          v-model="queryParams.sourceName"
+          placeholder="请输入任务名称"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row type="flex" justify="space-between">
+      <el-col :span="12">
+        <el-button-group>
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handleAdd"
+          >新增</el-button>
+        </el-button-group>
+      </el-col>
+      <el-col :span="12">
+        <div class="right-toolbar">
+          <el-tooltip content="密度" effect="dark" placement="top">
+            <el-dropdown trigger="click" @command="handleCommand">
+              <el-button circle size="mini">
+                <svg-icon class-name="size-icon" icon-class="colum-height" />
+              </el-button>
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item command="medium">正常</el-dropdown-item>
+                <el-dropdown-item command="small">中等</el-dropdown-item>
+                <el-dropdown-item command="mini">紧凑</el-dropdown-item>
+              </el-dropdown-menu>
+            </el-dropdown>
+          </el-tooltip>
+          <el-tooltip content="刷新" effect="dark" placement="top">
+            <el-button circle size="mini" @click="handleRefresh">
+              <svg-icon class-name="size-icon" icon-class="shuaxin" />
+            </el-button>
+          </el-tooltip>
+          <el-tooltip content="列设置" effect="dark" placement="top">
+            <el-popover placement="bottom" width="100" trigger="click">
+              <el-checkbox-group v-model="checkedTableColumns" @change="handleCheckedColsChange">
+                <el-checkbox
+                  v-for="(item, index) in tableColumns"
+                  :key="index"
+                  :label="item.prop"
+                >{{ item.label }}</el-checkbox>
+              </el-checkbox-group>
+              <span slot="reference">
+                <el-button circle size="mini">
+                  <svg-icon class-name="size-icon" icon-class="shezhi" />
+                </el-button>
+              </span>
+            </el-popover>
+          </el-tooltip>
+        </div>
+      </el-col>
+    </el-row>
+
     <el-table
       v-loading="loading"
       :data="tableDataList"
@@ -64,7 +130,7 @@
 </template>
 
 <script>
-import { pageCheckJob, pauseCheckJob, resumeCheckJob, runCheckJob } from '@/api/quality/checkjob'
+import { pageCheckJob, delCheckJob, pauseCheckJob, resumeCheckJob, runCheckJob } from '@/api/quality/checkjob'
 
 export default {
   name: 'CheckJobList',
@@ -92,6 +158,8 @@ export default {
           formatter: this.statusFormatter
         }
       ],
+      // 默认选择中表格头
+      checkedTableColumns: [],
       // 状态数据字典
       statusOptions: [],
       // 数据集表格数据
@@ -101,7 +169,8 @@ export default {
       // 查询参数
       queryParams: {
         pageNum: 1,
-        pageSize: 20
+        pageSize: 20,
+        sourceName: ''
       }
     }
   },
@@ -114,6 +183,21 @@ export default {
     this.getList()
   },
   methods: {
+    initCols() {
+      this.checkedTableColumns = this.tableColumns.map(col => col.prop)
+    },
+    handleCheckedColsChange(val) {
+      this.tableColumns.forEach(col => {
+        if (!this.checkedTableColumns.includes(col.prop)) {
+          col.show = false
+        } else {
+          col.show = true
+        }
+      })
+    },
+    handleCommand(command) {
+      this.tableSize = command
+    },
     /** 查询数据集列表 */
     getList() {
       this.loading = true
@@ -190,6 +274,67 @@ export default {
       } else {
         return <el-tag type='warning'>{dictLabel}</el-tag>
       }
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        sourceName: ''
+      }
+      this.handleQuery()
+    },
+    /** 刷新列表 */
+    handleRefresh() {
+      this.getList()
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.showOptions.data = {}
+      this.showOptions.showList = false
+      this.showOptions.showAdd = true
+      this.showOptions.showEdit = false
+      this.showOptions.showDetail = false
+      this.$emit('showCard', this.showOptions)
+    },
+    /** 修改按钮操作 */
+    handleEdit(row) {
+      this.showOptions.data.id = row.id
+      this.showOptions.showList = false
+      this.showOptions.showAdd = false
+      this.showOptions.showEdit = true
+      this.showOptions.showDetail = false
+      this.$emit('showCard', this.showOptions)
+    },
+    /** 详情按钮操作 */
+    handleDetail(row) {
+      this.showOptions.data.id = row.id
+      this.showOptions.showList = false
+      this.showOptions.showAdd = false
+      this.showOptions.showEdit = false
+      this.showOptions.showDetail = true
+      this.$emit('showCard', this.showOptions)
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$confirm('选中数据将被永久删除, 是否继续？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        delCheckJob(row.id).then(response => {
+          if (response.success) {
+            this.$message.success('删除成功')
+            this.getList()
+          }
+        })
+      }).catch(() => {
+      })
     }
   }
 }

src/views/quality/checkjob/index.vue

@@ -3,15 +3,23 @@
     <transition name="el-zoom-in-center">
       <check-job-list v-if="options.showList" @showCard="showCard" />
     </transition>
+    <transition name="el-zoom-in-top">
+      <check-job-add v-if="options.showAdd" :data="options.data" @showCard="showCard" />
+    </transition>
+    <transition name="el-zoom-in-top">
+      <check-job-edit v-if="options.showEdit" :data="options.data" @showCard="showCard" />
+    </transition>
   </div>
 </template>
 
 <script>
 import CheckJobList from './CheckJobList'
+import CheckJobAdd from './CheckJobAdd'
+import CheckJobEdit from './CheckJobEdit'
 
 export default {
   name: 'CheckJob',
-  components: { CheckJobList },
+  components: { CheckJobList, CheckJobAdd, CheckJobEdit },
   data() {
     return {
       options: {