Skip to content

B
bigDataSystem
Commit 6192b6c0 authored by liwei's avatar liwei
Browse files
Options

新增了服务开发页面

parent 21272514
Hide whitespace changes
Inline Side-by-side
Showing with 243 additions and 37 deletions
src/views/dataService/serviceDevelopment/DataPreviewDrawer.vue
View file @ 6192b6c0
......@@ -170,7 +170,6 @@
createMessage.success('测试成功');
test.value = 'success'
executionList1.value = cardList2
console.log(executionList1.value)
}
/**点击事件*/
......
src/views/dataService/serviceDevelopment/MetadataPreviewDrawer.vue
View file @ 6192b6c0
......@@ -4,56 +4,69 @@
@register="registerDrawer"
showFooter
:title="getTitle"
width="50%"
width="40%"
@ok="handleSubmit"
>
<BasicTree
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="false"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'apiName' }"
@select="handleSelect"
:beforeRightClick="getRightMenuList"
:actionList="actionList"
/>
<List :pagination="pagination">
<template v-for="item in executionList" :key="item.id">
<List.Item class="list">
<List.Item.Meta style="display: flex !important; align-items: center !important">
<template #avatar>
<Icon class="icon" v-if="item.icon" :icon="item.icon" :color="item.color" />
</template>
<template #title>
<span>{{ item.executionDate }}</span>
</template>
<template #description>
<div class="info">
<div>{{ item.sensitiveState }}</div>
</div>
<div style="display: flex;width: 100%;height: 750px">
<div style="width: 50%;height: 750px;border: 1px solid #ccc;">
<BasicTree
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="false"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'apiName' }"
@select="handleSelect"
:beforeRightClick="getRightMenuList"
:actionList="actionList"
/>
</div>
<div style="width: 50%;height:750px;border: 1px solid #ccc;">
<div style="padding: 10px 10px 10px 10px;width: 100%;background-color: rgb(232, 236, 247)">
<a-input-search/>
</div>
<div>
<List :pagination="pagination">
<template v-for="item in executionList" :key="item.id">
<List.Item @click="clickButton(item)" :class="{ 'listItemClass': selectedItem === item }">
<List.Item.Meta style="display: flex !important; align-items: center !important">
<template #avatar>
<Icon class="icon" v-if="item.icon" :icon="item.icon" :color="item.color" />
</template>
<template #title>
<span v-if="item.title.includes('执行')" style="font-weight: bold;height: 20px">{{ item.title }}</span>
<span v-else>{{ item.title }}</span>
</template>
<template #description>
<div class="info">
<div v-if="item.desc">{{ item.desc }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
{{ item.type }}</div>
</div>
</template>
</List.Item.Meta>
</List.Item>
</template>
</List.Item.Meta>
</List.Item>
</template>
</List>
</List>
</div>
</div>
</div>
</BasicDrawer>
</template>
<script lang="ts" setup>
import {h, nextTick, onMounted, ref, unref} from 'vue';
import { BasicForm, useForm } from '@/components/Form';
import { } from './api.data';
import { metadataTreeData } from './apiData'
import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
import {BasicTree, ContextMenuItem, TreeActionType, TreeItem} from '@/components/Tree';
import {useMessage} from "@/hooks/web/useMessage";
import { List } from 'ant-design-vue';
import { cardList1 } from './apiData';
import { cardList3,cardList4,cardList2,cardList5, metadataTreeData } from './apiData';
import Icon from '@/components/Icon/Icon.vue';
const executionList = ref(cardList1);
const executionList = ref(cardList3);
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const treeRef = ref<Nullable<TreeActionType>>(null);
......@@ -63,7 +76,7 @@
const treeData = ref<TreeItem[]>([]);
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
setDrawerProps({ confirmLoading: false });
setDrawerProps({ confirmLoading: false,showOkBtn: false,showCancelBtn: false });
treeData.value = handleTree(metadataTreeData, 'businessId',undefined,undefined,undefined)
await nextTick(() => {
getTree().expandAll(true)
......@@ -82,6 +95,17 @@
}
function handleSelect(keys) {
console.log(keys[0])
if (keys[0] === 201 || keys[0] === 202){
executionList.value = cardList3
}else if (keys[0] === 203 || keys[0] === 204){
executionList.value = cardList4
} else {
executionList.value = cardList5
}
}
/** 转成树 */
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id'
......@@ -103,3 +127,17 @@
return treeData !== '' ? treeData : data
}
</script>
<style lang="scss" scoped>
.icon {
font-size: 30px !important;
}
.tableClass{
::v-deep(.ant-table){
height: 300px;
}
}
.listItemClass{
background-color: #badeee;
height: 30px;
}
</style>
src/views/dataService/serviceDevelopment/apiData.ts
View file @ 6192b6c0
......@@ -430,6 +430,7 @@ export const metadataTreeData: any[] = [
"anotherName": "@!&test@&",
"parentId": 0,
icon: "material-symbols:database-outline",
},
{
"businessId": 102,
......@@ -995,6 +996,172 @@ export const cardList2:any[] = [
color: '#2f9d59',
},
]
export const cardList3:any[] = [
{
id: 2,
desc: '_',
type:'int(11)',
title: 'id',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 3,
desc: '_',
type:'varchar(10)',
title: 'name',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 4,
desc: '_',
title: 'height',
type:'float',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'decimal(10,2)',
title: 'weight',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'text',
title: 'family',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'bigint(20)',
title: 'phone_number',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'char(20)',
title: 'city',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'tinyint(1)',
title: 'sex',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'date',
title: 'birthday',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
]
export const cardList4:any[] = [
{
id: 2,
desc: '_',
type:'int(11)',
title: 'id',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 3,
desc: '_',
type:'varchar(10)',
title: 'name',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 4,
desc: '_',
title: 'height',
type:'float',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'decimal(10,2)',
title: 'weight',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
]
export const cardList5:any[] = [
{
id: 2,
desc: '_',
type:'int(11)',
title: 'id',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 3,
desc: '_',
type:'varchar(10)',
title: 'name',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 4,
desc: '_',
title: 'height',
type:'float',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'decimal(10,2)',
title: 'weight',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'text',
title: 'family',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'tinyint(1)',
title: 'sex',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
{
id: 5,
desc: '_',
type:'date',
title: 'birthday',
icon: 'material-symbols:table-rows-outline',
color: 'rgb(3, 140, 255)',
},
]
/**对比左侧列表 数据1*/
......
src/views/dataService/serviceDevelopment/trusteeshipModeApi.vue
View file @ 6192b6c0
......@@ -495,6 +495,8 @@
/**初始化*/
onMounted(() => {
show.value = '5'
show1.value = '5'
optionValue.value = '自动解析'
optionValue1.value = '自动解析'
});
......
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