You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
701 lines
19 KiB
701 lines
19 KiB
<template>
|
|
<div class="app-container">
|
|
<div class="filter-container">
|
|
<el-form>
|
|
<el-form-item>
|
|
<el-select
|
|
v-model="listQuery.departmentId"
|
|
placeholder="请选择所属部门"
|
|
style="width: 200px"
|
|
clearable
|
|
>
|
|
<el-option
|
|
v-for="item in listDepartment"
|
|
:key="item.id"
|
|
:label="item.name"
|
|
:value="item.id"
|
|
/>
|
|
</el-select>
|
|
<el-select
|
|
v-model="listQuery.shebeizhongleidaima"
|
|
placeholder="请选择设备种类"
|
|
clearable
|
|
>
|
|
<el-option
|
|
v-for="item in sbzlList"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
<el-select
|
|
v-model="listQuery.bglx"
|
|
placeholder="请选择流程模式"
|
|
style="width: 200px"
|
|
clearable
|
|
>
|
|
<el-option
|
|
v-for="item in modeList"
|
|
:key="item.value"
|
|
:label="item.name"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
<el-button type="primary" icon="el-icon-search" @click="handleFilter">
|
|
查询
|
|
</el-button>
|
|
<el-button type="primary" icon="el-icon-edit" @click="showCreate">
|
|
添加
|
|
</el-button>
|
|
<el-button type="danger" icon="el-icon-delete" @click="delDefinition">
|
|
删除
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<el-table
|
|
:data="list"
|
|
:span-method="listSpanMethod"
|
|
border
|
|
fit
|
|
highlight-current-row
|
|
@selection-change="handleSelectionChange"
|
|
>
|
|
<el-table-column type="selection" width="50" />
|
|
<el-table-column type="index" align="center" label="序号" width="50" />
|
|
<el-table-column
|
|
:formatter="formatterMode"
|
|
align="center"
|
|
label="流程模式"
|
|
prop="mode"
|
|
width="100"
|
|
/>
|
|
<el-table-column align="center" label="归属部门" prop="departmentName" />
|
|
<el-table-column
|
|
align="center"
|
|
label="设备种类"
|
|
prop="shebeizhonglei"
|
|
width="120"
|
|
/>
|
|
<el-table-column
|
|
:formatter="formatterListCategory"
|
|
align="center"
|
|
label="检验类别"
|
|
prop="neibuleibie"
|
|
width="120"
|
|
/>
|
|
<el-table-column
|
|
align="center"
|
|
label="所属环节"
|
|
prop="name"
|
|
width="120"
|
|
/>
|
|
<el-table-column align="center" label="环节处理人" prop="nickname" />
|
|
<el-table-column align="center" fixed="right" label="管理" width="150px">
|
|
<template slot-scope="scope">
|
|
<el-dropdown trigger="hover">
|
|
<el-button
|
|
type="text"
|
|
round
|
|
plain
|
|
class="el-dropdown-link"
|
|
style="color: #13ce66"
|
|
>
|
|
下拉操作<i class="el-icon-arrow-down el-icon--right" />
|
|
</el-button>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item>
|
|
<el-button type="text" @click="showUpdate(scope.$index)">
|
|
修改
|
|
</el-button>
|
|
</el-dropdown-item>
|
|
<el-dropdown-item v-for="link in linkList" v-show="link.mode === scope.row.mode" :key="link.id">
|
|
<el-button
|
|
type="text"
|
|
@click="showUpdateMember(scope.$index, link.id)"
|
|
>
|
|
{{ getLinkName(link) }}
|
|
</el-button>
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<pagination
|
|
v-show="total > 0"
|
|
:total="total"
|
|
:page-num.sync="listQuery.pageNum"
|
|
:page-row.sync="listQuery.pageSize"
|
|
@pagination="getList"
|
|
/>
|
|
<!--打开录入框-->
|
|
<el-dialog
|
|
:title="textMap[dialogStatus]"
|
|
:visible.sync="dialogFormVisible"
|
|
@close="closeDialog"
|
|
>
|
|
<el-form
|
|
ref="formDefinition"
|
|
:model="formDefinition"
|
|
class="small-space"
|
|
label-position="left"
|
|
label-width="80px"
|
|
style="width: 500px; margin-left: 50px"
|
|
>
|
|
<el-form-item label="归属部门">
|
|
<el-select
|
|
v-model="formDefinition.departmentId"
|
|
placeholder="归属部门"
|
|
style="width: 200px"
|
|
>
|
|
<el-option
|
|
v-for="item in listDepartment"
|
|
:key="item.id"
|
|
:label="item.name"
|
|
:value="item.id"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="设备种类">
|
|
<el-select
|
|
v-model="formDefinition.shebeizhongleidaima"
|
|
placeholder="设备类别"
|
|
clearable
|
|
@change="getNblbListBySbzl"
|
|
>
|
|
<el-option
|
|
v-for="item in sbzlList"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="检验类别" prop="jianyanleibie" required>
|
|
<el-select
|
|
v-model="formDefinition.jianyanleibie"
|
|
placeholder="检验类别"
|
|
clearable
|
|
@change="getNblbListByJylb"
|
|
>
|
|
<el-option
|
|
v-for="item in jylbList"
|
|
:key="item.code"
|
|
:label="item.name"
|
|
:value="item.code"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="内部类别" required>
|
|
<el-select
|
|
v-model="neibuleibie"
|
|
multiple
|
|
placeholder="内部类别"
|
|
clearable
|
|
>
|
|
<el-option
|
|
v-for="item in nblbList"
|
|
:key="item.code"
|
|
:label="item.name"
|
|
:value="item.code"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="流程模式" required>
|
|
<el-select v-model="formDefinition.mode" clearable>
|
|
<el-option
|
|
v-for="item in modeList"
|
|
:key="item.value"
|
|
:label="item.name"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="dialogFormVisible = false">
|
|
取 消
|
|
</el-button>
|
|
<el-button
|
|
v-if="dialogStatus === 'create'"
|
|
type="success"
|
|
@click="createDefinition"
|
|
>
|
|
创 建
|
|
</el-button>
|
|
<el-button v-else type="primary" @click="updateDefinition">
|
|
修 改
|
|
</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
<!-- 添加人员 -->
|
|
<el-dialog
|
|
:title="memerTitle"
|
|
:visible.sync="dialogFormMemberVisible"
|
|
>
|
|
<el-row :gutter="20">
|
|
<el-col :span="3">
|
|
<el-button type="primary" icon="el-icon-plus" @click="tableJs.addRow($refs.tableData, { definitionId: definitionId, linkId: linkId })">
|
|
新建
|
|
</el-button>
|
|
</el-col>
|
|
<el-col :offset="1" :span="3">
|
|
<el-button type="danger" icon="el-icon-delete" @click="deleteLink">
|
|
删除
|
|
</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-table
|
|
ref="tableData"
|
|
:data="tableData"
|
|
border
|
|
style="width: 100%"
|
|
>
|
|
<el-table-column align="center" type="selection" width="55" />
|
|
<el-table-column align="center" type="index" label="序号" width="50" />
|
|
<el-table-column align="center" prop="nickname" label="环节人员" width="180">
|
|
<template slot-scope="scope">
|
|
<el-select v-model="scope.row.userId" filterable clearable placeholder="请选择">
|
|
<el-option
|
|
v-for="item in options"
|
|
:key="item.id"
|
|
:label="item.nickname"
|
|
:value="item.id"
|
|
/>
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column align="center" prop="sort" label="排序">
|
|
<template slot-scope="scope">
|
|
<el-input-number
|
|
v-model="scope.row.sort"
|
|
:min="1"
|
|
:max="100"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="dialogFormMemberVisible = false">
|
|
取 消
|
|
</el-button>
|
|
<el-button type="primary" @click="updateLink">
|
|
修 改
|
|
</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import Pagination from '@/components/Pagination'
|
|
import { deleteDefinitionFn } from '@/api/common'
|
|
// import Template from './template.vue'
|
|
export default {
|
|
name: 'FlowDefinition',
|
|
components: { Pagination },
|
|
data() {
|
|
return {
|
|
active: 1,
|
|
total: 0, // 分页组件--数据总条数
|
|
list: [], // 表格的数据
|
|
listQuery: {
|
|
pageNum: 1, // 页码
|
|
pageSize: 20
|
|
},
|
|
textMap: {
|
|
create: '添加环节',
|
|
update: '编辑环节'
|
|
},
|
|
textMapMember: {
|
|
create: '添加人员',
|
|
update: '编辑人员'
|
|
},
|
|
mode: 1,
|
|
sbzlList: [],
|
|
listDepartment: [],
|
|
listLink: [],
|
|
listUser: this.$store.getters.allUser,
|
|
listMemberUser: [],
|
|
formDefinition: {
|
|
neibuleibie: null
|
|
},
|
|
formMember: {},
|
|
jylbList: [],
|
|
nblbList: [],
|
|
modeList: [],
|
|
linkList: [],
|
|
multipleSelection: [],
|
|
dialogFormVisible: false,
|
|
dialogFormMemberVisible: false,
|
|
dialogStatus: 'create',
|
|
neibuleibie: [],
|
|
spanArr: [],
|
|
tableData: [],
|
|
options: [],
|
|
memerTitle: '',
|
|
definitionId: 0,
|
|
linkId: 0,
|
|
linkLabelList: []
|
|
}
|
|
},
|
|
created() {
|
|
this.getList()
|
|
this.getAllDepartment()
|
|
this.getSbList()
|
|
this.getDicDataList('REPORT_CLASS')
|
|
this.getDicDataList('FLOW_LINK')
|
|
this.getJylbList()
|
|
this.getUserList()
|
|
this.getLinkListAll()
|
|
},
|
|
methods: {
|
|
deleteLink() {
|
|
const linkIds = []
|
|
console.log(this.$refs.tableData.selection)
|
|
this.$refs.tableData.selection.forEach(row => {
|
|
if (row.id) {
|
|
linkIds.push(row.id)
|
|
}
|
|
})
|
|
this.api({
|
|
url: '/definition',
|
|
method: 'delete',
|
|
params: {
|
|
ids: linkIds
|
|
}
|
|
}).then(data => {
|
|
this.$notify.sucess('操作成功')
|
|
this.$refs.tableData.selection.forEach(row => this.tableData.splice(this.tableData.indexOf(row), 1))
|
|
})
|
|
},
|
|
getLinkName(link) {
|
|
if (!this.linkLabelList.length) {
|
|
return
|
|
}
|
|
const linkLabel = this.linkLabelList.filter(row => row.value === link.nextName)[0]
|
|
if (!linkLabel) {
|
|
return
|
|
}
|
|
return linkLabel.name
|
|
},
|
|
getLinkListAll() {
|
|
this.api({
|
|
url: '/link/all',
|
|
method: 'get'
|
|
}).then(data => {
|
|
this.linkList = data
|
|
})
|
|
},
|
|
// 获取所有用户
|
|
getUserList() {
|
|
this.api({
|
|
url: '/user/all',
|
|
method: 'get'
|
|
}).then((data) => {
|
|
this.options = data
|
|
})
|
|
},
|
|
getList() {
|
|
// 查询列表
|
|
this.api({
|
|
url: '/definition/list',
|
|
method: 'get',
|
|
params: this.listQuery
|
|
}).then((data) => {
|
|
this.list = data.list
|
|
this.total = data.total
|
|
this.spanArr = []
|
|
this.getSpanArr(this.list)
|
|
})
|
|
},
|
|
getAllDepartment() {
|
|
this.api({
|
|
url: '/department/all',
|
|
method: 'get'
|
|
}).then((data) => {
|
|
this.listDepartment = data
|
|
})
|
|
},
|
|
getSbList() {
|
|
this.api({
|
|
url: '/sedirectory/getList',
|
|
method: 'get',
|
|
params: {
|
|
sbzl: undefined,
|
|
sblb: undefined,
|
|
level: '1'
|
|
}
|
|
}).then((data) => {
|
|
this.sbzlList = data
|
|
})
|
|
},
|
|
getDicDataList(typeCode) {
|
|
this.api({
|
|
url: '/dicData/getDicDataByTypeCode',
|
|
method: 'get',
|
|
params: {
|
|
typeCode: typeCode
|
|
}
|
|
}).then((data) => {
|
|
switch (typeCode) {
|
|
case 'REPORT_CLASS':
|
|
this.modeList = data
|
|
break
|
|
case 'FLOW_LINK':
|
|
this.linkLabelList = data
|
|
break
|
|
default:
|
|
break
|
|
}
|
|
})
|
|
},
|
|
getJylbList() {
|
|
this.getCategoryList('jylb', null, null)
|
|
},
|
|
getNblbListBySbzl(val) {
|
|
const jylb = this.formDefinition.jianyanleibie
|
|
if (jylb === undefined || jylb === '') {
|
|
return false
|
|
}
|
|
this.neibuleibie = []
|
|
this.getCategoryList('nblb', jylb, val)
|
|
},
|
|
getNblbListByJylb(val) {
|
|
const sbzl = this.formDefinition.shebeizhongleidaima
|
|
this.neibuleibie = []
|
|
this.getCategoryList('nblb', val, sbzl)
|
|
},
|
|
getCategoryList(type, parentCode, species) {
|
|
this.api({
|
|
url: '/category/getCategoryList',
|
|
method: 'get',
|
|
params: {
|
|
parentCode: parentCode,
|
|
species: species
|
|
}
|
|
}).then((data) => {
|
|
switch (type) {
|
|
case 'jylb':
|
|
this.jylbList = data
|
|
return ''
|
|
case 'nblb':
|
|
this.nblbList = data
|
|
return ''
|
|
}
|
|
})
|
|
},
|
|
showCreate() {
|
|
this.$set(this.formDefinition, 'mode', 1)
|
|
this.dialogStatus = 'create'
|
|
this.dialogFormVisible = true
|
|
},
|
|
showUpdate($index) {
|
|
this.formDefinition = this.list[$index]
|
|
this.neibuleibie = JSON.parse(this.formDefinition.neibuleibie)
|
|
this.getCategoryList(
|
|
'nblb',
|
|
this.formDefinition.jianyanleibie,
|
|
this.formDefinition.shebeizhongleidaima
|
|
)
|
|
this.dialogStatus = 'update'
|
|
this.dialogFormVisible = true
|
|
},
|
|
showUpdateMember($index, linkId) {
|
|
this.tableData = []
|
|
const row = this.list[$index]
|
|
this.memerTitle = row.name
|
|
this.definitionId = row.id
|
|
this.linkId = linkId
|
|
this.api({
|
|
url: '/member/all',
|
|
method: 'get',
|
|
params: {
|
|
definitionId: row.id,
|
|
linkId: linkId
|
|
}
|
|
}).then(data => {
|
|
this.tableData = data
|
|
this.dialogFormMemberVisible = true
|
|
})
|
|
},
|
|
handleFilter() {
|
|
// 查询事件
|
|
this.listQuery.pageNum = 1
|
|
this.getList()
|
|
},
|
|
getIndex($index) {
|
|
// 表格序号
|
|
return (this.listQuery.pageNum - 1) * this.listQuery.pageRow + $index + 1
|
|
},
|
|
onRowClick(row) {
|
|
this.$refs.list.toggleRowSelection(row)
|
|
},
|
|
handleSelectionChange: function(val) {
|
|
this.multipleSelection = val
|
|
},
|
|
createDefinition() {
|
|
// 添加新模板
|
|
this.$refs['formDefinition'].validate((valid) => {
|
|
if (valid) {
|
|
this.formDefinition.neibuleibie = JSON.stringify(this.neibuleibie)
|
|
this.api({
|
|
url: '/definition',
|
|
method: 'post',
|
|
data: this.formDefinition
|
|
}).then(() => {
|
|
this.getList()
|
|
this.dialogFormVisible = false
|
|
})
|
|
} else {
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
updateDefinition() {
|
|
// 修改用户信息
|
|
this.$refs['formDefinition'].validate((valid) => {
|
|
if (valid) {
|
|
const _vue = this
|
|
this.formDefinition.neibuleibie = JSON.stringify(this.neibuleibie)
|
|
this.api({
|
|
url: '/definition',
|
|
method: 'put',
|
|
data: this.formDefinition
|
|
}).then(() => {
|
|
this.dialogFormVisible = false
|
|
this.$message({
|
|
message: '修改成功',
|
|
type: 'success',
|
|
duration: 1000,
|
|
onClose: () => {
|
|
_vue.getList()
|
|
}
|
|
})
|
|
})
|
|
} else {
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
updateLink() {
|
|
console.log(this.tableData)
|
|
const _vue = this
|
|
this.api({
|
|
url: '/member/updateGroupMembers',
|
|
method: 'post',
|
|
data: {
|
|
groupMembers: this.tableData
|
|
}
|
|
}).then(() => {
|
|
this.dialogFormMemberVisible = false
|
|
this.$message({
|
|
message: '修改成功',
|
|
type: 'success',
|
|
duration: 300,
|
|
onClose: () => {
|
|
_vue.getList()
|
|
}
|
|
})
|
|
})
|
|
},
|
|
delDefinition() {
|
|
if (this.multipleSelection.length > 0) {
|
|
this.$confirm('确定删除当前选中记录?', '提示', {
|
|
confirmButtonText: '确定',
|
|
showCancelButton: true,
|
|
type: 'warning'
|
|
}).then(() => {
|
|
const pks = []
|
|
this.multipleSelection.forEach((definition) => {
|
|
pks.push(definition.id)
|
|
})
|
|
console.log(pks)
|
|
deleteDefinitionFn({ pks: pks }).then(() => {
|
|
this.$message({
|
|
message: '删除成功',
|
|
type: 'success',
|
|
duration: 1000,
|
|
onClose: () => {
|
|
this.getList()
|
|
}
|
|
})
|
|
})
|
|
})
|
|
} else {
|
|
this.$message.warning('请选择要删除的流程！')
|
|
}
|
|
},
|
|
editStatus($index) {
|
|
const template = this.list[$index]
|
|
this.api({
|
|
url: '/definition/update',
|
|
method: 'post',
|
|
data: template
|
|
}).then(() => {
|
|
this.getList()
|
|
})
|
|
},
|
|
closeDialog() {
|
|
this.formDefinition = {}
|
|
this.neibuleibie = []
|
|
},
|
|
formatterMode(row) {
|
|
const mode = this.modeList.filter((mode) => mode.value === row.mode)
|
|
if (mode && mode.length) {
|
|
return mode[0].name
|
|
} else {
|
|
return '未知'
|
|
}
|
|
},
|
|
formatterListCategory(row, column, cellValue) {
|
|
const list = JSON.parse(cellValue)
|
|
const categoryList = this.$store.getters.allCategory
|
|
let categoryName = ''
|
|
for (let i = 0; i < categoryList.length; i++) {
|
|
for (let j = 0; j < list.length; j++) {
|
|
if (categoryList[i].code === list[j]) {
|
|
categoryName += categoryList[i].name + ','
|
|
}
|
|
}
|
|
}
|
|
return categoryName.substring(0, categoryName.length - 1)
|
|
},
|
|
listSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
if (
|
|
columnIndex === 0 ||
|
|
(columnIndex >= 2 && columnIndex !== 6 && columnIndex !== 7)
|
|
) {
|
|
const _row = this.spanArr[rowIndex]
|
|
const _col = _row > 0 ? 1 : 0
|
|
return {
|
|
rowspan: _row,
|
|
colspan: _col
|
|
}
|
|
}
|
|
},
|
|
getSpanArr(data) {
|
|
for (let i = 0; i < data.length; i++) {
|
|
if (i === 0) {
|
|
this.spanArr.push(1)
|
|
this.pos = 0
|
|
} else {
|
|
// 判断当前元素与上一个元素是否相同
|
|
if (
|
|
data[i].departmentId === data[i - 1].departmentId &&
|
|
data[i].mode === data[i - 1].mode &&
|
|
data[i].shebeizhongleidaima === data[i - 1].shebeizhongleidaima &&
|
|
data[i].neibuleibie === data[i - 1].neibuleibie
|
|
) {
|
|
this.spanArr[this.pos] += 1
|
|
this.spanArr.push(0)
|
|
} else {
|
|
this.spanArr.push(1)
|
|
this.pos = i
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|