工具发布流程和使用申请流程细节优化

This commit is contained in:
liukang
2024-08-27 18:18:10 +08:00
parent 7c099c852b
commit 12caaecf88
6 changed files with 159 additions and 376 deletions

View File

@@ -89,13 +89,11 @@
@click="handleAdd"
v-hasPermi="['system:user:add']"
>工具发布</el-button>
<!-- <el-button type="primary" icon="el-icon-position">发布</el-button> -->
<!-- <el-button icon="el-icon-thumb" @click="applyUse()">申请使用</el-button> -->
<el-button icon="el-icon-delete">批量删除</el-button>
<el-button icon="el-icon-delete" @click="handleDelete(selection)">批量删除</el-button>
<el-button icon="el-icon-download" @click="exoportDrawerOpen = true">导出</el-button>
</div><!--operate 操作按钮-->
<el-table v-loading="loading" :data="toolList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center" />
<el-table-column type="selection" width="50" align="center" :selectable="selectable"/>
<el-table-column label="工具编号" align="center" key="toolCode" prop="toolCode" v-if="columns[0].visible" />
<el-table-column label="工具名称" align="center" key="toolName" prop="toolName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
<el-table-column label="工具类别" align="center" key="toolType" prop="toolType" v-if="columns[2].visible" :show-overflow-tooltip="true" >
@@ -125,16 +123,14 @@
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button type="text" icon="el-icon-info" @click="applyUse(scope.row)">申请使用</el-button>
<el-button type="text" icon="el-icon-info" v-if="scope.row.recordStatus==='done'" @click="applyUse(scope.row)">申请使用</el-button>
<el-button type="text" icon="el-icon-info" @click="handleDetail(scope.row)">详情</el-button>
<el-button type="text" icon="el-icon-download">下载</el-button>
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['tool:edit', 'tool:remove']">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-button type="text" icon="el-icon-download" v-if="scope.row.recordStatus==='done'">下载</el-button>
<el-dropdown size="mini" v-if="selectable(scope.row)" @command="(command) => handleCommand(command, scope.row)">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right" >更多</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="handleUpdate" icon="el-icon-edit"
v-hasPermi="['tool:edit']">编辑</el-dropdown-item>
<el-dropdown-item command="handleDelete" icon="el-icon-delete"
v-hasPermi="['tool:remove']">删除</el-dropdown-item>
<el-dropdown-item command="handleUpdate" icon="el-icon-edit">编辑</el-dropdown-item>
<el-dropdown-item command="handleDelete" icon="el-icon-delete">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
@@ -150,164 +146,6 @@
</div><!--rt -->
</el-card><!--el-card-->
<!-- 添加或修改工具信息对话框 -->
<el-drawer :visible.sync="addDrawerOpen" size="75%" @open="openEvent">
<template #title>
<span>新增工具</span>
<div class="drawer-head-btn">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div><!--drawer-head-btn 抽屉顶部按钮区域-->
</template>
<div class="el-form-border">
<el-form ref="form" :model="form" :rules="rules" label-width="150px">
<div>
<div class="box-title">
基本信息
</div>
<el-row>
<el-col :span="12">
<el-form-item label="工具编号" prop="toolCode">
<el-input v-model="form.toolCode" placeholder="请输入工具编号"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="工具名称" prop="toolName">
<el-input v-model="form.toolName" placeholder="请输入工具名称"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="负责人" prop="toolPrincipals">
<el-input v-model="form.toolPrincipalsName" placeholder="请选择负责人" maxlength="11" @focus="toolPrincipalsChoose = true"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="归属部门" prop="toolRespDept">
<treeselect v-model="form.toolRespDept" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="工具来源" prop="toolSource">
<el-input v-model="form.toolSource" placeholder="请输入工具来源"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="工具用途" prop="toolUse">
<el-input v-model="form.toolUse" placeholder="请输入工具用途" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="工具类别">
<el-select v-model="form.toolType" placeholder="请选择工具类别" style="width: 100%">
<el-option
v-for="dict in dict.type.tool_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态">
<el-radio-group v-model="form.status">
<el-radio
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="测试情况">
<el-input v-model="form.testSituation" type="textarea" :rows="3" maxlength="500" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="功能描述">
<el-input v-model="form.functionDesc" type="textarea" :rows="3" maxlength="500" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="适用条件">
<el-input v-model="form.applyCondition" type="textarea" :rows="3" maxlength="500" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="操作说明">
<el-input v-model="form.operateExplain" type="textarea" :rows="3" maxlength="500" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="备注">
<el-input v-model="form.remark" type="textarea" :rows="3" maxlength="500" show-word-limit></el-input>
</el-form-item>
</el-col>
</el-row>
</div>
<div>
<div class="box-title">
关联附件
</div>
<div class="operate">
<el-button type="primary" icon="el-icon-upload2" @click="handleDocAdd">上传</el-button>
<el-button icon="el-icon-delete">删除</el-button>
</div><!--operate 操作按钮-->
<el-table :data="docList" style="width: 100%">
<el-table-column type="selection" width="50" align="center"> </el-table-column>
<el-table-column label="文档名称" prop="docName" :show-overflow-tooltip="true" />
<el-table-column label="类别" prop="docType" :show-overflow-tooltip="true" width="80" />
<el-table-column label="负责人" prop="docPrincipals" :show-overflow-tooltip="true" width="80" />
<el-table-column label="归属部门" prop="docRespDept" :show-overflow-tooltip="true" width="150" />
<el-table-column label="来源" prop="docSource" width="100" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="180">
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handlePriew(scope.row)"
>预览</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button>
<el-button type="text" icon="el-icon-download">下载</el-button>
</template>
</el-table-column>
</el-table><!--el-table-->
</div>
</el-form>
<!-- 上传 -->
<AddDoc :show.sync="addDocShow" toolId="1111" @callback="openEvent"/>
</div><!--el-form-border 表单-->
</el-drawer><!--el-drawer 新增抽屉-->
<!-- 工具申请使用对话框 -->
<el-drawer :visible.sync="applyDrawerOpen" size="75%">
<template #title>
@@ -408,18 +246,15 @@
<tool-detail ref="toolDetailRef" :toolDetail="toolDetail"/>
</el-drawer><!--el-drawer 详情-抽屉-->
<bl-user-selector ref="peopleSelect" :type="'single'" :isCheck="true" :open="toolPrincipalsChoose" @cancel="toolPrincipalsChoose=false" @submit="submitPeople"></bl-user-selector>
</div><!--app-container-->
</template>
<script>
import { listDocument } from "@/api/document/document";
import { listTool, getTool, delTool, addTool, updateTool } from "@/api/tool/tool";
import { deptTreeSelect } from "@/api/system/user";
import { getToken } from "@/utils/auth";
import { Base64 } from 'js-base64'
import Treeselect from "@riophae/vue-treeselect";
import blUserSelector from "@/components/user-selector/src/user-selector";
import toolDetail from "./toolDetail";
import AddDoc from './AddDoc'
import mainComponent from "@/components/mainComponent/index.vue";
@@ -427,9 +262,10 @@ import mainComponent from "@/components/mainComponent/index.vue";
export default {
name: "User",
dicts: ['sys_normal_disable', 'tool_type'],
components: { Treeselect, blUserSelector, toolDetail, AddDoc,mainComponent },
components: { Treeselect, toolDetail, AddDoc,mainComponent },
data() {
return {
userInfo: this.$store.getters.userInfo,
drawerShow: false,
path: 'views/workflowList/addWorkflow/',
code: '',
@@ -444,6 +280,7 @@ export default {
multiple: true,
// 显示搜索条件
showSearch: true,
selection: undefined,
toolPrincipalsChoose: false,
// 总条数
total: 0,
@@ -500,7 +337,8 @@ export default {
pageSize: 10,
toolCode: undefined,
toolName: undefined,
status: undefined
status: undefined,
createBy: this.$store.getters.userId
},
// 列信息
columns: [
@@ -512,33 +350,8 @@ export default {
{ key: 5, label: `状态`, visible: true },
{ key: 6, label: `创建时间`, visible: true }
],
// 表单校验
rules: {
toolCode: [
{ required: true, message: "工具编号不能为空", trigger: "blur" },
{ min: 2, max: 30, message: '工具编号长度必须介于 2 和 30 之间', trigger: 'blur' }
],
toolName: [
{ required: true, message: "工具名称不能为空", trigger: "blur" },
{ max: 50, message: '工具名称不能超过50个字', trigger: 'blur' }
],
toolPrincipals: [
{ required: true, message: "负责人不能为空", trigger: "blur" }
],
toolSource: [
{ max: 50, message: '工具来源不能超过50个字', trigger: 'blur' }
],
toolUse: [
{ max: 50, message: '工具用途不能超过50个字', trigger: 'blur' }
]
},
// 新增时的关联附件
docList: [],
docQueryParams: {
pageNum: 1,
pageSize: 10,
toolId: ''
},
addDocShow: false,
viewDialogOpen: false,
viewDialogTitle: '',
@@ -572,12 +385,6 @@ export default {
},
handleClick(){
},
submitPeople(peopleList){
console.log(peopleList);
this.form.toolPrincipals = peopleList[0]['userId']
this.form.toolPrincipalsName = peopleList[0]['nickName']
this.toolPrincipalsChoose = false;
},
/** 查询用户列表 */
getList() {
@@ -647,7 +454,7 @@ export default {
/**=============================申请使用Start================================*/
applyUse(row){
let _this = this
_this.handleOpen({...row,type:'use_apply'})
_this.handleOpen({...row,type:'use_apply',procInstId:undefined})
},
submitApply(){
@@ -671,9 +478,10 @@ export default {
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.userId);
this.single = selection.length != 1;
this.multiple = !selection.length;
this.selection=selection
// this.ids = selection.map(item => item.userId);
// this.single = selection.length != 1;
// this.multiple = !selection.length;
},
handleDetail(row){
this.detailDrawerOpen = true
@@ -686,7 +494,7 @@ export default {
this.handleUpdate(row);
break;
case "handleDelete":
this.handleDelete(row);
this.handleDelete([{...row}]);
break;
default:
break;
@@ -694,14 +502,6 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
// this.reset();
// getTool().then(response => {
// this.postOptions = response.posts;
// this.roleOptions = response.roles;
// this.addDrawerOpen = true;
// this.title = "添加工具";
// this.form.password = this.initPassword;
// });
let _this = this
_this.handleOpen({type:'tool_release'})
},
@@ -713,61 +513,12 @@ export default {
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const toolId = row.toolId || this.ids;
getTool(toolId).then(response => {
this.form = response.data;
this.postOptions = response.posts;
this.roleOptions = response.roles;
this.$set(this.form, "postIds", response.postIds);
this.$set(this.form, "roleIds", response.roleIds);
this.addDrawerOpen = true;
this.title = "修改工具";
this.form.password = "";
});
let _this = this
_this.handleOpen({type:'tool_release',procInstId:row.procInstId,status:'1'})
},
/** 发布按钮操作 */
handlePublish(row) {
},
/** 提交按钮 */
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.userId != undefined) {
updateTool(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.addDrawerOpen = false;
this.getList();
});
} else {
addTool(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.addDrawerOpen = false;
this.getList();
}).catch((e) => {
if (e.response.data.code === 400001001) {
let deptName = this.getDeptName(this.deptOptions, this.form.toolRespDept)
this.$alert('<strong>' + deptName + '</strong> 下已存在编号为 <strong>' + this.form.toolCode + '</strong> 的工具,请勿重复添加!', '提示', {
dangerouslyUseHTMLString: true,
confirmButtonText: '确定',
callback: action => { }
})
}
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const toolIds = row.toolId || this.ids;
this.$modal.confirm('是否确认删除?').then(function() {
return delTool(toolIds);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download('system/user/export', {
@@ -793,21 +544,41 @@ export default {
submitFileForm() {
this.$refs.upload.submit();
},
/**
* 打开新增页面的回调事件
*/
openEvent() {
this.loading = true
this.docQueryParams.toolId = '1111'
listDocument(this.queryParams).then(response => {
this.docList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
handleClose(){
this.drawerShow = false
this.getList();
},
handleDelete(list){
let _this = this
if (!list||list.length<1) {
return
}
_this.$modal.confirm('删除后该流程待办任务将会被删除请谨慎操作是否确认执行')
.then(async() => {
_this.loading = true
for (let row of list) {
let formData = {
toolId: row.toolId,
bpmClientInputModel: {
model: {
wf_procInstId: row.procInstId,
wf_sendUserId: _this.userInfo.userName,
wf_sendUserOrgId: _this.userInfo.deptId,
},
},
review: false,
recordStatus: 'cancel',
editStatus: false
}
await addTool(formData)
}
_this.$modal.msgSuccess("删除成功");
_this.loading = false
_this.getList();
})
},
selectable(row,index){
return row.recordStatus==='draft'&&row.createBy==this.userInfo.userId
}
}
};