<template> <div class="container" style=" width:600px;/*height:228px;*/color: #333"> <div class="noprint container" style="text-align:right; padding: 20px;float: right"> <a-button v-print="'#printContent'" ghost type="primary">打印</a-button> </div> <div class="row" id="printContent"> <table width="100%" border="0" cellspacing="0" cellpadding="0" v-for="source in dataSource"> <caption style="font-size:22px;text-align:left; color:#333; "></caption> <tbody> <tr> <td scope="col" style="font-size:16px;font-weight:bold">物料编码:{{ source.code }}</td> </tr> <tr> <td scope="col" style="font-size:16px;font-weight:bold">物料名称:{{ source.name }}</td> </tr> <tr> <td scope="col" style="font-size:16px;font-weight:bold">物料类别:{{ source.type }}</td> <td rowspan="3" style="padding: 1px"> <vue-qr :text="source.code" :size="70" :margin="0"></vue-qr> </td> </tr> <tr> <td scope="col" style="font-size:16px;font-weight:bold">物料规格:{{ source.spec }}</td> </tr> <tr> <td scope="col" style="font-size:16px;font-weight:bold">物料数量:{{ source.userDef1 }}</td> </tr> </tbody> </table> </div> </div> </template> <script> import {httpAction, getAction} from '@/api/manage' import {validateDuplicateValue} from '@/utils/util' import {getMaterialLocation} from '@/api/api' import VueQr from 'vue-qr' export default { name: 'MaterialPrintForm', components: { VueQr, }, props: { //表单禁用 disabled: { type: Boolean, default: false, required: false } }, data() { return { dataSource: {}, model: {}, labelCol: { xs: {span: 24}, sm: {span: 5}, }, wrapperCol: { xs: {span: 24}, sm: {span: 16}, }, confirmLoading: false, validatorRules: {}, url: { add: "/config/material/add", edit: "/config/material/edit", queryById: "/config/material/queryById" } } }, computed: { formDisabled() { return this.disabled }, }, created() { //备份model原始值 this.modelDefault = JSON.parse(JSON.stringify(this.model)); }, methods: { add() { this.edit(this.modelDefault); model.enable = 1; this.form.setFieldsValue({enable: 1}); }, edit(record) { // this.model = Object.assign({}, record); // this.visible = true; getMaterialLocation(record).then((res) => { if (res.success) { // var data = res.result; this.dataSource = res.result; console.log("getMaterialLocation!!:" + this.dataSource.length); this.visible = true; } }); }, submitForm() { const that = this; // 触发表单验证 this.$refs.form.validate(valid => { if (valid) { that.confirmLoading = true; let httpurl = ''; let method = ''; if (!this.model.id) { httpurl += this.url.add; method = 'post'; } else { httpurl += this.url.edit; method = 'put'; } httpAction(httpurl, this.model, method).then((res) => { if (res.success) { that.$message.success(res.message); that.$emit('ok'); } else { that.$message.warning(res.message); } }).finally(() => { that.confirmLoading = false; }) } }) }, } } </script>