This commit is contained in:
chenjianan
2019-06-02 14:40:08 +08:00
9 changed files with 197 additions and 5 deletions

View File

@@ -20,6 +20,7 @@
:label="item.label"
:value="item.value"/>
</el-select>
<el-button type="primary" size="small" @click="opendialogVisibleMachine()">上传总图</el-button>
</div>
<upload-excel-component @on-selected-file="selected"/>
</div>
@@ -44,6 +45,51 @@
<!--<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>-->
<!--<div slot="tip" class="el-upload__tip">只能上传jpg/png文件且不超过500kb</div>-->
<!--</el-upload>-->
<el-dialog
:visible.sync="dialogVisibleMachine"
width="30%">
<el-card>
<el-select clearable filterable v-model="machineDrawValue" filterable size="small" placeholder="机床名称" @change="changeMachine">
<el-option
v-for="item in machineDraw"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<div style="float: right;">
<el-upload
:action="action"
:on-success="uploadSuccess"
:on-error="uploadFailure"
:show-file-list="showFileList"
:file-list="fileList"
class="upload-demo"
multiple>
<el-button size="small" type="primary" :disabled="disabledMachine">点击上传</el-button>
</el-upload>
</div>
</el-card>
<el-card>
<div v-for="(file, key) in hadFile" :key="key">
<div class="wrapper">
<div class="content">
<div class="action">
<a class="delete" @click="deleteFileData(file.id)">删除</a>
</div>
<div v-if="file.suffix==='pdf'" class="icon"><svg-icon icon-class="pdf" /></div>
<div v-else-if="file.suffix==='docx'||file.suffix === 'doc'" class="icon"><svg-icon icon-class="doc" /></div>
<div v-else-if="file.suffix==='xlsx' || file.suffix === 'xls'" class="icon"><svg-icon icon-class="excel" /></div>
<div v-else-if="file.suffix==='pptx' || file.suffix === 'ppt'" class="icon"><svg-icon icon-class="ppt" /></div>
<div v-else-if="file.suffix==='jpg' || file.suffix === 'jpeg'|| file.suffix === 'png'" class="icon"><svg-icon icon-class="pic" /></div>
<div v-else class="icon"><svg-icon icon-class="file" /></div>
<a :href="file.url"><div class="info">{{ file.name }}</div></a>
</div>
</div>
</div>
</el-card>
</el-dialog>
</div>
</template>
@@ -51,13 +97,22 @@
import UploadExcelComponent from './UploadExcel/index.vue'
import specificationData from './specificationData'
import { sleep } from '../../../utils/tool'
import { initProject, isExit, isExit1, importBasics, importPurcharse, searchMachine, searchGroupNum } from '../../../api/TechnologyCenter/ImportParts'
import { initProject, isExit, isExit1, importBasics, importPurcharse, searchMachine, searchGroupNum, machineSelect, getFileData, deleteFileData } from '../../../api/TechnologyCenter/ImportParts'
import { uploadFileMachine, downloadFileMachine } from '@/utils/request'
export default {
name: 'UploadExcel',
components: { UploadExcelComponent, specificationData },
data() {
return {
fileList: [],
hadFile: [],
showFileList: true,
projectId: '',
action: '',
disabledMachine: true,
machineDrawValue: '',
machineDraw: [],
dialogVisibleMachine: false,
project: [],
projectValue: '',
worksheet: [],
@@ -108,6 +163,57 @@ export default {
this.fetchData()
},
methods: {
opendialogVisibleMachine() {
this.machineDraw = []
this.machineDrawValue = ''
this.dialogVisibleMachine = true
this.machineDrawValue === '' ? this.disabledMachine = true : this.disabledMachine = false
this.getSelect(machineSelect, ['机床图号', '机床流水号'], 'machineDraw', this.projectValue)
},
changeMachine() {
this.machineDrawValue === '' ? this.disabledMachine = true : this.disabledMachine = false
this.action = `${uploadFileMachine}?&MachineNum=${this.machineDrawValue}`
this.getFileData(this.machineDrawValue)
console.log(this.action)
},
uploadSuccess(res, file, fileList) {
if (res[0].result === '1') {
const index = fileList.indexOf(file)
fileList.splice(index, 1)
} else {
this.$message.error(`${file.name}文件上传失败,请检查上传文件是否正确!`)
}
if (fileList.length === 0) {
this.$message.success('文件上传成功')
this.getFileData(this.machineDrawValue)
}
},
uploadFailure(a, file, fileList) {
fileList.map(file => {
this.$message.error(`${file.name}文件上传失败,请检查上传文件是否正确!`)
})
},
// 在什么情况下需要查询上传的附件调用this.getFileData()即可根据
getFileData(machineDrawValue) {
console.log(machineDrawValue, 88)
this.hadFile = []
getFileData(machineDrawValue).then(res => {
console.log(res)
if (res.data.length > 0) {
res.data.map(item => {
this.hadFile.push({
url: `${downloadFileMachine}?id=${item.文件标识}.${item.文件后缀}&name=${item.文件名称}.${item.文件后缀}`,
name: `${item.文件名称}.${item.文件后缀}`,
suffix: item.文件后缀,
id: item.文件标识
})
})
}
})
},
deleteFileData(id) {
this.deleteRow(deleteFileData, id, function() { this.getFileData(this.machineDrawValue) })
},
async test() {
await sleep(10000)
console.log(1)
@@ -339,8 +445,52 @@ export default {
}
</script>
<style lang="scss" scoped>
/*.wrapper{*/
/*width: 100%;*/
/*margin: 0 auto;*/
/*}*/
.wrapper{
width: 100%;
margin: 0 auto;
width: 225px;
height: 50px;
overflow: hidden;
border: 1px solid #b8c7d9;
float: left;
margin: 10px;
}
</style>
.content{
position: relative;
padding: 8px 8px 0 8px;
}
.action{
position: absolute;
top: 4px;
right: 8px;
}
.delete{
padding: 0 5px;
border-radius: 3px;
color: #0f84b0;
font-size: 12px;
}
.delete:hover{
background: -webkit-linear-gradient(top,#0ba9e3,#0099d3);
color: #fff;
}
a{
text-decoration: none;
}
.icon{
width: 30px;
height: 30px;
display: inline-block;
margin-right: 7px;
margin-top: 2px;
font-size: 26px;
}
.info{
position: absolute;
left: 44px;
line-height: 30px;
display: inline-block;
color: #999;
}</style>