Skip to content

B
bigDataSystem
Commit e3b8b849 authored by 罗林杰's avatar 罗林杰
Browse files
Options

修改任务运维

parent a4a7ea6d
Hide whitespace changes
Inline Side-by-side
Showing with 207 additions and 176 deletions
src/views/dataIntegration/taskOM/index.vue
View file @ e3b8b849
...@@ -158,6 +158,9 @@ ...@@ -158,6 +158,9 @@
/> />
{{ text }} {{ text }}
</template> </template>
<template #version="{ text }">
<a @click="handleEdit">{{ text }}</a>
</template>
</basic-table> </basic-table>
</template> </template>
</PageWrapper> </PageWrapper>
...@@ -373,7 +376,7 @@ ...@@ -373,7 +376,7 @@
createConfirm({ createConfirm({
iconType: 'warning', iconType: 'warning',
title: '重跑', title: '重跑',
content: '确认重跑选中数据吗？', content: '确认重跑吗？',
onOk() { onOk() {
createMessage.success('重跑成功!'); createMessage.success('重跑成功!');
}, },
...@@ -385,7 +388,7 @@ ...@@ -385,7 +388,7 @@
createConfirm({ createConfirm({
iconType: 'warning', iconType: 'warning',
title: '错误恢复', title: '错误恢复',
content: '确认恢复选中数据吗？', content: '确认恢复吗？',
onOk() { onOk() {
createMessage.success('恢复成功!'); createMessage.success('恢复成功!');
}, },
...@@ -397,7 +400,7 @@ ...@@ -397,7 +400,7 @@
createConfirm({ createConfirm({
iconType: 'warning', iconType: 'warning',
title: '取消执行', title: '取消执行',
content: '确认取消执行选中数据吗？', content: '确认取消执行吗？',
onOk() { onOk() {
createMessage.success('取消执行成功!'); createMessage.success('取消执行成功!');
}, },
......
src/views/dataIntegration/taskOM/recordDetails.vue
View file @ e3b8b849
<template> <template>
<page-wrapper> <page-wrapper>
<div class="callerManage_details"> <div class="callerManage_details">
<div class="header"> <div class="header">
<Icon @click="handleGoBack" class="backBtn" icon="ant-design:left-outlined" :size="20" :color="'#666C81'" /> <Icon
<div class="header_info"> @click="handleGoBack"
<div>TDT1&nbsp;&nbsp;&nbsp;运行详情</div> class="backBtn"
icon="ant-design:left-outlined"
:size="20"
:color="'#666C81'"
/>
<div class="header_info">
<div>TDT1&nbsp;&nbsp;&nbsp;运行详情</div>
</div>
</div> </div>
</div> <!-- <step-header title="已使用服务"/>-->
<!-- <step-header title="已使用服务"/>--> <BasicTable @register="registerTable" :rowSelection="rowSelection">
<BasicTable @register="registerTable" :rowSelection="rowSelection"> <template #callStatus="{ text, record }">
<template #callStatus="{ text, record }"> <Icon
<Icon v-if="text === '成功'" icon="ant-design:check-circle-filled" :size="15" :color="'rgb(84,198,159)'" /> v-if="text === '成功'"
<Icon v-else-if="text === '失败'" icon="line-md:close-circle-filled" :size="15" :color="'rgb(212, 115, 113)'" /> icon="ant-design:check-circle-filled"
<Icon v-else icon="line-md:loading-twotone-loop" :size="15" :color="'rgb(81, 160, 248)'" /> :size="15"
{{ text }} :color="'rgb(84,198,159)'"
</template> />
<template #bodyCell="{ column, record }"> <Icon
<template v-if="column.key === 'action'"> v-else-if="text === '失败'"
<TableAction icon="line-md:close-circle-filled"
:actions="[ :size="15"
{ :color="'rgb(212, 115, 113)'"
icon: 'ant-design:file-sync-outlined', />
// label: '日志', <Icon
onClick: handleDownloadLog.bind(null, record), v-else
}, icon="line-md:loading-twotone-loop"
]" :size="15"
:color="'rgb(81, 160, 248)'"
/> />
{{ text }}
</template> </template>
</template> <template #bodyCell="{ column, record }">
<template #toolbar> <template v-if="column.key === 'action'">
<div style="flex: 1;display: flex; justify-content: space-between;"> <TableAction
<div> :actions="[
<span>加载成功数量：2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span> {
<span>加载成功数量：0&nbsp;&nbsp;</span> icon: 'ant-design:file-sync-outlined',
<span>（加载成功数量：0，</span> // label: '日志',
<span>加载成功数量：0）</span> onClick: handleDownloadLog.bind(null, record),
</div> },
<div style="display: flex"> ]"
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDownloadLogs">批量下载日志</a-button> />
<div style="margin-left: 10px"> </template>
<a-input-search </template>
<template #toolbar>
<div style="flex: 1; display: flex; justify-content: space-between">
<div>
<span>加载成功数量：2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
<span>加载成功数量：0&nbsp;&nbsp;</span>
<span>（加载成功数量：0，</span>
<span>加载成功数量：0）</span>
</div>
<div style="display: flex">
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleDownloadLogs"
>批量下载日志</a-button
>
<div style="margin-left: 10px">
<a-input-search
v-model:value="value" v-model:value="value"
placeholder="请输入关键字" placeholder="请输入关键字"
style="width: 200px" style="width: 200px"
@search="onSearch" @search="onSearch"
/> />
</div>
</div> </div>
</div> </div>
</div> </template>
</BasicTable>
</div>
</template> <ViewTheLog @register="registerLog" />
</BasicTable>
</div>
<ViewTheLog @register="registerLog" />
</page-wrapper> </page-wrapper>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { InputNumber,Input } from 'ant-design-vue'; import { InputNumber, Input } from 'ant-design-vue';
import { EditOutlined } from '@ant-design/icons-vue'; import { EditOutlined } from '@ant-design/icons-vue';
import { useModal } from '@/components/Modal'; import { useModal } from '@/components/Modal';
import {router} from "@/router"; import { router } from '@/router';
import {detailsColumns, detailSchemas} from "./taskOM.data"; import { detailsColumns, detailSchemas } from './taskOM.data';
import Icon from "@/components/Icon/Icon.vue"; import Icon from '@/components/Icon/Icon.vue';
import StepHeader from "@/components/stepHeader.vue"; import StepHeader from '@/components/stepHeader.vue';
import {tableListDetails} from "./mock"; import { tableListDetails } from './mock';
import { BasicTable, useTable, TableAction } from '@/components/Table'; import { BasicTable, useTable, TableAction } from '@/components/Table';
import {ref} from "vue"; import { ref } from 'vue';
import ViewTheLog from "@/views/dataIntegration/taskOM/viewTheLog.vue"; import ViewTheLog from '@/views/dataIntegration/taskOM/viewTheLog.vue';
import PageWrapper from "@/components/Page/src/PageWrapper.vue"; import PageWrapper from '@/components/Page/src/PageWrapper.vue';
import { useMessage } from '@/hooks/web/useMessage';
const [registerLog,{ openModal:openDownloadLogModal }]= useModal(); const { createMessage, createConfirm } = useMessage();
const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm,getRowSelection }] = useTable({
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: tableListDetails.length,
code:'',
message:'',
data: tableListDetails,
};
return { ...response}; const [registerLog, { openModal: openDownloadLogModal }] = useModal();
}, const [
columns:detailsColumns, registerTable,
formConfig: { { reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
showActionButtonGroup:false, ] = useTable({
labelWidth: 120, api: async (params) => {
schemas: detailSchemas, const response = {
autoSubmitOnEnter: true, pageNu: '1',
}, pageSize: '10',
showIndexColumn: false, pages: '1',
useSearchForm: false, total: tableListDetails.length,
rowSelection:true, code: '',
showTableSetting: false, message: '',
bordered: false, data: tableListDetails,
actionColumn: { };
width: 120,
title: '查看日志',
dataIndex: 'action',
},
});
function handleGoBack() { return { ...response };
router.go(-1); },
} columns: detailsColumns,
function handleDownloadLog() { formConfig: {
// 模态框 showActionButtonGroup: false,
openDownloadLogModal(true); labelWidth: 120,
} schemas: detailSchemas,
function handleDownloadLogs() { autoSubmitOnEnter: true,
console.log('触发了下载日志按钮'); },
} showIndexColumn: false,
useSearchForm: false,
rowSelection: true,
showTableSetting: false,
bordered: false,
actionColumn: {
width: 120,
title: '查看日志',
dataIndex: 'action',
},
});
function handleGoBack() {
router.go(-1);
}
function handleDownloadLog() {
// 模态框
openDownloadLogModal(true);
}
function handleDownloadLogs() {
createConfirm({
iconType: 'warning',
title: '批量下载日志',
content: '确定要批量下载选中的日志吗？',
onOk: () => {
createMessage.success('批量下载日志成功');
},
});
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.callerManage_details{ .callerManage_details {
background-color: white; background-color: white;
padding: 20px; padding: 20px;
.header{ .header {
display: flex; display: flex;
align-items: center; align-items: center;
padding-bottom: 20px; padding-bottom: 20px;
.backBtn{ .backBtn {
cursor: pointer; cursor: pointer;
} }
.header_info{ .header_info {
padding-left: 15px; padding-left: 15px;
div{ div {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
}
} }
} }
} }
}
</style> </style>
src/views/dataIntegration/taskOM/taskOM.data.ts
View file @ e3b8b849
...@@ -32,6 +32,7 @@ export const columns: BasicColumn[] = [ ...@@ -32,6 +32,7 @@ export const columns: BasicColumn[] = [
title: '执行版本', title: '执行版本',
dataIndex: 'version', dataIndex: 'version',
width: 90, width: 90,
slots: { customRender: 'version' },
}, },
{ {
title: '执行模式', title: '执行模式',
......
src/views/dataIntegration/taskOM/viewTheLog.vue
View file @ e3b8b849
<template> <template>
<BasicModal <BasicModal width="40%" @register="registerModal" :title="getTitle" @ok="handleSubmit">
width="40%"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<template #insertFooter> <template #insertFooter>
<a-button @click="downloadLog" style="float: left;" type="link" >下载日志</a-button> <a-button @click="downloadLog" style="float: left" type="link">下载日志</a-button>
</template> </template>
<img class="w-1/1" src="@/assets/images/Log.png"/> <img class="w-1/1" src="@/assets/images/Log.png" />
</BasicModal> </BasicModal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {onMounted, ref, unref} from 'vue'; import { onMounted, ref, unref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal'; import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form'; import { BasicForm, useForm } from '@/components/Form';
import { importFormSchema } from './taskOM.data'; import { importFormSchema } from './taskOM.data';
import { useMessage } from '@/hooks/web/useMessage';
const emit = defineEmits(['success']);
const isUpdate = ref(true);
const isMove = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
// const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
// labelWidth: 100,
// baseColProps: { lg: 12, md: 24 },
// schemas: importFormSchema,
// showActionButtonGroup: false,
// actionColOptions: {
// span: 23,
// },
// });
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ const emit = defineEmits(['success']);
confirmLoading: false, const isUpdate = ref(true);
showOkBtn: false, const isMove = ref(false);
cancelText: '关闭', const rowId = ref('');
const { createMessage } = useMessage();
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
// const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
// labelWidth: 100,
// baseColProps: { lg: 12, md: 24 },
// schemas: importFormSchema,
// showActionButtonGroup: false,
// actionColOptions: {
// span: 23,
// },
// });
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({
confirmLoading: false,
showOkBtn: false,
cancelText: '关闭',
});
}); });
});
// onMounted(){} // onMounted(){}
// const getTitle = computed(() => '新建文件'); // const getTitle = computed(() => '新建文件');
const getTitle = '日志信息'; const getTitle = '日志信息';
onMounted(() => { onMounted(() => {
setModalProps({ setModalProps({
confirmLoading: false, confirmLoading: false,
showOkBtn: false, showOkBtn: false,
cancelText: '关闭', cancelText: '关闭',
height: 500, height: 500,
});
}); });
}) /**确定按钮*/
/**确定按钮*/ async function handleSubmit() {
async function handleSubmit() { closeModal();
closeModal(); }
} /**下载日志按钮*/
/**下载日志按钮*/ async function downloadLog() {
async function downloadLog() { createMessage.success('下载成功');
// await downloadFile('/api/file/downloadLog', { }
// fileName: 'test.txt',
// });
console.log('出发了下载日志按钮')
}
</script> </script>
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