style: 更换流程审批记录显示样式

approve-sys
tony 2 years ago
parent 335a8b5910
commit d6af63c74d

@ -45,10 +45,13 @@ GitHubhttps://github.com/tony2y/RuoYi-flowable.git
## 演示图 ## 演示图
<img src="https://images.gitee.com/uploads/images/2021/0407/212557_dfb07bda_2042292.png"/>
<img src="https://images.gitee.com/uploads/images/2021/0407/212707_fc51e817_2042292.png"/>
<img src="https://images.gitee.com/uploads/images/2021/0407/212924_eb53cb0f_2042292.png"/> <img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650592628945-a819547e-c1ab-41c9-bade-8661247bfe32.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>
<img src="https://images.gitee.com/uploads/images/2021/0708/113619_496e5f03_2042292.png"/> <img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650592838746-dfa8ff8a-976a-45dc-8eb9-2956f53dd80b.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>
<img src="https://images.gitee.com/uploads/images/2021/0407/213126_462c4290_2042292.png"/> <img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650592878258-f070969a-0cfe-4061-9f32-bfd48b7a1b38.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>
<img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650592922889-feeb7796-b2f9-4fed-8328-bb341029a17f.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>
<img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650593066174-d8f2ba48-bf4b-4338-95d1-6118ce592641.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>
<img src="https://cdn.nlark.com/yuque/0/2022/png/1260343/1650620568092-46dd293a-0ea9-4ac0-8475-24a7d03f5db9.png?x-oss-process=image%2Fresize%2Cw_1500%2Climit_0"/>

@ -2367,8 +2367,8 @@
}, },
"async-validator": { "async-validator": {
"version": "1.8.5", "version": "1.8.5",
"resolved": "https://registry.npm.taobao.org/async-validator/download/async-validator-1.8.5.tgz?cache=0&sync_timestamp=1605749896979&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fasync-validator%2Fdownload%2Fasync-validator-1.8.5.tgz", "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.8.5.tgz",
"integrity": "sha1-3D4I7B/Q3dtn5ghC8CwM0c7G1/A=", "integrity": "sha512-tXBM+1m056MAX0E8TL2iCjg8WvSyXu0Zc8LNtYqrVeyoL3+esHRZ4SieE9fKQyyU09uONjnMEjrNBMqT0mbvmA==",
"requires": { "requires": {
"babel-runtime": "6.x" "babel-runtime": "6.x"
} }
@ -2500,7 +2500,7 @@
}, },
"babel-runtime": { "babel-runtime": {
"version": "6.26.0", "version": "6.26.0",
"resolved": "https://registry.npm.taobao.org/babel-runtime/download/babel-runtime-6.26.0.tgz", "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
"integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=", "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
"requires": { "requires": {
"core-js": "^2.4.0", "core-js": "^2.4.0",
@ -2509,13 +2509,13 @@
"dependencies": { "dependencies": {
"core-js": { "core-js": {
"version": "2.6.12", "version": "2.6.12",
"resolved": "https://registry.npm.taobao.org/core-js/download/core-js-2.6.12.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha1-2TM9+nsGXjR8xWgiGdb2kIWcwuw=" "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
}, },
"regenerator-runtime": { "regenerator-runtime": {
"version": "0.11.1", "version": "0.11.1",
"resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.11.1.tgz", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
"integrity": "sha1-vgWtf5v30i4Fb5cmzuUBf78Z4uk=" "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
} }
} }
}, },
@ -2730,6 +2730,29 @@
"min-dom": "^3.1.3", "min-dom": "^3.1.3",
"object-refs": "^0.3.0", "object-refs": "^0.3.0",
"tiny-svg": "^2.2.2" "tiny-svg": "^2.2.2"
},
"dependencies": {
"diagram-js": {
"version": "6.8.2",
"resolved": "https://registry.npmjs.org/diagram-js/-/diagram-js-6.8.2.tgz",
"integrity": "sha512-5EKYHjW2mmGsn9/jSenSkm8cScK5sO9eETBRQNIIzgZjxBDJn6eX964L2d7/vrAW9SeuijGUsztL9+NUinSsNg==",
"requires": {
"css.escape": "^1.5.1",
"didi": "^4.0.0",
"hammerjs": "^2.0.1",
"inherits": "^2.0.1",
"min-dash": "^3.5.0",
"min-dom": "^3.1.2",
"object-refs": "^0.3.0",
"path-intersection": "^2.2.0",
"tiny-svg": "^2.2.1"
}
},
"path-intersection": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/path-intersection/-/path-intersection-2.2.1.tgz",
"integrity": "sha512-9u8xvMcSfuOiStv9bPdnRJQhGQXLKurew94n4GPQCdH1nj9QKC9ObbNoIpiRq8skiOBxKkt277PgOoFgAt3/rA=="
}
} }
}, },
"bpmn-moddle": { "bpmn-moddle": {
@ -4693,18 +4716,18 @@
"dev": true "dev": true
}, },
"diagram-js": { "diagram-js": {
"version": "6.8.2", "version": "5.1.1",
"resolved": "https://registry.npm.taobao.org/diagram-js/download/diagram-js-6.8.2.tgz?cache=0&sync_timestamp=1615817403305&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdiagram-js%2Fdownload%2Fdiagram-js-6.8.2.tgz", "resolved": "https://registry.npmjs.org/diagram-js/-/diagram-js-5.1.1.tgz",
"integrity": "sha1-08N5FcYsDMXZW8UzCYyKNbOOZ74=", "integrity": "sha512-SLxHOfEDLBC7LBjQFmXyvQXt4P5yZYFnTvhsCZZtJyQCadrVs71cUlchMmH+kUS/zaga/BkPWFbnV1d+4MsF8A==",
"requires": { "requires": {
"css.escape": "^1.5.1", "css.escape": "^1.5.1",
"didi": "^4.0.0", "didi": "^4.0.0",
"hammerjs": "^2.0.1", "hammerjs": "^2.0.1",
"inherits": "^2.0.1", "inherits": "^2.0.1",
"min-dash": "^3.5.0", "min-dash": "^3.5.0",
"min-dom": "^3.1.2", "min-dom": "^3.0.0",
"object-refs": "^0.3.0", "object-refs": "^0.3.0",
"path-intersection": "^2.2.0", "path-intersection": "^1.0.2",
"tiny-svg": "^2.2.1" "tiny-svg": "^2.2.1"
} }
}, },
@ -4719,8 +4742,8 @@
}, },
"didi": { "didi": {
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npm.taobao.org/didi/download/didi-4.0.0.tgz", "resolved": "https://registry.npmjs.org/didi/-/didi-4.0.0.tgz",
"integrity": "sha1-K4nYkqZ/03d/dkLTvwZpe2nptiI=" "integrity": "sha512-AzMElh8mCHOPWPCWfGjoJRla31fMXUT6+287W5ef3IPmtuBcyG9+MkFS7uPP6v3t2Cl086KwWfRB9mESa0OsHQ=="
}, },
"diffie-hellman": { "diffie-hellman": {
"version": "5.0.3", "version": "5.0.3",
@ -4951,9 +4974,9 @@
"dev": true "dev": true
}, },
"element-ui": { "element-ui": {
"version": "2.15.0", "version": "2.15.4",
"resolved": "https://registry.npm.taobao.org/element-ui/download/element-ui-2.15.0.tgz", "resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.15.4.tgz",
"integrity": "sha1-3ptzqNHj47UOgrkjpfqVKVI5vUE=", "integrity": "sha512-b9Tlc6NjygcHv3QNzfPPDQvyAmLdbjQR7q1FMypqFKjowpQzlaL3zlNZ4jrpm0stEBWLeHVIT733z/i6F3o+cA==",
"requires": { "requires": {
"async-validator": "~1.8.1", "async-validator": "~1.8.1",
"babel-helper-vue-jsx-merge-props": "^2.0.0", "babel-helper-vue-jsx-merge-props": "^2.0.0",
@ -6305,7 +6328,7 @@
}, },
"hammerjs": { "hammerjs": {
"version": "2.0.8", "version": "2.0.8",
"resolved": "https://registry.npm.taobao.org/hammerjs/download/hammerjs-2.0.8.tgz", "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
"integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE=" "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
}, },
"handle-thing": { "handle-thing": {
@ -9139,7 +9162,7 @@
}, },
"normalize-wheel": { "normalize-wheel": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npm.taobao.org/normalize-wheel/download/normalize-wheel-1.0.1.tgz", "resolved": "https://registry.npmjs.org/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
"integrity": "sha1-rsiGr/2wRQcNhWRH32Ls+GFG7EU=" "integrity": "sha1-rsiGr/2wRQcNhWRH32Ls+GFG7EU="
}, },
"npm-run-path": { "npm-run-path": {
@ -9636,9 +9659,9 @@
"dev": true "dev": true
}, },
"path-intersection": { "path-intersection": {
"version": "2.2.1", "version": "1.1.1",
"resolved": "https://registry.npm.taobao.org/path-intersection/download/path-intersection-2.2.1.tgz?cache=0&sync_timestamp=1615817402730&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpath-intersection%2Fdownload%2Fpath-intersection-2.2.1.tgz", "resolved": "https://registry.npmjs.org/path-intersection/-/path-intersection-1.1.1.tgz",
"integrity": "sha1-hHa3X++3rEAvgQ0wTg6wwIDBH+c=" "integrity": "sha512-EdeUuXCm0+tb/2gv8PmRhd9fYYOtbDeTYkwCnzkBuAEjevEZi2mWUi1DVFF5nqSObYsxKcchvKUhnRULWOFreQ=="
}, },
"path-is-absolute": { "path-is-absolute": {
"version": "1.0.1", "version": "1.0.1",
@ -11042,8 +11065,8 @@
}, },
"resize-observer-polyfill": { "resize-observer-polyfill": {
"version": "1.5.1", "version": "1.5.1",
"resolved": "https://registry.npm.taobao.org/resize-observer-polyfill/download/resize-observer-polyfill-1.5.1.tgz", "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
"integrity": "sha1-DpAg3T0hAkRY1OvSfiPkAmmBBGQ=" "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
}, },
"resolve": { "resolve": {
"version": "1.20.0", "version": "1.20.0",
@ -12862,8 +12885,8 @@
}, },
"throttle-debounce": { "throttle-debounce": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npm.taobao.org/throttle-debounce/download/throttle-debounce-1.1.0.tgz?cache=0&sync_timestamp=1604313880785&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fthrottle-debounce%2Fdownload%2Fthrottle-debounce-1.1.0.tgz", "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
"integrity": "sha1-UYU9o3vmihVctugns1FKPEIuic0=" "integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
}, },
"through": { "through": {
"version": "2.3.8", "version": "2.3.8",

@ -41,7 +41,7 @@
"clipboard": "2.0.6", "clipboard": "2.0.6",
"core-js": "3.8.1", "core-js": "3.8.1",
"echarts": "4.9.0", "echarts": "4.9.0",
"element-ui": "2.15.0", "element-ui": "2.15.4",
"file-saver": "2.0.4", "file-saver": "2.0.4",
"form-gen-parser": "^1.0.3", "form-gen-parser": "^1.0.3",
"fuse.js": "6.4.3", "fuse.js": "6.4.3",

@ -314,7 +314,7 @@ export default {
this.$router.push({ path: '/flowable/task/record/index', this.$router.push({ path: '/flowable/task/record/index',
query: { query: {
deployId: row.deploymentId, deployId: row.deploymentId,
procDefId:row.id, procDefId: row.id,
finished: true finished: true
} }
}) })

@ -45,17 +45,39 @@
> >
<p style="font-weight: 700">{{item.taskName}}</p> <p style="font-weight: 700">{{item.taskName}}</p>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<label v-if="item.assigneeName" style="font-weight: normal;margin-right: 30px;">实际办理: {{item.assigneeName}} <el-tag type="info" size="mini">{{item.deptName}}</el-tag></label> <el-descriptions class="margin-top" :column="1" size="small" border>
<label v-if="item.candidate" style="font-weight: normal;margin-right: 30px;"> {{item.candidate}}</label> <el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
<label style="font-weight: normal">接收时间 </label><label style="color:#8a909c;font-weight: normal">{{item.createTime}}</label> <template slot="label"><i class="el-icon-user"></i>实际办理</template>
<label v-if="item.finishTime" style="margin-left: 30px;font-weight: normal">办结时间: </label><label style="color:#8a909c;font-weight: normal">{{item.finishTime}}</label> {{item.assigneeName}}
<label v-if="item.duration" style="margin-left: 30px;font-weight: normal">耗时: </label><label style="color:#8a909c;font-weight: normal">{{item.duration}}</label> <el-tag type="info" size="mini">{{item.deptName}}</el-tag>
</el-descriptions-item>
<el-descriptions-item v-if="item.candidate" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
{{item.candidate}}
</el-descriptions-item>
<el-descriptions-item label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
{{item.createTime}}
</el-descriptions-item>
<el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
{{item.finishTime}}
</el-descriptions-item>
<el-descriptions-item v-if="item.duration" label-class-name="my-label">
<template slot="label"><i class="el-icon-time"></i>耗时</template>
{{item.duration}}
</el-descriptions-item>
<el-descriptions-item v-if="item.comment" label-class-name="my-label">
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
{{item.comment.comment}}
</el-descriptions-item>
</el-descriptions>
<p v-if="item.comment"> <!-- <p v-if="item.comment">-->
<el-tag type="success" v-if="item.comment.type === '1'"> {{item.comment.comment}}</el-tag> <!-- <el-tag type="success" v-if="item.comment.type === '1'"> {{item.comment.comment}}</el-tag>-->
<el-tag type="warning" v-if="item.comment.type === '2'"> {{item.comment.comment}}</el-tag> <!-- <el-tag type="warning" v-if="item.comment.type === '2'"> {{item.comment.comment}}</el-tag>-->
<el-tag type="danger" v-if="item.comment.type === '3'"> {{item.comment.comment}}</el-tag> <!-- <el-tag type="danger" v-if="item.comment.type === '3'"> {{item.comment.comment}}</el-tag>-->
</p> <!-- </p>-->
</el-card> </el-card>
</el-timeline-item> </el-timeline-item>
</el-timeline> </el-timeline>
@ -269,19 +291,6 @@ export default {
this.getFlowRecordList( this.taskForm.procInsId, this.taskForm.deployId); this.getFlowRecordList( this.taskForm.procInsId, this.taskForm.deployId);
this.finished = this.$route.query && this.$route.query.finished this.finished = this.$route.query && this.$route.query.finished
}, },
mounted() {
// //
// setTimeout(() => {
// //
// const data = {
// field102: '18836662555'
// }
// //
// this.fillFormData(this.formConf, data)
// //
// this.key = +new Date().getTime()
// }, 1000)
},
methods: { methods: {
/** 查询部门下拉树结构 */ /** 查询部门下拉树结构 */
getTreeselect() { getTreeselect() {
@ -588,4 +597,8 @@ export default {
.el-tag + .el-tag { .el-tag + .el-tag {
margin-left: 10px; margin-left: 10px;
} }
.my-label {
background: #E1F3D8;
}
</style> </style>

Loading…
Cancel
Save