fb0b2b6b0f41579f532655ae93b77af2.json 21 KB

1
  1. {"remainingRequest":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\boman-framwork\\ruoyi-ui\\src\\components\\FlowChartShow\\index.vue?vue&type=style&index=0&id=3878c0b0&lang=scss&scoped=true&","dependencies":[{"path":"E:\\boman-framwork\\ruoyi-ui\\src\\components\\FlowChartShow\\index.vue","mtime":1619607677258},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\css-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoNCi5GbG93Q2hhcnRTaG93ew0KICB3aWR0aDogMTAwJTsNCiAgaGVpZ2h0OiA1NjhweDsNCiAgcGFkZGluZzogMTZweDsNCiAgYm94LXNpemluZzogYm9yZGVyLWJveDsNCiAgZGlzcGxheTogZmxleDsNCiAgZmxleC1kaXJlY3Rpb246IHJvdzsNCg0KICAudGl0bGV7DQogICAgICBoZWlnaHQ6IDIwcHg7DQogICAgICBtYXJnaW4tYm90dG9tOiAxNnB4Ow0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQoNCiAgICAgID5zcGFuew0KICAgICAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7DQogICAgICAgIHdpZHRoOjRweDsNCiAgICAgICAgaGVpZ2h0OjIwcHg7DQogICAgICAgIGJhY2tncm91bmQ6cmdiYSgyMTYsMjE2LDIxNiwxKTsNCiAgICAgICAgbWFyZ2luLXJpZ2h0OiA5cHg7DQogICAgICB9DQoNCiAgICAgID5wew0KICAgICAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7DQogICAgICAgIGZvbnQtc2l6ZToxNHB4Ow0KICAgICAgICBmb250LXdlaWdodDo1MDA7DQogICAgICAgIGNvbG9yOnJnYmEoMCwwLDAsMSk7DQogICAgICAgIGxpbmUtaGVpZ2h0OjIwcHg7DQoNCiAgICAgICAgPnNwYW4uc3RhdHVzew0KICAgICAgICAgIGNvbG9yOiAjMDlBMTU1Ow0KICAgICAgICB9DQogICAgICB9DQogICAgfQ0KDQogIC5mbG93RGlzcGxheXsNCiAgICBmbGV4OiAxOw0KICAgIG1hcmdpbi1yaWdodDogMzJweDsNCiAgICBkaXNwbGF5OiBmbGV4Ow0KICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47DQoNCiAgICAjbXlGbG93RGVzaWduZXJEaXZ7DQogICAgICBmbGV4OiAxOw0KICAgIH0NCiAgfQ0KDQogIC5hcHByb3ZhbEhpc3Rvcnl7DQogICAgZmxleDogMTsNCiAgICBkaXNwbGF5OiBmbGV4Ow0KICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47DQogICAgb3ZlcmZsb3c6IGhpZGRlbjsNCg0KDQogICAgLmFwcHJvdmFsew0KICAgICAgZmxleDogMTsNCiAgICAgIG92ZXJmbG93OiBhdXRvOw0KICAgICAgcGFkZGluZy10b3A6IDJweDsNCiAgICB9DQoNCiAgICAuYXBwcm92YWxJdGVtew0KICAgICAgcGFkZGluZzogMTBweCA4cHggOXB4IDE5cHg7DQogICAgICBiYWNrZ3JvdW5kOnJnYmEoMjQ5LDI0OSwyNDksMSk7DQoNCiAgICAgIC5hcHByb3ZhbEl0ZW1UaXRsZXsNCiAgICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuOw0KICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyOw0KICAgICAgICBtYXJnaW4tYm90dG9tOiA5cHg7DQoNCiAgICAgICAgPnA6bGFzdC1jaGlsZHsNCiAgICAgICAgICBkaXNwbGF5OiBmbGV4Ow0KICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQoNCiAgICAgICAgICA+aXsNCiAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiAxM3B4Ow0KICAgICAgICAgICAgY3Vyc29yOiBwb2ludGVyOw0KICAgICAgICAgIH0NCiAgICAgICAgfQ0KICAgICAgfQ0KDQogICAgICAubGlua3NFcnJvcnsNCiAgICAgICAgcHsNCiAgICAgICAgICBtYXJnaW4tYm90dG9tOiAxMHB4Ow0KDQogICAgICAgICAgPnNwYW57DQogICAgICAgICAgICBtYXJnaW4tbGVmdDogOHB4Ow0KICAgICAgICAgIH0NCg0KDQogICAgICAgICAgJjpudGgtbGFzdC1jaGlsZCgyKXsNCiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyOw0KICAgICAgICAgIH0NCg0KICAgICAgICAgIC5jaGVja1NlbGVjdHsNCiAgICAgICAgICAgIGRpc3BsYXk6IGlubGluZS1ibG9jazsNCiAgICAgICAgICAgIGZsZXg6IDE7DQoNCiAgICAgICAgICAgIC5idXJnZW9uLXNlbGVjdC1zZWxlY3Rpb257DQogICAgICAgICAgICAgIGJvcmRlci1jb2xvcjogI2RjZGVlMjsNCiAgICAgICAgICAgICAgYm94LXNoYWRvdzogbm9uZTsNCiAgICAgICAgICAgIH0NCg0KICAgICAgICAgICAgJjpmaXJzdC1jaGlsZHsNCiAgICAgICAgICAgICAgd2lkdGg6IDYwcHg7DQogICAgICAgICAgICAgIGZsZXg6IG5vbmU7DQogICAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiA4cHg7DQogICAgICAgICAgICAgIC5idXJnZW9uLXNlbGVjdC1zZWxlY3Rpb257DQogICAgICAgICAgICAgICAgYmFja2dyb3VuZDogI0Y5RjlGOTsNCiAgICAgICAgICAgICAgICBib3JkZXItdG9wLXJpZ2h0LXJhZGl1czogMDsNCiAgICAgICAgICAgICAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMDsNCiAgICAgICAgICAgICAgfQ0KICAgICAgICAgICAgfQ0KDQogICAgICAgICAgICAmOmxhc3QtY2hpbGR7DQogICAgICAgICAgICAgIC5idXJnZW9uLXNlbGVjdC1zZWxlY3Rpb257DQogICAgICAgICAgICAgICAgYm9yZGVyLWxlZnQ6IG5vbmU7DQogICAgICAgICAgICAgICAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogMDsNCiAgICAgICAgICAgICAgICBib3JkZXItYm90dG9tLWxlZnQtcmFkaXVzOiAwOw0KICAgICAgICAgICAgICB9DQogICAgICAgICAgICB9DQogICAgICAgICAgfQ0KICAgICAgICB9DQogICAgICB9DQogICAgfQ0KDQogICAgLmJ1cmdlb24tdGltZWxpbmUtaXRlbXsNCiAgICAgICAgICBpew0KICAgICAgICAgICAgZm9udC1zaXplOiAxMnB4Ow0KICAgICAgICAgIH0NCg0KICAgICAgICAgIGkuc3VjY2Vzc3sNCiAgICAgICAgICAgIGNvbG9yOiAjMDlBMTU1DQogICAgICAgICAgfQ0KDQogICAgICAgICAgaS5iYWNrew0KICAgICAgICAgICAgY29sb3I6ICNFRDQwMTQNCiAgICAgICAgICB9DQoNCiAgICAgICAgICBpLmFwcHJvdmFsew0KICAgICAgICAgICAgY29sb3I6ICNDOEM4QzgNCiAgICAgICAgICB9DQogICAgICAgIH0NCiAgfQ0KfQ0KDQo="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8TA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/FlowChartShow","sourcesContent":["<template>\r\n <div class=\"FlowChartShow\">\r\n <div class=\"flowDisplay\">\r\n <div class=\"title\">\r\n <span></span>\r\n <p>\r\n 流程进度 - <span class=\"status\" :style=\"processStyle\">{{processStatusName}}</span>\r\n </p>\r\n </div>\r\n <div id=\"myFlowDesignerDiv\" ></div>\r\n </div>\r\n <div class=\"approvalHistory\">\r\n <div class=\"title\">\r\n <span></span>\r\n <p>\r\n 审批历史\r\n </p>\r\n </div>\r\n <div class=\"approval\">\r\n <Timeline>\r\n <TimelineItem color=\"green\" v-for=\"(item,index) in approvalHistory\" :key=\"index\">\r\n <Icon type=\"iconbj_round\" slot=\"dot\" class=\"approval\" v-if=\"item.status === 2\"></Icon>\r\n <Icon type=\"iconbj_round\" slot=\"dot\" class=\"success\" v-if=\"item.status === 0\"></Icon>\r\n <Icon type=\"iconbj_round\" slot=\"dot\" class=\"back\" v-if=\"[1,-1,-3,5,33].indexOf(item.status) >= 0\"></Icon>\r\n <div class=\"approvalItem\" v-if=\"item.nodeType !== 1 && item.nodeType !== 2 && item.status !== -3\">\r\n <div class=\"approvalItemTitle\">\r\n <p v-if=\"item.status === 2\">待 {{item.nodeName}} 审核</p>\r\n <p v-if=\"item.status === 0\">\r\n {{item.nodeName}} <span style=\"color:#09A155\">{{item.statusName}}</span>\r\n </p>\r\n <p v-if=\"item.status === 1\">\r\n {{item.nodeName}} <span style=\"color:#ED4014\">驳回</span>至 {{item.backNodeName}}\r\n </p>\r\n\r\n <p v-if=\"item.status === -1\">\r\n {{item.nodeName}} 关闭\r\n </p>\r\n\r\n <p v-if=\"item.status === -3\">\r\n {{item.nodeName}} 已撤销\r\n </p>\r\n <p v-if=\"Number(item.status) === 5\" style=\"color:#ED4014\">\r\n 条件不符\r\n </p>\r\n <p v-if=\"Number(item.status) === 33\" style=\"color:#ED4014\">\r\n {{item.nodeName}}审核 节点报错\r\n </p>\r\n <p>\r\n <span v-if=\"item.status === 2\">已等待{{item.elapsedTime}}</span>\r\n <span v-if=\"item.status !== 2\">耗时{{item.elapsedTime}}</span>\r\n <i class=\"iconfont iconios-arrow-up\" v-if=\"item.flag\" @click=\"folding(item)\"></i>\r\n <i class=\"iconfont iconios-arrow-down\" v-if=\"!item.flag\" @click=\"folding(item)\"></i>\r\n </p>\r\n </div>\r\n <div class=\"approvalItemContent\" v-show=\"item.flag\" >\r\n <Table border :columns=\"columns\" :data=\"item.approvalLists\" v-if=\"item.nodeType !== undefined\"></Table>\r\n <!-- 连线报错 -->\r\n <div v-if=\"Number(item.status) === 5\" class=\"linksError\">\r\n <p>流程报错:<span>{{item.errorType}}</span></p>\r\n <p>错误简述:<span>{{item.errorMsg}}</span></p>\r\n <p>人工干预:<span>{{item.actType}}至{{item.manualNode}}审核</span></p>\r\n </div>\r\n <!-- 节点报错 -->\r\n <div v-if=\"Number(item.status) ===33\" class=\"linksError\">\r\n <p>流程报错:<span>{{item.errorType}}</span></p>\r\n <p>错误简述:<span>{{item.errorMsg}}</span></p>\r\n <p>人工干预:<span>更改节点审批人为 {{item.approvalName}}</span></p>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"approvalItem\" v-if=\"item.nodeType === 1\">\r\n 开始进入审批\r\n </div>\r\n\r\n <div class=\"approvalItem\" v-if=\"item.nodeType === 2\">\r\n 审批结束\r\n </div>\r\n\r\n <div class=\"approvalItem\" v-if=\"item.status === -3\">\r\n 发起人{{item.initiatorName}}已撤销流程\r\n </div>\r\n </TimelineItem>\r\n </Timeline>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</template>\r\n<script>\r\nimport '../../utils/go'\r\nimport FlowDisplay from '../../utils/flow-display';\r\nimport {\r\n addGenflowshow\r\n } from \"@/api/activiti/definition\";\r\nexport default {\r\n name:'FlowChartShow',\r\n props:{\r\n instanceId:{\r\n type:[Number,String]\r\n }\r\n },\r\n data(){\r\n return {\r\n data:{},\r\n myDiagram:{},\r\n myDisplay:{},\r\n flowTableShow:false,\r\n approvalHistory:[\r\n // {\r\n // flag:true, //控制审批详情展示\r\n // status:3, //状态\r\n // statusName:'同意', //状态中文名\r\n // elapsedTime: '23h34m', //消耗时间\r\n // nodeName:'总经理', //审批人\r\n // backNodeName:'开始节点', //驳回节点名称\r\n // approvalLists:[\r\n // {\r\n // approvalName:'张敏',\r\n // approvalOperation:'同意',\r\n // approvalStatus:0, //审批人操作状态:0同意;1驳回\r\n // approvalOpinions: '可以,没问题'\r\n // },\r\n // {\r\n // approvalName:'张敏',\r\n // approvalOperation:'待审批',\r\n // approvalStatus:3, //审批人操作状态:0同意;1驳回\r\n // approvalOpinions: '可以,没问题'\r\n // }\r\n // ]\r\n // }\r\n ],\r\n columns:[\r\n {\r\n title: '审批人',\r\n key: 'approvalName',\r\n render:(h,params) => {\r\n return h('p',{\r\n style:{\r\n 'display':'flex',\r\n 'align-items':'center'\r\n }\r\n },[\r\n h('i',{\r\n class:`iconfont ${params.row.approverType === 2?'iconios-people':'iconios-person'}`,\r\n style:{\r\n 'margin-right':'5px'\r\n }\r\n },null),\r\n h('span',{\r\n\r\n },params.row.approvalName),\r\n ])\r\n }\r\n },\r\n {\r\n title: '审批操作',\r\n key: 'approvalOperation',\r\n render:(h,params) => {\r\n // 同意\r\n if(params.row.approvalStatus === 0){\r\n return h('span',{\r\n style:{\r\n color:'#09A155'\r\n }\r\n },params.row.approvalOperation)\r\n }\r\n // 驳回\r\n if(params.row.approvalStatus === 1){\r\n return h('span',{\r\n style:{\r\n color:'#ED4014'\r\n }\r\n },params.row.approvalOperation)\r\n }\r\n\r\n // 关闭\r\n\r\n if(params.row.approvalStatus === -1 || params.row.approvalStatus === -3){\r\n return h('span',{\r\n style:{\r\n color:'#ED4014'\r\n }\r\n },params.row.approvalOperation)\r\n }\r\n\r\n // 待审批\r\n if(params.row.approvalStatus === 2){\r\n return h('span',{\r\n\r\n },params.row.approvalOperation)\r\n }\r\n\r\n\r\n\r\n }\r\n },\r\n {\r\n title: '审批意见',\r\n key: 'approvalOpinions'\r\n }\r\n ],\r\n processStatus:null, //流程状态\r\n processStatusName:'', //流程状态中文\r\n processStyle:{}, //流程进度样式\r\n showNodes:'', //所以经过的节点\r\n }\r\n },\r\n mounted () {\r\n this.$nextTick(() => {\r\n this.getChartInfo()\r\n })\r\n },\r\n methods:{\r\n // 获取流程图信息\r\n getChartInfo () {\r\n let id = this.instanceId?this.instanceId:this.$route.query.instanceId\r\n addGenflowshow()\r\n .then(res => {\r\n if(res.data.resultCode === 0){\r\n let guiStyle = res.data.data.guiStyle?JSON.parse(res.data.data.guiStyle):{}\r\n let approvalHistory = res.data.data.guiValue?res.data.data.guiValue:[]\r\n this.myDiagram = Object.assign(this.myDiagram,guiStyle)\r\n this.approvalHistory = approvalHistory\r\n if(res.data.data.showNodes.indexOf(res.data.data.currentNode) >= 0){\r\n res.data.data.showNodes.splice(res.data.data.showNodes.findIndex(item => item === res.data.data.currentNode), 1)\r\n }\r\n res.data.data.showNodes.push(res.data.data.currentNode)\r\n this.showNodes = res.data.data.showNodes\r\n this.processStatus = res.data.data.processStatus\r\n switch(res.data.data.processStatus){\r\n case 0:\r\n this.processStyle = {\r\n color:'#C8C8C8'\r\n };\r\n break;\r\n case 1:\r\n this.processStyle = {\r\n color:'#FFA51F'\r\n };\r\n break;\r\n case 2:\r\n this.processStyle = {\r\n color:'#ED4014'\r\n };\r\n break;\r\n case 3:\r\n case 4:\r\n this.processStyle = {\r\n color:'#09A155'\r\n };\r\n break;\r\n case -1:\r\n case -3:\r\n this.processStyle = {\r\n color:'#ED4014'\r\n };\r\n break;\r\n }\r\n this.processStatusName = res.data.data.processStatusName\r\n this.myDisplay = new FlowDisplay('myFlowDesignerDiv');\r\n this.showFlowPath(this.myDisplay,res.data.data.currentNode)\r\n }\r\n });\r\n\r\n },\r\n showFlowPath (myDisplay,currentNodeId) {\r\n var flowPath = this.getFinishedNodes(currentNodeId);\r\n myDisplay.loadFlow(this.myDiagram);\r\n // this.getErrorLinks(currentNodeId)\r\n // myDisplay.loadFlow(this.myDiagram);\r\n let isEnd = false\r\n\r\n if(this.processStatus === -1 || this.processStatus === -3){\r\n isEnd = true\r\n }\r\n myDisplay.animateFlowPath(flowPath,[], false, isEnd);\r\n },\r\n getFinishedNodes (currentNodeId) {\r\n let nodeArr = this.getNode()\r\n\r\n return nodeArr\r\n },\r\n getNode () { //获取通过的节点key\r\n // currentNode\r\n let currentNodeKeys = []\r\n this.showNodes.map(item => {\r\n this.myDiagram.nodeDataArray.every(temp => {\r\n if(temp.id === item){\r\n currentNodeKeys.push(temp.key)\r\n return false\r\n }\r\n return true\r\n })\r\n })\r\n\r\n return currentNodeKeys.join(',')\r\n },\r\n getErrorLinks (currentNodeId) {\r\n let currentNodeKey = null\r\n this.myDiagram.nodeDataArray.every(temp => {\r\n if(temp.id === currentNodeId){\r\n currentNodeKey = temp.key\r\n return false\r\n }\r\n return true\r\n })\r\n this.myDisplay.diagram.findNodeForKey(String(currentNodeKey)).findLinksOutOf().each(item => {\r\n console.log(item)\r\n })\r\n },\r\n folding (item) { //控制历史折叠\r\n item.flag = !item.flag\r\n }\r\n }\r\n}\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n.FlowChartShow{\r\n width: 100%;\r\n height: 568px;\r\n padding: 16px;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: row;\r\n\r\n .title{\r\n height: 20px;\r\n margin-bottom: 16px;\r\n display: flex;\r\n align-items: center;\r\n\r\n >span{\r\n display: inline-block;\r\n width:4px;\r\n height:20px;\r\n background:rgba(216,216,216,1);\r\n margin-right: 9px;\r\n }\r\n\r\n >p{\r\n display: inline-block;\r\n font-size:14px;\r\n font-weight:500;\r\n color:rgba(0,0,0,1);\r\n line-height:20px;\r\n\r\n >span.status{\r\n color: #09A155;\r\n }\r\n }\r\n }\r\n\r\n .flowDisplay{\r\n flex: 1;\r\n margin-right: 32px;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n #myFlowDesignerDiv{\r\n flex: 1;\r\n }\r\n }\r\n\r\n .approvalHistory{\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n overflow: hidden;\r\n\r\n\r\n .approval{\r\n flex: 1;\r\n overflow: auto;\r\n padding-top: 2px;\r\n }\r\n\r\n .approvalItem{\r\n padding: 10px 8px 9px 19px;\r\n background:rgba(249,249,249,1);\r\n\r\n .approvalItemTitle{\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 9px;\r\n\r\n >p:last-child{\r\n display: flex;\r\n align-items: center;\r\n\r\n >i{\r\n margin-left: 13px;\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .linksError{\r\n p{\r\n margin-bottom: 10px;\r\n\r\n >span{\r\n margin-left: 8px;\r\n }\r\n\r\n\r\n &:nth-last-child(2){\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .checkSelect{\r\n display: inline-block;\r\n flex: 1;\r\n\r\n .burgeon-select-selection{\r\n border-color: #dcdee2;\r\n box-shadow: none;\r\n }\r\n\r\n &:first-child{\r\n width: 60px;\r\n flex: none;\r\n margin-left: 8px;\r\n .burgeon-select-selection{\r\n background: #F9F9F9;\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n }\r\n }\r\n\r\n &:last-child{\r\n .burgeon-select-selection{\r\n border-left: none;\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .burgeon-timeline-item{\r\n i{\r\n font-size: 12px;\r\n }\r\n\r\n i.success{\r\n color: #09A155\r\n }\r\n\r\n i.back{\r\n color: #ED4014\r\n }\r\n\r\n i.approval{\r\n color: #C8C8C8\r\n }\r\n }\r\n }\r\n}\r\n\r\n</style>\r\n"]}]}