222 lines
7.2 KiB
Python
222 lines
7.2 KiB
Python
<template>
|
|
<div class="app-container">
|
|
<div style="display:flex">
|
|
<treeselect v-model="listQuery.cert_field" :multiple="false" :options="typeOptions" :disable-branch-nodes="true" placeholder="认证领域" @input="handleFilter" style="width: 260px" clearable/>
|
|
<el-select
|
|
v-model="listQuery.auditor_type"
|
|
placeholder="资格类型"
|
|
clearable
|
|
class="filter-item"
|
|
@change="handleFilter"
|
|
style="margin-left:10px"
|
|
>
|
|
<el-option
|
|
v-for="item in auditor_typeOptions"
|
|
:key="item.key"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
<el-select
|
|
v-model="listQuery.is_enabled"
|
|
placeholder="是否有效"
|
|
clearable
|
|
class="filter-item"
|
|
@change="handleFilter"
|
|
style="margin-left:10px"
|
|
>
|
|
<el-option
|
|
v-for="item in enableOptions"
|
|
:key="item.key"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
<el-input
|
|
v-model="listQuery.search"
|
|
placeholder="证书号"
|
|
style="width: 300px;margin-left:10px"
|
|
class="filter-item"
|
|
@keyup.enter.native="handleFilter"
|
|
/>
|
|
<el-button
|
|
class="filter-item"
|
|
type="primary"
|
|
icon="el-icon-search"
|
|
@click="handleFilter"
|
|
style="margin-left:10px"
|
|
>查询</el-button>
|
|
<el-button
|
|
class="filter-item"
|
|
style="margin-left: 10px;"
|
|
type="primary"
|
|
icon="el-icon-refresh-left"
|
|
@click="resetFilter"
|
|
>重置</el-button>
|
|
</div>
|
|
<el-table
|
|
v-loading="listLoading"
|
|
:data="tableData.results"
|
|
style="width: 100%;margin-top:10px;"
|
|
border
|
|
fit
|
|
stripe
|
|
highlight-current-row
|
|
max-height="500"
|
|
>
|
|
<el-table-column type="index" width="50" />
|
|
<el-table-column label="认证领域">
|
|
<template slot-scope="scope" v-if="scope.row.cert_field_">{{ scope.row.cert_field_.name }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="证书号">
|
|
<template slot-scope="scope">{{ scope.row.cert_number }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="资格类型">
|
|
<template slot-scope="scope">{{ scope.row.auditor_type_.name }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="注册日期">
|
|
<template slot-scope="scope">{{ scope.row.registration_date }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="到期日期">
|
|
<template slot-scope="scope">{{ scope.row.expiration_date }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="是否暂停">
|
|
<template slot-scope="scope">
|
|
<el-tag type="danger" v-if="scope.row.is_paused">是</el-tag>
|
|
<el-tag type="success" v-else>否</el-tag></template>
|
|
</el-table-column>
|
|
<el-table-column label="是否有效">
|
|
<template slot-scope="scope">
|
|
<el-tag type="success" v-if="scope.row.is_enabled">有效</el-tag>
|
|
<el-tag type="danger" v-else>失效</el-tag></template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="260px">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="primary"
|
|
size="small"
|
|
:disabled="!checkPermission(['qualification_update'])"
|
|
@click="handleUpdate(scope)"
|
|
>编辑</el-button>
|
|
<el-button
|
|
type="danger"
|
|
size="small"
|
|
:disabled="!checkPermission(['qualification_delete'])"
|
|
@click="handleDelete(scope)"
|
|
>删除</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<pagination
|
|
v-show="tableData.count>0"
|
|
:total="tableData.count"
|
|
:page.sync="listQuery.page"
|
|
:limit.sync="listQuery.page_size"
|
|
@pagination="getList"
|
|
/>
|
|
<el-dialog :title="dgType=='create'?'新增':'编辑'" :visible.sync="dgVisiable" :close-on-click-modal="false" >
|
|
<Qualificationform ref="Qualificationform" :formData="formData" :action="dgType" @close="closeDg" ></Qualificationform>
|
|
</el-dialog>
|
|
</div>
|
|
|
|
</template>
|
|
<script>
|
|
import { getQualificationList, createQualification, updateQualification, deleteQualification} from "@/api/qualification"
|
|
import Qualificationform from "@/views/qualification/qualificationform"
|
|
import { getDictList } from "@/api/dict"
|
|
import Pagination from "@/components/Pagination"
|
|
import checkPermission from '@/utils/permission'
|
|
import Treeselect from '@riophae/vue-treeselect'
|
|
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
|
import { genTree } from '../../utils'
|
|
export default {
|
|
name:'Qualification',
|
|
props:['employee'],
|
|
components: { Pagination, Treeselect, Qualificationform },
|
|
data() {
|
|
return {
|
|
tableData: {count:0},
|
|
listLoading: true,
|
|
listQuery: {
|
|
page: 1,
|
|
page_size: 20,
|
|
},
|
|
typeOptions: [],
|
|
enableOptions:[
|
|
{label:'有效',value:true},
|
|
{label:'失效',value:false}
|
|
],
|
|
auditor_typeOptions:[],
|
|
formData:{},
|
|
dgType:'create',
|
|
dgVisiable:false
|
|
};
|
|
},
|
|
created() {
|
|
this.listQuery.employee = this.employee
|
|
this.getList();
|
|
this.getTypeOptions()
|
|
this.getauditor_typeOptions()
|
|
},
|
|
methods: {
|
|
checkPermission,
|
|
getList() {
|
|
this.listLoading = true;
|
|
getQualificationList(this.listQuery).then(response => {
|
|
if (response.data) {
|
|
this.tableData = response.data
|
|
}
|
|
this.listLoading = false
|
|
});
|
|
},
|
|
getTypeOptions() {
|
|
getDictList({type__code:'cert_field'}).then(res=>{
|
|
this.typeOptions = genTree(res.data)
|
|
})
|
|
},
|
|
getauditor_typeOptions() {
|
|
getDictList({type__code:'auditor_qualification_type'}).then(res=>{
|
|
this.auditor_typeOptions = genTree(res.data)
|
|
})
|
|
},
|
|
resetFilter() {
|
|
this.listQuery = {
|
|
page: 1,
|
|
page_size: 20,
|
|
employee: this.employee
|
|
}
|
|
this.getList()
|
|
},
|
|
handleFilter() {
|
|
this.listQuery.page = 1
|
|
this.getList()
|
|
},
|
|
handleCreate() {
|
|
this.formData = Object.assign({}, {employee:this.employee, is_paused:false, is_enabled:true})
|
|
this.dgType = 'create'
|
|
this.dgVisiable = true
|
|
// this.$refs.Qualificationform.formData = this.formData
|
|
// this.$refs.Qualificationform.action = this.dgType
|
|
},
|
|
handleUpdate(scope) {
|
|
this.formData = Object.assign({}, scope.row)
|
|
this.dgType = 'update'
|
|
this.dgVisiable = true
|
|
},
|
|
handleDelete(scope) {
|
|
deleteQualification(scope.row.id).then(res=>{
|
|
this.$message.success('成功')
|
|
this.getList()
|
|
})
|
|
},
|
|
closeDg(val) {
|
|
if(val){
|
|
this.getList()
|
|
}
|
|
this.dgVisiable=false
|
|
},
|
|
}
|
|
};
|
|
</script>
|