|  | 
|  | 1 | +<template> | 
|  | 2 | +  <v-calendar | 
|  | 3 | +    :attributes='attributes' | 
|  | 4 | +    is-double-paned> | 
|  | 5 | +  </v-calendar> | 
|  | 6 | +</template> | 
|  | 7 | + | 
|  | 8 | +<script> | 
|  | 9 | +import { getExampleMonthComps } from '../utils'; | 
|  | 10 | +
 | 
|  | 11 | +export default { | 
|  | 12 | +  data() { | 
|  | 13 | +    const { thisMonth, thisMonthYear, nextMonth, nextMonthYear } = getExampleMonthComps(); | 
|  | 14 | +    return { | 
|  | 15 | +      attributes: [ | 
|  | 16 | +        { | 
|  | 17 | +          dot: { | 
|  | 18 | +            backgroundColor: '#ff4d4d', // Red | 
|  | 19 | +          }, | 
|  | 20 | +          dates: [ | 
|  | 21 | +            new Date(thisMonthYear, thisMonth, 1), | 
|  | 22 | +            new Date(thisMonthYear, thisMonth, 10), | 
|  | 23 | +            new Date(thisMonthYear, thisMonth, 22), | 
|  | 24 | +            new Date(nextMonthYear, nextMonth, 6), | 
|  | 25 | +            new Date(nextMonthYear, nextMonth, 16), | 
|  | 26 | +          ], | 
|  | 27 | +        }, | 
|  | 28 | +        { | 
|  | 29 | +          dot: { | 
|  | 30 | +            backgroundColor: '#398fac', // Turqoise | 
|  | 31 | +          }, | 
|  | 32 | +          dates: [ | 
|  | 33 | +            new Date(thisMonthYear, thisMonth, 4), | 
|  | 34 | +            new Date(thisMonthYear, thisMonth, 10), | 
|  | 35 | +            new Date(thisMonthYear, thisMonth, 15), | 
|  | 36 | +            new Date(nextMonthYear, nextMonth, 1), | 
|  | 37 | +            new Date(nextMonthYear, nextMonth, 12), | 
|  | 38 | +            { | 
|  | 39 | +              start: new Date(nextMonthYear, nextMonth, 20), | 
|  | 40 | +              end: new Date(nextMonthYear, nextMonth, 25), | 
|  | 41 | +            }, | 
|  | 42 | +          ], | 
|  | 43 | +        }, | 
|  | 44 | +        { | 
|  | 45 | +          dot: { | 
|  | 46 | +            backgroundColor: '#794dff', // Purple | 
|  | 47 | +          }, | 
|  | 48 | +          dates: [ | 
|  | 49 | +            new Date(thisMonthYear, thisMonth, 12), | 
|  | 50 | +            new Date(thisMonthYear, thisMonth, 26), | 
|  | 51 | +            new Date(thisMonthYear, thisMonth, 15), | 
|  | 52 | +            new Date(nextMonthYear, nextMonth, 9), | 
|  | 53 | +            new Date(nextMonthYear, nextMonth, 5), | 
|  | 54 | +            new Date(nextMonthYear, nextMonth, 6), | 
|  | 55 | +            new Date(nextMonthYear, nextMonth, 20), | 
|  | 56 | +            new Date(nextMonthYear, nextMonth, 25), | 
|  | 57 | +          ], | 
|  | 58 | +        }, | 
|  | 59 | +      ], | 
|  | 60 | +    }; | 
|  | 61 | +  }, | 
|  | 62 | +}; | 
|  | 63 | +</script> | 
0 commit comments