朱兆平 / vue_cli · 提交

转到一个项目

作者 小范
提交 20d69548bcb8cb39b7f990a3336add47e30fd924 1 个父辈 d0e09657

物料申报管理

内嵌 并排对比
正在显示 1 个修改的文件 包含 828 行增加 和 0 行删除
<template>
<section>
<!--工具条-->
<el-row class="toolbar">
<el-form :inline="true" :model="form">
<el-form-item>
<el-input v-model="form.aircraftflightno" placeholder="航班号"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="success" @click="add">新增</el-button>
</el-form-item>
</el-form>
</el-row>
<!-- 表单区域-->
<el-row :span="24" class="toolbar" style="margin-top: 40px">
<el-col :span="24">
<el-table
highlight-current-row
@selection-change="matterChange"
style="border-radius: 10px 10px 0px 0px"
:header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"
ref="multipleTable"
:data="tableData"
tooltip-effect="dark">
<el-table-column
type="selection"
width="45">
</el-table-column>
<el-table-column
type="index"
:index="indexMethod"
width="45">
</el-table-column>
<el-table-column
prop="num"
label="编号"
width="80">
</el-table-column>
<el-table-column
prop="aircraftnum"
label="物料添加航空器编号"
width="130">
</el-table-column>
<el-table-column
prop="aircraftflightno"
label="航班号"
width="80">
</el-table-column>
<el-table-column
prop="aircraftflightdate"
label="物料添加航班日期"
width="140">
</el-table-column>
<el-table-column
prop="unaircraftnum"
label="物料起卸航空器编号"
width="130">
</el-table-column>
<el-table-column
prop="unaircraftflightno"
label="物料起卸航班号"
width="130">
</el-table-column>
<el-table-column
prop="unaircraftlightdate"
label="物料起卸航班日期"
width="140">
</el-table-column>
<el-table-column
prop="bustype"
label="业务类型"
width="80">
<template slot-scope="scope">
<span v-if="scope.row.bustype ==='1'">起卸</span>
<span v-if="scope.row.bustype ==='3'">添加</span>
<span v-if="scope.row.bustype ==='5'">调拨</span>
</template>
</el-table-column>
<el-table-column
prop="remark5"
label="填写时间"
width="140">
</el-table-column>
<el-table-column
prop="add"
width="120"
label="海关备案状态">
</el-table-column>
<el-table-column label="操作" width="300" fixed="right">
<template slot-scope="scope">
<el-button type="success" size="mini" @click="edit(scope.$index,scope.row)">编辑</el-button>
<el-button type="warning" size="mini" @click="apply(scope.row)">
申请
</el-button>
<el-button type="primary" size="mini">
完成
</el-button>
<el-button type="danger" size="mini" @click="del(scope.row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-col>
<!--分页区域-->
<el-col :span="24" style="margin-bottom: 40px;margin-top: 10px">
<el-pagination
:current-page="form.pageNum"
:page-sizes="[10, 50, 100, 500]"
:page-size="form.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</el-col>
</el-row>
<!-- 弹框区域-->
<el-row>
<el-dialog
:title="dialogMap[dialogStatus]"
:visible.sync="supply_dialog.addDialog"
style="margin-top: -50px"
text-align="center"
width="95%">
<template>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="供退物料信息" name="first">
<el-form ref="formSupply" :inline="true" :model="formSupply" label-width="145px" label-position="right" :rules="rulesSupply" >
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<div class="grid-content content">申报单位</div>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="海关关区" prop="customcode">
<el-input v-model="formSupply.customcode" placeholder="" suffix-icon=“xxxx”></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="申报单流水号" prop="serialnum">
<el-input v-model="formSupply.serialnum" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<div class="grid-content content">供退物料信息</div>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="业务类型" prop="bustype">
<div v-if="dialogStatus === 'update'">
<el-select disabled="" v-model="formSupply.bustype" placeholder="请选择" size="mini">
<el-option label="1-起卸" value="1"></el-option>
<el-option label="3-添加" value="3"></el-option>
<el-option label="5-调拨" value="5"></el-option>
</el-select>
</div>
<div v-else>
<el-select v-model="formSupply.bustype" placeholder="请选择" size="mini">
<el-option label="1-起卸" value="1"></el-option>
<el-option label="3-添加" value="3"></el-option>
<el-option label="5-调拨" value="5"></el-option>
</el-select>
</div>
</el-form-item>
<!-- <el-form-item label="业务类型" prop="bustype">-->
<!-- <el-select v-model="formSupply.bustype" placeholder="请选择" size="mini" :disabled="false">-->
<!-- <el-option label="1-起卸" value="起卸"></el-option>-->
<!-- <el-option label="3-添加" value="添加"></el-option>-->
<!-- <el-option label="5-调拨" value="调拨"></el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
</el-col>
<el-col :span="8">
<el-form-item label="运输工具企业代码" prop="enterprisecode">
<el-input v-model="formSupply.enterprisecode" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="出发港" prop="destination">
<el-input v-model="formSupply.destination" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="物料添加航空器编号 " prop="aircraftnum">
<el-input v-model="formSupply.aircraftnum" placeholder="" suffix-icon=“xxxx”></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="物料添加航班号" prop="aircraftflightno">
<el-input v-model="formSupply.aircraftflightno" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="物料添加航班日期" prop="aircraftflightdate">
<el-date-picker
v-model="formSupply.aircraftflightdate"
type="date" size="mini"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
style="width:93%"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="物料起卸航空器编号" prop="unaircraftnum">
<el-input v-model="formSupply.unaircraftnum" placeholder="" suffix-icon=“xxxx”></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="物料起卸航班号" prop="unaircraftflightno">
<el-input v-model="formSupply.unaircraftflightno" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="物料起卸航班日期" prop="unaircraftlightdate">
<el-date-picker
v-model="formSupply.unaircraftlightdate"
type="date" size="mini"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
style="width:93%"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<div class="grid-content content">备注信息</div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input
v-model="formSupply.remark"
type="textarea"
:rows="1" style="width: 520px"
placeholder="请输入内容"
/>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-bottom: 5px;margin-top: 25px">
<el-col :span="24" :offset="9">
<el-form-item >
<el-button style="width: 100px" type="info" @click="supply_dialog.addDialog = false">取消</el-button>
<el-button type="primary" style="width: 100px" @click="dialogStatus==='create'?mat_add():mat_edit()">提交</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-tab-pane>
<el-tab-pane label="货物明细信息" name="second">
<el-form ref="formCargo" :inline="true" :model="formCargo" label-width="70px" label-position="right" :rules="rulesCargo" >
<el-row>
<el-col :span="24">
<div class="grid-content content">货物信息</div>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="物料" prop="material">
<el-select v-model="formCargo.material" placeholder="请选择" size="mini">
<el-option label="1-航油" value="1"></el-option>
<el-option label="2-航材" value="2"></el-option>
<el-option label="3-免税品" value="3"></el-option>
<el-option label="4-航空食品" value="4"></el-option>
<el-option label="5-其他" value="5"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="物品名称" prop="itemname">
<el-input v-model="formCargo.itemname" placeholder="" suffix-icon=“xxxx” />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="申请数量" prop="applynum">
<el-input v-model="formCargo.applynum" placeholder="" suffix-icon=“xxxx”></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="计量单位" prop="unit">
<el-select v-model="formCargo.unit" placeholder="请选择" size="mini">
<el-option label="000-无" value="000"></el-option>
<el-option label="001-台" value="001"></el-option>
<el-option label="002-座" value="002"></el-option>
<el-option label="003-辆" value="003"></el-option>
<el-option label="004-艘" value="004"></el-option>
<el-option label="005-架" value="005"></el-option>
<el-option label="006-套" value="006"></el-option>
<el-option label="007-个" value="007"></el-option>
<el-option label="008-只" value="008"></el-option>
<el-option label="009-头" value="009"></el-option>
<el-option label="010-张" value="010"></el-option>
<el-option label="011-件" value="011"></el-option>
<el-option label="012-支" value="012"></el-option>
<el-option label="013-枝" value="013"></el-option>
<el-option label="014-根" value="014"></el-option>
<el-option label="015-条" value="015"></el-option>
<el-option label="016-把" value="016"></el-option>
<el-option label="017-块" value="017"></el-option>
<el-option label="018-卷" value="018"></el-option>
<el-option label="019-副" value="019"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<div class="grid-content content">备注信息</div>
</el-col>
</el-row>
<el-row style="margin-bottom: 10px">
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input
v-model="formCargo.remark"
type="textarea"
:rows="1" style="width: 400px"
placeholder="请输入内容"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item>
<el-button type="primary" @click="getListCargo">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="success" @click="addCargo">保存</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table
@selection-change="handleSelectionChangeMat"
style="border-radius: 10px 10px 0px 0px;margin-bottom: 20px"
:header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"
ref="multipleTable"
:data="tableDataCargo"
tooltip-effect="dark">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
type="index"
width="50">
</el-table-column>
<el-table-column
prop="material"
label="物料"
width="120">
</el-table-column>
<el-table-column
prop="itemname"
label="物品名称"
width="120">
</el-table-column>
<el-table-column
prop="applynum"
label="申请数量">
</el-table-column>
<el-table-column
prop="unit"
label="计量单位"
width="120">
</el-table-column>
<el-table-column
prop="remark"
label="备注"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="操作" fixed="right" width="120">
<template slot-scope="scope">
<el-button type="danger" size="mini" @click="delCargo(scope.row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!--分页区域-->
<el-col :span="24" style="margin-top: 20px;padding-bottom: 30px">
<el-pagination
:current-page="pageNumCargo"
:page-sizes="[10, 50, 100, 500]"
:page-size="pageSizeCargo"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCargo"
@size-change="handleSizeChangeCargo"
@current-change="handleCurrentChangeCargo"
/>
</el-col>
</el-tab-pane>
</el-tabs>
</template>
</el-dialog>
</el-row>
</section>
</template>
<script>
import {selectSupplyMatter, addSupplyMatter, ediSupplyMatter, delSupplyMatter,addCargoDetails,delCargoDetails,selectCargoDetails,sendSupplyMatter} from "../../api/transport";
export default {
name: "matter",
data(){
return{
// 首页>>>>>>>>>>>>>>>>>>>>>>>>>>>>
form:{
aircraftflightno:'',
pageNum: 1,
pageSize: 10,
},
formcargo:{
supplyid:''
},
total: 0,
tableData:[{
aircraftflightno:'B5157',
}],
multipleSelection:[],
// 弹框>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
dialogMap: {
update: '供退物料新增',
create: '供退物料修改'
},
dialogStatus: 'create',
supply_dialog: {
// 添加对话框
addDialog: false,
// 编辑对话框
editDialog: false
},
activeName: 'first',
// 弹框1-1>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
formSupply:{
autoid:'',
customcode:'4604',
serialnum:'',
bustype:'1',
enterprisecode:'460470678395-9',
aircraftnum:'',
destination:'CGO',
aircraftflightno:'',
aircraftflightdate:'',
unaircraftnum:'',
unaircraftflightno:'',
unaircraftlightdate:'',
remark:'',
remark1:'',
remark2:'',
remark3:'',
remark4:'',
remark5:'',
createtime:'',
updatetime:'',
declar:'',
},
rulesSupply: {
customcode: [
{ required: true, message: '', trigger: 'change' }
],
},
// 弹框1-2>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
formCargo:{
id:'',
material:'',
itemname:'',
applynum:'',
unit:'',
remark:'',
supplyid:'',
remark1:'',
remark2:'',
remark3:'',
remark4:'',
},
pageNumCargo: 1,
pageSizeCargo: 10,
totalCargo: 0,
rulesCargo: {
material: [
{ required: true, message: '请输入', trigger: 'change' }
],
itemname: [
{ required: true, message: '请输入', trigger: 'change' }
],
applynum: [
{ required: true, message: '请输入', trigger: 'change' }
],
unit: [
{ required: true, message: '请输入', trigger: 'change' }
],
},
tableDataCargo:[],
// 多选
currentRow: null
}
},
mounted() {
//获取列表
this.getList();
// var user = loginuserInfo;
// if (user) {
// this.form.username = user.username || '';
// }
},
methods:{
// 首页>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
//首页表单分页
handleSizeChange(val) {
this.form.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.form.pageNum = val
this.getList()
},
// 首页表格选中
matterChange(val) {
this.multipleSelection = val;
},
// 序列
indexMethod(index) {
return index + 1;
},
// 获取消息标签列表
getList() {
const _this = this
selectSupplyMatter(this.form).then((response) => {
const res = response.data
if (res.code !== '200') {
return _this.$message.error('获取消息收发记录，失败！')
}
// 获取列表数据
_this.tableData = res.data.list
// 获取列表的总记录数
_this.total = res.data.total
_this.$message.success('获取消息收发记录，成功！')
}).catch(error => {
// 关闭加载
_this.$message.error(error.toString())
})
},
// 打开新增
add() {
this.dialogStatus = 'create'
this.supply_dialog.addDialog = true
this.tableDataCargo = ''
this.formCargo = {
id:'',
material:'',
itemname:'',
applynum:'',
unit:'',
remark:'',
supplyid:'',
remark1:'',
remark2:'',
remark3:'',
remark4:'',
}
this.formSupply = {
autoid:'',
customcode:'4604',
serialnum:'',
bustype:'',
enterprisecode:'460470678395-9',
aircraftnum:'',
destination:'CGO',
aircraftflightno:'',
aircraftflightdate:'',
unaircraftnum:'',
unaircraftflightno:'',
unaircraftlightdate:'',
remark:'',
remark1:'',
remark2:'',
remark3:'',
remark4:'',
remark5:'',
createtime:'',
updatetime:'',
declar:'',
}
// this.form.arrivetime = new Date().format('yyyyMMddHHmmss')
},
// 新增功能
mat_add() { // 进行表单的预验证
this.$refs.formSupply.validate(valid => {
// 未通过，表单预校验
if (!valid) return
addSupplyMatter(this.formSupply).then((response) => {
const res = response.data;
// 添加失败
if (res.code !== '200') {
// 关闭加载
return this.$message.error(res.msg)
}
// 添加，成功
this.$message.success(res.msg)
this.formCargo.supplyid=res.data;
console.log("---->"+this.formCargo.supplyid)
// 隐藏对话框
/*this.supply_dialog.addDialog = false*/
// 刷新列表
this.getList()
}).catch(error => {
this.$message.error(error.toString())
})
})
},
// 打开编辑
edit(index, row) {
// $("select").each(function () {
// $("#" + this.id).attr("disabled", true);
// });
this.formSupply = Object.assign({}, row)
this.supply_dialog.addDialog = true
this.dialogStatus = 'update'
this.$nextTick(() => {
this.formSupply = Object.assign({}, row)
})
this.formCargo.supplyid=row.autoid;
this.getListCargo();
this.formCargo = {
id:'',
material:'',
itemname:'',
applynum:'',
unit:'',
remark:'',
supplyid:'',
remark1:'',
remark2:'',
remark3:'',
remark4:'',
}
},
// 编辑功能
mat_edit() {
// 进行表单的预验证
this.$refs.formSupply.validate(valid => {
// 未通过，表单预校验
if (!valid) return
ediSupplyMatter(this.formSupply).then((response) => {
const res = response.data
if (res.code !== '200') {
return this.$message.error(res.msg)
}
this.$message.success(res.msg)
// 隐藏对话框
// this.supply_dialog.addDialog = false
// 刷新列表
this.getList()
}).catch(error => {
this.$message.error(error.toString())
})
})
},
// 删除
del(row) {
// 弹框询问是否删除？
this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
delSupplyMatter(row).then((response) => {
console.log(row)
const res = response.data
if (res.code !== '200') {
return this.$message.error(res.msg)
}
this.$message.success(res.msg)
// 刷新列表
this.getList()
}).catch(error => {
this.$message.error(res.msg)
})
}).catch(() => {
})
},
// 申请
apply(row) {
// 弹框询问是否申请？
this.$confirm('是否发送申请', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
sendSupplyMatter(row).then((response) => {
const res = response.data
if (res.code !== '200') {
return this.$message.error(res.msg)
}
this.$message.success(res.msg)
// 刷新列表
this.getList()
}).catch(error => {
this.$message.error(res.msg)
})
}).catch(() => {
})
},
// 弹框>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
// 弹框标签
handleClick(tab, event) {
console.log(tab, event);
},
// 弹框1-1>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
// 弹框1-2>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
// 弹框1-2多选
handleSelectionChangeMat(val) {
this.currentRow = val;
},
//弹框1-2表单分页
handleSizeChangeCargo(val) {
this.pageSizeCargo = val
this.getListCargo()
},
handleCurrentChangeCargo(val) {
this.pageNumCargo = val
this.getListCargo()
},
// 获取消息标签列表
getListCargo() {
const _this = this
let parms={supplyid:this.formCargo.supplyid};
selectCargoDetails(parms).then((response) => {
const res = response.data
if (res.code !== '200') {
return _this.$message.error('获取消息收发记录，失败！')
}
// 获取列表数据
_this.tableDataCargo = res.data.list
// 获取列表的总记录数
_this.totalCargo = res.data.total
_this.$message.success('获取消息收发记录，成功！')
}).catch(error => {
// 关闭加载
_this.$message.error(error.toString())
})
},
// 新增功能
addCargo() { // 进行表单的预验证
this.$refs.formCargo.validate(valid => {
// 未通过，表单预校验
if (!valid) return
if(this.formCargo.supplyid!=null && this.formCargo.supplyid!=''){
addCargoDetails(this.formCargo).then((response) => {
const res = response.data
// 添加失败
if (res.code !== '200') {
// 关闭加载
return this.$message.error(res.msg)
}
// 添加，成功
this.$message.success(res.msg)
// 刷新列表
this.getListCargo()
}).catch(error => {
this.$message.error(error.toString())
})
}else{
return this.$message.error("请先保存供料退货信息")
}
})
},
// 删除
delCargo(row) {
// 弹框询问是否删除？
this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
delCargoDetails(row).then((response) => {
console.log(row)
const res = response.data
if (res.code !== '200') {
return this.$message.error(res.msg)
}
this.$message.success(res.msg)
// 刷新列表
this.getListCargo()
}).catch(error => {
this.$message.error(res.msg)
})
}).catch(() => {
})
},
},
}
</script>
<style scoped>
.toolbar{
background-color: white;
border-radius: 5px 5px 5px 5px;
padding: 15px 0 0 20px;
}
</style>
... ...