完善一下
This commit is contained in:
张宁
parent
0efc8516d1
commit
95b98b5fa1
|
|
@ -1,6 +1,14 @@
|
|||
/*
|
||||
* @Author: 张宁 18339727226@163.com
|
||||
* @Date: 2024-05-22 08:40:55
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-06-03 13:59:14
|
||||
* @FilePath: \welcome-system-screen\src\api\api.ts
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
/*
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-05-30 09:15:55
|
||||
* @LastEditTime: 2024-06-03 11:39:31
|
||||
*/
|
||||
import axios from "axios";
|
||||
import type { AxiosRequestConfig, AxiosResponse } from "axios";
|
||||
|
|
@ -51,19 +59,30 @@ axios.interceptors.response.use(
|
|||
if (response.status !== 200) {
|
||||
return Promise.reject(response);
|
||||
}
|
||||
|
||||
/**
|
||||
* @code 登录过期 token验证失败 根据后端调
|
||||
* @code 登录过期 token验证失败 根据后端调-----放错地方了？
|
||||
*/
|
||||
if (response.data.code == UtilVar.code) {
|
||||
/* if (response.data.code == UtilVar.code) {
|
||||
// router.push("/login")
|
||||
// window.location.href = 'http://nclg.yx.zheke.com/#/login';
|
||||
window.location.href = 'http://nclg.yx.zheke.com/#/login';
|
||||
|
||||
return Promise.resolve(response);
|
||||
}
|
||||
} */
|
||||
return Promise.resolve(response);
|
||||
},
|
||||
(error: any) => {
|
||||
console.log("error", error);
|
||||
/**
|
||||
* @code 登录过期 token验证失败 根据后端调
|
||||
*/
|
||||
if (error.response.status == UtilVar.code) {
|
||||
// router.push("/login")
|
||||
// 目前放测试地址 发布后放到正是地址---待修改
|
||||
window.location.href = 'http://nclg.yx.zheke.com/#/login';
|
||||
|
||||
return Promise.resolve(response);
|
||||
}
|
||||
let err = {
|
||||
success: false,
|
||||
msg: "未知异常，请联系管理员！",
|
||||
|
|
|
|||
|
|
@ -2,135 +2,130 @@
|
|||
<div id="chart" style="width: 150%;height: 150%;">
|
||||
|
||||
</div>
|
||||
<!-- <v-chart class="chart" :option="option" /> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup lang="ts" name="chart">
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
name: 'chart',
|
||||
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
};
|
||||
},
|
||||
const myChart = ref(null)
|
||||
const chartMax = ref(null)
|
||||
const chartValues = ref(null)
|
||||
const chartRate = ref(null)
|
||||
|
||||
mounted() {
|
||||
// window.addEventListener('resize',()=>{this.resize();getRem(1920,100)})
|
||||
this.init()
|
||||
},
|
||||
beforeDestroy() {
|
||||
// window.removeEventListener('resize',this.resize)
|
||||
},
|
||||
methods: {
|
||||
// resize(){
|
||||
// this.myChart.resize();
|
||||
// },
|
||||
init(max, value) {
|
||||
var max = max?max:100;
|
||||
var value = value?value:0;
|
||||
var rate = 0
|
||||
onMounted(() => {
|
||||
// window.addEventListener('resize',()=>{this.resize();getRem(1920,100)})
|
||||
// init()
|
||||
var chartDom = document.getElementById('chart');
|
||||
myChart.value = echarts.init(chartDom);
|
||||
})
|
||||
onBeforeUnmount(() => {
|
||||
// window.removeEventListener('resize',this.resize)
|
||||
|
||||
if (max && value) {
|
||||
rate = (value / max * 100).toFixed(1)
|
||||
}
|
||||
if (rate === "100.0") {
|
||||
rate = "100"; // 如果百分比等于100，则更新为整数形式
|
||||
}
|
||||
var chartDom = document.getElementById('chart');
|
||||
this.myChart = echarts.init(chartDom);
|
||||
// window.onresize = this.myChart.resize;
|
||||
var option;
|
||||
})
|
||||
const resize = () => {
|
||||
myChart.resize();
|
||||
}
|
||||
const init = (max, value) => {
|
||||
chartMax.value = max ? max : 100;
|
||||
chartValues.value = value ? value : 0;
|
||||
chartRate.value = 0
|
||||
if (chartMax && chartValues) {
|
||||
chartRate.value = (chartValues.value / chartMax.value * 100).toFixed(1)
|
||||
}
|
||||
if (chartRate.value === "100.0") {
|
||||
chartRate.value = "100"; // 如果百分比等于100，则更新为整数形式
|
||||
}
|
||||
let option = {
|
||||
title: {
|
||||
text: (chartRate.value || '0.0') + '%',
|
||||
x: 'center',
|
||||
y: '20%',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: '18',
|
||||
fontWeight: '600',
|
||||
fontFamily: 'YouSheBiaoTiHei'
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
angleAxis: {
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
min: 0,
|
||||
max: chartMax.value,
|
||||
startAngle: 60,
|
||||
},
|
||||
radiusAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
polar: {
|
||||
radius: ['40%', '65%'],
|
||||
center: ['50%', '30%'],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: [{ name: '预报到填写报到人数', value: chartValues.value }],
|
||||
startAngle: 225,
|
||||
z: 1,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: 1,
|
||||
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
|
||||
offset: 0,
|
||||
color: '#5E7DCD'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: '#d81e48'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#db4238'
|
||||
}
|
||||
])
|
||||
},
|
||||
{
|
||||
type: 'bar',
|
||||
data: [chartMax.value],
|
||||
z: 0,
|
||||
silent: true,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: true,
|
||||
color: '#00214d',
|
||||
barGap: '-100%',
|
||||
},
|
||||
],
|
||||
}
|
||||
myChart.value.setOption(option);
|
||||
}
|
||||
|
||||
defineExpose({ init })
|
||||
|
||||
option = {
|
||||
title: {
|
||||
text: (rate || '0.0') + '%',
|
||||
x: 'center',
|
||||
y: '20%',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: '18',
|
||||
fontWeight: '600',
|
||||
fontFamily: 'YouSheBiaoTiHei'
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
angleAxis: {
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
min: 0,
|
||||
max: max,
|
||||
startAngle: 60,
|
||||
},
|
||||
radiusAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
polar: {
|
||||
radius: ['40%', '65%'],
|
||||
center: ['50%', '30%'],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: [{ name: '预报到填写报到人数', value: value }],
|
||||
startAngle: 225,
|
||||
z: 1,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: 1,
|
||||
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
|
||||
offset: 0,
|
||||
color: '#5E7DCD'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: '#d81e48'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#db4238'
|
||||
}
|
||||
])
|
||||
},
|
||||
{
|
||||
type: 'bar',
|
||||
data: [max],
|
||||
z: 0,
|
||||
silent: true,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: true,
|
||||
color: '#00214d',
|
||||
barGap: '-100%',
|
||||
},
|
||||
],
|
||||
};
|
||||
option && this.myChart.setOption(option);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -4,134 +4,120 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup lang="ts" name="pieChart">
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
name: 'pieChart',
|
||||
const myChart = ref(null)
|
||||
const chartMax = ref(null)
|
||||
const chartValues = ref(null)
|
||||
const chartRate = ref(null)
|
||||
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// window.addEventListener('resize',()=>{this.resize();getRem(1920,100)})
|
||||
this.init()
|
||||
},
|
||||
beforeDestroy() {
|
||||
// window.removeEventListener('resize',this.resize)
|
||||
},
|
||||
methods: {
|
||||
// resize(){
|
||||
// this.myChart.resize();
|
||||
// },
|
||||
init(max, value) {
|
||||
var max = max?max:100;
|
||||
var value = value?value:0;
|
||||
|
||||
var rate = 0
|
||||
|
||||
if (max && value) {
|
||||
rate = (value / max * 100).toFixed(1)
|
||||
}
|
||||
if (rate === "100.0") {
|
||||
rate = "100"; // 如果百分比等于100，则更新为整数形式
|
||||
}
|
||||
var chartDom = document.getElementById('pieChart');
|
||||
this.myChart = echarts.init(chartDom);
|
||||
// window.onresize = this.myChart.resize;
|
||||
var option;
|
||||
|
||||
option = {
|
||||
title: {
|
||||
text: (rate || '0.0') + '%',
|
||||
x: 'center',
|
||||
y: '20%',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: '18',
|
||||
fontWeight: '600',
|
||||
fontFamily: 'YouSheBiaoTiHei'
|
||||
},
|
||||
onMounted(() => {
|
||||
// window.addEventListener('resize',()=>{this.resize();getRem(1920,100)})
|
||||
var chartDom = document.getElementById('pieChart');
|
||||
myChart.value = echarts.init(chartDom);
|
||||
})
|
||||
// resize(){
|
||||
// this.myChart.resize();
|
||||
// },
|
||||
const init=(max, value) =>{
|
||||
|
||||
chartMax.value = max ? max : 100;
|
||||
chartValues.value = value ? value : 0;
|
||||
if (chartMax && chartValues) {
|
||||
chartRate.value = (chartValues.value / chartMax.value * 100).toFixed(1)
|
||||
}
|
||||
if (chartRate.value === "100.0") {
|
||||
chartRate.value = "100"; // 如果百分比等于100，则更新为整数形式
|
||||
}
|
||||
|
||||
let option = {
|
||||
title: {
|
||||
text: (chartRate.value || '0.0') + '%',
|
||||
x: 'center',
|
||||
y: '20%',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: '18',
|
||||
fontWeight: '600',
|
||||
fontFamily: 'YouSheBiaoTiHei'
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
angleAxis: {
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
min: 0,
|
||||
max: chartMax.value,
|
||||
startAngle: 60,
|
||||
},
|
||||
radiusAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
polar: {
|
||||
radius: ['40%', '65%'],
|
||||
center: ['50%', '30%'],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: [{ name: '预报到填写报到人数', value: chartValues.value }],
|
||||
startAngle: 225,
|
||||
z: 1,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: 1,
|
||||
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
|
||||
offset: 0,
|
||||
color: '#5E7DCD'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
{
|
||||
offset: 0.5,
|
||||
color: '#d81e48'
|
||||
},
|
||||
angleAxis: {
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
min: 0,
|
||||
max: max,
|
||||
startAngle: 60,
|
||||
},
|
||||
radiusAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
polar: {
|
||||
radius: ['40%', '65%'],
|
||||
center: ['50%', '30%'],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: [{ name: '预报到填写人数', value: value }],
|
||||
startAngle: 225,
|
||||
z: 1,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: 1,
|
||||
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
|
||||
offset: 0,
|
||||
color: '#5E7DCD'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: '#d81e48'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#db4238'
|
||||
}
|
||||
])
|
||||
},
|
||||
{
|
||||
type: 'bar',
|
||||
data: [max],
|
||||
z: 0,
|
||||
silent: true,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: true,
|
||||
color: '#00214d',
|
||||
barGap: '-100%',
|
||||
},
|
||||
],
|
||||
};
|
||||
option && this.myChart.setOption(option);
|
||||
}
|
||||
},
|
||||
};
|
||||
{
|
||||
offset: 1,
|
||||
color: '#db4238'
|
||||
}
|
||||
])
|
||||
},
|
||||
{
|
||||
type: 'bar',
|
||||
data: [chartMax.value],
|
||||
z: 0,
|
||||
silent: true,
|
||||
coordinateSystem: 'polar',
|
||||
barMaxWidth: 35,
|
||||
roundCap: true,
|
||||
color: '#00214d',
|
||||
barGap: '-100%',
|
||||
},
|
||||
],
|
||||
}
|
||||
option && myChart.value.setOption(option);
|
||||
}
|
||||
defineExpose({init})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -3,13 +3,18 @@ interface UtilVarType {
|
|||
code:string|number,
|
||||
noContentCode:number,
|
||||
ENC:boolean,//是否进行加密
|
||||
errCode:string|number,
|
||||
notAllow:string|number
|
||||
}
|
||||
|
||||
// 这里放的是测试地址，发布后改为正式地址 ---- 待修改
|
||||
const UtilVar:UtilVarType = {
|
||||
baseUrl:"http://api.nclg.yx.zheke.com",
|
||||
code:401, //登陆过期
|
||||
noContentCode:204, //请求成功但没有内容
|
||||
ENC:false,
|
||||
errCode:'ERR_BAD_REQUEST',
|
||||
notAllow:403
|
||||
|
||||
|
||||
}
|
||||
const runtimeType:any = {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: 张宁 18339727226@163.com
|
||||
* @Date: 2024-05-27 08:45:53
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-05-31 16:39:38
|
||||
* @LastEditTime: 2024-06-04 09:34:13
|
||||
* @FilePath: \welcome-system-screen\src\stores\time\time.ts
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
|
|
@ -34,6 +34,14 @@ export const useDataStore = defineStore("data", () => {
|
|||
const today=computed(() => allData.value.today);
|
||||
const totalDto=computed(() => allData.value.totalDto);
|
||||
|
||||
// 当日预报到报到率
|
||||
const forecastRate = computed(() => {
|
||||
forecast.value.reported / forecast.value.total
|
||||
});
|
||||
// 当日预报到总人数报到率
|
||||
const totalRate = computed(() => {
|
||||
totalDto.value.reportNumber / totalDto.value.totalNumber
|
||||
});
|
||||
|
||||
// 选中的学院id
|
||||
const collageId = ref()
|
||||
|
|
@ -70,5 +78,5 @@ export const useDataStore = defineStore("data", () => {
|
|||
};
|
||||
|
||||
|
||||
return { allData,degreeDto,forecast,forecastFill,nationStudent,payDto,provinceDto,rankingDto,sexDto,today,totalDto,setData,bkPay,zkPay,zsbPay,setBkPay,setZkPay,setZsbPay,setCollageId,collageId,professionRank,setProfessionRank};
|
||||
return { allData,degreeDto,forecast,forecastFill,nationStudent,payDto,provinceDto,rankingDto,sexDto,today,totalDto,setData,bkPay,zkPay,zsbPay,setBkPay,setZkPay,setZsbPay,setCollageId,collageId,professionRank,setProfessionRank,forecastRate,totalRate};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: 张宁 18339727226@163.com
|
||||
* @Date: 2024-05-27 08:45:53
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-05-31 15:32:52
|
||||
* @LastEditTime: 2024-06-03 09:15:30
|
||||
* @FilePath: \welcome-system-screen\src\stores\time\time.ts
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
|
|
@ -35,15 +35,15 @@ export const useTimeStore = defineStore("time", () => {
|
|||
}
|
||||
// 根据年、月、日的切换，展示不同的标题 --- 具体问问产品怎么展示 -----待修改
|
||||
const computDate = computed(() => {
|
||||
let dates = '今日'
|
||||
let dates = '当日'
|
||||
if (years.value) {
|
||||
dates = years.value + '年'
|
||||
if (months.value) {
|
||||
dates += months.value + '月'
|
||||
}if (days.value) {
|
||||
dates = '当日'
|
||||
}
|
||||
} else {
|
||||
dates = '今日'
|
||||
}
|
||||
}
|
||||
return dates
|
||||
})
|
||||
const nowTitle = computed(() => {
|
||||
|
|
@ -52,9 +52,9 @@ export const useTimeStore = defineStore("time", () => {
|
|||
titles = '当年'
|
||||
if(months.value) {
|
||||
titles = '当月'
|
||||
}if (days.value) {
|
||||
titles = '当日'
|
||||
}
|
||||
}else{
|
||||
titles = '当日'
|
||||
}
|
||||
return titles
|
||||
})
|
||||
|
|
|
|||
|
|
@ -57,10 +57,10 @@ const myDate = ref({
|
|||
// 获取选择的日期（年 || 月 ||日）
|
||||
const getDate = (val: any) => {
|
||||
myDate.value = val
|
||||
/* // 根据年、月、日的切换，展示不同的标题 --- 具体问问产品怎么展示 -----待修改
|
||||
// 根据年、月、日的切换，展示不同的标题 --- 具体问问产品怎么展示 -----待修改
|
||||
timeStore.setYears(val.year)
|
||||
timeStore.setMounths(val.month)
|
||||
timeStore.setDays(val.day) */
|
||||
timeStore.setDays(val.day)
|
||||
let params = {
|
||||
"Year":val.year || void 0,
|
||||
"Month":val.month || void 0,
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: 张宁 18339727226@163.com
|
||||
* @Date: 2024-05-22 08:40:56
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-05-31 14:53:27
|
||||
* @LastEditTime: 2024-06-04 09:34:34
|
||||
* @FilePath: \welcome-system-screen\src\views\index\center-top.vue
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
-->
|
||||
|
|
@ -13,7 +13,7 @@ const { computDate } = storeToRefs(timeStore)
|
|||
import { ElMessage } from "element-plus";
|
||||
import { useDataStore } from "@/stores/index";
|
||||
const dataStore = useDataStore();
|
||||
const { today } = storeToRefs(dataStore)
|
||||
const { today, forecastRate,totalRate } = storeToRefs(dataStore)
|
||||
|
||||
</script>
|
||||
|
||||
|
|
@ -25,17 +25,17 @@ const { today } = storeToRefs(dataStore)
|
|||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title">{{ computDate }}迎新人数</div>
|
||||
<div class="top-item-content">{{ today.nowStuden??'-' }}</div>
|
||||
<div class="top-item-content">{{ today.nowStuden ?? '0' }}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title">{{ computDate }}预报到人数</div>
|
||||
<div class="top-item-content">{{ today.forecastStuden??'-' }}</div>
|
||||
<div class="top-item-content">{{ today.forecastStuden ?? '0' }}</div>
|
||||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title">{{ computDate }}预报到报到率</div>
|
||||
<div class="top-item-content"> 95% </div>
|
||||
<div class="top-item-content"> {{ forecastRate ?? '0' }}% </div>
|
||||
</div>
|
||||
<div class="top-item-img">
|
||||
<div class="top-item-icon">
|
||||
|
|
@ -43,7 +43,7 @@ const { today } = storeToRefs(dataStore)
|
|||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title">预报到总人数报到率</div>
|
||||
<div class="top-item-content"> 95% </div>
|
||||
<div class="top-item-content"> {{totalRate ?? '0'}}% </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -21,15 +21,15 @@ import { useDataStore } from "@/stores/index";
|
|||
const dataStore = useDataStore();
|
||||
const { allData, rankingDto, collageId, professionRank } = storeToRefs(dataStore)
|
||||
|
||||
const rightCenterRef = ref(null)
|
||||
const rightCenterRef: any = ref(null)
|
||||
|
||||
const mapRef = ref(null)
|
||||
const mapRef: any = ref(null)
|
||||
const tableData = ref()
|
||||
const showRight = ref(true)
|
||||
const changeRight = () => {
|
||||
showRight.value = !showRight.value
|
||||
if (!showRight.value && rbtwoRef) {
|
||||
setTimeout(()=>{
|
||||
setTimeout(() => {
|
||||
rbtwoRef.value.getData(professionRank.value)
|
||||
|
||||
})
|
||||
|
|
@ -77,7 +77,7 @@ const divideAndFormat = (divisor: any, dividend: any) => {
|
|||
let result = (divisor / dividend) * 100;
|
||||
return result.toFixed(1) + "%";
|
||||
}
|
||||
const rbtwoRef = ref(null)
|
||||
const rbtwoRef: any = ref(null)
|
||||
const getProfession = () => {
|
||||
let params = {
|
||||
"id": collageId.value
|
||||
|
|
@ -102,7 +102,12 @@ watch(collageId, () => {
|
|||
* @return {*}
|
||||
*/
|
||||
const getAdminPCIndex = () => {
|
||||
AdminPCIndex().then((res: any) => {
|
||||
let params = {
|
||||
"Year": years.value,
|
||||
"Month": months.value,
|
||||
"Day": days.value
|
||||
}
|
||||
AdminPCIndex(params).then((res: any) => {
|
||||
dataStore.setData(res.data);
|
||||
dataStore.setCollageId(res.data.rankingDto[0].collegeId)
|
||||
dealMapData(res.data)
|
||||
|
|
@ -151,11 +156,21 @@ const payData = () => {
|
|||
});
|
||||
|
||||
}
|
||||
|
||||
const timer: any = ref(null)
|
||||
const startTimer = () => {
|
||||
timer.value = setInterval(() => {
|
||||
getAdminPCIndex();
|
||||
payData();
|
||||
}, 60000)
|
||||
}
|
||||
const clearTimer = () => {
|
||||
clearInterval(timer.value)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getAdminPCIndex();
|
||||
payData();
|
||||
startTimer()
|
||||
});
|
||||
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: 张宁 18339727226@163.com
|
||||
* @Date: 2024-05-23 20:42:55
|
||||
* @LastEditors: 张宁 18339727226@163.com
|
||||
* @LastEditTime: 2024-05-30 13:49:47
|
||||
* @LastEditTime: 2024-06-03 15:28:11
|
||||
* @FilePath: \welcome-system-screen\src\views\index\left-bottom.vue
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
-->
|
||||
|
|
@ -13,14 +13,26 @@ const {forecast,forecastFill} = storeToRefs(dataStore)
|
|||
|
||||
const chartRef = ref(null)
|
||||
const pieChartRef = ref(null)
|
||||
onMounted(()=>{
|
||||
watch(forecast,()=>{
|
||||
if (chartRef) {
|
||||
chartRef.value.init(forecast.value.total,forecast.value.reported)
|
||||
}
|
||||
},{
|
||||
deep:true,
|
||||
})
|
||||
watch(forecastFill,()=>{
|
||||
if (pieChartRef) {
|
||||
pieChartRef.value.init(forecastFill.value.total,forecastFill.value.reported)
|
||||
}
|
||||
})
|
||||
onMounted(()=>{
|
||||
// if (chartRef) {
|
||||
// chartRef.value.init(forecast.value.total,forecast.value.reported)
|
||||
// }
|
||||
// if (pieChartRef) {
|
||||
// pieChartRef.value.init(forecastFill.value.total,forecastFill.value.reported)
|
||||
// }
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -43,7 +55,7 @@ onMounted(()=>{
|
|||
<div class="content">
|
||||
<div class="title">预报到填写率</div>
|
||||
<div class="right-content">
|
||||
<pieChart ref="pieChartRef"></pieChart>
|
||||
<PieChart ref="pieChartRef"></PieChart>
|
||||
</div>
|
||||
<div class="bottom-title">
|
||||
<div class="icons"></div>
|
||||
|
|
|
|||
|
|
@ -39,14 +39,14 @@ const zsbRate = computed(() => {
|
|||
<div class="content-left">
|
||||
<div class="content-title title-top">统招本科</div>
|
||||
<p class="item-title">统招本科总人数</p>
|
||||
<p class="item-content">{{ degreeDto[2]?degreeDto[2].studentNumber:'-' }}</p>
|
||||
<p class="item-content">{{ degreeDto[2]?degreeDto[2].studentNumber:'0' }}</p>
|
||||
</div>
|
||||
<div class="content-right">
|
||||
<div class="right-title title-top item-title">报到率
|
||||
<span class="title-num numBlue">{{ isNaN(bkRate) ? '-' : bkRate }}%</span>
|
||||
<span class="title-num numBlue">{{ isNaN(bkRate) ? '0' : bkRate }}%</span>
|
||||
</div>
|
||||
<p class="item-title">今日报到人数</p>
|
||||
<p class="item-content numBlue">{{ degreeDto[2]?degreeDto[2].reportNumber:'-' }}</p>
|
||||
<p class="item-content numBlue">{{ degreeDto[2]?degreeDto[2].reportNumber:'0' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -59,14 +59,14 @@ const zsbRate = computed(() => {
|
|||
<div class="content-left">
|
||||
<div class="content-title title-top tGreen">统招专科</div>
|
||||
<p class="item-title">统招专科总人数</p>
|
||||
<p class="item-content">{{ degreeDto[0]?degreeDto[0].studentNumber:'-' }}</p>
|
||||
<p class="item-content">{{ degreeDto[0]?degreeDto[0].studentNumber:'0' }}</p>
|
||||
</div>
|
||||
<div class="content-right">
|
||||
<div class="right-title title-top item-title">报到率
|
||||
<span class="title-num numGreen">{{ isNaN(zkRate) ? '-' : zkRate }}%</span>
|
||||
<span class="title-num numGreen">{{ isNaN(zkRate) ? '0' : zkRate }}%</span>
|
||||
</div>
|
||||
<p class="item-title">今日报到人数</p>
|
||||
<p class="item-content numGreen">{{ degreeDto[0]?degreeDto[0].reportNumber:'-' }}</p>
|
||||
<p class="item-content numGreen">{{ degreeDto[0]?degreeDto[0].reportNumber:'0' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -79,14 +79,14 @@ const zsbRate = computed(() => {
|
|||
<div class="content-left">
|
||||
<div class="content-title title-top tGray">统招专升本</div>
|
||||
<p class="item-title">统招专升本总人数</p>
|
||||
<p class="item-content">{{ degreeDto[1]?degreeDto[1].studentNumber:'-' }}</p>
|
||||
<p class="item-content">{{ degreeDto[1]?degreeDto[1].studentNumber:'0' }}</p>
|
||||
</div>
|
||||
<div class="content-right">
|
||||
<div class="right-title title-top item-title">报到率
|
||||
<span class="title-num numGrey">{{ isNaN(zsbRate) ? '-' : zsbRate }}%</span>
|
||||
<span class="title-num numGrey">{{ isNaN(zsbRate) ? '0' : zsbRate }}%</span>
|
||||
</div>
|
||||
<p class="item-title">今日报到人数</p>
|
||||
<p class="item-content numGrey">{{ degreeDto[1]?degreeDto[1].reportNumber:'-' }}</p>
|
||||
<p class="item-content numGrey">{{ degreeDto[1]?degreeDto[1].reportNumber:'0' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ const progress = computed(() => {
|
|||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title">已报到人数</div>
|
||||
<div class="top-item-content">{{ totalDto.reportNumber ?? '-' }}</div>
|
||||
<div class="top-item-content">{{ totalDto.reportNumber ?? '0' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="top-item-img">
|
||||
|
|
@ -32,22 +32,22 @@ const progress = computed(() => {
|
|||
</div>
|
||||
<div class="top-item">
|
||||
<div class="top-item-title title-red">未报到人数</div>
|
||||
<div class="top-item-content content-red"> {{ totalDto.notReportNumber ?? '-' }} </div>
|
||||
<div class="top-item-content content-red"> {{ totalDto.notReportNumber ?? '0' }} </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-bottom">
|
||||
<div class="bottom-item">
|
||||
<div class="bottom-item-title">预报到总人数</div>
|
||||
<div class="bottom-item-content"> {{ isNaN(totalReport) ? '-' : totalReport }} </div>
|
||||
<div class="bottom-item-content"> {{ isNaN(totalReport) ? '0' : totalReport }} </div>
|
||||
</div>
|
||||
<div class="bottom-item">
|
||||
<div class="bottom-item-title">录取总人数</div>
|
||||
<div class="bottom-item-content"> {{ totalDto.totalNumber ?? '-' }} </div>
|
||||
<div class="bottom-item-content"> {{ totalDto.totalNumber ?? '0' }} </div>
|
||||
</div>
|
||||
<div class="bottom-item">
|
||||
<div class="bottom-item-title">迎新总进度</div>
|
||||
<div class="bottom-item-content"> {{ isNaN(progress) ? '-' : progress}}% </div>
|
||||
<div class="bottom-item-content"> {{ isNaN(progress) ? '0' : progress}}% </div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue