首页背景更改
This commit is contained in:
parent
19eea09a79
commit
eace5c5917
BIN
web/src/assets/login/index.jpg
Normal file
BIN
web/src/assets/login/index.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 452 KiB |
BIN
web/src/assets/login/index.png
Normal file
BIN
web/src/assets/login/index.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 723 KiB |
@ -6,626 +6,28 @@ export default {
|
||||
}
|
||||
</script>
|
||||
<script setup lang="ts">
|
||||
import { Refresh } from '@element-plus/icons-vue'
|
||||
import * as echarts from 'echarts'
|
||||
import { onMounted, ref, nextTick,markRaw,onUnmounted,watch } from "vue";
|
||||
import { useDark } from '@vueuse/core'
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
const userStore = useUserStore();
|
||||
const title = userStore.title;
|
||||
|
||||
const option = ref({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: '1%',
|
||||
right: '1%',
|
||||
bottom: '0%',
|
||||
top:'7%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['2021-1', '2021-4', '2022-1', '2022-4', '2022-8', '2023-1'],
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
splitLine:{
|
||||
lineStyle: {
|
||||
color: '#E0E6F1'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110],
|
||||
type: 'bar',
|
||||
barWidth: 18,
|
||||
name:'近视人数',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#49a2fe',
|
||||
}
|
||||
},
|
||||
}
|
||||
]
|
||||
})
|
||||
const option2 = ref({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: '1%',
|
||||
right: '1%',
|
||||
bottom: '0%',
|
||||
top:'7%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['2021-1', '2021-4', '2022-1', '2022-4', '2022-8', '2023-1'],
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
splitLine:{
|
||||
lineStyle: {
|
||||
color: '#E0E6F1'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [150, 230, 224, 218, 135, 147, 260],
|
||||
type: 'line',
|
||||
name:'近视人数',
|
||||
symbol:'circle',
|
||||
symbolSize:6,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#49a2fe',
|
||||
}
|
||||
},
|
||||
}
|
||||
]
|
||||
})
|
||||
const option3 = ref({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999',
|
||||
},
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: '1%',
|
||||
right: '4%',
|
||||
bottom: '0%',
|
||||
top:'7%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'value',
|
||||
data: ['2021-1', '2021-4', '2022-1', '2022-4', '2022-8', '2023-1'],
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
},
|
||||
splitLine:{
|
||||
lineStyle: {
|
||||
color: '#E0E6F1'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
axisLabel:{
|
||||
color:'#787878'
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [150, 230, 224, 218, 135, 147, 260],
|
||||
type: 'bar',
|
||||
name:'近视人数',
|
||||
barWidth: 18,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#49a2fe',
|
||||
}
|
||||
},
|
||||
}
|
||||
]
|
||||
})
|
||||
const option4 = ref({
|
||||
// tooltip: {
|
||||
// trigger: "axis",
|
||||
// },
|
||||
grid: {
|
||||
top: "2%",
|
||||
bottom: "2%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
data: ["男生", "女生"],
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
max: 100,
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
// 刻度线
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
// 轴线
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
// 轴坐标文字
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "比例",
|
||||
type: "pictorialBar",
|
||||
symbolClip: true,
|
||||
symbolBoundingData: 100,
|
||||
label: '',
|
||||
data: [
|
||||
{
|
||||
value: 42,
|
||||
symbol: 'path://M18.2629891,11.7131596 L6.8091608,11.7131596 C1.6685112,11.7131596 0,13.032145 0,18.6237673 L0,34.9928467 C0,38.1719847 4.28388932,38.1719847 4.28388932,34.9928467 L4.65591984,20.0216948 L5.74941883,20.0216948 L5.74941883,61.000787 C5.74941883,65.2508314 11.5891201,65.1268798 11.5891201,61.000787 L11.9611506,37.2137775 L13.1110872,37.2137775 L13.4831177,61.000787 C13.4831177,65.1268798 19.3114787,65.2508314 19.3114787,61.000787 L19.3114787,20.0216948 L20.4162301,20.0216948 L20.7882606,34.9928467 C20.7882606,38.1719847 25.0721499,38.1719847 25.0721499,34.9928467 L25.0721499,18.6237673 C25.0721499,13.032145 23.4038145,11.7131596 18.2629891,11.7131596 M12.5361629,1.11022302e-13 C15.4784742,1.11022302e-13 17.8684539,2.38997966 17.8684539,5.33237894 C17.8684539,8.27469031 15.4784742,10.66467 12.5361629,10.66467 C9.59376358,10.66467 7.20378392,8.27469031 7.20378392,5.33237894 C7.20378392,2.38997966 9.59376358,1.11022302e-13 12.5361629,1.11022302e-13',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(64,158,255)", //单独控制颜色
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
value: 58,
|
||||
symbol: 'path://M28.9624207,31.5315864 L24.4142575,16.4793596 C23.5227152,13.8063773 20.8817445,11.7111088 17.0107398,11.7111088 L12.112691,11.7111088 C8.24168636,11.7111088 5.60080331,13.8064652 4.70917331,16.4793596 L0.149791395,31.5315864 C-0.786976655,34.7595013 2.9373074,35.9147532 3.9192135,32.890727 L8.72689855,19.1296485 L9.2799493,19.1296485 C9.2799493,19.1296485 2.95992025,43.7750224 2.70031069,44.6924335 C2.56498417,45.1567684 2.74553639,45.4852068 3.24205501,45.4852068 L8.704461,45.4852068 L8.704461,61.6700801 C8.704461,64.9659872 13.625035,64.9659872 13.625035,61.6700801 L13.625035,45.360657 L15.5097899,45.360657 L15.4984835,61.6700801 C15.4984835,64.9659872 20.4191451,64.9659872 20.4191451,61.6700801 L20.4191451,45.4852068 L25.8814635,45.4852068 C26.3667633,45.4852068 26.5586219,45.1567684 26.4345142,44.6924335 C26.1636859,43.7750224 19.8436568,19.1296485 19.8436568,19.1296485 L20.3966199,19.1296485 L25.2043926,32.890727 C26.1862111,35.9147532 29.9105828,34.7595013 28.9625083,31.5315864 L28.9624207,31.5315864 Z M14.5617154,0 C17.4960397,0 19.8773132,2.3898427 19.8773132,5.33453001 C19.8773132,8.27930527 17.4960397,10.66906 14.5617154,10.66906 C11.6274788,10.66906 9.24611767,8.27930527 9.24611767,5.33453001 C9.24611767,2.3898427 11.6274788,0 14.5617154,0 L14.5617154,0 Z',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(255,153,0)", //单独控制颜色
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
// z: 10,
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
type: "pictorialBar",
|
||||
symbolClip: true,
|
||||
symbolBoundingData: 100,
|
||||
label: '',
|
||||
data: [],
|
||||
z: 10,
|
||||
},
|
||||
{
|
||||
// 设置背景底色，不同的情况用这个
|
||||
name: "人数",
|
||||
type: "pictorialBar", //异型柱状图 图片、SVG PathData
|
||||
symbolBoundingData: 100,
|
||||
animationDuration: 0,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#ccc", //设置全部颜色，统一设置
|
||||
},
|
||||
},
|
||||
z: 10,
|
||||
data: [
|
||||
{
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(64,158,255,0.40)", //单独控制颜色
|
||||
},
|
||||
},
|
||||
value: 100,
|
||||
symbol: 'path://M18.2629891,11.7131596 L6.8091608,11.7131596 C1.6685112,11.7131596 0,13.032145 0,18.6237673 L0,34.9928467 C0,38.1719847 4.28388932,38.1719847 4.28388932,34.9928467 L4.65591984,20.0216948 L5.74941883,20.0216948 L5.74941883,61.000787 C5.74941883,65.2508314 11.5891201,65.1268798 11.5891201,61.000787 L11.9611506,37.2137775 L13.1110872,37.2137775 L13.4831177,61.000787 C13.4831177,65.1268798 19.3114787,65.2508314 19.3114787,61.000787 L19.3114787,20.0216948 L20.4162301,20.0216948 L20.7882606,34.9928467 C20.7882606,38.1719847 25.0721499,38.1719847 25.0721499,34.9928467 L25.0721499,18.6237673 C25.0721499,13.032145 23.4038145,11.7131596 18.2629891,11.7131596 M12.5361629,1.11022302e-13 C15.4784742,1.11022302e-13 17.8684539,2.38997966 17.8684539,5.33237894 C17.8684539,8.27469031 15.4784742,10.66467 12.5361629,10.66467 C9.59376358,10.66467 7.20378392,8.27469031 7.20378392,5.33237894 C7.20378392,2.38997966 9.59376358,1.11022302e-13 12.5361629,1.11022302e-13',
|
||||
},
|
||||
{
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(255,153,0,0.40)", //单独控制颜色
|
||||
},
|
||||
},
|
||||
value: 100,
|
||||
symbol: 'path://M28.9624207,31.5315864 L24.4142575,16.4793596 C23.5227152,13.8063773 20.8817445,11.7111088 17.0107398,11.7111088 L12.112691,11.7111088 C8.24168636,11.7111088 5.60080331,13.8064652 4.70917331,16.4793596 L0.149791395,31.5315864 C-0.786976655,34.7595013 2.9373074,35.9147532 3.9192135,32.890727 L8.72689855,19.1296485 L9.2799493,19.1296485 C9.2799493,19.1296485 2.95992025,43.7750224 2.70031069,44.6924335 C2.56498417,45.1567684 2.74553639,45.4852068 3.24205501,45.4852068 L8.704461,45.4852068 L8.704461,61.6700801 C8.704461,64.9659872 13.625035,64.9659872 13.625035,61.6700801 L13.625035,45.360657 L15.5097899,45.360657 L15.4984835,61.6700801 C15.4984835,64.9659872 20.4191451,64.9659872 20.4191451,61.6700801 L20.4191451,45.4852068 L25.8814635,45.4852068 C26.3667633,45.4852068 26.5586219,45.1567684 26.4345142,44.6924335 C26.1636859,43.7750224 19.8436568,19.1296485 19.8436568,19.1296485 L20.3966199,19.1296485 L25.2043926,32.890727 C26.1862111,35.9147532 29.9105828,34.7595013 28.9625083,31.5315864 L28.9624207,31.5315864 Z M14.5617154,0 C17.4960397,0 19.8773132,2.3898427 19.8773132,5.33453001 C19.8773132,8.27930527 17.4960397,10.66906 14.5617154,10.66906 C11.6274788,10.66906 9.24611767,8.27930527 9.24611767,5.33453001 C9.24611767,2.3898427 11.6274788,0 14.5617154,0 L14.5617154,0 Z',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
})
|
||||
const option5 = ref({
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
right: 'right',
|
||||
icon: 'circle',
|
||||
itemWidth: 10,
|
||||
itemHeight: 10,
|
||||
itemGap: 10,
|
||||
textStyle:{
|
||||
color:'#787878'
|
||||
},
|
||||
data: [
|
||||
'小学一年级',
|
||||
'小学二年级',
|
||||
'小学三年级',
|
||||
'小学四年级',
|
||||
'小学五年级',
|
||||
'小学六年级',
|
||||
'初中一年级',
|
||||
'初中二年级',
|
||||
'初中三年级',
|
||||
'初中四年级',
|
||||
'高中一年级',
|
||||
'高中二年级',
|
||||
'高中三年级'
|
||||
]
|
||||
},
|
||||
color:['#6395fa','#63daab','#8babd8','#f7c122','#7666fa','#75cbed','rgb(155,107,188)','rgb(255,157,79)','rgb(42,154,153)','rgb(255,158,198)','#6395fa','#63daab','#8babd8'],
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: '95%',
|
||||
center: ['34%', '50%'],
|
||||
avoidLabelOverlap: true,
|
||||
data: [
|
||||
{ value: 1048, name: '小学一年级' },
|
||||
{ value: 735, name: '小学二年级' },
|
||||
{ value: 580, name: '小学三年级' },
|
||||
{ value: 484, name: '小学四年级' },
|
||||
{ value: 300, name: '小学五年级' },
|
||||
{ value: 300, name: '小学六年级' },
|
||||
{ value: 300, name: '初中一年级' },
|
||||
{ value: 300, name: '初中二年级' },
|
||||
{ value: 300, name: '初中三年级' },
|
||||
{ value: 300, name: '初中四年级' },
|
||||
{ value: 300, name: '高中一年级' },
|
||||
{ value: 300, name: '高中二年级' },
|
||||
{ value: 300, name: '高中三年级' }
|
||||
],
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
color:'#000000',
|
||||
formatter: '{c}', // 格式化数值百分比输出
|
||||
},
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)',
|
||||
borderColor:'#000',
|
||||
borderWidth:0.5
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
const tableData:any = ref([{name:'某某某某某某某某学校',checknum:'10000',num:'2871'},{name:'某某某某某某某某学校',checknum:'10000',num:'2872'},{name:'某某某某某某某某学校',checknum:'10000',num:'2873'},{name:'某某某某某某某某学校',checknum:'10000',num:'2874'},{name:'某某某某某某某某学校',checknum:'10000',num:'2875'},{name:'某某某某某某某某学校',checknum:'10000',num:'2876'},{name:'某某某某某某某某学校',checknum:'10000',num:'2877'}])
|
||||
const dialogVisible = ref(false)
|
||||
const planData:any = ref([{planid:'1',plan_name:'某某某某某某计划名称',plan_year:'2033-1',plan_start_date:'2023-04-06',org_name:'11'},{panid:'2',plan_name:'某某某某某某计划名称',plan_year:'2033-1',plan_start_date:'2023-04-06',org_name:'11'}])
|
||||
const planyear = ref('')
|
||||
const planname = ref('')
|
||||
const planyearoptions = ref([{value:'2023-1'}])
|
||||
const currentplanid = ref('1')
|
||||
let timer:any = ref(null)
|
||||
let myTable:any = ref(null)
|
||||
let isDark:any = useDark().value == true? '1' : '2'
|
||||
watch(useDark(), () => {
|
||||
isDark = useDark().value == true? '1' : '2'
|
||||
if (useDark().value == true) {
|
||||
facechange('1')
|
||||
} else {
|
||||
facechange('2')
|
||||
}
|
||||
})
|
||||
const clearScroll = () => {
|
||||
clearInterval(timer.value)
|
||||
timer.value = null
|
||||
}
|
||||
const createScroll = () => {
|
||||
clearScroll()
|
||||
// 拿到 table
|
||||
const table = myTable.value.layout.table.refs
|
||||
// 拿到可以滚动的元素
|
||||
const tableWrapper = table.bodyWrapper.firstElementChild.firstElementChild
|
||||
|
||||
timer.value = setInterval(() => {
|
||||
tableWrapper.scrollTop += 1
|
||||
// 判断是否滚动到底部，如果到底部了置为0（可视高度+距离顶部=整个高度）
|
||||
if (tableWrapper.clientHeight + tableWrapper.scrollTop == tableWrapper.scrollHeight) {
|
||||
tableWrapper.scrollTop = 0
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
onMounted(() => {
|
||||
// echartsinit()
|
||||
// createScroll()
|
||||
// console.log(useDark().value,99)
|
||||
})
|
||||
onUnmounted(() => {
|
||||
// clearScroll()
|
||||
// if (myChart1.value) {
|
||||
// myChart1.value.dispose()
|
||||
// }
|
||||
// if (myChart2.value) {
|
||||
// myChart2.value.dispose()
|
||||
// }
|
||||
// if (myChart3.value) {
|
||||
// myChart3.value.dispose()
|
||||
// }
|
||||
// if (myChart4.value) {
|
||||
// myChart4.value.dispose()
|
||||
// }
|
||||
// if (myChart5.value) {
|
||||
// myChart5.value.dispose()
|
||||
// }
|
||||
// })
|
||||
// let myChart1:any = ref()
|
||||
// let myChart2:any = ref()
|
||||
// let myChart3:any = ref()
|
||||
// let myChart4:any = ref()
|
||||
// let myChart5:any = ref()
|
||||
// const labelSetting:any = ref(
|
||||
// {normal: {
|
||||
// show: true,
|
||||
// position: "bottom",
|
||||
// offset: [0, 10],
|
||||
// formatter: function (param:any) {
|
||||
// return param.value + "%";
|
||||
// },
|
||||
// textStyle: {
|
||||
// fontSize: 18,
|
||||
// fontFamily: "Arial",
|
||||
// color: "#ffffff",
|
||||
// },
|
||||
// }
|
||||
})
|
||||
//初始化echarts
|
||||
function echartsinit(){
|
||||
// if (isDark === '1') {
|
||||
// facechange('1')
|
||||
// }else{
|
||||
// facechange('2')
|
||||
// }
|
||||
// const chartEle: HTMLElement = document.getElementById('echarts1') as HTMLElement;
|
||||
// myChart1.value = markRaw(echarts.init(chartEle));
|
||||
// const chartEle2: HTMLElement = document.getElementById('echarts2') as HTMLElement;
|
||||
// myChart2.value = markRaw(echarts.init(chartEle2));
|
||||
// const chartEle3: HTMLElement = document.getElementById('echarts3') as HTMLElement;
|
||||
// myChart3.value = markRaw(echarts.init(chartEle3));
|
||||
// const chartEle4: HTMLElement = document.getElementById('echarts4') as HTMLElement;
|
||||
// myChart4.value = markRaw(echarts.init(chartEle4));
|
||||
// const chartEle5: HTMLElement = document.getElementById('echarts5') as HTMLElement;
|
||||
// myChart5.value = markRaw(echarts.init(chartEle5));
|
||||
// myChart1.value.setOption(option.value);
|
||||
// myChart2.value.setOption(option2.value);
|
||||
// myChart3.value.setOption(option3.value);
|
||||
// option4.value.series[0].label = labelSetting.value
|
||||
// option4.value.series[1].label = labelSetting.value
|
||||
// myChart4.value.setOption(option4.value);
|
||||
// myChart5.value.setOption(option5.value);
|
||||
|
||||
// window.onresize = function () {
|
||||
// myChart1.value.resize()
|
||||
// myChart2.value.resize()
|
||||
// myChart3.value.resize()
|
||||
// myChart4.value.resize()
|
||||
// myChart5.value.resize()
|
||||
// }
|
||||
}
|
||||
function facechange(type:any){
|
||||
if(type === '1'){
|
||||
option.value.xAxis.axisLabel.color = '#ffffff'
|
||||
option.value.yAxis.axisLabel.color = '#ffffff'
|
||||
option.value.yAxis.splitLine.lineStyle.color = '#4c4d4f'
|
||||
|
||||
option2.value.xAxis.axisLabel.color = '#ffffff'
|
||||
option2.value.yAxis.axisLabel.color = '#ffffff'
|
||||
option2.value.yAxis.splitLine.lineStyle.color = '#4c4d4f'
|
||||
|
||||
option3.value.xAxis.axisLabel.color = '#ffffff'
|
||||
option3.value.yAxis.axisLabel.color = '#ffffff'
|
||||
option3.value.xAxis.splitLine.lineStyle.color = '#4c4d4f'
|
||||
|
||||
option5.value.legend.textStyle.color = '#ffffff'
|
||||
option5.value.series[0].label.normal.color = '#ffffff'
|
||||
} else {
|
||||
option.value.xAxis.axisLabel.color = '#787878'
|
||||
option.value.yAxis.axisLabel.color = '#787878'
|
||||
option.value.yAxis.splitLine.lineStyle.color = '#E0E6F1'
|
||||
|
||||
option2.value.xAxis.axisLabel.color = '#787878'
|
||||
option2.value.yAxis.axisLabel.color = '#787878'
|
||||
option2.value.yAxis.splitLine.lineStyle.color = '#E0E6F1'
|
||||
|
||||
option3.value.xAxis.axisLabel.color = '#787878'
|
||||
option3.value.yAxis.axisLabel.color = '#787878'
|
||||
option3.value.xAxis.splitLine.lineStyle.color = '#E0E6F1'
|
||||
|
||||
option5.value.legend.textStyle.color = '#000000'
|
||||
option5.value.series[0].label.normal.color = '#000000'
|
||||
}
|
||||
// if (myChart1.value) {
|
||||
// myChart1.value.clear()
|
||||
// myChart1.value.setOption(option.value);
|
||||
// myChart1.value.resize()
|
||||
// }
|
||||
// if (myChart2.value) {
|
||||
// myChart2.value.clear()
|
||||
// myChart2.value.setOption(option2.value);
|
||||
// myChart2.value.resize()
|
||||
// }
|
||||
// if (myChart3.value) {
|
||||
// myChart3.value.clear()
|
||||
// myChart3.value.setOption(option3.value);
|
||||
// myChart3.value.resize()
|
||||
// }
|
||||
// if (myChart5.value) {
|
||||
// myChart5.value.clear()
|
||||
// myChart5.value.setOption(option5.value);
|
||||
// myChart5.value.resize()
|
||||
// }
|
||||
}
|
||||
//刷新
|
||||
function refreshdata(type:any){
|
||||
// if(type === '1'){
|
||||
// myChart1.value.clear()
|
||||
// myChart1.value.setOption(option.value);
|
||||
// myChart1.value.resize()
|
||||
// } else if(type === '2'){
|
||||
// myChart2.value.clear()
|
||||
// myChart2.value.setOption(option2.value);
|
||||
// myChart2.value.resize()
|
||||
// } else if(type === '3'){
|
||||
// myChart3.value.clear()
|
||||
// myChart3.value.setOption(option3.value);
|
||||
// myChart3.value.resize()
|
||||
// } else if(type === '4'){
|
||||
// // 表格数据
|
||||
// tableData.value = []
|
||||
// }else if(type === '5'){
|
||||
// myChart4.value.clear()
|
||||
// myChart4.value.setOption(option4.value);
|
||||
// myChart4.value.resize()
|
||||
// }else{
|
||||
// myChart5.value.clear()
|
||||
// myChart5.value.setOption(option5.value);
|
||||
// myChart5.value.resize()
|
||||
// }
|
||||
|
||||
}
|
||||
function handleClose(){
|
||||
dialogVisible.value = false
|
||||
}
|
||||
//选择普检按计划
|
||||
function chooseplan(){
|
||||
for(let i = 0;i<planData.value.length;i++) {
|
||||
planData.value[i].checked = false
|
||||
if (planData.value[i].planid === currentplanid.value) {
|
||||
planData.value[i].checked = true
|
||||
currentplanid.value = '1'
|
||||
}
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//搜索
|
||||
function searchinfo(){
|
||||
|
||||
}
|
||||
//勾选普检按计划
|
||||
function checkchange(index:any,e:any){
|
||||
if(e === false){
|
||||
planData.value[index].checked = true
|
||||
}else{
|
||||
for(let i = 0;i<planData.value.length;i++) {
|
||||
planData.value[i].checked = false
|
||||
}
|
||||
planData.value[index].checked = true
|
||||
currentplanid.value = planData.value[index].planid
|
||||
}
|
||||
}
|
||||
//确定普检按计划
|
||||
function plansubmit(){
|
||||
dialogVisible.value = false
|
||||
}
|
||||
// 鼠标移入
|
||||
function tablemouseenter(){
|
||||
clearScroll()
|
||||
}
|
||||
// 鼠标移出
|
||||
function tableMouseLeave(){
|
||||
createScroll()
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<div class="dashboard-container"
|
||||
style="display: flex;align-items: center;justify-content: center;flex-wrap: wrap;align-content:center;">
|
||||
|
||||
<div>
|
||||
<img src="@/assets/login/90.jfif" alt="">
|
||||
</div>
|
||||
<div style="width: 100%; text-align: center;
|
||||
font-size: 50px;
|
||||
padding-top: 40px;
|
||||
color: #303030;">欢迎使用{{ title }}</div>
|
||||
<div style="width: 100%; text-align: center;
|
||||
font-size: 80px;
|
||||
margin-top: 200px;
|
||||
color: #fff;">欢迎使用{{ title }}</div>
|
||||
</div>
|
||||
<el-dialog v-model="dialogVisible" :close-on-click-modal="false" title="选择普查计划" :before-close="handleClose" width="35%" draggable append-to-body>
|
||||
<div class="flex mb-[20px]">
|
||||
<el-input v-model="planname" placeholder="请输入活动名称" style="width:240px" clearable />
|
||||
<el-select v-model="planyear" class="ml-4" placeholder="请选择活动类型" style="width: 240px">
|
||||
<el-option v-for="item in planyearoptions" :key="item.value" :label="item.value" :value="item.value"/>
|
||||
</el-select>
|
||||
<el-button type="primary" class="ml-[10px]" @click="searchinfo">搜索</el-button>
|
||||
</div>
|
||||
<el-table :data="planData" border style="width: 100%; height:400px" :header-cell-style="{background:'rgb(250 250 250)',height:'50px'}">
|
||||
<el-table-column prop="plan_name" label="计划名称" align="center" min-width="100">
|
||||
<template #default="scope">
|
||||
<div v-if="scope.row.plan_name !== '' &&scope.row.plan_name !== undefined">
|
||||
<el-checkbox v-model="scope.row.checked" :label="scope.row.plan_name" size="large" @change="checkchange(scope.$index,$event)"/>
|
||||
</div>
|
||||
<div v-else></div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="plan_year" label="年度" align="center" />
|
||||
<el-table-column prop="plan_start_date" label="计划时间" align="center" />
|
||||
<el-table-column prop="org_name" label="组织机构" align="center" />
|
||||
</el-table>
|
||||
<span class="dialog-footer flex justify-end mt-[20px]" >
|
||||
<el-button type="primary" @click="plansubmit">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dashboard-container{
|
||||
height: calc(100vh - 130px);
|
||||
width: 100%;
|
||||
// height: 100%;
|
||||
height: calc(100vh - 145px);
|
||||
background: url('@/assets/login/index.jpg') ;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
.dashboard-container-title{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user