8 changed files with 322 additions and 3 deletions
-
6src/api/part/externalLabelTemplate.js
-
2src/api/part/externalPartPicture.js
-
4src/assets/scss/global.scss
-
48src/views/modules/label/printer.vue
-
1src/views/modules/label/record.vue
-
7src/views/modules/part/external.vue
-
3src/views/modules/part/picture/picture.vue
-
254src/views/modules/part/template/labelTemplate.vue
@ -0,0 +1,6 @@ |
|||
import {createAPI} from '../../utils/httpRequest' |
|||
|
|||
export const queryExternalLabelTemplate = (data) => createAPI('/part/template', 'post', data) |
|||
|
|||
|
|||
export const queryExternalLabelTemplateByPosition = (data) => createAPI('/part/template/position', 'post', data) |
|||
@ -0,0 +1,254 @@ |
|||
<script> |
|||
import ElImageViewer from 'element-ui/packages/image/src/image-viewer' |
|||
import { |
|||
queryExternalLabelTemplate, |
|||
queryExternalLabelTemplateByPosition |
|||
} from '../../../../api/part/externalLabelTemplate' |
|||
import {basePictureList} from '../../../../api/basics/basePicture' |
|||
import {removeExternalPartPicture, saveProductExternalPartPicturePart} from '../../../../api/part/externalPartPicture' |
|||
|
|||
export default { |
|||
components:{ |
|||
ElImageViewer |
|||
}, |
|||
name: 'labelTemplate', |
|||
props: { |
|||
part: { |
|||
type: Object, |
|||
required: true |
|||
}, |
|||
height: { |
|||
type: Number, |
|||
default: 370, |
|||
}, |
|||
}, |
|||
data () { |
|||
return { |
|||
queryLoading: false, |
|||
dataList: [], |
|||
saveVisible: false, |
|||
currentTemplate: {}, |
|||
srcList: [], |
|||
dataPositionList: [], |
|||
currentPosition: {}, |
|||
savePositionVisible: false, |
|||
queryPicture: { |
|||
pictureDesc: '', |
|||
pictureFileName: '', |
|||
}, |
|||
basePictureList: [], |
|||
previewVisible: false, |
|||
urlList: [], |
|||
} |
|||
}, |
|||
methods: { |
|||
handleQueryExternalLabelTemplate () { |
|||
let params = {} |
|||
this.queryLoading = true |
|||
this.dataPositionList = [] |
|||
queryExternalLabelTemplate(params).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.dataList = data.rows |
|||
} else { |
|||
this.$message.error(data.msg) |
|||
} |
|||
this.queryLoading = false |
|||
}).catch((error) => { |
|||
this.$message.error(error) |
|||
this.queryLoading = false |
|||
}) |
|||
}, |
|||
handleEdit (row) { |
|||
this.currentTemplate = {...row} |
|||
this.srcList = [] |
|||
this.srcList.push(row.templateUrl) |
|||
this.handleQueryPosition(); |
|||
}, |
|||
handleQueryPosition () { |
|||
let params = { |
|||
site: this.part.site, |
|||
partNo: this.part.partNo, |
|||
templateNo: this.currentTemplate.templateNo |
|||
} |
|||
queryExternalLabelTemplateByPosition(params).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.saveVisible = true |
|||
this.dataPositionList = data.rows |
|||
} else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error) => { |
|||
this.$message.error(error) |
|||
}) |
|||
}, |
|||
handleEditPosition (row) { |
|||
this.currentPosition = {...row} |
|||
this.handleQueryBasePicture(); |
|||
this.savePositionVisible = true |
|||
}, |
|||
handleQueryBasePicture () { |
|||
let params = { |
|||
pictureNos: this.currentPosition.pictureNo?[this.currentPosition.pictureNo]:[], |
|||
pictureDesc: this.queryPicture.pictureDesc, |
|||
pictureFileName: this.queryPicture.pictureFileName, |
|||
} |
|||
basePictureList(params).then(({data}) => { |
|||
if (data && data.code === 0) { |
|||
this.basePictureList = data.rows |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error)=>{ |
|||
this.$message.error(error) |
|||
}) |
|||
}, |
|||
handlePreviewImg(row){ |
|||
this.urlList = []; |
|||
this.urlList.push(row.pictureUrl); |
|||
this.previewVisible = true; |
|||
}, |
|||
handleDblClick(row){ |
|||
let params = { |
|||
site:this.part.site, |
|||
partNo:this.part.partNo, |
|||
templateNo:this.currentPosition.templateNo, |
|||
pictureClassify:'ProPicture', |
|||
picturePosition:this.currentPosition.picturePosition, |
|||
pictureNo:this.currentPosition.pictureNo, |
|||
pictureDesc:row.pictureDesc, |
|||
pictureFileName:row.pictureFileName, |
|||
pictureNewFileName:row.pictureNewFileName, |
|||
pictureUrl:row.pictureUrl, |
|||
basePictureNo:row.pictureNo, |
|||
createBy:this.$store.state.user.name, |
|||
} |
|||
this.savePositionVisible = false |
|||
saveProductExternalPartPicturePart(params).then(({data})=>{ |
|||
if (data && data.code === 0){ |
|||
this.$message.success(data.msg); |
|||
this.handleQueryPosition(); |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error)=>{ |
|||
this.$message.error(error) |
|||
}) |
|||
}, |
|||
handleClearPosition(row){ |
|||
let params = { |
|||
site:this.part.site, |
|||
partNo:this.part.partNo, |
|||
pictureNo:row.pictureNo, |
|||
pictureUrl:row.pictureUrl, |
|||
} |
|||
removeExternalPartPicture(params).then(({data})=>{ |
|||
if (data && data.code === 0){ |
|||
this.$message.success(data.msg); |
|||
this.handleQueryPosition(); |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error)=>{ |
|||
this.$message.error(error) |
|||
}) |
|||
} |
|||
}, |
|||
watch: { |
|||
part (newVal, oldVal) { |
|||
if (newVal) { |
|||
this.handleQueryExternalLabelTemplate() |
|||
} |
|||
}, |
|||
savePositionVisible (newVal, oldVal) { |
|||
if (newVal === false) { |
|||
this.queryPicture = { |
|||
pictureDesc: '', |
|||
pictureFileName: '', |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<el-table :data="dataList" border v-loading="queryLoading" :height="height"> |
|||
<el-table-column label="Actions" width="80" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-link @click="handleEdit(scope.row)">Edit</el-link> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="Template No" prop="sortNo" width="100" align="center"></el-table-column> |
|||
<el-table-column label="Template Name" prop="templateName" min-width="130" header-align="center" |
|||
align="left"></el-table-column> |
|||
</el-table> |
|||
|
|||
<el-dialog title="Template Preview" v-drag :close-on-click-modal="false" :visible.sync="saveVisible" width="900px"> |
|||
<div style="display: flex; justify-content: center;margin-bottom: 10px"> |
|||
<el-image |
|||
style="width: 700px; height: 300px" |
|||
:src="currentTemplate.templateUrl" |
|||
:preview-src-list="srcList"> |
|||
</el-image> |
|||
</div> |
|||
|
|||
<el-table :data="dataPositionList" border height="300"> |
|||
<el-table-column label="Actions" align="center" width="140"> |
|||
<template slot-scope="scope"> |
|||
<el-link @click="handleEditPosition(scope.row)">Edit</el-link> |
|||
<el-link v-if="scope.row.pictureNo" @click="handleClearPosition(scope.row)">Clear</el-link> |
|||
<el-link v-if="scope.row.pictureNo" @click="handlePreviewImg(scope.row)">View</el-link> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="Template Name" prop="templateName" width="100" header-align="center" |
|||
align="left"></el-table-column> |
|||
<el-table-column label="Position" prop="picturePosition" width="100" header-align="center" |
|||
align="left"></el-table-column> |
|||
<el-table-column label="Certification Code" prop="certificationNo" min-width="120" header-align="center" |
|||
align="left"></el-table-column> |
|||
<el-table-column label="Certification Desc" prop="pictureDesc" min-width="160" header-align="center" |
|||
align="left"></el-table-column> |
|||
<el-table-column label="Created By" prop="createBy" min-width="100" header-align="center" |
|||
align="left"></el-table-column> |
|||
<el-table-column label="Created Time" prop="createTime" min-width="140" header-align="center" |
|||
align="center"></el-table-column> |
|||
</el-table> |
|||
<div slot="footer"> |
|||
<el-button type="primary" @click="saveVisible = false">Cancel</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
<el-dialog title="Certification" v-drag :close-on-click-modal="false" :visible.sync="savePositionVisible" width="500px"> |
|||
<el-form label-position="top" :model="queryPicture"> |
|||
<el-row :gutter="10"> |
|||
<el-col :span="8"> |
|||
<el-form-item label="Certification Description" class="auto"> |
|||
<el-input v-model="queryPicture.pictureDesc"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item label=" "> |
|||
<el-button type="primary" @click="handleQueryBasePicture">Query</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
<el-table :data="basePictureList" @row-dblclick="handleDblClick" border :height="400" :style="`width: 100%;margin-top: 5px`"> |
|||
<el-table-column prop="certificationNo" label="Certification Code" min-width="60"/> |
|||
<el-table-column prop="pictureDesc" label="Certification Description" min-width="120"/> |
|||
<el-table-column label="Actions" width="60" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-link @click="handlePreviewImg(scope.row)">View</el-link> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-dialog> |
|||
|
|||
<el-image-viewer v-if="previewVisible" :z-index="9999" :on-close="()=>{this.previewVisible = false}" :url-list="urlList"></el-image-viewer> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue