Skip to content

B
bigDataSystem
Commit 7a1778e6 authored by LiXuyang's avatar LiXuyang
Browse files
Options

任务流设置

parent eb7c71e5
Hide whitespace changes
Inline Side-by-side
Showing with 112 additions and 277 deletions
src/views/dataSharingAndExchange/ApiMonitor/ApiMonitorData.ts
View file @ 7a1778e6
......@@ -9,213 +9,111 @@ type CheckedType = boolean | string | number;
export const TreeData: any[] = [
{
delFlag: '0',
flag: '1',
businessId: 100,
institutionName: '机构管理',
anotherName: '机构管理',
parentId: 0,
code: 'DataGovernanceDep_product1',
ancestors: '0',
orderNum: 0,
key: '0',
title: '馈线反馈',
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 101,
institutionName: '数据平台治理部',
anotherName: '数据平台治理部',
parentId: 100,
code: 'DataGovernanceDep_product2',
ancestors: '0,100',
orderNum: 1,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 107,
institutionName: '数据资源管理部',
anotherName: '数据资源管理部',
parentId: 100,
code: 'DataGovernanceDep_product3',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 102,
institutionName: '研发部门',
anotherName: '研发部门',
parentId: 101,
code: 'DataGovernanceDep_product4',
ancestors: '0,100,101',
orderNum: 1,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 103,
institutionName: '市场部门',
anotherName: '市场部门',
parentId: 101,
code: 'DataGovernanceDep_product5',
ancestors: '0,100,101',
orderNum: 2,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 104,
institutionName: '测试部门',
anotherName: '测试部门',
parentId: 101,
code: 'DataGovernanceDep_product6',
ancestors: '0,100,101',
orderNum: 3,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 105,
institutionName: '财务部门',
anotherName: '财务部门',
parentId: 101,
code: 'DataGovernanceDep_product7',
ancestors: '0,100,101',
orderNum: 4,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 106,
institutionName: '运维部门',
anotherName: '运维部门',
parentId: 101,
code: 'DataGovernanceDep_product8',
ancestors: '0,100,101',
orderNum: 5,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '1',
businessId: 202,
institutionName: '数据部门',
anotherName: '数据部门',
parentId: 107,
code: 'DataGovernanceDep_product9',
ancestors: '0,100,107',
orderNum: 1,
children: [],
selectType: null,
icon: 'ion:settings-outline',
},
{
delFlag: '0',
flag: '0',
businessId: 203,
institutionName: '检查部门',
anotherName: '检查部门',
parentId: 107,
code: 'DataGovernanceDep_product10',
ancestors: '0,100,107',
orderNum: 2,
children: [],
selectType: null,
icon: 'ion:settings-outline',
icon: 'ant-design:folder-outlined',
},
{
key: '1',
title: '市场营销',
icon: 'ant-design:folder-outlined',
children: [
{
key: '1-0',
title: '供电单位用电量',
icon: 'ant-design:api-outlined',
},
{
key: '1-1',
title: '电费回收率',
icon: 'ant-design:api-outlined',
},
{
key: '1-2',
title: '中压馈线电流',
icon: 'ant-design:api-outlined',
},
{
key: '1-3',
title: '中压馈线指标',
icon: 'ant-design:api-outlined',
},
{
key: '1-4',
title: '馈线最大电流',
icon: 'ant-design:api-outlined',
},
],
},
];
export const TableData: any[] = [
{
gateway: 'gw-001',
executor: 'exec-001',
gateway: '35.84.167.92',
executor: '218.99.112.56',
caller: 'user-001',
startTime: '2024-11-30 13:05:05',
consume: '1s',
},
{
gateway: 'gw-002',
executor: 'exec-002',
gateway: '120.88.200.123',
executor: '51.198.72.14',
caller: 'user-002',
startTime: '2024-11-30 13:10:08',
consume: '2s',
},
{
gateway: 'gw-003',
executor: 'exec-003',
gateway: '19.75.138.255',
executor: '102.47.16.39',
caller: 'user-003',
startTime: '2024-11-30 13:20:09',
consume: '3s',
},
{
gateway: 'gw-004',
executor: 'exec-004',
gateway: '234.156.17.98',
executor: '212.71.48.99',
caller: 'user-004',
startTime: '2024-11-30 13:25:10',
consume: '4s',
},
{
gateway: 'gw-005',
executor: 'exec-005',
gateway: '102.194.123.75',
executor: '13.62.47.129',
caller: 'user-005',
startTime: '2024-11-30 13:30:11',
consume: '5s',
},
{
gateway: 'gw-006',
executor: 'exec-006',
gateway: '34.86.51.231',
executor: '176.35.22.176',
caller: 'user-006',
startTime: '2024-11-30 13:35:12',
consume: '6s',
},
{
gateway: 'gw-007',
executor: 'exec-007',
gateway: '84.29.59.110',
executor: '89.203.125.13',
caller: 'user-007',
startTime: '2024-11-30 13:40:13',
consume: '7s',
},
{
gateway: 'gw-008',
executor: 'exec-008',
gateway: '46.174.192.222',
executor: '12.195.44.58',
caller: 'user-008',
startTime: '2024-11-30 13:45:14',
consume: '8s',
},
{
gateway: 'gw-009',
executor: 'exec-009',
gateway: '219.31.51.27',
executor: '128.114.242.53',
caller: 'user-009',
startTime: '2024-11-30 13:50:15',
consume: '9s',
},
{
gateway: 'gw-010',
executor: 'exec-010',
gateway: '233.164.81.62',
executor: '19.78.211.9',
caller: 'user-010',
startTime: '2024-11-30 13:55:16',
consume: '10s',
......
src/views/dataSharingAndExchange/ApiMonitor/ApiMonitorTree.vue
View file @ 7a1778e6
......@@ -8,78 +8,20 @@
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="false"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'institutionName' }"
:treeData="TreeData"
@select="handleSelect"
/>
</div>
</template>
<script lang="ts" setup>
import {h, nextTick, onMounted, ref, unref} from 'vue';
import {BasicTree, TreeActionItem, TreeActionType, TreeItem} from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import {Nullable} from "@vben/types";
import { TreeData } from "@/views/system/institution/institutionData";
import {Modal} from "ant-design-vue";
import { useMessage } from '@/hooks/web/useMessage';
import {useModal} from "@/components/Modal";
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const { createMessage } = useMessage();
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
const [registerModal, { openModal }] = useModal();
const [registerMoveTreeModel, { openModal:openMoveTreeModel }] = useModal();
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
async function fetch() {
const data = TreeData
treeData.value = handleTree(data, 'businessId',undefined,undefined,undefined)
await nextTick(() => {
getTree().expandAll(true)
})
import { ref } from 'vue';
import { BasicTree, TreeActionType } from '@/components/Tree';
import { Nullable } from '@vben/types';
import { TreeData } from './ApiMonitorData';
const emit = defineEmits(['select']);
const treeRef = ref<Nullable<TreeActionType>>(null);
function handleSelect(keys) {
emit('select', keys[0]);
}
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
parentId = parentId || 'parentId'
children = children || 'children'
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data))
// 循环所有项
const treeData = cloneData.filter(father => {
const branchArr = cloneData.filter(child => {
// 返回每一项的子级数组
return father[id] === child[parentId]
})
branchArr.length > 0 ? father.children = branchArr : ''
// 返回第一层
return father[parentId] === rootId
})
return treeData !== '' ? treeData : data
}
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
/** 成功回调函数*/
function handleSuccess() {
}
</script>
src/views/dataSharingAndExchange/ApiMonitor/RightContent1.vue
View file @ 7a1778e6
<template>
<div class="center">
<div style="display: flex;justify-content: space-between;margin-left: 10px;padding-top: 10px">
<div
style="display: flex; justify-content: space-between; margin-left: 10px; padding-top: 10px"
>
<div style="display: flex">
<Icon icon="dashicons:admin-plugins" style="color: rgb(22, 179, 197);font-size: 30px"></Icon>
<Icon icon="dashicons:admin-plugins" style="color: rgb(22, 179, 197); font-size: 30px" />
<div>
<span style="font-weight: bold">供电单位用电量</span><br>
<span style="font-weight: bold">供电单位用电量</span><br />
<span>API监控/市场营销/供电单位用电量</span>
</div>
</div>
......@@ -14,7 +16,7 @@
</div>
</div>
<Alert
style="margin-top: 10px;margin-bottom: 10px"
style="margin-top: 10px; margin-bottom: 10px"
show-icon
type="info"
message="此处仅展示拉取数据模式的API调用情况。"
......@@ -27,16 +29,16 @@
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:delete-outlined',
color: 'error',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: deleteButton.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
color: 'error',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: deleteButton.bind(null, record),
},
]"
},
]"
/>
</template>
</template>
......@@ -46,13 +48,14 @@
<script lang="ts" setup>
import { CountTo } from '@/components/CountTo';
import Icon from '@/components/Icon/Icon.vue';
import { Tag, Card,Select,Alert } from 'ant-design-vue';
import { reactive,unref,onDeactivated,onMounted,ref,watch,Ref } from 'vue';
import { Tag, Card, Select, Alert } from 'ant-design-vue';
import { reactive, unref, onDeactivated, onMounted, ref, watch, Ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import {columns1,searchFormSchema} from "./ApiMonitor.data";
import {TableData} from "./ApiMonitorData";
import { columns1, searchFormSchema } from './ApiMonitor.data';
import { TableData } from './ApiMonitorData';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
const { createMessage } = useMessage();
defineProps({
loading: {
......@@ -75,21 +78,21 @@
title: '执行中请求',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
pageNu: '1',
pageSize: '10',
pages: '1',
total: TableData.length,
code:'',
message:'',
code: '',
message: '',
data: [],
};
return { ...response,data: TableData };
return { ...response, data: TableData };
},
columns:columns1,
pagination:true,
columns: columns1,
pagination: true,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
showIndexColumn: false,
bordered: true,
scroll: { y: 500 },
actionColumn: {
......@@ -99,23 +102,20 @@
},
});
function deleteButton(){
createMessage.success('删除成功!')
function deleteButton() {
createMessage.success('删除成功!');
}
</script>
<style lang="less" scoped>
.card{
::v-deep(.ant-card-body){
width: 100%;
display: flex;
.card {
::v-deep(.ant-card-body) {
width: 100%;
display: flex;
}
}
}
.center{
width: 100%;
background-color: white;
}
.center {
width: 100%;
background-color: white;
}
</style>
src/views/dataSharingAndExchange/ApiMonitor/RightContent3.vue
View file @ 7a1778e6
......@@ -39,7 +39,7 @@ function getEchartsData1() {
},
legend: {
orient: 'vertical', // 垂直方向
right: '2%', // 图例放置在右侧
left: '70%', // 图例放置在右侧
top: 'center', // 图例垂直居中
itemWidth: 15, // 图例标记宽度
itemHeight: 15, // 图例标记高度
......
src/views/dataSharingAndExchange/ApiMonitor/RightContent4.vue
View file @ 7a1778e6
......@@ -39,7 +39,7 @@ function getEchartsData1() {
},
legend: {
orient: 'vertical', // 垂直方向
right: '2%', // 图例放置在右侧
left: '70%', // 图例放置在右侧
top: 'center', // 图例垂直居中
itemWidth: 15, // 图例标记宽度
itemHeight: 15, // 图例标记高度
......
src/views/dataSharingAndExchange/ApiMonitor/index.vue
View file @ 7a1778e6
......@@ -13,15 +13,15 @@
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive,unref,onDeactivated,onMounted,ref } from 'vue';
import { reactive, unref, onDeactivated, onMounted, ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import ApiMonitorTree from './ApiMonitorTree.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import { useGo } from '@/hooks/web/usePage';
import { useRoute,onBeforeRouteLeave } from 'vue-router';
import {forEach} from "lodash-es";
import { useRoute, onBeforeRouteLeave } from 'vue-router';
import { forEach } from 'lodash-es';
import RightContent1 from './RightContent1.vue';
import RightContent3 from './RightContent3.vue';
import RightContent2 from './RightContent2.vue';
......@@ -29,16 +29,11 @@
import RightContent5 from './RightContent5.vue';
import RightContent6 from './RightContent6.vue';
import RightContent7 from './RightContent7.vue';
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const route = useRoute();
const go = useGo();
onMounted(() => {
});
onMounted(() => {});
</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