1
0
mirror of https://github.com/PanJiaChen/vue-element-admin.git synced 2025-08-11 13:39:48 +08:00

add popover of Workflow log (#284)

* Add popover to Workflow Log

* delete italic format

* change funtion
This commit is contained in:
elsiosanchez 2020-01-29 17:26:25 -04:00 committed by GitHub
parent fefe39d9f9
commit f446bf6142
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 165 additions and 125 deletions

View File

@ -273,7 +273,13 @@ export default {
notes: 'Notes',
changeLog: 'Change Log',
workflowLog: 'Workflow Log',
changeDetail: 'Detalle del cambio'
changeDetail: 'Detalle del cambio',
logWorkflow: {
message: 'Message',
responsible: 'Responsible',
workflowName: 'Name of Workflow Status',
timeElapsed: 'Time Elapsed'
}
}
},
data: {

View File

@ -248,7 +248,13 @@ export default {
notes: 'Notas',
changeLog: 'Histórico de Cambios',
workflowLog: 'Histórico de Flujo de Trabajo',
changeDetail: 'Detalle del cambio'
changeDetail: 'Detalle del cambio',
logWorkflow: {
message: 'Mensaje',
responsible: 'Responsable',
workflowName: 'Nombre de estado del flujo de trabajo',
timeElapsed: 'Tiempo transcurrido'
}
}
},
data: {

View File

@ -53,7 +53,6 @@ const containerInfo = {
const pageToken = 0
return requestListWorkflows({ tableName, pageSize, pageToken })
.then(response => {
console.log(response)
commit('addListWorkflows', response)
})
.catch(error => {

View File

@ -205,6 +205,77 @@ export function convertFieldListToShareLink(fieldList) {
return attributesListLink.slice(0, -1)
}
/**
* Find element in an array recursively
* @param {object|array} treeData
* @param {string} attributeName, key to get value, default id
* @param {mixed} attributeValue, value to compare with search
* @param {string} attributeChilds, childs list into element
*/
export const recursiveTreeSearch = ({
treeData,
attributeValue,
attributeName = 'id',
secondAttribute = false,
attributeChilds = 'childsList',
isParent = false
}) => {
if (Array.isArray(treeData)) {
let index = 0
const length = treeData.length
while (index < length) {
let value = treeData[index]
if (!isEmptyValue(value) && value.hasOwnProperty(attributeName)) {
value = value[attributeName]
}
if (!isEmptyValue(value) && secondAttribute && value.hasOwnProperty(secondAttribute)) {
value = value[secondAttribute]
}
// compare item to search
if (value === attributeValue) {
return treeData[index]
}
if (treeData[index] && treeData[index][attributeChilds]) {
const found = recursiveTreeSearch({
treeData: treeData[index][attributeChilds],
attributeValue,
attributeName,
secondAttribute,
attributeChilds,
isParent
})
if (found) {
return found
}
}
index++
}
} else {
let value = treeData
if (!isEmptyValue(value) && value.hasOwnProperty(attributeName)) {
value = value[attributeName]
}
if (!isEmptyValue(value) && secondAttribute && value.hasOwnProperty(secondAttribute)) {
value = value[secondAttribute]
}
// compare item to search
if (value === attributeValue) {
return treeData
}
const found = recursiveTreeSearch({
treeData: treeData[attributeChilds],
attributeValue,
attributeName,
secondAttribute,
attributeChilds
})
return found
}
}
/**
*
@ -290,76 +361,3 @@ export function parsedValueComponent({ fieldType, value, referenceType, isMandat
}
return returnValue
}
/**
* Find element in an array recursively
* @param {object|array} treeData
* @param {string} attributeName, key to get value, default id
* @param {mixed} attributeValue, value to compare with search
* @param {string} attributeChilds, childs list into element
*/
export const recursiveTreeSearch = ({
treeData,
attributeValue,
attributeName = 'id',
secondAttribute = false,
attributeChilds = 'childsList',
isParent = false
}) => {
if (Array.isArray(treeData)) {
let index = 0
const length = treeData.length
while (index < length) {
// ESTA MIERDA NO SIRVE PORQUE LOS ATRIBTO
let value = treeData[index]
if (!isEmptyValue(value) && value.hasOwnProperty(attributeName)) {
value = value[attributeName]
}
if (!isEmptyValue(value) && secondAttribute && value.hasOwnProperty(secondAttribute)) {
value = value[secondAttribute]
}
// compare item to search
if (value === attributeValue) {
return treeData[index]
}
if (treeData[index] && treeData[index][attributeChilds]) {
const found = recursiveTreeSearch({
treeData: treeData[index][attributeChilds],
attributeValue,
attributeName,
secondAttribute,
attributeChilds,
isParent
})
if (found) {
return found
}
}
index++
}
} else {
let value = treeData
if (!isEmptyValue(value) && value.hasOwnProperty(attributeName)) {
value = value[attributeName]
}
if (!isEmptyValue(value) && secondAttribute && value.hasOwnProperty(secondAttribute)) {
value = value[secondAttribute]
}
// compare item to search
if (value === attributeValue) {
return treeData
}
const found = recursiveTreeSearch({
treeData: treeData[attributeChilds],
attributeValue,
attributeName,
secondAttribute,
attributeChilds
})
return found
}
}

View File

@ -21,12 +21,14 @@
:icon="iconIsShowedRecordNavigation"
circle
style="margin-left: 10px;"
class="el-button-window"
@click="handleChangeShowedRecordNavigation()"
/>
<el-button
v-show="!isPanel"
:icon="iconIsShowedAside"
circle
class="el-button-window"
@click="handleChangeShowedPanel()"
/>
</div>
@ -42,6 +44,7 @@
v-show="isPanel"
icon="el-icon-caret-left"
circle
class="el-button-window"
@click="handleChangeShowedPanel()"
/>
</div>
@ -77,7 +80,7 @@
class="tab-window"
/>
<div style="right: 0%;top: 40%;position: absolute;">
<el-button v-show="!show" type="info" icon="el-icon-info" circle style="float: right;" @click="conteInfo" />
<el-button v-show="!show" type="info" icon="el-icon-info" circle style="float: right;" class="el-button-window" @click="conteInfo" />
</div>
<div class="small-4 columns">
<div class="wrapper">
@ -92,6 +95,7 @@
icon="el-icon-caret-top"
:class="classIsMobile"
circle
type="primary"
@click="handleChangeShowedTabChildren()"
/>
</div>
@ -108,6 +112,7 @@
:icon="iconIsShowedRecordNavigation"
class="open-navegation"
circle
type="primary"
@click="handleChangeShowedRecordNavigation()"
/>
</div>
@ -124,6 +129,7 @@
<el-button
icon="el-icon-caret-bottom"
circle
class="el-button-window"
@click="handleChangeShowedTabChildren()"
/>
</div>
@ -145,7 +151,7 @@
<SplitArea :size="show ? 30 : 0">
<el-main>
<div style="top: 40%;position: absolute;">
<el-button v-show="show" type="info" icon="el-icon-info" circle style="float: right;" @click="conteInfo" />
<el-button v-show="show" type="info" icon="el-icon-info" circle style="float: right;" class="el-button-window" @click="conteInfo" />
</div>
<div id="example-1">
<transition name="slide-fade">
@ -163,7 +169,7 @@
v-for="(listLogs, index) in getTypeLogs"
:key="index"
>
<el-scrollbar wrap-class="scroll">
<el-scrollbar wrap-class="scroll-window-log-change">
<el-timeline>
<el-timeline-item
v-for="(evenType, key) in listLogs.logs"
@ -180,7 +186,7 @@
<br>
<el-collapse-transition>
<div v-show="(currentKey === key) && (typeAction === index)" :key="key" class="text item">
<span><p><b><i> {{ evenType.displayColumnName }}: </i></b> <strike>{{ evenType.oldDisplayValue }} </strike> {{ evenType.newDisplayValue }}</p></span>
<span><p><b> {{ evenType.displayColumnName }}: </b> <strike>{{ evenType.oldDisplayValue }} </strike> {{ evenType.newDisplayValue }}</p></span>
</div>
</el-collapse-transition>
</el-card>
@ -208,6 +214,7 @@
<el-card
class="box-card"
>
<el-scrollbar wrap-class="scroll-window-log-workflow">
<el-timeline>
<el-timeline-item
v-for="(workflow,index) in gettersListWorkflow"
@ -221,22 +228,35 @@
</div>
<div>
<el-steps
:space="200"
:active="workflow.workflowState"
:active="workflow.workflowEventsList.length"
align-center
process-status="process"
finish-status="success"
>
<el-step
v-for="(nodeList, key) in workflow.workflowEventsList"
:key="key"
:title="nodeList.nodeName"
:description="$t('login.userName')+ '' + nodeList.userName"
/>
>
<span slot="title">
<el-popover
placement="top-start"
width="400"
trigger="hover"
>
<p><b> {{ $t('login.userName') }}:</b> {{ nodeList.userName }} </p>
<p v-if="!isEmptyValue(nodeList.textMessage)"><b> {{ $t('window.containerInfo.logWorkflow.message') }}:</b> {{ nodeList.textMessage }} </p>
<p><b> {{ $t('window.containerInfo.logWorkflow.responsible') }}:</b> {{ nodeList.responsibleName }} </p>
<p><b> {{ $t('window.containerInfo.logWorkflow.workflowName') }}:</b> {{ nodeList.workflowStateName }} </p>
<p><b> {{ $t('window.containerInfo.logWorkflow.timeElapsed') }}:</b> {{ nodeList.timeElapsed }} </p>
<el-button slot="reference" type="text"> {{ nodeList.nodeName }} </el-button>
</el-popover>
</span>
</el-step>
</el-steps>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</el-scrollbar>
</el-card>
</div>
<div
@ -259,6 +279,7 @@
<div slot="header" class="clearfix">
<span>{{ $t('window.containerInfo.notes') }} {{ gettersLisRecordChats[0].description }} </span>
</div>
<el-scrollbar wrap-class="scroll-window-log-chat">
<el-timeline>
<el-timeline-item
v-for="(chats, key) in gettersLischat"
@ -274,6 +295,7 @@
</el-card>
</el-timeline-item>
</el-timeline>
</el-scrollbar>
</el-card>
</div>
<div
@ -771,7 +793,7 @@ export default {
top: 2%;
left: 1%;
}
.el-button {
.el-button-window {
cursor: pointer;
background: #FFFFFF;
border: 1px solid #DCDFE6;
@ -799,6 +821,15 @@ export default {
}
</style>
<style>
.scroll-window-log-change {
max-height: 45vh !important;
}
.scroll-window-log-workflow {
max-height: 68vh !important;
}
.scroll-window-log-chat {
max-height: 68vh !important;
}
.el-card__header {
background: rgba(245, 247, 250, 0.75);
padding: 18px 20px;