1

lzhe

2024-05-12 f00e6c3b881c67ef3651d4f812230188af01faca

 src/views/console/base/CalenderTab.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-04-04 22:45:43
 * @LastEditors: Sneed
 * @LastEditTime: 2024-05-04 16:44:58
 * @LastEditTime: 2024-05-05 21:20:22
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/base/CalenderTab.vue
-->
<template>
@@ -20,7 +20,7 @@
            <el-header>
                <span>日历【{{ selectInfo.code }}】{{ selectInfo.name }}</span>
                <el-button type="primary" style="margin-left: auto;" size="small">关联工位</el-button>
                <el-button type="primary" size="small">编辑日历</el-button>
                <!-- <el-button type="primary" size="small">编辑日历</el-button> -->
                <el-popconfirm title="确定删除吗？" @confirm="table_del">
                    <template #reference>
                        <el-button type="primary" size="small">删除</el-button>
@@ -28,12 +28,18 @@
                </el-popconfirm>
            </el-header>
            <el-main>
                <Calendar :min-date="minDate" :rows="1" disable-page-swipe :nav-visibility="''"
                    :attributes='attributes' />
                <el-row>
                    <el-col :span="6" style="padding:  10px;" v-for="item in months" :key="item.month">
                        <Calendar :initial-page="{ month: item.month + 1, year: item.year }" :rows="1"
                            disable-page-swipe :nav-visibility="''" :attributes='item.attributes' />
                    </el-col>
                </el-row>
                <!-- :initial-page="{ month: item.month + 1, year: item.year }" -->

            </el-main>
        </el-container>
        <el-drawer v-model="drawer" size="80%" title="生产日历" :direction="direction" :before-close="handleClose">
            <Add></Add>
            <Add :shiftList="shiftList" @success="success"></Add>
        </el-drawer>
    </el-container>
</template>
@@ -42,6 +48,7 @@
import { Calendar, DatePicker } from 'v-calendar';
import 'v-calendar/style.css';
import Add from './Add.vue'
import moment from 'moment';
export default {
    components: {
        Calendar,
@@ -52,7 +59,8 @@
        return {
            shiftList: [],
            selectInfo: {},
            drawer: true,
            drawer: false,
            months: [],
            attributes: [

            ],
@@ -68,9 +76,10 @@
        this.init()
    },
    methods: {
        dayclick(day) {
            console.log(day)
        },
        init() {
            this.minDate = new Date('2024-01-01')
            this.maxDate = new Date('2024-01-31')
            this.$HTTP.post('/api/blade-cps/shift/list', { statusList: [1] }).then(res => {
                if (res.code === 200) {
                    this.shiftList = res.data
@@ -81,6 +90,13 @@
            this.selectInfo = {
                ...row
            }
            this.months = []
            this.$HTTP.get(`/api/blade-cps/calendar/${row.id}`).then(res => {
                if (res.code === 200) {
                    console.log(res.data)
                    this.setDay(res.data)
                }
            })
        },
        table_del() {
            this.$HTTP.delete(`/api/blade-cps/calendar/${this.selectInfo.id}`).then(res => {
@@ -113,6 +129,74 @@
                }

            })
        },
        success() {
            this.drawer = false
            this.load(true)
        },
        setDay(data) {
            let year = data.year
            this.$HTTP.post('/api/blade-cps/shift-off-day/list', {
                year: year,
                startOffDay: `${year}-01-01`,
                endOffDay: `${year}-12-31`
            }).then(res => {
                if (res.code === 200) {
                    let arr = []
                    res.data.forEach(v => {
                        arr.push(v.startOffDay)
                        let day = moment(v.startOffDay)
                        while (day.add(1, 'd').unix() <= moment(v.endOffDay).unix()) {
                            arr.push(day.format('YYYY-MM-DD'))
                        }
                    })

                    for (let i = 0; i < 12; i++) {
                        this.months.push({
                            year: year,
                            month: i,
                            attributes: [
                                {
                                    dot: 'yellow',
                                    dates: arr.filter(item => {
                                        // console.log(moment(item).month(), 'mmonth', item)
                                        return moment(item).month() === i
                                    })
                                },
                                {
                                    highlight: true,
                                    dates: data.calendarDayVOList.filter(item => {
                                        console.log(moment(item).month(), '>>>123')
                                        return moment(item.calendarDate).month() === i
                                    }),
                                }
                            ]
                        })
                    }
                }
            })


            // this.months.forEach((item, i) => {
            //     let start = moment(`${currentYear}-${i + 1}-01`)
            //     let end = moment(`${currentYear}-${i + 2}-01`)
            //     let dates = []
            //     while (start.unix() < end.unix()) {
            //         if (this.checkboxGroup1.includes(start.day()) && this.holiday === 0) {
            //             this.pushDate(start) && dates.push(start.format('YYYY-MM-DD'))
            //         } else if (this.checkboxGroup1.includes(start.day()) && this.holiday === 1) {
            //             if (!this.months[i].attributes[0].dates.includes(start.format('YYYY-MM-DD'))) {
            //                 this.pushDate(start) && dates.push(start.format('YYYY-MM-DD'))
            //             }
            //         } else if (this.checkboxGroup1.includes(start.day()) && this.holiday === 2) {
            //             if (this.months[i].attributes[0].dates.includes(start.format('YYYY-MM-DD'))) {
            //                 this.pushDate(start) && dates.push(start.format('YYYY-MM-DD'))
            //             }
            //         }
            //         start.add(1, 'd')
            //     }
            //     this.months[i].attributes[1].dates = dates
            // })
        }
    }
}