EmissionManagerModalCreate.vue 4.11 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<template>
  <div>
    <b-modal
      ref="modalEmissionManagerCreate"
      title="Create a new schedule"
      size="lg"
      @ok="create"
    >
      <b-row>
        <b-col cols="3">
          Creating schedule for:
        </b-col>
        <b-col cols="9">
          <b v-if="$parent.loaded.shows">
            {{ $parent.shows[$parent.currentShow].name }}
          </b>!
        </b-col>
      </b-row>

      <b-row v-if="loaded">
        <b-col cols="2">
          Start:
        </b-col>
        <b-col cols="4">
          {{ newSchedule.schedule.dstart }} {{ newSchedule.schedule.tstart }}
        </b-col>
        <b-col cols="2">
          End:
        </b-col>
        <b-col cols="4">
          {{ newSchedule.schedule.tend }}
        </b-col>
      </b-row>
    </b-modal>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  data () {
    return {
      newSchedule: null,
      loaded: false
    }
  },

  methods: {
    create (event) {
      // prevent the modal from closing automatically on click
      event.preventDefault()
      let uri = process.env.VUE_APP_API_STEERING_SHOWS + this.$parent.shows[this.$parent.currentShow].id + '/schedules/'
      axios.post(uri, this.newSchedule, {
        withCredentials: true,
        headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token }
      }).then(response => {
        // we have to check if there are any conflicts with existing timeslots
        let conflicts = false
        for (let i in response.data.projected) {
          if (response.data.projected[i].collisions.length > 0) {
            conflicts = true
            break
          }
        }
        // if there are no conflicts we can set an empty solutions object
        // in our newSchedule and submit it.
        if (!conflicts) {
          this.newSchedule.solutions = {}
          this.submit()
        // otherwise we have to resolve the conflict first.
        } else {
73
74
          this.$parent.resolve(response.data)
          this.$refs.modalEmissionManagerCreate.hide()
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
        }
      }).catch(error => {
        this.$log.error(error.response.status + ' ' + error.response.statusText)
        this.$log.error(error.response)
        alert('Error: could not create schedule. See console for details.')
        // and we leave the modal open, so no call to its .hide function here
      })
    },

    submit () {
      let uri = process.env.VUE_APP_API_STEERING_SHOWS + this.$parent.shows[this.$parent.currentShow].id + '/schedules/'
      axios.post(uri, this.newSchedule, {
        withCredentials: true,
        headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token }
      }).then(response => {
        // if for some reason a new conflict arose, e.g. because in the meantime
        // someone else inserted a conflicting schedule, we have to resolve.
        // TODO: based on single event schedule
        // TODO: check for complex schedules with resolved conflicts
        if (response.data.projected === undefined) {
          this.$parent.renderView(null)
        } else {
97
          this.$parent.resolve(response.data)
98
        }
99
        this.$refs.modalEmissionManagerCreate.hide()
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
      }).catch(error => {
        this.$log.error(error.response.status + ' ' + error.response.statusText)
        this.$log.error(error.response)
        alert('Error: could not submit final schedule. See console for details.')
        // and we leave the modal open, so no call to its .hide function here
      })
    },

    // initialise a new schedule and open the modal
    open (start, end) {
      this.newSchedule = {
        schedule: {
          rrule: 1,
          show: 21,
          byweekday: 0,
          dstart: start.format('YYYY-MM-DD'),
          tstart: start.format('HH:mm'),
          tend: end.format('HH:mm'),
          until: end.format('YYYY-MM-DD'),
          is_repetition: false,
          add_days_no: 0,
          add_business_days_only: false,
          fallback_id: 0,
          automation_id: 0,
        }
      }
      this.loaded = true
      this.$refs.modalEmissionManagerCreate.show()
    },
  }
}
</script>

<style scoped>
.slug {
  color: gray;
}
</style>