PMCORE-2698: My Cases > 'user information' does not display as tooltip for each Case

add mailto

fix unassigned
This commit is contained in:
Rodrigo Quelca
2021-01-14 15:39:53 +00:00
parent f3d4dbca42
commit a75f0f31d1
7 changed files with 92 additions and 217 deletions

View File

@@ -10,13 +10,34 @@
<div class="col ellipsis" v-b-popover.hover.top="item.TAS_NAME">
{{ item.TAS_NAME }}
</div>
<div class="avatar">
<div class="avatar" :id="id">
<b-avatar
variant="info"
:src="item.AVATAR"
size="1.2em"
size="2em"
></b-avatar>
</div>
<b-popover
:target="id"
placement="top"
ref="popover"
triggers="hover"
>
<b-row >
<b-col md="3">
<b-avatar
variant="info"
:src="item.AVATAR"
size="4em"
></b-avatar>
</b-col>
<b-col md="9">
<div class="font-weight-bold">{{item.USERNAME}}</div>
<div v-if="item.POSITION !== ''">{{item.POSITION}}</div>
<b-link :href="mailto(item.EMAIL)" >{{item.EMAIL}}</b-link>
</b-col>
</b-row>
</b-popover>
</div>
</div>
</template>
@@ -29,6 +50,7 @@ export default {
return {
//Color map for ["In Progress", "overdue", "inDraft", "paused", "unnasigned"]
colorMap: ["green", "red", "orange", "aqua", "silver"],
id: "avatar-" + _.random(1000000)
};
},
methods: {
@@ -40,13 +62,20 @@ export default {
activeColor: function(codeColor) {
return this.colorMap[codeColor - 1];
},
mailto: function(email) {
return "mailto:" + email;
}
}
};
</script>
<style>
<style>
.popover {
max-width: 600px !important;
min-width: 200px !important;
}
.grouped-cell {
font-size: smaller;
font-size: small;
}
.ellipsis {
@@ -55,9 +84,7 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
}
.color {
color: red;
}
.avatar {

View File

@@ -89,6 +89,7 @@ import AdvancedFilter from "../components/search/AdvancedFilter";
import TaskCell from "../components/vuetable/TaskCell.vue";
import ModalComments from "./modal/ModalComments.vue";
import api from "./../api/index";
import utils from "./../utils/utils";
export default {
name: "AdvancedSearch",
@@ -262,49 +263,16 @@ export default {
dataFormat = [];
for (i = 0; i < data.length; i += 1) {
dataFormat.push({
USER_DATA: this.nameFormatCases(
data[i].usr_firstname,
data[i].usr_lastname,
data[i].usr_username
)
USER_DATA: utils.userNameDisplayFormat({
userName: data[i].usr_firstname,
firstName: data[i].usr_lastname,
lastName: data[i].usr_username,
format: window.config.FORMATS.format || null
}),
});
}
return dataFormat;
},
/**
* Get for user format name configured in Processmaker Environment Settings
*
* @param {string} name
* @param {string} lastName
* @param {string} userName
* @return {string} nameFormat
*/
nameFormatCases(name, lastName, userName) {
let nameFormat = "";
if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
return nameFormat;
}
if (this.nameFormat === "@firstName @lastName") {
nameFormat = name + " " + lastName;
} else if (this.nameFormat === "@firstName @lastName (@userName)") {
nameFormat = name + " " + lastName + " (" + userName + ")";
} else if (this.nameFormat === "@userName") {
nameFormat = userName;
} else if (this.nameFormat === "@userName (@firstName @lastName)") {
nameFormat = userName + " (" + name + " " + lastName + ")";
} else if (this.nameFormat === "@lastName @firstName") {
nameFormat = lastName + " " + name;
} else if (this.nameFormat === "@lastName, @firstName") {
nameFormat = lastName + ", " + name;
} else if (
this.nameFormat === "@lastName, @firstName (@userName)"
) {
nameFormat = lastName + ", " + name + " (" + userName + ")";
} else {
nameFormat = name + " " + lastName;
}
return nameFormat;
},
/**
* Convert string to date format
*

View File

@@ -71,6 +71,7 @@ import MyCasesFilter from "../components/search/MyCasesFilter";
import ModalComments from "./modal/ModalComments.vue";
import GroupedCell from "../components/vuetable/GroupedCell.vue";
import api from "./../api/index";
import utils from "./../utils/utils";
export default {
name: "MyCases",
@@ -301,47 +302,23 @@ export default {
{
TAS_NAME: data[i].tas_title,
STATUS: data[i].tas_color,
PENDING: "",
DELAYED_MSG: data[i].delay
DELAYED_MSG: data[i].delay,
AVATAR: window.config.SYS_SERVER +
window.config.SYS_URI +
`users/users_ViewPhotoGrid?pUID=${data[i].user_id}`,
USERNAME: utils.userNameDisplayFormat({
userName: data[i].user_tooltip.usr_username,
firstName: data[i].user_tooltip.usr_firstname,
lastName: data[i].user_tooltip.usr_lastname,
format: window.config.FORMATS.format || null
}),
POSITION: data[i].user_tooltip.usr_position,
EMAIL: data[i].user_tooltip.usr_email
}
);
}
return dataFormat;
},
/**
* Get for user format name configured in Processmaker Environment Settings
*
* @param {string} name
* @param {string} lastName
* @param {string} userName
* @return {string} nameFormat
*/
nameFormatCases(name, lastName, userName) {
let nameFormat = "";
if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
return nameFormat;
}
if (this.nameFormat === "@firstName @lastName") {
nameFormat = name + " " + lastName;
} else if (this.nameFormat === "@firstName @lastName (@userName)") {
nameFormat = name + " " + lastName + " (" + userName + ")";
} else if (this.nameFormat === "@userName") {
nameFormat = userName;
} else if (this.nameFormat === "@userName (@firstName @lastName)") {
nameFormat = userName + " (" + name + " " + lastName + ")";
} else if (this.nameFormat === "@lastName @firstName") {
nameFormat = lastName + " " + name;
} else if (this.nameFormat === "@lastName, @firstName") {
nameFormat = lastName + ", " + name;
} else if (
this.nameFormat === "@lastName, @firstName (@userName)"
) {
nameFormat = lastName + ", " + name + " (" + userName + ")";
} else {
nameFormat = name + " " + lastName;
}
return nameFormat;
},
/**
* Convert string to date format
*

View File

@@ -34,15 +34,8 @@
<TaskCell :data="props.row.TASK" />
</div>
<div slot="current_user" slot-scope="props">
{{
nameFormatCases(
props.row.USR_FIRSTNAME,
props.row.USR_LASTNAME,
props.row.USR_USERNAME
)
}}
{{ props.row.USERNAME_DISPLAY_FORMAT }}
</div>
<div slot="due_date" slot-scope="props">
{{ props.row.DUE_DATE }}
</div>
@@ -71,6 +64,7 @@ import CasesFilter from "../components/search/CasesFilter";
import TaskCell from "../components/vuetable/TaskCell.vue";
import ModalUnpauseCase from "./modal/ModalUnpauseCase.vue";
import api from "./../api/index";
import utils from "./../utils/utils";
export default {
name: "Paused",
@@ -216,9 +210,12 @@ export default {
CODE_COLOR: v.TAS_COLOR,
COLOR: v.TAS_COLOR_LABEL,
}],
USR_FIRSTNAME: v.USR_FIRSTNAME,
USR_LASTNAME: v.USR_LASTNAME,
USR_USERNAME: v.USR_USERNAME,
USERNAME_DISPLAY_FORMAT: utils.userNameDisplayFormat({
userName: v.USR_LASTNAME,
firstName: v.USR_LASTNAME,
lastName: v.USR_LASTNAME,
format: window.config.FORMATS.format || null
}),
DUE_DATE: v.DEL_TASK_DUE_DATE_LABEL,
DELEGATION_DATE: v.DEL_DELEGATE_DATE_LABEL,
PRIORITY: v.DEL_PRIORITY_LABEL,
@@ -230,38 +227,6 @@ export default {
});
return data;
},
/**
* Get for user format name configured in Processmaker Environment Settings
*
* @param {string} name
* @param {string} lastName
* @param {string} userName
* @return {string} nameFormat
*/
nameFormatCases(name, lastName, userName) {
let nameFormat = "";
if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
return nameFormat;
}
if (this.nameFormat === "@firstName @lastName") {
nameFormat = name + " " + lastName;
} else if (this.nameFormat === "@firstName @lastName (@userName)") {
nameFormat = name + " " + lastName + " (" + userName + ")";
} else if (this.nameFormat === "@userName") {
nameFormat = userName;
} else if (this.nameFormat === "@userName (@firstName @lastName)") {
nameFormat = userName + " (" + name + " " + lastName + ")";
} else if (this.nameFormat === "@lastName @firstName") {
nameFormat = lastName + " " + name;
} else if (this.nameFormat === "@lastName, @firstName") {
nameFormat = lastName + ", " + name;
} else if (this.nameFormat === "@lastName, @firstName (@userName)") {
nameFormat = lastName + ", " + name + " (" + userName + ")";
} else {
nameFormat = name + " " + lastName;
}
return nameFormat;
},
/**
* Open case detail
*

View File

@@ -34,15 +34,8 @@
<TaskCell :data="props.row.TASK" />
</div>
<div slot="current_user" slot-scope="props">
{{
nameFormatCases(
props.row.USR_FIRSTNAME,
props.row.USR_LASTNAME,
props.row.USR_USERNAME
)
}}
{{ props.row.USERNAME_DISPLAY_FORMAT}}
</div>
<div slot="due_date" slot-scope="props">
{{ props.row.DUE_DATE }}
</div>
@@ -66,6 +59,7 @@ import ModalNewRequest from "./ModalNewRequest.vue";
import TaskCell from "../components/vuetable/TaskCell.vue";
import CasesFilter from "../components/search/CasesFilter";
import api from "./../api/index";
import utils from "./../utils/utils";
export default {
name: "Todo",
@@ -208,9 +202,12 @@ export default {
CODE_COLOR: v.TAS_COLOR,
COLOR: v.TAS_COLOR_LABEL,
}],
USR_FIRSTNAME: v.USR_FIRSTNAME,
USR_LASTNAME: v.USR_LASTNAME,
USR_USERNAME: v.USR_USERNAME,
USERNAME_DISPLAY_FORMAT: utils.userNameDisplayFormat({
userName: v.USR_LASTNAME,
firstName: v.USR_LASTNAME,
lastName: v.USR_LASTNAME,
format: window.config.FORMATS.format || null
}),
DUE_DATE: v.DEL_TASK_DUE_DATE_LABEL,
DELEGATION_DATE: v.DEL_DELEGATE_DATE_LABEL,
PRIORITY: v.DEL_PRIORITY_LABEL,
@@ -222,38 +219,6 @@ export default {
});
return data;
},
/**
* Get for user format name configured in Processmaker Environment Settings
*
* @param {string} name
* @param {string} lastName
* @param {string} userName
* @return {string} nameFormat
*/
nameFormatCases(name, lastName, userName) {
let nameFormat = "";
if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
return nameFormat;
}
if (this.nameFormat === "@firstName @lastName") {
nameFormat = name + " " + lastName;
} else if (this.nameFormat === "@firstName @lastName (@userName)") {
nameFormat = name + " " + lastName + " (" + userName + ")";
} else if (this.nameFormat === "@userName") {
nameFormat = userName;
} else if (this.nameFormat === "@userName (@firstName @lastName)") {
nameFormat = userName + " (" + name + " " + lastName + ")";
} else if (this.nameFormat === "@lastName @firstName") {
nameFormat = lastName + " " + name;
} else if (this.nameFormat === "@lastName, @firstName") {
nameFormat = lastName + ", " + name;
} else if (this.nameFormat === "@lastName, @firstName (@userName)") {
nameFormat = lastName + ", " + name + " (" + userName + ")";
} else {
nameFormat = name + " " + lastName;
}
return nameFormat;
},
/**
* Open selected cases in the inbox
*

View File

@@ -33,16 +33,6 @@
<div slot="task" slot-scope="props">
<TaskCell :data="props.row.TASK" />
</div>
<div slot="current_user" slot-scope="props">
{{
nameFormatCases(
props.row.USR_FIRSTNAME,
props.row.USR_LASTNAME,
props.row.USR_USERNAME
)
}}
</div>
<div slot="due_date" slot-scope="props">
{{ props.row.DUE_DATE }}
</div>
@@ -95,7 +85,6 @@ export default {
"case_title",
"process_name",
"task",
"current_user",
"due_date",
"delegation_date",
"priority",
@@ -213,9 +202,6 @@ export default {
CODE_COLOR: v.TAS_COLOR,
COLOR: v.TAS_COLOR_LABEL,
}],
USR_FIRSTNAME: v.USR_FIRSTNAME,
USR_LASTNAME: v.USR_LASTNAME,
USR_USERNAME: v.USR_USERNAME,
DUE_DATE: v.DEL_TASK_DUE_DATE_LABEL,
DELEGATION_DATE: v.DEL_DELEGATE_DATE_LABEL,
PRIORITY: v.DEL_PRIORITY_LABEL,
@@ -227,42 +213,6 @@ export default {
});
return data;
},
/**
* Get for user format name configured in Processmaker Environment Settings
*
* @param {string} name
* @param {string} lastName
* @param {string} userName
* @return {string} nameFormat
*/
nameFormatCases(name, lastName, userName) {
let nameFormat = "";
if (!(name && lastName && userName)) {
return "";
}
if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
return nameFormat;
}
if (this.nameFormat === "@firstName @lastName") {
nameFormat = name + " " + lastName;
} else if (this.nameFormat === "@firstName @lastName (@userName)") {
nameFormat = name + " " + lastName + " (" + userName + ")";
} else if (this.nameFormat === "@userName") {
nameFormat = userName;
} else if (this.nameFormat === "@userName (@firstName @lastName)") {
nameFormat = userName + " (" + name + " " + lastName + ")";
} else if (this.nameFormat === "@lastName @firstName") {
nameFormat = lastName + " " + name;
} else if (this.nameFormat === "@lastName, @firstName") {
nameFormat = lastName + ", " + name;
} else if (this.nameFormat === "@lastName, @firstName (@userName)") {
nameFormat = lastName + ", " + name + " (" + userName + ")";
} else {
nameFormat = name + " " + lastName;
}
return nameFormat;
},
/**
* Claim case
*

View File

@@ -0,0 +1,23 @@
import _ from "lodash";
export default {
/**
* Environment Formats function for full name
* @param {object} params
*/
userNameDisplayFormat(params) {
let aux;
let defaultValues = {
userName: '',
firstName: '',
lastName: '',
format: '(@lastName, @firstName) @userName'
};
_.assignIn(defaultValues, params);
console.log(defaultValues);
aux = defaultValues.format;
aux = aux.replace('@userName',defaultValues.userName);
aux = aux.replace('@firstName',defaultValues.firstName);
aux = aux.replace('@lastName',defaultValues.lastName);
return aux;
}
}