| | |
| | | <el-col :span="12" style="line-height: 32px;">物料清单维护</el-col> |
| | | <el-col :span="12" style="text-align: right;"> |
| | | <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;" @click="event">新增</el-button> |
| | | <el-button icon="el-icon-upload2" @click="showImportDialog">导入</el-button> |
| | | <el-button icon="el-icon-download" @click="exportDialogVisible=true">导出</el-button> |
| | | <el-button icon="el-icon-delete" @click="dels">删除</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | <div> |
| | | <el-dialog title="物料清单的维护" :visible.sync="dialogVisible" width="80%" :before-close="handleClose" :center="true"> |
| | | <div> |
| | | <el-form> |
| | | <el-row :gutter="2"> |
| | | <el-col :span="8"> |
| | | <el-form-item label="类型:"> |
| | | <el-select v-model="search.type" size="small" placeholder="请选择" |
| | | style="width: 224px;margin-right: 30px;"> |
| | | <el-option v-for="(a, ai) in bigType" :key="ai" :value="a"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="工序"> |
| | | <template> |
| | | <el-select v-model="search.work" placeholder="请选择" allow-create filterable @change="workevent"> |
| | | <el-option v-for="(item,index) in process" :key="item.name" :label="item.name" :value="item.name"> |
| | | </el-option> |
| | | </el-select> |
| | | </template> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="工艺名称:"> |
| | | <el-select v-model="search.craft" size="small" placeholder="请选择" |
| | | style="width: 224px;margin-right: 30px;"> |
| | | <el-option v-for="item in craftapi" :key="item.id" :label="item.name" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <el-button size="mini" @click="Addrow">添加行</el-button> |
| | | </div> |
| | | <div style="margin: 10px 0px;"> |
| | | <template> |
| | | <el-table border :data="tableapi" height="calc(80vh - 250px)" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="70"> |
| | | </el-table-column> |
| | | <el-table-column prop="" label="质量追溯号" width="180"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.qualityTraceability" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="name" label="原材料名称"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.name" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="address" label="规格型号"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.specifications" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="unit" label="单位"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.unit" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </template> |
| | | </div> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="skipshow">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | <div class="choose"> |
| | | <span>类型:</span> |
| | |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <el-dialog title="物料清单的维护" :visible.sync="dialogVisible" width="80%" :before-close="handleClose" :center="true"> |
| | | <div> |
| | | <el-form> |
| | | <el-row :gutter="2"> |
| | | <el-col :span="8"> |
| | | <el-form-item label="类型:"> |
| | | <el-select v-model="search.type" size="small" placeholder="请选择" |
| | | style="width: 224px;margin-right: 30px;"> |
| | | <el-option v-for="(a, ai) in bigType" :key="ai" :value="a"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="工序"> |
| | | <template> |
| | | <el-select v-model="search.work" placeholder="请选择" allow-create filterable @change="workevent"> |
| | | <el-option v-for="(item,index) in process" :key="item.name" :label="item.name" :value="item.name"> |
| | | </el-option> |
| | | </el-select> |
| | | </template> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="工艺名称:"> |
| | | <el-select v-model="search.craft" size="small" placeholder="请选择" |
| | | style="width: 224px;margin-right: 30px;"> |
| | | <el-option v-for="item in craftapi" :key="item.id" :label="item.name" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <el-button size="mini" @click="Addrow">添加行</el-button> |
| | | </div> |
| | | <div style="margin: 10px 0px;"> |
| | | <template> |
| | | <el-table border :data="tableapi" height="calc(80vh - 250px)" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="70"> |
| | | </el-table-column> |
| | | <el-table-column prop="" label="质量追溯号" width="180"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.qualityTraceability" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="name" label="原材料名称"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.name" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="address" label="规格型号"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.specifications" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="unit" label="单位"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.unit" placeholder=""></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </template> |
| | | </div> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="skipshow">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | <el-dialog title="物料清单导入" :visible.sync="importDialogVisible" width="30%"> |
| | | <el-upload ref="upload" class="upload-demo" drag action="#" :auto-upload="false" |
| | | :on-change="handleUpload" multiple> |
| | | <i class="el-icon-upload"></i> |
| | | <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> |
| | | <div class="el-upload__tip" slot="tip"> |
| | | 只能上传xls/xlsx文件,且不超过1MB。 |
| | | <a href="#" style="color:#409eff;font-size:10px;text-decoration: underline;" @click="downloadTemplate">下载模板</a> |
| | | </div> |
| | | </el-upload> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="importDialogVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="importMaterial">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | <el-dialog title="物料清单导出" :visible.sync="exportDialogVisible" width="40%"> |
| | | <el-row> |
| | | <el-col :span="4"> |
| | | <span>类型选择:</span> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" |
| | | @change="handleCheckAllChange" name="type" label="全选"></el-checkbox> |
| | | <el-checkbox-group v-model="exportTypeList" @change="handleCheckedChange"> |
| | | <el-checkbox v-for="(item,index) in bigType" :key="index" :label="item" name="type"></el-checkbox> |
| | | </el-checkbox-group> |
| | | </el-col> |
| | | </el-row> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="exportDialogVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="exportMaterial" :loading="exportLoading"> |
| | | {{exportLoading ? "加载中" : "确 定"}} |
| | | </el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | exportLoading: false, |
| | | isIndeterminate: true, |
| | | checkAll: false, |
| | | importFileList:[], |
| | | exportTypeList:[], |
| | | importDialogVisible:false, |
| | | exportDialogVisible:false, |
| | | search: { |
| | | type: 0, |
| | | technology: '' |
| | |
| | | mounted() { |
| | | this.chooseType() |
| | | }, |
| | | watch:{ |
| | | importDialogVisible(newVal){ |
| | | if(!newVal){ |
| | | this.$refs['upload'].clearFiles(); |
| | | } |
| | | }, |
| | | exportDialogVisible(newVal){ |
| | | if(!newVal){ |
| | | this.exportTypeList = []; |
| | | this.checkAll = false; |
| | | this.isIndeterminate = true; |
| | | } |
| | | }, |
| | | }, |
| | | methods: { |
| | | handleCheckAllChange(val) { |
| | | this.exportTypeList = val ? this.bigType : []; |
| | | this.isIndeterminate = false; |
| | | }, |
| | | handleCheckedChange(value) { |
| | | let checkedCount = value.length; |
| | | this.checkAll = checkedCount === this.bigType.length; |
| | | this.isIndeterminate = checkedCount > 0 && checkedCount < this.bigType.length; |
| | | }, |
| | | showImportDialog(){ |
| | | this.importDialogVisible = true; |
| | | }, |
| | | //下载模板 |
| | | downloadTemplate(){ |
| | | this.$axios.post(this.$api.url.downloadMBomTemplate, |
| | | {typeList:this.bigType.join(',')}, |
| | | { |
| | | responseType:'blob', |
| | | headers:{"Content-Type":"application/json"} |
| | | }).then((res)=>{ |
| | | this.downloadFun(res); |
| | | }).catch() |
| | | }, |
| | | //导入 |
| | | importMaterial(){ |
| | | console.log(this.importFileList); |
| | | }, |
| | | downloadFun(result){ |
| | | if(result == null || result == undefined){ |
| | | return; |
| | | } |
| | | var nameList = result.headers['content-disposition']; |
| | | nameList = decodeURI(nameList); |
| | | var fileName = nameList.split('=')[1]; |
| | | const blob = new Blob([result.data,{type: 'application/vnd.ms-excel'}]); |
| | | const link = document.createElement('a'); |
| | | link.download = fileName; |
| | | const URL = window.URL || window.webkitURL; |
| | | link.href= URL.createObjectURL(blob); |
| | | document.body.appendChild(link); |
| | | link.click(); |
| | | document.body.removeChild(link); |
| | | }, |
| | | // 文件上传 |
| | | handleUpload(file, fileList) { |
| | | const maxSize = 1 * 1024 * 1024 * 1024;//1MB |
| | | const xlsType = "application/vnd.ms-excel"; |
| | | const xlsxType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" |
| | | if(file.raw.type != xlsType && file.raw.type != xlsxType){ |
| | | this.$message.warning("导入文件格式不符!"); |
| | | this.$refs['upload'].clearFiles(); |
| | | return; |
| | | } |
| | | if(Number.parseInt(file.size) > maxSize){ |
| | | this.$message.warning("导入文件过大!"); |
| | | this.$refs['upload'].clearFiles(); |
| | | return; |
| | | } |
| | | this.importFileList = fileList; |
| | | }, |
| | | //导出 |
| | | exportMaterial(){ |
| | | if(this.exportTypeList.length == 0){ |
| | | this.$message.warning("请先选择至少一种类型!"); |
| | | return; |
| | | } |
| | | this.exportLoading = true; |
| | | this.$axios.post(this.$api.url.exportMBom, |
| | | {typeList:this.exportTypeList.join(',')}, |
| | | { |
| | | responseType:'blob', |
| | | headers:{"Content-Type":"application/json"} |
| | | }).then((res)=>{ |
| | | this.downloadFun(res); |
| | | this.exportLoading = false; |
| | | }).catch() |
| | | }, |
| | | chooseType() { |
| | | this.$axios.get(this.$api.url.chooseType).then(res => { |
| | | this.bigType = res.data |
| | | this.typeselect = res.data[0] |
| | | this.search.type = res.data[0] |
| | | this.selectAllleft() |
| | | this.selectAllMbom() |
| | | this.bigType = res.data; |
| | | this.typeselect = res.data[0]; |
| | | this.search.type = res.data[0]; |
| | | this.selectAllleft(); |
| | | this.selectAllMbom(); |
| | | }) |
| | | }, |
| | | selectDataList() { |