|
|
|
@ -3,159 +3,178 @@ |
|
|
|
:title="!dataForm.contractId ? '新增' : '修改'" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:visible.sync="visible"> |
|
|
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="100px" size="mini"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="合同类型" prop="contractType"> |
|
|
|
<el-select v-model="dataForm.contractType" placeholder="合同类型" style="width: 100%;"> |
|
|
|
<el-option |
|
|
|
v-for="item in contractTypeOpt" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="合同编号" prop="contractNumber"> |
|
|
|
<el-input v-model="dataForm.contractNumber" placeholder="合同编号"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="是否是主合同" prop="isMaster"> |
|
|
|
<el-switch |
|
|
|
v-model="dataForm.isMaster" |
|
|
|
active-color="#409EFF" |
|
|
|
inactive-color="#F56C6C" |
|
|
|
:active-value="1" |
|
|
|
:inactive-value="0" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="是否验收" prop="isAcceptance"> |
|
|
|
<el-switch |
|
|
|
v-model="dataForm.isAcceptance" |
|
|
|
active-color="#409EFF" |
|
|
|
inactive-color="#F56C6C" |
|
|
|
:active-value="1" |
|
|
|
:inactive-value="0" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="客户" prop="clientId"> |
|
|
|
<el-select v-model="dataForm.clientId" placeholder="客户" style="width: 100%;"> |
|
|
|
<el-option |
|
|
|
v-for="item in clientIdOpt" |
|
|
|
:key="item.clientId" |
|
|
|
:label="item.clientName" |
|
|
|
:value="item.clientId"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="备注" prop="remarks"> |
|
|
|
<el-input v-model="dataForm.remarks" placeholder="备注"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-button size="mini" type="primary" @click="addMaterial">选择物料</el-button> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="总计"> |
|
|
|
<el-input v-model="dataForm.totalSum" placeholder="总计" disabled></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-form :model="dataForm" ref="dataForm" :rules="dataRule" @keyup.enter.native="dataFormSubmit()" label-width="100px" size="mini"> |
|
|
|
<el-tabs v-model="activeName"> |
|
|
|
<el-tab-pane label="基本信息" name="first"> |
|
|
|
<div class="tab_box_wraper"> |
|
|
|
<el-form-item label="合同类型" prop="contractType"> |
|
|
|
<el-select v-model="dataForm.contractType" placeholder="合同类型" style="width: 100%;"> |
|
|
|
<el-option |
|
|
|
v-for="item in contractTypeOpt" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="合同编号" prop="contractNumber"> |
|
|
|
<el-input v-model="dataForm.contractNumber" placeholder="合同编号"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="是否是主合同" prop="isMaster"> |
|
|
|
<el-switch |
|
|
|
v-model="dataForm.isMaster" |
|
|
|
active-color="#409EFF" |
|
|
|
inactive-color="#F56C6C" |
|
|
|
:active-value="1" |
|
|
|
:inactive-value="0" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="是否验收" prop="isAcceptance"> |
|
|
|
<el-switch |
|
|
|
v-model="dataForm.isAcceptance" |
|
|
|
active-color="#409EFF" |
|
|
|
inactive-color="#F56C6C" |
|
|
|
:active-value="1" |
|
|
|
:inactive-value="0" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="客户" prop="clientId"> |
|
|
|
<el-select v-model="dataForm.clientId" placeholder="客户" style="width: 100%;"> |
|
|
|
<el-option |
|
|
|
v-for="item in clientIdOpt" |
|
|
|
:key="item.clientId" |
|
|
|
:label="item.clientName" |
|
|
|
:value="item.clientId"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="备注" prop="remarks"> |
|
|
|
<el-input v-model="dataForm.remarks" placeholder="备注"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-show="fileData.length" label="附件列表"> |
|
|
|
<div class="file-item" v-for="(e, i) in fileData" :key="e.storageId"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="2"><i class="el-icon-document"></i></el-col> |
|
|
|
<el-col :span="14"> |
|
|
|
<div class="file-item-name">{{e.realName}}</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="4" style="text-align: right;"><el-button type="primary" icon="el-icon-delete" @click="deleteFile(e)"></el-button></el-col> |
|
|
|
<el-col :span="4" style="text-align: right;"><el-button type="primary" icon="el-icon-download" @click="downloadFile(e, i)"></el-button></el-col> |
|
|
|
</el-row> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="上传"> |
|
|
|
<el-upload |
|
|
|
ref="upload" |
|
|
|
:action="$baseUrl + '/api/localStorage' + '?name=' + dataForm.filename" |
|
|
|
:limit="1" |
|
|
|
:headers="headers" |
|
|
|
:before-upload="beforeUpload" |
|
|
|
:on-success="handleSuccess" |
|
|
|
:on-error="handleError" |
|
|
|
:on-remove="handleRemove" |
|
|
|
:auto-upload="false" |
|
|
|
> |
|
|
|
<el-button slot="trigger" size="mini" type="primary">文件</el-button> |
|
|
|
<el-button style="margin-left: 10px;" size="mini" type="success" @click="submitUpload">上传到服务器</el-button> |
|
|
|
<div slot="tip" class="el-upload__tip">可上传任意格式文件，且不超过100M</div> |
|
|
|
</el-upload> |
|
|
|
</el-form-item> |
|
|
|
</div> |
|
|
|
</el-tab-pane> |
|
|
|
<el-tab-pane label="选择物料" name="second"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-button size="mini" type="primary" @click="addMaterial">选择物料</el-button> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="总计"> |
|
|
|
<el-input v-model="dataForm.totalSum" placeholder="总计" disabled></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-table |
|
|
|
:data="materData" |
|
|
|
border |
|
|
|
size="mini" |
|
|
|
max-height="500" |
|
|
|
style="width: 100%;"> |
|
|
|
<el-table-column |
|
|
|
prop="materialCode" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料编码"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="materialName" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料名称"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="materialType" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料类型"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="单价"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.price" placeholder="请输入单价" @input="calculateTotal(scope.$index)" @blur="calculateTotal(scope.$index)"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="价格系数"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.coefficient" placeholder="请输入价格系数"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="对外价格"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.externalPrice" placeholder="请输入对外价格"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="数量"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.quantity" placeholder="请输入数量" @input="calculateTotal(scope.$index)" @blur="calculateTotal(scope.$index)"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="总价"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.total }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
fixed="right" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="80" |
|
|
|
label="操作"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button type="text" size="small" @click="deleteHandle(scope.$index)">删除</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
</el-form> |
|
|
|
<el-table |
|
|
|
:data="materData" |
|
|
|
border |
|
|
|
size="mini" |
|
|
|
max-height="200" |
|
|
|
style="width: 100%;"> |
|
|
|
<el-table-column |
|
|
|
prop="materialCode" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料编码"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="materialName" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料名称"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="materialType" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="物料类型"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="单价"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.price" placeholder="请输入单价" @input="calculateTotal(scope.$index)" @blur="calculateTotal(scope.$index)"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="价格系数"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.coefficient" placeholder="请输入价格系数"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="对外价格"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.externalPrice" placeholder="请输入对外价格"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="120" |
|
|
|
label="数量"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-input size="mini" v-model="scope.row.quantity" placeholder="请输入数量" @input="calculateTotal(scope.$index)" @blur="calculateTotal(scope.$index)"></el-input> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
label="总价"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.total }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
fixed="right" |
|
|
|
header-align="center" |
|
|
|
align="center" |
|
|
|
width="80" |
|
|
|
label="操作"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button type="text" size="small" @click="deleteHandle(scope.$index)">删除</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<el-button size="mini" @click="visible = false">取消</el-button> |
|
|
|
<el-button size="mini" type="primary" @click="dataFormSubmit()">确定</el-button> |
|
|
|
@ -248,7 +267,9 @@ |
|
|
|
clientId: '', |
|
|
|
isAcceptance: 0, |
|
|
|
remarks: '', |
|
|
|
totalSum: 0 |
|
|
|
totalSum: 0, |
|
|
|
filename: null, |
|
|
|
storageId: null |
|
|
|
}, |
|
|
|
dataRule: { |
|
|
|
contractType: [ |
|
|
|
@ -270,7 +291,10 @@ |
|
|
|
totalPage: 0, |
|
|
|
dataListLoading: false, |
|
|
|
dataListSelections: [], |
|
|
|
materData: [] |
|
|
|
materData: [], |
|
|
|
activeName: 'first', |
|
|
|
headers: { 'Token': this.$cookie.get('token') }, |
|
|
|
fileData: [] |
|
|
|
} |
|
|
|
}, |
|
|
|
props: { |
|
|
|
@ -306,11 +330,22 @@ |
|
|
|
this.dataForm.materialJson = data.contract.materialJson |
|
|
|
this.dataForm.isAcceptance = data.contract.isAcceptance |
|
|
|
this.dataForm.remarks = data.contract.remarks |
|
|
|
this.materData = JSON.parse(data.contract.materialJson) |
|
|
|
} |
|
|
|
}) |
|
|
|
this.getFile() |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
getFile () { |
|
|
|
this.$http({ |
|
|
|
url: this.$http.adornUrl('/api/localStorage'), |
|
|
|
method: 'get', |
|
|
|
params: this.$http.adornParams({'contractId': this.dataForm.contractId}) |
|
|
|
}).then(({data}) => { |
|
|
|
this.fileData = [...data] |
|
|
|
}) |
|
|
|
}, |
|
|
|
addMaterial () { |
|
|
|
this.innerVisible = true |
|
|
|
this.getDataList() |
|
|
|
@ -326,6 +361,10 @@ |
|
|
|
}, |
|
|
|
// 表单提交 |
|
|
|
dataFormSubmit () { |
|
|
|
let ids = this.fileData.length > 0 ? this.fileData.map(item => item.storageId).join(',') : '' |
|
|
|
if (ids) { |
|
|
|
ids += ',' |
|
|
|
} |
|
|
|
this.$refs['dataForm'].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.$http({ |
|
|
|
@ -340,7 +379,7 @@ |
|
|
|
'materialJson': JSON.stringify(this.materData), |
|
|
|
'isAcceptance': this.dataForm.isAcceptance, |
|
|
|
'remarks': this.dataForm.remarks, |
|
|
|
'totalSum': this.dataForm.totalSum |
|
|
|
'storageId': `${ids}${this.dataForm.storageId}` |
|
|
|
}) |
|
|
|
}).then(({data}) => { |
|
|
|
if (data && data.code === 0) { |
|
|
|
@ -349,6 +388,7 @@ |
|
|
|
type: 'success', |
|
|
|
duration: 1500, |
|
|
|
onClose: () => { |
|
|
|
this.$refs.upload.clearFiles() |
|
|
|
this.visible = false |
|
|
|
this.$emit('refreshDataList') |
|
|
|
} |
|
|
|
@ -403,12 +443,61 @@ |
|
|
|
}, |
|
|
|
deleteHandle(index) { |
|
|
|
this.materData.splice(index, 1) |
|
|
|
}, |
|
|
|
// 上传文件 |
|
|
|
beforeUpload(file) { |
|
|
|
let isLt2M = true |
|
|
|
isLt2M = file.size / 1024 / 1024 < 100 |
|
|
|
if (!isLt2M) { |
|
|
|
this.$message.error('上传文件大小不能超过 100MB!') |
|
|
|
return |
|
|
|
} |
|
|
|
this.dataForm.filename = file.name |
|
|
|
return isLt2M |
|
|
|
}, |
|
|
|
handleSuccess(response, file, fileList) { |
|
|
|
this.$notify({title: '上传成功',type: 'success'}) |
|
|
|
this.dataForm.storageId = response.storageId |
|
|
|
}, |
|
|
|
handleError(e, file, fileList) { |
|
|
|
const msg = JSON.parse(e.message) |
|
|
|
this.$notify({ |
|
|
|
title: msg.message, |
|
|
|
type: 'error', |
|
|
|
duration: 2500 |
|
|
|
}) |
|
|
|
}, |
|
|
|
handleRemove (file, fileList) { |
|
|
|
this.dataForm.storageId = null |
|
|
|
}, |
|
|
|
submitUpload () { |
|
|
|
this.$refs.upload.submit() |
|
|
|
}, |
|
|
|
deleteFile (e, i) { |
|
|
|
this.fileData.splice(i, 1) |
|
|
|
}, |
|
|
|
downloadFile (e) { |
|
|
|
const link = document.createElement('a') |
|
|
|
link.href = e.path |
|
|
|
link.download = e.realName |
|
|
|
link.click() |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.tab_box_wraper { |
|
|
|
width: 460px; |
|
|
|
} |
|
|
|
.file-item { |
|
|
|
border: 1px solid #eee; |
|
|
|
padding: 5px 8px 5px 15px; |
|
|
|
} |
|
|
|
.file-item-name { |
|
|
|
font-size: 14px; |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
.el-pagination { |
|
|
|
margin-top: 15px; |
|
|
|
text-align: right; |
|
|
|
|
