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.
234 lines
7.9 KiB
234 lines
7.9 KiB
<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">
|
|
<el-button type="text" @click="returnFn(scope.row)">
|
|
归还
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</CustomTable>
|
|
<pagination />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import CRUD, { form, header, presenter, crud } from '@/components/Crud/crud'
|
|
// import Crud from '@/components/Crud'
|
|
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'],
|
|
query: {
|
|
state: false
|
|
}
|
|
}))
|
|
|
|
// 设置初始form
|
|
const defaultForm = form({
|
|
})
|
|
export default {
|
|
name: 'InstrumentList',
|
|
components: { Pagination, CustomTable },
|
|
mixins: [defaultCrud, defaultForm, header(), crud()],
|
|
data() {
|
|
return {
|
|
colConfigs: [
|
|
{ prop: 'baogaobianhao', label: '报告编号', align: 'center' },
|
|
{ prop: 'jieyueren', label: '借阅人', align: 'center', formatter: this.formatter.getChineseName },
|
|
{ prop: 'jieyueTime', label: '借阅时间', align: 'center' },
|
|
{ prop: 'createBy', label: '创建人', align: 'center', formatter: this.formatter.getChineseName },
|
|
{ prop: 'createTime', label: '创建时间', align: 'center' },
|
|
{ prop: 'updateBy', label: '更新人', align: 'center', formatter: this.formatter.getChineseName },
|
|
{ prop: 'updateTime', 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()
|
|
// })
|
|
},
|
|
returnFn(row) {
|
|
console.log(row)
|
|
const currentTime = this.formatter.getNowTime()
|
|
const data = {
|
|
guihuanTime: currentTime,
|
|
id: row.id,
|
|
state: true
|
|
}
|
|
this.api({
|
|
url: '/borrowing',
|
|
method: 'put',
|
|
data: data
|
|
}).then(res => {
|
|
this.$message({ message: '归还成功', type: 'success' })
|
|
this.crud.refresh()
|
|
})
|
|
},
|
|
// 关闭所有弹窗
|
|
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>
|
|
|