Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

环境和新图表

Browse Source
This commit is contained in:
zhanglipeng
2020-11-14 22:03:47 +08:00
parent a445cdba91
commit 8de6c6900c
15 changed files with 1415 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ruoyi-ui/package.json
View File

@ -58,6 +58,7 @@
"js-beautify": "^1.10.2",
"js-cookie": "2.2.0",
"jsencrypt": "3.0.0-rc.1",
"node-sass": "^4.14.1",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"path-to-regexp": "2.4.0",
@ -100,7 +101,6 @@
"husky": "1.3.1",
"lint-staged": "8.1.5",
"mockjs": "1.0.1-beta3",
"node-sass": "^4.9.0",
"plop": "2.3.0",
"runjs": "^4.3.2",
"sass-loader": "^7.1.0",

6
ruoyi-ui/ruoyi-ui.iml
View File

@ -1,8 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<module type="JAVA_MODULE" version="4">
<component name="NewModuleRootManager" inherit-compiler-output="true">
<exclude-output />
<content url="file://$MODULE_DIR$" />
<content url="file://$MODULE_DIR$">
<sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>

2
ruoyi-ui/src/components/HeaderSearch/index.vue
View File

@ -159,7 +159,7 @@ export default {
display: inline-block;
vertical-align: middle;
/deep/ .el-input__inner {
::v-deep .el-input__inner {
border-radius: 0;
border: 0;
padding-left: 0;

2
ruoyi-ui/src/layout/components/TagsView/ScrollPane.vue
View File

@ -73,7 +73,7 @@ export default {
position: relative;
overflow: hidden;
width: 100%;
/deep/ {
::v-deep {
.el-scrollbar__bar {
bottom: 0px;
}

25
ruoyi-ui/src/views/benyi/assessment/history.vue
View File

@ -15,6 +15,21 @@
<div>
<radar-chart :psMsg="item.dictValue" />
</div>
<div>
<radar-chart_jk :psMsg="item.dictValue" />
</div>
<div>
<radar-chart_yy :psMsg="item.dictValue" />
</div>
<div>
<radar-chart_sh :psMsg="item.dictValue" />
</div>
<div>
<radar-chart_kx :psMsg="item.dictValue" />
</div>
<div>
<radar-chart_ys :psMsg="item.dictValue" />
</div>
<div class="block">
<h2 class="block-item-title flex align-center">评估建议</h2>
<!-- <ul class="block-content">
@ -69,11 +84,21 @@ import {
import { getChildByAssessment } from "@/api/benyi/child";
import { getAssessmentDictData } from "@/api/benyi/assessmentchild";
import RadarChart from "@/views/dashboard/RadarChart";
import RadarChart_jk from "@/views/dashboard/RadarChart_jk";
import RadarChart_yy from "@/views/dashboard/RadarChart_yy";
import RadarChart_sh from "@/views/dashboard/RadarChart_sh";
import RadarChart_kx from "@/views/dashboard/RadarChart_kx";
import RadarChart_ys from "@/views/dashboard/RadarChart_ys";
export default {
name: "Assessmentstudent",
components: {
RadarChart,
RadarChart_jk,
RadarChart_yy,
RadarChart_sh,
RadarChart_kx,
RadarChart_ys,
},
data() {
return {

2
ruoyi-ui/src/views/benyi/calendarshow/index123.vue
View File

@ -211,7 +211,7 @@ $color: #45b984;
.full-calendar {
padding: 20px;
height: calc(100% - 30px);
/deep/ {
::v-deep {
.fc-unthemed thead,
.fc-unthemed .fc-content,
.fc-unthemed th,

274
ruoyi-ui/src/views/dashboard/RadarChart_jk.vue Normal file
View File

@ -0,0 +1,274 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
import { getAssessmentStatistics } from "@/api/benyi/assessmentcontent";
const animationDuration = 3000;
export default {
values: [],
mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "300px",
},
psMsg: {
type: String,
default: "",
}, //接收psMsg值 适用范围
},
data() {
return {
chart: null,
childId: "",
};
},
mounted() {
var childId = this.$route.params && this.$route.params.id;
this.childId = childId;
// console.log("child-chart:" + childId);
// console.log("psMsg:" + this.psMsg);
// this.$nextTick(() => {
// this.initChart();
// });
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
async getData() {
await getAssessmentStatistics(this.childId, this.psMsg).then(
(response) => {
console.log(response);
let value = [];
let len = response.statistics;
for (var j = 0; j < len.length; j++) {
console.log(len[j]);
if (len[j] == "NaN") {
value.push(0);
} else {
value.push(len[j]);
}
}
this.values = value;
//console.log(this.names);
//console.log(this.values);
}
);
},
async initChart() {
await this.getData();
this.chart = echarts.init(this.$el, "macarons");
if (this.psMsg == "3") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["60-72个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [72, 72, 72, 72, 72],
name: "60-72个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "2") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["48-60个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [60, 60, 60, 60, 60],
name: "48-60个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "1") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["36-48个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [48, 48, 48, 48, 48],
name: "36-48个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
}
},
},
};
</script>

274
ruoyi-ui/src/views/dashboard/RadarChart_kx.vue Normal file
View File

@ -0,0 +1,274 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
import { getAssessmentStatistics } from "@/api/benyi/assessmentcontent";
const animationDuration = 3000;
export default {
values: [],
mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "300px",
},
psMsg: {
type: String,
default: "",
}, //接收psMsg值 适用范围
},
data() {
return {
chart: null,
childId: "",
};
},
mounted() {
var childId = this.$route.params && this.$route.params.id;
this.childId = childId;
// console.log("child-chart:" + childId);
// console.log("psMsg:" + this.psMsg);
// this.$nextTick(() => {
// this.initChart();
// });
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
async getData() {
await getAssessmentStatistics(this.childId, this.psMsg).then(
(response) => {
console.log(response);
let value = [];
let len = response.statistics;
for (var j = 0; j < len.length; j++) {
console.log(len[j]);
if (len[j] == "NaN") {
value.push(0);
} else {
value.push(len[j]);
}
}
this.values = value;
//console.log(this.names);
//console.log(this.values);
}
);
},
async initChart() {
await this.getData();
this.chart = echarts.init(this.$el, "macarons");
if (this.psMsg == "3") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["60-72个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [72, 72, 72, 72, 72],
name: "60-72个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "2") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["48-60个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [60, 60, 60, 60, 60],
name: "48-60个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "1") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["36-48个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [48, 48, 48, 48, 48],
name: "36-48个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
}
},
},
};
</script>

274
ruoyi-ui/src/views/dashboard/RadarChart_sh.vue Normal file
View File

@ -0,0 +1,274 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
import { getAssessmentStatistics } from "@/api/benyi/assessmentcontent";
const animationDuration = 3000;
export default {
values: [],
mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "300px",
},
psMsg: {
type: String,
default: "",
}, //接收psMsg值 适用范围
},
data() {
return {
chart: null,
childId: "",
};
},
mounted() {
var childId = this.$route.params && this.$route.params.id;
this.childId = childId;
// console.log("child-chart:" + childId);
// console.log("psMsg:" + this.psMsg);
// this.$nextTick(() => {
// this.initChart();
// });
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
async getData() {
await getAssessmentStatistics(this.childId, this.psMsg).then(
(response) => {
console.log(response);
let value = [];
let len = response.statistics;
for (var j = 0; j < len.length; j++) {
console.log(len[j]);
if (len[j] == "NaN") {
value.push(0);
} else {
value.push(len[j]);
}
}
this.values = value;
//console.log(this.names);
//console.log(this.values);
}
);
},
async initChart() {
await this.getData();
this.chart = echarts.init(this.$el, "macarons");
if (this.psMsg == "3") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["60-72个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [72, 72, 72, 72, 72],
name: "60-72个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "2") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["48-60个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [60, 60, 60, 60, 60],
name: "48-60个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "1") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["36-48个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [48, 48, 48, 48, 48],
name: "36-48个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
}
},
},
};
</script>

274
ruoyi-ui/src/views/dashboard/RadarChart_ys.vue Normal file
View File

@ -0,0 +1,274 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
import { getAssessmentStatistics } from "@/api/benyi/assessmentcontent";
const animationDuration = 3000;
export default {
values: [],
mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "300px",
},
psMsg: {
type: String,
default: "",
}, //接收psMsg值 适用范围
},
data() {
return {
chart: null,
childId: "",
};
},
mounted() {
var childId = this.$route.params && this.$route.params.id;
this.childId = childId;
// console.log("child-chart:" + childId);
// console.log("psMsg:" + this.psMsg);
// this.$nextTick(() => {
// this.initChart();
// });
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
async getData() {
await getAssessmentStatistics(this.childId, this.psMsg).then(
(response) => {
console.log(response);
let value = [];
let len = response.statistics;
for (var j = 0; j < len.length; j++) {
console.log(len[j]);
if (len[j] == "NaN") {
value.push(0);
} else {
value.push(len[j]);
}
}
this.values = value;
//console.log(this.names);
//console.log(this.values);
}
);
},
async initChart() {
await this.getData();
this.chart = echarts.init(this.$el, "macarons");
if (this.psMsg == "3") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["60-72个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [72, 72, 72, 72, 72],
name: "60-72个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "2") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["48-60个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [60, 60, 60, 60, 60],
name: "48-60个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "1") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["36-48个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [48, 48, 48, 48, 48],
name: "36-48个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
}
},
},
};
</script>

274
ruoyi-ui/src/views/dashboard/RadarChart_yy.vue Normal file
View File

@ -0,0 +1,274 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "./mixins/resize";
import { getAssessmentStatistics } from "@/api/benyi/assessmentcontent";
const animationDuration = 3000;
export default {
values: [],
mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "300px",
},
psMsg: {
type: String,
default: "",
}, //接收psMsg值 适用范围
},
data() {
return {
chart: null,
childId: "",
};
},
mounted() {
var childId = this.$route.params && this.$route.params.id;
this.childId = childId;
// console.log("child-chart:" + childId);
// console.log("psMsg:" + this.psMsg);
// this.$nextTick(() => {
// this.initChart();
// });
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
async getData() {
await getAssessmentStatistics(this.childId, this.psMsg).then(
(response) => {
console.log(response);
let value = [];
let len = response.statistics;
for (var j = 0; j < len.length; j++) {
console.log(len[j]);
if (len[j] == "NaN") {
value.push(0);
} else {
value.push(len[j]);
}
}
this.values = value;
//console.log(this.names);
//console.log(this.values);
}
);
},
async initChart() {
await this.getData();
this.chart = echarts.init(this.$el, "macarons");
if (this.psMsg == "3") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["60-72个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [72, 72, 72, 72, 72],
name: "60-72个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "2") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["48-60个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [60, 60, 60, 60, 60],
name: "48-60个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
} else if (this.psMsg == "1") {
this.chart.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
radar: {
radius: "66%",
center: ["50%", "42%"],
splitNumber: 8,
splitArea: {
areaStyle: {
color: "rgba(127,95,132,.3)",
opacity: 1,
shadowBlur: 45,
shadowColor: "rgba(0,0,0,.5)",
shadowOffsetX: 0,
shadowOffsetY: 15,
},
},
indicator: [
{ name: "健康", max: 100 },
{ name: "语言", max: 100 },
{ name: "社会", max: 100 },
{ name: "科学", max: 100 },
{ name: "艺术", max: 100 },
],
},
legend: {
left: "center",
bottom: "10",
data: ["36-48个月幼儿测评范围值", "幼儿实际测评值"],
},
series: [
{
type: "radar",
symbolSize: 0,
areaStyle: {
normal: {
shadowBlur: 13,
shadowColor: "rgba(0,0,0,.2)",
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
},
data: [
{
value: [48, 48, 48, 48, 48],
name: "36-48个月幼儿测评范围值",
},
{
value: this.values,
name: "幼儿实际测评值",
},
],
animationDuration: animationDuration,
},
],
});
}
},
},
};
</script>

2
ruoyi-ui/vue.config.js
View File

@ -33,7 +33,7 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
target: `http://localhost:8080`,
target: `http://localhost:8083`,
// target: `http://120.53.14.147:9995`,
changeOrigin: true,
pathRewrite: {