提交 366e97a8 authored 作者: matian's avatar matian

style:样式修改

上级 982efcd3
<template>
<el-card class="box-card">
<el-card class="box-card" style="height: 500px">
<div slot="header" class="clearfix">
<h1 style="font-size: 28px">题型数据</h1>
</div>
<div id="type" style="width: 310px; height: 360px"></div>
<div style="height: 400px; width: 90%; margin: 0 auto">
<div id="type" style="width: 100%; height: 90%"></div>
<div>客观题正确率76%</div>
<div>主观题正确率24%</div>
</div>
</el-card>
</template>
......@@ -22,7 +24,7 @@ export default {
}
},
grid: {
left: '30%',
left: '10%',
right: '5%',
bottom: '20%',
containLabel: true
......@@ -43,6 +45,9 @@ export default {
data: ['0%', '20%', '40%', '60%', '80%', '100%'],
axisLabel: {
formatter: '{value} %'
},
axisLine: {
show: true
}
}
],
......@@ -51,7 +56,15 @@ export default {
name: 'Direct',
type: 'bar',
barWidth: '30%',
data: [20, 40, 60, 80, 100]
data: [20, 40, 60, 80, 100],
itemStyle: {
normal: {
color: function (params) {
const colorList = ['#6F85CC', '#96C080', '#EAC370', '#B170CE', '#D96685']
return colorList[params.dataIndex]
}
}
}
}
]
}
......
<template>
<el-card class="box-card">
<el-card class="box-card" style="height: 500px">
<div slot="header" class="clearfix">
<h1 style="color: #333; font-size: 16px; border-left: 3px solid #aa1941; padding-left: 7px">结果统计</h1>
</div>
<div id="main" style="width: 310px; height: 400px"></div>
<div style="height: 400px; width: 90%; margin: 0 auto">
<div id="main" style="width: 100%; height: 90%"></div>
</div>
</el-card>
</template>
......@@ -33,8 +35,8 @@ export default {
show: false
},
data: [
{ value: 1048, name: '及格人数' },
{ value: 735, name: '不及格人数' }
{ value: 1048, name: '及格人数', itemStyle: { color: '#6C83CE' } },
{ value: 735, name: '不及格人数', itemStyle: { color: '#D96685' } }
]
}
]
......
<template>
<el-card class="box-card">
<el-card class="box-card" style="height: 500px">
<div slot="header" class="clearfix">
<h1 style="color: #333; font-size: 16px; border-left: 3px solid #aa1941; padding-left: 7px">考分区间</h1>
<el-button type="text" style="font-size: 16px; color: #aa1941; float: right; margin-top: -35px">设置</el-button>
</div>
<div id="score" style="width: 310px; height: 400px"></div>
<div style="height: 400px; width: 90%; margin: 0 auto">
<div id="score" style="width: 100%; height: 90%"></div>
</div>
</el-card>
</template>
......@@ -18,7 +20,7 @@ export default {
trigger: 'item'
},
legend: {
bottom: '5%',
bottom: '0',
left: 'center'
},
grid: {
......@@ -29,10 +31,10 @@ export default {
{
name: 'Access From',
type: 'pie',
radius: ['40%', '70%'],
radius: ['50%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderRadius: 3,
borderColor: '#fff',
borderWidth: 2
},
......@@ -51,11 +53,11 @@ export default {
show: false
},
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
{ value: 580, name: 'Email' },
{ value: 484, name: 'Union Ads' },
{ value: 300, name: 'Video Ads' }
{ value: 1048, name: 'Search Engine', itemStyle: { color: '#6F85CC' } },
{ value: 735, name: 'Direct', itemStyle: { color: '#96C080' } },
{ value: 580, name: 'Email', itemStyle: { color: '#EAC370' } },
{ value: 484, name: 'Union Ads', itemStyle: { color: '#D96685' } },
{ value: 300, name: 'Video Ads', itemStyle: { color: '#B170CE' } }
]
}
]
......@@ -68,5 +70,3 @@ export default {
}
}
</script>
<style></style>
<template>
<el-card>
<app-card>
<el-card style="height: 400px">
<h1 style="color: #333; font-size: 16px; border-left: 3px solid #aa1941; padding-left: 7px">班级排名</h1>
<el-button type="text" style="font-size: 16px;color:#AA1941; float: right; margin-top: -40px">导出</el-button>
<el-button type="text" style="font-size: 16px; color: #aa1941; float: right; margin-top: -40px">导出</el-button>
<el-tabs v-model="tabActive" style="margin-top: 30px">
<el-tab-pane label="已完成" name="baseInfo">
<RankingAll />
......@@ -17,7 +16,6 @@
<RankingAll />
</el-tab-pane>
</el-tabs>
</app-card>
</el-card>
</template>
......
<template>
<el-card style="margin-right: -20px">
<el-card style="margin-right: -20px; height: 400px">
<app-container>
<h1 style="color: #333; font-size: 16px; border-left: 3px solid #aa1941; padding-left: 7px">题目数据</h1>
<el-button type="text" style="font-size: 16px; color: #aa1941; float: right; margin-top: -40px">导出</el-button>
......
<template>
<div class="container">
<el-row type="flex" class="row-bg" justify="space-between" style="margin-bottom: 30px">
<el-col><h1 style="padding-left: 50px; font-size: 30px">模拟测试一</h1></el-col>
<el-col :span="11">
<el-col><h1 style="padding-left: 0px; font-size: 30px">模拟测试一</h1></el-col>
<el-col :span="10">
<el-select v-model="label" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
<el-button type="text" style="margin-left: 20px">导出pdf</el-button>
<el-button type="text" style="margin-left: 30px">导出pdf</el-button>
</el-col>
</el-row>
<el-row :gutter="10" class="row-bg">
......
......@@ -63,7 +63,7 @@ export default {
{ label: '最低分', prop: 'low', align: 'center' },
{ label: '题目总数', prop: 'title_num', align: 'center' },
{ label: '及格率', prop: 'title_percent', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' }
{ label: '操作', slots: 'table-operate', align: 'center', width: '150' }
],
data: [
{
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论