20 changed files with 1736 additions and 1229 deletions
@ -1,365 +0,0 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="filter-container"> |
|||
<el-form> |
|||
<el-form-item> |
|||
<el-select v-model="listQuery.shebeizhonglei" multiple placeholder="请选择设备种类" @select="handleFilter"> |
|||
<el-option |
|||
v-for="item in sbzlList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
<el-input v-model="listQuery.name" placeholder="请输入类别名称" clearable style="width: 200px" @keyup.enter.native="handleFilter" /> |
|||
<el-select v-model="listQuery.departmentId" placeholder="请选择所属部门" @select="handleFilter"> |
|||
<el-option |
|||
v-for="item in depts" |
|||
:key="item.id" |
|||
:label="item.name" |
|||
:value="item.id" |
|||
/> |
|||
</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="deleteDepartment"> |
|||
删除 |
|||
</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<el-table |
|||
ref="list" |
|||
v-adaptive="{bottomOffset: 50}" |
|||
height="0" |
|||
:data="list" |
|||
:row-class-name="tableRowClassName" |
|||
border |
|||
fit |
|||
highlight-current-row |
|||
@row-click="onRowClick" |
|||
@selection-change="handleSelectionChange" |
|||
> |
|||
<el-table-column type="selection" width="40" /> |
|||
<el-table-column type="index" align="center" label="序号" width="80" /> |
|||
<el-table-column :formatter="formatDepartment" align="center" label="所属部门" prop="departmentId" min-width="40" /> |
|||
<el-table-column :formatter="formatJianyan" align="center" label="检验类别" prop="jianyanleibie" min-width="25" /> |
|||
<el-table-column :formatter="formatSpecies" align="center" label="设备种类" prop="shebeizhonglei" min-width="40" /> |
|||
<el-table-column align="center" label="设备类别" prop="shebeileibie" min-width="40" /> |
|||
<el-table-column :formatter="formatQuhua" align="center" label="所属区划" prop="quhuamingcheng" /> |
|||
<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> |
|||
</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" /> |
|||
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" @close="closeDialog"> |
|||
<el-form ref="tempDepartment" :model="tempDepartment" class="small-space" label-position="left" label-width="120px" style="width: 300px; margin-left:50px;"> |
|||
<el-form-item label="所属科室" prop="departmentId"> |
|||
<el-select v-model="department" placeholder="请选择所属科室"> |
|||
<el-option |
|||
v-for="item in depts" |
|||
:key="item.id" |
|||
:label="item.name" |
|||
:value="item.id" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="检验类别" prop="jianyanleibie"> |
|||
<el-select v-model="jianyanleibie" multiple placeholder="请选择检验类别"> |
|||
<el-option value="DJ" label="定期检验" /> |
|||
<el-option value="JJ" label="监督检验" /> |
|||
<el-option value="ZZ" label="制造监检" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="设备种类" prop="shebeizhonglei"> |
|||
<el-select v-model="shebeizhonglei" multiple placeholder="请选择设备种类"> |
|||
<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="quhuamingcheng"> |
|||
<el-select v-model="quhuamingcheng" multiple placeholder="请选择所属区划"> |
|||
<el-option |
|||
v-for="item in areas" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
: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="createDepartment"> |
|||
创 建 |
|||
</el-button> |
|||
<el-button v-else type="primary" @click="updateDepartment"> |
|||
修 改 |
|||
</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Pagination from '@/components/Pagination' |
|||
import { deleteDepartmentFn } from '@/api/common' |
|||
export default { |
|||
name: 'BjdDepartment', |
|||
components: { Pagination }, |
|||
data() { |
|||
return { |
|||
totalCount: 0, // 分页组件--数据总条数 |
|||
list: [], // 表格的数据 |
|||
listQuery: { |
|||
pageNum: 1, // 页码 |
|||
pageSize: 20, |
|||
orderBy: 'id asc' |
|||
}, |
|||
dialogStatus: 'create', |
|||
dialogFormVisible: false, |
|||
textMap: { |
|||
update: '编辑', |
|||
create: '新建报检科室关联' |
|||
}, |
|||
tempDepartment: {}, |
|||
multipleSelection: [], |
|||
sbzlList: [], |
|||
parentList: [], |
|||
depts: [], |
|||
areas: [], |
|||
shebeizhonglei: '', |
|||
quhuamingcheng: '', |
|||
jianyanleibie: '', |
|||
department: '' |
|||
} |
|||
}, |
|||
created() { |
|||
this.getList() |
|||
this.getSbzlList() |
|||
this.getDepartment() |
|||
this.getArea() |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
this.apibjd({ |
|||
url: '/bjdDepartment/list', |
|||
method: 'get', |
|||
params: this.listQuery |
|||
}).then(data => { |
|||
this.list = data.list |
|||
this.totalCount = data.total |
|||
}) |
|||
}, |
|||
handleFilter() { |
|||
// 查询事件 |
|||
this.listQuery.pageNum = 1 |
|||
this.getList() |
|||
}, |
|||
onRowClick(row) { |
|||
this.$refs.list.toggleRowSelection(row) |
|||
}, |
|||
handleSelectionChange: function(val) { |
|||
this.multipleSelection = val |
|||
}, |
|||
showCreate() { |
|||
this.tempDepartment = {} |
|||
this.dialogStatus = 'create' |
|||
this.dialogFormVisible = true |
|||
}, |
|||
createDepartment() { |
|||
this.$refs['tempDepartment'].validate(valid => { |
|||
if (valid) { |
|||
this.tempDepartment.shebeizhonglei = JSON.stringify(this.shebeizhonglei) |
|||
this.tempDepartment.quhuamingcheng = JSON.stringify(this.quhuamingcheng) |
|||
this.tempDepartment.jianyanleibie = JSON.stringify(this.jianyanleibie) |
|||
this.tempDepartment.departmentId = this.department |
|||
this.apibjd({ |
|||
url: '/bjdDepartment/save', |
|||
method: 'post', |
|||
data: this.tempDepartment |
|||
}).then(() => { |
|||
this.$message({ message: '添加成功。', type: 'success' }) |
|||
this.getList() |
|||
this.dialogFormVisible = false |
|||
}) |
|||
} else { |
|||
return false |
|||
} |
|||
}) |
|||
}, |
|||
showUpdate($index) { |
|||
this.tempDepartment = this.list[$index] |
|||
this.jianyanleibie = JSON.parse(this.tempDepartment.jianyanleibie) |
|||
this.shebeizhonglei = JSON.parse(this.tempDepartment.shebeizhonglei) |
|||
this.quhuamingcheng = JSON.parse(this.tempDepartment.quhuamingcheng) |
|||
this.department = this.tempDepartment.departmentId |
|||
this.dialogStatus = 'update' |
|||
this.dialogFormVisible = true |
|||
}, |
|||
updateDepartment() { |
|||
this.$refs['tempDepartment'].validate(valid => { |
|||
if (valid) { |
|||
this.tempDepartment.shebeizhonglei = JSON.stringify(this.shebeizhonglei) |
|||
this.tempDepartment.quhuamingcheng = JSON.stringify(this.quhuamingcheng) |
|||
this.tempDepartment.jianyanleibie = JSON.stringify(this.jianyanleibie) |
|||
this.tempDepartment.departmentId = this.department |
|||
this.apibjd({ |
|||
url: '/bjdDepartment/update', |
|||
method: 'post', |
|||
data: this.tempDepartment |
|||
}).then(() => { |
|||
this.$message({ message: '数据更新成功。', type: 'success' }) |
|||
this.getList() |
|||
this.dialogFormVisible = false |
|||
}) |
|||
} else { |
|||
return false |
|||
} |
|||
}) |
|||
}, |
|||
deleteDepartment() { |
|||
if (this.multipleSelection.length === 0) { |
|||
this.$message({ |
|||
type: 'error', |
|||
message: '请选中需要删除的数据！' |
|||
}) |
|||
return false |
|||
} else { |
|||
this.$confirm('确定删除当前选中记录?', '提示', { |
|||
confirmButtonText: '确定', |
|||
showCancelButton: true, |
|||
type: 'warning' |
|||
}).then(() => { |
|||
const pks = [] |
|||
this.multipleSelection.forEach(category => { |
|||
pks.push(category.id) |
|||
}) |
|||
deleteDepartmentFn({ pks: pks }).then(() => { |
|||
this.$message({ message: '删除成功。', type: 'success' }) |
|||
this.getList() |
|||
}) |
|||
}) |
|||
} |
|||
}, |
|||
getSbzlList() { |
|||
this.api({ |
|||
url: '/sedirectory/getList', |
|||
method: 'get', |
|||
params: { |
|||
sbzl: undefined, |
|||
level: '1' |
|||
} |
|||
}).then(data => { |
|||
this.sbzlList = data |
|||
}) |
|||
}, |
|||
// 查询检验科室 |
|||
getDepartment() { |
|||
this.api({ |
|||
url: '/department/all', |
|||
method: 'get' |
|||
}).then(data => { |
|||
this.depts = data |
|||
}) |
|||
}, |
|||
getArea() { // 查询区划 |
|||
this.api({ |
|||
url: '/area/getShiArea', |
|||
method: 'get', |
|||
params: { |
|||
shidaima: '370100' |
|||
} |
|||
}).then(data => { |
|||
this.areas = data |
|||
}) |
|||
}, |
|||
closeDialog() { |
|||
this.species = [] |
|||
}, |
|||
formatDepartment(row, column, cellValue) { |
|||
let lable = '' |
|||
for (let i = 0; i < this.depts.length; i++) { |
|||
if (cellValue === this.depts[i].id) { |
|||
lable = this.depts[i].name |
|||
break |
|||
} |
|||
} |
|||
return lable |
|||
}, |
|||
formatSpecies(row, column, cellValue) { |
|||
const value = JSON.parse(cellValue) |
|||
if (value == null) { |
|||
return '全部' |
|||
} |
|||
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 |
|||
} |
|||
} |
|||
} |
|||
return lable.substring(0, lable.length - 1) |
|||
}, |
|||
formatJianyan(row, column, cellValue) { |
|||
const value = JSON.parse(cellValue) |
|||
if (value == null) { |
|||
return '全部' |
|||
} |
|||
let lable = '' |
|||
for (let i = 0; i < value.length; i++) { |
|||
if (value[i] === 'DJ') { |
|||
lable = '定期检验' + ',' + lable |
|||
} else if (value[i] === 'JJ') { |
|||
lable = '监督检验' + ',' + lable |
|||
} |
|||
} |
|||
return lable.substring(0, lable.length - 1) |
|||
}, |
|||
formatQuhua(row, column, cellValue) { |
|||
const value = JSON.parse(cellValue) |
|||
if (value == null) { |
|||
return '全部' |
|||
} |
|||
let lable = '' |
|||
for (let i = 0; i < value.length; i++) { |
|||
for (let j = 0; j < this.areas.length; j++) { |
|||
if (value[i] === this.areas[j].value) { |
|||
lable = this.areas[j].label + '，' + lable |
|||
break |
|||
} |
|||
} |
|||
} |
|||
return lable.substring(0, lable.length - 1) |
|||
}, |
|||
tableRowClassName({ row }) { |
|||
if (row.parentId === null) { |
|||
return 'main-row' |
|||
} else { |
|||
return '' |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.el-table .main-row { |
|||
background: #f0f9eb; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue