jili2-screen/src/apps/home/components/smodule/smodule31.vue

<template>
    <div class="module-main">
        <div class="module-box">
            <div class="header">
                <div class="rhombus" />
                <span class="title">日常工作网格化管理数据</span>

            </div>

            <dv-scroll-board :config="config" class="content" />

        </div>

    </div>

</template>

<script>
import Vue from 'vue';
import Component from 'vue-class-component';
import api from '../../api';

@Component({

    props: {
        data: {
            type: Object,
            default: null,
        },
    },
})
export default class Smodule31 extends Vue {
    config ={

    }

    created() {
        this.getDailyRecordList();
        setInterval(() => {
            this.getDailyRecordList();
        }, 5000 * 60);
    }

    getDailyRecordList() {
        api.getDailyRecordList().then((res) => {
            this.config = {
                header: ['任务地点', '执行人员', '完成时间'],
                headerBGC: '#061D4E',
                headerHeight: 45,
                data: res.data,
                align: 'center',
                oddRowBGC: '#061D4E',
                evenRowBGC: '#223661',
                rowNum: 18,
            };
        }).catch(() => {}).finally(() => {
        });
    }
}
</script>

<style scoped lang="scss">

    .module-box{
        width: 100%;
        height: 100%;
    }
    .module-box .header{
        width: 97%;
        height: 40px;
        line-height: 40px;
        padding-left: 3%;
    }
    .module-box .header .rhombus{
        width: 14px;
        height: 14px;
        background: #2D59BC;
        display: inline-block;
        clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
    }
    .module-box .header .title{
        color: #FFFFFF;
        font-size: 15px;
        font-weight: 500;
        margin-left: 2%;
    }

    .module-box .content{
        width: 96%;
        margin-top: 10px;
        height: calc(100% - 50px - 2%);
        padding: 0 2%;
        margin-bottom: 2%;
    }

</style>