121 lines
2.7 KiB
Vue
121 lines
2.7 KiB
Vue
<template>
|
|
<gz-dash
|
|
icon="$ayiTools"
|
|
:add-url="'widgets/0'"
|
|
:update-frequency="0"
|
|
@dash-refresh="loadData"
|
|
v-on="$listeners"
|
|
v-bind="$attrs"
|
|
>
|
|
<template slot="main">
|
|
<v-calendar
|
|
color="primary"
|
|
type="day"
|
|
hide-header
|
|
interval-count="11"
|
|
first-interval="7"
|
|
interval-height="24"
|
|
interval-width="45"
|
|
:events="events"
|
|
:event-color="getEventColor"
|
|
@click:event="showEvent"
|
|
:locale="languageName"
|
|
></v-calendar>
|
|
</template>
|
|
</gz-dash>
|
|
</template>
|
|
<script>
|
|
import GzDash from "../components/dash-base.vue";
|
|
export default {
|
|
components: {
|
|
GzDash
|
|
},
|
|
data() {
|
|
return {
|
|
events: [],
|
|
languageName: window.$gz.locale.getResolvedLanguage()
|
|
};
|
|
},
|
|
props: {},
|
|
created() {
|
|
// this.loadData();
|
|
},
|
|
computed: {},
|
|
methods: {
|
|
loadData: function() {
|
|
let events = [];
|
|
let now = new Date();
|
|
let yy = now.getFullYear();
|
|
let mm = now.getMonth() + 1;
|
|
let dd = now.getDate();
|
|
events.push({
|
|
id: 45,
|
|
type: 34,
|
|
name: "WO 45",
|
|
start: getEventTimeStamp(yy, mm, dd, 8, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 8, 45),
|
|
color: "orange"
|
|
});
|
|
|
|
events.push({
|
|
id: 22,
|
|
type: 34,
|
|
name: "WO 22",
|
|
start: getEventTimeStamp(yy, mm, dd, 9, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 10, 30),
|
|
color: "blue"
|
|
});
|
|
|
|
events.push({
|
|
id: 33,
|
|
type: 34,
|
|
name: "WO 33",
|
|
start: getEventTimeStamp(yy, mm, dd, 11, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 11, 30),
|
|
color: "green"
|
|
});
|
|
|
|
events.push({
|
|
id: 44,
|
|
type: 34,
|
|
name: "WO 44",
|
|
start: getEventTimeStamp(yy, mm, dd, 11, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 11, 30),
|
|
color: "indigo"
|
|
});
|
|
|
|
events.push({
|
|
id: 55,
|
|
type: 34,
|
|
name: "WO 55",
|
|
start: getEventTimeStamp(yy, mm, dd, 11, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 11, 45),
|
|
color: "purple"
|
|
});
|
|
|
|
events.push({
|
|
id: 34,
|
|
type: 34,
|
|
name: "WO 66",
|
|
start: getEventTimeStamp(yy, mm, dd, 13, "00"),
|
|
end: getEventTimeStamp(yy, mm, dd, 16, 45),
|
|
color: "teal"
|
|
});
|
|
|
|
this.events = events;
|
|
},
|
|
getEventColor(event) {
|
|
return event.color;
|
|
},
|
|
showEvent({ nativeEvent, event }) {
|
|
nativeEvent.stopPropagation();
|
|
alert(`STUB: OPEN ITEM (data: ${JSON.stringify(event)})`);
|
|
}
|
|
}
|
|
};
|
|
|
|
function getEventTimeStamp(yy, mm, dd, hh, minutes) {
|
|
return `${yy}-${mm}-${dd} ${hh}:${minutes}`;
|
|
}
|
|
</script>
|