<template>
  <div>
    <base-right-dialog
      ref="baseRightDialog"
      :footerShow="true"
      :dialogVisible.sync="dialogVisible"
      :title="dialogTitle + ' 集成任务监控'"
      @handleClose="handleDialogClose"
      :type="dialogType"
      :submitShow="submitShow"
      @handleConfirmClick="handleConfirmClick"
    >
      <base-form
        ref="basicsForm"
        :formRow="formRow"
        :isFunBtn="false"
        class="dialog_form"
        :spanWidth="`120px`"
        :loading="vLoading"
        @onSelect="onSelect"
      ></base-form>
<!--      <el-button-->
<!--        style="width: 125px; margin: 20px 0"-->
<!--        @click="addVersionDialog"-->
<!--        icon="el-icon-plus"-->
<!--        :disabled="submitShow ? false : true"-->
<!--        v-if="submitShow"-->
<!--        >添加</el-button-->
<!--      >-->
<!--      <base-table-->
<!--        :border="true"-->
<!--        :showIndex="true"-->
<!--        :tableColumn="tableVersionColumn"-->
<!--        :tableData="tableVersionData"-->
<!--        :funWidth="80"-->
<!--        :funData="funData"-->
<!--        @onFunc="onFunc"-->
<!--      >-->
<!--        <template v-slot:argName="{ row }" >-->
<!--          <div style="width: 100%">-->
<!--            <template v-if="!submitShow">{{row.argName}}</template>-->
<!--            <el-input-->
<!--              v-else-->
<!--              v-model="row.argName"-->
<!--              clearable-->
<!--              type="text"-->
<!--              :disabled="!submitShow || row.disabled"-->
<!--            ></el-input>-->
<!--          </div>-->
<!--        </template>-->
<!--        <template v-slot:argCode="{ row }">-->
<!--          <div style="width: 100%">-->
<!--            <template v-if="!submitShow">-->
<!--              {{ row.argCode }}-->
<!--            </template>-->
<!--            <el-input-->
<!--              v-else-->
<!--              v-model="row.argCode"-->
<!--              clearable-->
<!--              type="text"-->
<!--              :disabled="!submitShow"-->
<!--            ></el-input>-->
<!--          </div>-->
<!--        </template>-->
<!--        <template v-slot:argType="{ row }">-->
<!--          <div style="width: 100%">-->
<!--&lt;!&ndash;            <el-radio-group v-model="row.argType" :disabled="!submitShow">&ndash;&gt;-->
<!--&lt;!&ndash;              <el-radio label="1">字符串</el-radio>&ndash;&gt;-->
<!--&lt;!&ndash;              <el-radio label="2">日期</el-radio>&ndash;&gt;-->
<!--&lt;!&ndash;            </el-radio-group>&ndash;&gt;-->
<!--            <el-select v-model="row.argType" placeholder="请选择">-->
<!--              <el-option-->
<!--                v-for="item in options"-->
<!--                :key="item.value"-->
<!--                :label="item.label"-->
<!--                :value="item.value">-->
<!--              </el-option>-->
<!--            </el-select>-->
<!--          </div>-->
<!--        </template>-->
<!--        <template v-slot:remark="{ row }">-->
<!--          <div style="width: 100%">-->
<!--            <template v-if="!submitShow">{{row.remark}}</template>-->
<!--            <el-input-->
<!--              v-model="row.remark"-->
<!--              clearable-->
<!--              type="text"-->
<!--              v-else-->
<!--              :disabled="!submitShow"-->
<!--            ></el-input>-->
<!--          </div>-->
<!--        </template>-->
<!--      </base-table>-->
    </base-right-dialog>
  </div>
</template>

<script>
import baseRightDialog from "@/components/base/baseRightDialog";
import baseForm from "@/components/base/baseNewForm";
import baseTable from "@/components/base/baseTable";
import { authApi } from "@/api/apis/auth";
export default {
  components: {
    baseRightDialog,
    baseForm,
    baseTable,
  },
  data() {
    return {
      dialogVisible: false,
      dialogTitle: "",
      dialogType: "",
      formRow: [],
      basicsRules: [],
      vLoading: false,
      newMarryOptions: [],
      submitShow: true,
      loadingType: true,
      tableVersionData: [],
      tableVersionColumn: [],
      funData: [],
      isEdit: false,
      select_dist:{},
      options:[
        {
          label:"字符串",
          value:"1"
        },
        {
          label:"日期范围选择",
          value:"2"
        },
        {
          label:"年月",
          value:"3"
        },
        {
          label:"年月日",
          value:"4"
        },
        {
          label:"年月日时间",
          value:"5"
        },
      ]
    };
  },
  mounted() {
    this.initSelect()
  },
  methods: {
    // 插件下拉
    async initSelect(){
      let res = await authApi(
        "pluginService",
        "plugins",
        "queryPluginsByType",
        "",
        {
          "pluginType": "1"
        }
      );
      if(res.status == 200){
        console.log(res.attribute)
        res.attribute.forEach(item=>{
          this.$set(this.select_dist,item.pluginId,item)
        })
        this.formRow[0].elCol[0].options = res.attribute
      }
    },
    //下拉改变事件
    onSelect(val, index, indexRow, obj){
      this.$set(this.$refs.basicsForm.ruleForm,'plugName',this.select_dist[val]['pluginName'])
    },
    openDialog(type, row) {
      // this.queryProductClassfy();
      this.formRow = [];
        this.submitShow = true;
      this.isEdit = false
      this.funData = [
        {
          color: "#ff0000",
          text: "删除",
        }
      ]
      // 新增
      if (type == "add") {
        this.dialogTitle = "新增";
        this.dialogType = "add";
      }
      // 编辑
      if (type == "edit") {
        this.isEdit = true
        this.dialogTitle = "编辑";
        this.dialogType = "edit";
        this.productGetById(row.id);
      }
      // 查看
      if (type == "show") {
        this.funData = Object.assign([],[])
        this.submitShow = false;
        this.formRow = [
          {
            elCol: [
              {
                label: "任务编码",
                prop: "taskCode",
                tag: "elInput",
                disabled:true,
              },
              {
                label: "任务名称",
                prop: "taskName",
                tag: "elInput",
                disabled:true,
              },
            ],
          },
          {
            elCol: [
              {
                label: "任务状态",
                prop: "taskStatus",
                tag: "elRadio",
                disabled:true,
                options:[
                  {
                    label:"执行中",
                    value:'1'
                  },
                  {
                    label:"待执行",
                    value:'2'
                  },
                  {
                    label:"错误",
                    value:'3'
                  },
                ],
                span:24,
              },
            ],
          },
          {
            elCol: [
              {
                label: "上次开始时间",
                prop: "oldStartTime",
                tag: "elInput",
                disabled:true,
              },
              {
                label: "当前任务开始时间",
                prop: "startTime",
                tag: "elInput",
                disabled:true,
              },

            ],
          },
          {
            elCol: [
              {
                label: "结束时间",
                prop: "endTime",
                tag: "elInput",
                disabled:true,
              },
              {
                label: "耗时",
                prop: "diffTime",
                tag: "elInput",
                disabled:true,
              },

            ],
          },
          {
            elCol: [
              {
                label: "运行次数",
                prop: "runNum",
                tag: "elInput",
                disabled:true,
              },

            ],
          },
        ];
        this.dialogTitle = "查看";
        this.dialogType = "show";
        this.productGetById(row.id);

      }
      this.dialogVisible = true;
    },
    // 编辑详情
    async productGetById(id) {
      let params = {
        id: id,
      };
      let res = await authApi(
        "integrationTaskLivingService",
        "",
        "getEntity",
        "",
        params
      );
      if (res.status == "200") {
        this.$nextTick(() => {
          this.$refs.basicsForm.incomingParameters(res.attribute);
          // this.tableVersionData = res.attribute.sysPlugArgDetailEntityList
          // let result = [];
          // this.tableVersionData = Object.assign([], result);
        });
      }
    },
    addVersionDialog() {
      let obj = {
        argName:"",
        argCode:"",
        argType:"1",
        remark:"",
      };
      this.tableVersionData.push(obj);
    },
    // 删除
    onFunc(index, row) {
      if (index == 0) {
        this.$delConfirm().then(() => {
          this.tableVersionData.forEach((item, itemIndex) => {
            if (item.id === row.id) {
              this.tableVersionData.splice(itemIndex, 1);
            }
          });
        });
      }
    },
    // 弹窗关闭
    handleDialogClose() {
      this.tableVersionData = Object.assign([], []);
      this.$refs.basicsForm.resetFields();
      this.dialogVisible = false;
    },
    // 弹窗确认按钮
    handleConfirmClick() {
      this.$refs.basicsForm.$refs["ruleForm"].validate((valid) => {
        if (!valid) {
          return;
        } else {
          if(!this.tableVersionData.length){
            this.$vmNews("请添加列表")
            return
          }
          let flag = this.tableVersionData.some(item=>{
            if(!item.argName){
              this.$vmNews("请输入参数名称")
              return true
            }
            if(!item.argCode){
              this.$vmNews("参数编码")
              return true
            }
          })
          if(flag) return
          let params = {
            ...this.$refs.basicsForm.ruleForm,
            sysPlugArgDetailEntityList: this.tableVersionData,
          };
          if (this.dialogType == "add") {
            this.openLoading("submit");
            this.productSaveDto(params);
          }
          if (this.dialogType == "edit") {
            this.openLoading("submit");
            this.productUpdateDto(params);
          }
        }
      });
    },
    // 新增保存
    async productSaveDto(params) {
      let res = await authApi(
        "sysPlugArgService",
        "integrationTaskService",
        "savePlugArg",
        "",
        params
      );
      if (res.status == "200") {
        this.handleDialogClose();
        this.$vmNews("新增成功", "success");
        this.$emit("resetTable");
      }
    },
    // 编辑保存
    async productUpdateDto(params) {
      let res = await authApi(
        "sysPlugArgService",
        "integrationTaskService",
        "updatePlugArg",
        "",
        params
      );
      if (res.status == "200") {
        this.handleDialogClose();
        this.$vmNews("更新成功", "success");
        this.$emit("resetTable");
      }
    },
    // 获取所有产品分类
    async queryProductClassfy() {
      let params = {
        tab_name: "sys_product",
        column_name: "classify",
      };
      let res = await authApi(
        "generalServiceImpl",
        "dictionaryshop",
        "selectDictionaryshop",
        "",
        params
      );
      if (res.status == "200") {
        this.formRow[1].elCol[0].options = res.attribute;
      }
    },
  },
};
</script>

<style scoped lang="scss">
.dialogList {
  padding: 16px 0;
  border-top: 1px solid #dcdfe6;
  display: flex;
  flex-direction: column;
}

.updateBtn {
  border: 1px solid #ebedf1;
  padding: 5px 0;
  border-radius: 3px;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  width: 100px;
}

.updateBtn:hover {
  color: #1890ff;
  border-color: #badeff;
  background-color: #e8f4ff;
}

::v-deep .el-table__body-wrapper.is-scrolling-none {
  height: auto !important;
}

::v-deep .app-container {
  height: auto !important;
}
</style>
