forked from wangjiadong/comp
significative
4 months ago
parent
34f2e164e2
commit
e8c9ce5f1c
4 changed files with 424 additions and 87 deletions
@ -0,0 +1,13 @@ |
||||
import { defHttp } from '/@/utils/http/axios'; |
||||
import { GetAccountInfoModel } from './model/accountModel'; |
||||
|
||||
enum Api { |
||||
PAGE_SCHOOL = '/user/login/homepage/school', |
||||
PAGE_DEPARTMENT ='/user/login/homepage/depart' |
||||
} |
||||
|
||||
// Get personal center-basic settings
|
||||
|
||||
export const pageSchoolApi = () => defHttp.get<GetAccountInfoModel>({ url: Api.PAGE_SCHOOL }); |
||||
export const pageDepartmentApi = (orgCode:string) => defHttp.get<GetAccountInfoModel>({ url: Api.PAGE_DEPARTMENT ,params:{orgCode}}); |
||||
|
||||
@ -0,0 +1,259 @@ |
||||
// 部门比赛情况分布 圆环
|
||||
export const optionRing = { |
||||
color: [ |
||||
'#0052D9', |
||||
'#699EF5', |
||||
'#B5C7FF', |
||||
], |
||||
legend: { |
||||
x: 'center', |
||||
orient: 'horizontal', |
||||
bottom: '48px', |
||||
data: ['已完成', '比赛中', '未开始'] |
||||
}, |
||||
series: [ |
||||
{ |
||||
type: 'pie', |
||||
center: ['50%', '41%'], |
||||
radius: ['35%', '45%'], |
||||
avoidLabelOverlap: false, |
||||
label: { |
||||
show: false, |
||||
position: 'center' |
||||
}, |
||||
labelLine: { |
||||
show: false |
||||
}, |
||||
emphasis: { |
||||
label: { |
||||
show: true, |
||||
fontSize: '25', |
||||
fontWeight: 'bold' |
||||
} |
||||
}, |
||||
data: [ |
||||
{ value: 335, name: '已完成' }, |
||||
{ value: 50, name: '比赛中' }, |
||||
{ value: 23, name: '未开始' }, |
||||
] |
||||
} |
||||
] |
||||
}; |
||||
|
||||
|
||||
export const optionBar = { |
||||
tooltip: { |
||||
trigger: 'axis', // 触发类型为坐标轴触发
|
||||
axisPointer: { |
||||
type: 'line', |
||||
label: { |
||||
backgroundColor: '#6a7985' // 自定义交叉线标签的背景色
|
||||
} |
||||
}, |
||||
formatter: function (params) { |
||||
let result = '<div class="bar_card">'; |
||||
result += `<div class="title">维度名称</div>` |
||||
params.forEach(param => { |
||||
result += `<div class="item" style="color: ${param.color};">
|
||||
${param.seriesName}年 ${param.value}
|
||||
</div>`; |
||||
}); |
||||
result += '</div>'; |
||||
return result; |
||||
} |
||||
}, |
||||
grid: { |
||||
left: '0%', |
||||
right: '0%', |
||||
top: '5%', |
||||
bottom: '86px', |
||||
// 如果需要，还可以设置containLabel来控制坐标轴标签是否完全包含在grid区域内
|
||||
containLabel: true |
||||
}, |
||||
legend: { |
||||
data: ['2023', '2024'], |
||||
bottom: '39px', |
||||
}, |
||||
xAxis: { |
||||
data: ['维度一', '维度一', '维度一', '维度一', '维度一', '维度一', '维度一'] |
||||
}, |
||||
yAxis: { |
||||
type: 'value', |
||||
min: 0, |
||||
max: 100, |
||||
}, |
||||
series: [ |
||||
{ |
||||
name: '2023', |
||||
type: 'bar', |
||||
data: [33, 44, 58, 85, 47, 38, 45], |
||||
barWidth: '20px', |
||||
itemStyle: { |
||||
color: '#0052D9', |
||||
} |
||||
}, |
||||
{ |
||||
name: '2024', |
||||
type: 'bar', |
||||
data: [36, 34, 48, 62, 43, 30, 37], |
||||
barWidth: '20px', |
||||
itemStyle: { |
||||
color: '#699EF5', |
||||
} |
||||
}, |
||||
] |
||||
}; |
||||
|
||||
|
||||
var colorArr = ['#fff', '#fff']; //颜色
|
||||
var dataArr = [ |
||||
{ |
||||
value: [4000, 700, 3600, 3900, 1800, 4200, 700, 3600, 4200, 700, 3600, 4200, 700, 3600], |
||||
name: '1', |
||||
itemStyle: { |
||||
normal: { |
||||
lineStyle: { |
||||
color: '#55d7f2', |
||||
}, |
||||
shadowColor: '#4A99FF', |
||||
shadowBlur: 10, |
||||
}, |
||||
}, |
||||
areaStyle: { |
||||
normal: { |
||||
// 单项区域填充样式
|
||||
color: { |
||||
type: 'linear', |
||||
x: 1, //右
|
||||
y: 0, //下
|
||||
x2: 1, //左
|
||||
y2: 1, //上
|
||||
colorStops: [ |
||||
{ |
||||
offset: 0, |
||||
color: '#f0a223', |
||||
}, |
||||
{ |
||||
offset: 1, |
||||
color: '#093138', |
||||
}, |
||||
], |
||||
globalCoord: false, |
||||
}, |
||||
opacity: 1, // 区域透明度
|
||||
}, |
||||
}, |
||||
}, |
||||
]; |
||||
var indicator = [ |
||||
{ |
||||
text: '前言探索', |
||||
max: 6000, |
||||
}, |
||||
{ |
||||
text: '奠定基础', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '知识分析', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '社会责任', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '独立思考', |
||||
max: 5500, |
||||
}, |
||||
{ |
||||
text: '拓宽视野', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '激发兴趣', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '沟通协调', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '设计开发', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '研判分析', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '创新能力', |
||||
max: 5000, |
||||
}, |
||||
{ |
||||
text: '团队协作', |
||||
max: 5000, |
||||
}, |
||||
]; |
||||
|
||||
|
||||
export const optionRadar = { |
||||
backgroundColor: "transparent", |
||||
color: colorArr, |
||||
// legend: {
|
||||
// orient: "vertical",
|
||||
// // icon: 'circle', //图例形状
|
||||
// // data: legendData,
|
||||
// top: 0,
|
||||
// left: 20,
|
||||
// itemWidth: 8, // 图例标记的图形宽度。[ default: 25 ]
|
||||
// itemHeight: 8, // 图例标记的图形高度。[ default: 14 ]
|
||||
// itemGap: 22, // 图例每项之间的间隔。[ default: 10 ]横向布局时为水平间隔，纵向布局时为纵向间隔。
|
||||
// textStyle: {
|
||||
// fontSize: 12,
|
||||
// fontWeight: "bold",
|
||||
// color: "#00E4FF",
|
||||
// },
|
||||
// },
|
||||
tooltip: { |
||||
trigger: 'item' |
||||
}, |
||||
radar: { |
||||
// shape: 'circle',
|
||||
name: { |
||||
textStyle: { |
||||
color: "#9ca4a6", |
||||
fontSize: 12, |
||||
}, |
||||
}, |
||||
indicator: indicator, |
||||
splitArea: { |
||||
// 坐标轴在 grid 区域中的分隔区域，默认不显示。
|
||||
show: true, |
||||
areaStyle: { |
||||
// 分隔区域的样式设置。
|
||||
color: ["rgba(255,255,255,0)", "rgba(255,255,255,0)"], // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。
|
||||
}, |
||||
}, |
||||
axisLine: { |
||||
//指向外圈文本的分隔线样式
|
||||
lineStyle: { |
||||
color: "#2a5f61", |
||||
}, |
||||
}, |
||||
splitLine: { |
||||
lineStyle: { |
||||
color: "#2a5f61", // 分隔线颜色
|
||||
width: 1, // 分隔线线宽
|
||||
}, |
||||
}, |
||||
}, |
||||
series: [ |
||||
{ |
||||
type: "radar", |
||||
symbolSize: 6, |
||||
symbol: "circle", |
||||
data: dataArr, |
||||
}, |
||||
], |
||||
}; |
||||
Loading…
Reference in new issue