parent
41f9906d4c
commit
3719b73ec4
@ -0,0 +1,140 @@
|
||||
<template>
|
||||
<el-card id="todo-card" class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<img src="../static/icon6.png" alt="">
|
||||
<span style="padding-left: 15px">今日车辆去向</span>
|
||||
<i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
|
||||
</div>
|
||||
|
||||
<div style="position: relative;height: 100%;width: 100%;">
|
||||
<div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
|
||||
<el-table style="width: 100%;" size="mini" :header-cell-style="{
|
||||
'font-weight': '600',
|
||||
'background': '#fff',
|
||||
'color': '#515a6e',
|
||||
'text-align':'left'
|
||||
}" :height="tableHeight" :data="list">
|
||||
<el-table-column v-for="(item, index) in table" :key="index" :width="item.width" :label="item.title"
|
||||
:prop="item.key" :show-overflow-tooltip="item['show-overflow-tooltip']" header-align="center"
|
||||
:align="item.align" :formatter="item.formatter" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElementResize from 'element-resize-detector'
|
||||
import {
|
||||
defaultModalSize
|
||||
} from '@/settings'
|
||||
|
||||
export default {
|
||||
name: 'Car',
|
||||
components: {},
|
||||
props: {
|
||||
myData: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
x: 0,
|
||||
y: 12,
|
||||
w: 5,
|
||||
h: 7,
|
||||
i: 'Car',
|
||||
name: '今日车辆去向',
|
||||
data_id: 'chucheqingkuang',
|
||||
data: null
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultModalSize,
|
||||
tableHeight: 120,
|
||||
list: [],
|
||||
total: 0,
|
||||
table: [{
|
||||
title: '车辆',
|
||||
key: 'chepaihao',
|
||||
width: 120,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
title: '驾驶员',
|
||||
key: 'jiashiyuan',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '目的地',
|
||||
key: 'daodadidian',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
minWidth: 200,
|
||||
},
|
||||
{
|
||||
title: '用车时间',
|
||||
key: 'yongchekaishiriqi',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
width: 140,
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
myData(newval) {
|
||||
console.log('newval', newval)
|
||||
this.list = newval
|
||||
},
|
||||
},
|
||||
created() {},
|
||||
beforeDestroy() {},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
|
||||
init() {
|
||||
const cardDom = document.getElementById('todo-card')
|
||||
const cardTitleH = 59
|
||||
const elementResize = ElementResize({
|
||||
strategy: 'scroll'
|
||||
})
|
||||
elementResize.listenTo(cardDom, (ele) => {
|
||||
this.tableHeight =
|
||||
cardDom.getBoundingClientRect().height -
|
||||
40 -
|
||||
cardTitleH
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-card__body {
|
||||
width: 100%;
|
||||
height: calc(100% - 58px);
|
||||
}
|
||||
|
||||
::v-deep .el-table th,
|
||||
::v-deep .el-table td {
|
||||
border-bottom-style: dashed;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
::v-deep .vxe-modal--content {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<el-card id="evection-card" class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<img src="../static/icon5.png" alt="">
|
||||
<span
|
||||
style="padding-left: 15px"
|
||||
>今日出差明细</span>
|
||||
<i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
|
||||
</div>
|
||||
|
||||
<div style="position: relative;height: 100%;width: 100%;">
|
||||
<div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
|
||||
<el-table
|
||||
style="width: 100%;"
|
||||
size="mini"
|
||||
:header-cell-style="{
|
||||
'font-weight': '600',
|
||||
'background': '#fff',
|
||||
'color': '#515a6e',
|
||||
'text-align':'left'
|
||||
}"
|
||||
:height="tableHeight"
|
||||
:data="list"
|
||||
>
|
||||
<el-table-column
|
||||
v-for="(item, index) in table"
|
||||
:key="index"
|
||||
:width="item.width"
|
||||
:label="item.title"
|
||||
:prop="item.key"
|
||||
:show-overflow-tooltip="item['show-overflow-tooltip']"
|
||||
header-align="center"
|
||||
:align="item.align"
|
||||
:formatter="item.formatter"
|
||||
/>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElementResize from 'element-resize-detector'
|
||||
import { defaultModalSize } from '@/settings'
|
||||
|
||||
export default {
|
||||
name: 'Evection',
|
||||
components: {
|
||||
},
|
||||
props:{
|
||||
myData:{
|
||||
type:Array,
|
||||
default:()=>{
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
x: 0,
|
||||
y: 5,
|
||||
w: 5,
|
||||
h: 7,
|
||||
i: 'Evection',
|
||||
name: '今日出差明细',
|
||||
data_id:'chuchaiListToday',
|
||||
data:null
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultModalSize,
|
||||
timer: null,
|
||||
tableHeight: 120,
|
||||
list: [],
|
||||
table: [
|
||||
{
|
||||
title: '人员',
|
||||
key: 'flow.creator.name',
|
||||
width: 120,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
title: '去向',
|
||||
key: 'mudidi',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
title: '交通方式',
|
||||
key: 'jiaotongfangshi',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
title: '出差说明',
|
||||
key: 'chuchaishiyou',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
myData(newval){
|
||||
this.list = newval
|
||||
},
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
const cardDom = document.getElementById('evection-card')
|
||||
const cardTitleH = 59
|
||||
const elementResize = ElementResize({
|
||||
strategy: 'scroll'
|
||||
})
|
||||
elementResize.listenTo(cardDom, (ele) => {
|
||||
this.tableHeight =
|
||||
cardDom.getBoundingClientRect().height -
|
||||
40 -
|
||||
cardTitleH
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-card__body {
|
||||
width: 100%;
|
||||
height: calc(100% - 58px);
|
||||
}
|
||||
::v-deep .el-table th,::v-deep .el-table td {
|
||||
border-bottom-style: dashed;
|
||||
}
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
::v-deep .vxe-modal--content {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<el-card id="level-card" class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<img src="../static/icon8.png" alt="">
|
||||
<span
|
||||
style="padding-left: 15px"
|
||||
>今日请假情况</span>
|
||||
<i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
|
||||
</div>
|
||||
|
||||
<div style="position: relative;height: 100%;width: 100%;">
|
||||
<div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
|
||||
<el-table
|
||||
style="width: 100%;"
|
||||
size="mini"
|
||||
:header-cell-style="{
|
||||
'font-weight': '600',
|
||||
'background': '#fff',
|
||||
'color': '#515a6e',
|
||||
'text-align':'left'
|
||||
}"
|
||||
:height="tableHeight"
|
||||
:data="list"
|
||||
>
|
||||
<el-table-column
|
||||
v-for="(item, index) in table"
|
||||
:key="index"
|
||||
:width="item.width"
|
||||
:label="item.title"
|
||||
:prop="item.key"
|
||||
:show-overflow-tooltip="item['show-overflow-tooltip']"
|
||||
header-align="center"
|
||||
:align="item.align"
|
||||
:formatter="item.formatter"
|
||||
/>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElementResize from 'element-resize-detector'
|
||||
import { defaultModalSize } from '@/settings'
|
||||
|
||||
export default {
|
||||
name: 'Level',
|
||||
components: {
|
||||
|
||||
},
|
||||
props:{
|
||||
myData:{
|
||||
type:Array,
|
||||
default:()=>{
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
x: 5,
|
||||
y: 8,
|
||||
w: 3.5,
|
||||
h: 11,
|
||||
i: 'Level',
|
||||
name: '今日请假情况',
|
||||
data_id:'qingjiaListToday',
|
||||
data:null
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultModalSize,
|
||||
tableHeight: 120,
|
||||
list: [],
|
||||
table: [
|
||||
{
|
||||
title: '人员',
|
||||
key: 'flow.creator.name',
|
||||
width: 100,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
title: '事由',
|
||||
key: 'qingjiashiyou',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
minWidth: 200
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
key: 'kaishishijian',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
width: 140,
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
myData(newval){
|
||||
this.list = newval
|
||||
},
|
||||
},
|
||||
created() {
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
init() {
|
||||
const cardDom = document.getElementById('level-card')
|
||||
const cardTitleH = 59
|
||||
const elementResize = ElementResize({
|
||||
strategy: 'scroll'
|
||||
})
|
||||
elementResize.listenTo(cardDom, (ele) => {
|
||||
this.tableHeight =
|
||||
cardDom.getBoundingClientRect().height -
|
||||
40 -
|
||||
cardTitleH
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-card__body {
|
||||
width: 100%;
|
||||
height: calc(100% - 58px);
|
||||
}
|
||||
::v-deep .el-table th,::v-deep .el-table td {
|
||||
border-bottom-style: dashed;
|
||||
}
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
::v-deep .vxe-modal--content {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<el-card id="overtime-card" class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<img style="width: 31px;height:32px" src="../static/icon9.png" alt="">
|
||||
<span
|
||||
style="padding-left: 15px"
|
||||
>今日加班情况</span>
|
||||
<i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
|
||||
</div>
|
||||
|
||||
<div style="position: relative;height: 100%;width: 100%;">
|
||||
<div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
|
||||
<el-table
|
||||
style="width: 100%;"
|
||||
size="mini"
|
||||
:header-cell-style="{
|
||||
'font-weight': '600',
|
||||
'background': '#fff',
|
||||
'color': '#515a6e',
|
||||
'text-align':'left'
|
||||
}"
|
||||
:height="tableHeight"
|
||||
:data="list"
|
||||
>
|
||||
<el-table-column
|
||||
v-for="(item, index) in table"
|
||||
:key="index"
|
||||
:width="item.width"
|
||||
:label="item.title"
|
||||
:prop="item.key"
|
||||
:show-overflow-tooltip="item['show-overflow-tooltip']"
|
||||
header-align="center"
|
||||
:align="item.align"
|
||||
:formatter="item.formatter"
|
||||
/>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElementResize from 'element-resize-detector'
|
||||
import { defaultModalSize } from '@/settings'
|
||||
|
||||
export default {
|
||||
name: 'Overtime',
|
||||
components: {
|
||||
|
||||
},
|
||||
props: {
|
||||
myData: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
x: 8.5,
|
||||
y: 8,
|
||||
w: 3.5,
|
||||
h: 11,
|
||||
i: 'Overtime',
|
||||
name: '今日加班情况',
|
||||
data_id:'jiabanListToday',
|
||||
data:null
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultModalSize,
|
||||
tableHeight: 120,
|
||||
list: [],
|
||||
total: 0,
|
||||
table: [
|
||||
{
|
||||
title: '人员',
|
||||
key: 'flow.creator.name',
|
||||
width: 100,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
title: '原因',
|
||||
key: 'yuanyinshuoming',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
minWidth: 200
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
key: 'kaishiriqi',
|
||||
align: 'left',
|
||||
'show-overflow-tooltip': true,
|
||||
width: 140
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
myData(newval) {
|
||||
console.log('newval', newval)
|
||||
this.list = newval
|
||||
},
|
||||
},
|
||||
created() {
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
|
||||
init() {
|
||||
const cardDom = document.getElementById('overtime-card')
|
||||
const cardTitleH = 59
|
||||
const elementResize = ElementResize({
|
||||
strategy: 'scroll'
|
||||
})
|
||||
elementResize.listenTo(cardDom, (ele) => {
|
||||
this.tableHeight =
|
||||
cardDom.getBoundingClientRect().height -
|
||||
40 -
|
||||
cardTitleH
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-card__body {
|
||||
width: 100%;
|
||||
height: calc(100% - 58px);
|
||||
}
|
||||
::v-deep .el-table th,::v-deep .el-table td {
|
||||
border-bottom-style: dashed;
|
||||
}
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
::v-deep .vxe-modal--content {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,153 @@
|
||||
<template>
|
||||
<el-card class-name="box-card" shadow="hover">
|
||||
<div class="progress-card">
|
||||
<div class="progress-card-item" v-for="item in totalList">
|
||||
<div class="worker-progress__icon">
|
||||
<img :src="item.icon" alt="">
|
||||
</div>
|
||||
<div class="progress-card-item__num">{{ item.total }}</div>
|
||||
<div class="progress-card-item__label">{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElementResize from 'element-resize-detector'
|
||||
export default {
|
||||
name: 'Total',
|
||||
components: {
|
||||
},
|
||||
props:{
|
||||
myData:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return {
|
||||
level:0,
|
||||
normal:0,
|
||||
chuchai:0
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
w: 5,
|
||||
h: 5,
|
||||
i: 'Total',
|
||||
name: '当日情况',
|
||||
data_id:'attendance',
|
||||
data:null
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
totalList: [{
|
||||
icon: require('../static/icon1.png'),
|
||||
total: 0,
|
||||
name: '当日在岗',
|
||||
id:'normal'
|
||||
},{
|
||||
icon: require('../static/icon2.png'),
|
||||
total: 0,
|
||||
name: '当日请假',
|
||||
id:'leave'
|
||||
},{
|
||||
icon: require('../static/icon3.png'),
|
||||
total: 0,
|
||||
name: '当日出差',
|
||||
id:'chuchai'
|
||||
}
|
||||
// ,{
|
||||
// icon: require('../static/icon4.png'),
|
||||
// total: 0,
|
||||
// name: '其他'
|
||||
// }
|
||||
],
|
||||
tableHeight: 200
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
},
|
||||
watch:{
|
||||
myData(newval){
|
||||
this.totalList.map(item=>{
|
||||
item.total = newval[item.id]
|
||||
})
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
const cardDom = this.$el
|
||||
const cardTitleH = 69
|
||||
const elementResize = ElementResize({
|
||||
strategy: 'scroll'
|
||||
})
|
||||
elementResize.listenTo(cardDom, ele => {
|
||||
this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
width: 100%;
|
||||
height: calc(100% - 58px);
|
||||
}
|
||||
|
||||
::v-deep .ivu-table th,
|
||||
::v-deep .ivu-table td {
|
||||
border-bottom-style: dashed;
|
||||
}
|
||||
|
||||
.progress-card {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
&-item {
|
||||
min-width: 120px;
|
||||
margin: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
&__label {
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
&__num {
|
||||
font-size: 20px;
|
||||
line-height: 7px;
|
||||
color: #000000;
|
||||
font-weight: bold;
|
||||
padding-top: 18px;
|
||||
}
|
||||
|
||||
.worker-progress__icon {
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 92px;
|
||||
height: 92px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-progress--circle .el-progress__text {
|
||||
white-space: break-spaces;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div v-loading="loading" class="progress-card" element-loading-text="拼命加载中"
|
||||
element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.8)">
|
||||
<grid-layout id="grid-card" class="gird-card" :layout.sync="layoutList" :col-num="12" :row-height="40"
|
||||
:is-draggable="false" :is-resizable="false" :is-mirrored="false" :vertical-compact="true" :margin="[10, 10]"
|
||||
:auto-size="true" :use-css-transforms="true">
|
||||
<grid-item v-for="item in layoutList" :key="item.i" :x="item.x" :y="item.y" :w="item.w" :h="item.h" :i="item.i"
|
||||
style="touch-action: none">
|
||||
<component :is="item.component" style="position: absolute; inset: 0 0 0 0" :myData="item.data"
|
||||
@send-data="sendData" />
|
||||
</grid-item>
|
||||
</grid-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VueGridLayout from 'vue-grid-layout'
|
||||
import request from '@/utils/request'
|
||||
import {
|
||||
getToken
|
||||
} from '@/utils/auth'
|
||||
import axios from 'axios'
|
||||
const files = require.context(
|
||||
'@/views/jsc/components',
|
||||
false,
|
||||
/.vue$/
|
||||
)
|
||||
const cpns = files.keys().map((key) => {
|
||||
return files(key).default || files(key)
|
||||
})
|
||||
const layout = cpns.filter(item => !item.layout.disabled).map((item) => {
|
||||
return {
|
||||
...item.layout,
|
||||
component: item
|
||||
}
|
||||
})
|
||||
export default {
|
||||
components: {
|
||||
'GridLayout': VueGridLayout.GridLayout,
|
||||
'GridItem': VueGridLayout.GridItem
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
layoutList: [],
|
||||
data: {
|
||||
statistic: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.layoutList = layout.map(item => {
|
||||
layout.forEach(lay => {
|
||||
lay.i === item.i ? item.component = lay.component : ''
|
||||
})
|
||||
return item
|
||||
}) ?? []
|
||||
console.log("this.", this.layoutList)
|
||||
this.getChartToday()
|
||||
},
|
||||
methods: {
|
||||
sendData(data) {
|
||||
this.data.statistic = data
|
||||
},
|
||||
// 今日数据
|
||||
async getChartToday(loading = false) {
|
||||
try {
|
||||
if (loading) {
|
||||
this.loading = true
|
||||
}
|
||||
const res = await axios.get(`${process.env.VUE_APP_BASE_API}/api/oa/chart/today`, {
|
||||
headers: {
|
||||
'Authorization': `Bearer ${getToken()}`
|
||||
},
|
||||
params: {
|
||||
}
|
||||
})
|
||||
console.log("res", res)
|
||||
if (res.status === 200) {
|
||||
let list = res.data?.data
|
||||
this.layoutList.map(item => {
|
||||
// 用车情况
|
||||
if(item.data_id=='chucheqingkuang'){
|
||||
let carList = []
|
||||
let arr = list['chuchaiListToday']
|
||||
arr.map(a=>{
|
||||
if(a.chucheqingkuang){
|
||||
carList.push(...JSON.parse(a.chucheqingkuang))
|
||||
}
|
||||
})
|
||||
item['data'] = carList
|
||||
}else{
|
||||
item['data'] = list[item.data_id]
|
||||
}
|
||||
})
|
||||
}
|
||||
console.log("this.layoutList", this.layoutList)
|
||||
this.loading = false
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@media (max-width: 768px) {
|
||||
::v-deep .vue-grid-item {
|
||||
width: 100% !important;
|
||||
position: relative !important;
|
||||
transform: none !important;
|
||||
margin-bottom: 10px;
|
||||
touch-action: auto !important;
|
||||
}
|
||||
|
||||
//#grid-card {
|
||||
// overflow-y: scroll;
|
||||
//}
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 643 B |
|
After Width: | Height: | Size: 626 B |
|
After Width: | Height: | Size: 469 B |
|
After Width: | Height: | Size: 753 B |
|
After Width: | Height: | Size: 755 B |
Loading…
Reference in new issue