Afiliado: ${self.$data.contract}
${self.$data.attention_type}
${this.$data.customer_name}
${ this.$data.status.attention_wait_ts !== undefined ? dayjs.unix(this.$data.status.attention_wait_ts.value).fromNow() : this.get_programmed_attention_date()} ` } } //time timer(cb = new Function()) { setInterval(() => { cb() }, 1000) } get_programmed_attention_date() { let attention_date = this.$states.contains('programmed_attention') if (attention_date) { let date_string = dayjs(`${attention_date.value.date} ${attention_date.value.hour}:00`).format("YYYY-MM-DD HH:mm:ss") let appoint_date = dayjs(date_string) return appoint_date.fromNow(); } } get_programmed_attention_minutes() { let attention_date = this.$states.contains('programmed_attention') if (attention_date) { console.log(attention_date) let date_string = dayjs(`${attention_date.value.date} ${attention_date.value.hour}:00`).format("YYYY-MM-DD HH:mm:ss") let appoint_date = dayjs(date_string) return appoint_date.diff(dayjs(dayjs().format("YYYY-MM-DD HH:mm:ss")), 'minute') } } edit_programmed_attention_date() { let drop_down_btn = this.querySelector('#change_attention_date_dropdown'); let change_attention_date_btn = this.querySelector('#change_attention_date_btn'); drop_down_btn.onclick = () => { $(`#${this.$data.id}_change_attention_date`).modal('show'); } change_attention_date_btn.onclick = () => { this.create_states("programmed_attention", { date: this.querySelector('#new_attention_date').value, hour: this.querySelector('#new_attention_hour').value }) this.add_badge('programmed_attention', this.get_programmed_attention_date(), "bg-primary text-white") } } put_in_wait_que() { this.$data.que = "wait_que" this.save_data(); this.load_cache_from_state(); emitter_events.emit('REPARSE') } timer_color(ts = this.$data.status.attention_wait_ts.value) { //get minutes let old_string = dayjs.unix(this.$data.status.attention_wait_ts.value).format("YYYY-MM-DD HH:mm:ss") let old_time = dayjs(old_string) let now = dayjs() let minutes = now.diff(old_time, 'minute') if (minutes >= 0 && minutes < 9) { return "bg-success" } else if (minutes >= 9 && minutes < 19) { return "bg-warning" } else if (minutes >= 19) { return "bg-danger" } } //Ambulance swap_ambulance() { let swap_btn = this.querySelector('#swap_ambulance') swap_btn.onclick = () => { $(`#${this.$data.id}_swap_ambulance`).modal('show') } } set_ambulance() { let ambulances = Array.from(this.querySelectorAll('.ambulance-picker')); ambulances.forEach(ambulance => { ambulance.onclick = () => { let ambulance_data = this.$states.contains('ambulance_dispatched') if (!ambulance_data) { this.create_states('ambulance_dispatched', [ambulance.id]) this.create_ambulance_arrival_list() emitter_events.emit("ambulance_dispatched", ambulance.id) } else { let test_for_dupli = ambulance_data.value.some(el => el === ambulance.id) if (test_for_dupli === false) { ambulance_data.value.push(ambulance.id); this.create_states('ambulance_dispatched', ambulance_data.value) this.create_ambulance_arrival_list() emitter_events.emit("ambulance_dispatched", ambulance.id) } } } }) this.swap_ambulance(); } parse_ambulance_in_dropdown() { let ambulance_container = this.querySelector('#ambulance_list_dropdown'); ambulance_container.innerHTML = "" this.ambulances.forEach(ambulance => { if (ambulance.bussy !== true) { if (this.$states.contains('ambulance_dispatched')) { let current_ambulances = this.$states.contains('ambulance_dispatched').value let test_for_dupli = current_ambulances.some(elem => elem === ambulance.ambulance_name) if (test_for_dupli !== true) { let dropdown_item = document.createElement('li'); let dropdown_link = document.createElement('a'); dropdown_link.innerHTML = `${ambulance.ambulance_name}` dropdown_item.className = "dropdown-item ambulance-picker"; dropdown_item.id = ambulance.ambulance_name; dropdown_link.className = "text-dark"; dropdown_link.href = "#"; dropdown_item.appendChild(dropdown_link); ambulance_container.appendChild(dropdown_item) } } else { let dropdown_item = document.createElement('li'); let dropdown_link = document.createElement('a'); dropdown_link.innerHTML = `${ambulance.ambulance_name}` dropdown_item.className = "dropdown-item ambulance-picker"; dropdown_item.id = ambulance.ambulance_name; dropdown_link.className = "text-dark"; dropdown_link.href = "#"; dropdown_item.appendChild(dropdown_link); ambulance_container.appendChild(dropdown_item) } } }) this.set_ambulance() } create_ambulance_arrival_list() { let arrival_list = this.querySelector('#arrival_list_dropdown'); arrival_list.innerHTML = "" this.$states.current_states['ambulance_dispatched'].value.forEach(ambulance => { let current_ambulances = this.$states.contains('ambulance_arrived').value let test_for_dupli = current_ambulances ? current_ambulances.some(elem => elem === ambulance) : false if (test_for_dupli !== true) { let dropdown_item = document.createElement('li'); let dropdown_link = document.createElement('a'); dropdown_link.innerHTML = `${ambulance}` dropdown_item.className = "dropdown-item ambulance-arrival"; dropdown_item.id = ambulance; dropdown_link.className = "text-dark"; dropdown_link.href = "#"; dropdown_link.onclick = () => { this.set_ambulance_arrival(ambulance) } dropdown_item.appendChild(dropdown_link); arrival_list.appendChild(dropdown_item) } }) } set_ambulance_arrival(ambulance) { if (!this.$states.contains('ambulance_arrived')) { this.$data.que = 'attention'; this.create_states('attention_arrived', Math.round((new Date()).getTime() / 1000)) this.create_states('ambulance_arrived', [ambulance]) emitter_events.emit('REPARSE'); this.create_ambulance_arrival_list(); } else { let arrived = this.$states.contains('ambulance_arrived').value arrived.push(ambulance); this.create_states('ambulance_arrived', arrived) emitter_events.on('attention_arrived') this.create_ambulance_arrival_list(); } } remove_attention() { $(`#${this.$data.id}_remove`).modal('toggle') this.querySelector('#remove_attention_btn').onclick = () => { console.log('remove') que_manager.remove_client(this.$data.id); let ambulances_list = this.$states.contains('ambulance_dispatched'); let ambulance_cache = JSON.parse(sessionStorage.getItem('ambulance')); //free up ambulances if (ambulances_list) { Object.values(ambulance_cache).forEach(ambulance => { ambulances_list.value.forEach(item => { if (ambulance.ambulance_name === item) { ambulance.bussy = false; } }) }) } sessionStorage.setItem('ambulance', JSON.stringify(ambulance_cache)) emitter_events.emit('ambulance_busy_state_set') this.remove() } } connectedCallback() { this.construct(); if (this.isConnected) { this.on_state(); //action_menu this.create_action_menu(); //initial_states this.load_cache_from_state(); this.edit_programmed_attention_date(); //parse dropdown this.parse_ambulance_in_dropdown(); //React to events emitter_events.on('AMBULANCE_CREATED', data => { this.ambulances = Object.values(JSON.parse(sessionStorage.getItem('ambulance'))); this.parse_ambulance_in_dropdown(); }) emitter_events.on('ambulance_busy_state_set', (data) => { this.ambulances = Object.values(JSON.parse(sessionStorage.getItem('ambulance'))); this.parse_ambulance_in_dropdown(); }) emitter_events.on('attention_arrived', () => { let ambulance_data = this.$states.contains('ambulance_arrived') ambulance_data.value.forEach(ambulance => { this.add_badge(ambulance, `${ambulance} Arrivó`, 'badge-info') }) this.create_action_menu(); this.create_ambulance_arrival_list(); }) this.collapse_card() window.onkeydown = (e) => { if (e.key === 'p') { this.put_in_wait_que() } } //clock this.timer(() => { if (this.$states.contains('attention_wait_ts')) { if (this.$states.contains('attention_arrived')) { let ts = this.$states.contains('attention_arrived').value this.add_badge('attention_arrived', dayjs.unix(ts).fromNow(), `bg-success text-white`) this.delete_badge('attention_wait_ts') } else { //get moment this.add_badge('attention_wait_ts', dayjs.unix(this.$data.status.attention_wait_ts.value).fromNow(), `${this.timer_color(this.$data.status.attention_wait_ts)} text-white`) this.parse_badges() } } else if (this.$states.contains('programmed_attention')) { this.add_badge('programmed_attention', this.get_programmed_attention_date(), "bg-primary text-white") if (this.get_programmed_attention_minutes() < 30) { console.log('go to attention') this.put_in_wait_que(); } } }) } } } customElements.define('attention-card', Attention_card);