Commit 5ed95561 authored by 罗林杰's avatar 罗林杰

Merge remote-tracking branch 'origin/master'

parents 356b1687 717b7bbb
......@@ -947,7 +947,7 @@ export const ResourceRoute: AppRouteRecordRaw = {
name: 'dataSharingAndExchange',
component: LAYOUT,
meta: {
title: '资源管理',
title: '详情页',
icon: '',
hidden: true,
currentActiveMenu: '/dataSharingAndExchange',
......
<template>
<Card :loading="loading">
<div class="centent1">
我的流程
</div>
<div class="centent2">
<template v-for="(item, index) in CardList2" :key="item.title">
<Card
size="small"
:loading="loading"
hoverable="true"
class="md:w-25 w-full !md:mt-0 h-25 md:h-25"
:class="[{ 'md:mr-4': index + 1 < 4, 'mt-4': index > 0,'bg-color':(index % 4) + 1 },`bg-color-${(index % 4) + 1}`]"
>
<div :class="`centent2-1`" class="md:h-20">
<div>
<span class="centent2-1-1">{{item.total}}</span>
<span>{{item.title}}</span>
</div>
</div>
</Card>
<Divider v-if="index === 2" :class="`centent2-2`" type="vertical" class="md:h-25" />
</template>
</div>
<List :pagination="pagination">
<template v-for="item in dataList" :key="item.id">
<List.Item class="centent3" @click="">
<List.Item.Meta class="centent3-1">
<template #avatar>
<Icon style="font-size: 20px" v-if="item.icon" :icon="item.icon" :color="item.color" />
</template>
<template #title>
<div class="centent3-1-1">
<span>{{ item.title }}</span>
<span style="color:rgb(161, 161, 161);">当前审批人: {{item.approver}}</span>
</div>
</template>
<template #description>
<div class="centent3-1-2">
<div>{{ item.desc }}</div>
<div>审批时间: {{ item.time }}</div>
</div>
</template>
</List.Item.Meta>
</List.Item>
</template>
</List>
</Card>
</template>
<script lang="ts" setup>
import { Tag, Card,Select,List,Divider } from 'ant-design-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import {ListData, TableData2,CardList2} from "./overviewMallResourceData";
import {columns2} from "./overviewMallResource.data";
import { ref } from 'vue';
import Icon from '@/components/Icon/Icon.vue';
const dataList = ref(ListData)
</script>
<style lang="less" scoped>
.centent2{
display: flex;
justify-content: center;
.centent2-1{
display: flex;
align-items: center;
justify-content: center;
.centent2-1-1{
display:flex;
justify-content: center;
align-items: center
}
}
.centent2-2{
margin-right: 20px;
border:1px solid rgb(240, 242, 243);
}
}
.centent1{
display: flex;
margin-bottom: 10px;
font-weight: bold;
}
.centent3{
background-color: rgb(250, 251, 252);
margin-top: 10px;
.centent3-1{
display: flex !important;
align-items: center !important;
.centent3-1-1{
display: flex;
justify-content: space-between;
}
.centent3-1-2{
display: flex;
justify-content: space-between;
}
}
}
</style>
<template>
<Card :loading="loading">
<div class="centent1">
<div style="font-weight: bold">
热门资源Top10
</div>
<div>
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
<span style="margin-right: 10px">今日</span>
<span style="margin-right: 10px">最近7天</span>
<span style="margin-right: 10px">最近30天</span>
</div>
</div>
<BasicTable @register="registerTable">
<template #sort="{ text, record }">
<a @click="showDetails(record)" v-if="record.sort === 1 || record.sort === 2 || record.sort === 3" style="font-weight: bold">
{{ text }}
</a>
<span v-else>{{text}}</span>
</template>
<template #sourceName="{ text, record }">
<Icon :icon="record.icon" style="margin-right: 10px;color: rgb(44, 157, 243)"/>
<a @click="showDetails(record)" v-if="record.sort === 1 || record.sort === 2 || record.sort === 3" style="font-weight: bold"> {{ text }}</a>
<a @click="showDetails(record)" v-else> {{ text }}</a>
</template>
</BasicTable>
</Card>
</template>
<script lang="ts" setup>
import { Tag, Card,Select } from 'ant-design-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import {tableData} from "@/views/realTimeSync/eventCenter/eventCenterData";
import {columns} from "@/views/realTimeSync/eventCenter/eventCenter.data";
import {TableData1} from "./overviewMallResourceData";
import {columns1} from "./overviewMallResource.data";
import Icon from '@/components/Icon/Icon.vue';
const [registerTable] = useTable({
title: '',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: TableData1.length,
code:'',
message:'',
data: [],
};
return { ...response,data: TableData1 };
},
columns:columns1,
pagination:false,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
scroll: { y: 500 },
});
</script>
<style lang="less" scoped>
.centent1{
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}
</style>
<template>
<div class="center">
<div class="center1">
<div class="center1-1">
资源统计
</div>
<div class="center1-2">
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
<span style="margin-right: 10px">今日</span>
<span style="margin-right: 10px">最近7天</span>
<span style="margin-right: 10px">最近30天</span>
</div>
</div>
<div class="center2">
<template v-for="(item, index) in CardList" :key="item.title">
<Card
size="small"
:loading="loading"
hoverable="true"
class="md:w-90 w-full !md:mt-0"
:class="[{ 'md:mr-4': index + 1 < 4, 'mt-4': index > 0,'bg-color':(index % 4) + 1 },`bg-color-${(index % 4) + 1}`]"
>
<div class="center2-1" >{{item.title}}</div>
<div class="center2-2">
<CountTo :startVal="1" :endVal="item.total" class="text-2xl" />
<span>{{item.unit}}</span>
</div>
<div>
<span></span>
<span></span>
</div>
</Card>
</template>
</div>
</div>
</template>
<script lang="ts" setup>
import { CountTo } from '@/components/CountTo';
import Icon from '@/components/Icon/Icon.vue';
import { Tag, Card,Select } from 'ant-design-vue';
import { CardList } from './overviewMallResourceData';
import { reactive,unref,onDeactivated,onMounted,ref,watch,Ref } from 'vue';
const optionValue = ref('全部类型')
const options = ref([
{
label:'全部类型',
value:'全部类型'
},
])
defineProps({
loading: {
type: Boolean,
},
});
</script>
<style lang="less" scoped>
.card{
::v-deep(.ant-card-body){
width: 100%;
display: flex;
}
}
/* 在您的CSS文件中 */
.bg-color-1 { background-color: rgb(42, 207, 226); }
.bg-color-2 { background-color: rgb(50, 183, 117); }
.bg-color-3 { background-color: rgb(237, 185, 18); }
.bg-color-4 { background-color: rgb(248, 161, 59); }
.center{
width: 100%;
height:220px;
background-color: white;
.center1{
display: flex;justify-content: space-between;
.center1-1{
font-weight: bold;margin-bottom: 10px;margin-top: 10px;margin-left: 10px;
}
.center1-2{
margin-bottom: 10px;margin-top: 10px;
}
}
.center2{
display: flex;height: 150px;justify-content: center;margin-left: 10px;margin-right: 10px;
.center2-1{
color:white;
}
.center2-2{
color:white;font-weight: bold;margin-top: 20px;margin-bottom: 20px
}
}
}
</style>
<template>
<Card :loading="loading">
<div style="display: flex;justify-content: space-between;margin-bottom: 10px">
<div style="font-weight: bold">
趋势统计图
</div>
<div>
<Select
v-model:value="optionValue"
show-search
placeholder="请选择类型"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
<span style="margin-right: 10px">最近7天</span>
<span style="margin-right: 10px">最近30天</span>
</div>
</div>
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts" setup>
import {onMounted, Ref, ref, watch} from 'vue';
import { useECharts } from '@/hooks/web/useECharts';
import { Tag, Card,Select } from 'ant-design-vue';
const props = defineProps({
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '400px',
},
});
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
const optionValue = ref('全部类型')
const options = ref([
{
label:'全部类型',
value:'全部类型'
},
])
onMounted(() => {
setOptions({
tooltip: {
trigger: 'axis',
axisPointer: {
lineStyle: {
width: 1,
color: '#019680',
},
},
},
legend: {
data: ['我发布的', '总发布量', '总共享量', '总访问量'],
left: 'left', // 将图例放在左侧
},
xAxis: {
type: 'category',
boundaryGap: false,
data: [...new Array(8)].map((_item, index) => `10/0${index + 1}`),
splitLine: {
show: true,
lineStyle: {
width: 1,
type: 'solid',
color: 'rgba(226,226,226,0.5)',
},
},
axisTick: {
show: false,
},
},
yAxis: [
{
type: 'value',
max: 100,
splitNumber: 6,
axisTick: {
show: false,
},
splitArea: {
show: true,
areaStyle: {
color: ['rgba(255,255,255,0.2)', 'rgba(226,226,226,0.2)'],
},
},
},
],
grid: {
left: '1%',
right: '1%',
top: '50px',
bottom: 0,
containLabel: true,
},
series: [
{
name: '我发布的',
smooth: false,
data: [0, 20, 50, 40, 50, 60, 70, 80, 90, 50, 90, 30, 70, 60, 50, 90, 30, 20],
type: 'line',
areaStyle: {},
itemStyle: {
color: 'rgb(238, 173, 173,0.5)',
},
},
{
name: '总发布量',
smooth: false,
data: [20, 30, 40, 50, 60, 70, 80, 30, 100, 20, 80, 70, 80, 70, 40, 30, 20, 10],
type: 'line',
areaStyle: {},
itemStyle: {
color: 'rgb(244, 189, 139,0.5)',
},
},
{
name: '总共享量',
smooth: false,
data: [20, 25, 35, 40, 30, 35, 40, 50, 50, 55, 70, 70, 75, 60, 55, 40, 45, 20],
type: 'line',
areaStyle: {},
itemStyle: {
color: 'rgb(143, 191, 155,0.5)',
},
},
{
name: '总访问量',
smooth: false,
data: [0, 5, 10, 15, 20, 18, 17, 16, 15, 16, 15, 15, 14, 13, 12, 10, 8, 5],
type: 'line',
areaStyle: {},
itemStyle: {
color: 'rgb(178, 163, 219,0.5)',
},
},
],
});
});
</script>
<template>
<Card :loading="loading">
<div style="display: flex;justify-content: space-between;margin-bottom: 10px">
<div style="font-weight: bold">
我的最近访问
</div>
<div>
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
<Select
v-model:value="optionValue"
show-search
placeholder="请选择版本"
style="width: 100px;margin-right: 10px"
:options="options"
@change="handleChange"
></Select>
</div>
</div>
<BasicTable @register="registerTable">
<template #sourceName="{ text, record }">
<Icon :icon="record.icon" style="margin-right: 10px;color: rgb(44, 157, 243)"/>
<a @click="showDetails(record)"> {{ text }}</a>
</template>
</BasicTable>
</Card>
</template>
<script lang="ts" setup>
import { Tag, Card,Select } from 'ant-design-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import {tableData} from "@/views/realTimeSync/eventCenter/eventCenterData";
import {columns} from "@/views/realTimeSync/eventCenter/eventCenter.data";
import {TableData2} from "./overviewMallResourceData";
import {columns2} from "./overviewMallResource.data";
import Icon from '@/components/Icon/Icon.vue';
const [registerTable] = useTable({
title: '',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: TableData2.length,
code:'',
message:'',
data: [],
};
return { ...response,data: TableData2 };
},
columns:columns2,
pagination:false,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
scroll: { y: 500 },
});
</script>
<template>
<div class="p-4">
<ResourceStatistics :loading="loading" class="enter-y" />
<div class="!my-4 md:flex enter-y">
<PopularResources class="md:w-1/2 w-full" :loading="loading" />
<VisitSource class="md:w-1/2 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" />
</div>
<div class="!my-4 md:flex enter-y">
<MyProcess class="md:w-1/2 w-full" :loading="loading" />
<StatisticalChart class="md:w-1/2 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" />
</div>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import ResourceStatistics from './ResourceStatistics.vue';
import VisitSource from './VisitSource.vue';
import PopularResources from './PopularResources.vue';
import MyProcess from './MyProcess.vue';
import { Tag, Card } from 'ant-design-vue';
import StatisticalChart from './StatisticalChart.vue'
const loading = ref(false);
setTimeout(() => {
loading.value = false;
}, 1500);
</script>
import {getAllRoleList} from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
import {h} from "vue";
import {Input, Select, Tag} from "ant-design-vue";
import { Switch } from 'ant-design-vue';
import {useMessage} from "@/hooks/web/useMessage";
import {changeFlagApi} from "@/api/system/user/user";
import {DescItem} from "@/components/Description";
import {uploadApi} from "@/api/sys/upload"; // 引入开关组件
type CheckedType = boolean | string | number;
/**主页面列表 表头*/
export const columns1: BasicColumn[] = [
{
title: '排名',
dataIndex: 'sort',
width: 150,
slots: { customRender: 'sort' },
},
{
title: '资源名称',
dataIndex: 'sourceName',
width: 150,
slots: { customRender: 'sourceName' },
},
{
title: '权属机构',
dataIndex: 'mechanism',
width: 150,
},
{
title: '访问量',
dataIndex: 'trafficVolume',
width: 150,
},
];
/**主页面列表 表头*/
export const columns2: BasicColumn[] = [
{
title: '访问时间',
dataIndex: 'viewTime',
width: 150,
},
{
title: '资源名称',
dataIndex: 'sourceName',
width: 150,
slots: { customRender: 'sourceName' },
},
{
title: '权属机构',
dataIndex: 'institution',
width: 150,
},
];
export const CardList: any[] = [
{
title: '公共资源',
icon: 'visit-count|svg',
value: 2000,
total: 24567,
color:'rgb(42, 207, 226)',
unit:'个',
action: '月',
},
{
title: '发布量',
icon: 'total-sales|svg',
value: 20000,
total: 24567,
unit:'个',
color:'rgb(50, 183, 117)',
action: '月',
},
{
title: '访问量',
icon: 'download-count|svg',
value: 8000,
total: 234567,
unit:'次',
color:'rgb(237, 185, 18)',
action: '周',
},
{
title: '共享量',
icon: 'transaction|svg',
value: 5000,
total: 8326,
unit:'个',
color:'rgb(248, 161, 59)',
action: '年',
},
];
export const CardList2: any[] = [
{
title: '审核中',
total: 4,
},
{
title: '已通过',
total: 1,
},
{
title: '已驳回',
total: 1,
},
{
title: '审核中',
total: 1,
},
];
export const TableData1:any[] = [
{ sort: 1, sourceName: '资源A', mechanism: '机构甲', trafficVolume: 12345,icon:'pajamas:label' },
{ sort: 2, sourceName: '资源B', mechanism: '机构乙', trafficVolume: 23456,icon:'bx:file' },
{ sort: 3, sourceName: '资源C', mechanism: '机构丙', trafficVolume: 34567,icon:'bx:file'},
{ sort: 4, sourceName: '资源D', mechanism: '机构丁', trafficVolume: 45678,icon:'majesticons:table'},
{ sort: 5, sourceName: '资源E', mechanism: '机构戊', trafficVolume: 56789,icon:'pajamas:label' },
{ sort: 6, sourceName: '资源F', mechanism: '机构己', trafficVolume: 67890,icon:'majesticons:table' },
{ sort: 7, sourceName: '资源G', mechanism: '机构庚', trafficVolume: 78901,icon:'pajamas:label' },
{ sort: 8, sourceName: '资源H', mechanism: '机构辛', trafficVolume: 89012,icon:'majesticons:table'},
{ sort: 9, sourceName: '资源I', mechanism: '机构壬', trafficVolume: 90123,icon:'pajamas:label'},
{ sort: 10, sourceName: '资源J', mechanism: '机构癸', trafficVolume: 101234,icon:'majesticons:table'}
]
export const TableData2:any[] = [
{ viewTime: '2024-11-29 15:30:00', sourceName: '资源A', institution: '教育研究院',icon:'pajamas:label' },
{ viewTime: '2024-11-29 16:45:00', sourceName: '资源B', institution: '科学研究所',icon:'bx:file' },
{ viewTime: '2024-11-29 17:12:00', sourceName: '资源C', institution: '文化发展中心',icon:'bx:file' },
{ viewTime: '2024-11-29 18:23:00', sourceName: '资源D', institution: '技术开发公司',icon:'pajamas:label' },
{ viewTime: '2024-11-29 19:34:00', sourceName: '资源E', institution: '环境保护局',icon:'majesticons:table' },
{ viewTime: '2024-11-29 20:00:00', sourceName: '资源F', institution: '卫生健康委员会',icon:'majesticons:table' },
{ viewTime: '2024-11-29 21:15:00', sourceName: '资源G', institution: '经济研究会',icon:'pajamas:label' },
{ viewTime: '2024-11-29 22:30:00', sourceName: '资源H', institution: '艺术学院',icon:'bx:file' },
{ viewTime: '2024-11-29 23:45:00', sourceName: '资源I', institution: '法律咨询中心',icon:'pajamas:label' },
{ viewTime: '2024-11-30 00:10:00', sourceName: '资源J', institution: '农业科学院',icon:'majesticons:table' }
]
export const ListData:any[] = [
{
id: 2,
title: '申请共享:华夏上证50ETF价值分析',
desc:'申请访问:常规申请',
time:'2021-06-01 12:00:00',
approver:'admin',
icon: 'pajamas:label',
color: 'rgb(44, 157, 243)',
},
{
id: 3,
title: '申请共享:华夏上证50ETF价值分析',
desc:'申请访问:常规申请',
time:'2021-06-01 12:00:00',
approver:'admin',
icon: 'pajamas:label',
color: 'rgb(44, 157, 243)',
},
{
id: 4,
title: '申请共享:华夏上证50ETF价值分析',
desc:'申请访问:常规申请',
time:'2021-06-01 12:00:00',
approver:'admin',
icon: 'pajamas:label',
color: 'rgb(44, 157, 243)',
},
{
id: 5,
title: '申请共享:华夏上证50ETF价值分析',
desc:'申请访问:常规申请',
time:'2021-06-01 12:00:00',
approver:'admin',
icon: 'pajamas:label',
color: 'rgb(44, 157, 243)',
},
]
......@@ -43,7 +43,7 @@ export const sourceSideConfigurationFormSchema: FormSchema[] = [
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: 'KunOB数据源', value: 'KunOB数据源' },
{ label: 'KunDB数据源', value: 'KunDB数据源' },
{ label: 'MongoDB数据源', value: 'MongoDB数据源' },
{ label: 'AmazonS3', value: 'AmazonS3' },
],
......
......@@ -664,11 +664,11 @@
label: '数据源',
component: 'Select',
required: true,
defaultValue: 'KunOB数据源',
defaultValue: 'KunDB数据源',
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: 'KunOB数据源', value: 'KunOB数据源' },
{ label: 'KunDB数据源', value: 'KunDB数据源' },
{ label: 'MongoDB数据源', value: 'MongoDB数据源' },
{ label: 'AmazonS3', value: 'AmazonS3' },
],
......@@ -677,40 +677,48 @@
{
field: 'dataBase',
label: '数据库',
component: 'Cascader',
component: 'Select',
required: true,
componentProps: {
placeholder: '请选择数据源',
displayRender: ({ labels }) => {
return labels[labels.length - 1];
},
placeholder: '',
options: [
{
value: '数据库对象资源',
label: '数据库对象资源',
children: [
{
value: '数据中台工作区01',
label: '数据中台工作区01',
children: [
{
value: 'ArgoDB_Dev01',
label: 'ArgoDB_Dev01',
},
{
value: 'ArgoDB_Dev02',
label: 'ArgoDB_Dev02',
},
{
value: 'GbaseDB_Dev01',
label: 'GbaseDB_Dev01',
},
],
},
],
},
{ label: 'maoyanceshi1', value: 'maoyanceshi1' },
{ label: 'bigevent', value: 'bigevent' },
{ label: 'database1', value: 'database1' },
],
},
// componentProps: {
// placeholder: '请选择数据源',
// displayRender: ({ labels }) => {
// return labels[labels.length - 1];
// },
// options: [
// {
// value: '数据库对象资源',
// label: '数据库对象资源',
// children: [
// {
// value: '数据中台工作区01',
// label: '数据中台工作区01',
// children: [
// {
// value: 'ArgoDB_Dev01',
// label: 'ArgoDB_Dev01',
// },
// {
// value: 'ArgoDB_Dev02',
// label: 'ArgoDB_Dev02',
// },
// {
// value: 'GbaseDB_Dev01',
// label: 'GbaseDB_Dev01',
// },
// ],
// },
// ],
// },
// ],
// },
},
{
field: 'metadataType',
......@@ -900,7 +908,7 @@
componentProps: {
placeholder: '',
options: [
{ label: 'KunOB数据源', value: 'KunOB数据源' },
{ label: 'KunDB数据源', value: 'KunDB数据源' },
{ label: 'MongoDB数据源', value: 'MongoDB数据源' },
{ label: 'AmazonS3', value: 'AmazonS3' },
],
......
......@@ -4,9 +4,7 @@
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="primary" @click="updateData">更新</a-button>
<!-- <a-button type="primary" @click="handleCreate">新增</a-button>-->
<a-button type="primary" @click="handleAdd">新增</a-button>
<!-- <a-button type="primary" @click="handleDeleteBatch">批量删除</a-button>-->
<a-button type="primary" @click="handleMoveBatch">批量移动</a-button>
</template>
<template #bodyCell="{ column, record }">
......
<template>
<!-- 标签管理新增或修改 弹窗 -->
<BasicModal
v-bind="$attrs"
@register="registerModal"
showFooter
:title="getTitle"
width="35%"
@ok="handleSubmit"
>
<BasicForm @register="registerForm">
</BasicForm>
</BasicModal>
</template>
<script lang="ts" setup>
import {computed, ref, unref} from 'vue';
import {BasicForm, useForm} from '@/components/Form';
import {useModalInner} from '@/components/Modal';
import BasicModal from '@/components/Modal/src/BasicModal.vue';
import {useMessage} from "@/hooks/web/useMessage";
import {formSchema} from "@/views/dataSharingAndExchange/labelManagement/labelManagement.data";
defineOptions({name: 'LabelManagementModal'});
const emit = defineEmits(['success', 'register']);
const {createMessage} = useMessage();
const isUpdate = ref(false)
// 初始化弹窗
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
resetFields();
setModalProps({loading: false, confirmLoading: false});
isUpdate.value = !!data?.isUpdate;
setFieldsValue({
...data.record
});
});
const [registerForm, {resetFields, setFieldsValue, validate, setProps}] = useForm({
labelWidth: 90,
baseColProps: {span: 24},
schemas: formSchema,
showActionButtonGroup: false,
});
const getTitle = computed(() => (!unref(isUpdate) ? '新增业务标签' : '编辑业务标签'));
/** 确认按钮 */
async function handleSubmit() {
const values = await validate();
if (unref(isUpdate)) {
createMessage.success('修改成功');
closeModal()
} else {
createMessage.success('新增成功');
closeModal()
}
closeModal()
}
</script>
<template>
<!-- 标签管理 -->
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="primary" @click="handleAdd">新增</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
// label: '编辑',
onClick: handleEdit.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
// label: '删除',
color: 'error',
popConfirm: {
title: '是否确认删除',
placement: 'left',
confirm: handleDelete.bind(null, record),
},
},
]"
/>
</template>
</template>
</BasicTable>
<!-- 新增或修改 弹窗 -->
<LabelManagementModal @register="registerModal" @success="handleSuccess"/>
</PageWrapper>
</template>
<script lang="ts" setup>
import {reactive, ref} from 'vue';
import {BasicTable, useTable, TableAction} from '@/components/Table';
import {PageWrapper} from '@/components/Page';
import {useMessage} from '@/hooks/web/useMessage';
import {useModal} from '@/components/Modal';
import {
columns,
searchFormSchema
} from "@/views/dataSharingAndExchange/labelManagement/labelManagement.data";
import {
labelManagementListData
} from "@/views/dataSharingAndExchange/labelManagement/labelManagementData";
import LabelManagementModal
from "@/views/dataSharingAndExchange/labelManagement/LabelManagementModal.vue"
defineOptions({name: 'LabelManagement'});
const {createMessage} = useMessage();
const [registerModal, {openModal: openLabelManagement}] = useModal();
const searchInfo = reactive<Recordable>({});
const tableData = ref([])
const [registerTable, {
reload,
updateTableDataRecord,
getSearchInfo,
getForm,
getRowSelection
}] = useTable({
title: '',
api: async (params) => {
var data = [];
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: data.length,
code: '',
message: '',
data: [],
};
return {...response, data: labelManagementListData};
},
rowKey: 'id',
columns,
rowSelection: true,
formConfig: {
labelWidth: 10,
schemas: searchFormSchema,
autoSubmitOnEnter: false,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
},
});
/** 刷新 按钮 */
function handleReload() {
createMessage.success('刷新成功!')
reload();
}
/** 删除 按钮 */
async function handleDelete(record: Recordable) {
createMessage.success('删除成功!');
}
/** 新增 按钮 */
function handleAdd() {
openLabelManagement(true, {
isUpdate: false,
});
}
/** 编辑 按钮 */
function handleEdit(record: Recordable) {
openLabelManagement(true, {
isUpdate: true,
record
});
}
/** 成功时返回的方法 */
function handleSuccess() {
reload();
}
</script>
import {BasicColumn, FormSchema} from "@/components/Table";
// 搜索栏参数
export const searchFormSchema: FormSchema[] = [
{
field: 'labelName',
component: 'Input',
componentProps: {
placeholder: '搜索业务标签名称',
},
colProps: {span: 6},
},
];
// 表头列表头
export const columns: BasicColumn[any] = [
{
title: '名称',
dataIndex: 'labelName',
width: 150,
},
{
title: '描述',
dataIndex: 'labelDescription',
width: 150,
},
{
title: '创建者',
dataIndex: 'createBy',
width: 150,
},
{
title: '创建时间',
dataIndex: 'createDate',
width: 150,
},
{
title: '关联资源数',
dataIndex: 'associatedResourceNumber',
width: 150,
},
];
// 表单表头
export const formSchema: FormSchema[any] = [
{
field: 'labelName',
label: '名称',
component: 'Input',
required: true,
},
{
field: 'labelDescription',
label: '描述',
component: 'Input',
required: false,
},
]
// 标签管理 列表数据
export const labelManagementListData: any[] = [
{
"id": 0,
"labelName": "科技管理",
"labelDescription": "科技管理",
"associatedResourceNumber": "9",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-24 10:04:04",
"updateBy": "admin",
"updateDate": "2024-10-24 10:04:04"
},
{
"id": 1,
"labelName": "环境保护",
"labelDescription": "环境保护",
"associatedResourceNumber": "7",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-24 18:44:16",
"updateBy": "admin",
"updateDate": "2024-10-24 18:44:16"
},
{
"id": 2,
"labelName": "医药卫生管理",
"labelDescription": "医药卫生管理",
"associatedResourceNumber": "6",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-25 11:05:05",
"updateBy": "admin",
"updateDate": "2024-10-25 11:05:05"
},
{
"id": 3,
"labelName": "城乡建设",
"labelDescription": "城乡建设",
"associatedResourceNumber": "6",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-27 09:27:29",
"updateBy": "admin",
"updateDate": "2024-10-27 09:27:29"
},
{
"id": 4,
"labelName": "管理支持",
"labelDescription": "管理支持",
"associatedResourceNumber": "5",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-29 13:45:12",
"updateBy": "admin",
"updateDate": "2024-10-29 13:45:12"
},
{
"id": 5,
"labelName": "外部数据",
"labelDescription": "外部数据",
"associatedResourceNumber": "4",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-11-02 08:15:30",
"updateBy": "admin",
"updateDate": "2024-11-02 08:15:30"
},
];
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" title="编辑" @ok="handleSubmit">
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import {accountFormSchema, EditFormSchema} from '../institution.data';
import { getDeptList } from '@/api/system/dept/dept';
import {addUserApi,UserDetailApi,UserUpdataApi} from '@/api/system/user/user'
import { encryptTwo } from '../../../../src/utils/jsencrypt.js'
import { useMessage } from '@/hooks/web/useMessage';
import {TreeData} from "@/views/dataSharingAndExchange/catalogingManagement/institutionData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
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: EditFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
// 获取行数据的id
rowId.value = data.record.businessId;
// 塞值
setFieldsValue({
...data.record,
});
}
const treeList = handleTree(TreeData, 'businessId',undefined,undefined,undefined)
updateSchema([
{
field: 'institutionId',
componentProps: {
treeData: treeList
},
},
]);
});
const getTitle = computed(() => (!unref(isUpdate) ? '编辑' : '编辑'));
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
}
/**确定按钮*/
async function handleSubmit() {
try {
//拿到表单内容
const values = await validate();
//通过表单获取的institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
values.institutionName = institutionName
setModalProps({ confirmLoading: true });
// 编辑
if(unref(isUpdate)) {
values.businessId = rowId.value
//修改列表值
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
createMessage.success('编辑成功');
closeModal();
}else {
//根据institutionId去查找相同TreeData中的institutionId的institutionName
const institutionName = TreeData.find(item => item.businessId === values.institutionId).institutionName
const paramsAdd = {
username: values.username,
name: values.name,
institutionId: values.institutionId,
institutionName: institutionName,
createDate: formatDate(new Date())
}
emit('success', { isUpdate: unref(isUpdate), values: { ...paramsAdd } });
createMessage.success('新增成功');
closeModal();
}
} finally {
setModalProps({ confirmLoading: false });
}
}
// 格式化日期
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
</script>
import { getAllRoleList } from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
import { h } from 'vue';
import { Tag } from 'ant-design-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;
export const columns: BasicColumn[] = [
{
title: '质量主体名称',
dataIndex: 'fileName',
width: 150,
slots: { customRender: 'fileName' },
},
{
title: '描述',
dataIndex: 'descripe',
width: 150,
},
{
title: '创建者',
dataIndex: 'holder',
width: 150,
},
{
title: '创建时间',
dataIndex: 'createDate',
width: 150,
},
{
title: '更新时间',
dataIndex: 'updateDate',
width: 150,
},
{
title: '原始主体',
dataIndex: 'originalPrincipal',
slots: { customRender: 'originalPrincipal' },
width: 150,
},
];
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: '名称',
component: 'Input',
componentProps: {
placeholder: '请输入名称',
},
colProps: { span: 7 },
},
];
export const accountFormSchema: any[] = [
{
field: 'fileName',
label: '文件名称',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'location',
label: '保存位置',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'createDate',
label: '创建时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
{
field: 'updateDate',
label: '最近修改',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
disabled: true,
},
},
];
/**移动*/
export const MoveFormSchema: any[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
];
/**存储管理*/
export const StorageSchema: FormSchema[] = [
{
field: 'isStorage',
label: '存储主体问题数据明细',
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
formActionType.updateSchema([{ field: 'isStorageInHDFS', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'handle', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'isAutoClear', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'clear', ifShow: formModel.isStorage }]);
formActionType.updateSchema([{ field: 'divider', ifShow: formModel.isStorage }]);
},
}),
},
{
field: 'isStorageInHDFS',
label: '存储到HDFS',
labelWidth: 85,
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
ifShow: false,
},
{
field: 'handle',
label: '手动清理',
component: 'BasicTitle',
ifShow: false,
colProps: { lg: 24, md: 24 },
},
{
field: 'clear',
label: '清理',
component: 'Input',
labelWidth: 30,
colProps: { lg: 24, md: 24 },
ifShow: false,
slot: 'clear',
},
{
field: 'divider',
component: 'Divider',
ifShow: false,
colProps: { lg: 24, md: 24 },
},
{
field: 'isAutoClear',
label: '自动清理',
labelWidth: 70,
component: 'Checkbox',
colProps: { lg: 12, md: 24 },
ifShow: false,
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
formActionType.updateSchema([{ field: 'maxRetentionTime', ifShow: formModel.isAutoClear }]);
formActionType.updateSchema([{ field: 'inspectionCycle', ifShow: formModel.isAutoClear }]);
formActionType.updateSchema([{ field: 'inspectionTime', ifShow: formModel.isAutoClear }]);
},
}),
},
{
field: 'maxRetentionTime',
label: '最长保留时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
componentProps: {
addonAfter: '天',
},
ifShow: false,
},
{
field: 'inspectionCycle',
label: '检查周期',
component: 'Select',
colProps: { lg: 24, md: 24 },
componentProps: {
options: [
{ label: '每天', value: '每天' },
{ label: '每周', value: '每周' },
{ label: '每月', value: '每月' },
{ label: '每年', value: '每年' },
],
},
ifShow: false,
},
{
field: 'inspectionTime',
label: '检查时间',
component: 'Input',
colProps: { lg: 24, md: 24 },
ifShow: false,
slot: 'isStorageInHDFS',
},
];
export const resetNameFormSchema: FormSchema[] = [
{
field: 'fileName',
label: '文件名称',
component: 'Input',
rules: [
{
required: true,
message: '请输入文件名称',
},
],
componentProps: {
placeholder: '请输入文件名称',
},
colProps: { span: 8 },
},
];
export const createFileFormSchema: FormSchema[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'fileName',
label: '文件名称',
component: 'Input',
colProps: { lg: 24, md: 24 },
rules: [
{
required: true,
message: '请输入文件名称',
},
],
componentProps: {
placeholder: '请输入文件名称',
},
},
];
export const createTaskFormSchema: FormSchema[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
fieldNames: {
label: 'fileName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
{
field: 'name',
label: '质量主体名称',
component: 'Input',
rules: [
{
required: true,
message: '请输入质量主体名称',
},
],
componentProps: {
placeholder: '请输入质量主体名称',
},
colProps: { lg: 24, md: 24 },
},
{
field: 'fileType',
label: '文件类型',
component: 'Input',
defaultValue: '质量主体',
componentProps: {
readonly: true,
style: {
border: 'none',
backgroundColor: 'transparent',
},
},
colProps: { lg: 24, md: 24 },
},
];
<template>
<!-- 使用监控 -->
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:reload-outlined',
// label: '重试',
onClick: handleUsageMonitor.bind(null, record),
},
{
icon: 'ant-design:tool-outlined',
// label: '',
onClick: handleStopUsageMonitor.bind(null, record),
ifShow: record.pushStatus !== '成功',
},
]"
/>
</template>
</template>
</BasicTable>
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive,ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import {columns, searchFormSchema} from "@/views/dataSharingAndExchange/usageMonitor/usageMonitor.data";
import {usageMonitorListData} from "@/views/dataSharingAndExchange/usageMonitor/usageMonitorData";
defineOptions({ name: 'UsageMonitor' });
const { createMessage } = useMessage();
const [registerModal, { openModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const tableData = ref([])
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '',
api: async (params) => {
var data = [];
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: data.length,
code:'',
message:'',
data: [],
};
return { ...response,data: usageMonitorListData };
},
rowKey: 'id',
columns,
rowSelection: true,
formConfig: {
labelWidth: 10,
schemas: searchFormSchema,
autoSubmitOnEnter: false,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
},
});
/** 刷新 按钮 */
function handleReload() {
createMessage.success('刷新成功!')
reload();
}
/** 连接 按钮 */
function handleUsageMonitor(record: Recordable) {
createMessage.success('刷新成功!')
reload();
}
/** 终止连接 按钮 */
function handleStopUsageMonitor(record: Recordable) {
createMessage.success('刷新成功!')
reload();
}
</script>
// 使用监控 列表数据
export const usageMonitorListData: any[] = [
{
"id": 0,
"resourceName": "医疗服务库",
"ownershipBody": "数据平台治理部",
"affiliatedOrganization": "研发部门",
"operationType": "下载",
"pushMode": "手动推送",
"pushStatus": "成功",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-24 10:04:04",
"updateBy": "admin",
"updateDate": "2024-10-24 10:04:04"
},
{
"id": 1,
"resourceName": "医疗服务库",
"ownershipBody": "数据平台治理部",
"affiliatedOrganization": "研发部门",
"operationType": "数据集推送",
"pushMode": "手动推送",
"pushStatus": "失败",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-24 18:44:16",
"updateBy": "admin",
"updateDate": "2024-10-24 18:44:16"
},
{
"id": 2,
"resourceName": "医疗服务库",
"ownershipBody": "数据平台治理部",
"affiliatedOrganization": "研发部门",
"operationType": "API调用-拉取数据",
"pushMode": "-",
"pushStatus": "成功",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-25 11:05:05",
"updateBy": "admin",
"updateDate": "2024-10-25 11:05:05"
},
{
"id": 3,
"resourceName": "医疗服务库",
"ownershipBody": "数据平台治理部",
"affiliatedOrganization": "研发部门",
"operationType": "API调用-推送数据",
"pushMode": "手动推送",
"pushStatus": "成功",
"delFlag": "0",
"flag": "1",
"createBy": "admin",
"createDate": "2024-10-27 09:27:29",
"updateBy": "admin",
"updateDate": "2024-10-27 09:27:29"
}
];
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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