Commit 71464c52 authored by hubaoshan's avatar hubaoshan

液体出入库

parent 19ee064f
import request from '@/utils/request'
import Qs from 'qs'
/**
* 1. 列表查询
* 2. 查询详细信息
* 3. 新增
* 4. 修改
* 5. 逻辑删除
* 6. 导出
*
*/
// 1. 查询order列表
export function listWcpOrder(query) {
return request({
url: '/wcporder/list',
method: 'get',
params: query
})
}
export function getWcpOrderId(query) {
return request({
url: '/wcporderlist/detailId/',
method: 'get',
params: query
})
}
// 2. 查询order详细信息
export function getWcpOrder(businessId) {
return request({
url: '/wcporder/detail/' + businessId,
method: 'get'
})
}
// 3. 新增order
export function addWcpOrder(data) {
data = Qs.stringify(data)
return request({
url: '/wcporder/add',
method: 'post',
data: data
})
}
// 4. 修改order
export function updateWcpOrder(data) {
const businessId = data.businessId
data = Qs.stringify(data)
return request({
url: '/wcporder/update/' + businessId,
method: 'put',
data
})
}
// 5. 逻辑删除order
export function delWcpOrder(businessId) {
return request({
url: '/wcporder/deleteLogical/' + businessId,
method: 'delete'
})
}
// 6. 导出order
export function exportWcpOrder(query) {
return request({
url: '/wcporder/export',
method: 'get',
params: query,
responseType: 'blob'
})
}
export function importExcel(data) {
return request({
url: '/wcporderlist/import',
method: 'post',
headers: {
'Content-Type': 'multipart/form-data'
},
transformRequest: [(data) => {
return data
}],
data
})
}
<template>
<div class="app-container">
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="orderSn" prop="orderSn">
<el-input
v-model="queryParams.orderSn"
placeholder="请输入orderSn"
clearable
:maxlength="255"
size="small"
style="width: 150px"
/>
</el-form-item>
<el-form-item label="status" prop="status">
<el-input
v-model="queryParams.status"
placeholder="请输入status"
clearable
:maxlength="1"
size="small"
style="width: 150px"
/>
</el-form-item>
<el-form-item label="状态" prop="flag">
<el-select v-model="queryParams.flag" placeholder="请选择状态" clearable size="small">
<el-option
v-for="dict in statusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
:class="commonField.queryClass"
:type="commonField.typePrimary"
:icon="commonField.queryIcon"
:size="commonField.smallSize"
@click="handleQuery"
>查询</el-button>
<el-button
:class="commonField.resetClass"
:icon="commonField.resetIcon"
:size="commonField.smallSize"
@click="resetQuery"
>重置</el-button>
</el-form-item>
<div style="float: right">
<el-form-item>
<el-button
:class="commonField.importClass"
:type="commonField.typeSuccess"
:icon="commonField.importIcon"
:size="commonField.smallSize"
@click="handleImport"
>导入
</el-button>
<!-- <el-button-->
<!-- :class="commonField.exportClass"-->
<!-- :type="commonField.typeSuccess"-->
<!-- :icon="commonField.exportIcon"-->
<!-- :size="commonField.smallSize"-->
<!-- @click="handleExport"-->
<!-- >导出</el-button>-->
</el-form-item>
</div>
</el-form>
<div class="placeholder" />
<div style="padding:5px 10px">
<div class="mb12 font-small-bold">order列表</div>
<el-table v-loading="loading" border :data="wcpOrderList">
<el-table-column type="index" label="序号" width="55" align="center" />
<el-table-column label="order sn" prop="orderSn" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.orderSn || '-' }}
</template>
</el-table-column>
<el-table-column label="状态" prop="status" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.type || '-' }}
</template>
</el-table-column>
<el-table-column label="备注" prop="remarks" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.remarks || '-' }}
</template>
</el-table-column>
<el-table-column label="创建时间" prop="createDate" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width" width="200px">
<template slot-scope="scope">
<!-- <el-button-->
<!-- :class="commonField.updateClass"-->
<!-- :type="commonField.typeParent"-->
<!-- :size="commonField.size"-->
<!-- @click="handleUpdate(scope.row)"-->
<!-- >修改</el-button>-->
<el-button
:class="commonField.delClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleDelete(scope.row)"
>删除</el-button>
<el-button
type="text"
size="mini"
@click="handleDetail(scope.row)"
>详情
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
<!-- 添加或修改order配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="order sn" prop="orderSn">
<el-input v-model.trim="form.orderSn" show-word-limit :maxlength="255" placeholder="请输入order sn" />
</el-form-item>
<el-form-item label="类型1,2,3" prop="type">
<el-input v-model.trim="form.type" show-word-limit :maxlength="1" placeholder="请输入类型1,2,3" />
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="form.flag">
<el-radio label="1">启用</el-radio>
<el-radio label="0">停用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model.trim="form.remarks" maxlength="200" show-word-limit type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="cancelBtn" @click="cancel">取 消</el-button>
<el-button class="submitBtn" type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<!--详情-->
<el-dialog class="aboutSingleDetails" :title="title" :visible.sync="openDetails" width="80%" append-to-body :close-on-click-modal="false">
<el-table v-loading="loading" border :data="queryParamsNew.TempList">
<el-table-column type="index" label="序号" width="55" align="center" />
<el-table-column label="orderId" prop="orderId" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.orderId || '-' }}
</template>
</el-table-column>
<el-table-column label="custCode" prop="custCode" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.custCode || '-' }}
</template>
</el-table-column>
<el-table-column label="cusrAbbr" prop="cusrAbbr" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.cusrAbbr || '-' }}
</template>
</el-table-column>
<el-table-column label="dueDate" prop="dueDate" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.dueDate || '-' }}
</template>
</el-table-column>
<el-table-column label="packingList" prop="packingList" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.packingList || '-' }}
</template>
</el-table-column>
<el-table-column label="currency" prop="currency" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.currency || '-' }}
</template>
</el-table-column>
<el-table-column label="dest" prop="dest" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.dest || '-' }}
</template>
</el-table-column>
<el-table-column label="qty" prop="qty" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.qty || '-' }}
</template>
</el-table-column>
<el-table-column label="quantity" prop="quantity" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.quantity || '-' }}
</template>
</el-table-column>
<el-table-column label="amount" prop="amount" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.amount || '-' }}
</template>
</el-table-column>
<el-table-column label="newWeight" prop="newWeight" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.newWeight || '-' }}
</template>
</el-table-column>
<el-table-column label="crossWeight" prop="crossWeight" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.crossWeight || '-' }}
</template>
</el-table-column>
<el-table-column label="m3" prop="m3" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.m3 || '-' }}
</template>
</el-table-column>
<el-table-column label="payTerms" prop="payTerms" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ scope.row.payTerms || '-' }}</span>
</template>
</el-table-column>
<el-table-column label="shipment" prop="shipment" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ scope.row.shipment || '-' }}</span>
</template>
</el-table-column>
</el-table>
<pagination
v-show="Newtotal>0"
:total="Newtotal"
:page.sync="queryParamsNew.page"
:limit.sync="queryParamsNew.rows"
@pagination="handleDetail"
/>
</el-dialog>
<!-- 导入配置对话框 -->
<el-dialog class="importDialog" :title="importControls.title" :visible="importControls.open" width="700px" append-to-body :close-on-click-modal="false" @close="cancelFileFrom">
<el-form :model="typeFrom">
<el-form-item>
<el-button class="downloadTemplateDivButton" type="primary" :loading="downloadTemplateLoading" size="small" @click="downloadTemplate">下载模板</el-button>
</el-form-item>
</el-form>
<div class="importOne">
<div>
<!-- 下载模型按钮 -->
<div class="downloadTemplateDiv" />
<div v-if="typeFrom.type === '1'" class="uploadCont">
<el-upload
accept=".xlsx, .xls"
:headers="importControls.headers"
:action="importControls.url + '?updateSupport=' + importControls.updateSupport"
:disabled="importControls.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:auto-upload="false"
:on-change="employeeUpload"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-preview="handlePreview"
:file-list="files"
drag
>
<i class="el-icon-upload" />
<div class="el-upload__text">
将文件拖到此处,或
<em>点击上传</em>
</div>
<div slot="tip" class="el-upload__tip" />
<div slot="tip" class="el-upload__tip" style="color:red">提示:仅允许导入“xls”或“xlsx”格式文件!</div>
</el-upload>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelFileFrom">取 消</el-button>
<el-button :loading="importLoading" type="primary" @click="submitFileForm">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listWcpOrder,
getWcpOrder,
delWcpOrder,
addWcpOrder,
updateWcpOrder,
exportWcpOrder, importExcel, getWcpOrderId
} from '@/api/wcpOrder'
import commonField from '@/utils/commonField'
import { getToken } from '@/utils/auth'
import { getDownloadTemplate } from '@/api/outcomeWmsJbapplyTemp'
export default {
name: 'WcpOrder',
data() {
return {
openDetails: false,
TempList: [],
singleDetails: {},
// 导入对话框遮盖层
importLoading: false,
// 导入列表
files: [],
// 下载模板loading
downloadTemplateLoading: false,
// 类型表单
typeFrom: {
type: '1'
},
// 导入对话框控制器
importControls: {
// 是否显示弹出层(数据导入)
open: false,
// 弹出层标题(数据导入)
title: '',
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: 'Bearer ' + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + '/system/user/importExcel'
},
// 遮罩层
loading: true,
// 总条数
total: 0,
Newtotal: 0,
// order表格数据
wcpOrderList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 状态菜单
statusOptions: [
{
dictLabel: '启用',
dictValue: '1'
},
{
dictLabel: '停用',
dictValue: '0'
}
],
// 查询参数
queryParams: {
page: 1,
rows: 10,
orderSn: undefined,
status: undefined,
flag: ''
},
queryParamsNew: {
page: 1,
rows: 10,
TempList: []
},
id: '',
// 表单参数
form: {},
// 表单校验
rules: {
}
}
},
computed: {
commonField() {
return commonField
}
},
created() {
this.getList() // 列表查询
this.handleDetail()
},
methods: {
/** 查询order列表 */
getList() {
this.loading = true
listWcpOrder(this.queryParams).then(
response => {
this.wcpOrderList = response.rows
this.total = response.total
this.loading = false
}
)
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
businessId: undefined,
remarks: undefined,
orderSn: undefined,
type: undefined,
flag: '1'
}
this.queryParamsNew = {
page: 1,
rows: 10,
TempList: []
}
this.resetForm('form')
},
/** 查询按钮操作 */
handleQuery() {
this.queryParams.page = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
page: 1,
rows: 10,
orderSn: undefined,
type: undefined,
flag: ''
}
this.handleQuery()
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = '添加order'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.businessId
getWcpOrder(id).then(response => {
this.form = response.data
this.open = true
this.title = '修改order'
})
},
// 改变状态
handleStatusChange(row) {
const text = row.flag === '1' ? '启用' : '停用'
this.$confirm('确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return updateWcpOrder(row)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
}).catch(function() {
row.flag = row.flag === '0' ? '1' : '0'
})
},
/** 提交按钮 */
submitForm: function() {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
updateWcpOrder(this.form).then(response => {
this.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addWcpOrder(this.form).then(response => {
this.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.businessId
this.$confirm('是否确认操作?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return delWcpOrder(id)
}).then(() => {
this.getList()
this.$message({
message: '删除成功',
type: 'success'
})
}).catch(function() {
})
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return exportWcpOrder(queryParams).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = 'order信息' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
})
})
},
/** 导入 */
handleImport() {
this.importControls.title = '检查申请导入'
this.importControls.open = true
},
// 导入取消
cancelFileFrom() {
this.importControls.open = false
this.files = []
},
// 文件上传成功处理
handleFileSuccess(response) {
console.log('文件上传', response)
this.upload.open = false
this.upload.isUploading = false
this.$refs.upload.clearFiles()
this.$alert(response.msg, '导入结果', { dangerouslyUseHTMLString: true })
this.getList()
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true
},
// 点击下载模板
downloadTemplate() {
this.downloadTemplateLoading = true
getDownloadTemplate().then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = '材料导入模板' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
this.downloadTemplateLoading = false
})
},
/* 上传文件所需求 */
handlePreview(file) {
},
employeeUpload(file, fileList) {
if (fileList.length > 1) {
fileList.splice(0, 1)
}
this.files = fileList[0].raw
},
handleRemove(file, fileList) {
this.files = []
},
beforeRemove(file, fileList) {
this.files = []
},
// 导入确认
submitFileForm() {
this.importLoading = true
if (this.files.length === 0) {
this.$message.warning('请上传文件')
// 导入成功后关闭弹出框
this.importLoading = false
// this.upload.open = true
} else {
var formData = new FormData() // 当前为空
formData.append('file', this.files)
importExcel(formData).then(res => {
if (res.code === 200) {
this.$message.success('导入成功')
this.importLoading = false
this.importControls.open = false
this.files = []
this.getList()
}
}).catch(() => {
this.importLoading = false
this.files = []
})
}
// this.importControls.open = false
},
// 获取所选行详情信息操作
handleDetail(row) {
const id = row.businessId
this.queryParamsNew.TempList = []
const queryParams = {
businessId: id,
page: this.queryParamsNew.page,
rows: this.queryParamsNew.rows
}
getWcpOrderId(queryParams).then(response => {
this.queryParamsNew.TempList = response.data.records
this.Newtotal = response.data.total
})
this.title = '详情信息'
this.openDetails = !this.openDetails
this.queryParamsNew = {
page: 1,
rows: 10,
TempList: []
}
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
font-size: 18px;
padding: 0;
.placeholder {
height: 1.3vh;
background-color: #F4F4F4;
margin-bottom: 10px
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment