<template>
    <div class="boardFullPage stockBoardPage">
        <boardHeader 
            ref="boardHeader_Ref"
            :title="'备料看板'"
        ></boardHeader>
        <dv-loading v-show="dataLoading">Loading...</dv-loading>
        <div class="lineContain">
            <dv-scroll-board :config="config" ref="PAAscrollBoard" style="height:100%"/>
            <div class="hasNoData" v-if="config.data.length <= 0 && !dataLoading">暂无数据</div>
        </div>
    </div>
</template>

<script>
import axiosUtil from '../utils/request'
import boardHeader from '../components/boardHeader'
import util from '../utils/util'
export default {
    name: 'stockBoard',
    components:{boardHeader},
    data () {
        return {
            dataLoading: true,
            // config默认项
            configDefult:{
                header:['物料', '描述', '数量', '需求库位', '状态' ],
                waitTime: util.waitTime,//每页停留20秒d
                carousel: 'page',
                // index: true,
                // indexHeader: '序号',
                columnWidth: [660,660,280,280,280],
                align: ['left','left','center','center','center'],
                hoverPause: false, // 鼠标悬浮时，不停止轮播
                rowNum: 10,
                headerBGC: '#1981f6',
                headerHeight: 65,
                evenRowBGC: 'rgba(0, 44, 81, 0.9)',
                oddRowBGC: 'rgba(10, 29, 50, 0.9)'
            },
            config: {}
        }
    },
    created() {
        this.initConfig()
        this.getList()
        clearInterval(this.intervalId)
            this.intervalId = setInterval(() => {
            this.getList()
        }, 60000)//一分钟刷新数据
        util.addEventResizeFlesh()
    },
    destroyed() {
        clearInterval(this.intervalId)
    },
    methods: {
        init(){
            this.initConfig()
            this.getList()
            util.addEventResizeFlesh()
        },
        initConfig(data){
            this.config = {
                header: this.configDefult.header,
                data: data || [],
                waitTime: this.configDefult.waitTime,//每页停留20秒d
                carousel: this.configDefult.carousel,
                index: this.configDefult.index,
                indexHeader: this.configDefult.indexHeader,
                columnWidth: this.configDefult.columnWidth,
                align: this.configDefult.align,
                hoverPause: this.configDefult.hoverPause, // 鼠标悬浮时，不停止轮播
                rowNum: this.configDefult.rowNum,
                headerBGC: this.configDefult.headerBGC,
                headerHeight: this.configDefult.headerHeight,
                oddRowBGC: this.configDefult.oddRowBGC,
                evenRowBGC: this.configDefult.evenRowBGC
            }
        },
        async getList(){
            this.dataLoading = true
            this.initConfig()
            // axiosUtil.ajax_get('/api/dashboard/plan-and-actual/plan-actual-list').then(res => {
                this.dataLoading = false
                // if(res.length <= 0){
                //     return
                // }
                let rows = []
                // 假数据
                let _res = [
                    {
                        "itemCode": "294FL047",
                        "itemName": "294项目左前门",
                        "qty": 65,
                        "locationCode": 'WIP',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 23,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RR027",
                        "itemName": "294项目右后门",
                        "qty": 60,
                        "locationCode": 'WIP',
                        "status": '正常'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 80,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "254FR005",
                        "itemName": "254项目右前门",
                        "qty": 20,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "254FL036",
                        "itemName": "254项目左前门",
                        "qty": 30,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "L0385670AA_1D03",
                        "itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
                        "qty": 10,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "V01",
                        "itemName": "scrap item. ",
                        "qty": 16,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "41300016AA",
                        "itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
                        "qty": 20,
                        "locationCode": 'SALE',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294FL047",
                        "itemName": "294项目左前门",
                        "qty": 65,
                        "locationCode": 'WIP',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 23,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RR027",
                        "itemName": "294项目右后门",
                        "qty": 60,
                        "locationCode": 'WIP',
                        "status": '正常'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 80,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "254FR005",
                        "itemName": "254项目右前门",
                        "qty": 20,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "254FL036",
                        "itemName": "254项目左前门",
                        "qty": 30,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "L0385670AA_1D03",
                        "itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
                        "qty": 10,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "V01",
                        "itemName": "scrap item. ",
                        "qty": 16,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "41300016AA",
                        "itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
                        "qty": 20,
                        "locationCode": 'SALE',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294FL047",
                        "itemName": "294项目左前门",
                        "qty": 65,
                        "locationCode": 'WIP',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 23,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "294RR027",
                        "itemName": "294项目右后门",
                        "qty": 60,
                        "locationCode": 'WIP',
                        "status": '正常'
                    },
                    {
                        "itemCode": "294RL005",
                        "itemName": "294项目左后门",
                        "qty": 80,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "254FR005",
                        "itemName": "254项目右前门",
                        "qty": 20,
                        "locationCode": 'FG',
                        "status": '紧急'
                    },
                    {
                        "itemCode": "254FL036",
                        "itemName": "254项目左前门",
                        "qty": 30,
                        "locationCode": 'FG',
                        "status": '正常'
                    },
                    {
                        "itemCode": "L0385670AA_1D03",
                        "itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
                        "qty": 10,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "V01",
                        "itemName": "scrap item. ",
                        "qty": 16,
                        "locationCode": 'SH',
                        "status": '正常'
                    },
                    {
                        "itemCode": "41300016AA",
                        "itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
                        "qty": 20,
                        "locationCode": 'SALE',
                        "status": '紧急'
                    },
                ]
                _res.forEach(item=>{
                    let _item = []
                    _item[0] = item.itemCode;//物料
                    _item[1] = item.itemName;//描述
                    _item[2] = item.qty;//数量
                    _item[3] = item.locationCode;//需求库位
                    if(item.status == '紧急'){
                        _item[4] = `<span class="statusItem statusItem_warning">${item.status}</span>`;//状态
                    }else{
                        _item[4] = `<span class="statusItem statusItem_normal">${item.status}</span>`;//状态
                    }
                    rows.push(_item)
                })
                this.initConfig(rows)
                // this_.$refs['PAAscrollBoard'].updateRows(rows,0) //如果不需要刷新页面 不需要循环数据  追加数据用此方法
            // }).catch(error => {
            //     this.dataLoading = false
            //     console.log(error)
            // })
        },
    }
}
</script>

<style lang="less">
.stockBoardPage{
    background: rgba(0, 44, 81, 1);
    
    .header-item{
        font-size: 1rem;
        font-weight: bold;
    }
    .ceil{
        font-size: 1rem;
    }
    .dv-loading{
        color: #fff;
    }
    .lineContain{
        margin: 2rem;
        height: calc(100vh - 10rem);
    }
    .statusItem{
        padding:0.5rem 1.5rem;
        color:#fff;
        border-radius:0.1rem
    }
    .statusItem_warning{
        background:#ff2626
    }
    .statusItem_normal{
        background:#28b119
    }
}
</style>