clay
/
workflow-engine-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

dengjie commit : 审批详情样式 #9

Merged
odjbin merged 1 commits from DJ into master 2023-01-16 08:01:45 +00:00
Conversation 0 Commits 1 Files Changed 6 +133 -49
6 changed files with 133 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
flowable-engine-web/src/assets/image/s-release.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 275 B

6
flowable-engine-web/src/components/common/Comment.vue
View File

@ -22,7 +22,7 @@
:on-success="handleUploadSuccess" :on-success="handleUploadSuccess"
:before-upload="beforeUpload"> :before-upload="beforeUpload">
<i slot="default" class="el-icon-plus"></i> <i slot="default" class="el-icon-plus"></i>
<div slot="file" slot-scope="{file}" style="width: 65px;height: 65px"> <div slot="file" slot-scope="{file}" >
<img style="width: 100%;height: 100%" :src="file.url" alt=""> <img style="width: 100%;height: 100%" :src="file.url" alt="">
<label class="el-upload-list__item-status-label"> <label class="el-upload-list__item-status-label">
<i class="el-icon-upload-success el-icon-check"></i> <i class="el-icon-upload-success el-icon-check"></i>
@ -69,7 +69,7 @@ export default {
// }, // },
imageSize: { imageSize: {
type: Number, type: Number,
default: 10 default: 5
}, },
attachmentMaxSize: { attachmentMaxSize: {
type: Number, type: Number,
@ -194,7 +194,7 @@ export default {
} }
/deep/ .el-upload-list--picture-card { /deep/ .el-upload-list--picture-card {
.is-ready { .el-upload-list__item {
width: 65px !important; width: 65px !important;
height: 65px !important; height: 65px !important;
} }

2
flowable-engine-web/src/views/common/form/components/ImageUpload.vue
View File

@ -38,7 +38,7 @@
</template> </template>
<template v-else-if="perm === 'R'"> <template v-else-if="perm === 'R'">
<div v-for="(item , index) in _value" :key="index"> <div v-for="(item , index) in _value" :key="index">
<img :src="item.url"> <img :src="item.url" alt="" style="width: 65px;height: 65px">
</div> </div>
</template> </template>
</template> </template>

163
flowable-engine-web/src/views/workspace/DisposalTask.vue
View File

@ -29,7 +29,7 @@
prop="state" prop="state"
label="状态"> label="状态">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag v-if="scope.row.state == 1" >待处理</el-tag> <el-tag v-if="scope.row.state == 1">待处理</el-tag>
<el-tag v-if="scope.row.state == 4" type="success">已同意</el-tag> <el-tag v-if="scope.row.state == 4" type="success">已同意</el-tag>
<el-tag v-if="scope.row.state == 3" type="danger">已拒绝</el-tag> <el-tag v-if="scope.row.state == 3" type="danger">已拒绝</el-tag>
<el-tag v-if="scope.row.state == 2" type="warning">已退回</el-tag> <el-tag v-if="scope.row.state == 2" type="warning">已退回</el-tag>
@ -38,15 +38,53 @@
</el-table> </el-table>
<el-drawer <el-drawer
title="审批详情" title="审批详情"
size="50%" size="500px"
:visible.sync="approveOpen" :visible.sync="approveOpen"
direction="rtl"> direction="rtl">
<div v-loading="loading"> <div v-loading="loading">
<div class="top">
<div class="top_left">
<el-avatar size="large" :src="avatar"></el-avatar>
<span style="text-align: center;color: #19191a;font-size: 14px;">Clay</span>
</div>
<div class="top_right">
<div style="margin-bottom: 12px">
<span style="font-size: 15px;margin-right: 15px">财务</span>
<el-tag style="font-size: 12px" size="mini">进行中</el-tag>
</div>
<div>
<span style="color: rgb(108, 108, 108);" >编号: d69e9582-873f-11ed-b0e7-fa28000d2c27</span>
</div>
</div>
</div>
<div style="height: 15px;background:#f5f5f5;"></div>
<form-render-view ref="taskViewForm" :form-items="taskData.formItems" <form-render-view ref="taskViewForm" :form-items="taskData.formItems"
v-model="taskData.formData"/> v-model="taskData.formData"/>
<!-- <process-diagram-viewer/>--> <!-- <process-diagram-viewer/>-->
<el-button type="success" @click="submitTask()">通过</el-button> <div style="height: 15px;background:#f5f5f5;"></div>
<el-button type="success" @click="$refs.comment.show()">评论</el-button> <footer class="footer">
<div class="footer_comment" @click="$refs.comment.show()">
<i class="el-icon-chat-line-round" style="font-size: 18px;"></i>
<span style="font-size: 12px;">评论</span>
</div>
<div style="margin-right: 20px;">
<el-dropdown>
<span class="el-dropdown-link" style="color: #2a99ff">
更多<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-s-custom">转交</el-dropdown-item>
<el-dropdown-item icon="el-icon-s-release">退回</el-dropdown-item>
<el-dropdown-item icon="el-icon-s-check">加签</el-dropdown-item>
<el-dropdown-item icon="el-icon-refresh-left">撤销</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-button type="danger" size="mini" plain round style="margin-left: 20px">拒绝</el-button>
<el-button type="primary" size="mini" round @click="submitTask()">同意</el-button>
</div>
<!-- <el-button type="success" @click="submitTask()">通过</el-button>-->
<!-- <el-button type="success" @click="$refs.comment.show()">评论</el-button>-->
</footer>
</div> </div>
</el-drawer> </el-drawer>
<comment ref="comment" :max-size="5" :attachment-max-size="10" @ok="commentConfirm"/> <comment ref="comment" :max-size="5" :attachment-max-size="10" @ok="commentConfirm"/>
@ -55,9 +93,9 @@
<script> <script>
import Comment from "../../components/common/Comment"; import Comment from "../../components/common/Comment";
import FormRenderView from '@/views/common/form/FormRender' import FormRenderView from "@/views/common/form/FormRender";
import ProcessDiagramViewer from "../admin/layout/ProcessDiagramViewer"; import ProcessDiagramViewer from "../admin/layout/ProcessDiagramViewer";
import {addComment, completeTask, getTaskInfo, getTaskList} from "../../api/task"; import {addComment, completeTask, getTaskInfo, getTaskList} from "@/api/task";
export default { export default {
name: "DisposalTask", name: "DisposalTask",
@ -71,8 +109,9 @@ export default {
taskData: { taskData: {
formData: {}, formData: {},
formItems: [], formItems: [],
processList: [], processList: []
} },
avatar: require("@/assets/image/avatar.png")
}; };
}, },
created() { created() {
@ -81,61 +120,105 @@ export default {
methods: { methods: {
clickRow(row) { clickRow(row) {
this.approveOpen = true; this.approveOpen = true;
this.loadProcessTask(row.taskId) this.loadProcessTask(row.taskId);
this.selectTask = row this.selectTask = row;
}, },
getList() { getList() {
getTaskList().then(res => { getTaskList().then(res => {
let data = res.data let data = res.data;
this.tableData = data.rows this.tableData = data.rows;
}) });
}, },
init() { init() {
this.taskData = { this.taskData = {
formData: {}, formData: {},
formItems: [], formItems: [],
processList: [], processList: []
} };
this.loading = true this.loading = true;
this.$store.state.design = this.taskData this.$store.state.design = this.taskData;
this.$store.state.runningList = [] this.$store.state.runningList = [];
this.$store.state.endList = [] this.$store.state.endList = [];
this.$store.state.noTakeList = [] this.$store.state.noTakeList = [];
this.$store.state.diagramMode = 'viewer' this.$store.state.diagramMode = "viewer";
this.$store.state.preview = false; this.$store.state.preview = false;
}, },
loadProcessTask(taskId) { loadProcessTask(taskId) {
let that = this let that = this;
this.init() this.init();
getTaskInfo(taskId).then(res => { getTaskInfo(taskId).then(res => {
that.taskData = res.data that.taskData = res.data;
that.$store.state.design = that.taskData that.$store.state.design = that.taskData;
that.$store.state.runningList = that.taskData.runningList that.$store.state.runningList = that.taskData.runningList;
that.$store.state.endList = that.taskData.endList that.$store.state.endList = that.taskData.endList;
that.$store.state.noTakeList = that.taskData.noTakeList that.$store.state.noTakeList = that.taskData.noTakeList;
this.loading = false this.loading = false;
}) });
}, },
submitTask() { submitTask() {
let params = { let params = {
taskId: this.selectTask.taskId, taskId: this.selectTask.taskId,
formData: JSON.stringify(this.taskData.formData) formData: JSON.stringify(this.taskData.formData)
} };
completeTask(params).then(res => { completeTask(params).then(res => {
this.approveOpen = false this.approveOpen = false;
this.getList() this.getList();
this.$message.success(res.msg) this.$message.success(res.msg);
}) });
}, },
commentConfirm(data) { commentConfirm(data) {
this.$set(data, "taskId", this.selectTask.taskId) this.$set(data, "taskId", this.selectTask.taskId);
addComment(data).then(res => { addComment(data).then(res => {
this.$message.success(res.msg) this.$message.success(res.msg);
}) });
} }
} }
}; };
</script> </script>
<style scoped lang="scss">
<style scoped lang="scss">
.top{
padding: 0 10px 10px 10px;
display: flex;
.top_left {
display: flex;
flex-direction: column;
width: 50px;
align-items: center;
}
.top_right{
display: flex;
flex-direction: column;
//justify-content: space-between;
font-size: 13px;
margin-left: 10px;
}
}
.footer {
display: flex;
justify-content: space-between;
align-items: center;
height: 30px;
padding: 15px 0;
position: absolute;
width: 100%;
bottom: 0;
left: 0;
z-index: 99;
background: #fff;
border-top: 1px solid #dcdfe6;
box-shadow: 0 0 15px 0 #dad8d8;
.footer_comment {
text-align: center;
display: flex;
flex-direction: column;
margin-left: 20px;
}
/deep/ .el-dropdown-menu {
top: -5px !important;
}
}
</style> </style>

4
flowable-engine-web/src/views/workspace/InitiatedInstance.vue
View File

@ -61,10 +61,10 @@
</template> </template>
<script> <script>
import Comment from "../../components/common/Comment"; import Comment from "@/components/common/Comment";
import FormRenderView from '@/views/common/form/FormRender' import FormRenderView from '@/views/common/form/FormRender'
import ProcessDiagramViewer from "../admin/layout/ProcessDiagramViewer"; import ProcessDiagramViewer from "../admin/layout/ProcessDiagramViewer";
import {getInitiatedInstanceList} from "../../api/processInstance"; import {getInitiatedInstanceList} from "@/api/processInstance";
export default { export default {
name: "InitiatedInstance", name: "InitiatedInstance",

5
flowable-engine-web/src/views/workspace/WorkSpace.vue
View File

@ -51,7 +51,7 @@
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<el-dialog title="发起审批" :visible.sync="openItemDl" :close-on-click-modal="false"> <el-dialog title="发起审批" :visible.sync="openItemDl" :close-on-click-modal="true">
<initiate-process ref="processInstance" :code="selectForm.processDefinitionKey" v-if="openItemDl"></initiate-process> <initiate-process ref="processInstance" :code="selectForm.processDefinitionKey" v-if="openItemDl"></initiate-process>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button size="mini" @click="openItemDl = false">取 消</el-button> <el-button size="mini" @click="openItemDl = false">取 消</el-button>
@ -126,9 +126,10 @@ export default {
processInstance.validate(valid => { processInstance.validate(valid => {
if (valid) { if (valid) {
startProcessInstance(paramsData).then(res=>{ startProcessInstance(paramsData).then(res=>{
this.openItemDl = false
this.$message.success(res.msg) this.$message.success(res.msg)
this.$refs.disposalTask.getList() this.$refs.disposalTask.getList()
this.openItemDl = false
}) })
} else { } else {
this.$message.warning("请完善表单😥") this.$message.warning("请完善表单😥")