<template>
    <div class='faultInfo'>
        <div class='p15 c-f14 bgc-fff c-333 grid-2 c-border-b'>
            <van-field
                v-model="f_event"
                readonly
                class='c-border'
                placeholder="请选择"
                @click="show1 = true">
                <template #right-icon>
                    <van-icon name="arrow-down" />
                </template>
            </van-field>
            <van-cell class='c-border' @click="show2 = true">
                <template #default>
                    <div class='c-t-center'>{{$moment(currenDate).format('YYYY-MM-DD')}}</div>
                </template>
            </van-cell>
        </div>
        <div v-for='(item, index) in list'>
            <div class='flex c-border-b c-333 c-f14 p10 bgc-fff f_y_c f_x_s'>
                <div style='flex:1;width:0' class='text-overhidd mr20'>{{item.content}}</div>
                <div>{{item.time}}</div>
            </div>
        </div>
        <van-overlay :show="show1||show2" @click="show1=false,show2 = false" >
            <van-picker
                class='c-position-a'
                style='bottom:0;width:100%'
                v-show='show1'
                show-toolbar
                :columns="eventList"
                value-key='dictValue'
                @confirm="onConfirm"
                @cancel="show1=false"
            />
            <van-datetime-picker
                class='c-position-a'
                style='bottom:0;width:100%'
                v-show='show2'
                v-model="endDate"
                type="date"
                :min-date="minDate"
                :max-date="maxDate"
            />
        </van-overlay>
    </div>
</template>
<script>
export default{
    name: 'faultInfo',
    data(){
        return {
            f_event: '',
            eventList: [],
            show1: false,
            show2: false,
            currenDate: new Date(),
            minDate: this.$moment().add(-1,'years').toDate(),
            maxDate: new Date(),
            list: [{content:'货道电机超时',time:'10:03:00'}]
        }
    },
    methods:{
        onConfirm(obj, index){

        },
        initMain(){

        }
    },
    created(){
        this.eventList = [{dictValue:'全部事件',dictCode:'all'}]
    }
}
</script>
<style scoped lang='scss'>
.faultInfo{
    .grid-2{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-column-gap: 20px;
    }
    .text-overhidd{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-all;
    }
}
</style>