Skip to content

B
bigDataSystem
Commit 64e1c085 authored by 冷玲鹏's avatar 冷玲鹏
Browse files
Options

api上线管理——新建血缘对象

parent a50f2ba4
Hide whitespace changes
Inline Side-by-side
Showing with 338 additions and 75 deletions
src/router/routes/index.ts
View file @ 64e1c085
......@@ -769,6 +769,17 @@ export const serviceDevelopmentRoute: AppRouteRecordRaw = {
icon: '',
},
},
//服务管理-api上线管理
{
path: 'serviceManage/onlineManage/handleConsanguinity',
name: 'handleConsanguinity',
component: () => import('@/views/dataService/serviceManage/onlineManage/handleConsanguinity.vue'),
meta: {
title: '血缘详情',
icon: '',
},
},
],
};
......
src/views/dataService/serviceManage/onlineManage/handleConsanguinity.vue 0 → 100644
View file @ 64e1c085
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<!-- <template #headerContent>
<div>
<div><Icon icon="ant-design:hdd-outlined" :size="30" :color="'#1091FE'" /></div>
<div>
<div >{{ formParams.fieldName }}</div>
<div >{{ formParams.path }}</div>
</div>
</div>
</template>-->
<div style="display: flex">
<div>
<div style="display:flex;">
<Icon icon="ant-design:down-outlined" :size="16" style="margin: 15px 0 0 16px "/>
<p class="table-title" style="font-size: 15px; margin: 15px 0 0 0;font-weight: 550">
血缘对象</p>
</div>
<BasicTable class="w-1/5" @register="registerTable" :searchInfo="searchInfo">
<template #member="{ text, record }">
<Icon icon="ant-design:insert-row-above-outlined" :size="16" style="color:#5A70FB;"/>
<a style="color: black">{{ text }}</a>
</template>
</BasicTable>
</div>
<div>
</div>
</div>
</PageWrapper>
</template>
<script setup>
/**血缘关系页面*/
import {PageWrapper} from '@/components/Page';
import {useTable} from '@/components/Table';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import {modelData} from './mock';
import {modelColumns, modelFormSchema} from './onlineManage.data';
import Icon from "@/components/Icon/Icon.vue";
import {onMounted, reactive, ref} from "vue";
import { router } from '@/router';
/*import {tableList1} from "@/views/dataService/serviceManage/onlineManage/mock.ts";
const title = ref();
const formParams = reactive({ fieldName: '', path: '' });*/
const [registerTable, {
reload,
updateTableDataRecord,
getSearchInfo,
getForm,
getRowSelection
},] = useTable({
title: '',
// 定高
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: modelData.length,
code: '',
message: '',
data: modelData,
};
return {...response};
},
rowKey: 'businessId',
// 列
columns: modelColumns,
showIndexColumn: false,
striped: false,
// 搜索
formConfig: {
labelWidth: 120,
schemas: modelFormSchema,
autoSubmitOnEnter: true,
showActionButtonGroup: false,
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
});
/*onMounted(() => {
const data = tableList1.filter((item) => item.businessId === route.query.id);
// formParams.value = data[0];
Object.assign(formParams, data[0]); // 使用 Object.assign 赋值
resetFields();
})*/
</script>
src/views/dataService/serviceManage/onlineManage/index.vue
View file @ 64e1c085
......@@ -2,32 +2,51 @@
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<BasicTable @register="registerTable" :rowSelection="rowSelection">
<template #toolbar>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDeleteIds">创建商城API</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDeleteIds">下载API Doc</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary" @click="handleDeleteIds">删除</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">创建商城API
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">下载API Doc
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">删除
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '血缘',
icon:'ant-design:deployment-unit-outlined',
/*label: '血缘',*/
onClick: handleConsanguinity.bind(null, record),
// 如果 flag 的值为某个特定值才显示按钮
visible: record.flag === '开发中'
},
{
icon:'ant-design:fund-projection-screen-outlined',
/*label: '详情',*/
onClick: handleOffline.bind(null, record),
},
{
label: '上线',
{
icon:'ant-design:upload-outlined',
/*label: '上线',*/
onClick: handleOnline.bind(null, record),
},
{
label: '下线',
{
icon:'ant-design:cloud-download-outlined',
/*label: '下线',*/
onClick: handleOffline.bind(null, record),
},
{
// icon: 'ant-design:delete-outlined',
icon:'ant-design:setting-outlined',
/*label: '设置',*/
onClick: handleOffline.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
color: 'error',
label: '删除',
/*label: '删除',*/
popConfirm: {
title: '是否确认删除',
placement: 'left',
......@@ -38,25 +57,53 @@
/>
</template>
</template>
<template #flag="{ text }">
<span v-if="text === '开发中'">
<Icon icon="ant-design:robot-filled" :size="15" style="color:#48A8F4;" />
开发中
</span>
<span v-else-if="text === '未上线'">
<Icon icon="ant-design:close-circle-filled" :size="15" style="color:#D56767;" />
未上线
</span>
<span v-else-if="text === '已上线'">
<Icon icon="ant-design:check-circle-filled" :size="15" style="color:#40C295;" />
已上线
</span>
<span v-else>
<Icon icon="ant-design:android-filled" :size="15" style="color:#F0A732;" />
未知
</span>
</template>
<template #name="{ text, record }">
<a @click="seeApi(record)"> {{ text }}</a>
</template>
</BasicTable>
<sensitiveTypeModal @register="registerModal" @success="handleSuccess" />
<sensitiveTypeModal @register="registerModal" @success="handleSuccess"/>
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, onMounted,ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { columns, searchFormSchema } from './onlineManage.data';
import {reactive, onMounted, ref} from 'vue';
import {BasicTable, useTable, TableAction} from '@/components/Table';
import {PageWrapper} from '@/components/Page';
import {useMessage} from '@/hooks/web/useMessage';
import {columns, searchFormSchema} from './onlineManage.data';
import {tableList} from "./mock";
import { useRoute, onBeforeRouteLeave } from 'vue-router';
import { router } from '@/router';
import {useRoute, onBeforeRouteLeave} from 'vue-router';
import {router} from '@/router';
import Icon from "@/components/Icon/Icon.vue";
defineOptions({ name: 'safetyLevelManage' });
const { createMessage,createConfirm } = useMessage();
defineOptions({name: 'safetyLevelManage'});
const {createMessage, createConfirm} = useMessage();
const route = useRoute();
const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm,getRowSelection }] = useTable({
const [registerTable, {
reload,
updateTableDataRecord,
getSearchInfo,
getForm,
getRowSelection
}] = useTable({
title: 'API上线管理列表',
api: async (params) => {
const response = {
......@@ -64,12 +111,12 @@ const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm,ge
pageSize: "10",
pages: "1",
total: tableList.length,
code:'',
message:'',
code: '',
message: '',
data: tableList,
};
return { ...response};
return {...response};
},
rowKey: 'businessId',
rowSelection: true,
......@@ -87,45 +134,85 @@ const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm,ge
return info;
},
actionColumn: {
width: 120,
width: 250,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗？',
onOk() {
createMessage.success('批量删除成功!');
/**查看API*/
function seeApi(record) {
const mode = record.mode
if (mode === '向导模式') {
router.push({
path: '/dataService/serviceManage/guideModeApi',
query: {}
})
}
if (mode === 'SQL模式') {
router.push({
path: '/dataService/serviceManage/sqlModeApi',
query: {}
})
}
if (mode === '托管模式') {
router.push({
path: '/dataService/serviceManage/trusteeshipModeApi',
query: {}
})
}
}
/**查看详情*/
function detailButton(record) {
router.push({
path: '/dataStandards/publicCode/detailPublicCode',
query: {
businessId: record.businessId,
},
});
}
function handleOffline() {
/**血缘按钮跳转路由*/
function handleConsanguinity() {
router.push({
path: '/dataService/serviceManage/onlineManage/handleConsanguinity',
});
}
function handleOnline() {
}
function handleConsanguinity() {
/**下线按钮*/
function handleOffline() {
}
/**上线按钮*/
function handleOnline() {
}
/** 删除按钮*/
function handleDelete(record: Recordable) {
const rowSelection = getRowSelection().selectedRowKeys;
console.log('11111111111',rowSelection);
console.log('11111111111', rowSelection);
createMessage.success('删除成功!');
reload();
}
/**批量删除*/
function handleDeleteIds() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗？',
onOk() {
createMessage.success('批量删除成功!');
},
});
}
/** 新增/编辑成功*/
function handleSuccess({ isUpdate, values }) {
function handleSuccess({isUpdate, values}) {
if (isUpdate) {
// 演示不刷新表格直接更新内部数据。
// 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
......
src/views/dataService/serviceManage/onlineManage/mock.ts
View file @ 64e1c085
export const tableList: any[] = [
{
businessId: 1,
name:'tuo_api',
flag:'开发中',
mode:'托管模式',
timeout:'5秒',
versionNum:'-',
createDate:'2023/12/05 14:38:37',
updateDate:'2023/12/05 14:38:37',
owner:'admin',
name: 'tuo_api',
flag: '开发中',
mode: '托管模式',
timeout: '5秒',
versionNum: '-',
createDate: '2023/12/05 14:38:37',
updateDate: '2023/12/05 14:38:37',
owner: 'admin',
},
{
businessId: 2,
name:'sql_api',
flag:'未上线',
mode:'SQL模式',
timeout:'5秒',
versionNum:'-',
createDate:'2023/12/05 14:38:37',
updateDate:'2023/12/05 14:38:37',
owner:'admin',
name: 'sql_api',
flag: '未上线',
mode: 'SQL模式',
timeout: '5秒',
versionNum: '-',
createDate: '2023/12/05 14:38:37',
updateDate: '2023/12/05 14:38:37',
owner: 'admin',
},
{
businessId: 3,
name:'test1',
flag:'已上线',
mode:'向导模式',
timeout:'5秒',
versionNum:'-',
createDate:'2023/12/05 14:38:37',
updateDate:'2023/12/05 14:38:37',
owner:'admin',
name: 'test1',
flag: '已上线',
mode: '向导模式',
timeout: '5秒',
versionNum: '-',
createDate: '2023/12/05 14:38:37',
updateDate: '2023/12/05 14:38:37',
owner: 'admin',
},
{
businessId: 4,
name: 'tuo_api',
flag: '开发中',
mode: '托管模式',
timeout: '5秒',
versionNum: '-',
createDate: '2023/12/05 14:38:37',
updateDate: '2023/12/05 14:38:37',
owner: 'admin',
},
{
businessId: 5,
name: 'test',
flag: '',
mode: '',
timeout: '',
versionNum: '',
createDate: '',
updateDate: '',
owner: '',
},
];
export const uploadData = {
title: '发布',
result: '',
person: 'admin',
dept: '数据平台治理部',
time: '2023/06/15 15:24:59',
version: '大版本号自增',
};
export const modelData = [
{
member: 'employee',
},
{
member: 'employee1',
},
{
member: 'employee2',
},
{
member: 'employee3',
},
{
member: 'employee4',
},
];
export const modelInfoData = {
name: 'employee',
path: 'admin-个人工作区/SDM数仓逻辑模型/SDM_DW数仓模型',
};
export const tableList1: any[] = [
{
businessId: '301',
fieldName: '.data.idCard',
name: '.data.idCard',
}
]
src/views/dataService/serviceManage/onlineManage/onlineManage.data.ts
View file @ 64e1c085
import { getAllRoleList } from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
import { h } from 'vue';
import { Switch } from 'ant-design-vue';
import { useMessage } from '@/hooks/web/useMessage';
import { changeFlagApi } from '@/api/system/user/user';
// 引入开关组件
type CheckedType = boolean | string | number;
......@@ -26,11 +22,13 @@ export const columns: BasicColumn[] = [
title: '名称',
dataIndex: 'name',
width: 120,
slots: { customRender: 'name' },
},
{
title: '状态',
dataIndex: 'flag',
width: 120,
slots: { customRender: 'flag' }, // 使用自定义插槽
},
{
title: '模式',
......@@ -40,12 +38,12 @@ export const columns: BasicColumn[] = [
{
title: '超时时间',
dataIndex: 'timeout',
width: 140,
width: 120,
},
{
title: '上线版本号',
dataIndex: 'versionNum',
width: 140,
width: 120,
},
{
title: '创建时间',
......@@ -60,9 +58,10 @@ export const columns: BasicColumn[] = [
{
title: '拥有者',
dataIndex: 'owner',
width: 180,
width: 120,
},
];
/** 筛选展示字段*/
/** 新增编辑表单字段*/
export const formSchema: any[] = [
......@@ -129,6 +128,21 @@ export const formSchema: any[] = [
component: 'Input',
},
]
export const modelFormSchema: FormSchema[] = [
{
field: 'member',
component: 'InputSearch',
componentProps: {
placeholder: '输入关键字搜索',
},
colProps: { lg: 24, md: 24 },
},
];
export const modelColumns: BasicColumn[] = [
{
dataIndex: 'member',
slots: { customRender: 'member' },
},
];
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