Commit 684d23f6 authored by 罗林杰's avatar 罗林杰

修改工作组详情概览

parent 2bf6e5fb
...@@ -106,12 +106,11 @@ ...@@ -106,12 +106,11 @@
</Col> </Col>
</div> </div>
</Card> </Card>
<Card> <Card>
<div class="process_title"> <div class="process_title">
<div class="title_info">执行统计</div> <div class="title_info">执行统计</div>
</div> </div>
<div ref="chartRef" style="width: 100%;height: 100%"></div> <div ref="chartRef" style="width: 600px; height: 250px; float: left"></div>
</Card> </Card>
</Col> </Col>
<Col :span="6" class="homePage_right"> <Col :span="6" class="homePage_right">
...@@ -208,7 +207,7 @@ ...@@ -208,7 +207,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {onMounted, reactive, Ref, ref} from 'vue'; import { onMounted, reactive, Ref, ref } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { PageWrapper } from '@/components/Page'; import { PageWrapper } from '@/components/Page';
import { useGo } from '@/hooks/web/usePage'; import { useGo } from '@/hooks/web/usePage';
...@@ -232,9 +231,8 @@ import {onMounted, reactive, Ref, ref} from 'vue'; ...@@ -232,9 +231,8 @@ import {onMounted, reactive, Ref, ref} from 'vue';
defineOptions({ name: 'AccountDetail' }); defineOptions({ name: 'AccountDetail' });
const chartRef = ref<HTMLDivElement | null>(null);
const chartRef = ref<HTMLDivElement | null>(null); const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
const tableData = ref([]); const tableData = ref([]);
const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm }] = useTable({ const [registerTable, { reload, updateTableDataRecord, getSearchInfo, getForm }] = useTable({
title: '工作组列表', title: '工作组列表',
...@@ -257,7 +255,7 @@ const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>); ...@@ -257,7 +255,7 @@ const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
} }
return { ...response, data: data }; return { ...response, data: data };
}, },
rowKey: 'id', rowKey: 'businessId',
columns, columns,
formConfig: { formConfig: {
labelWidth: 120, labelWidth: 120,
...@@ -395,62 +393,59 @@ const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>); ...@@ -395,62 +393,59 @@ const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
// 页面左侧点击返回链接时的操作 // 页面左侧点击返回链接时的操作
function goBack() { function goBack() {
// 本例的效果时点击返回始终跳转到账号列表页,实际应用时可返回上一页 // 本例的效果时点击返回始终跳转到账号列表页,实际应用时可返回上一页
go('/system/system/workspace'); go('/system/workspace');
} }
/** 执行统计echarts渲染*/ /** 执行统计echarts渲染*/
function getEchartsData() { function getEchartsData() {
setOptions({ setOptions({
tooltip: { tooltip: {
trigger: 'item', trigger: 'item',
}, },
legend: { legend: {
bottom: '1%', orient: 'vertical',
left: 'center', left: '90%',
}, top: 'center',
series: [ },
{ series: [
color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'], {
name: '访问来源', color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
type: 'pie', name: '任务',
radius: ['40%', '70%'], type: 'pie',
avoidLabelOverlap: false, radius: ['40%', '70%'],
itemStyle: { avoidLabelOverlap: false,
borderRadius: 10, itemStyle: {
borderColor: '#fff', borderRadius: 10,
borderWidth: 2, borderColor: '#fff',
}, borderWidth: 2,
label: { },
show: false,
position: 'center',
},
emphasis: {
label: { label: {
show: true, show: true,
fontSize: '12', position: 'right',
fontWeight: 'bold', formatter: '{b}: {c} ({d}%)',
},
labelLine: {
show: true,
length: 30,
length2: 30,
},
data: [
{ value: 1048, name: '成功' },
{ value: 735, name: '进行中' },
{ value: 580, name: '等待' },
{ value: 484, name: '失败' },
],
animationType: 'scale',
animationEasing: 'exponentialInOut',
animationDelay: function (idx) {
return Math.random() * 100;
}, },
}, },
labelLine: { ],
show: false, });
}, }
data: [
{ value: 1048, name: '搜索引擎' },
{ value: 735, name: '直接访问' },
{ value: 580, name: '邮件营销' },
{ value: 484, name: '联盟广告' },
],
animationType: 'scale',
animationEasing: 'exponentialInOut',
animationDelay: function () {
return Math.random() * 100;
},
},
],
});
}
onMounted(() => { onMounted(() => {
tableData.value = TreeData; tableData.value = TreeData;
getEchartsData() getEchartsData();
}); });
</script> </script>
...@@ -476,7 +471,7 @@ function getEchartsData() { ...@@ -476,7 +471,7 @@ function getEchartsData() {
} }
} }
.homePage_left { .homePage_left {
.executeStatistics_card{ .executeStatistics_card {
margin-top: 20px; margin-top: 20px;
} }
.homePage_img { .homePage_img {
......
...@@ -81,7 +81,7 @@ ...@@ -81,7 +81,7 @@
} }
return { ...response, data: data }; return { ...response, data: data };
}, },
rowKey: 'id', rowKey: 'businessId',
columns, columns,
formConfig: { formConfig: {
labelWidth: 120, labelWidth: 120,
......
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