23 changed files with 1777 additions and 105 deletions
@ -0,0 +1,52 @@ |
|||||
|
import api from '@/utils/api' |
||||
|
import qs from 'qs' |
||||
|
|
||||
|
export function add(data) { |
||||
|
return api({ |
||||
|
url: '/certificate', |
||||
|
method: 'post', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function edit(data) { |
||||
|
return api({ |
||||
|
url: '/certificate', |
||||
|
method: 'put', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
export function del(params) { |
||||
|
return api({ |
||||
|
url: '/certificate', |
||||
|
method: 'delete', |
||||
|
params, |
||||
|
paramsSerializer: function(params) { |
||||
|
return qs.stringify(params, { indices: false }) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function getList(params) { |
||||
|
return api({ |
||||
|
url: '/certificate', |
||||
|
method: 'get', |
||||
|
params |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function exportExcel(params, exportOptions) { |
||||
|
return api({ |
||||
|
url: '/certificate/exportExcel' + '?' + qs.stringify(params, { indices: false }), |
||||
|
method: 'get', |
||||
|
params: { |
||||
|
exportOptions: exportOptions |
||||
|
}, |
||||
|
paramsSerializer: function(params) { |
||||
|
return qs.stringify(params, { indices: false }) |
||||
|
}, |
||||
|
responseType: 'blob' |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export default { add, edit, del, getList } |
||||
@ -0,0 +1,48 @@ |
|||||
|
import api from '@/utils/api' |
||||
|
import qs from 'qs' |
||||
|
|
||||
|
const rootUrl = '/dicMutiLevelDirectory' |
||||
|
|
||||
|
export function add(data) { |
||||
|
return api({ |
||||
|
url: rootUrl, |
||||
|
method: 'post', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function edit(data) { |
||||
|
return api({ |
||||
|
url: rootUrl, |
||||
|
method: 'put', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
export function del(params) { |
||||
|
return api({ |
||||
|
url: rootUrl, |
||||
|
method: 'delete', |
||||
|
params, |
||||
|
paramsSerializer: function(params) { |
||||
|
return qs.stringify(params, { indices: false }) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function get(params) { |
||||
|
return api({ |
||||
|
url: rootUrl, |
||||
|
method: 'get', |
||||
|
params |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function getTreeList(params) { |
||||
|
return api({ |
||||
|
url: rootUrl + '/getTreeList', |
||||
|
method: 'get', |
||||
|
params |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export default { add, edit, del, get } |
||||
@ -0,0 +1,298 @@ |
|||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<!--头部选项--> |
||||
|
<div class="head-container"> |
||||
|
<div> |
||||
|
<el-date-picker |
||||
|
v-model="query.jieyueTime" |
||||
|
type="date" |
||||
|
placeholder="选择借阅日期" |
||||
|
@change="crud.toQuery" |
||||
|
/> |
||||
|
<el-select |
||||
|
v-model="query.state" |
||||
|
placeholder="请选择借阅状态" |
||||
|
style="width: 150px" |
||||
|
class="filter-item" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in ifOverdueList" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
/> |
||||
|
</el-select> |
||||
|
<el-select |
||||
|
v-model="query.jieyueren" |
||||
|
placeholder="请选择借阅人" |
||||
|
style="width: 150px" |
||||
|
class="filter-item" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in useStateList" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.id" |
||||
|
/> |
||||
|
</el-select> |
||||
|
<el-button type="primary" icon="el-icon-search" @click="crud.toQuery"> |
||||
|
查询 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!--表格内容--> |
||||
|
<CustomTable |
||||
|
ref="customTable" |
||||
|
:col-configs="colConfigs" |
||||
|
:columns="columns" |
||||
|
:crud="crud" |
||||
|
:row-class-name="getTableRowClassName" |
||||
|
> |
||||
|
<el-table-column slot="operation" align="center" width="100" label="操作"> |
||||
|
<template slot-scope="scope"> |
||||
|
<Edit |
||||
|
:permission="permission" |
||||
|
:data="scope.row" |
||||
|
:disabled-edit="false" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</CustomTable> |
||||
|
<pagination /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CRUD, { form, header, presenter } from '@/components/Crud/crud' |
||||
|
// import Crud from '@/components/Crud' |
||||
|
import Edit from '@/components/Crud/Edit' |
||||
|
import CustomTable from '@/components/Crud/Table' |
||||
|
import Pagination from '@/components/Crud/Pagination' |
||||
|
|
||||
|
// crud交由presenter持有 |
||||
|
const defaultCrud = presenter( |
||||
|
CRUD({ |
||||
|
title: '借阅记录', |
||||
|
url: '/borrowing/list', |
||||
|
orderBy: ['id asc'] |
||||
|
}) |
||||
|
) |
||||
|
|
||||
|
// 设置初始form |
||||
|
const defaultForm = form({ |
||||
|
baogaobianhao: null, |
||||
|
assetNum: '', |
||||
|
equipmentNum: '', |
||||
|
customName: '', |
||||
|
equipmentName: '', |
||||
|
classCode: '', |
||||
|
brand: '', |
||||
|
specifications: '', |
||||
|
factoryNum: '', |
||||
|
location: '', |
||||
|
achieveDate: '', |
||||
|
commissioningDate: '', |
||||
|
remark: '', |
||||
|
quantity: '', |
||||
|
unitPrice: '', |
||||
|
totalPrice: '', |
||||
|
valueType: '', |
||||
|
assetSource: '', |
||||
|
fundingSource: '', |
||||
|
procurementType: '', |
||||
|
discount: '', |
||||
|
netWorth: '', |
||||
|
depreciationState: '', |
||||
|
bookedState: '', |
||||
|
departmentId: '', |
||||
|
principal: '', |
||||
|
propertyUnit: '', |
||||
|
useState: '', |
||||
|
useDirection: '', |
||||
|
useYear: '', |
||||
|
usePurpose: '', |
||||
|
measureState: '', |
||||
|
earlyWarningCycle: '', |
||||
|
checkLastDate: '', |
||||
|
checkDate: '' |
||||
|
}) |
||||
|
|
||||
|
export default { |
||||
|
name: 'InstrumentList', |
||||
|
components: { Pagination, CustomTable, Edit }, |
||||
|
mixins: [defaultCrud, defaultForm, header()], |
||||
|
data() { |
||||
|
return { |
||||
|
colConfigs: [ |
||||
|
{ prop: 'baogaobianhao', label: '报告编号', align: 'center' }, |
||||
|
{ prop: 'createBy', label: '创建人', align: 'center' }, |
||||
|
{ prop: 'createTime', label: '创建时间', align: 'center' }, |
||||
|
{ prop: 'guihuanTime', label: '归还时间', align: 'center' }, |
||||
|
{ prop: 'jieyueTime', label: '借阅时间', align: 'center' }, |
||||
|
{ prop: 'jieyueren', label: '借阅人', align: 'center' }, |
||||
|
{ prop: 'state', label: '借阅状态', align: 'center' }, |
||||
|
{ prop: 'updateBy', label: '修改人', align: 'center' }, |
||||
|
{ |
||||
|
prop: 'updateTime', |
||||
|
label: '更新时间', |
||||
|
align: 'center', |
||||
|
formatter: this.formatter.formatterDepartmentName |
||||
|
}, |
||||
|
{ slot: 'operation' } |
||||
|
], |
||||
|
permission: { |
||||
|
add: ['instrument:add'], |
||||
|
edit: ['instrument:update'], |
||||
|
del: ['instrument:delete'] |
||||
|
}, |
||||
|
dicAssetTree: [], |
||||
|
parentId: [], |
||||
|
activeName: 'first', |
||||
|
valueTypeList: [], |
||||
|
assetSourceList: [], |
||||
|
fundingSourceList: [], |
||||
|
procurementTypeList: [], |
||||
|
depreciationStateList: [], |
||||
|
bookedStateList: [ |
||||
|
{ label: '已入账', value: true }, |
||||
|
{ label: '未入账', value: false } |
||||
|
], |
||||
|
departmentTree: [], |
||||
|
departmentId: 0, |
||||
|
treeSelectProps: { |
||||
|
children: 'children', |
||||
|
label: 'name', |
||||
|
value: 'id' |
||||
|
}, |
||||
|
userList: this.$store.getters.allUser, |
||||
|
useStateList: [], |
||||
|
useDirectionList: [], |
||||
|
usePurposeList: [], |
||||
|
measureStateList: [ |
||||
|
{ value: true, label: '计量' }, |
||||
|
{ value: false, label: '非计量' } |
||||
|
], |
||||
|
ifOverdueList: [ |
||||
|
{ value: 0, label: '正常' }, |
||||
|
{ value: 1, label: '预警' }, |
||||
|
{ value: 2, label: '超期' } |
||||
|
], |
||||
|
cycleList: [], |
||||
|
rules: { |
||||
|
departmentId: [ |
||||
|
{ required: true, message: '请选择使用部门', trigger: 'blur' } |
||||
|
], |
||||
|
quantity: [ |
||||
|
{ required: true, message: '请填写设备数量', trigger: 'blur' } |
||||
|
], |
||||
|
unitPrice: [ |
||||
|
{ required: true, message: '请填写设备单价', trigger: 'blur' } |
||||
|
], |
||||
|
totalPrice: [ |
||||
|
{ required: true, message: '请填写设备总价', trigger: 'blur' } |
||||
|
], |
||||
|
useState: [ |
||||
|
{ required: true, message: '请选择使用状况', trigger: 'blur' } |
||||
|
], |
||||
|
useYear: [ |
||||
|
{ required: true, message: '请填写使用年限', trigger: 'blur' } |
||||
|
], |
||||
|
measureState: [ |
||||
|
{ required: true, message: '请选择计量状态', trigger: 'blur' } |
||||
|
], |
||||
|
principal: [ |
||||
|
{ required: true, message: '请选择使用人', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
instrumentId: 0, |
||||
|
moveDialogVisible: false, |
||||
|
ifMeasure: false |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
// this.initDicDataList() |
||||
|
}, |
||||
|
methods: { |
||||
|
// 刷新之后重置部门查询的值 |
||||
|
[CRUD.HOOK.afterResetQuery]() { |
||||
|
if (this.$refs.queryTreeSelect) { |
||||
|
this.$refs.queryTreeSelect.clearHandle() |
||||
|
} |
||||
|
}, |
||||
|
// 新增与编辑前做的操作 |
||||
|
[CRUD.HOOK.afterToCU]() { |
||||
|
this.activeName = 'first' |
||||
|
}, |
||||
|
// 编辑框打开后做的操作 |
||||
|
[CRUD.HOOK.afterToEdit](crud, form) { |
||||
|
this.departmentId = form.departmentId |
||||
|
this.ifMeasure = form.measureState |
||||
|
}, |
||||
|
// 编辑框取消后的操作 |
||||
|
[CRUD.HOOK.afterEditCancel]() { |
||||
|
this.departmentId = 0 |
||||
|
this.ifMeasure = false |
||||
|
}, |
||||
|
// EXCEL上传方法 |
||||
|
beforeUpload(file) { |
||||
|
const isExcel = |
||||
|
file.type === 'application/vnd.ms-excel' || |
||||
|
file.type === |
||||
|
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' |
||||
|
if (!isExcel) { |
||||
|
this.$notify.error('只能上传xls/xlsx格式的文件') |
||||
|
return false |
||||
|
} |
||||
|
const fd = new FormData() |
||||
|
fd.append('file', file) |
||||
|
fd.append('type', 3) |
||||
|
// uploadInstrumentData(fd).then(() => { |
||||
|
// this.$notify.success('导入数据成功。') |
||||
|
// this.crud.toQuery() |
||||
|
// }) |
||||
|
}, |
||||
|
|
||||
|
// 关闭所有弹窗 |
||||
|
resetChecks() { |
||||
|
this.moveDialogVisible = false |
||||
|
}, |
||||
|
// 给检索条件赋值（部门主键） |
||||
|
getDepartmentId(value) { |
||||
|
this.query.departmentId = value === 0 ? '' : value |
||||
|
}, |
||||
|
// 更改行超期、预警字体颜色 |
||||
|
getTableRowClassName({ row }) { |
||||
|
let color = '' |
||||
|
switch (row.ifOverdue) { |
||||
|
case 2: |
||||
|
color = 'table-row-color-red' |
||||
|
break |
||||
|
case 1: |
||||
|
color = 'table-row-color-orange' |
||||
|
break |
||||
|
default: |
||||
|
color = '' |
||||
|
break |
||||
|
} |
||||
|
return color |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style> |
||||
|
input::-webkit-outer-spin-button, |
||||
|
input::-webkit-inner-spin-button { |
||||
|
-webkit-appearance: none !important; |
||||
|
margin: 0; |
||||
|
} |
||||
|
.identification { |
||||
|
width: 30px; |
||||
|
height: 15px; |
||||
|
display: inline-block; |
||||
|
border: gray 1px solid; |
||||
|
border-radius: 15px; |
||||
|
float: left; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,298 @@ |
|||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<!--头部选项--> |
||||
|
<div class="head-container"> |
||||
|
<div> |
||||
|
<el-date-picker |
||||
|
v-model="query.jieyueTime" |
||||
|
type="date" |
||||
|
placeholder="选择借阅日期" |
||||
|
@change="crud.toQuery" |
||||
|
/> |
||||
|
<el-select |
||||
|
v-model="query.state" |
||||
|
placeholder="请选择借阅状态" |
||||
|
style="width: 150px" |
||||
|
class="filter-item" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in ifOverdueList" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
/> |
||||
|
</el-select> |
||||
|
<el-select |
||||
|
v-model="query.jieyueren" |
||||
|
placeholder="请选择借阅人" |
||||
|
style="width: 150px" |
||||
|
class="filter-item" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in useStateList" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.id" |
||||
|
/> |
||||
|
</el-select> |
||||
|
<el-button type="primary" icon="el-icon-search" @click="crud.toQuery"> |
||||
|
查询 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!--表格内容--> |
||||
|
<CustomTable |
||||
|
ref="customTable" |
||||
|
:col-configs="colConfigs" |
||||
|
:columns="columns" |
||||
|
:crud="crud" |
||||
|
:row-class-name="getTableRowClassName" |
||||
|
> |
||||
|
<el-table-column slot="operation" align="center" width="100" label="操作"> |
||||
|
<template slot-scope="scope"> |
||||
|
<Edit |
||||
|
:permission="permission" |
||||
|
:data="scope.row" |
||||
|
:disabled-edit="false" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</CustomTable> |
||||
|
<pagination /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CRUD, { form, header, presenter } from '@/components/Crud/crud' |
||||
|
// import Crud from '@/components/Crud' |
||||
|
import Edit from '@/components/Crud/Edit' |
||||
|
import CustomTable from '@/components/Crud/Table' |
||||
|
import Pagination from '@/components/Crud/Pagination' |
||||
|
|
||||
|
// crud交由presenter持有 |
||||
|
const defaultCrud = presenter( |
||||
|
CRUD({ |
||||
|
title: '借阅记录', |
||||
|
url: '/borrowing/list', |
||||
|
orderBy: ['id asc'] |
||||
|
}) |
||||
|
) |
||||
|
|
||||
|
// 设置初始form |
||||
|
const defaultForm = form({ |
||||
|
baogaobianhao: null, |
||||
|
assetNum: '', |
||||
|
equipmentNum: '', |
||||
|
customName: '', |
||||
|
equipmentName: '', |
||||
|
classCode: '', |
||||
|
brand: '', |
||||
|
specifications: '', |
||||
|
factoryNum: '', |
||||
|
location: '', |
||||
|
achieveDate: '', |
||||
|
commissioningDate: '', |
||||
|
remark: '', |
||||
|
quantity: '', |
||||
|
unitPrice: '', |
||||
|
totalPrice: '', |
||||
|
valueType: '', |
||||
|
assetSource: '', |
||||
|
fundingSource: '', |
||||
|
procurementType: '', |
||||
|
discount: '', |
||||
|
netWorth: '', |
||||
|
depreciationState: '', |
||||
|
bookedState: '', |
||||
|
departmentId: '', |
||||
|
principal: '', |
||||
|
propertyUnit: '', |
||||
|
useState: '', |
||||
|
useDirection: '', |
||||
|
useYear: '', |
||||
|
usePurpose: '', |
||||
|
measureState: '', |
||||
|
earlyWarningCycle: '', |
||||
|
checkLastDate: '', |
||||
|
checkDate: '' |
||||
|
}) |
||||
|
|
||||
|
export default { |
||||
|
name: 'InstrumentList', |
||||
|
components: { Pagination, CustomTable, Edit }, |
||||
|
mixins: [defaultCrud, defaultForm, header()], |
||||
|
data() { |
||||
|
return { |
||||
|
colConfigs: [ |
||||
|
{ prop: 'baogaobianhao', label: '报告编号', align: 'center' }, |
||||
|
{ prop: 'createBy', label: '创建人', align: 'center' }, |
||||
|
{ prop: 'createTime', label: '创建时间', align: 'center' }, |
||||
|
{ prop: 'guihuanTime', label: '归还时间', align: 'center' }, |
||||
|
{ prop: 'jieyueTime', label: '借阅时间', align: 'center' }, |
||||
|
{ prop: 'jieyueren', label: '借阅人', align: 'center' }, |
||||
|
{ prop: 'state', label: '借阅状态', align: 'center' }, |
||||
|
{ prop: 'updateBy', label: '修改人', align: 'center' }, |
||||
|
{ |
||||
|
prop: 'updateTime', |
||||
|
label: '更新时间', |
||||
|
align: 'center', |
||||
|
formatter: this.formatter.formatterDepartmentName |
||||
|
}, |
||||
|
{ slot: 'operation' } |
||||
|
], |
||||
|
permission: { |
||||
|
add: ['instrument:add'], |
||||
|
edit: ['instrument:update'], |
||||
|
del: ['instrument:delete'] |
||||
|
}, |
||||
|
dicAssetTree: [], |
||||
|
parentId: [], |
||||
|
activeName: 'first', |
||||
|
valueTypeList: [], |
||||
|
assetSourceList: [], |
||||
|
fundingSourceList: [], |
||||
|
procurementTypeList: [], |
||||
|
depreciationStateList: [], |
||||
|
bookedStateList: [ |
||||
|
{ label: '已入账', value: true }, |
||||
|
{ label: '未入账', value: false } |
||||
|
], |
||||
|
departmentTree: [], |
||||
|
departmentId: 0, |
||||
|
treeSelectProps: { |
||||
|
children: 'children', |
||||
|
label: 'name', |
||||
|
value: 'id' |
||||
|
}, |
||||
|
userList: this.$store.getters.allUser, |
||||
|
useStateList: [], |
||||
|
useDirectionList: [], |
||||
|
usePurposeList: [], |
||||
|
measureStateList: [ |
||||
|
{ value: true, label: '计量' }, |
||||
|
{ value: false, label: '非计量' } |
||||
|
], |
||||
|
ifOverdueList: [ |
||||
|
{ value: 0, label: '正常' }, |
||||
|
{ value: 1, label: '预警' }, |
||||
|
{ value: 2, label: '超期' } |
||||
|
], |
||||
|
cycleList: [], |
||||
|
rules: { |
||||
|
departmentId: [ |
||||
|
{ required: true, message: '请选择使用部门', trigger: 'blur' } |
||||
|
], |
||||
|
quantity: [ |
||||
|
{ required: true, message: '请填写设备数量', trigger: 'blur' } |
||||
|
], |
||||
|
unitPrice: [ |
||||
|
{ required: true, message: '请填写设备单价', trigger: 'blur' } |
||||
|
], |
||||
|
totalPrice: [ |
||||
|
{ required: true, message: '请填写设备总价', trigger: 'blur' } |
||||
|
], |
||||
|
useState: [ |
||||
|
{ required: true, message: '请选择使用状况', trigger: 'blur' } |
||||
|
], |
||||
|
useYear: [ |
||||
|
{ required: true, message: '请填写使用年限', trigger: 'blur' } |
||||
|
], |
||||
|
measureState: [ |
||||
|
{ required: true, message: '请选择计量状态', trigger: 'blur' } |
||||
|
], |
||||
|
principal: [ |
||||
|
{ required: true, message: '请选择使用人', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
instrumentId: 0, |
||||
|
moveDialogVisible: false, |
||||
|
ifMeasure: false |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
// this.initDicDataList() |
||||
|
}, |
||||
|
methods: { |
||||
|
// 刷新之后重置部门查询的值 |
||||
|
[CRUD.HOOK.afterResetQuery]() { |
||||
|
if (this.$refs.queryTreeSelect) { |
||||
|
this.$refs.queryTreeSelect.clearHandle() |
||||
|
} |
||||
|
}, |
||||
|
// 新增与编辑前做的操作 |
||||
|
[CRUD.HOOK.afterToCU]() { |
||||
|
this.activeName = 'first' |
||||
|
}, |
||||
|
// 编辑框打开后做的操作 |
||||
|
[CRUD.HOOK.afterToEdit](crud, form) { |
||||
|
this.departmentId = form.departmentId |
||||
|
this.ifMeasure = form.measureState |
||||
|
}, |
||||
|
// 编辑框取消后的操作 |
||||
|
[CRUD.HOOK.afterEditCancel]() { |
||||
|
this.departmentId = 0 |
||||
|
this.ifMeasure = false |
||||
|
}, |
||||
|
// EXCEL上传方法 |
||||
|
beforeUpload(file) { |
||||
|
const isExcel = |
||||
|
file.type === 'application/vnd.ms-excel' || |
||||
|
file.type === |
||||
|
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' |
||||
|
if (!isExcel) { |
||||
|
this.$notify.error('只能上传xls/xlsx格式的文件') |
||||
|
return false |
||||
|
} |
||||
|
const fd = new FormData() |
||||
|
fd.append('file', file) |
||||
|
fd.append('type', 3) |
||||
|
// uploadInstrumentData(fd).then(() => { |
||||
|
// this.$notify.success('导入数据成功。') |
||||
|
// this.crud.toQuery() |
||||
|
// }) |
||||
|
}, |
||||
|
|
||||
|
// 关闭所有弹窗 |
||||
|
resetChecks() { |
||||
|
this.moveDialogVisible = false |
||||
|
}, |
||||
|
// 给检索条件赋值（部门主键） |
||||
|
getDepartmentId(value) { |
||||
|
this.query.departmentId = value === 0 ? '' : value |
||||
|
}, |
||||
|
// 更改行超期、预警字体颜色 |
||||
|
getTableRowClassName({ row }) { |
||||
|
let color = '' |
||||
|
switch (row.ifOverdue) { |
||||
|
case 2: |
||||
|
color = 'table-row-color-red' |
||||
|
break |
||||
|
case 1: |
||||
|
color = 'table-row-color-orange' |
||||
|
break |
||||
|
default: |
||||
|
color = '' |
||||
|
break |
||||
|
} |
||||
|
return color |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style> |
||||
|
input::-webkit-outer-spin-button, |
||||
|
input::-webkit-inner-spin-button { |
||||
|
-webkit-appearance: none !important; |
||||
|
margin: 0; |
||||
|
} |
||||
|
.identification { |
||||
|
width: 30px; |
||||
|
height: 15px; |
||||
|
display: inline-block; |
||||
|
border: gray 1px solid; |
||||
|
border-radius: 15px; |
||||
|
float: left; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,217 @@ |
|||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<!--头部选项--> |
||||
|
<div class="head-container"> |
||||
|
<div v-if="crud.props.searchToggle"> |
||||
|
<el-input v-model="query.equipmentNum" placeholder="请输入设备编号" style="width: 200px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
||||
|
<el-input v-model="query.customName" placeholder="请输入新名称" style="width: 200px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
||||
|
<el-input v-model="query.unitPrice" placeholder="请输入单价" style="width: 150px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
||||
|
<el-select v-model="query.measureState" placeholder="请选择计量状态" style="width: 150px;" class="filter-item" clearable> |
||||
|
<el-option v-for="item in measureStateList" :key="item.value" :label="item.label" :value="item.value" /> |
||||
|
</el-select> |
||||
|
<el-select v-model="query.ifOverdue" placeholder="请选择超期状态" style="width: 150px;" class="filter-item" clearable> |
||||
|
<el-option v-for="item in ifOverdueList" :key="item.value" :label="item.label" :value="item.value" /> |
||||
|
</el-select> |
||||
|
<el-select v-model="query.useState" placeholder="请选择使用状况" style="width: 150px;" class="filter-item" clearable> |
||||
|
<el-option v-for="item in useStateList" :key="item.value" :label="item.label" :value="item.id" /> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!--表格内容--> |
||||
|
<CustomTable ref="customTable" :col-configs="colConfigs" :columns="columns" :crud="crud" :row-class-name="getTableRowClassName"> |
||||
|
<el-table-column slot="operation" align="center" width="100" label="操作"> |
||||
|
<template slot-scope="scope"> |
||||
|
<Edit :permission="permission" :data="scope.row" :disabled-edit="false" /> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</CustomTable> |
||||
|
<pagination /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CRUD, { form, header, presenter } from '@/components/Crud/crud' |
||||
|
// import Crud from '@/components/Crud' |
||||
|
import Edit from '@/components/Crud/Edit' |
||||
|
import CustomTable from '@/components/Crud/Table' |
||||
|
import Pagination from '@/components/Crud/Pagination' |
||||
|
|
||||
|
// crud交由presenter持有 |
||||
|
const defaultCrud = presenter(CRUD({ |
||||
|
title: '借阅记录', |
||||
|
url: '/borrowing/list', |
||||
|
orderBy: ['id asc'] |
||||
|
})) |
||||
|
|
||||
|
// 设置初始form |
||||
|
const defaultForm = form({ |
||||
|
|
||||
|
}) |
||||
|
|
||||
|
export default { |
||||
|
name: 'InstrumentList', |
||||
|
components: { Pagination, CustomTable, Edit }, |
||||
|
mixins: [defaultCrud, defaultForm, header()], |
||||
|
data() { |
||||
|
return { |
||||
|
colConfigs: [ |
||||
|
{ prop: 'equipmentNum', label: '设备编号', align: 'center' }, |
||||
|
{ prop: 'customName', label: '新名称', align: 'center' }, |
||||
|
{ prop: 'brand', label: '品牌', align: 'center' }, |
||||
|
{ prop: 'factoryNum', label: '出厂编号', align: 'center' }, |
||||
|
{ prop: 'achieveDate', label: '购置时间', align: 'center' }, |
||||
|
{ prop: 'quantity', label: '数量', align: 'center' }, |
||||
|
{ prop: 'unitPrice', label: '单价', align: 'center' }, |
||||
|
{ prop: 'totalPrice', label: '总价', align: 'center' }, |
||||
|
{ slot: 'operation' } |
||||
|
], |
||||
|
permission: { |
||||
|
add: ['instrument:add'], |
||||
|
edit: ['instrument:update'], |
||||
|
del: ['instrument:delete'] |
||||
|
}, |
||||
|
dicAssetTree: [], |
||||
|
parentId: [], |
||||
|
activeName: 'first', |
||||
|
valueTypeList: [], |
||||
|
assetSourceList: [], |
||||
|
fundingSourceList: [], |
||||
|
procurementTypeList: [], |
||||
|
depreciationStateList: [], |
||||
|
bookedStateList: [ |
||||
|
{ label: '已入账', value: true }, |
||||
|
{ label: '未入账', value: false } |
||||
|
], |
||||
|
departmentTree: [], |
||||
|
departmentId: 0, |
||||
|
treeSelectProps: { |
||||
|
children: 'children', |
||||
|
label: 'name', |
||||
|
value: 'id' |
||||
|
}, |
||||
|
userList: this.$store.getters.allUser, |
||||
|
useStateList: [], |
||||
|
useDirectionList: [], |
||||
|
usePurposeList: [], |
||||
|
measureStateList: [ |
||||
|
{ value: true, label: '计量' }, |
||||
|
{ value: false, label: '非计量' } |
||||
|
], |
||||
|
ifOverdueList: [ |
||||
|
{ value: 0, label: '正常' }, |
||||
|
{ value: 1, label: '预警' }, |
||||
|
{ value: 2, label: '超期' } |
||||
|
], |
||||
|
cycleList: [], |
||||
|
rules: { |
||||
|
departmentId: [ |
||||
|
{ required: true, message: '请选择使用部门', trigger: 'blur' } |
||||
|
], |
||||
|
quantity: [ |
||||
|
{ required: true, message: '请填写设备数量', trigger: 'blur' } |
||||
|
], |
||||
|
unitPrice: [ |
||||
|
{ required: true, message: '请填写设备单价', trigger: 'blur' } |
||||
|
], |
||||
|
totalPrice: [ |
||||
|
{ required: true, message: '请填写设备总价', trigger: 'blur' } |
||||
|
], |
||||
|
useState: [ |
||||
|
{ required: true, message: '请选择使用状况', trigger: 'blur' } |
||||
|
], |
||||
|
useYear: [ |
||||
|
{ required: true, message: '请填写使用年限', trigger: 'blur' } |
||||
|
], |
||||
|
measureState: [ |
||||
|
{ required: true, message: '请选择计量状态', trigger: 'blur' } |
||||
|
], |
||||
|
principal: [ |
||||
|
{ required: true, message: '请选择使用人', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
instrumentId: 0, |
||||
|
moveDialogVisible: false, |
||||
|
ifMeasure: false |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
}, |
||||
|
methods: { |
||||
|
// 刷新之后重置部门查询的值 |
||||
|
[CRUD.HOOK.afterResetQuery]() { |
||||
|
if (this.$refs.queryTreeSelect) { |
||||
|
this.$refs.queryTreeSelect.clearHandle() |
||||
|
} |
||||
|
}, |
||||
|
// 新增与编辑前做的操作 |
||||
|
[CRUD.HOOK.afterToCU]() { |
||||
|
this.activeName = 'first' |
||||
|
}, |
||||
|
// 编辑框打开后做的操作 |
||||
|
[CRUD.HOOK.afterToEdit](crud, form) { |
||||
|
this.departmentId = form.departmentId |
||||
|
this.ifMeasure = form.measureState |
||||
|
}, |
||||
|
// 编辑框取消后的操作 |
||||
|
[CRUD.HOOK.afterEditCancel]() { |
||||
|
this.departmentId = 0 |
||||
|
this.ifMeasure = false |
||||
|
}, |
||||
|
// EXCEL上传方法 |
||||
|
beforeUpload(file) { |
||||
|
const isExcel = file.type === 'application/vnd.ms-excel' || file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' |
||||
|
if (!isExcel) { |
||||
|
this.$notify.error('只能上传xls/xlsx格式的文件') |
||||
|
return false |
||||
|
} |
||||
|
const fd = new FormData() |
||||
|
fd.append('file', file) |
||||
|
fd.append('type', 3) |
||||
|
// uploadInstrumentData(fd).then(() => { |
||||
|
// this.$notify.success('导入数据成功。') |
||||
|
// this.crud.toQuery() |
||||
|
// }) |
||||
|
}, |
||||
|
|
||||
|
// 关闭所有弹窗 |
||||
|
resetChecks() { |
||||
|
this.moveDialogVisible = false |
||||
|
}, |
||||
|
// 给检索条件赋值（部门主键） |
||||
|
getDepartmentId(value) { |
||||
|
this.query.departmentId = value === 0 ? '' : value |
||||
|
}, |
||||
|
// 更改行超期、预警字体颜色 |
||||
|
getTableRowClassName({ row }) { |
||||
|
let color = '' |
||||
|
switch (row.ifOverdue) { |
||||
|
case 2: |
||||
|
color = 'table-row-color-red' |
||||
|
break |
||||
|
case 1: |
||||
|
color = 'table-row-color-orange' |
||||
|
break |
||||
|
default: |
||||
|
color = '' |
||||
|
break |
||||
|
} |
||||
|
return color |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style> |
||||
|
input::-webkit-outer-spin-button, |
||||
|
input::-webkit-inner-spin-button { |
||||
|
-webkit-appearance: none !important; |
||||
|
margin: 0; |
||||
|
} |
||||
|
.identification{ |
||||
|
width: 30px; |
||||
|
height:15px; |
||||
|
display: inline-block; |
||||
|
border:gray 1px solid; |
||||
|
border-radius:15px; |
||||
|
float: left; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,322 @@ |
|||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<!--头部选项--> |
||||
|
<div class="head-container"> |
||||
|
<div> |
||||
|
<el-input v-model="query.username" placeholder="用户名称" style="width: 200px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
||||
|
<el-input v-model="query.identificationNum" placeholder="身份证号码" style="width: 200px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
||||
|
<el-date-picker v-model="startExpirationDateQuery" type="month" value-format="yyyy-MM" placeholder="选择有效日期终-开始" class="filter-item" @change="changeStartExpirationDateQuery" /> |
||||
|
<el-date-picker v-model="endExpirationDateQuery" type="month" value-format="yyyy-MM" placeholder="选择有效日期终-结束" class="filter-item" @change="changeEndExpirationDateQuery" /> |
||||
|
<query :crud="crud" /> |
||||
|
</div> |
||||
|
<crud :permission="permission"> |
||||
|
<el-button slot="right" class="filter-item" icon="el-icon-download" type="warning" @click="dialogVisible = true"> |
||||
|
导出数据 |
||||
|
</el-button> |
||||
|
</crud> |
||||
|
</div> |
||||
|
<!--表格内容--> |
||||
|
<CustomTable ref="customTable" :col-configs="colConfigs" :columns="columns" :crud="crud" :row-class-name="getTableRowClassName"> |
||||
|
<el-table-column v-if="checkPermission(permission.edit)" slot="operation" align="center" width="100" label="操作"> |
||||
|
<template slot-scope="scope"> |
||||
|
<Edit :permission="permission" :data="scope.row" :disabled-edit="false" /> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</CustomTable> |
||||
|
<pagination /> |
||||
|
<el-dialog :title="crud.status.title" :visible.sync="crud.status.editor > 0" :before-close="crud.cancelCU"> |
||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="130px"> |
||||
|
<el-form-item label="姓名：" prop="username"> |
||||
|
<el-input v-model="form.username" placeholder="填写姓名" type="text" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="身份证号码：" prop="identificationNum"> |
||||
|
<el-input v-model="form.identificationNum" placeholder="填写身份证号码" type="text" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="学历：" prop="education"> |
||||
|
<el-select v-model="form.education" placeholder="填写学历"> |
||||
|
<el-option v-for="item in educationDicList" :key="item.id" :label="item.label" :value="item.value" /> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="专业：" prop="major"> |
||||
|
<el-input v-model="form.major" placeholder="填写专业" type="text" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="职称：" prop="certificateName"> |
||||
|
<el-select v-model="form.certificateName" placeholder="填写职称"> |
||||
|
<el-option v-for="item in certificateNameDicList" :key="item.id" :label="item.label" :value="item.value" /> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="级别/项目/代号：" prop="levelList"> |
||||
|
<el-cascader v-model="levelList" :options="levelOptions" @change="changeLevel" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="证书编号：" prop="certificateNum"> |
||||
|
<el-input v-model="form.certificateNum" placeholder="填写证书编号" type="text" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="有效期：" prop="expirationDate"> |
||||
|
<el-date-picker v-model="expirationDate" type="monthrange" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM" @change="changeExpirationDate" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="发换证日期：" prop="renewalDate"> |
||||
|
<el-date-picker v-model="form.renewalDate" type="date" value-format="yyyy-MM-dd" placeholder="选择开始日期" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="备注：" prop="remarks"> |
||||
|
<el-select v-model="form.remarks" placeholder="填写备注"> |
||||
|
<el-option v-for="item in remarksDicList" :key="item.id" :label="item.label" :value="item.value" /> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="crud.cancelCU"> |
||||
|
取 消 |
||||
|
</el-button> |
||||
|
<el-button type="primary" @click="crud.submitCU"> |
||||
|
确 认 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
<el-dialog width="60%" :visible.sync="dialogVisible" title="自定义导出选项" @close="closeExportDialog"> |
||||
|
<el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" style="margin: 5px" @change="handleCheckAllChange"> |
||||
|
全选 |
||||
|
</el-checkbox> |
||||
|
<div style="margin: 15px 0;" /> |
||||
|
<el-checkbox-group v-model="checkedOptions" @change="handleCheckedChange"> |
||||
|
<el-checkbox v-for="options in exportOptionsData" :key="options.value" border :label="options.value" style="margin: 5px"> |
||||
|
{{ options.label }} |
||||
|
</el-checkbox> |
||||
|
</el-checkbox-group> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="dialogVisible = false"> |
||||
|
取 消 |
||||
|
</el-button> |
||||
|
<el-button type="primary" @click="exportCertificate"> |
||||
|
确 认 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CRUD, { form, header, presenter } from '@/components/Crud/crud' |
||||
|
import Crud from '@/components/Crud' |
||||
|
import Query from '@/components/Crud/Query' |
||||
|
import Edit from '@/components/Crud/Edit' |
||||
|
import CustomTable from '@/components/Crud/Table' |
||||
|
import Pagination from '@/components/Crud/Pagination' |
||||
|
import CrudCertificate, { exportExcel } from '@/api/certificate' |
||||
|
import { getTreeList } from '@/api/dic_muti_level_directory' |
||||
|
import { getDicDataListByTypeName, getLastDayByDate, parseTime, downloadFile } from '@/utils' |
||||
|
|
||||
|
// crud交由presenter持有 |
||||
|
const defaultCrud = presenter(CRUD({ |
||||
|
title: '证书', |
||||
|
url: '/certificate/list', |
||||
|
orderBy: ['id asc'], |
||||
|
crudMethod: { ...CrudCertificate } |
||||
|
})) |
||||
|
|
||||
|
// 设置初始form |
||||
|
const defaultForm = form({}) |
||||
|
|
||||
|
export default { |
||||
|
name: 'CertificateList', |
||||
|
components: { Pagination, Query, Crud, CustomTable, Edit }, |
||||
|
mixins: [defaultCrud, defaultForm, header()], |
||||
|
data() { |
||||
|
const validatorLevelList = (rule, value, callback) => { |
||||
|
if (!this.levelList.length) { |
||||
|
callback(new Error('请输入级别/项目/代号')) |
||||
|
} else { |
||||
|
callback() |
||||
|
} |
||||
|
} |
||||
|
const validatorExpirationDate = (rule, value, callback) => { |
||||
|
if (!this.expirationDate.length) { |
||||
|
callback(new Error('请输入有效日期')) |
||||
|
} else { |
||||
|
callback() |
||||
|
} |
||||
|
} |
||||
|
return { |
||||
|
colConfigs: [ |
||||
|
{ prop: 'username', label: '姓名', align: 'center', width: 50 }, |
||||
|
{ prop: 'identificationNum', label: '身份证号码', align: 'center' }, |
||||
|
{ prop: 'education', label: '学历', align: 'center', width: 50 }, |
||||
|
{ prop: 'major', label: '专业', align: 'center' }, |
||||
|
{ prop: 'certificateName', label: '职称', align: 'center', width: 60 }, |
||||
|
{ prop: 'level', label: '级别', align: 'center', width: 50 }, |
||||
|
{ prop: 'project', label: '项目', align: 'center' }, |
||||
|
{ prop: 'code', label: '代号', align: 'center', width: 50 }, |
||||
|
{ prop: 'certificateNum', label: '证书编号', align: 'center' }, |
||||
|
{ prop: 'startExpirationDate', label: '有效日期', align: 'center', |
||||
|
formatter: (row, column, cellValue) => { |
||||
|
return (cellValue ? cellValue.substring(0, cellValue.length - 3) : '') + ' 至 ' + (row.endExpirationDate ? row.endExpirationDate.substring(0, row.endExpirationDate.length - 3) : '') |
||||
|
} |
||||
|
}, |
||||
|
{ prop: 'renewalDate', label: '发换证日期', align: 'center', width: 50 }, |
||||
|
{ prop: 'remarks', label: '备注', align: 'center', width: 60 }, |
||||
|
{ slot: 'operation' } |
||||
|
], |
||||
|
permission: { |
||||
|
add: ['certificate-list:add'], |
||||
|
edit: ['certificate-list:update'], |
||||
|
del: ['certificate-list:delete'] |
||||
|
}, |
||||
|
rules: { |
||||
|
username: [{ required: true, message: '请输入姓名', trigger: 'blur' }], |
||||
|
identificationNum: [{ required: true, message: '请输入身份证号码', trigger: 'blur' }], |
||||
|
education: [{ required: true, message: '请输入学历', trigger: 'blur' }], |
||||
|
major: [{ required: true, message: '请输入专业', trigger: 'blur' }], |
||||
|
certificateName: [{ required: true, message: '请输入职称', trigger: 'blur' }], |
||||
|
levelList: [{ validator: validatorLevelList, required: true, trigger: 'blur' }], |
||||
|
certificateNum: [{ required: true, message: '请输入证书编号', trigger: 'blur' }], |
||||
|
expirationDate: [{ validator: validatorExpirationDate, required: true, trigger: 'blur' }], |
||||
|
renewalDate: [{ required: true, message: '请输入发换证日期', trigger: 'blur' }], |
||||
|
remarks: [{ required: true, message: '请输入备注', trigger: 'blur' }] |
||||
|
}, |
||||
|
levelList: [], |
||||
|
levelOptions: [], |
||||
|
expirationDate: [], |
||||
|
educationDicList: [], |
||||
|
certificateNameDicList: [], |
||||
|
remarksDicList: [], |
||||
|
expirationDateQuery: [], |
||||
|
startExpirationDateQuery: '', |
||||
|
endExpirationDateQuery: '', |
||||
|
dialogVisible: false, |
||||
|
checkAll: [], |
||||
|
checkedOptions: [], |
||||
|
isIndeterminate: false, |
||||
|
exportOptionsData: [ |
||||
|
{ label: '姓名', value: 'username' }, |
||||
|
{ label: '身份证号码', value: 'identificationNum' }, |
||||
|
{ label: '学历', value: 'education' }, |
||||
|
{ label: '专业', value: 'major' }, |
||||
|
{ label: '职称', value: 'certificateName' }, |
||||
|
{ label: '级别', value: 'level' }, |
||||
|
{ label: '项目', value: 'project' }, |
||||
|
{ label: '代号', value: 'code' }, |
||||
|
{ label: '证书编号', value: 'certificateNum' }, |
||||
|
{ label: '有效日期开始', value: 'startExpirationDate' }, |
||||
|
{ label: '有效日期终止', value: 'endExpirationDate' }, |
||||
|
{ label: '发换证日期', value: 'renewalDate' }, |
||||
|
{ label: '备注', value: 'remarks' } |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.crud.optionShow = { |
||||
|
add: true, |
||||
|
edit: false, |
||||
|
del: true |
||||
|
} |
||||
|
getTreeList({ superParentLabel: 'certificate' }).then(data => { |
||||
|
this.levelOptions = data |
||||
|
}) |
||||
|
this.initDicDataList() |
||||
|
}, |
||||
|
methods: { |
||||
|
/** |
||||
|
* 初始化字典相关列表 |
||||
|
*/ |
||||
|
initDicDataList() { |
||||
|
this.educationDicList = getDicDataListByTypeName('education') |
||||
|
this.certificateNameDicList = getDicDataListByTypeName('certificate_name') |
||||
|
this.remarksDicList = getDicDataListByTypeName('certificate_remarks') |
||||
|
}, |
||||
|
[CRUD.HOOK.afterToAdd]() { |
||||
|
// 初始化数据 |
||||
|
this.$refs.form.resetFields() |
||||
|
this.$refs.form.clearValidate() |
||||
|
this.levelList = [] |
||||
|
this.expirationDate = [] |
||||
|
}, |
||||
|
[CRUD.HOOK.beforeToEdit]() { |
||||
|
// 初始化数据 |
||||
|
this.levelList = [this.form.level, this.form.project, this.form.code] |
||||
|
this.expirationDate = this.form.startExpirationDate ? [this.form.startExpirationDate, this.form.endExpirationDate] : [] |
||||
|
}, |
||||
|
changeLevel(value) { |
||||
|
this.form.level = value[0] |
||||
|
this.form.project = value[1] |
||||
|
this.form.code = value[2] |
||||
|
}, |
||||
|
changeExpirationDate(value) { |
||||
|
if (value) { |
||||
|
this.form.startExpirationDate = value[0] + '-01' |
||||
|
this.form.endExpirationDate = getLastDayByDate(value[1]) |
||||
|
} else { |
||||
|
this.form.startExpirationDate = '' |
||||
|
this.form.endExpirationDate = '' |
||||
|
} |
||||
|
}, |
||||
|
/** |
||||
|
* 更改行颜色 |
||||
|
* @param row |
||||
|
* @returns {string} |
||||
|
*/ |
||||
|
getTableRowClassName({ row }) { |
||||
|
const endExpirationDate = new Date(row.endExpirationDate) |
||||
|
const now = new Date() |
||||
|
if (endExpirationDate.getFullYear() < now.getFullYear() || (endExpirationDate.getFullYear() === now.getFullYear() && endExpirationDate.getMonth() <= now.getMonth())) { |
||||
|
return 'table-row-color-orange' |
||||
|
} |
||||
|
return '' |
||||
|
}, |
||||
|
changeStartExpirationDateQuery(value) { |
||||
|
if (value) { |
||||
|
this.query.startExpirationDate = getLastDayByDate(value) |
||||
|
} else { |
||||
|
this.query.startExpirationDate = '' |
||||
|
} |
||||
|
}, |
||||
|
changeEndExpirationDateQuery(value) { |
||||
|
if (value) { |
||||
|
this.query.endExpirationDate = getLastDayByDate(value) |
||||
|
} else { |
||||
|
this.query.endExpirationDate = '' |
||||
|
} |
||||
|
}, |
||||
|
closeExportDialog() { |
||||
|
this.checkAll = false |
||||
|
this.isIndeterminate = false |
||||
|
this.checkedOptions = [] |
||||
|
}, |
||||
|
handleCheckAllChange(val) { |
||||
|
if (val) { |
||||
|
this.exportOptionsData.forEach(options => { |
||||
|
this.checkedOptions.push(options.value) |
||||
|
}) |
||||
|
} else { |
||||
|
this.checkedOptions = [] |
||||
|
} |
||||
|
this.isIndeterminate = false |
||||
|
}, |
||||
|
handleCheckedChange(value) { |
||||
|
const checkedCount = value.length |
||||
|
this.checkAll = checkedCount === this.exportOptionsData.length |
||||
|
this.isIndeterminate = checkedCount > 0 && checkedCount < this.exportOptionsData.length |
||||
|
}, |
||||
|
exportCertificate() { |
||||
|
if (this.checkedOptions.length === 0) { |
||||
|
this.$message.error('请选择导出项') |
||||
|
return false |
||||
|
} |
||||
|
const sortOptions = [] |
||||
|
this.exportOptionsData.forEach(exportOptions => { |
||||
|
this.checkedOptions.forEach(checkedOptions => { |
||||
|
if (exportOptions.value === checkedOptions) { |
||||
|
sortOptions.push(checkedOptions) |
||||
|
} |
||||
|
}) |
||||
|
}) |
||||
|
exportExcel(this.crud.query, sortOptions).then(data => { |
||||
|
this.dialogVisible = false |
||||
|
downloadFile(data, parseTime(new Date()) + '-' + this.crud.title + '数据', 'xlsx') |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,89 @@ |
|||||
|
<template> |
||||
|
<div class="app-container"> |
||||
|
<div class="head-container"> |
||||
|
<crud :permission="{}" /> |
||||
|
</div> |
||||
|
<!--表格内容--> |
||||
|
<CustomTable ref="customTable" :col-configs="colConfigs" :columns="columns" :crud="crud" :row-class-name="getTableRowClassName" /> |
||||
|
<pagination /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CRUD, { header, presenter } from '@/components/Crud/crud' |
||||
|
import CustomTable from '@/components/Crud/Table' |
||||
|
import Pagination from '@/components/Crud/Pagination' |
||||
|
import CrudCertificate from '@/api/certificate' |
||||
|
import Crud from '@/components/Crud' |
||||
|
|
||||
|
// crud交由presenter持有 |
||||
|
const defaultCrud = presenter(CRUD({ |
||||
|
title: '证书', |
||||
|
url: '/certificate', |
||||
|
orderBy: ['id asc'], |
||||
|
crudMethod: { ...CrudCertificate } |
||||
|
})) |
||||
|
|
||||
|
export default { |
||||
|
name: 'CertificateList', |
||||
|
components: { Pagination, CustomTable, Crud }, |
||||
|
mixins: [defaultCrud, header()], |
||||
|
data() { |
||||
|
return { |
||||
|
colConfigs: [ |
||||
|
{ prop: 'username', label: '姓名', align: 'center', width: 50 }, |
||||
|
{ prop: 'identificationNum', label: '身份证号码', align: 'center' }, |
||||
|
{ prop: 'education', label: '学历', align: 'center', width: 50 }, |
||||
|
{ prop: 'major', label: '专业', align: 'center' }, |
||||
|
{ prop: 'certificateName', label: '职称', align: 'center', width: 60 }, |
||||
|
{ prop: 'level', label: '级别', align: 'center', width: 50 }, |
||||
|
{ prop: 'project', label: '项目', align: 'center' }, |
||||
|
{ prop: 'code', label: '代号', align: 'center', width: 50 }, |
||||
|
{ prop: 'certificateNum', label: '证书编号', align: 'center' }, |
||||
|
{ prop: 'startExpirationDate', label: '有效日期', align: 'center', |
||||
|
formatter: (row, column, cellValue) => { |
||||
|
return (cellValue ? cellValue.substring(0, cellValue.length - 3) : '') + ' 至 ' + (row.endExpirationDate ? row.endExpirationDate.substring(0, row.endExpirationDate.length - 3) : '') |
||||
|
} |
||||
|
}, |
||||
|
{ prop: 'renewalDate', label: '发换证日期', align: 'center', width: 50 }, |
||||
|
{ prop: 'remarks', label: '备注', align: 'center', width: 60 }, |
||||
|
{ slot: 'operation' } |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.crud.optionShow = { |
||||
|
add: false, |
||||
|
edit: false, |
||||
|
del: false |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
[CRUD.HOOK.beforeRefresh]() { |
||||
|
const identificationNum = this.$store.getters.identificationNum |
||||
|
if (identificationNum) { |
||||
|
this.query.identificationNum = identificationNum |
||||
|
} else { |
||||
|
return false |
||||
|
} |
||||
|
}, |
||||
|
/** |
||||
|
* 更改行颜色 |
||||
|
* @param row |
||||
|
* @returns {string} |
||||
|
*/ |
||||
|
getTableRowClassName({ row }) { |
||||
|
const endExpirationDate = new Date(row.endExpirationDate) |
||||
|
const now = new Date() |
||||
|
if (endExpirationDate.getFullYear() < now.getFullYear() || (endExpirationDate.getFullYear() === now.getFullYear() && endExpirationDate.getMonth() <= now.getMonth())) { |
||||
|
return 'table-row-color-orange' |
||||
|
} |
||||
|
return '' |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue