更新前端
This commit is contained in:
parent
54c279d20c
commit
d89b94bb0c
64
app/frontend/src/api/regionmodule/region/index.ts
Normal file
64
app/frontend/src/api/regionmodule/region/index.ts
Normal file
@ -0,0 +1,64 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
|
||||
//查询行政区域列表
|
||||
export function queryRegionList(params:any){
|
||||
return request({
|
||||
url: '/base/region/queryRegionList' ,
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
//查询行政区域树
|
||||
export function queryRegion(params:any){
|
||||
return request({
|
||||
url: '/base/region/queryRegion' ,
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
//根据Id查询行政区域
|
||||
export function queryRegionById(params:any){
|
||||
return request({
|
||||
url: '/base/region/queryRegionById' ,
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
//新增行政区域
|
||||
export function addRegion(data:any){
|
||||
return request({
|
||||
url:'/base/region/addRegion' ,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
}
|
||||
//修改行政区域
|
||||
export function updateRegion(data:any){
|
||||
return request({
|
||||
url:'/base/region/updateRegion' ,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
}
|
||||
//修改行政区域
|
||||
export function delRegion(queryParams:any){
|
||||
return request({
|
||||
url:'/base/region/delRegion' ,
|
||||
method: 'post',
|
||||
params: queryParams
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
//导出行政区域
|
||||
export function exportExcel(queryParams: any) {
|
||||
return request({
|
||||
url: '/base/region/exportExcel',
|
||||
method: 'get',
|
||||
params: queryParams,
|
||||
responseType: 'arraybuffer'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -6,596 +6,6 @@ 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 { useRouter } from 'vue-router';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { downloadStudent } from "@/api/regionmodule/school";
|
||||
import { downloadFile } from '@/utils/index'
|
||||
const userStore = useUserStore();
|
||||
const title = userStore.title;
|
||||
const router = useRouter();
|
||||
|
||||
function routerClick(url:any){
|
||||
router.push(url);
|
||||
}
|
||||
|
||||
function downloadClick(){
|
||||
downloadStudent({}).then((response: any) => {
|
||||
downloadFile(response, '学生基本信息导入模板', 'xlsx')
|
||||
});
|
||||
}
|
||||
|
||||
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>
|
||||
@ -606,211 +16,5 @@ function tableMouseLeave(){
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dashboard-container{
|
||||
height: calc(100vh - 130px);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content:center ;
|
||||
justify-content: center;
|
||||
.dashboard-container-title{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
color: #1B1B1B;
|
||||
align-items: center;
|
||||
margin-bottom: 15px;
|
||||
img{
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left:15px;
|
||||
}
|
||||
}
|
||||
.dashboard-container-top{
|
||||
height: 130px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.top-box{
|
||||
width: 16%;
|
||||
height:130px;
|
||||
padding: 0 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.top-box-title{
|
||||
font-family: '微软雅黑';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #787878;
|
||||
}
|
||||
.top-box-num{
|
||||
font-family: '微软雅黑 Bold', '微软雅黑';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 28px;
|
||||
color: #363636;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.top-box-right{
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background-color: #F7B900;
|
||||
border-radius: 60px;
|
||||
position: relative;
|
||||
img{
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
left: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.dashboard-container-bottom{
|
||||
height: calc(100vh - 335px);
|
||||
width: 100%;
|
||||
margin-top: 15px;
|
||||
.container-bottom-top{
|
||||
height: 50%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 15px;
|
||||
.bottom-top-box{
|
||||
width: 33%;
|
||||
height: 100%;
|
||||
// padding: 0 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
margin-right: 15px;
|
||||
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
|
||||
}
|
||||
.bottom-top-box:nth-child(3){
|
||||
margin-right: 0px;
|
||||
}
|
||||
.box-content-title{
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
padding: 0px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom:1px solid #F6F6F6;
|
||||
.titleicon{
|
||||
width: 6px;
|
||||
height: 14px;
|
||||
background-color: #409EFF;
|
||||
margin-right: 9px;
|
||||
}
|
||||
.titletext{
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.container-bottom-top:nth-child(2){
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.box-content-charts{
|
||||
padding: 10px 20px;
|
||||
width: 100%;
|
||||
height:calc(100% - 50px);
|
||||
}
|
||||
}
|
||||
}
|
||||
.tschartstext{
|
||||
font-weight: 400;
|
||||
color: #787878;
|
||||
font-size: 16px;
|
||||
}
|
||||
.boytext{
|
||||
color: #409EFF;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.girltext{
|
||||
color: #FF9900;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.steptitle{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
font-family: '微软雅黑 Bold', '微软雅黑';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.stepimgbox{
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-family: '微软雅黑 Bold', '微软雅黑';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 10px;
|
||||
|
||||
}
|
||||
.stepimgradius{
|
||||
width: 130px;
|
||||
height: 130px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: center;
|
||||
margin: 0 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.stepimgradius:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
.stepimgradius1{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(234, 0, 0, 0.2), rgba(234, 0, 0, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(234, 0, 0, 0.2)
|
||||
}
|
||||
.stepimgradius2{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(203, 98, 26, 0.2), rgba(203, 98, 26, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(203, 98, 26, 0.2)
|
||||
}
|
||||
.stepimgradius3{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(45, 89, 167, 0.2), rgba(45, 89, 167, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(203, 98, 26, 0.2)
|
||||
}
|
||||
.stepimgradius4{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(236, 179, 0, 0.2), rgba(236, 179, 0, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(236, 179, 0, 0.2)
|
||||
}
|
||||
.stepimgradius5{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(102, 162, 215, 0.2), rgba(102, 162, 215, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(102, 162, 215, 0.2)
|
||||
}
|
||||
.stepimgradius6{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(127, 185, 88, 0.2), rgba(127, 185, 88, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(127, 185, 88, 0.2)
|
||||
}
|
||||
.stepimgradius7{
|
||||
background: radial-gradient(circle at 20% 20%, rgba(100, 34, 149, 0.2), rgba(100, 34, 149, 1) 30%);
|
||||
box-shadow: inset -10px -10px 50px rgba(100, 34, 149, 0.2)
|
||||
}
|
||||
.stepnum{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
}
|
||||
.steptext{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -21,10 +21,10 @@ import {
|
||||
import { ElMessageBox, ElMessage } from "element-plus";
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import Page from '@/components/Pagination/page.vue'
|
||||
import VisionInstitution from './visionInstitution.vue'
|
||||
import { queryVisionInstitutionById } from "@/api/regionmodule/visionInstitution";
|
||||
// import VisionInstitution from './visionInstitution.vue'
|
||||
// import { queryVisionInstitutionById } from "@/api/regionmodule/visionInstitution";
|
||||
import { Search } from '@element-plus/icons-vue'
|
||||
import { queryVisionInstitutionNameList } from "@/api/regionmodule/visionInstitution";
|
||||
// import { queryVisionInstitutionNameList } from "@/api/regionmodule/visionInstitution";
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
const userStore = useUserStore();
|
||||
// import { constant } from "lodash";
|
||||
@ -190,11 +190,11 @@ function editdepartment(row: any) {
|
||||
selectID.push(item.id)
|
||||
})
|
||||
institutionName.value = ""
|
||||
if(row.institution_id !=null && row.institution_id !=''){
|
||||
queryVisionInstitutionById({id:row.institution_id}).then((res) => {
|
||||
institutionName.value = res.data.name
|
||||
});
|
||||
}
|
||||
// if(row.institution_id !=null && row.institution_id !=''){
|
||||
// queryVisionInstitutionById({id:row.institution_id}).then((res) => {
|
||||
// institutionName.value = res.data.name
|
||||
// });
|
||||
// }
|
||||
getOrgPower()
|
||||
info.value = JSON.parse(JSON.stringify(row));
|
||||
info.value.roleinfo = selectID;
|
||||
@ -453,23 +453,23 @@ function institutionClick(e:any){
|
||||
}
|
||||
const queryName = ref('')
|
||||
function getTreeInit() {
|
||||
queryName.value = queryName.value.replace(/\s+/g, "");
|
||||
let params = {
|
||||
name: queryName.value
|
||||
};
|
||||
treeloading.value = true
|
||||
treedata.value = []
|
||||
queryVisionInstitutionNameList(params).then((res) => {
|
||||
treedata.value = res.data
|
||||
treedata.value.unshift({
|
||||
id:'',
|
||||
name:'全部机构'
|
||||
})
|
||||
// queryName.value = queryName.value.replace(/\s+/g, "");
|
||||
// let params = {
|
||||
// name: queryName.value
|
||||
// };
|
||||
// treeloading.value = true
|
||||
// treedata.value = []
|
||||
// queryVisionInstitutionNameList(params).then((res) => {
|
||||
// treedata.value = res.data
|
||||
// treedata.value.unshift({
|
||||
// id:'',
|
||||
// name:'全部机构'
|
||||
// })
|
||||
|
||||
treeloading.value = false
|
||||
}).catch(()=>{
|
||||
treeloading.value = false
|
||||
});
|
||||
// treeloading.value = false
|
||||
// }).catch(()=>{
|
||||
// treeloading.value = false
|
||||
// });
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -600,10 +600,10 @@ function getTreeInit() {
|
||||
<el-button type="primary" @click="confirmClick(infoForm)">保存</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="visionInstitutionVisible" :close-on-click-modal="false" :before-close="InstitutionClose" :title="'关联机构'"
|
||||
<!-- <el-dialog v-model="visionInstitutionVisible" :close-on-click-modal="false" :before-close="InstitutionClose" :title="'关联机构'"
|
||||
append-to-body width="1280px" draggable>
|
||||
<VisionInstitution v-if="visionInstitutionVisible" @returnClick="returnClick"/>
|
||||
</el-dialog>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -33,9 +33,9 @@ export default ({ mode }: ConfigEnv): UserConfig => {
|
||||
proxy: {
|
||||
[env.VITE_APP_BASE_API]: {
|
||||
//线上API地址
|
||||
target: 'https://edu.mmhyvision.com:8445',
|
||||
// target: 'https://edu.mmhyvision.com:8445',
|
||||
// 本地API地址
|
||||
// target: 'http://192.168.1.60:8093',
|
||||
target: 'http://localhost:8093',
|
||||
changeOrigin: true,
|
||||
rewrite: path =>
|
||||
path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')
|
||||
|
||||
@ -4,98 +4,7 @@
|
||||
<div class="dashboard-container">
|
||||
<github-corner class="github-corner" />
|
||||
|
||||
<!-- 数据 -->
|
||||
<el-row :gutter="40" class="card-panel__col">
|
||||
<el-col :xs="24" :sm="12" :lg="6" class="card-panel__col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-user">
|
||||
<svg-icon icon-class="uv" size="4em" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">访问数</div>
|
||||
<div class="card-panel-num">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :sm="12" :lg="6" class="card-panel__col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-message">
|
||||
<svg-icon icon-class="message" size="4em" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">消息数</div>
|
||||
<div class="card-panel-num">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :sm="12" :lg="6" class="card-panel__col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-money">
|
||||
<svg-icon icon-class="money" size="4em" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">收入金额</div>
|
||||
<div class="card-panel-num">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :lg="6" class="card-panel__col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-shopping">
|
||||
<svg-icon icon-class="shopping" size="4em" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">订单数</div>
|
||||
<div class="card-panel-num">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 项目 + 团队成员介绍 -->
|
||||
<el-row :gutter="40">
|
||||
<!-- 项目介绍 -->
|
||||
<el-col :md="12" :lg="12" class="card-panel__col">
|
||||
<Project />
|
||||
</el-col>
|
||||
|
||||
<!-- 团队介绍 -->
|
||||
<el-col :md="12" :lg="12" class="card-panel__col">
|
||||
<Team />
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- Echarts 图表 -->
|
||||
<el-row :gutter="40" style="margin-top: 20px">
|
||||
<el-col :sm="24" :lg="8" class="card-panel__col">
|
||||
<BarChart
|
||||
id="barChart"
|
||||
height="400px"
|
||||
width="100%"
|
||||
class="chart-container"
|
||||
/>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :sm="12" :lg="8" class="card-panel__col">
|
||||
<PieChart
|
||||
id="pieChart"
|
||||
height="400px"
|
||||
width="100%"
|
||||
class="chart-container"
|
||||
/>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :sm="12" :lg="8" class="card-panel__col">
|
||||
<RadarChart
|
||||
id="radarChart"
|
||||
height="400px"
|
||||
width="100%"
|
||||
class="chart-container"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
@ -105,138 +14,6 @@ export default { name: 'Dashboard' };
|
||||
<script setup lang="ts">
|
||||
// 组件引用
|
||||
import GithubCorner from '@/components/GithubCorner/index.vue';
|
||||
import SvgIcon from '@/components/SvgIcon/index.vue';
|
||||
import BarChart from './components/Chart/BarChart.vue';
|
||||
import PieChart from './components/Chart/PieChart.vue';
|
||||
import RadarChart from './components/Chart/RadarChart.vue';
|
||||
|
||||
import Project from './components/Project/index.vue';
|
||||
import Team from './components/Team/index.vue';
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.dashboard-container {
|
||||
background-color: rgb(240, 242, 245);
|
||||
position: relative;
|
||||
|
||||
.github-corner {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
border: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.box-center {
|
||||
margin: 0 auto;
|
||||
display: table;
|
||||
}
|
||||
|
||||
.user-profile {
|
||||
.box-center {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.user-role {
|
||||
padding-top: 10px;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.box-social {
|
||||
padding-top: 30px;
|
||||
|
||||
.el-table {
|
||||
border-top: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
|
||||
.user-follow {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-panel__col {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.card-panel {
|
||||
height: 108px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
background: #fff;
|
||||
box-shadow: 4px 4px 40px rgba(0, 0, 0, 0.05);
|
||||
border-color: rgba(0, 0, 0, 0.05);
|
||||
|
||||
.icon-message {
|
||||
color: #36a3f7;
|
||||
}
|
||||
|
||||
.icon-user {
|
||||
color: #40c9c6;
|
||||
}
|
||||
|
||||
.icon-money {
|
||||
color: #f4516c;
|
||||
}
|
||||
|
||||
.icon-shopping {
|
||||
color: #34bfa3;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.card-panel-icon-wrapper {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icon-user {
|
||||
background: #40c9c6;
|
||||
}
|
||||
|
||||
.icon-message {
|
||||
background: #36a3f7;
|
||||
}
|
||||
|
||||
.icon-money {
|
||||
background: #f4516c;
|
||||
}
|
||||
|
||||
.icon-shopping {
|
||||
background: #34bfa3;
|
||||
}
|
||||
}
|
||||
|
||||
.card-panel-icon-wrapper {
|
||||
float: left;
|
||||
margin: 14px 0 0 14px;
|
||||
padding: 16px;
|
||||
transition: all 0.38s ease-out;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.card-panel-description {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
margin: 26px 20px 0;
|
||||
|
||||
.card-panel-text {
|
||||
line-height: 18px;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.card-panel-num {
|
||||
font-size: 20px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
background: #ffffff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user