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.
556 lines
18 KiB
556 lines
18 KiB
1 year ago
|
<template>
|
||
|
<div>
|
||
|
<div class="tab-header webtop">
|
||
|
<!-- 标题 -->
|
||
|
<div>旧件回收登记</div>
|
||
|
<!-- start 添加修改按钮 -->
|
||
|
<div>
|
||
|
<el-button type="primary" size="small" :disabled="submitdisabled" @click="saveOrUpdate">保存</el-button>
|
||
|
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
|
||
|
</div>
|
||
|
<!-- end 添加修改按钮 -->
|
||
|
<!-- end 详情按钮 -->
|
||
|
</div>
|
||
|
<div class="listconadd">
|
||
|
<el-form ref="form_obj" :model="formobj" label-position="top" label-width="190px" class="formadd">
|
||
|
<div class="title" style="display: flex;align-items: center;justify-content: space-between;height:40px">
|
||
|
<div>基础信息</div>
|
||
|
</div>
|
||
|
<el-row class="first_row">
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">维修工单编号</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">{{formobj.billNo}}</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">申请人</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">{{formobj.createByName}}</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">分公司</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">{{formobj.useOrgName}}</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">申请部门</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">{{formobj.createDeptName}}</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">申请日期</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<el-date-picker v-model="formobj.createTime" type="date" style="width:100%" value-format="yyyy-MM-dd"
|
||
|
placeholder="选择日期">
|
||
|
</el-date-picker>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">流程状态</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">{{formobj.nodeState}}</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">备注</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="20">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<el-input v-model="formobj.remarks" placeholder="" class="addinputw"
|
||
|
style="width: 100%; padding-bottom: 5px;" type="textarea" :rows="4" clearable />
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
|
||
|
</el-row>
|
||
|
|
||
|
<el-row>
|
||
|
<el-col :span="4" class="trightb">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<span slot="label">附件</span>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
<el-col :span="20">
|
||
|
<el-form-item class="trightb_item">
|
||
|
<upload style="margin-top: 20px;margin-bottom: 20px;" class="addinputw" ref="uploadImg2" v-model="imgList"
|
||
|
:limit="9" @change="backData" bucket="map" :upload-data="{ type: '0001' }"></upload>
|
||
|
</el-form-item>
|
||
|
</el-col>
|
||
|
|
||
|
</el-row>
|
||
|
<div class="title"
|
||
|
style="display: flex;align-items: center;justify-content: space-between;height:40px;margin-top: 10px;">
|
||
|
<div>返厂旧件列表</div>
|
||
|
</div>
|
||
|
<el-table v-loading="listLoading" :data="formobj.asOldpartreturnList" border style="width: 100%;"
|
||
|
:row-style="{height: '40px'}">
|
||
|
<el-table-column fixed width="60" label="序号" type="index" :index="indexMethod" align="center" />
|
||
|
<el-table-column align="center" width="100" :render-header="commodityHeader">
|
||
|
<template slot-scope="scope">
|
||
|
<i class="el-icon-delete" @click="commodityDelete(scope.$index)"></i>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
<el-table-column label="商品名称" align="center" min-width="200">
|
||
|
<template slot-scope="scope">
|
||
|
<el-popover placement="right" width="900" trigger="click">
|
||
|
<div>
|
||
|
<el-table :data="commodityData" v-loading="commodityLoading" highlight-current-row
|
||
|
@current-change="commodityCurrentChange($event, scope.row)">
|
||
|
<el-table-column fixed prop="goodsSpuName" label="商品名称" align="center" />
|
||
|
<el-table-column prop="goodsSkuCode" label="商品编码" align="center" />
|
||
|
<el-table-column prop="goodsSkuOwnSpec" label="厂家" align="center" />
|
||
|
<el-table-column prop="goodsSkuOwnSpec" label="规格" align="center" />
|
||
|
<el-table-column prop="unit" label="单位" align="center" />
|
||
|
</el-table>
|
||
|
<el-pagination :page.sync="commodityQuery.current" :page-size="commodityQuery.size"
|
||
|
layout="total, pager" :total="commodityQuery.total" />
|
||
|
</div>
|
||
|
<el-input slot="reference" v-model="scope.row.goodsSkuName"
|
||
|
@input="commodityInput(scope.row.goodsSkuName)" clearable placeholder="商品名称" />
|
||
|
</el-popover>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
<el-table-column prop="goodsSkuCode" label="商品编码" align="center" />
|
||
|
<el-table-column prop="manufacturerName" label="厂家" align="center" />
|
||
|
<el-table-column prop="goodsSkuOwnSpec" label="规格" align="center" />
|
||
|
<el-table-column prop="unit" label="单位" align="center" />
|
||
|
<el-table-column label="需返厂数量" align="center" width="180">
|
||
|
<template slot-scope="scope">
|
||
|
<el-input ref="focusAssumptionInput" v-model="scope.row.needReturnCount" clearable placeholder=""
|
||
|
oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" />
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
<el-table-column label="实际返厂数量" align="center" width="180">
|
||
|
<template slot-scope="scope">
|
||
|
<el-input ref="focusAssumptionInput" v-model="scope.row.actualReturnCount" clearable placeholder=""
|
||
|
oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" />
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
<el-table-column label="差异说明" align="center" width="200">
|
||
|
<template slot-scope="scope">
|
||
|
<el-input ref="focusAssumptionInput" v-model="scope.row.remarks" clearable placeholder="" />
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
</el-table>
|
||
|
|
||
|
</el-form>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
<!-- 导入 -->
|
||
|
<el-dialog :visible.sync="dialogVisible" width="60%" :show-close="false">
|
||
|
<div style="margin-top: -40px;">
|
||
|
<el-button size="medium" type="text" style="font-weight: bold" @click="downLoad">下载导入厂家返厂明细模板</el-button>
|
||
|
</div>
|
||
|
<el-card class="box-card">
|
||
|
<div>
|
||
|
<el-upload ref="upload" class="upload-demo" accept=".xls,.xlsx" name="file" :action="updateAction"
|
||
|
:on-success="handleSuccess" :file-list="fileList" :auto-upload="false" :multiple="false" :limit="1"
|
||
|
:data="uploadData" :headers="headers">
|
||
|
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||
|
<el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传</el-button>
|
||
|
</el-upload>
|
||
|
</div>
|
||
|
<div>
|
||
|
<h3>文件上传结果</h3>
|
||
|
<el-card class="box-card">
|
||
|
<div>{{ uploadResultMesssage }}</div>
|
||
|
</el-card>
|
||
|
</div>
|
||
|
</el-card>
|
||
|
<div slot="footer" class="dialog-footer" style="text-align: center">
|
||
|
<el-button type="primary" size="small" @click="handleConfirm">确定</el-button>
|
||
|
<el-button size="small" @click="dialogVisible = false">取消</el-button>
|
||
|
</div>
|
||
|
</el-dialog>
|
||
|
|
||
|
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import req from '@/api/storage/oldPartsFactory.js'
|
||
|
import upload from '@/components/uploadFile/upload'
|
||
|
export default {
|
||
|
components: {
|
||
|
upload
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
dialogVisible: false,
|
||
|
updateAction: process.env.VUE_APP_BASE_API + '/as/v1/asoldpartreturnapply/getExcelInfo',
|
||
|
fileList: [],
|
||
|
uploadSuccess: false,
|
||
|
uploadResultMesssage: '',
|
||
|
uploadData: {
|
||
|
sid: ''
|
||
|
},
|
||
|
headers: {
|
||
|
token: window.sessionStorage.getItem('token')
|
||
|
},
|
||
|
title: '【新增】',
|
||
|
listLoading: false,
|
||
|
submitdisabled: false,
|
||
|
formobj: {
|
||
|
"sid": "",
|
||
|
"remarks": "",
|
||
|
"createBySid": "",
|
||
|
"createByName": "",
|
||
|
"createDeptSid": "",
|
||
|
"createDeptName": "",
|
||
|
"createTime": "",
|
||
|
"billNo": "",
|
||
|
"filePaths": [],
|
||
|
"useOrgSid": "",
|
||
|
"useOrgName": "",
|
||
|
"orgSidPath": "",
|
||
|
"procDefId": "",
|
||
|
"nodeId": "",
|
||
|
"procInstId": "",
|
||
|
"nodeState": "",
|
||
|
"taskId": "",
|
||
|
"finishTime": "",
|
||
|
"asOldpartreturnList": [
|
||
|
|
||
|
]
|
||
|
},
|
||
|
hideUploadBtn: false,
|
||
|
|
||
|
// commodity商品
|
||
|
commodityKey: 1,
|
||
|
commodityLoading: false,
|
||
|
commodityQuery: {
|
||
|
current: 1,
|
||
|
size: 2,
|
||
|
total: 0,
|
||
|
params: {
|
||
|
name: '',
|
||
|
inOrg: "",
|
||
|
outOrg: ""
|
||
|
}
|
||
|
},
|
||
|
commodityData: [],
|
||
|
isUpdata: false,
|
||
|
imgList: []
|
||
|
}
|
||
|
},
|
||
|
created() {},
|
||
|
methods: {
|
||
|
|
||
|
commodityInput(value) {
|
||
|
this.commodityQuery.params.name = value
|
||
|
this.commodityLoading = true
|
||
|
req.getGoodsListPage(this.commodityQuery).then((response) => {
|
||
|
if (response.success) {
|
||
|
this.commodityLoading = false
|
||
|
this.commodityData = response.data.records
|
||
|
this.commodityQuery.total = response.data.total
|
||
|
} else {
|
||
|
this.serviceLoading = false
|
||
|
this.commodityData = []
|
||
|
this.commodityQuery.total = 0
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
commodityDelete(index) {
|
||
|
this.formobj.asOldpartreturnList.splice(index, 1)
|
||
|
},
|
||
|
commodityCurrentChange(value, row) {
|
||
|
console.log("commodityCurrentChange》》》》", value)
|
||
|
console.log("commodityCurrentChange》》》》", row)
|
||
|
row.sid = ''
|
||
|
row.remarks = ''
|
||
|
row.mainSid = ''
|
||
|
row.manufacturerName = value.goodsSkuOwnSpec
|
||
|
row.goodsSkuName = value.goodsSpuName
|
||
|
row.goodsSkuCode = value.goodsSkuCode
|
||
|
row.goodsSkuOwnSpec = value.goodsSkuOwnSpec
|
||
|
row.unit = value.unit
|
||
|
row.needReturnCount = 0
|
||
|
row.actualReturnCount = 0
|
||
|
document.body.click()
|
||
|
},
|
||
|
|
||
|
// 在头部标题上添加“新增”图标
|
||
|
commodityHeader(h, {
|
||
|
column
|
||
|
}) {
|
||
|
return h(
|
||
|
'div',
|
||
|
[
|
||
|
h('span', column.label),
|
||
|
h('i', {
|
||
|
class: 'add-btn-icon el-icon-plus',
|
||
|
style: 'color: red;font-size:20px',
|
||
|
on: {
|
||
|
click: this.commodityAdd // 点击执行函数
|
||
|
}
|
||
|
})
|
||
|
]
|
||
|
)
|
||
|
},
|
||
|
commodityAdd() {
|
||
|
this.formobj.asOldpartreturnList.push({
|
||
|
"sid": "",
|
||
|
"remarks": "",
|
||
|
"mainSid": "",
|
||
|
"manufacturerName": "",
|
||
|
"goodsSkuName": "",
|
||
|
"goodsSkuCode": "",
|
||
|
"goodsSkuOwnSpec": "",
|
||
|
"unit": "",
|
||
|
"needReturnCount": 0,
|
||
|
"actualReturnCount": 0
|
||
|
})
|
||
|
},
|
||
|
|
||
|
|
||
|
doGoodsDel(sid) {
|
||
|
console.log("doGoodsDel》》》》", sid)
|
||
|
this.$confirm("是否确定删除此商品?", '提示', {
|
||
|
confirmButtonText: '确定',
|
||
|
cancelButtonText: '取消',
|
||
|
type: 'warning'
|
||
|
}).then(() => {
|
||
|
const index = this.formobj.asOldpartreturnList.findIndex((item) => item === row)
|
||
|
console.log("index》》》》", index)
|
||
|
this.formobj.asOldpartreturnList.splice(index, 1)
|
||
|
|
||
|
})
|
||
|
},
|
||
|
|
||
|
indexMethod(index) {
|
||
|
return Number(index) + 1
|
||
|
},
|
||
|
importDetail() {
|
||
|
this.dialogVisible = true
|
||
|
},
|
||
|
saveOrUpdate() {
|
||
|
console.log('>>>>>>>>>saveOrUpdate', this.formobj)
|
||
|
|
||
|
this.$refs['form_obj'].validate((valid) => {
|
||
|
if (valid) {
|
||
|
this.submitdisabled = true
|
||
|
req.save(this.formobj).then((res) => {
|
||
|
if (res.success) {
|
||
|
this.$message({
|
||
|
showClose: true,
|
||
|
type: 'success',
|
||
|
message: '保存成功'
|
||
|
})
|
||
|
this.handleReturn('true')
|
||
|
} else {
|
||
|
this.submitdisabled = false
|
||
|
}
|
||
|
}).catch(() => {
|
||
|
this.submitdisabled = false
|
||
|
})
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
submit() {
|
||
|
|
||
|
this.$refs['form_obj'].validate((valid) => {
|
||
|
if (valid) {
|
||
|
this.submitdisabled = true
|
||
|
req.submit(this.formobj).then((res) => {
|
||
|
if (res.success) {
|
||
|
this.$message({
|
||
|
showClose: true,
|
||
|
type: 'success',
|
||
|
message: '保存成功'
|
||
|
})
|
||
|
this.handleReturn('true')
|
||
|
} else {
|
||
|
this.submitdisabled = false
|
||
|
}
|
||
|
}).catch(() => {
|
||
|
this.submitdisabled = false
|
||
|
})
|
||
|
}
|
||
|
})
|
||
|
|
||
|
},
|
||
|
handleReturn(isreload) {
|
||
|
if (isreload === 'true') this.$emit('reloadlist')
|
||
|
this.formobj = {
|
||
|
"sid": "",
|
||
|
"remarks": "",
|
||
|
"createBySid": "",
|
||
|
"createByName": "",
|
||
|
"createDeptSid": "",
|
||
|
"createDeptName": "",
|
||
|
"createTime": "",
|
||
|
"billNo": "",
|
||
|
"filePaths": [],
|
||
|
"useOrgSid": "",
|
||
|
"useOrgName": "",
|
||
|
"orgSidPath": "",
|
||
|
"procDefId": "",
|
||
|
"nodeId": "",
|
||
|
"procInstId": "",
|
||
|
"nodeState": "",
|
||
|
"taskId": "",
|
||
|
"finishTime": "",
|
||
|
"asOldpartreturnList": []
|
||
|
}
|
||
|
this.submitdisabled = false
|
||
|
this.isUpdata = false
|
||
|
this.$emit('doback')
|
||
|
},
|
||
|
|
||
|
showAdd() {
|
||
|
this.title = "【新增】"
|
||
|
this.isUpdata = false
|
||
|
},
|
||
|
showEdit(row) {
|
||
|
this.title = "【修改】"
|
||
|
this.isUpdata = true
|
||
|
var params = {
|
||
|
sid: row.sid
|
||
|
}
|
||
|
|
||
|
req.init(params)
|
||
|
.then(resp => {
|
||
|
if (resp.success) {
|
||
|
this.formobj = resp.data
|
||
|
}
|
||
|
})
|
||
|
.catch(e => {
|
||
|
this.formobj = {}
|
||
|
})
|
||
|
},
|
||
|
|
||
|
downLoad() {
|
||
|
const loading = this.$loading({
|
||
|
lock: true,
|
||
|
text: 'Loading',
|
||
|
spinner: 'el-icon-loading',
|
||
|
background: 'rgba(0, 0, 0, 0.7)'
|
||
|
})
|
||
|
req.downloadExcel().then((resp) => {
|
||
|
loading.close()
|
||
|
const blob = new Blob([resp], {
|
||
|
type: 'application/vnd.ms-excel'
|
||
|
})
|
||
|
const fileName = '导入厂家返厂明细模版' + '.xls'
|
||
|
const elink = document.createElement('a')
|
||
|
elink.download = fileName
|
||
|
elink.style.display = 'nonde'
|
||
|
elink.href = URL.createObjectURL(blob)
|
||
|
document.body.appendChild(elink)
|
||
|
elink.click()
|
||
|
URL.revokeObjectURL(elink.href)
|
||
|
document.body.removeChild(elink)
|
||
|
}).catch(() => {
|
||
|
loading.close()
|
||
|
})
|
||
|
},
|
||
|
submitUpload() {
|
||
|
this.$refs.upload.submit()
|
||
|
},
|
||
|
handleSuccess(resp, file, fileList) {
|
||
|
const _this = this
|
||
|
_this.uploadResultMesssage = resp.msg
|
||
|
_this.uploadSuccess = resp.success
|
||
|
|
||
|
},
|
||
|
handleConfirm() {
|
||
|
if (!this.uploadSuccess) {
|
||
|
this.$message({
|
||
|
showClose: true,
|
||
|
type: 'error',
|
||
|
message: '请先上传导入厂家返件明细'
|
||
|
})
|
||
|
return
|
||
|
}
|
||
|
this.dialogVisible = false
|
||
|
this.getList()
|
||
|
},
|
||
|
backData() {
|
||
|
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
<style lang="scss" scoped>
|
||
|
// 隐藏上传组件
|
||
|
|
||
|
::v-deep .hide {
|
||
|
.el-upload--picture-card {
|
||
|
display: none !important;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.trightb {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
text-align: center;
|
||
|
justify-content: center;
|
||
|
}
|
||
|
|
||
|
.trightb_item {
|
||
|
padding-top: 5px;
|
||
|
}
|
||
|
|
||
|
.span {
|
||
|
height: 30px;
|
||
|
line-height: 30px;
|
||
|
margin-left: 50px;
|
||
|
font-size: 15px;
|
||
|
font-weight: 400;
|
||
|
border: 1px #fff solid;
|
||
|
padding: 0px 10px;
|
||
|
border-radius: 5px;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-collapse-item__header {
|
||
|
height: 40px;
|
||
|
padding: 10px;
|
||
|
font-weight: bold;
|
||
|
font-size: 20px;
|
||
|
text-align: left;
|
||
|
color: #ffffff;
|
||
|
background-color: #0294d7;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-collapse-item__content {
|
||
|
padding-bottom: 0;
|
||
|
}
|
||
|
</style>
|