Skip to content

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

修改元数据

parent 18fffc56
Hide whitespace changes
Inline Side-by-side
Showing with 429 additions and 14 deletions
src/views/dataStandards/generalView/data.ts 0 → 100644
View file @ 2def4cb4
import {BasicColumn} from "@/components/Table";
export const columns: BasicColumn[] = [
{
title: '更新时间',
dataIndex: 'date',
width: 120,
},
{
title: '标准名称',
dataIndex: 'name',
width: 120,
},
{
title: '标准类型',
dataIndex: 'basicType',
width: 120,
},
{
title: '更新类型',
dataIndex: 'type',
width: 120,
},
];
src/views/dataStandards/generalView/generalViewData.ts 0 → 100644
View file @ 2def4cb4
export const tableChangeData = [
{ date: '06-14', value: 0 },
{ date: '06-15', value: 0 },
{ date: '06-16', value: 0 },
{ date: '06-17', value: 12 },
{ date: '06-18', value: 12 },
{ date: '06-19', value: 15 },
{ date: '06-20', value: 15 },
];
// 假设这是新增的数据
export const new1Data = [
{ date: '06-14', value: 0 },
{ date: '06-15', value: 0 },
{ date: '06-16', value: 0 },
{ date: '06-17', value: 12 },
{ date: '06-18', value: 12 },
{ date: '06-19', value: 12 },
{ date: '06-20', value: 12 },
];
export const new2Data = [
{ date: '06-14', value: 0 },
{ date: '06-15', value: 0 },
{ date: '06-16', value: 0 },
{ date: '06-17', value: 12 },
{ date: '06-18', value: 12 },
{ date: '06-19', value: 13 },
{ date: '06-20', value: 13 },
];
export const new3Data = [
{ date: '06-14', value: 0 },
{ date: '06-15', value: 0 },
{ date: '06-16', value: 0 },
{ date: '06-17', value: 11 },
{ date: '06-18', value: 11 },
{ date: '06-19', value: 11 },
{ date: '06-20', value: 11 },
];
export const fieldChangeData = [
{ name: '失败', value: 24 },
{ name: '成功', value: 77 },
{ name: '进行中', value: 12 },
];
export const partitionData: any[] = [
{
date: '2024-01-15',
name: 'ISO 9001',
basicType: '质量管理',
type: '修订',
},
{
date: '2023-11-20',
name: 'ISO 14001',
basicType: '环境管理',
type: '新发布',
},
{
date: '2023-07-10',
name: 'ISO 45001',
basicType: '职业健康安全',
type: '修订',
},
{
date: '2024-03-05',
name: 'GB/T 22080',
basicType: '信息安全',
type: '新发布',
},
{
date: '2023-09-25',
name: 'ISO 22301',
basicType: '组织管理',
type: '修订',
},
];
src/views/dataStandards/generalView/index.vue
View file @ 2def4cb4
<template>
<div>
概览说明
<div class="homePage_module">
<Row :gutter="16" class="homePage_left">
<Col :span="24">
<Card title="标准概况">
<div class="card_content">
<Col :span="4">
<div class="card_item">
<Icon icon="eos-icons:database" :size="30" :color="'#1091FE'" />
<div class="card_itemInfo">
<div class="dataNum">12个</div>
<div class="dataTitle">基础标准</div>
</div>
</div>
</Col>
<Col :span="4">
<div class="card_item">
<Icon icon="ant-design:fund-outlined" :size="30" :color="'#C737D4'" />
<div class="card_itemInfo">
<div class="dataNum">0个</div>
<div class="dataTitle">指标标准</div>
</div>
</div>
</Col>
<Col :span="4">
<div class="card_item">
<Icon icon="eos-icons:atom-electron" :size="30" :color="'#17B742'" />
<div class="card_itemInfo">
<div class="dataNum">4个</div>
<div class="dataTitle">公共代码</div>
</div>
</div>
</Col>
<Col :span="4">
<div class="card_item">
<Icon icon="iconoir:color-filter" :size="30" :color="'#155775'" />
<div class="card_itemInfo">
<div class="dataNum">1个</div>
<div class="dataTitle">引用文档管理</div>
</div>
</div>
</Col>
<Col :span="4">
<div class="card_item">
<Icon icon="eos-icons:modified-date-outlined" :size="30" :color="'#33BDCC'" />
<div class="card_itemInfo">
<div class="dataNum">1个</div>
<div class="dataTitle">落标检查</div>
</div>
</div>
</Col>
</div>
</Card>
</Col>
</Row>
<div class="charts-container">
<!-- 图表容器 -->
<div id="chart1" class="chart"></div>
<div id="chart2" class="chart"></div>
</div>
<div>
<Row :gutter="16" class="homePage_left">
<BasicTable @register="registerTable" />
</Row>
</div>
</div>
</template>
<script>
export default {
name: "index"
}
<script lang="ts" setup>
import { Card, Col, Row } from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import * as echarts from 'echarts';
import {
fieldChangeData,
tableChangeData,
partitionData,
new1Data,
new2Data,
new3Data,
} from './generalViewData';
import { columns } from './data';
import { onMounted } from 'vue';
import { BasicTable, useTable } from '@/components/Table/index';
const [registerTable] = useTable({
title: '最近更新标准',
dataSource: partitionData,
columns,
pagination: false,
showIndexColumn: false,
scroll: { y: 300 },
});
function initCharts() {
// 获取图表容器
const chart1Container = document.getElementById('chart1');
const chart2Container = document.getElementById('chart2');
// 初始化图表实例
const chart1Instance = echarts.init(chart1Container);
const chart2Instance = echarts.init(chart2Container);
chart1Instance.setOption({
title: {
text: '标准数量变化趋势',
},
tooltip: {},
xAxis: {
data: tableChangeData.map((item) => item.date),
boundaryGap: false, // 数据点与标签对齐
},
legend: {
orient: 'horizontal', // 图例项水平排列
left: 'center', // 图例放置于底部中心位置
top: 'bottom', // 图例放置于图表的底部
},
yAxis: {
min: 0, // 设置 Y 轴的最小值
max: 18,
splitNumber: 3,
},
series: [
{
name: '基础标准',
type: 'line',
color: '#cacaec',
areaStyle: { color: '#dcd4ec' },
data: tableChangeData.map((item) => item.value),
},
{
name: '指标标准',
type: 'line',
color: '#ff7f50', // 橙色
areaStyle: { color: '#ff7f50' },
data: new1Data.map((item) => item.value),
},
{
name: '公共代码',
type: 'line',
color: '#87cefa', // 天蓝色
areaStyle: { color: '#87cefa' },
data: new2Data.map((item) => item.value),
},
{
name: '引用文档管理',
type: 'line',
color: '#cfa3d2', // 青绿色
areaStyle: { color: '#cfa3d2' },
data: new3Data.map((item) => item.value),
},
],
});
chart2Instance.setOption({
title: {
text: '任务执行概览',
},
tooltip: {
trigger: 'item', // 使用数据项图形触发提示
},
legend: {
orient: 'vertical',
left: 'right',
},
series: [
{
name: '字段变更',
type: 'pie',
radius: '55%', // 饼图的半径，默认情况下，内圆半径为0，外圆半径为55%
center: ['50%', '50%'], // 饼图的中心（圆心）坐标，数组的第一项是横坐标，第二项是纵坐标
data: fieldChangeData, // 直接使用原始数据，假设每个元素都有 name 和 value 属性
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
},
],
});
}
onMounted(() => {
initCharts();
});
</script>
<style scoped>
<style lang="scss" scoped>
.homePage_module {
background-color: #fafbfc;
padding: 20px;
.process_title {
display: flex;
justify-content: space-between;
align-items: center;
.title_info {
display: flex;
align-items: center;
font-size: 16px;
font-weight: 600;
}
.process_more {
font-size: 16px;
cursor: pointer;
color: #4aabfe;
font-weight: 600;
}
}
.homePage_left {
.executeStatistics_card {
margin-top: 20px;
}
.homePage_img {
width: 93%;
}
::v-deep(.ant-tabs-tab) {
font-size: 18px;
font-weight: 600;
}
.card_content {
display: flex;
justify-content: space-between;
align-items: center;
.card_item {
padding-left: 20px;
display: flex;
align-items: center;
background-color: #f7f8f9;
width: 250px;
height: 80px;
border-radius: 10px;
.card_itemInfo {
padding-left: 7px;
.dataNum {
font-size: 26px;
line-height: 26px;
font-weight: bold;
}
.dataTitle {
font-size: 16px;
line-height: 16px;
color: #646464;
}
}
}
}
}
.homePage_right {
.notice_card {
margin-top: 20px;
.notice_content {
padding: 8px 0;
.notice_contentInfo {
display: flex;
align-items: center;
.level {
text-align: center;
width: 20px;
height: 20px;
background-color: #f8d0d0;
color: #dd4c4b;
border-radius: 50px;
}
.levelTwo {
text-align: center;
width: 20px;
height: 20px;
background-color: #fcddb8;
color: #f2a346;
border-radius: 50px;
}
.levelThree {
text-align: center;
width: 20px;
height: 20px;
background-color: #e5eeff;
color: #b0b5c7;
border-radius: 50px;
}
.title {
font-weight: bold;
font-size: 16px;
padding-left: 5px;
}
}
.time {
color: #5e5e5e;
}
}
}
.process_Body {
height: 160px;
background-color: #f7f8f9;
text-align: center;
.process_num {
font-weight: bold;
font-size: 60px;
}
.process_info {
font-weight: 300;
font-size: 25px;
}
}
.process_content {
padding-top: 20px;
}
}
}
.chart_col {
display: flex;
justify-content: center;
align-items: center;
}
.status_counts {
margin-top: 10px;
text-align: center;
}
.charts-container {
display: flex;
justify-content: space-between;
gap: 20px;
}
.chart {
margin: 20px 0 0 15px;
width: calc(50% - 10px); /* 确保两个图表并排显示 */
height: 400px;
background-color: white;
}
</style>
src/views/metadata/metadataData.ts
View file @ 2def4cb4
......@@ -516,13 +516,13 @@ export const tableChangeData = [
{ date: '2023-06-20', value: 200 },
];
export const fieldChangeData = [
{ date: '2023-06-14', value: 1000 },
{ date: '2023-06-15', value: 1000 },
{ date: '2023-06-16', value: 1000 },
{ date: '2023-06-17', value: 1000 },
{ date: '2023-06-18', value: 1000 },
{ date: '2023-06-19', value: 1000 },
{ date: '2023-06-20', value: 1000 },
{ name: '2023-06-14', value: 1000 },
{ name: '2023-06-15', value: 1000 },
{ name: '2023-06-16', value: 1000 },
{ name: '2023-06-17', value: 1000 },
{ name: '2023-06-18', value: 1000 },
{ name: '2023-06-19', value: 1000 },
{ name: '2023-06-20', value: 1000 },
];
export const accountFormSchema: any[] = [];
......
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