Newer
Older
operation_web / src / components / shujulvwang / dailyModel.vue
<!-- 任务列表 - 数据任务 && 数据补遗 编辑界面 -->
<template>
  <div id="dailyWindow">
    <h2 class="text-center sectionH2">
      <span class="pull-left" @click="gohistory"> < 返回 </span> {{ modelH }}
    </h2>
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="120px"
      class="demo-ruleForm"
    >
      <el-row class="basicB">
        <p class="formJcDoc">基本信息</p>
        <el-col :span="15" class="m-t-20 p-l-22">
          <el-form-item label="任务名称:" prop="taskName">
            <el-input
              v-model="ruleForm.taskName"
              placeholder="请输入任务名称"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="15" class="p-l-22">
          <el-form-item label="任务描述:" style="margin:5px 0 17px 0">
            <el-input
              type="textarea"
              v-model="ruleForm.taskDetail"
              placeholder="请输入任务描述"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- 连接 -->
      <el-row class="basicB m-t-24">
        <p class="formJcDoc">连接</p>
        <el-col :span="7" class="m-t-20 p-l-22">
          <el-form-item label="连接:" prop="taskParams.dataBase">
            <el-select
              @change="dataSourceChange"
              v-model="ruleForm.taskParams.dataBase"
              placeholder="请选择连接"
            >
              <el-option
                v-for="(item, index) in datasSources"
                :key="index"
                :label="item.value"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="7" class="m-t-20 p-l-22">
          <el-form-item label="数据表:" prop="taskParams.tableName">
            <el-autocomplete
              @select="dataSourceTable"
              class="inline-input w130"
              v-model="ruleForm.taskParams.tableName"
              :fetch-suggestions="querySearch"
              placeholder="请选择数据表"
            >
            </el-autocomplete>
          </el-form-item>
        </el-col>

        <el-col :span="1" class="text-right m-t-30">
          <div class="aboutType">
            <el-tooltip
              class="item"
              effect="dark"
              content="数据处理任务将直接更新表中的数据"
              placement="top-start"
            >
              <span><i class="iconfont icon-49"></i></span>
            </el-tooltip>
          </div>
        </el-col>

        <el-col :span="15" class="p-l-22">
          <el-form-item label="过滤条件:">
            <el-input
              type="textarea"
              v-model="ruleForm.taskParams.queryConditions"
              placeholder="请输入过滤条件"
            >
            </el-input>
            <div class="aboutType">
              <span
                ><i class="iconfont icon-49"></i
                >SQL过滤条件,对站点进行过滤</span
              >
              <!-- <el-button @click.native='detectionTest' type='primary' size="mini" class='dataSourceTest'>连接测试</el-button> -->
            </div>
            <div
              :class="{
                'el-form-itemSuccess': sourceStatus,
                'el-form-item__error': !sourceStatus
              }"
              v-show="sourceErrorStatus"
            >
              {{ sourceError }}
            </div>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- 数据处理 -->
      <el-row class="basicB m-t-24">
        <p class="formJcDoc">数据处理</p>

        <!-- 数据自动检测和阈值检测 -->
        <el-form-item v-if="!addendum" style="margin-left:-120px;">
          <el-col :span="14" class="p-l-22 m-t-20" style="height:28px;">
            <el-form-item label="检测方式:" prop="taskParams.detectionType">
              <el-select
                @change="detectionTypeChange"
                v-model="ruleForm.taskParams.detectionType"
                placeholder="
阈值检测"
              >
                <el-option
                  v-for="(item, index) in testJC"
                  :key="index"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col
            :span="1"
            class="text-right m-t-10"
            style="display: inline-block;
    transform: translatey(10px);"
          >
            <div class="aboutType ">
              <el-tooltip
                class="item"
                effect="dark"
                content="阈值检测是需要指定异常值的范围,阈值检测将使用随机值替换异常值;自动检测只需要指定检测字段,由系统自动根据算法检测异常值,将使用预测值替换异常值"
                placement="top-start"
              >
                <span><i class="iconfont icon-49"></i> </span>
              </el-tooltip>
            </div>
          </el-col>
        </el-form-item>

        <!-- 补遗数据 -->
        <el-row class="p-l-22 m-t-24">
          <el-col :span="15" v-if="addendum">
            <el-form-item label="主键字段:" prop="taskParams.primaryKey">
              <el-select
                v-model="ruleForm.taskParams.primaryKey"
                placeholder="请选择主键字段"
              >
                <el-option
                  v-for="(item, index) in sourcesKeysField"
                  :key="item + 666"
                  :label="item"
                  :value="item"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 数据处理之 阈值检测和自动检测 -->
        <el-row class="p-l-22">
          <el-col :span="15">
            <el-form-item label="标识字段:" prop="taskParams.markField">
              <el-select
                v-model="ruleForm.taskParams.markField"
                placeholder="请选择标识字段"
              >
                <el-option
                  v-for="(item, index) in sourcesField"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row class="p-l-22">
          <el-col :span="7">
            <el-form-item label="时间字段:" prop="taskParams.tt">
              <el-select
                v-model="ruleForm.taskParams.tt"
                placeholder="请选择时间字段"
              >
                <el-option
                  v-for="(item, index) in sourcesField"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="7" class="p-l-22">
            <el-form-item
              :label="timeDataText + ':'"
              prop="taskParams.interval"
            >
              <el-input
                type="number"
                v-model.number="ruleForm.taskParams.interval"
                :placeholder="'请输入' + timeDataText"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="1" class="text-right">
            <div class="aboutType m-t-10">
              <el-tooltip
                class="item"
                effect="dark"
                :content="'时间序列需要指定时间字段,以及' + timeDataText"
                placement="top-start"
              >
                <span><i class="iconfont icon-49"></i> </span>
              </el-tooltip>
            </div>
          </el-col>

          <el-col :span="14">
            <el-form-item label="补遗时间:" prop="taskParams.timeArray">
              <el-date-picker
                :editable="false"
                v-model="ruleForm.taskParams.timeArray"
                type="datetimerange"
                range-separator=" ~ "
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="1" class="text-right">
            <div class="aboutType m-t-10">
              <el-tooltip
                class="item"
                effect="dark"
                content="补遗时间指定了数据异常检测和补遗的时间段"
                placement="top-start"
              >
                <span><i class="iconfont icon-49"></i> </span>
              </el-tooltip>
            </div>
          </el-col>
        </el-row>

        <!-- 数据补遗表单 -->
        <div v-if="addendum">
          <el-row
            v-for="(items, indexs) in ruleForm.taskParams.addendum"
            :key="indexs + 99"
            class="p-l-22"
          >
            <el-col :span="7">
              <el-form-item
                label="补遗字段:"
                prop="taskParams.addendum[0].factor"
              >
                <el-select v-model="items.factor" placeholder="请选择补遗字段">
                  <el-option
                    v-for="(item, index) in sourcesField"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="7" class="p-l-22">
              <el-form-item
                label="补遗值:"
                prop="taskParams.addendum[0].value"
              >
                <el-input
                  type="number"
                  v-model.number="items.value"
                  placeholder="请输入补遗值"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="1" class="addendumNames text-right">
              <i
                @click="deleteAutoIcons('addendum', indexs)"
                class="iconfont icon-qiyong deleteIcon"
              ></i>
            </el-col>
          </el-row>

          <div class="aboutType conditiona">
            <span @click="addendumAdd"
              ><i class="iconfont icon-jia"></i> 添加补遗字段</span
            >
          </div>
        </div>

        <div v-if="!addendum">
          <!-- 阈值检测 -->
          <el-row
            v-show="threshold"
            v-for="(items, indexs) in ruleForm.taskParams.mapList"
            :key="indexs"
            class="p-l-22"
          >
            <el-col :span="7">
              <el-form-item label="检测字段:">
                <el-select v-model="items.factor" placeholder="请选择检测字段">
                  <el-option
                    v-for="(item, index) in sourcesField"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="7" class="yzFlex l-h-40">
              <span class="fzs addendumNames" style="margin-top:0"
                >取值范围</span
              >
              <el-input
                type="number"
                v-model.number="items.minVal"
                placeholder="下限值"
              ></el-input>
              <span style="padding:0 10px;" class="addendumNames"> ~ </span>
              <el-input
                type="number"
                v-model.number="items.maxVal"
                placeholder="上限值"
              ></el-input>
            </el-col>
            <el-col :span="1" class="addendumNames text-right">
              <i
                @click="deleteAutoIcons('mapList', indexs)"
                class="iconfont icon-qiyong deleteIcon"
              ></i>
            </el-col>
          </el-row>

          <!-- 自动检测 -->
          <div
            v-show="automatic"
            v-for="(items, indexs) in ruleForm.taskParams.autoMapList"
            :key="indexs + 299"
          >
            <el-row class="p-l-22">
              <el-col :span="7">
                <el-form-item label="检测字段:">
                  <el-select
                    v-model="items.factor"
                    placeholder="请选择检测字段"
                  >
                    <el-option
                      v-for="(item, index) in sourcesField"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="7" class="p-l-22">
                <el-form-item label="关联字段:" class="multiSelected">
                  <el-select
                    v-model="items.multiples"
                    multiple
                    placeholder="请选择关联字段"
                  >
                    <el-option
                      v-for="item in sourcesField"
                      :key="item.value + 1"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="1" class="addendumNames text-right">
                <i
                  @click="deleteAutoIcons('autoMapList', indexs)"
                  class="iconfont icon-qiyong deleteIcon"
                ></i>
              </el-col>
            </el-row>
          </div>

          <!-- 条件检测 -->
          <div v-show="condition">
            <el-row class="p-l-22">
              <el-col :span="14">
                <el-form-item label="异常条件:">
                  <el-input
                    v-model="ruleForm.taskParams.abnormalCondition"
                    placeholder="请输入异常条件"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="1" class="text-right">
                <div class="aboutType m-t-10">
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="异常条件指定了异常数据的判定条件"
                    placement="top-start"
                  >
                    <span><i class="iconfont icon-49"></i> </span>
                  </el-tooltip>
                </div>
              </el-col>
            </el-row>
          </div>

          <!-- 条件检测 -->
          <div
            v-show="condition"
            v-for="(items, indexs) in ruleForm.taskParams.conditionList"
            :key="indexs + 399"
          >
            <el-row class="p-l-22">
              <el-col :span="7">
                <el-form-item label="更新字段:">
                  <el-select
                    v-model="items.updateField"
                    placeholder="请选择更新字段"
                  >
                    <el-option
                      v-for="(item, index) in sourcesField"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="7" class="p-l-22">
                <el-form-item label="更新值:" class="multiSelected">
                  <el-input
                    v-model="items.updateValue"
                    placeholder="请输入更新值"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="1" class="addendumNames text-right">
                <i
                  @click="deleteAutoIcons('conditionList', indexs)"
                  class="iconfont icon-qiyong deleteIcon"
                ></i>
              </el-col>
            </el-row>
          </div>

          <!-- 阈值检测 -->
          <div class="aboutType conditiona" v-show="threshold">
            <span @click="filterCondition"
              ><i class="iconfont icon-jia"></i> 添加检测字段</span
            >
          </div>

          <!-- 自动检测 -->
          <div class="aboutType conditiona" v-show="automatic">
            <span @click="filterAutoCondition"
              ><i class="iconfont icon-jia"></i> 添加自动检测字段</span
            >
          </div>

          <!-- 条件检测 -->
          <div class="aboutType conditiona" v-show="condition">
            <span @click="conditionAdd"
              ><i class="iconfont icon-jia"></i> 添加检测字段</span
            >
          </div>
        </div>

        <!-- 备份数据库 -->
        <el-row class="p-l-22">
          <el-col :span="15">
            <el-form-item label="更新策略:" prop="taskParams.updateStatus">
              <el-select
                v-model="ruleForm.taskParams.updateStatus"
                placeholder="请选择"
                @change="isUpdateS"
              >
                <el-option
                  v-for="item in updateStatu"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row v-if="bgcData" class="p-l-22">
          <el-col :span="7">
            <el-form-item label="数据源:" prop="taskParams.backupDatabase">
              <el-select
                @change="dataSourceChangeDatabase"
                v-model="ruleForm.taskParams.backupDatabase"
                placeholder="请选择数据源"
              >
                <el-option
                  v-for="(item, index) in datasSources"
                  :key="index"
                  :label="item.value"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8" class="p-l-22">
            <el-form-item label="数据表:" prop="taskParams.backupTableName">
              <el-autocomplete
                class="inline-input w130"
                v-model="ruleForm.taskParams.backupTableName"
                :fetch-suggestions="querySearchs"
                placeholder="请选择数据表"
              >
              </el-autocomplete>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 消息队列 -->
        <div class="p-l-22" v-if="bgcData">
          <el-row>
            <el-col :span="15">
              <el-form-item label="写入队列:" prop="taskParams.writeQueue">
                <el-select
                  v-model="ruleForm.taskParams.writeQueue"
                  placeholder="请选择"
                  @change="writeQueChange"
                >
                  <el-option
                    v-for="item in writeQueueDatas"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row v-if="writeQue">
            <el-col :span="7">
              <el-form-item label="消息连接:">
                <el-select
                  @change="sqlSourceShow"
                  v-model="ruleForm.taskParams.queueDataSource"
                  placeholder="请选择消息连接"
                >
                  <el-option
                    v-for="(item, index) in addSourceMap"
                    :key="index"
                    :label="item.value"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="8" class="p-l-22">
              <el-form-item label="队列名称:">
                <el-select
                  class="inline-input w130"
                  v-model="ruleForm.taskParams.queueName"
                  placeholder="请选择队列名称"
                >
                  <el-option
                    v-for="(item, index) in addSourceValue1"
                    :key="index"
                    :label="item.value"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
      </el-row>

      <!-- 调度配置 -->
      <el-row class="basicB m-t-24">
        <p class="formJcDoc">调度配置</p>
        <el-form-item label="周期类型:" class="p-l-22 m-t-20">
          <el-radio-group @change="executeChange" v-model="ruleForm.isTemp">
            <el-radio label="Y">临时任务</el-radio>
            <el-radio label="N">周期任务</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-row v-if="cronExpree" class="p-l-22">
          <el-col :span="15">
            <el-form-item label="cron表达式选项:" prop="cronExpression">
              <el-input
                v-model="ruleForm.cronExpression"
                placeholder="请输入cron表达式"
              ></el-input>
              <div class="aboutType">
                <span
                  :class="{
                    'el-form-itemSuccess': cronStatus,
                    'el-form-item__error': !cronStatus
                  }"
                  v-show="cronErrorStatus"
                >
                  {{ cronError }}
                </span>
                <el-button
                  type="primary"
                  size="mini"
                  class="dataSourceTest"
                  @click="cronTest"
                  >cron表达式测试</el-button
                >
              </div>
            </el-form-item>
          </el-col>
        </el-row>

        <div class="text-left p-l-22 m-b-20">
          <el-button
            type="primary"
            v-show="editAdd"
            @click="submitForm('ruleForm', 1)"
            >添 加</el-button
          >
          <el-button
            type="primary"
            v-show="!editAdd"
            @click="submitForm('ruleForm', 2)"
            >修 改</el-button
          >
          <el-button @click="gohistory">取 消</el-button>
        </div>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import project from "../../mixins/project";
var moment = require("moment");
import { notify } from "../../util/item";
import devisor from "../../util/devisor";
export default {
  name: "dailyModel",
  data() {
    return {
      modelHead: ["添加任务信息", "修改任务信息", "任务信息数据补遗"],
      modelH: "",
      dataSelect: false,
      testJC: [
        {
          value: 1,
          label: "阈值检测",
          enName: "thresholdDetectionService"
        },
        {
          value: 2,
          label: "自动检测",
          enName: "automaticDetectionService"
        },
        {
          value: 3,
          label: "条件检测",
          enName: "conditionDetectionService"
        }
      ],
      updateStatu: [
        {
          value: 0,
          label: "更新源表"
        },
        {
          value: 1,
          label: "插入新表"
        }
      ],
      writeQueueDatas: [
        {
          value: 0,
          label: "否"
        },
        {
          value: 1,
          label: "是"
        }
      ],
      sourcesField: [],
      addSourceValue1: [],
      addSourceMap: [],
      sourcesKeysField: [],
      dailyFlage: false,
      addendum: false,
      bgcData: false,
      writeQue: false,
      timeDataText: "",
      sourceErrorStatus: false, //连接错误信息展示
      cronErrorStatus: false, //连接错误信息展示
      sourceError: "", //连接类型状态
      cronError: "", //cron类型信息
      sourceStatus: false, //连接是否测试通过
      cronStatus: false, //cron表达式是否测试通过
      threshold: true, //阈值检测
      automatic: false, //自动检测
      condition: false, //条件检测
      cronExpree: false,
      datasSources: [],
      datasSourceTypes: [],
      datasSourceTypesData: [],
      ruleForm: {
        taskType: "", //任务类型
        taskDetail: "", //任务名称
        taskName: "", //任务名称
        taskParams: {
          timeArray: "", //时间字段
          dataBase: "", //连接
          tableName: "", // 表名
          primaryKey: "", // 主键字段
          tt: "", // 时间字段
          markField: "", // 标识字段
          time: "", // 补遗时间
          interval: "", // 数据间隔
          detectionType: 1, //检测方式(阈值1 自动检测2)
          detectionTypeService: "", //检测方式(名称)
          mapList: [
            {
              factor: "", //检测字段
              minVal: "", //小于阈值
              maxVal: "" //大于阈值
            }
          ],
          addendum: [
            {
              factor: "", //补遗字段
              value: "" //补遗值
            }
          ], //补遗字段
          autoMapList: [
            {
              factor: "", //检测字段
              multiples: [] //检测字段
            }
          ],
          abnormalCondition: "", //异常条件
          conditionList: [
            {
              updateField: "", //更新字段
              updateValue: "" //更新值
            }
          ],
          queryConditions: "", //过滤条件
          updateStatus: 0, //是否处理更新策略
          backupDatabase: "", //备份数据库
          backupTableName: "", //备份数据表
          writeQueue: 0, //选择消息队列
          queueDataSource: "", //队列连接
          queueName: "" //队列名称
        },
        cronExpression: "", //cron表达式
        isTemp: "Y" //cron表达式类型
      },
      rules: {
        taskName: [
          {
            required: true,
            message: "请输入任务名称",
            trigger: "blur"
          }
        ],
        taskParams: {
          tableName: [
            {
              required: true,
              message: "请选择数据表",
              trigger: "change"
            }
          ],
          backupDatabase: [
            {
              required: true,
              message: "请选择备份数据表",
              trigger: "change"
            }
          ],
          updateStatus: [
            {
              required: true,
              message: "请选择更新策略",
              trigger: "change"
            }
          ],
          writeQueue: [
            {
              required: true,
              message: "请选择消息队列",
              trigger: "change"
            }
          ],
          backupTableName: [
            {
              required: true,
              message: "请选择备份连接",
              trigger: "change"
            }
          ],
          timeArray: [
            {
              required: true,
              message: "请选择补遗时间",
              trigger: "change"
            }
          ],
          queryConditions: [
            {
              required: true,
              message: "请输入过滤条件",
              trigger: "blur"
            }
          ],
          dataBase: [
            {
              required: true,
              message: "请选择连接",
              trigger: "change"
            }
          ],
          primaryKey: [
            {
              required: true,
              message: "请选择主键",
              trigger: "change"
            }
          ],
          tt: [
            {
              required: true,
              message: "请选择时间字段",
              trigger: "change"
            }
          ],
          markField: [
            {
              required: true,
              message: "请选择标识字段",
              trigger: "change"
            }
          ],
          interval: [
            {
              required: true,
              message: "请选择数据间隔",
              trigger: "change"
            }
          ],
          addendum: [
            {
              value: [
                {
                  required: true,
                  message: "请输入补遗字段",
                  trigger: "blur"
                }
              ],
              factor: [
                {
                  required: true,
                  message: "请选择数据间隔",
                  trigger: "change"
                }
              ]
            }
          ], //检测方式(阈值1 自动检测2)
          mapList: [
            {
              factor: [
                {
                  required: true,
                  message: "请选择检测字段",
                  trigger: "change"
                }
              ], //检测字段
              minVal: [
                {
                  required: true,
                  message: "请输入小于阈值",
                  trigger: "blur"
                }
              ], //小于阈值
              maxVal: [
                {
                  required: true,
                  message: "请输入大于阈值",
                  trigger: "blur"
                }
              ] //大于阈值
            }
          ],
          autoMapList: [
            {
              factor: [
                {
                  required: true,
                  message: "请选择检测字段",
                  trigger: "change"
                }
              ], //检测字段
              multiples: [
                {
                  required: true,
                  message: "请选择关联字段",
                  trigger: "change"
                }
              ] //检测字段
            }
          ],
          detectionType: [
            {
              required: true,
              message: "请选择检测方式",
              trigger: "change"
            }
          ]
        },
        cronExpression: [
          {
            required: true,
            message: "请选择cron表达式执行周期",
            trigger: "change"
          }
        ],
        taskType: [
          {
            required: true,
            message: "请选择任务类型",
            trigger: "change"
          }
        ]
      },
      dialogVisible: false,
      loading: false,
      dailyParams: {},
      center: true,
      editAdd: true,
      scrollLock: false,
      closeOnClick: false,
      deleteList: [],
      ruleFormEdit: {
        taskType: "", //任务类型
        taskDetail: "", //任务名称
        taskName: "", //任务名称
        disable: false,
        taskParams: {
          timeArray: "", //时间字段
          dataBase: "", //连接
          tableName: "", // 表名
          primaryKey: "", // 主键字段
          tt: "", // 时间字段
          time: "", // 补遗时间
          interval: "", // 数据间隔
          detectionType: 1, //检测方式(阈值1 自动检测2)
          detectionTypeService: "", //检测方式(名称)
          mapList: [
            {
              factor: "", //检测字段
              minVal: "", //小于阈值
              maxVal: "" //大于阈值
            }
          ],
          addendum: [
            {
              factor: "", //补遗字段
              value: "" //补遗值
            }
          ], //补遗字段
          autoMapList: [
            {
              factor: "", //检测字段
              multiples: [] //检测字段
            }
          ],
          abnormalCondition: "", //异常条件
          conditionList: [
            {
              updateField: "", //更新字段
              updateValue: "" //更新值
            }
          ],
          queryConditions: "", //过滤条件
          updateStatus: 0, //是否处理到备份数据库
          backupDatabase: "", //备份数据库
          backupTableName: "", //备份数据表
          writeQueue: 0, //选择消息队列
          queueDataSource: "", //队列连接
          queueName: "" //队列名称
        },
        cronExpression: "", //cron表达式
        isTemp: "Y" //cron表达式类型
      } //修改数据
    };
  },
  mixins: [project],
  mounted() {
    this.dataSourceChanges();
    this.dataSourceChangesRabbitMq();

    this.startInit(this.$route.query.headTitle);
  },
  methods: {
    startInit(headTitle = 0) {
      // 初始化进入页面,进行刷新
      this.timeDataText = "时间间隔";
      this.ruleForm.taskType = this.$route.query.taskType;
      if (headTitle === "1") {
        // 数据修改
        this.handleEdit(this.$route.query.taskId);
      } else if (headTitle === "0") {
        // 数据新增
        this.editAdd = true;
        // this.clearFormVal();
        this.addendum = false;
      } else if (headTitle === "2") {
        // 数据补遗
        this.ruleForm.taskParams.detectionType = 0;
        this.ruleForm.taskParams.detectionTypeService = "dataAddendumService";
        this.editAdd = true;
        this.addendum = true;
        this.timeDataText = "数据间隔";
      }

      // 添加数据类型
      this.modelH = this.modelHead[headTitle];
    },
    gohistory() {
      //   返回上一页
      this.$router.push({
        path: "/quality/dataProcess/scheduledTasks"
      });
    },
    detectionTypeChange(val) {
      // 自动检测和阈值检测窗口数值变化
      switch (val) {
        case 1:
          // 阈值检测
          this.threshold = true;
          this.condition = false;
          this.automatic = false;
          break;
        case 2:
          // 自动检测
          this.threshold = false;
          this.condition = false;
          this.automatic = true;
          break;
        default:
          // 条件检测
          this.threshold = false;
          this.condition = true;
          this.automatic = false;
          break;
      }
    },
    isUpdateS(val = 0) {
      // 是否备份数据到数据库
      this.ruleForm.taskParams.updateStatus = val;
      if (val === 0) {
        this.bgcData = false;
      } else {
        this.bgcData = true;
      }
    },
    writeQueChange(val) {
      // 是否写入队列
      if (val === 0) {
        this.writeQue = false;
      } else {
        this.writeQue = true;
      }
    },
    querySearch(queryString, cb) {
      var restaurants = this.datasSourceTypes;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      if (results.length !== 0) {
        for (let item of results.values()) {
          item["value"] = item["value"];
        }
      }
      cb(results);
    },
    querySearchs(queryString, cb) {
      // 备份数据库内容
      var restaurants = this.datasSourceTypesData;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      if (results.length !== 0) {
        for (let item of results.values()) {
          item["value"] = item["value"];
        }
      }
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return restaurant.value.indexOf(queryString) !== -1;
      };
    },
    async cronTest() {
      // cron表达式检测
      const datas = await this.getHttpDatas(this.nozzle.checkCron, {
        cronStr: this.ruleForm.cronExpression
      });

      if (datas === true) {
        this.cronStatus = true;
        this.cronError = "cron表达式测试成功";
      } else {
        this.cronError = "操作失败";
        this.cronStatus = false;
      }
      this.cronErrorStatus = true;
    },
    async detectionTest() {
      // 连接测试
      const datas = await this.getHttpDatas(
        this.nozzle.testConnectionFilterCondition,
        {
          dataSourceName: this.ruleForm.taskParams.dataBase,
          tableName: this.ruleForm.taskParams.tableName,
          sqlCondition: this.ruleForm.taskParams.queryConditions
        }
      );

      // 连接是否测试通过
      if (datas === true) {
        this.sourceError = "连接测试成功";
        this.sourceStatus = true;
      } else {
        this.sourceError = datas;
        this.sourceStatus = false;
      }
      this.sourceErrorStatus = true;
    },
    filterCondition() {
      /**
       * 添加检测字段,修改时刻,渲染并进行赋值
       */
      this.ruleForm.taskParams.mapList.push({
        factor: "",
        minVal: "",
        maxVal: ""
      });
    },
    addendumAdd() {
      /**
       * 添加检测字段,修改时刻,渲染并进行赋值
       */
      this.ruleForm.taskParams.addendum.push({
        factor: "",
        value: ""
      });
    },
    conditionAdd() {
      /**
       * 添加条件检测字段,修改时刻,渲染并进行赋值
       */
      this.ruleForm.taskParams.conditionList.push({
        updateField: "",
        updateValue: ""
      });
    },
    filterAutoCondition() {
      /**
       * 添加自动检测字段,修改时刻,渲染并进行赋值
       */
      this.ruleForm.taskParams.autoMapList.push({
        factor: "",
        multiples: [] //检测字段
      });
    },
    deleteAutoIcons(fieldName, index) {
      //   删除字段
      this.ruleForm.taskParams[fieldName].splice(index, 1);
    },
    async dataSourceChanges() {
      // 连接列表渲染

      let datas = await this.getHttpDatas(this.nozzle.queryDataSrouceName, {
        dbType: "Relational"
      });

      let dataBase = [];
      for (let item of datas.values()) {
        dataBase.push({
          value: item
        });
      }
      this.datasSources = dataBase;
    },
    async dataSourceChange(val) {
      // 数据表内容获取以及填充
      this.ruleForm["taskParams"]["tableName"] = "";
      if (this.ruleForm["taskParams"]["detectionType"] == 1) {
        let mapList = this.ruleForm["taskParams"]["mapList"];
        if (mapList.length !== 0) {
          for (let item of mapList.values()) {
            item["factor"] = "";
          }
        }
      } else {
        this.ruleForm["taskParams"]["factor"] = "";
      }

      let datas = await this.getHttpDatas(
        this.nozzle.getAllTableNameByDateSourceName,
        {
          dataSourceName: val,
          pageSize: 999999,
          pageNo: 1
        }
      );
      let dataBase = [];
      for (let item of datas.list.values()) {
        dataBase.push({
          value: item
        });
      }
      this.datasSourceTypes = dataBase;
    },
    async dataSourceTable(
      val,
      dataBase = this.ruleForm.taskParams.dataBase,
      dif = 1
    ) {
      // 数据表内容变化发生改变
      if (typeof val === "object") {
        val = val["value"];
      }
      this.sourceFieldChange(dataBase, val, dif);
      // 清空字段名
      this.ruleForm.taskParams.tt = "";
      this.ruleForm.taskParams.markField = "";
    },
    async dataSourceChangeDatabase(val) {
      // 备份数据表
      this.ruleForm["taskParams"]["backupTableName"] = "";
      let datas = await this.getHttpDatas(
        this.nozzle.getAllTableNameByDateSourceName,
        {
          dataSourceName: val,
          pageSize: 999999,
          pageNo: 1
        }
      );
      let dataBase = [];
      for (let item of datas.list.values()) {
        dataBase.push({
          value: item
        });
      }
      this.datasSourceTypesData = dataBase;
    },
    async sourceFieldChange(dataSourceName, tableName, dif = 1) {
      // 检测字段填充

      // 下拉框改变状态,则进行数据清空
      if (dif === 1) {
        this.multiples = [];
        this.ruleForm["taskParams"]["factor"] = "";
        let mapList = this.ruleForm["taskParams"]["mapList"];
        if (mapList.length !== 0) {
          for (let item of mapList.values()) {
            item["factor"] = "";
          }
        }
      }

      const datas = await this.getHttpDatas(
        this.nozzle.getDataStructureByTableName,
        {
          dataSourceName: dataSourceName,
          tableName: tableName
        }
      );

      if (datas["list"].length !== 0) {
        let newDatas = [];
        for (let item of datas["list"].values()) {
          newDatas.push({
            value: item["columnName"],
            label: devisor[item["columnName"].toLowerCase()]
          });
        }
        this.sourcesField = newDatas;
        this.sourcesKeysField = this.enOrChin(datas["primaryKeys"]);
      } else {
        this.sourcesField = [];
        this.sourcesKeysField = [];
      }
    },
    enOrChin(datas = []) {
      // 英文转换成中文
      if (datas.length !== 0) {
        let newDevisor = [];
        for (const item of datas.values()) {
          newDevisor.push({
            label: devisor[item.toLowerCase()],
            value: item
          });
        }
        return newDevisor;
      }
    },
    executeChange(value) {
      /**
       * 时间执行方法
       */
      if (value === "N") {
        // 周期任务
        this.cronExpree = true;
      } else {
        // 临时任务
        this.ruleForm.cronExpression = "";
        this.cronExpree = false;
      }
    },
    typeQf(datas) {
      // 数据处理类型区分
      if (datas["taskParams"]["detectionType"] === 2) {
        // 自动检测
        datas["taskParams"]["mapList"] = [];
        datas["taskParams"]["conditionList"] = [];
      } else if (datas["taskParams"]["detectionType"] === 1) {
        // 阈值检测
        datas["taskParams"]["autoMapList"] = [];
        datas["taskParams"]["conditionList"] = [];
      } else if (datas["taskParams"]["detectionType"] === 3) {
        // 条件检测
        datas["taskParams"]["autoMapList"] = [];
        datas["taskParams"]["mapList"] = [];
      } else {
        // 数据补遗
        datas["taskParams"]["mapList"] = [];
      }
    },
    addParameter(api) {
      // 新增数据传值
      let datas = Object.assign({}, this.ruleForm);

      // 清除其他检测方案数据
      this.typeQf(datas);

      datas["taskParams"]["time"] =
        moment(datas["taskParams"]["timeArray"][0]).format(
          "YYYY-MM-DD HH:mm:ss"
        ) +
        " ~ " +
        moment(datas["taskParams"]["timeArray"][1]).format(
          "YYYY-MM-DD HH:mm:ss"
        );

      if (datas["taskParams"]["detectionType"] !== 0) {
        // 除去数据补遗参数,填写英文名称
        datas["taskParams"]["detectionTypeService"] = this.testJC[
          datas["taskParams"]["detectionType"] - 1
        ]["enName"];
      }
      datas["taskParams"] = JSON.stringify(datas["taskParams"]);

      // 新增数据传值
      this.$http.post(api, datas).then(response => {
        notify(response);
        this.$emit("getLists");
        this.$router.push({
          path: "/quality/dataProcess/scheduledTasks"
        });
      });
    },
    async editParameter(api) {
      // 修改数据传值
      let datas = Object.assign({}, this.ruleForm);
      this.typeQf(datas);

      datas["taskId"] = this.ruleFormEdit["taskId"];

      datas["taskParams"]["time"] =
        moment(datas["taskParams"]["timeArray"][0]).format(
          "YYYY-MM-DD HH:mm:ss"
        ) +
        " ~ " +
        moment(datas["taskParams"]["timeArray"][1]).format(
          "YYYY-MM-DD HH:mm:ss"
        );

      if (datas["taskParams"]["detectionType"] !== 0) {
        // 除去数据补遗参数,填写英文名称
        datas["taskParams"]["detectionTypeService"] = this.testJC[
          datas["taskParams"]["detectionType"] - 1
        ]["enName"];
      }

      datas["taskParams"] =
        typeof datas["taskParams"] === "string"
          ? datas["taskParams"]
          : JSON.stringify(datas["taskParams"]);

      const response = await this.$http.put(api, datas);
      this.$emit("getLists");
      this.$router.push({
        path: "/quality/dataProcess/scheduledTasks"
      });
    },
    submitForm(formName, dif) {
      // 添加数据,修改数据传值
      let api = "";
      this.$refs[formName].validate(valid => {
        if (valid) {
          // 选择站点编号

          // 连接和cron表达式那个数据
          // if (!this.sourceStatus) {
          //   this.$notify({
          //     type: "warning",
          //     message: '连接需要测试通过才可进行数据处理'
          //   })
          //   return
          // }

          // if (!this.cronStatus && this.ruleForm.isTemp === 'N') {
          //   this.$notify({
          //     type: "warning",
          //     message: 'cron表达式需要测试才可进行数据处理'
          //   })
          //   return
          // }

          // 增加数据和修改数据处理
          if (dif === 1) {
            api = this.nozzle.taskAdd;
            this.addParameter(api);
          } else {
            api = this.nozzle.taskEdit;
            this.editParameter(api);
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetClear(item, keys) {
      // 递归清空复杂数据类型的值

      for (let items of Object.keys(this.ruleForm[item])) {
        if (items === keys) {
          this.ruleForm[item][items] = [];
        } else {
          this.ruleForm[item][items] = "";
        }
      }
    },
    clearFormVal() {
      this.ruleForm["isTemp"] = "Y";
      this.ruleForm["taskParams"]["detectionType"] = 1;

      // 状态
      this.executeChange("Y");
      // 默认阈值检测
      this.detectionTypeChange(1);
    },
    modelAdd() {
      // 添加数据按钮
      this.dataSelect = true;
    },
    traversalEdit(data) {
      // 通过修改数据进行遍历,填充修改数据窗口
      /**
       * @param {Object} data 表内连接,单行数据
       * @param {String} dif 连接请求
       */

      // 启用,禁用,执行数据启动
      this.dataSourceChange(data["taskParam"]["dataBase"]);
      this.dataSourceChangeDatabase(data["taskParam"]["dataBase"]);
      // 获取调度配置
      this.executeChange(data["isTemp"]);
      // 获取检测字段
      this.dataSourceTable(
        data["taskParam"]["tableName"],
        data["taskParam"]["dataBase"],
        2
      );
      this.detectionTypeChange(data["taskParam"]["detectionType"]);

      let { keys } = Object;
      for (let items of keys(this.ruleForm)) {
        if (items === "taskParams") {
          // 数据表和检测字段获取

          this.ruleForm["taskParams"] = data["taskParam"];
        } else {
          this.ruleForm[items] = data[items];
        }
      }

      this.ruleForm["disabled"] = data["disabled"];

      // 数据补遗修改
      if (this.ruleForm.taskParams.detectionType === 0) {
        this.addendum = true;
        this.timeDataText = "数据间隔";
      }

      this.isUpdateS(data["taskParam"]["updateStatus"]);
      this.writeQueChange(data["taskParam"]["writeQueue"]);
    },
    async editFill(taskId) {
      // 修改窗口数据填充
      const datas = await this.getHttpDatas(this.nozzle.queryTaskByTaskId, {
        taskId: taskId
      });
      this.traversalEdit(datas);
      // 使用申明修改对象接收当前修改的参数值
      this.ruleFormEdit = Object.assign({}, this.ruleForm);
      this.ruleFormEdit["taskId"] = datas["taskId"];
    },
    handleEdit(taskId) {
      // 行内点击修改
      this.editAdd = false;

      // 修改状态提示标签
      this.cronErrorStatus = false;
      this.sourceErrorStatus = false;
      this.sourceStatus = false;
      this.cronStatus = false;

      this.editFill(taskId);
    },

    deleteUserLise(ids) {
      // 删除用户

      let datas = {
        params: {
          taskIds: ids
        }
      };
      this.asyncDelete(datas, this.nozzle.taskDelete);
    },
    async dataSourceChangesRabbitMq(dif, dis) {
      /**
       * 消息队列渲染
       */

      let dbTypeName = "rabbitMq";

      let datas = await this.getHttpDatas(this.nozzle.queryDataSrouceName, {
        dbType: dbTypeName
      });

      let dataBase = [];
      for (let item of datas.values()) {
        dataBase.push({
          value: item
        });
      }

      this.addSourceMap = dataBase;
    },
    async sqlSourceShow(val) {
      // 连接改变,获取队列名称
      let nowApi = "";
      // 消息队列
      nowApi = this.nozzle.getQueues;

      let datas = await this.getHttpDatas(nowApi, {
        dataSourceName: val,
        pageSize: 999999,
        pageNo: 1
      });

      let dataBase = [];
      for (let item of datas.values()) {
        dataBase.push({
          value: item
        });
      }
      this.addSourceValue1 = dataBase;
    }
  }
};
</script>

<style scoped>
#dailyWindow .el-date-editor .el-range__icon,
.el-date-editor .el-range-separator {
  line-height: 23px;
}

#dailyWindow .fzs {
  display: inline-block;
  width: 330px;
  text-align: right;
  padding-right: 10px;
}

#dailyWindow .w60 {
  width: 60%;
}

#dailyWindow .datainterval {
  width: 26%;
}

#dailyWindow .yzFlex {
  display: flex;
  justify-content: space-around;
}

#dailyWindow .dataSourceTest {
  float: right;
  margin-top: 5px;
}

#dailyWindow .conditiona {
  padding: 0px 0 10px 141px;
}

#dailyWindow .addendumNames {
  line-height: 40px;
  color: var(--digtext) !important;
}

#dailyWindow .el-autocomplete {
  width: 100%;
}

#dailyWindow .icon-qiyong:before {
  color: red;
  cursor: pointer;
}

#dailyWindow .el-form-itemSuccess {
  color: #63e06e;
  font-size: 12px;
  line-height: 1;
  padding-top: 4px;
  position: absolute;
  top: 100%;
  left: 0;
}

#dailyWindow .pull-left {
  float: left;
  color: #1890ff !important;
  font-size: 14px;
  line-height: 23px;
  cursor: pointer;
}

#dailyWindow .sectionH2 {
  font-size: 16px;
  color: #000;
  padding-bottom: 12px;
}
/* 
    #dailyWindow .basicB {
      box-shadow: 2px 2px 9px 0px #ccc;
      background-color: #fff;
    } */

#dailyWindow .el-form-item {
  margin-bottom: 12px;
}
</style>