Skip to content

S
so-manage-ui
Commit 49301110 authored by 张俊's avatar 张俊
Browse files
Options

[feat](历史任务): 部分接口对接

parent 47340c01
Hide whitespace changes
Inline Side-by-side
Showing with 106 additions and 234 deletions
src/page/main/auto-maintenance/task-history/index.vue
View file @ 49301110
......@@ -5,20 +5,29 @@
<bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入关键字"> </bg-filter-group>
<div class="table_container">
<div class="table bg-scroll">
<bg-table ref="dataTable" :headers="headers" :rows="tableRows" :stripe="true">
<template v-slot:name="{ row }">
<span class="can_click_text" @click="getChildren(row)">
{{ row.name }}
<bg-table :headers="headers" :rows="tableRows" :stripe="true">
<template v-slot:task_name="{ row }">
<span class="can_click_text" @click="gotoPage(row)">
{{ row.task_name }}
</span>
</template>
<template v-slot:state="{ row }">
<span> 执行中 </span>
<span>
<bg-icon
:style="{
color: ['#2b4695', '#429e8a', '#d75138'][row.state],
}"
:icon="
['#bg-ic-s-circle-restart', '#bg-ic-s-circle-check', '#bg-ic-s-circle-close'][row.state]
"></bg-icon>
{{ ["执行中", "成功", "失败"][row.state] }}
</span>
</template>
</bg-table>
</div>
<bg-pagination
:page="filter.page"
:size="filter.size"
:size="filter.page_size"
:total="tableTotal"
@change-page="changePage"
@change-size="changeSize">
......@@ -39,8 +48,6 @@ import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
const router = useRouter();
const route = useRoute();
const bgForm = ref(null);
const dataTable = ref(null);
const headers = [
{
label: "状态",
......@@ -48,92 +55,34 @@ const headers = [
},
{
label: "任务名称",
prop: "name",
prop: "task_name",
},
{
label: "执行耗时",
prop: "workTime",
label: "执行耗时(s)",
prop: "exec_time",
},
{
label: "操作人",
prop: "person",
prop: "create_user",
},
];
const state = reactive({
bgForm,
typeList: [], // 分类数据
typeKeyword: "", // 分类删选关键词
nodeClassifyId: null, // 当前选中分类的uuid 用于新增字典
nodeId: null, // 当前选中分类的id 用于请求列表
timer: null, // 定时器
tableRows: [], // 表格数据
selected: [], //选择数据
tableTotal: 0, // 表格数据条数
filter: {
time: "",
search: "",
page: 1,
limit: 10,
page_size: 10,
}, // 表格筛选项
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,
});
const selectRows = (data) => {
state.selected = data.selection;
};
const clearSelected = () => {
dataTable.value.clearTable();
};
const deleteAllTips = () => {};
const getChildren = (row) => {
router.push(`/auto-maintenance/task-history/list`);
const gotoPage = (row) => {
router.push(`/auto-maintenance/task-history/list?id=${row.task_id}`);
};
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 changeSearch = (val) => {
state.filter.search = val;
changePage(1);
......@@ -145,9 +94,8 @@ const filterAction = () => {
const filterClear = () => {
state.filter = {
time: "",
search: "",
limit: 10,
page_size: 10,
page: 1,
};
changePage(1);
......@@ -155,9 +103,8 @@ const filterClear = () => {
const getTableRows = () => {
let params = { ...state.filter };
params.id = state.nodeId;
axios
.get(`/apaas/system/v5/dictionary/list`, {
.get(`/v1/api/automated_mainten/task_history/list`, {
params,
})
.then((res) => {
......@@ -177,32 +124,12 @@ const changePage = (page) => {
}; // 改变页码
const changeSize = (size) => {
state.filter.limit = size;
state.filter.page_size = size;
changePage(1);
}; // 改变每页条数
const register = () => {
state.formData = {
name: "",
describe: "",
state: 1,
p_dict_id: state.fatherRow ? state.fatherRow.dict_id : "",
};
if (state.bgForm) {
nextTick().then(() => {
state.bgForm.validate((valid) => {
if (!valid) {
state.bgForm.clearValidate();
}
});
});
}
state.addType = 1;
state.addDialog = true;
}; // 新增字典按钮
onBeforeMount(() => {
getTypeList();
getTableRows();
});
const { tableRows, tableTotal, filter } = toRefs(state);
......
src/page/main/auto-maintenance/task-history/list/index.vue
View file @ 49301110
......@@ -17,19 +17,31 @@
<div class="table_container">
<div class="table bg-scroll">
<bg-table ref="dataTable" :headers="headers" :rows="tableRows" :stripe="true">
<template v-slot:desc="{ row }">
<template v-slot:exec_start_time="{ row }">
<span>{{ dateStringTransform(row.exec_start_time) }}</span>
</template>
<template v-slot:exec_desc="{ row }">
<span class="can_click_text" @click="gotoPage(`/auto-maintenance/task-history/list/record?id=${row.id}`)">
{{ row.desc }}
{{ row.exec_desc }}
</span>
</template>
<template v-slot:state="{ row }">
<span> 执行中 </span>
<span>
<bg-icon
:style="{
color: ['#2b4695', '#429e8a', '#d75138'][row.state],
}"
:icon="
['#bg-ic-s-circle-restart', '#bg-ic-s-circle-check', '#bg-ic-s-circle-close'][row.state]
"></bg-icon>
{{ ["执行中", "成功", "失败"][row.state] }}
</span>
</template>
</bg-table>
</div>
<bg-pagination
:page="filter.page"
:size="filter.size"
:size="filter.page_size"
:total="tableTotal"
@change-page="changePage"
@change-size="changeSize">
......@@ -46,6 +58,7 @@ import { ElMessage } from "element-plus";
import axios from "@/request/http.js";
import { Search } from "@element-plus/icons-vue";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import { dateStringTransform, downloadFile } from "@/services/helper.js";
const router = useRouter();
const route = useRoute();
......@@ -58,19 +71,19 @@ const headers = [
},
{
label: "执行说明",
prop: "desc",
prop: "exec_desc",
},
{
label: "执行开始时间",
prop: "begin",
prop: "exec_start_time",
},
{
label: "执行耗时",
prop: "workTime",
label: "执行耗时(s)",
prop: "exec_time",
},
{
label: "操作人",
prop: "person",
prop: "create_user",
},
];
......@@ -85,7 +98,7 @@ const state = reactive({
filter: {
search: "",
page: 1,
limit: 10,
page_size: 10,
}, // 表格筛选项
actionRow: null, // 当前操作的数据
});
......@@ -100,10 +113,12 @@ const changeSearch = (val) => {
}; // 表格关键字筛选
const getTableRows = () => {
let params = { ...state.filter };
params.id = state.nodeId;
let params = {
...state.filter,
task_id: route.query.id,
};
axios
.get(`/apaas/system/v5/dictionary/list`, {
.get(`/v1/api/automated_mainten/task_history/task_info_list`, {
params,
})
.then((res) => {
......@@ -123,11 +138,13 @@ const changePage = (page) => {
}; // 改变页码
const changeSize = (size) => {
state.filter.limit = size;
state.filter.page_size = size;
changePage(1);
}; // 改变每页条数
onBeforeMount(() => {});
onBeforeMount(() => {
getTableRows();
});
const { tableRows, tableTotal, filter } = toRefs(state);
</script>
......
src/page/main/auto-maintenance/task-history/list/record/index.vue
View file @ 49301110
......@@ -7,7 +7,7 @@
执行ping命令 / 执行说明1
</div>
<div class="middle-container">
<finish-use :state="true" height="calc(100vh - 330px)" time="00:00:11"></finish-use>
<finish-use :state="true" height="calc(100vh - 330px)" :codes="state.logArr" :time="state.time"></finish-use>
</div>
<div class="bottom-container">
<el-button class="use-script" type="primary" @click="router.go(-1)"> 重新执行 </el-button>
......@@ -22,10 +22,29 @@ import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import finishUse from "@/page/main/auto-maintenance/task-manage/add/finish-use.vue";
import axios from "@/request/http.js";
import { secondeToHour } from "@/services/helper.js";
const router = useRouter();
const route = useRoute();
const state = reactive({ data: 1 });
const { data } = toRefs(state);
const state = reactive({
time: "",
logArr: [],
});
const getLog = () => {
axios.get(`/v1/api/automated_mainten/task_history/task_exec_log?id=${route.query.id}`).then((res) => {
if (res.data.code == 200) {
let data = res.data.data;
state.time = secondeToHour(data.exec_time);
state.logArr = data.exec_log.split("\n");
}
});
};
onBeforeMount(() => {
getLog();
});
</script>
<style lang="scss" scoped>
......
src/page/main/auto-maintenance/task-manage/add/finish-use.vue
View file @ 49301110
......@@ -13,9 +13,9 @@
</div>
<div class="log-bg bg-scroll" :style="{ height: props.height }">
<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 v-for="(item, i) in props.codes" :key="i" class="codes-box">
<span class="codes-num">{{ i + 1 }}</span>
<span class="codes-out" v-html="item"></span>
</div>
</div>
</div>
......@@ -26,6 +26,8 @@
import { reactive, ref, onBeforeMount, toRefs } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
import axios from "@/request/http.js";
const router = useRouter();
const route = useRoute();
......@@ -47,119 +49,6 @@ const props = defineProps({
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>
......
src/page/main/auto-maintenance/task-manage/index.vue
View file @ 49301110
......@@ -65,7 +65,7 @@
</div>
<bg-pagination
:page="filter.page"
:size="filter.size"
:size="filter.page_size"
:total="tableTotal"
@change-page="changePage"
@change-size="changeSize">
......
src/services/helper.js
View file @ 49301110
......@@ -223,6 +223,25 @@ var timeForMatAdd = function (count) {
};
};
/**
* 传入秒数，输出多少小时，如10秒输出00:00:10
* @param {number} second
*/
var secondeToHour = function (second) {
let ss = second % 60;
let mm = Math.floor((second - ss) / 60) % 60;
let hh = (second - mm * 60 - ss) / 3600;
let deal = (num) => {
if (num < 10) {
return "0" + num;
} else {
return num;
}
};
return `${deal(hh)}:${deal(mm)}:${deal(ss)}`;
};
//计算时间差
var timeDifference = function (startTime, endTime) {
//可以传日期时间或时间戳
......@@ -330,4 +349,5 @@ export {
getImageUrl,
downloadBlob,
downloadFile,
secondeToHour,
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment