| | |
| | | import dayjs from 'dayjs'; |
| | | import { jobEventBar, getCalen } from '@/api/home/index'; |
| | | import { useRouter } from 'vue-router'; |
| | | import ev1 from '@/assets/images/workbench/ev1.png'; |
| | | import ev2 from '@/assets/images/workbench/ev2.png'; |
| | | import ev1 from '@/assets/images/workbench/ev1.svg'; |
| | | import ev2 from '@/assets/images/workbench/ev2.svg'; |
| | | import { ElMessage } from 'element-plus'; |
| | | const router = useRouter(); |
| | | const events = ref({}); |
| | | const params = ref({ |
| | |
| | | (newV, oldV) => { |
| | | if (newV && oldV) { |
| | | const newDate = dayjs(newV); |
| | | const oldDate = dayjs(oldV); |
| | | params.value = { |
| | | start_date: newDate.startOf('month').format('YYYY-MM-DD HH:mm:ss'), |
| | | end_date: newDate.endOf('month').format('YYYY-MM-DD HH:mm:ss'), |
| | |
| | | const getDate = date => { |
| | | return date.getDate(); |
| | | }; |
| | | |
| | | // 获取对应日期的事件 |
| | | const getEvents = dateString => { |
| | | return events.value[dateString] || []; |
| | | }; |
| | | const monthRange = getCurrentMonthRange(); |
| | | params.value = monthRange; |
| | | console.log('params.value', params.value); |
| | | |
| | | const getJobEventBar = () => { |
| | | getCalen(params.value).then(res => { |
| | | if (res.data.code !== 0) return; |
| | | console.log('rili', res.data.data); |
| | | |
| | | events.value = res.data.data; |
| | | }); |
| | | }; |
| | |
| | | if (event.name === '工单') { |
| | | router.push({ |
| | | path: '/tickets/ticket', |
| | | query: { |
| | | day: day, |
| | | }, |
| | | }); |
| | | } else { |
| | | router.push({ |
| | | path: '/job/jobstatistics', |
| | | query: { |
| | | day: day, |
| | | }, |
| | |
| | | <style lang="scss"> |
| | | .calenBox { |
| | | |
| | | .el-button-group>.el-button:not(:first-child):not(:last-child) { |
| | | border-radius: 0; |
| | | display: none; |
| | | } |
| | | .el-calendar__title { |
| | | font-weight: bold; |
| | | font-size: 14px; |
| | | color: #363636; |
| | | } |
| | | |
| | | .el-calendar-table td.is-selected { |
| | | background-color: #f0f7ff; |
| | | background-color: #f0f7ff; |
| | | border: 2px solid #409eff; |
| | | border-radius: 4px; |
| | | } |
| | |
| | | </style> |
| | | <style lang="scss" scoped> |
| | | .calenBox { |
| | | margin-top: 10px; |
| | | height: 546px; |
| | | margin-top: 17px; |
| | | height: 567px; |
| | | overflow: hidden; |
| | | .event-item { |
| | | font-size: 12px; |