Skip to content

C
connector-admin
Commit eaa5f220 authored by sunshine.wang@elitesland.com's avatar sunshine.wang@elitesland.com
Browse files
Options

打印条码页面完善

parent 131b1fae
Show whitespace changes
Inline Side-by-side
Showing with 119 additions and 38 deletions
src/views/components/QrCodeDemo.vue
View file @ eaa5f220
...@@ -25,17 +25,48 @@ ...@@ -25,17 +25,48 @@
</el-select> </el-select>
</div> </div>
<div class="body-container"> <div class="body-container">
<div class="cardOne" style="margin-top:30px; margin-left:-10px "> <el-row :gutter="32">
<el-col :span="12">
<div class="cardOne" style="">
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<el-button <el-button
type="primary" type="primary"
@click="firstButton" @click="firstButton"
>点击生成二维码</el-button> >点击生成二维码</el-button>
<!-- <el-button style="float: right; padding: 3px 0" type="text"
>打印二维码</el-button
> -->
<el-button <el-button
style="float: right; padding: 3px 0"
type="text" type="text"
>导出二维码</el-button> style="float: right; padding: 3px 0"
@click="dialogTableVisibleOne = true"
>打印二维码</el-button>
<el-dialog
title=""
:visible.sync="dialogTableVisibleOne"
width="50%"
>
<div style="margin-left:180px">
<qrcode-vue :value="qrCode" :size="size" level="H" />
</div>
<span slot="footer" class="dialog-footer">
<el-button
@click="dialogTableVisibleOne = false"
>取 消</el-button>
<el-button type="danger">打印二维码</el-button>
<el-button
type="primary"
@click="dialodialogTableVisibleOnegVisible = false"
>确 定</el-button>
</span>
</el-dialog>
<!--
<el-dialog :visible.sync="dialogTableVisibleOne" width="500px">
<qrcode-vue :value="qrCode" :size="size" level="H" />
</el-dialog> -->
</div> </div>
<div class="item1"> <div class="item1">
<div> <div>
...@@ -44,25 +75,54 @@ ...@@ -44,25 +75,54 @@
</div> </div>
</el-card> </el-card>
</div> </div>
<div class="cardTwo" style="margin-left:52%; margin-top:-38%"> </el-col>
<el-card class="box-card"> <el-col :span="12" />
</el-row>
<el-row :gutter="32" style="margin-top:40px">
<el-col :span="24">
<div class="cardTwo" style="with:100% margin-top:60px">
<el-card class=".box-cardFirst">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<el-button <el-button
type="primary" type="primary"
@click="SecButton" @click="SecButton"
>点击生成条形码</el-button> >点击生成条形码</el-button>
<el-button <el-button
style="float: right; padding: 3px 0"
type="text" type="text"
>导出条形码</el-button> style="float: right; padding: 3px 0"
@click="dialogTableVisibleTwo = true"
>打印条形码</el-button>
<el-dialog
title=""
:visible.sync="dialogTableVisibleTwo"
width="60%"
>
<div style="margin-left:100px">
<barcode :value="maBarCode" :format="barcodeFormat" />
</div>
<span slot="footer" class="dialog-footer">
<el-button
@click="dialogTableVisibleTwo = false"
>取 消</el-button>
<el-button type="danger">打印条形码</el-button>
<el-button
type="primary"
@click="dialogTableVisibleTwo = false"
>确 定</el-button>
</span>
</el-dialog>
</div> </div>
<div class="item2"> <div class="item2">
<div> <div>
<barcode :value="qrCode" :format="barcodeFormat" /> <barcode :value="maBarCode" :format="barcodeFormat" />
</div> </div>
</div> </div>
</el-card> </el-card>
</div> </div>
</el-col>
</el-row>
</div> </div>
</div> </div>
</template> </template>
...@@ -76,11 +136,14 @@ export default { ...@@ -76,11 +136,14 @@ export default {
}, },
data() { data() {
return { return {
dialogTableVisibleOne: false,
dialogTableVisibleTwo: false,
nowBarCode: '', nowBarCode: '',
size: 300, size: 300,
barcodeValue: 'test', barcodeValue: 'test',
barcodeFormat: '', barcodeFormat: '',
qrCode: '', qrCode: '',
maBarCode: '',
materialCode: '', materialCode: '',
options: [ options: [
{ {
...@@ -138,6 +201,13 @@ export default { ...@@ -138,6 +201,13 @@ export default {
mounted() {}, mounted() {},
methods: { methods: {
firstButton() { firstButton() {
if (this.materialCode === '') {
this.$message({
message: '请先输入物料编码',
type: 'warning'
})
return
}
this.qrCode = this.materialCode this.qrCode = this.materialCode
console.log(this.materialCode) console.log(this.materialCode)
this.$message({ this.$message({
...@@ -146,6 +216,13 @@ export default { ...@@ -146,6 +216,13 @@ export default {
}) })
}, },
SecButton() { SecButton() {
if (this.materialCode === '') {
this.$message({
message: '请先输入物料编码',
type: 'warning'
})
return
}
if (this.nowBarCode === '') { if (this.nowBarCode === '') {
this.$message({ this.$message({
message: '请先选择条形码类型', message: '请先选择条形码类型',
...@@ -153,7 +230,7 @@ export default { ...@@ -153,7 +230,7 @@ export default {
}) })
return return
} }
this.qrCode = this.materialCode this.maBarCode = this.materialCode
console.log('nowBarCode', this.nowBarCode) console.log('nowBarCode', this.nowBarCode)
this.barcodeFormat = this.nowBarCode.value this.barcodeFormat = this.nowBarCode.value
} }
...@@ -163,7 +240,7 @@ export default { ...@@ -163,7 +240,7 @@ export default {
<style scoped> <style scoped>
.app-container .body-container { .app-container .body-container {
padding: 20px 20px 20px 20px; padding: 40px 20px 20px 20px;
} }
.head-container { .head-container {
margin-top: 0px; margin-top: 0px;
...@@ -194,4 +271,8 @@ export default { ...@@ -194,4 +271,8 @@ export default {
.box-card { .box-card {
width: 480px; width: 480px;
} }
.box-cardFirst {
margin-top: 100px;
width: 100%;
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment