lizhichao 1 year ago
commit b542fd4131
  1. 23
      src/api/itemManagement/applicationExamine.js
  2. 44
      src/api/itemManagement/itemList.js
  3. 916
      src/page/itemManagement/applicationExamine/index.vue
  4. 1099
      src/page/itemManagement/itemList/index.vue
  5. 27
      src/router/views/index.js

@ -0,0 +1,23 @@
import request from '@/router/axios';
export const findPage = (params) => {
return request({
url: '/api/blade-desk/goodsApply/findPage',
method: 'get',
params
})
}
export const detail = (params) => {
return request({
url: '/api/blade-desk/goodsApply/detail',
method: 'get',
params: params
})
}
export const remove = (params) => {
return request({
url: '/api/blade-desk/goodsApply/remove',
method: 'get',
params
})
}

@ -0,0 +1,44 @@
import request from '@/router/axios';
export const findPage = (params) => {
return request({
url: '/api/blade-desk/goods/findPage',
method: 'get',
params: params
})
}
export const detail = (params) => {
return request({
url: '/api/blade-desk/goods/detail',
method: 'get',
params: params
})
}
export const save = (data) => {
return request({
url: '/api/blade-desk/goods/save',
method: 'post',
data
})
}
export const goodsApplySave = (data) => {
return request({
url: '/api/blade-desk/goodsApply/save',
method: 'post',
data
})
}
export const remove = (params) => {
return request({
url: '/api/blade-desk/goods/remove',
method: 'get',
params
})
}
export const historyDetail = (params) => {
return request({
url: '/api/blade-desk/goods/historyDetail',
method: 'get',
params
})
}

@ -0,0 +1,916 @@
<template>
<basic-container class="content">
<div class="content-top">
<el-form
:inline="true"
:model="queryForm"
class="serch_form"
>
<el-form-item label="物品大类">
<el-select
class="search_select"
v-model="queryForm.type"
placeholder="请选择物品大类"
clearable
filterable
>
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="物品品牌">
<el-select
class="search_select"
v-model="queryForm.brand"
placeholder="请选择物品品牌"
clearable
filterable
>
<el-option
v-for="item in brandList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item
class="search_input"
label="物品名称"
>
<el-input
v-model="queryForm.name"
placeholder="请输入物品名称"
/>
</el-form-item>
<el-form-item>
<el-button class="search_button" @click="handleSearch">
<i class="el-icon-search"></i>
</el-button>
</el-form-item>
</el-form>
<div>
<el-button v-if="multipleSelection.length != 0" class="register" @click="batchDeletion">批量删除</el-button>
</div>
</div>
<div class="content-main">
<el-table
:data="tableData"
stripe
border
style="width: 100%"
:header-cell-style="{'text-align':'center'}"
:cell-style="{'text-align':'center'}"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
type="index"
label="序号"
width="70">
</el-table-column>
<el-table-column
prop="bigClass"
label="物品大类">
</el-table-column>
<el-table-column
prop="name"
label="物品名称">
</el-table-column>
<el-table-column
prop="code"
label="物品编号">
</el-table-column>
<el-table-column
prop="brand"
label="品牌">
</el-table-column>
<el-table-column
prop="model"
label="型号">
</el-table-column>
<el-table-column
prop="standard"
label="规格">
</el-table-column>
<el-table-column
prop="applyName"
label="申领人">
</el-table-column>
<el-table-column
prop="applyTime"
label="申领时间"
width="150">
</el-table-column>
<el-table-column
prop="applyNum"
label="申领数量">
</el-table-column>
<el-table-column
prop="unit"
label="单位">
</el-table-column>
<el-table-column
prop="status"
label="状态">
<template slot-scope="scope">
<div class="status-box-wrapper">
<div
class="status-box"
:class="scope.row.status == '0' ? 'blue' : (scope.row.status == '1' ? 'green' : (scope.row.status == '2' ? 'red' : 'grey'))"
>
{{ scope.row.status == '0' ? '待审核' : (scope.row.status == '1' ? '待领取' : (scope.row.status == '2' ? '已驳回' : '已领取')) }}
</div>
</div>
</template>
</el-table-column>
<el-table-column
prop="remarks"
label="备注">
</el-table-column>
<el-table-column
prop="address"
label="操作"
width="150"
align="center"
>
<template slot-scope="scope">
<el-popover
placement="bottom"
width="150"
trigger="hover">
<div class="more-box">
<div
class="item"
@click="handleOperation('view', scope.row)">查看</div>
<div
class="item"
@click="handleOperation('delete', scope.row)">删除</div>
<div
v-if="scope.row.status == '0'"
class="item"
@click="handleOperation('examine', scope.row)">审核</div>
<div
v-if="scope.row.status == '1'"
class="item"
@click="handleOperation('receive', scope.row)">领取</div>
</div>
<div class="more" slot="reference">更多</div>
</el-popover>
</template>
</el-table-column>
</el-table>
<div class="el_pagination">
<!-- <div
style="
width: 100%;
height: 100%;
position: absolute;
background: rgba(255,255,255,.9);
z-index: 9;
position: absolute;
top: 0;
left: 0;
"
v-show="loading"
></div> -->
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[6, 10, 20, 50, 100]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
</div>
</div>
<el-dialog
:title="registerTitle"
:append-to-body="true"
:visible.sync="registerDialogVisible"
width="50%"
:before-close="registerHandleClose">
<el-form
class="registerForm"
:model="registerForm"
label-width="80px"
ref="registerForm"
>
<el-col :span="8" v-if="dialogFormType == 'examine'">
<el-form-item label="物品大类" prop="type">
<el-select
v-model="registerForm.type"
placeholder="请选择物品大类"
disabled
>
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="物品名称" prop="name">
<el-input
v-model="registerForm.name"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="物品编号"
prop="code"
>
<el-input
v-model="registerForm.code"
placeholder="请输入物品编号"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="品牌"
prop="brand"
>
<el-input
v-model="registerForm.brand"
placeholder="请输入品牌"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="型号"
prop="model"
>
<el-input
v-model="registerForm.model"
placeholder="请输入型号"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="规格" prop="standard">
<el-input
v-model="registerForm.standard"
placeholder="请输入规格"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8" v-if="dialogFormType == 'examine'">
<el-form-item
label="货位"
prop="allocation"
>
<el-select
v-model="registerForm.allocation"
placeholder="请选择货位"
disabled
>
<el-option
v-for="item in goodsAllocationList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" v-if="dialogFormType == 'examine'">
<el-form-item label="库存" prop="num">
<el-input v-model="registerForm.num"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="申领数量" prop="applyNum">
<el-input v-model="registerForm.applyNum"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="单位" prop="unit">
<el-input v-model="registerForm.unit"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="申请时间" prop="applyTime">
<el-date-picker
v-model="registerForm.applyTime"
type="datetime"
placeholder="选择日期时间"
disabled>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="备注" prop="name">
<el-input v-model="registerForm.name"
disabled
/>
</el-form-item>
</el-col>
<div
v-if="dialogFormType != 'view'"
style="width: 100%; display: flex; flex-direction: column;"
>
<el-col :span="24">
<div class="form-title">{{ dialogFormType == 'examine' ? '审核结果' : '申领结果' }}</div>
</el-col>
<el-form
class="registerForm"
:model="applyForm"
label-width="80px"
:rules="rules"
ref="applyForm"
>
<el-col :span="8" v-if="dialogFormType == 'examine'">
<el-form-item label="审核意见" prop="status">
<el-select
v-model="applyForm.status"
placeholder="请选择审核意见"
>
<el-option
v-for="item in examineTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" v-if="dialogFormType == 'receive'">
<el-form-item label="实际领取" prop="actNum">
<el-input
v-model="applyForm.actNum"
placeholder="请输入实际领取"
/>
</el-form-item>
</el-col>
<el-col :span="16">
<el-form-item label="备注" prop="approveRemarks">
<el-input
v-model="applyForm.approveRemarks"
placeholder="请输入备注"
/>
</el-form-item>
</el-col>
<el-col :span="8" v-if="dialogFormType == 'receive'">
<el-form-item label="领取时间" prop="actTime">
<el-date-picker
v-model="applyForm.actTime"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
</el-col>
</el-form>
</div>
</el-form>
<div class="dialog-footer">
<el-button v-if="dialogFormType != 'view'" @click="registerHandleClick('cancel')"> </el-button>
<el-button type="primary" @click="registerHandleClick('confirm')"> </el-button>
</div>
</el-dialog>
</basic-container>
</template>
<script>
import { findPage, detail, remove } from "@/api/itemManagement/applicationExamine";
import { goodsApplySave } from "@/api/itemManagement/itemList";
export default {
data() {
return {
queryForm: {
type: '',
brand: '',
name: ''
},
typeList: [
{
value: '1',
label: '类型1'
},
{
value: '2',
label: '类型2'
},
{
value: '3',
label: '类型3'
}
],
brandList: [
{
value: '1',
label: '品牌1'
},
{
value: '2',
label: '品牌2'
},
{
value: '3',
label: '品牌3'
}
],
examineTypeList: [
{
value: '1',
label: '通过'
},
{
value: '2',
label: '不通过'
}
],
goodsAllocationList: [
{
label: '货位1',
value: '1',
},
{
label: '货位2',
value: '2',
},
{
label: '货位3',
value: '3',
},
],
tableData: [],
multipleSelection: [],
currentPage: 1,
pageSize: 10,
total: 0,
registerDialogVisible: false,
dialogFormType: '',
dialogFormDisabled: false,
registerForm: {
bigClass: '',
name: '',
code: '',
brand: '',
model: '',
standard: '',
price: '',
allocation: '',
num: '',
inNum: '',
unit: '',
useTo: '',
inDate: '',
applyNum: '',
remarks: '',
},
applyForm: {
status: '',
approveRemarks: '',
actNum: '',
actTime: '',
},
rules: {
status: [
{ required: true, message: '请选择状态', trigger: 'blur' },
],
actTime: [
{ required: true, message: '请选择状态', trigger: 'blur' },
],
actNum: [
{
validator: (rule, value, callback) => {
if (!value) {
return callback(new Error('请输入申请数量'));
}
if (!/^\d+$/.test(value)) {
return callback(new Error('请输入有效的整数'));
}
callback();
},
required: true,
trigger: 'blur'
}
],
},
drawer: false,
activeNames: []
}
},
computed: {
registerTitle() {
if(this.dialogFormType == 'view') {
return '查看详情'
} else if(this.dialogFormType == 'examine') {
return '申领审核'
} else if(this.dialogFormType == 'receive') {
return '领取确认'
}
}
},
mounted() {
this.init()
},
methods: {
// init
init() {
this.findPage()
},
//
findPage() {
let params = {
...this.queryForm,
current: this.currentPage,
size: this.pageSize
}
findPage(params).then(res => {
this.tableData = res.data.data.records
this.total = res.data.data.total
})
},
//
handleSearch() {
this.currentPage = 1
this.findPage()
},
//
handleSelectionChange(val) {
this.multipleSelection = val;
},
//
batchDeletion() {
this.$confirm('确认批量删除删除所选数据?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let ids = []
this.multipleSelection.forEach(item => {
ids.push(item.id)
})
remove({ids: ids.join(',')}).then(res => {
this.$message({
message: '删除成功',
type: 'success'
})
this.findPage()
}).catch(err => {
this.$message({
type: 'error',
message: '删除失败!'
})
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
//
detail(id) {
detail({id}).then(res => {
console.log(res)
this.registerForm = res.data.data
})
},
//
handleOperation(type, row) {
this.dialogFormType = type
if(type == 'view') {
this.registerDialogVisible = true
this.dialogFormDisabled = true
this.detail(row.id)
} else if(type == 'examine') {
this.registerDialogVisible = true
this.detail(row.id)
} else if(type == 'receive') {
this.registerDialogVisible = true
this.detail(row.id)
} else if(type == 'delete') {
this.$confirm('确认删除该条数据?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
remove({ids: row.id}).then(res => {
this.$message({
message: '删除成功',
type: 'success'
})
this.findPage()
}).catch(err => {
this.$message({
type: 'error',
message: '删除失败!'
})
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
}
},
registerHandleClick(type) {
if(type == 'confirm') {
if(this.dialogFormType == 'examine') {
const fieldsToValidate = ['status']
this.$refs.applyForm.validate((valid) => {
if (valid) {
let params = {
id: this.registerForm.id,
status: this.applyForm.status,
approveRemarks: this.applyForm.approveRemarks,
}
if(this.applyForm.status == 2) {
params.code = this.registerForm.code
params.applyNum = this.registerForm.applyNum
}
goodsApplySave(params).then(res => {
this.$message({
message: this.applyForm.status == 1 ? '审核通过' : '审核不通过',
type: 'success'
});
this.registerHandleClose()
this.currentPage = 1
this.pageSize = 10
this.findPage()
}).catch(error => {
this.$message({
message: '审核失败',
type: 'error'
});
})
} else {
return false;
}
}, fieldsToValidate);
} else if(this.dialogFormType == 'receive') {
const fieldsToValidate = ['actNum', 'actTime']
this.$refs.applyForm.validate((valid) => {
if (valid) {
let params = {
id: this.registerForm.id,
actNum: this.applyForm.actNum,
actTime: this.applyForm.actTime,
status: '3',
approveRemarks: this.applyForm.approveRemarks,
}
goodsApplySave(params).then(res => {
this.$message({
message: '领取成功',
type: 'success'
});
this.registerHandleClose()
this.currentPage = 1
this.pageSize = 10
this.findPage()
}).catch(error => {
this.$message({
message: '审核失败',
type: 'error'
});
})
} else {
return false;
}
}, fieldsToValidate);
}
} else {
this.registerHandleClose()
}
},
//
registerHandleClose() {
this.registerDialogVisible = false
this.resetForm()
this.dialogFormDisabled = false
this.applyForm = {
status: '',
approveRemarks: '',
actNum: '',
actTime: '',
}
},
//
resetForm() {
this.$refs['applyForm'].resetFields();
},
//
handleSizeChange(val) {
this.currentPage = 1
this.pageSize = val
this.findPage()
},
handleCurrentChange(val) {
this.currentPage = val
this.findPage()
}
}
}
</script>
<style lang="scss" scoped>
.content {
height: 100%;
background-color: white;
padding: 20px !important;
.content-top{
display: flex;
justify-content: space-between;
align-items: flex-start;
.register{
height: 40px;
}
.serch_form {
// display: flex;
// margin-bottom: 30px;
.el-form-item{
// padding: 0 10px;
margin-right: 20px !important;
}
.search_select {
// width: 138px;
height: 40px;
}
.search_input {
// width: 238px;
height: 40px;
}
/deep/.el-input__inner {
border-radius: 0;
}
.search_button {
width: 50px;
height: 40px;
border-radius: 0;
display: flex;
justify-content: center;
align-items: center;
margin-left: 6px;
.el-icon-search {
font-size: 19px;
color: #c9c9c9;
}
}
}
}
.content-main{
.more{
cursor: pointer;
}
.el_pagination {
display: flex;
justify-content: end;
margin-top: 20px;
}
}
}
.more-box{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.item{
width: 100%;
padding: 5px 0;
text-align: center;
cursor: pointer;
}
}
.registerForm{
display: flex;
flex-wrap: wrap;
.el-select{
width: 100%;
}
}
.dialog-footer{
height: 40px;
display: flex;
justify-content: flex-end;
}
.message{
// padding: 0 20px;
margin: 0 20px 0px 20px;
display: flex;
flex-direction: column;
border: 1px solid #D1D1D1;
.box{
margin: 0 20px 0px 20px;
}
.title{
height: 40px;
background: #FFFFFF;
border-radius: 0px 0px 0px 0px;
display: flex;
align-items: center;
margin: 0 20px 0px 20px;
}
.item{
display: flex;
align-items: center;
margin-bottom: 10px;
.label{
width: 80px;
text-align: end;
margin-right: 10px;
}
}
}
.history{
// padding: 0 20px;
margin: 0 20px 20px 20px;
display: flex;
flex-direction: column;
border: 1px solid #D1D1D1;
border-top: none;
.title{
height: 40px;
background: #FFFFFF;
border-radius: 0px 0px 0px 0px;
display: flex;
align-items: center;
margin: 0 20px 0px 20px;
}
.el-collapse{
margin: 0 20px;
border: none !important;
margin-bottom: 20px;
}
}
.title-text{
margin: 0 20px;
}
.name-time{
// width: 327px;
height: 40px;
background: #F9F9F9;
display: flex;
align-items: center;
padding: 0 20px;
.time{
margin-left: 30px;
}
}
.form-title{
// width: 100%;
height: 40px;
background: #F9F9F9;
border-radius: 0px 0px 0px 0px;
border: 1px solid #D1D1D1;
display: flex;
align-items: center;
padding: 0 20px;
margin-bottom: 20px;
}
.status-box-wrapper{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.status-box{
width: 62px;
height: 25px;
}
.blue{
background: rgba(43, 142, 229, 0.2);
color: #2B8EE5;
}
.green{
background: rgba(30, 185, 76, 0.2);
color: #1EB94C;
}
.red{
background: rgba(225, 75, 51, 0.2);
color: #E14B33;
}
.grey{
background: rgba(151, 151, 151, 0.2);
color: #333333;
}
</style>

File diff suppressed because it is too large Load Diff

@ -243,5 +243,30 @@ export default [{
component: () =>
import( /* webpackChunkName: "views" */ '@/views/system/systemSetting')
}]
}
},
{
path: '/itemManagement',
component: Layout,
redirect: '/itemManagement/itemList',
children: [
{
path: 'itemList',
name: '物品列表',
meta: {
i18n: 'dashboard'
},
component: () =>
import( /* webpackChunkName: "views" */ '@/page/itemManagement/itemList')
},
{
path: 'applicationExamine',
name: '申领审核',
meta: {
i18n: 'dashboard'
},
component: () =>
import( /* webpackChunkName: "views" */ '@/page/itemManagement/applicationExamine')
},
]
}
]

Loading…
Cancel
Save