PMCORE-3090:UI - Task Actions (EHX) - Inbox List (and any Custom Case List that belongs to this list)
Corrections CR Conection to api modals with rest service CR
This commit is contained in:
fabio
163
resources/assets/js/home/modal/ModalPauseCase.vue
Normal file
163
resources/assets/js/home/modal/ModalPauseCase.vue
Normal file
@@ -0,0 +1,163 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-modal
|
||||
ref="modal-pause-case"
|
||||
hide-footer
|
||||
size="lg"
|
||||
>
|
||||
<template v-slot:modal-title>
|
||||
{{ $t('ID_PAUSE_CASE') }}
|
||||
<i class="far fa-pause-circle"></i>
|
||||
</template>
|
||||
<b-container fluid>
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="pauseDate">{{ $t('ID_PAUSE_DATE') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="5">
|
||||
<b-form-datepicker
|
||||
disabled
|
||||
id="pauseDate"
|
||||
class="mb-2"
|
||||
v-model="pauseData.pauseDate"
|
||||
:locale="locale"
|
||||
:date-format-options="{ year: 'numeric', month: 'numeric', day: 'numeric' }"
|
||||
></b-form-datepicker>
|
||||
</b-col>
|
||||
<b-col sm="4">
|
||||
<input type="time" id="pauseTime" v-model="pauseData.pauseTime" class="form-control" disabled>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="unpauseDate">{{ $t('ID_UNPAUSE_DATE') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="5">
|
||||
<b-form-datepicker
|
||||
id="unpauseDate"
|
||||
class="mb-2"
|
||||
v-model="pauseData.unpauseDate"
|
||||
:locale="locale"
|
||||
:min="minDate"
|
||||
:date-format-options="{ year: 'numeric', month: 'numeric', day: 'numeric' }"
|
||||
></b-form-datepicker>
|
||||
</b-col>
|
||||
<b-col sm="4">
|
||||
<input type="time" v-model="pauseData.unpauseTime" id="unpauseTime" class="form-control">
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="reasonPause">{{ $t('ID_REASON_PAUSE') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="9">
|
||||
<b-form-textarea
|
||||
id="reasonPause"
|
||||
v-model="pauseData.reasonPause"
|
||||
rows="3"
|
||||
max-rows="6"
|
||||
></b-form-textarea>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row>
|
||||
<b-col sm="3">
|
||||
<label for="notifyUser">{{ $t('ID_NOTIFY_USERS_CASE') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="8">
|
||||
<b-form-checkbox v-model="pauseData.nofitfyUser" id="notifyUser" name="notifyUser" switch>
|
||||
</b-form-checkbox>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<div class="modal-footer">
|
||||
<div class="float-right">
|
||||
<b-button
|
||||
variant="danger"
|
||||
data-dismiss="modal"
|
||||
@click="cancel"
|
||||
>
|
||||
{{ $t("ID_CANCEL") }}
|
||||
</b-button>
|
||||
<b-button
|
||||
variant="success"
|
||||
@click="pauseCase"
|
||||
>
|
||||
{{ $t("ID_PAUSE") }}
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from "./../../api/index";
|
||||
export default {
|
||||
name: "ModalPauseCase",
|
||||
components: {},
|
||||
props: {},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
data: null,
|
||||
locale: 'en-US',
|
||||
pauseData: {
|
||||
unpauseDate: '',
|
||||
unpauseTime: '',
|
||||
reasonPause: '',
|
||||
nofitfyUser: '',
|
||||
pauseDate: '',
|
||||
pauseTime: ''
|
||||
},
|
||||
minDate: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
classBtn(cls) {
|
||||
return "btn v-btn-request " + cls;
|
||||
},
|
||||
show() {
|
||||
this.setDateTime();
|
||||
this.$refs["modal-pause-case"].show();
|
||||
},
|
||||
cancel() {
|
||||
this.$refs["modal-pause-case"].hide();
|
||||
},
|
||||
/**
|
||||
* Set DateTime with current time as default
|
||||
*/
|
||||
setDateTime() {
|
||||
var now = new Date(),
|
||||
nextDay = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1),
|
||||
today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
|
||||
this.minDate = nextDay;
|
||||
this.pauseData.pauseDate = today;
|
||||
this.pauseData.pauseTime = now.getHours() + ":" + now.getMinutes();
|
||||
|
||||
},
|
||||
/**
|
||||
* Pause the case
|
||||
*/
|
||||
pauseCase() {
|
||||
let that = this;
|
||||
this.data.unpausedDate = this.pauseData.unpauseDate;
|
||||
this.data.unpausedTime = this.pauseData.unpauseTime;
|
||||
this.data.nofitfyUser = this.pauseData.nofitfyUser;
|
||||
this.data.reasonPause = this.pauseData.reasonPause;
|
||||
|
||||
api.cases.pauseCase(this.data).then((response) => {
|
||||
if (response.statusText == "OK") {
|
||||
that.$refs["modal-pause-case"].hide();
|
||||
that.$parent.$refs["vueTable"].getData();
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
134
resources/assets/js/home/modal/ModalReassignCase.vue
Normal file
134
resources/assets/js/home/modal/ModalReassignCase.vue
Normal file
@@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-modal
|
||||
ref="modal-reassign-case"
|
||||
hide-footer
|
||||
size="lg"
|
||||
>
|
||||
<template v-slot:modal-title>
|
||||
{{ $t('ID_REASSIGN_CASE') }}
|
||||
<i class="fas fa-undo"></i>
|
||||
</template>
|
||||
<b-container fluid>
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="selectUser">{{ $t('ID_SELECT_USER') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="9">
|
||||
<b-form-select v-model="userSelected" :options="users"></b-form-select>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="reasonReassign">{{ $t('ID_REASON_REASSIGN') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="9">
|
||||
<b-form-textarea
|
||||
id="reasonReassign"
|
||||
v-model="reasonReassign"
|
||||
rows="3"
|
||||
max-rows="6"
|
||||
></b-form-textarea>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="my-1">
|
||||
<b-col sm="3">
|
||||
<label for="notifyUser">{{ $t('ID_NOTIFY_USERS_CASE') }}</label>
|
||||
</b-col>
|
||||
<b-col sm="9">
|
||||
<b-form-checkbox v-model="notifyUser" id="notifyUser" name="notifyUser" switch>
|
||||
</b-form-checkbox>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<div class="modal-footer">
|
||||
<div class="float-right">
|
||||
<b-button
|
||||
variant="danger"
|
||||
data-dismiss="modal"
|
||||
@click="cancel"
|
||||
>
|
||||
{{ $t("ID_CANCEL") }}
|
||||
</b-button>
|
||||
<b-button
|
||||
variant="success"
|
||||
@click="reassignCase"
|
||||
>
|
||||
{{ $t("ID_PAUSE") }}
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from "./../../api/index";
|
||||
import utils from "../../utils/utils";
|
||||
|
||||
export default {
|
||||
name: "ModalPauseCase",
|
||||
components: {},
|
||||
props: {},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
data: null,
|
||||
locale: 'en-US',
|
||||
users: [],
|
||||
reasonReassign: null,
|
||||
userSelected: null,
|
||||
notifyUser: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
classBtn(cls) {
|
||||
return "btn v-btn-request " + cls;
|
||||
},
|
||||
show() {
|
||||
this.getUsersReassign();
|
||||
this.$refs["modal-reassign-case"].show();
|
||||
},
|
||||
cancel() {
|
||||
this.$refs["modal-reassign-case"].hide();
|
||||
},
|
||||
getUsersReassign() {
|
||||
let that = this;
|
||||
api.cases.getUserReassign(this.data).then((response) => {
|
||||
var users = response.data.data,
|
||||
i;
|
||||
if (response.statusText == "OK") {
|
||||
for (i = 0; i < users.length; i += 1) {
|
||||
that.users.push({
|
||||
value: users[i].USR_UID,
|
||||
text: utils.userNameDisplayFormat({
|
||||
userName: users[i].USR_USERNAME || "",
|
||||
firstName: users[i].USR_FIRSTNAME || "",
|
||||
lastName: users[i].USR_LASTNAME || "",
|
||||
format: window.config.FORMATS.format || null
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
reassignCase() {
|
||||
let that = this;
|
||||
this.data.userSelected = this.userSelected;
|
||||
this.data.reasonReassign = this.reasonReassign;
|
||||
this.notifyUser = this.notifyUser;
|
||||
api.cases.reassingCase(this.data).then((response) => {
|
||||
if (response.statusText == "OK") {
|
||||
that.$refs["modal-reassign-case"].hide();
|
||||
that.$parent.$refs["vueTable"].getData();
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
Reference in New Issue
Block a user