48 lines
1.7 KiB
Vue
48 lines
1.7 KiB
Vue
<template>
|
||
<div>
|
||
<div class="calendars">
|
||
<div class="title">
|
||
<img src="../../assets/TZCGL/左.png" alt="" @click="getcalendar('prev-month')" />
|
||
<span>{{ ddd.getFullYear() }}年 {{ ddd.getMonth()+1 }}月</span>
|
||
<img src="../../assets/TZCGL/右.png" alt="" @click="getcalendar('next-month')" />
|
||
</div>
|
||
<el-calendar v-model="ddd" ref="getcalendar">
|
||
<!-- 这里使用的是 2.5 slot 语法,对于新项目请使用 2.6 slot 语法-->
|
||
<template slot="dateCell" slot-scope="{date, data}">
|
||
<p :class="data.isSelected ? 'is-selected' : ''">
|
||
<span>{{ data.day.split('-')[2] }}</span>
|
||
<!-- {{ date }} -->
|
||
<p style="color: #31D3D1" v-if="data.type == 'current-month'" class="lan">{{ "12.45" }}</p>
|
||
<p style="color: #31D3D1" v-if="data.type == 'prev-month'" class="lan">0</p>
|
||
<p style="color: #31D3D1" v-if="data.type == 'next-month'" class="lan">0</p>
|
||
<!-- {{ data.type}} -->
|
||
</p>
|
||
</template>
|
||
</el-calendar>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'ShuinichangRiLi',
|
||
|
||
data() {
|
||
return {
|
||
|
||
};
|
||
},
|
||
|
||
mounted() {
|
||
|
||
},
|
||
|
||
methods: {
|
||
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
|
||
</style> |