编辑时间轴组件

gaoshp

2024-04-23 f28363d03c3539b0219c5b58ea8b7db37d50be6f

 src/views/console/base/CalenderTab.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-04-04 22:45:43
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-06 14:30:47
 * @LastEditTime: 2024-04-09 20:15:57
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/base/CalenderTab.vue
-->
<template>
@@ -15,24 +15,50 @@
                        <p>应用年份: {{item.year}}</p>
                    </el-card>
                </div>

            </el-aside>
            <el-container>
                <el-header>
                    <el-button type="primary">关联工位</el-button>
                    <el-button type="primary">编辑日历</el-button>
                    <el-button type="primary">删除</el-button>
                </el-header>
                <el-main>
                    <Calendar :min-date="minDate" :rows="1" disable-page-swipe :nav-visibility="''" :attributes='attributes'/>
                </el-main>
            </el-container>
        </el-container>
</template>

<script>
import { Calendar, DatePicker } from 'v-calendar';
import 'v-calendar/style.css';

export default {
    components: {
        Calendar,
        DatePicker
    },
    data() {
        return {
            attributes: [
                
            ],
            current: 0,
            total: 1,
            caleList: []
            caleList: [],
            minDate: '',
            maxDate: ''
        }
    },
    created() {
        this.load()
        this.init()
    },
    methods: {
        init () {
            this.minDate = new Date('2024-01-01')
            this.maxDate = new Date('2024-01-31')
        },
        load() {
            if  (this.current * 15 >= this.total) {
                return
@@ -56,9 +82,12 @@
}
</script>

<style lang="scss" scoped>
<style lang="scss">
.card {
    cursor: pointer;
    margin: 12px 12px 12px 0;
}
.vc-arrow {
    display: none!important;;
}
</style>