洋浦学校 待办工作阶段代码提交

init
gongdi 3 years ago
parent cfab8a70c5
commit b303aaadcf

@ -501,6 +501,14 @@
<style scoped lang="scss">
.PsychologicalWarningSmall{
/deep/ .ant-tabs-nav{
.ant-tabs-tab{
color: var(--moduleFontColor);
}
.ant-tabs-tab-active{
color: #31a8fa;
}
}
.condition{
margin-right: 1rem;
margin-bottom: 1rem;

@ -204,6 +204,15 @@
}
</script>
<style scoped>
<style scoped lang="scss">
.selectSubjectAnalysis{
/deep/ .ant-tabs-nav{
.ant-tabs-tab{
color: var(--moduleFontColor);
}
.ant-tabs-tab-active{
color: #31a8fa;
}
}
}
</style>

@ -2,7 +2,7 @@
<template>
<div>
<!-- echart表格 -->
<div ref="bar_dv" :style="echartStyle"></div>
<div ref="bar_dv" :style="echartStyle"></div>
</div>
</template>
@ -57,62 +57,144 @@
},
data(){
return {
//
echartColor: "",
}
},
watch: {
'$store.state.userStore.theme': {
handler (val) {
if (val === "systemTheme") {
this.echartColor = "#fff";
} else {
this.echartColor = "#aaaaaa";
}
if (this.charts) {
let option = this.charts.getOption();
option.legend[0].textStyle.color = this.echartColor;
option.xAxis[0].axisLabel.textStyle.color = this.echartColor;
option.yAxis[0].axisLabel.textStyle.color = this.echartColor;
option.xAxis[0].nameTextStyle.color = this.echartColor;
option.yAxis[0].nameTextStyle.color = this.echartColor;
this.charts.setOption(option)
}
},
immediate: true
},
},
methods: {
drawLine() {
this.charts = echarts.init(this.$refs.bar_dv);
if(this.isType==="manyBar"){
this.autoHeight = this.legendData.length* 35 + 50; // counst.length3550x()
this.charts.resize({height:this.autoHeight<400?400:this.autoHeight});
if (this.isType === "manyBar") {
this.autoHeight = this.legendData.length * 35 + 50; // counst.length3550x()
this.charts.resize({height: this.autoHeight < 400 ? 400 : this.autoHeight});
}
let xAxis={};
let yAxis={};
if(this.isType==="across"){
xAxis={
let xAxis = {};
let yAxis = {};
if (this.isType === "across") {
xAxis = {
type: "value",
name:this.yAxisName
name: this.yAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
yAxis={
yAxis = {
type: "category",
data: this.xAxisData,
name:this.xAxisName,
name: this.xAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
}else if(this.isType==='time'){
xAxis={
} else if (this.isType === 'time') {
xAxis = {
type: 'time',
boundaryGap: false,
splitNumber:2
boundaryGap: false,
splitNumber: 2,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
yAxis= {
yAxis = {
type: 'value',
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
},
// boundaryGap: [0, '100%']
}
}else if(this.isType==="manyBarFloor"){
xAxis={
} else if (this.isType === "manyBarFloor") {
xAxis = {
type: "category",
data: this.xAxisData,
name:this.xAxisName,
name: this.xAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
interval:0,
rotate:40
interval: 0,
rotate: 40,
textStyle: {
color: this.echartColor//
}
}
};
yAxis={
yAxis = {
type: "value",
name:this.yAxisName
name: this.yAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
}else{
xAxis={
} else {
xAxis = {
type: "category",
data: this.xAxisData,
name:this.xAxisName,
name: this.xAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
yAxis={
yAxis = {
type: "value",
name:this.yAxisName
name: this.yAxisName,
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
};
}
this.charts.setOption({
@ -125,18 +207,21 @@
containLabel: true
},
legend: {
x:'center',
y:this.isType==='time'||this.isType==='manyBarFloor'||this.isType==='across'?'top':'bottom',
data: this.legendData
x: 'center',
y: this.isType === 'time' || this.isType === 'manyBarFloor' || this.isType === 'across' ? 'top' : 'bottom',
data: this.legendData,
textStyle: {
color: this.echartColor//
}
},
dataZoom: this.isType==='time'?[{
dataZoom: this.isType === 'time' ? [{
type: 'inside',
start: 10,
end: 30,
}, {
start: 10,
end: 30,
}]:this.isType==="manyBarFloor"||this.isType==="across"?[ {
}] : this.isType === "manyBarFloor" || this.isType === "across" ? [{
show: true,
realtime: true,
start: 0,
@ -147,9 +232,9 @@
realtime: true,
start: 0,
end: 50
}]:[],
}] : [],
series: this.seriesData,
tooltip : {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
@ -164,7 +249,7 @@
},
mounted() {
this.$nextTick(function() {
this.$nextTick(function () {
this.drawLine('barChart')
})
},
@ -172,7 +257,7 @@
</script>
<style scoped>
#barChart{
#barChart {
width: 100%;
}
</style>

@ -40,20 +40,58 @@
},
data(){
return {
//
echartColor: "",
}
},
watch: {
'$store.state.userStore.theme': {
handler (val) {
if (val === "systemTheme") {
this.echartColor = "#fff";
} else {
this.echartColor = "#aaaaaa";
}
if (this.charts) {
let option = this.charts.getOption();
option.legend[0].textStyle.color = this.echartColor;
option.xAxis[0].axisLabel.textStyle.color = this.echartColor;
option.yAxis[0].axisLabel.textStyle.color = this.echartColor;
option.yAxis[0].nameTextStyle.color = this.echartColor;
this.charts.setOption(option)
}
},
immediate: true
},
},
methods: {
drawLine() {
this.charts = echarts.init(this.$refs.line_dv);
this.charts.setOption({
legend: {
type: 'scroll',
textStyle: {
color: this.echartColor//
}
},
xAxis: {
type: "category",
data: this.xAxisData,
axisLabel:{
textStyle: {
color: this.echartColor//
}
}
},
yAxis: {
type: "value",
nameTextStyle: {
color: this.echartColor//
},
axisLabel: {
textStyle: {
color: this.echartColor//
}
}
},
dataZoom:[ {
show: true,

@ -438,6 +438,8 @@
itemWidth: 15,
itemHeight: 15,
data: legendList,
//top: 'bottom',
type: 'scroll',
textStyle: {
color: this.echartColor//
}

@ -505,6 +505,14 @@
display: flex;
.tab-change-div {
width: 50%;
.ant-tabs-nav{
.ant-tabs-tab{
color: var(--moduleFontColor);
}
.ant-tabs-tab-active{
color: #31a8fa;
}
}
}
.time-change-div {
width: 50%;

Loading…
Cancel
Save