|
|
|
@ -6,15 +6,39 @@ |
|
|
|
<div class="filter-container"> |
|
|
|
<el-form> |
|
|
|
<el-form-item> |
|
|
|
<el-input v-model="listQuery.code" placeholder="请输入类别代码" clearable style="width: 200px" @keyup.enter.native="handleFilter" /> |
|
|
|
<el-input v-model="listQuery.name" placeholder="请输入类别名称" clearable style="width: 200px" @keyup.enter.native="handleFilter" /> |
|
|
|
<el-button type="primary" icon="el-icon-search" @click="handleFilter"> |
|
|
|
<el-input |
|
|
|
v-model="listQuery.code" |
|
|
|
placeholder="请输入类别代码" |
|
|
|
clearable |
|
|
|
style="width: 200px" |
|
|
|
@keyup.enter.native="handleFilter" |
|
|
|
/> |
|
|
|
<el-input |
|
|
|
v-model="listQuery.name" |
|
|
|
placeholder="请输入类别名称" |
|
|
|
clearable |
|
|
|
style="width: 200px" |
|
|
|
@keyup.enter.native="handleFilter" |
|
|
|
/> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
icon="el-icon-search" |
|
|
|
@click="handleFilter" |
|
|
|
> |
|
|
|
查询 |
|
|
|
</el-button> |
|
|
|
<el-button type="primary" icon="el-icon-edit" @click="showCreate"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
icon="el-icon-edit" |
|
|
|
@click="showCreate" |
|
|
|
> |
|
|
|
添加 |
|
|
|
</el-button> |
|
|
|
<el-button type="danger" icon="el-icon-delete" @click="deleteCategory"> |
|
|
|
<el-button |
|
|
|
type="danger" |
|
|
|
icon="el-icon-delete" |
|
|
|
@click="deleteCategory" |
|
|
|
> |
|
|
|
删除 |
|
|
|
</el-button> |
|
|
|
</el-form-item> |
|
|
|
@ -31,23 +55,57 @@ |
|
|
|
@selection-change="handleSelectionChange" |
|
|
|
> |
|
|
|
<el-table-column type="selection" width="40" /> |
|
|
|
<el-table-column type="index" align="center" label="序号" width="50" /> |
|
|
|
<el-table-column align="center" label="检验类别名称" prop="name" width="100" /> |
|
|
|
<el-table-column align="center" label="检验类别代码" prop="code" width="80" /> |
|
|
|
<el-table-column :formatter="formatSpecies" align="center" label="设备种类" prop="species" /> |
|
|
|
<el-table-column |
|
|
|
type="index" |
|
|
|
align="center" |
|
|
|
label="序号" |
|
|
|
width="50" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
align="center" |
|
|
|
label="检验类别名称" |
|
|
|
prop="name" |
|
|
|
width="100" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
align="center" |
|
|
|
label="检验类别代码" |
|
|
|
prop="code" |
|
|
|
width="80" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
:formatter="formatSpecies" |
|
|
|
align="center" |
|
|
|
label="设备种类" |
|
|
|
prop="species" |
|
|
|
/> |
|
|
|
<el-table-column align="center" label="操作" prop="" min-width="20"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button type="primary" size="medium" title="修改" @click="showUpdate(scope.$index)"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="medium" |
|
|
|
title="修改" |
|
|
|
@click="showUpdate(scope.$index)" |
|
|
|
> |
|
|
|
修改 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<pagination v-show="totalCount>0" :total="totalCount" :page-num.sync="listQuery.pageNum" :page-row.sync="listQuery.pageSize" @pagination="getList" /> |
|
|
|
<pagination |
|
|
|
v-show="totalCount > 0" |
|
|
|
:total="totalCount" |
|
|
|
:page-num.sync="listQuery.pageNum" |
|
|
|
:page-row.sync="listQuery.pageSize" |
|
|
|
@pagination="getList" |
|
|
|
/> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-card class="box-card"> |
|
|
|
<div slot="header" class="clearfix"> |
|
|
|
<span>字典详情</span> |
|
|
|
</div> |
|
|
|
<el-table |
|
|
|
ref="list" |
|
|
|
:data="list" |
|
|
|
@ -57,26 +115,64 @@ |
|
|
|
highlight-current-row |
|
|
|
@row-click="onRowClick" |
|
|
|
@selection-change="handleSelectionChange" |
|
|
|
v-if="list.length > 0" |
|
|
|
> |
|
|
|
<el-table-column type="selection" width="40" /> |
|
|
|
<el-table-column type="index" align="center" label="序号" width="80" /> |
|
|
|
<el-table-column align="center" label="检验类别名称" prop="name" min-width="40" /> |
|
|
|
<el-table-column align="center" label="检验类别代码" prop="code" min-width="40" /> |
|
|
|
<el-table-column :formatter="formatSpecies" align="center" label="设备种类" prop="species" /> |
|
|
|
<el-table-column |
|
|
|
type="index" |
|
|
|
align="center" |
|
|
|
label="序号" |
|
|
|
width="80" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
align="center" |
|
|
|
label="检验类别名称" |
|
|
|
prop="name" |
|
|
|
min-width="40" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
align="center" |
|
|
|
label="检验类别代码" |
|
|
|
prop="code" |
|
|
|
min-width="40" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
:formatter="formatSpecies" |
|
|
|
align="center" |
|
|
|
label="设备种类" |
|
|
|
prop="species" |
|
|
|
/> |
|
|
|
<el-table-column align="center" label="操作" prop="" min-width="20"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button type="primary" size="medium" title="修改" @click="showUpdate(scope.$index)"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="medium" |
|
|
|
title="修改" |
|
|
|
@click="showUpdate(scope.$index)" |
|
|
|
> |
|
|
|
修改 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div v-else>点击左侧字典查看详情</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" @close="closeDialog"> |
|
|
|
<el-form ref="tempCategory" :model="tempCategory" class="small-space" label-position="left" label-width="120px" style="width: 300px; margin-left:50px;"> |
|
|
|
<el-dialog |
|
|
|
:title="textMap[dialogStatus]" |
|
|
|
:visible.sync="dialogFormVisible" |
|
|
|
@close="closeDialog" |
|
|
|
> |
|
|
|
<el-form |
|
|
|
ref="tempCategory" |
|
|
|
:model="tempCategory" |
|
|
|
class="small-space" |
|
|
|
label-position="left" |
|
|
|
label-width="120px" |
|
|
|
style="width: 300px; margin-left: 50px" |
|
|
|
> |
|
|
|
<el-form-item label="检验类别名称" prop="name" required> |
|
|
|
<el-input v-model="tempCategory.name" type="text" /> |
|
|
|
</el-form-item> |
|
|
|
@ -108,10 +204,12 @@ |
|
|
|
</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="createCategory"> |
|
|
|
<el-button @click="dialogFormVisible = false"> 取 消 </el-button> |
|
|
|
<el-button |
|
|
|
v-if="dialogStatus === 'create'" |
|
|
|
type="success" |
|
|
|
@click="createCategory" |
|
|
|
> |
|
|
|
创 建 |
|
|
|
</el-button> |
|
|
|
<el-button v-else type="primary" @click="updateCategory"> |
|
|
|
@ -123,9 +221,9 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import Pagination from '@/components/Pagination' |
|
|
|
import Pagination from "@/components/Pagination"; |
|
|
|
export default { |
|
|
|
name: 'Category', |
|
|
|
name: "Category", |
|
|
|
components: { Pagination }, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
@ -135,198 +233,198 @@ export default { |
|
|
|
listQuery: { |
|
|
|
pageNum: 1, // 页码 |
|
|
|
pageSize: 20, |
|
|
|
orderBy: 'sort asc', |
|
|
|
parentId: '' |
|
|
|
orderBy: "sort asc", |
|
|
|
parentId: "", |
|
|
|
}, |
|
|
|
dialogStatus: 'create', |
|
|
|
dialogStatus: "create", |
|
|
|
dialogFormVisible: false, |
|
|
|
textMap: { |
|
|
|
update: '编辑', |
|
|
|
create: '新建检验类别' |
|
|
|
update: "编辑", |
|
|
|
create: "新建检验类别", |
|
|
|
}, |
|
|
|
tempCategory: {}, |
|
|
|
multipleSelection: [], |
|
|
|
sbzlList: [], |
|
|
|
species: [], |
|
|
|
parentList: [], |
|
|
|
leftList: [] |
|
|
|
} |
|
|
|
leftList: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// this.getList() |
|
|
|
this.getSbzlList() |
|
|
|
this.getParentList() |
|
|
|
this.getLeftList() |
|
|
|
this.getSbzlList(); |
|
|
|
this.getParentList(); |
|
|
|
this.getLeftList(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getList() { |
|
|
|
this.api({ |
|
|
|
url: '/category/list', |
|
|
|
method: 'get', |
|
|
|
params: this.listQuery |
|
|
|
}).then(data => { |
|
|
|
this.list = data.list |
|
|
|
this.totalCount = data.total |
|
|
|
}) |
|
|
|
url: "/category/list", |
|
|
|
method: "get", |
|
|
|
params: this.listQuery, |
|
|
|
}).then((data) => { |
|
|
|
this.list = data.list; |
|
|
|
this.totalCount = data.total; |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleFilter() { |
|
|
|
// 查询事件 |
|
|
|
this.listQuery.pageNum = 1 |
|
|
|
this.getList() |
|
|
|
this.listQuery.pageNum = 1; |
|
|
|
this.getList(); |
|
|
|
}, |
|
|
|
onRowClick(row) { |
|
|
|
this.$refs.list.toggleRowSelection(row) |
|
|
|
this.listQuery.parentId = row.id |
|
|
|
this.getList() |
|
|
|
this.$refs.list.toggleRowSelection(row); |
|
|
|
this.listQuery.parentId = row.id; |
|
|
|
this.getList(); |
|
|
|
}, |
|
|
|
handleSelectionChange: function(val) { |
|
|
|
this.multipleSelection = val |
|
|
|
handleSelectionChange: function (val) { |
|
|
|
this.multipleSelection = val; |
|
|
|
}, |
|
|
|
showCreate() { |
|
|
|
this.tempCategory = {} |
|
|
|
this.dialogStatus = 'create' |
|
|
|
this.dialogFormVisible = true |
|
|
|
this.tempCategory = {}; |
|
|
|
this.dialogStatus = "create"; |
|
|
|
this.dialogFormVisible = true; |
|
|
|
}, |
|
|
|
createCategory() { |
|
|
|
this.$refs['tempCategory'].validate(valid => { |
|
|
|
this.$refs["tempCategory"].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.tempCategory.species = JSON.stringify(this.species) |
|
|
|
this.tempCategory.species = JSON.stringify(this.species); |
|
|
|
this.api({ |
|
|
|
url: '/category/addCategory', |
|
|
|
method: 'post', |
|
|
|
data: this.tempCategory |
|
|
|
url: "/category/addCategory", |
|
|
|
method: "post", |
|
|
|
data: this.tempCategory, |
|
|
|
}).then(() => { |
|
|
|
this.$message({ message: '添加成功。', type: 'success' }) |
|
|
|
this.getList() |
|
|
|
this.dialogFormVisible = false |
|
|
|
}) |
|
|
|
this.$message({ message: "添加成功。", type: "success" }); |
|
|
|
this.getList(); |
|
|
|
this.dialogFormVisible = false; |
|
|
|
}); |
|
|
|
} else { |
|
|
|
return false |
|
|
|
return false; |
|
|
|
} |
|
|
|
}) |
|
|
|
}); |
|
|
|
}, |
|
|
|
showUpdate($index) { |
|
|
|
this.tempCategory = this.list[$index] |
|
|
|
this.species = JSON.parse(this.tempCategory.species) |
|
|
|
this.dialogStatus = 'update' |
|
|
|
this.dialogFormVisible = true |
|
|
|
this.tempCategory = this.list[$index]; |
|
|
|
this.species = JSON.parse(this.tempCategory.species); |
|
|
|
this.dialogStatus = "update"; |
|
|
|
this.dialogFormVisible = true; |
|
|
|
}, |
|
|
|
updateCategory() { |
|
|
|
this.$refs['tempCategory'].validate(valid => { |
|
|
|
this.$refs["tempCategory"].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.tempCategory.species = JSON.stringify(this.species) |
|
|
|
this.tempCategory.species = JSON.stringify(this.species); |
|
|
|
this.api({ |
|
|
|
url: '/category/updateCategory', |
|
|
|
method: 'post', |
|
|
|
data: this.tempCategory |
|
|
|
url: "/category/updateCategory", |
|
|
|
method: "post", |
|
|
|
data: this.tempCategory, |
|
|
|
}).then(() => { |
|
|
|
this.$message({ message: '数据更新成功。', type: 'success' }) |
|
|
|
this.getList() |
|
|
|
this.dialogFormVisible = false |
|
|
|
}) |
|
|
|
this.$message({ message: "数据更新成功。", type: "success" }); |
|
|
|
this.getList(); |
|
|
|
this.dialogFormVisible = false; |
|
|
|
}); |
|
|
|
} else { |
|
|
|
return false |
|
|
|
return false; |
|
|
|
} |
|
|
|
}) |
|
|
|
}); |
|
|
|
}, |
|
|
|
deleteCategory() { |
|
|
|
if (this.multipleSelection.length === 0) { |
|
|
|
this.$message({ |
|
|
|
type: 'error', |
|
|
|
message: '请选中需要删除的数据！' |
|
|
|
}) |
|
|
|
return false |
|
|
|
type: "error", |
|
|
|
message: "请选中需要删除的数据！", |
|
|
|
}); |
|
|
|
return false; |
|
|
|
} else { |
|
|
|
this.$confirm('确定删除当前选中记录?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
this.$confirm("确定删除当前选中记录?", "提示", { |
|
|
|
confirmButtonText: "确定", |
|
|
|
showCancelButton: true, |
|
|
|
type: 'warning' |
|
|
|
type: "warning", |
|
|
|
}).then(() => { |
|
|
|
const pks = [] |
|
|
|
const qs = require('qs') |
|
|
|
this.multipleSelection.forEach(category => { |
|
|
|
pks.push(category.id) |
|
|
|
}) |
|
|
|
const pks = []; |
|
|
|
const qs = require("qs"); |
|
|
|
this.multipleSelection.forEach((category) => { |
|
|
|
pks.push(category.id); |
|
|
|
}); |
|
|
|
this.api({ |
|
|
|
url: '/category/delCategory', |
|
|
|
method: 'delete', |
|
|
|
url: "/category/delCategory", |
|
|
|
method: "delete", |
|
|
|
params: { |
|
|
|
pks: pks |
|
|
|
pks: pks, |
|
|
|
}, |
|
|
|
paramsSerializer: function (params) { |
|
|
|
return qs.stringify(params, { indices: false }); |
|
|
|
}, |
|
|
|
paramsSerializer: function(params) { |
|
|
|
return qs.stringify(params, { indices: false }) |
|
|
|
} |
|
|
|
}).then(() => { |
|
|
|
this.$message({ message: '删除成功。', type: 'success' }) |
|
|
|
this.getList() |
|
|
|
}) |
|
|
|
}) |
|
|
|
this.$message({ message: "删除成功。", type: "success" }); |
|
|
|
this.getList(); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
getSbzlList() { |
|
|
|
this.api({ |
|
|
|
url: '/sedirectory/getList', |
|
|
|
method: 'get', |
|
|
|
url: "/sedirectory/getList", |
|
|
|
method: "get", |
|
|
|
params: { |
|
|
|
sbzl: undefined, |
|
|
|
level: '1' |
|
|
|
} |
|
|
|
}).then(data => { |
|
|
|
this.sbzlList = data |
|
|
|
}) |
|
|
|
level: "1", |
|
|
|
}, |
|
|
|
}).then((data) => { |
|
|
|
this.sbzlList = data; |
|
|
|
}); |
|
|
|
}, |
|
|
|
getParentList() { |
|
|
|
this.api({ |
|
|
|
url: '/category/all', |
|
|
|
method: 'get', |
|
|
|
url: "/category/all", |
|
|
|
method: "get", |
|
|
|
params: { |
|
|
|
parentCode: null, |
|
|
|
species: null |
|
|
|
} |
|
|
|
}).then(data => { |
|
|
|
this.parentList = data |
|
|
|
}) |
|
|
|
species: null, |
|
|
|
}, |
|
|
|
}).then((data) => { |
|
|
|
this.parentList = data; |
|
|
|
}); |
|
|
|
}, |
|
|
|
getLeftList() { |
|
|
|
this.api({ |
|
|
|
url: '/category/getTopLevel', |
|
|
|
method: 'get', |
|
|
|
url: "/category/getTopLevel", |
|
|
|
method: "get", |
|
|
|
params: { |
|
|
|
pageNum: 10, |
|
|
|
pageSize: 10 |
|
|
|
} |
|
|
|
}).then(data => { |
|
|
|
this.leftList = data.list |
|
|
|
}) |
|
|
|
pageSize: 10, |
|
|
|
}, |
|
|
|
}).then((data) => { |
|
|
|
this.leftList = data.list; |
|
|
|
}); |
|
|
|
}, |
|
|
|
closeDialog() { |
|
|
|
this.species = [] |
|
|
|
this.species = []; |
|
|
|
}, |
|
|
|
formatSpecies(row, column, cellValue) { |
|
|
|
const value = JSON.parse(cellValue) |
|
|
|
let lable = '' |
|
|
|
const value = JSON.parse(cellValue); |
|
|
|
let lable = ""; |
|
|
|
for (let i = 0; i < value.length; i++) { |
|
|
|
for (let j = 0; j < this.sbzlList.length; j++) { |
|
|
|
if (value[i] === this.sbzlList[j].value) { |
|
|
|
lable = this.sbzlList[j].label + '，' + lable |
|
|
|
break |
|
|
|
lable = this.sbzlList[j].label + "，" + lable; |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
return lable.substring(0, lable.length - 1) |
|
|
|
return lable.substring(0, lable.length - 1); |
|
|
|
}, |
|
|
|
tableRowClassName({ row }) { |
|
|
|
if (row.parentId === null) { |
|
|
|
return 'main-row' |
|
|
|
return "main-row"; |
|
|
|
} else { |
|
|
|
return '' |
|
|
|
return ""; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style> |
|
|
|
.el-table .main-row { |
|
|
|
background: #f0f9eb; |
|
|
|
} |
|
|
|
.el-table .main-row { |
|
|
|
background: #f0f9eb; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
