xgxt_sd/zhxg_pc
18
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

代码格式修改

Browse Source
This commit is contained in:
18154758993
2025-10-18 17:13:04 +08:00
parent b9224ed8bb
commit 81017eb280
837 changed files with 102784 additions and 98409 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/student_info/components/AgeEchart.vue
View File

@@ -1,16 +1,16 @@
<template>
<div class="age-wrapper">
<div v-for="item of dataList" :key="item.name" class="age-item-bar">
<p class="bar-left">{{item.name}}</p>
<p class="bar-left">{{ item.name }}</p>
<div class="bar-right" :title="item.value">
<span :style="{background: item.color, width: item.rate}" class="color-bar"></span>
<span :style="{background: item.color, width: item.rate}" class="color-bar" />
</div>
</div>
</div>
</template>
<script>
import {getSrsAgeCount} from '@/api/stuCQS/basedata/student.js';
import {getSrsAgeCount} from '@/api/stuCQS/basedata/student.js'
export default {
name: 'AgeEchart',
components: {
@@ -24,12 +24,12 @@ export default {
]
}
},
mounted() {},
methods: {
async getSrsAgeCounts(){
var res =await getSrsAgeCount();
var res =await getSrsAgeCount()
}
},
mounted() {},
}
</script>

4
src/views/student_info/components/HonorDataList.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="honor-wrapper">
<div v-for="(item, index) of dataList" :key="item.name" class="honor-item-bar">
<div :class="{'honor-left': true, ['honor-left' + index]: true}"></div>
<div :class="{'honor-left': true, ['honor-left' + index]: true}" />
<div class="honor-right">
<p class="honor-text-left">{{ item.name }}</p>
<p class="honor-text-right">{{ item.value }}<span>人</span></p>
@@ -25,10 +25,10 @@ export default {
]
}
},
mounted() {},
methods: {
},
mounted() {},
}
</script>

43
src/views/student_info/components/PKTypeEchart.vue
View File

@@ -1,11 +1,10 @@
<template>
<div class="echarts-wrapper" id="PKTypeEchartId">
</div>
<div id="PKTypeEchartId" class="echarts-wrapper" />
</template>
<script>
import * as echarts from 'echarts';
import {getSrsknrdCount} from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import {getSrsknrdCount} from '@/api/stuCQS/basedata/student.js'
export default {
name: 'PKTypeEchart',
components: {},
@@ -14,19 +13,29 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res =await getSrsknrdCount();
var fromTable={};
var myData=[];
var res =await getSrsknrdCount()
var fromTable={}
var myData=[]
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for(var i=0;i< data.length;i++){
fromTable={'name':data[i].xsqmyj,'value':data[i].quantity};
myData.push(fromTable);
fromTable={'name':data[i].xsqmyj,'value':data[i].quantity}
myData.push(fromTable)
}
}
this.chartInstance = echarts.init(document.getElementById('PKTypeEchartId'));
this.chartInstance = echarts.init(document.getElementById('PKTypeEchartId'))
const option = {
tooltip: {
trigger: 'item'
@@ -91,7 +100,7 @@ export default {
data:myData
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -100,16 +109,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

43
src/views/student_info/components/PoliticalEchartEchart.vue
View File

@@ -1,11 +1,10 @@
<template>
<div class="echarts-wrapper" id="politicalSideEchartId">
</div>
<div id="politicalSideEchartId" class="echarts-wrapper" />
</template>
<script>
import * as echarts from 'echarts';
import { getSrsZZCount } from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import { getSrsZZCount } from '@/api/stuCQS/basedata/student.js'
export default {
name: 'PoliticalEchartEchart',
components: {},
@@ -14,19 +13,29 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res = await getSrsZZCount();
var fromTable = {};
var myData = [];
var res = await getSrsZZCount()
var fromTable = {}
var myData = []
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for (var i = 0; i< data.length; i++) {
fromTable = { 'name': data[i].zzmm, 'value': data[i].quantity };
myData.push(fromTable);
fromTable = { 'name': data[i].zzmm, 'value': data[i].quantity }
myData.push(fromTable)
}
}
this.chartInstance = echarts.init(document.getElementById('politicalSideEchartId'));
this.chartInstance = echarts.init(document.getElementById('politicalSideEchartId'))
const option = {
tooltip: {
trigger: 'item'
@@ -86,7 +95,7 @@ export default {
data:myData
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -95,16 +104,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

43
src/views/student_info/components/SexEchart.vue
View File

@@ -1,11 +1,10 @@
<template>
<div class="echarts-wrapper" id="SexEchartId">
</div>
<div id="SexEchartId" class="echarts-wrapper" />
</template>
<script>
import * as echarts from 'echarts';
import { getSrsGenderCount } from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import { getSrsGenderCount } from '@/api/stuCQS/basedata/student.js'
export default {
name: 'SexEchart',
components: {},
@@ -14,19 +13,29 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res = await getSrsGenderCount();
var fromTable = {};
var myData = [];
var res = await getSrsGenderCount()
var fromTable = {}
var myData = []
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for (var i = 0; i< data.length; i++) {
fromTable = { 'name': data[i].gender, 'value': data[i].quantity };
myData.push(fromTable);
fromTable = { 'name': data[i].gender, 'value': data[i].quantity }
myData.push(fromTable)
}
}
this.chartInstance = echarts.init(document.getElementById('SexEchartId'));
this.chartInstance = echarts.init(document.getElementById('SexEchartId'))
const option = {
tooltip: {
trigger: 'item'
@@ -86,7 +95,7 @@ export default {
data:myData
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -95,16 +104,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

4
src/views/student_info/components/ZCDataList.vue
View File

@@ -4,7 +4,7 @@
<p class="key-value">{{ item.value }}
<span>人</span>
</p>
<p class="key-name">{{ item.name }}</p>
<p class="key-name">{{ item.name }}</p>
</div>
</div>
</template>
@@ -26,10 +26,10 @@ export default {
]
}
},
mounted() {},
methods: {
},
mounted() {},
}
</script>

44
src/views/student_info/components/center/CenterBottom.vue
View File

@@ -4,13 +4,13 @@
<img src="../../../../assets/controlCabinImages/title_remark.png" alt="">
<p>学院分布</p>
</div>
<div class="echarts-wrap" id="ZYEchartsId"></div>
<div id="ZYEchartsId" class="echarts-wrap" />
</div>
</template>
<script>
import * as echarts from 'echarts';
import { getMajorsCount } from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import { getMajorsCount } from '@/api/stuCQS/basedata/student.js'
export default {
name: 'CenterBottom',
components: {},
@@ -23,19 +23,29 @@ export default {
secondCounts: []
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res = await getMajorsCount();
var res = await getMajorsCount()
if (res.code == 200) {
var result = [...res.data];
var result = [...res.data]
for (var i = 0; i < result.length; i++) {
this.deptNames.push(result[i].deptName);
this.firstCounts.push(result[i].firstCount);
this.thirdCounts.push(result[i].thirdCount);
this.secondCounts.push(result[i].secondCount);
this.deptNames.push(result[i].deptName)
this.firstCounts.push(result[i].firstCount)
this.thirdCounts.push(result[i].thirdCount)
this.secondCounts.push(result[i].secondCount)
}
}
this.chartInstance = echarts.init(document.getElementById('ZYEchartsId'));
this.chartInstance = echarts.init(document.getElementById('ZYEchartsId'))
const data = {
area: this.deptNames,
legend: ['大一', '大二', '大三'],
@@ -81,7 +91,7 @@ export default {
axisLabel: {
color: '#A8D6FF',
formatter: function (value) {
return value.split("").join("\n") //垂直显示
return value.split('').join('\n') //垂直显示
},
},
@@ -125,7 +135,7 @@ export default {
series: [
]
};
}
for (var i = 0; i < data.legend.length; i++) {
option.series.push({
name: data.legend[i],
@@ -147,16 +157,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

24
src/views/student_info/components/center/CenterTop.vue
View File

@@ -26,7 +26,7 @@
</div>
</template>
<script>
import {getSchoolCountbyGrade,getSchoolTotalCount} from '@/api/stuCQS/basedata/student.js';
import {getSchoolCountbyGrade,getSchoolTotalCount} from '@/api/stuCQS/basedata/student.js'
export default {
name: 'CenterTop',
components: {
@@ -44,32 +44,32 @@ export default {
}
},
created() {
this.init();
this.getData();
this.init()
this.getData()
},
mounted() {},
methods: {
async init(){
var res =await getSchoolCountbyGrade();
var fromTable={};
var res =await getSchoolCountbyGrade()
var fromTable={}
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for(var i=0;i< data.length;i++){
fromTable={'name':this.arabicToChinese(i),'value':data[i].number};
this.dataList.push(fromTable);
fromTable={'name':this.arabicToChinese(i),'value':data[i].number}
this.dataList.push(fromTable)
}
}
},
getData() {
getSchoolTotalCount().then(response => {
this.studentList = response.data;
this.studentList = response.data
})
},
arabicToChinese(num){
const chineseNumerals = [ '大一', '大二', '大三'];
return chineseNumerals[num];
const chineseNumerals = [ '大一', '大二', '大三']
return chineseNumerals[num]
}
},
mounted() {},
}
</script>

74
src/views/student_info/components/center/GuangxiMap.vue
View File

@@ -1,22 +1,22 @@
<template>
<div class="mapContent">
<div id="mapContent" class="map-content"> </div>
<div id="mapContent" class="map-content" />
<div class="leng-wrap">
<div v-for="item of mydata" :key="item.name" class="leng-item">
<span class="leng-item-name">{{item.name}}</span>
<span class="leng-item-bg"></span>
<span class="leng-item-value">{{item.value}}</span>
<span class="leng-item-name">{{ item.name }}</span>
<span class="leng-item-bg" />
<span class="leng-item-value">{{ item.value }}</span>
</div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts';
import guangxiJson from '../../../../assets/js/guangxi.json';
import mapBg from '../../../../assets/controlCabinImages/mapBg.png';
import 'echarts-gl';
import {getCountbyCity,getNotSchoolTotalCount} from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import guangxiJson from '../../../../assets/js/guangxi.json'
import mapBg from '../../../../assets/controlCabinImages/mapBg.png'
import 'echarts-gl'
import {getCountbyCity,getNotSchoolTotalCount} from '@/api/stuCQS/basedata/student.js'
export default {
name: 'GuangxiMap',
data() {
@@ -41,27 +41,36 @@ export default {
mydata:[]
}
},
mounted() {
this.$nextTick(() => {
this.initMap()
})
},
beforeDestroy() {
// clearInterval(this.timer);
// this.timer = null;
},
methods: {
async initMap() {
var res = await getCountbyCity();
var fromTable = {};
var res = await getCountbyCity()
var fromTable = {}
//var mydata = [];
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for (var i = 0; i< data.length; i++) {
fromTable = { 'name': data[i].city, 'value': data[i].total_count,'nan':data[i].male_count,'nv':data[i].female_count };
this.mydata.push(fromTable);
fromTable = { 'name': data[i].city, 'value': data[i].total_count,'nan':data[i].male_count,'nv':data[i].female_count }
this.mydata.push(fromTable)
}
}
var res1 = await getNotSchoolTotalCount();
var res1 = await getNotSchoolTotalCount()
if (res1.code == 200) {
var data1 = [...res1.data];
fromTable = { 'name': '非广西', 'value': data1[0].number};
this.mydata.push(fromTable);
var data1 = [...res1.data]
fromTable = { 'name': '非广西', 'value': data1[0].number}
this.mydata.push(fromTable)
}
echarts.registerMap('guangxiJson', guangxiJson);
echarts.registerMap('china1', guangxiJson);
echarts.registerMap('china2', guangxiJson);
echarts.registerMap('guangxiJson', guangxiJson)
echarts.registerMap('china1', guangxiJson)
echarts.registerMap('china2', guangxiJson)
const option = {
tooltip: {
trigger: 'item',
@@ -76,8 +85,8 @@ export default {
<p style="display: flex;align-items: center;color: #fff;font-size: 14px;padding-left: 12px;margin-bottom: 4px;">男：<span style="font-size: 16px;margin-left: 8px;font-family: 'newFont';">${params.data.nan}人</span></p>
<p style="display: flex;align-items: center;color: #fff;font-size: 14px;padding-left: 12px;margin-bottom: 4px;">女：<span style="font-size: 16px;margin-left: 8px;font-family: 'newFont';">${params.data.nv}人</span></p>
</div>`;
return dom;
</div>`
return dom
}
},
@@ -174,7 +183,7 @@ export default {
series: [
{
type: 'map3D',
map: "guangxiJson",
map: 'guangxiJson',
regionHeight: 10, // 建议添加区域高度
viewControl: {
speed: 10,
@@ -245,11 +254,11 @@ export default {
},
itemStyle: {
color: "rgba(255,255,255,1)",
color: 'rgba(255,255,255,1)',
borderWidth: 1,
borderColor: `#fff`,
borderColor: '#fff',
},
shading: "lambert",
shading: 'lambert',
lambertMaterial: {
detailTexture: mapBg, // 替换为有效纹理URL
// detailTexture:"https://img.isqqw.com/profile/upload/2024/08/17/6ee0cfc7-84a7-46a9-8724-8c615862a92c.jpg",
@@ -467,19 +476,10 @@ export default {
// }
]
};
}
this.myChart = echarts.init(document.getElementById('mapContent'))
this.myChart && this.myChart.setOption(option)
}
},
mounted() {
this.$nextTick(() => {
this.initMap();
});
},
beforeDestroy() {
// clearInterval(this.timer);
// this.timer = null;
}
}
</script>

136
src/views/student_info/components/controlCabinLeft.vue
View File

@@ -11,7 +11,7 @@
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>民族</p>
</div>
<div class="echarts-wrap" id="nationId"></div>
<div id="nationId" class="echarts-wrap" />
</div>
<div class="wrapper-item">
<div class="sub-title">
@@ -19,7 +19,7 @@
<p>农村/城镇</p>
</div>
<div class="echarts-wrap">
<ContrySideEchart></ContrySideEchart>
<ContrySideEchart />
</div>
</div>
<div class="wrapper-item">
@@ -28,7 +28,7 @@
<p>政治面貌</p>
</div>
<div class="echarts-wrap">
<PoliticalEchartEchart></PoliticalEchartEchart>
<PoliticalEchartEchart />
</div>
</div>
<div class="wrapper-item">
@@ -37,68 +37,68 @@
<p>男女比例</p>
</div>
<div class="echarts-wrap">
<SexEchart></SexEchart>
<SexEchart />
</div>
</div>
</div>
<div class="left-wrap-right">
<div class="left-wrap-left">
<div class="wrapper-item die-height">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>贫困类型</p>
</div>
<div class="echarts-wrap">
<PKTypeEchart></PKTypeEchart>
</div>
</div>
<div class="wrapper-item age-item">
<div class="sub-special-title">
<div class="sub-special-left">
<img src="@/assets/controlCabinImages/title_dir_left.png" alt="">
<p>年龄分布</p>
<img src="@/assets/controlCabinImages/title_dir_right.png" alt="">
<div class="wrapper-item die-height">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>贫困类型</p>
</div>
<div class="echarts-wrap">
<PKTypeEchart />
</div>
<div class="sub-special-right">出生年份</div>
</div>
<div class="echarts-wrap">
<AgeEchart></AgeEchart>
<div class="wrapper-item age-item">
<div class="sub-special-title">
<div class="sub-special-left">
<img src="@/assets/controlCabinImages/title_dir_left.png" alt="">
<p>年龄分布</p>
<img src="@/assets/controlCabinImages/title_dir_right.png" alt="">
</div>
<div class="sub-special-right">出生年份</div>
</div>
<div class="echarts-wrap">
<AgeEchart />
</div>
</div>
<div class="wrapper-item zc-item">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>政策奖励及补助</p>
</div>
<div class="echarts-wrap">
<ZCDataList />
</div>
</div>
<div class="wrapper-item">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>荣誉</p>
</div>
<div class="echarts-wrap honor-wrap">
<HonorDataList />
</div>
</div>
</div>
<div class="wrapper-item zc-item">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>政策奖励及补助</p>
</div>
<div class="echarts-wrap">
<ZCDataList></ZCDataList>
</div>
</div>
<div class="wrapper-item">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>荣誉</p>
</div>
<div class="echarts-wrap honor-wrap">
<HonorDataList></HonorDataList>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts';
import ContrySideEchart from './contrySideEchart.vue';
import PoliticalEchartEchart from './PoliticalEchartEchart.vue';
import SexEchart from './SexEchart.vue';
import PKTypeEchart from './PKTypeEchart.vue';
import AgeEchart from './AgeEchart.vue';
import ZCDataList from './ZCDataList.vue';
import HonorDataList from './HonorDataList.vue';
import {getSrsMZCount} from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import ContrySideEchart from './contrySideEchart.vue'
import PoliticalEchartEchart from './PoliticalEchartEchart.vue'
import SexEchart from './SexEchart.vue'
import PKTypeEchart from './PKTypeEchart.vue'
import AgeEchart from './AgeEchart.vue'
import ZCDataList from './ZCDataList.vue'
import HonorDataList from './HonorDataList.vue'
import {getSrsMZCount} from '@/api/stuCQS/basedata/student.js'
export default {
name: 'ControlCabin',
components: {
@@ -115,19 +115,29 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res =await getSrsMZCount();
var fromTable={};
var myData=[];
var res =await getSrsMZCount()
var fromTable={}
var myData=[]
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for(var i=0;i< data.length;i++){
fromTable={'name':data[i].mz,'value':data[i].quantity};
myData.push(fromTable);
fromTable={'name':data[i].mz,'value':data[i].quantity}
myData.push(fromTable)
}
}
this.chartInstance = echarts.init(document.getElementById('nationId'));
this.chartInstance = echarts.init(document.getElementById('nationId'))
const option = {
tooltip: {
trigger: 'item'
@@ -182,7 +192,7 @@ export default {
data:myData
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -191,16 +201,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

45
src/views/student_info/components/contrySideEchart.vue
View File

@@ -1,32 +1,41 @@
<template>
<div class="echarts-wrapper" id="contrySideEchartId">
</div>
<div id="contrySideEchartId" class="echarts-wrapper" />
</template>
<script>
import * as echarts from 'echarts';
import { getSrsHZCount } from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import { getSrsHZCount } from '@/api/stuCQS/basedata/student.js'
export default {
name: 'contrySideEchart',
name: 'ContrySideEchart',
components: {},
data() {
return {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
var res = await getSrsHZCount();
var fromTable = {};
var myData = [];
var res = await getSrsHZCount()
var fromTable = {}
var myData = []
if (res.code == 200) {
var data = [...res.data];
var data = [...res.data]
for (var i = 0; i< data.length; i++) {
fromTable = { 'name': data[i].hkxz + "户口", 'value': data[i].quantity };
myData.push(fromTable);
fromTable = { 'name': data[i].hkxz + '户口', 'value': data[i].quantity }
myData.push(fromTable)
}
}
this.chartInstance = echarts.init(document.getElementById('contrySideEchartId'));
this.chartInstance = echarts.init(document.getElementById('contrySideEchartId'))
const option = {
tooltip: {
trigger: 'item'
@@ -86,7 +95,7 @@ export default {
data: myData
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -95,16 +104,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

26
src/views/student_info/components/right/RightBottom.vue
View File

@@ -4,12 +4,12 @@
<div class="bottom-top-item">综合素质评价<img src="../../../../assets/controlCabinImages/dir_bottom.png" alt=""></div>
<div class="bottom-top-item">2023-2024学年 上学期<img src="../../../../assets/controlCabinImages/dir_bottom.png" alt=""></div>
</div>
<div class="echarts-wrap" id="XGPJEchartsId"></div>
<div id="XGPJEchartsId" class="echarts-wrap" />
</div>
</template>
<script>
import * as echarts from 'echarts';
import * as echarts from 'echarts'
export default {
name: 'RightCenter',
components: {},
@@ -21,6 +21,16 @@ export default {
datavaule: [87, 94, 96, 83, 90]
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
generateRichText(value, percent) {
const mapping = {
@@ -65,7 +75,7 @@ export default {
return this.dataname.findIndex(item => item === obj)
},
initChart() {
this.chartInstance = echarts.init(document.getElementById('XGPJEchartsId'));
this.chartInstance = echarts.init(document.getElementById('XGPJEchartsId'))
const option = {
backgroundColor: 'transparent',
tooltip: { show: false },
@@ -116,16 +126,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

32
src/views/student_info/components/right/RightCenter.vue
View File

@@ -7,12 +7,12 @@
</div>
<div class="more">更多 <img src="../../../../assets/controlCabinImages/direction.png" alt=""></div>
</div>
<div class="echarts-wrap" id="FZQXEchartsId"></div>
<div id="FZQXEchartsId" class="echarts-wrap" />
</div>
</template>
<script>
import * as echarts from 'echarts';
import * as echarts from 'echarts'
export default {
name: 'RightCenter',
components: {},
@@ -21,11 +21,21 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
initChart() {
this.chartInstance = echarts.init(document.getElementById('FZQXEchartsId'));
let label = [2020, 2021, 2022, 2023, 2024];
let value = [1125, 2586, 2200, 3765, 2964];
this.chartInstance = echarts.init(document.getElementById('FZQXEchartsId'))
let label = [2020, 2021, 2022, 2023, 2024]
let value = [1125, 2586, 2200, 3765, 2964]
const option = {
tooltip: {
@@ -87,7 +97,7 @@ export default {
]
}
]
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -96,16 +106,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

42
src/views/student_info/components/right/RightTop.vue
View File

@@ -7,13 +7,13 @@
</div>
<!-- <div class="more">更多 <img src="../../../../assets/controlCabinImages/direction.png" alt=""></div> -->
</div>
<div class="echarts-wrap" id="FZFXEchartsId"></div>
<div id="FZFXEchartsId" class="echarts-wrap" />
</div>
</template>
<script>
import * as echarts from 'echarts';
import { getFiveSchoolTotalCount } from '@/api/stuCQS/basedata/student.js';
import * as echarts from 'echarts'
import { getFiveSchoolTotalCount } from '@/api/stuCQS/basedata/student.js'
export default {
name: 'CenterBottom',
components: {},
@@ -22,17 +22,27 @@ export default {
chartInstance: null
}
},
mounted() {
this.initChart()
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
methods: {
async initChart() {
let label=[];
let value=[];
this.chartInstance = echarts.init(document.getElementById('FZFXEchartsId'));
let res =await getFiveSchoolTotalCount();
let label=[]
let value=[]
this.chartInstance = echarts.init(document.getElementById('FZFXEchartsId'))
let res =await getFiveSchoolTotalCount()
if (res.code == 200) {
let data = [...res.data];
let data = [...res.data]
data.forEach(item=>{
label.push(item.gradeCode);
value.push(item.number);
label.push(item.gradeCode)
value.push(item.number)
})
}
// let label = [2020, 2021, 2022, 2023, 2024];
@@ -177,7 +187,7 @@ export default {
data: value,
},
],
};
}
this.chartInstance && this.chartInstance.setOption(option)
},
handleResize() {
@@ -186,16 +196,6 @@ export default {
}
}
},
mounted() {
this.initChart();
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize)
if (this.chartInstance) {
this.chartInstance.dispose()
}
},
}
</script>

134
src/views/student_info/index.vue
View File

@@ -1,36 +1,36 @@
<template>
<div class="control-cabin-wrapper" ref="fullscreenElement">
<div class="header-container">学生管理驾驶舱</div>
<div ref="fullscreenElement" class="control-cabin-wrapper">
<div class="header-container">学生管理驾驶舱</div>
<div class="back-btn">
<img src="../../assets/controlCabinImages/dir_left.png" alt="">
<span @click="notFull">返回</span>
<div class="back-btn">
<img src="../../assets/controlCabinImages/dir_left.png" alt="">
<span @click="notFull">返回</span>
</div>
<div class="body-container">
<div class="body-left-container">
<ControlCabinLeft />
</div>
<div class="body-center-container">
<div class="body-center-top">
<CenterTop />
</div>
<div class="body-container">
<div class="body-left-container">
<ControlCabinLeft></ControlCabinLeft>
</div>
<div class="body-center-container">
<div class="body-center-top">
<CenterTop></CenterTop>
</div>
<div class="body-center-center">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>广西区图</p>
</div>
<div class="echarts-wrap">
<GuangxiMap></GuangxiMap>
</div>
</div>
<div class="body-center-bottom">
<CenterBottom></CenterBottom>
</div>
</div>
<div class="body-right-container">
<!-- <div class="r-select-con">
<div class="body-center-center">
<div class="sub-title">
<img src="@/assets/controlCabinImages/title_spot.png" alt="">
<p>广西区图</p>
</div>
<div class="echarts-wrap">
<GuangxiMap />
</div>
</div>
<div class="body-center-bottom">
<CenterBottom />
</div>
</div>
<div class="body-right-container">
<!-- <div class="r-select-con">
<img class="location-img" src="@/assets/imagesPage1/pic-location.png" />
<p class="select-t">学生搜索</p>
<div class="field-con" style="margin-right: 18rem;">
@@ -44,31 +44,31 @@
<img src="@/assets/imagesPage1/refrsh.png" />
</div>
</div> -->
<div class="body-right-dir-wrap">
<div class="title-flex-right">
<div class="title-bg title-right-backbg">
<div class="flex-center">
<p class="title-backbg-text">专业分布</p>
<img src="@/assets/controlCabinImages/title_remark.png" alt="">
</div>
</div>
</div>
<RightTop></RightTop>
</div>
<RightCenter></RightCenter>
<div class="title-flex-right">
<div class="title-bg title-right-backbg">
<div class="flex-center">
<p class="title-backbg-text">修改评价</p>
<img src="@/assets/controlCabinImages/title_remark.png" alt="">
</div>
</div>
</div>
<RightBottom></RightBottom>
<div class="body-right-dir-wrap">
<div class="title-flex-right">
<div class="title-bg title-right-backbg">
<div class="flex-center">
<p class="title-backbg-text">专业分布</p>
<img src="@/assets/controlCabinImages/title_remark.png" alt="">
</div>
</div>
</div>
<RightTop />
</div>
<div class="footer-container"></div>
<RightCenter />
<div class="title-flex-right">
<div class="title-bg title-right-backbg">
<div class="flex-center">
<p class="title-backbg-text">修改评价</p>
<img src="@/assets/controlCabinImages/title_remark.png" alt="">
</div>
</div>
</div>
<RightBottom />
</div>
</div>
<div class="footer-container" />
</div>
</template>
<script>
@@ -84,15 +84,15 @@
// 初始化执行
refreshRem()
// 监听窗口变化
window.addEventListener('resize', refreshRem);
})();
import ControlCabinLeft from '@/views/student_info/components/controlCabinLeft.vue';
import CenterTop from '@/views/student_info/components/center/CenterTop.vue';
import GuangxiMap from '@/views/student_info/components/center/GuangxiMap.vue';
import CenterBottom from '@/views/student_info/components/center/CenterBottom.vue';
import RightTop from '@/views/student_info/components/right/RightTop.vue';
import RightCenter from '@/views/student_info/components/right/RightCenter.vue';
import RightBottom from '@/views/student_info/components/right/RightBottom.vue';
window.addEventListener('resize', refreshRem)
})()
import ControlCabinLeft from '@/views/student_info/components/controlCabinLeft.vue'
import CenterTop from '@/views/student_info/components/center/CenterTop.vue'
import GuangxiMap from '@/views/student_info/components/center/GuangxiMap.vue'
import CenterBottom from '@/views/student_info/components/center/CenterBottom.vue'
import RightTop from '@/views/student_info/components/right/RightTop.vue'
import RightCenter from '@/views/student_info/components/right/RightCenter.vue'
import RightBottom from '@/views/student_info/components/right/RightBottom.vue'
export default {
name: 'ControlCabin',
components: {
@@ -113,18 +113,18 @@ export default {
},
mounted() {
this.doFull();
this.doFull()
},
methods: {
doFull() {
this.$store.dispatch('app/toggleSideBarHide', true);
document.querySelector('.navbar').style.display = "none";
document.querySelector('.tags-view-container').style.display = "none";
this.$store.dispatch('app/toggleSideBarHide', true)
document.querySelector('.navbar').style.display = 'none'
document.querySelector('.tags-view-container').style.display = 'none'
},
notFull() {
this.$store.dispatch('app/toggleSideBarHide', false);
document.querySelector('.navbar').style.display = "block";
document.querySelector('.tags-view-container').style.display = "block";
this.$store.dispatch('app/toggleSideBarHide', false)
document.querySelector('.navbar').style.display = 'block'
document.querySelector('.tags-view-container').style.display = 'block'
},
},
}