From ef45054b4a2b22e242e6735115f1bb11a4428bb7 Mon Sep 17 00:00:00 2001
From: zhangjun1 <zhangjun@bd-apaas.com>
Date: Wed, 28 Jun 2023 16:31:43 +0800
Subject: [PATCH] =?UTF-8?q?[feat](=E4=BB=BB=E5=8A=A1=E7=AE=A1=E7=90=86):?=
 =?UTF-8?q?=20=E9=9D=99=E6=80=81=E9=A1=B5=E9=9D=A2=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/bg-breadcrumb.vue              | 179 +++++++------
 .../task-manage/add/finish-use.vue            | 225 ++++++++++++++++
 .../task-manage/add/finish.vue                |  12 +-
 .../task-manage/add/index.vue                 | 113 ++++++--
 .../auto-maintenance/task-manage/index.vue    | 243 +++++++-----------
 5 files changed, 496 insertions(+), 276 deletions(-)
 create mode 100644 src/page/main/auto-maintenance/task-manage/add/finish-use.vue

diff --git a/src/components/bg-breadcrumb.vue b/src/components/bg-breadcrumb.vue
index 5a7dd39..7779881 100644
--- a/src/components/bg-breadcrumb.vue
+++ b/src/components/bg-breadcrumb.vue
@@ -1,117 +1,112 @@
 <template>
   <div class="bg-breadcrumb">
     <el-breadcrumb separator="/">
-      <el-breadcrumb-item v-if="state.breadcrumbData.length>=2" v-for="(item,index) in state.dataArr" :to="{ path: item.path }"> {{item.name}} </el-breadcrumb-item>
-      <el-breadcrumb-item> {{state.breadcrumbData[state.breadcrumbData.length-1].name}} </el-breadcrumb-item>
+      <el-breadcrumb-item
+        v-if="state.breadcrumbData.length >= 2"
+        v-for="(item, index) in state.dataArr"
+        :to="{ path: item.path }">
+        {{ item.name }}
+      </el-breadcrumb-item>
+      <el-breadcrumb-item> {{ state.breadcrumbData[state.breadcrumbData.length - 1].name }} </el-breadcrumb-item>
     </el-breadcrumb>
   </div>
 </template>
 
 <script setup>
-import { reactive, ref,onBeforeMount,toRefs  } from 'vue'
-import { useRouter,useRoute } from 'vue-router'
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
 import store from "@/store";
-import { ElMessage } from 'element-plus'
-const router = useRouter()
-const route = useRoute()
+import { ElMessage } from "element-plus";
+const router = useRouter();
+const route = useRoute();
 
 const state = reactive({
-dataArr:[],
-breadcrumbData:[]
-})
+  dataArr: [],
+  breadcrumbData: [],
+});
 
 const props = defineProps({
-isMenu:{
-  type:Boolean,
-  default:false
-}
-})
+  isMenu: {
+    type: Boolean,
+    default: false,
+  },
+});
 
-const getBreadcrumbData = (menuObj,menu,path)=>{
-//获取整体需要路径
-let parentPath = menuObj[path].rowPath.slice(1,menuObj[path].rowPath.length).split('.')
-getFirstPath(parentPath,menu)
-//有2层以上的面包屑显示,则继续向下处理
-if(parentPath.length>=2){
-  getOtherPath(parentPath,menu)
-}
-}
+const getBreadcrumbData = (menuObj, menu, path) => {
+  //获取整体需要路径
+  let parentPath = menuObj[path].rowPath.slice(1, menuObj[path].rowPath.length).split(".");
+  getFirstPath(parentPath, menu);
+  //有2层以上的面包屑显示,则继续向下处理
+  if (parentPath.length >= 2) {
+    getOtherPath(parentPath, menu);
+  }
+};
 
-const getFirstPath = (parentPath,menu)=>{
-let tempMenu = menu[parentPath[0]]
-if (!props.isMenu) {
-  tempMenu = tempMenu.children[parentPath[1]]
-}
-//目录则跳转第一个子类，菜单子菜单则跳转自身
-if(tempMenu.menuType==0){
-  if(tempMenu.children&&tempMenu.children.length){
-    for (let index = 0; index < tempMenu.children.length; index++) {
-      const e = tempMenu.children[index];
-      if(e.menuType!==0){
-        state.breadcrumbData.push(
-          {
-            path:e.path,
-            name:tempMenu.menuName
-          }
-        )
-        break
+const getFirstPath = (parentPath, menu) => {
+  let tempMenu = menu[parentPath[0]];
+  if (!props.isMenu) {
+    tempMenu = tempMenu.children[parentPath[1]];
+  }
+  //目录则跳转第一个子类，菜单子菜单则跳转自身
+  if (tempMenu.menuType == 0) {
+    if (tempMenu.children && tempMenu.children.length) {
+      for (let index = 0; index < tempMenu.children.length; index++) {
+        const e = tempMenu.children[index];
+        if (e.menuType !== 0) {
+          state.breadcrumbData.push({
+            path: e.path,
+            name: tempMenu.menuName,
+          });
+          break;
+        }
       }
     }
+  } else {
+    state.breadcrumbData.push({
+      path: tempMenu.path,
+      name: tempMenu.menuName,
+    });
   }
-}else{
-  state.breadcrumbData.push(
-    {
-      path:tempMenu.path,
-      name:tempMenu.menuName
-    }
-  )
-}
-}
-
-const getOtherPath = (parentPath,menu)=>{
-let tempMenu = menu[parentPath[0]]
-let index
-if (!props.isMenu) {
-  index = 2
-  tempMenu = tempMenu.children[parentPath[1]].children||[]
-}else {
-  tempMenu = tempMenu.children || []
-  index = 1
-}
-if(tempMenu.length&&parentPath[index]){
-  getPath(tempMenu,parentPath,index)
-}
-}
+};
 
-const getPath = (tempMenu,parentPath,index)=>{
-if(!tempMenu[parentPath[index]]){
-  return
-}
-tempMenu = tempMenu[parentPath[index]]
-index = index+1
-state.breadcrumbData.push(
-  {
-    path:tempMenu.path,
-    name:tempMenu.menuName
+const getOtherPath = (parentPath, menu) => {
+  let tempMenu = menu[parentPath[0]];
+  let index;
+  if (!props.isMenu) {
+    index = 2;
+    tempMenu = tempMenu.children[parentPath[1]].children || [];
+  } else {
+    tempMenu = tempMenu.children || [];
+    index = 1;
   }
-)
-if(tempMenu.children&&tempMenu.children.length&&parentPath[index]){
-  getPath(tempMenu.children,parentPath,index)
-}
-}
-
-onBeforeMount(()=>{
-getBreadcrumbData(store.state.menuObj,store.state.menu,route.path)
-state.breadcrumbData.forEach((e,idx) => {
-  if(idx!==state.breadcrumbData.length-1){
-    state.dataArr.push(e)
+  if (tempMenu.length && parentPath[index]) {
+    getPath(tempMenu, parentPath, index);
   }
-});
-})
+};
 
+const getPath = (tempMenu, parentPath, index) => {
+  if (!tempMenu[parentPath[index]]) {
+    return;
+  }
+  tempMenu = tempMenu[parentPath[index]];
+  index = index + 1;
+  state.breadcrumbData.push({
+    path: tempMenu.path,
+    name: tempMenu.menuName,
+  });
+  if (tempMenu.children && tempMenu.children.length && parentPath[index]) {
+    getPath(tempMenu.children, parentPath, index);
+  }
+};
 
+onBeforeMount(() => {
+  getBreadcrumbData(store.state.menuObj, store.state.menu, route.path);
+  state.breadcrumbData.forEach((e, idx) => {
+    if (idx !== state.breadcrumbData.length - 1) {
+      state.dataArr.push(e);
+    }
+  });
+});
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/finish-use.vue b/src/page/main/auto-maintenance/task-manage/add/finish-use.vue
new file mode 100644
index 0000000..22446d4
--- /dev/null
+++ b/src/page/main/auto-maintenance/task-manage/add/finish-use.vue
@@ -0,0 +1,225 @@
+<template>
+  <div>
+    <div class="state-box">
+      <span
+        ><bg-icon style="font-size: 12px; color: #909bb6" icon="#bg-ic-time"></bg-icon> 已经过：{{ props.time }}</span
+      >
+      <div class="state-show success" v-if="props.state">
+        <bg-icon style="color: #429e8a" icon="#bg-ic-s-circle-check"></bg-icon> 执行成功
+      </div>
+      <div class="state-show fail" v-else>
+        <bg-icon style="color: #d75138" icon="#bg-ic-s-circle-close"></bg-icon> 执行失败
+      </div>
+    </div>
+    <div class="log-bg bg-scroll">
+      <div class="log-box">
+        <div v-for="(item, i) in stateData.codes" :key="i" class="codes-box">
+          <span class="codes-num">{{ item.pos + 1 }}</span>
+          <span class="codes-out" v-html="item.out"></span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+const router = useRouter();
+const route = useRoute();
+
+const props = defineProps({
+  codes: {
+    type: Array,
+    default: () => [],
+  },
+  state: {
+    type: Boolean,
+    default: true,
+  },
+  time: {
+    type: String,
+    default: "",
+  },
+});
+
+const stateData = reactive({
+  codes: [
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+    {
+      pos: 0,
+      out: "SSH password:",
+    },
+    {
+      pos: 1,
+      out: "[WARNING]: Platform darwin on host 192.168.1.199 is using the discovered Pythoninterpreter at /usr/bin/python3, but future installation of another Pythoninterpreter could change ",
+    },
+    {
+      pos: 2,
+      out: "the meaning of that path. See",
+    },
+    {
+      pos: 3,
+      out: "https://docs.ansible.com/ansible-",
+    },
+  ],
+});
+</script>
+
+<style lang="scss" scoped>
+.state-box {
+  width: 100%;
+  height: 36px;
+  margin-top: -18px;
+  margin-bottom: 12px;
+  position: relative;
+  font-size: 14px;
+  color: #404a62;
+  span {
+    position: absolute;
+    left: 0;
+    top: 10px;
+  }
+
+  .state-show {
+    width: 200px;
+    height: 36px;
+    line-height: 36px;
+    text-align: center;
+    border-radius: 4px;
+    margin: 0 auto;
+  }
+  .success {
+    background-color: #ecf5f4;
+  }
+  .fail {
+    background-color: #fbeeeb;
+  }
+}
+
+.log-bg {
+  background-color: #f7f7f9;
+  border-radius: 6px;
+  padding: 20px;
+  height: calc(100vh - 370px);
+  overflow-x: hidden;
+  .log-box {
+    width: 100%;
+    .codes-box {
+      padding: 6px 0;
+      display: flex;
+      display: -webkit-flex;
+      align-items: center;
+      font-size: 14px;
+    }
+
+    .codes-num {
+      width: 60px;
+      color: #8890a7;
+      display: inline-block;
+      height: inherit;
+    }
+
+    .codes-out {
+      width: calc(100% - 70px);
+      color: #242c43;
+      display: inline-block;
+      white-space: pre-wrap;
+      word-wrap: break-word;
+      height: inherit;
+    }
+  }
+}
+</style>
diff --git a/src/page/main/auto-maintenance/task-manage/add/finish.vue b/src/page/main/auto-maintenance/task-manage/add/finish.vue
index 560d469..408c061 100644
--- a/src/page/main/auto-maintenance/task-manage/add/finish.vue
+++ b/src/page/main/auto-maintenance/task-manage/add/finish.vue
@@ -2,8 +2,9 @@
   <div class="step-container">
     <div class="step-base">
       <img src="@/assets/imgs/img_data-complete.png" />
-      <p class="tips">新增成功</p>
-      <div class="apaas_button btns">
+      <p class="tips" v-if="props.state">新增成功</p>
+      <p class="tips" v-else>新增失败</p>
+      <div class="apaas_button btns" v-if="props.state">
         <el-button type="default" @click="goToList"> 返回列表 </el-button>
         <el-button type="primary" @click="goStepOne"> 继续新增 </el-button>
       </div>
@@ -18,6 +19,13 @@ import { ElMessage } from "element-plus";
 const router = useRouter();
 const route = useRoute();
 
+const props = defineProps({
+  state: {
+    type: Boolean,
+    default: true,
+  },
+});
+
 const emit = defineEmits(["clear"]);
 
 const goToList = () => {
diff --git a/src/page/main/auto-maintenance/task-manage/add/index.vue b/src/page/main/auto-maintenance/task-manage/add/index.vue
index 2242275..1fb4d36 100644
--- a/src/page/main/auto-maintenance/task-manage/add/index.vue
+++ b/src/page/main/auto-maintenance/task-manage/add/index.vue
@@ -39,19 +39,44 @@
           </el-steps>
         </div>
       </div>
-      <div class="content_main log_content_nor" :style="step == 3 ? { height: 'calc(100vh - 234px)' } : {}">
+      <div
+        class="content_main log_content_nor"
+        :style="step == 3 && state.isSave ? { height: 'calc(100vh - 234px)' } : {}">
         <base-info v-show="step == 1" :data="state.data" ref="baseInfoRef"></base-info>
         <use-content v-show="step == 2" :data="state.data" ref="useContentRef"></use-content>
-        <finish v-show="step == 3" @clear="clearData"></finish>
+        <finish v-show="step == 3 && state.isSave" :state="true" @clear="clearData"></finish>
+        <finish-use v-show="step == 3 && !state.isSave" :state="true" time="00:00:11"></finish-use>
       </div>
-      <div class="content_foot apaas_button" v-if="step == 1 || step == 2">
-        <el-button type="default" @click="cancel"> 取消 </el-button>
+      <div class="content_foot apaas_button" v-if="step == 1 || step == 2 || (step == 3 && !state.isSave)">
+        <el-button type="default" v-if="step == 1 || step == 2" @click="cancel"> 取消 </el-button>
         <el-button type="default" v-if="step == 2" @click="confirm(-1)"> 上一步 </el-button>
         <el-button type="primary" v-if="step == 1" @click="confirm(1)"> 下一步 </el-button>
-        <el-button type="primary" v-if="step == 2" @click="confirm(1)"> 保存 </el-button>
+        <el-button type="primary" v-if="step == 2" @click="saveTask()"> 保存 </el-button>
         <el-button type="success" v-if="step == 2" @click="useScript"> 立即执行 </el-button>
+        <el-button type="default" v-if="step == 3" @click="cancel"> 返回列表 </el-button>
+        <el-button type="primary" v-if="step == 3" @click="postScript"> 重新执行 </el-button>
       </div>
     </div>
+
+    <el-dialog class="dialog_box" title="立即执行" v-model="state.useScriptShow" width="1024px">
+      <div>
+        <div class="dialog-tips">
+          <bg-icon icon="#bg-ic-s-circle-warning" style="color: #a9b1c7"></bg-icon> 向执行脚本传递额外的命令行变量。这是
+          ansible-playbook 的 -e 或 --extra-vars 命令行参数。使用 YAML 或 JSON 提供键/值对，此项为非必填项。
+        </div>
+        <bg-inner-tabs v-model="state.useType" :data="state.useData" style="float: left"></bg-inner-tabs>
+        <div style="clear: both"></div>
+        <div style="height: 370px">
+          <bg-code-editor v-model="state.useText"></bg-code-editor>
+        </div>
+      </div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelUse">取消</el-button>
+          <el-button type="primary" @click="confirmUse">保存</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -64,6 +89,7 @@ import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
 import baseInfo from "./base-info.vue";
 import useContent from "./use-content.vue";
 import finish from "./finish.vue";
+import finishUse from "./finish-use.vue";
 const router = useRouter();
 const route = useRoute();
 
@@ -73,6 +99,11 @@ const useContentRef = ref(null);
 
 const state = reactive({
   data: {},
+  useScriptShow: false,
+  useType: 0,
+  useData: ["yaml", "json"],
+  useText: "",
+  isSave: true,
 });
 
 const cancel = () => {
@@ -82,34 +113,54 @@ const cancel = () => {
 const confirm = async (val) => {
   let flag = true;
   if (val == 1) {
-    if (step.value == 1) {
-      //下一步
-      await baseInfoRef.value
-        .save()
-        .then()
-        .catch(() => {
-          flag = false;
-        });
-    } else if (step.value == 2) {
-      //保存
-      await useContentRef.value
-        .save()
-        .then(() => {
-          saveTask();
-        })
-        .catch(() => {
-          flag = false;
-        });
-    }
+    await baseInfoRef.value
+      .save()
+      .then()
+      .catch(() => {
+        flag = false;
+      });
   }
   if (flag) {
     step.value = step.value + val;
   }
 };
 
-const saveTask = () => {};
+//保存
+const saveTask = async () => {
+  await useContentRef.value
+    .save()
+    .then(() => {
+      step.value = 3;
+      //todo:掉接口保存，并获取状态
+    })
+    .catch(() => {});
+};
+
+const useScript = async () => {
+  //填写完成才可以进行执行
+  await useContentRef.value
+    .save()
+    .then(() => {
+      state.useScriptShow = true;
+    })
+    .catch(() => {
+      ElMessage.error("请先完善表单再执行");
+    });
+};
+
+const cancelUse = () => {
+  state.useScriptShow = false;
+};
 
-const useScript = () => {};
+const confirmUse = () => {
+  state.useScriptShow = false;
+  state.isSave = false;
+  step.value = 3;
+  // TODO:调用接口立即执行
+  postScript();
+};
+
+const postScript = () => {};
 
 const clearData = () => {
   baseInfoRef.value.clear();
@@ -200,4 +251,14 @@ onBeforeMount(() => {});
 .process_complete :deep(.el-step__head.is-finish .el-step__line) {
   background: linear-gradient(to right, #2b4695 100%, #e6e9ef 0%);
 }
+
+.dialog-tips {
+  height: 38px;
+  line-height: 38px;
+  background-color: #f7f7f9;
+  border-radius: 4px;
+  font-size: 14px;
+  color: #404a62;
+  margin-bottom: 16px;
+}
 </style>
diff --git a/src/page/main/auto-maintenance/task-manage/index.vue b/src/page/main/auto-maintenance/task-manage/index.vue
index b920fc2..308ee13 100644
--- a/src/page/main/auto-maintenance/task-manage/index.vue
+++ b/src/page/main/auto-maintenance/task-manage/index.vue
@@ -5,7 +5,7 @@
       <bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入关键字">
         <template v-slot:left_action>
           <div class="apaas_button">
-            <el-button type="primary" @click="register">
+            <el-button type="primary" @click="gotoPage(`/auto-maintenance/task-manage/add`)">
               <bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-add"></bg-icon>
               新增
             </el-button>
@@ -46,7 +46,10 @@
             :select="true"
             :stripe="true">
             <template v-slot:name="{ row }">
-              <span class="can_click_text" @click="getChildren(row)" v-if="row.children">
+              <span
+                class="can_click_text"
+                @click="gotoPage(`/auto-maintenance/task-manage/detail?id=${row.id}`)"
+                v-if="row.children">
                 {{ row.name }}
               </span>
               <span v-else>
@@ -59,9 +62,9 @@
             <template v-slot:action="{ row }">
               <bg-table-btns2 :limit="3" :tableData="tableRows">
                 <bg-table-btn @click="useRow(row)">执行任务</bg-table-btn>
-                <bg-table-btn @click="editRow(row)">编辑</bg-table-btn>
-                <bg-table-btn @click="copyRow(row, 1)">复制</bg-table-btn>
-                <bg-table-btn @click="deleteRow(row, 2)">删除</bg-table-btn>
+                <bg-table-btn @click="gotoPage(`/auto-maintenance/task-manage/edit?id=${row.id}`)">编辑</bg-table-btn>
+                <bg-table-btn @click="gotoPage(`/auto-maintenance/task-manage/copy?id=${row.id}`)">复制</bg-table-btn>
+                <bg-table-btn @click="deleteRow(row)">删除</bg-table-btn>
               </bg-table-btns2>
             </template>
           </bg-table>
@@ -75,75 +78,45 @@
         </bg-pagination>
       </div>
     </div>
-    <!-- 新增/编辑弹窗 -->
-    <!-- <el-dialog
-      class="dialog_box"
-      :title="addType == 1 ? '新增' : '编辑'"
-      v-model="addDialog"
-      width="758px">
-      <el-form ref="bgForm" :model="formData" :rules="rules" label-width="80px" class="bg_form">
-        <el-form-item label="名称" prop="name">
-          <el-input
-            v-model.trim="formData.name"
-            show-word-limit
-            :maxlength="
-              nodeClassifyId == 'eb9c7d70-c123-42b7-8e61-dde1b022b669'
-                ? 6
-                : nodeClassifyId == 'efd9ec3b-7f18-49e2-9d88-bcca022243bb'
-                ? 4
-                : nodeClassifyId == '949a1138-4995-464e-97a9-424d097eb271'
-                ? 2
-                : 20
-            "
-            placeholder="请输入名称"></el-input>
-        </el-form-item>
-        <el-form-item label="描述" prop="describe">
-          <el-input
-            v-model="formData.describe"
-            type="textarea"
-            :autosize="{ minRows: 5 }"
-            show-word-limit
-            maxlength="200"
-            resize="vertical"
-            placeholder="请输入描述"></el-input>
-        </el-form-item>
-        <el-form-item label="是否启用" prop="state" style="margin-bottom: 0px">
-          <el-switch
-            class="bg-switch-ele"
-            v-model="formData.state"
-            :active-value="1"
-            :inactive-value="0"
-            inline-prompt
-            active-text="是"
-            inactive-text="否" />
-        </el-form-item>
-      </el-form>
-      <template v-slot:footer>
-        <div class="apaas_button">
-          <el-button type="default" @click="addDialog = false">取 消</el-button>
-          <el-button type="primary" @click="addConfirm">保 存</el-button>
-        </div>
-      </template>
-    </el-dialog> -->
     <!-- 删除弹窗 -->
-    <!-- <el-dialog
+    <el-dialog
       class="dialog_box"
       title="提示"
-      v-model="dialogDelete"
+      v-model="state.dialogDelete"
       width="400px"
       :before-close="
         () => {
           dialogDelete = false;
         }
       ">
-      <div>确定要删除此字典值吗？</div>
+      <div>确定要删除任务吗？</div>
       <template v-slot:footer>
         <div class="apaas_button">
-          <el-button type="default" @click="dialogDelete = false">取 消</el-button>
+          <el-button type="default" @click="state.dialogDelete = false">取 消</el-button>
           <el-button type="primary" @click="deleteData">确 定</el-button>
         </div>
       </template>
-    </el-dialog> -->
+    </el-dialog>
+
+    <el-dialog class="dialog_box" title="立即执行" v-model="state.useScriptShow" width="1024px">
+      <div>
+        <div class="dialog-tips">
+          <bg-icon icon="#bg-ic-s-circle-warning" style="color: #a9b1c7"></bg-icon> 向执行脚本传递额外的命令行变量。这是
+          ansible-playbook 的 -e 或 --extra-vars 命令行参数。使用 YAML 或 JSON 提供键/值对，此项为非必填项。
+        </div>
+        <bg-inner-tabs v-model="state.useType" :data="state.useData" style="float: left"></bg-inner-tabs>
+        <div style="clear: both"></div>
+        <div style="height: 370px">
+          <bg-code-editor v-model="state.useText"></bg-code-editor>
+        </div>
+      </div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelUse">取消</el-button>
+          <el-button type="primary" @click="confirmUse">保存</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -157,7 +130,6 @@ import { useRouter, useRoute } from "vue-router";
 const router = useRouter();
 const route = useRoute();
 
-const bgForm = ref(null);
 const dataTable = ref(null);
 const headers = [
   {
@@ -191,13 +163,15 @@ const headers = [
 ];
 
 const state = reactive({
-  bgForm,
-  typeList: [], // 分类数据
-  typeKeyword: "", // 分类删选关键词
-  nodeClassifyId: null, // 当前选中分类的uuid  用于新增字典
-  nodeId: null, // 当前选中分类的id  用于请求列表
-  timer: null, // 定时器
-  tableRows: [], // 表格数据
+  tableRows: [
+    {
+      name: 23123,
+      times: 1,
+      describe: 12313,
+      person: 21323,
+      updated_time: "2021-01-01+TZ",
+    },
+  ], // 表格数据
   selected: [], //选择数据
   tableTotal: 0, // 表格数据条数
   filter: {
@@ -206,41 +180,35 @@ const state = reactive({
     page: 1,
     limit: 10,
   }, // 表格筛选项
-  stateOptions: [
-    {
-      name: "全部",
-      value: "",
-    },
-    {
-      name: "启用",
-      value: "1",
-    },
-    {
-      name: "禁用",
-      value: "0",
-    },
-  ], // 启用禁用
   actionRow: null, // 当前操作的数据
   dialogDelete: false, // 删除弹窗
-  addType: 0, //
-  addDialog: false,
-  formData: {
-    name: "",
-    describe: "",
-    state: 1,
-    p_dict_id: "",
-  },
-  rules: {
-    name: [{ required: true, message: "请输入名称", trigger: "blur" }],
-    describe: [
-      { required: true, message: "请输入描述", trigger: "blur" },
-      { max: 200, message: "描述最大为200字", trigger: "blur" },
-    ],
-    state: [{ required: true, message: "请选择是否启用", trigger: "change" }],
-  },
-  fatherRow: null,
+  useScriptShow: false,
+  useType: 0,
+  useData: ["yaml", "json"],
 });
 
+const useRow = (row) => {
+  state.actionRow = row;
+  state.useScriptShow = true;
+};
+
+const cancelUse = () => {
+  state.useScriptShow = false;
+};
+
+const confirmUse = () => {
+  state.useScriptShow = false;
+};
+
+const deleteRow = (row) => {
+  state.actionRow = row;
+  state.dialogDelete = true;
+};
+
+const deleteData = () => {
+  state.dialogDelete = false;
+};
+
 const selectRows = (data) => {
   state.selected = data.selection;
 };
@@ -249,39 +217,17 @@ const clearSelected = () => {
   dataTable.value.clearTable();
 };
 
-const deleteAllTips = () => {};
-
-const dictLevel = ref(1);
-
-const getChildren = (row) => {
-  dictLevel.value = 2;
-  state.tableRows = row.children || [];
-  state.tableTotal = row.total_children;
-  state.fatherRow = row;
+const deleteAllTips = () => {
+  if (state.selected.length > 0) {
+    state.dialogDelete = true;
+  } else {
+    ElMessage.error("请先选择要删除任务");
+  }
 };
 
-const getTypeList = () => {
-  let params = {
-    name: state.typeKeyword,
-  };
-  axios
-    .get(`/apaas/system/v5/dictionary/classify/list`, { params })
-    .then((res) => {
-      if (res.data.code == 200) {
-        state.typeList = res.data.data || [];
-        state.nodeClassifyId = state.typeList[0].classify_id || null;
-        state.nodeId = state.typeList[0].id || null;
-        if (state.nodeId) {
-          getTableRows();
-        }
-      } else {
-        ElMessage.error(res.data.data);
-      }
-    })
-    .catch((err) => {
-      console.log(err);
-    });
-}; // 获取字典分类
+const gotoPage = (url) => {
+  router.push(url);
+};
 
 const changeSearch = (val) => {
   state.filter.search = val;
@@ -304,7 +250,6 @@ const filterClear = () => {
 
 const getTableRows = () => {
   let params = { ...state.filter };
-  params.id = state.nodeId;
   axios
     .get(`/apaas/system/v5/dictionary/list`, {
       params,
@@ -312,24 +257,6 @@ const getTableRows = () => {
     .then((res) => {
       if (res.data.code == 200) {
         let data = res.data.data || [];
-        if (dictLevel.value == 1) {
-          state.tableRows = data;
-          state.tableTotal = res.data.total;
-        } else {
-          let row = data.filter((e) => {
-            return e.dict_id == state.fatherRow.dict_id;
-          });
-          state.tableRows = row[0].children;
-          state.tableTotal = row[0].total_children;
-        }
-        if (state.tableRows.length > 0) {
-          state.tableRows.forEach((e) => {
-            e.canMoveUp = true;
-            e.canMoveDown = true;
-          });
-          state.tableRows[0].canMoveUp = false;
-          state.tableRows[state.tableRows.length - 1].canMoveDown = false;
-        }
       } else {
         ElMessage.error(res.data.data);
       }
@@ -346,13 +273,7 @@ const changeSize = (size) => {
   changePage(1);
 }; // 改变每页条数
 
-const register = () => {
-  router.push(`/auto-maintenance/task-manage/add`);
-};
-
-onBeforeMount(() => {
-  getTypeList();
-});
+onBeforeMount(() => {});
 
 const { tableRows, tableTotal, filter } = toRefs(state);
 </script>
@@ -430,4 +351,14 @@ const { tableRows, tableTotal, filter } = toRefs(state);
     }
   }
 }
+
+.dialog-tips {
+  height: 38px;
+  line-height: 38px;
+  background-color: #f7f7f9;
+  border-radius: 4px;
+  font-size: 14px;
+  color: #404a62;
+  margin-bottom: 16px;
+}
 </style>
-- 
2.26.0