打印

hdy

2024-05-12 6068faa866f976b7848b872420f2d93f77f5035b

 jcdm-ui/src/views/main/bs/workshop/index.vue

@@ -28,11 +28,11 @@
<!--      </el-form>-->
      <div>
        <div id="printMe">
          <div ref="canvasWrapper"></div>
          <div ref="canvasWrapper" id="canvasWrapper"></div>
          <p>1111</p>
        </div>
        <button @click="print">打印</button>
        <button @click="test1">生成二维码</button>
        <el-button @click="print">打印</el-button>
        <el-button @click="test1">生成二维码</el-button>
      </div>
    </el-card>

@@ -102,9 +102,9 @@
        </el-table-column>
        <el-table-column label="更新人" align="center" prop="updateUser" width="150">
        </el-table-column>
        <el-table-column label="更新时间" align="center" prop="updateTime" width="180">
        <el-table-column label="更新时间" align="center" prop="updateTime">
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="200" align="center" class-name="small-padding fixed-width">
        <el-table-column fixed="right" label="操作" align="center" class-name="small-padding fixed-width">
          <template slot-scope="scope">
            <el-button
              size="mini"
@@ -176,7 +176,7 @@
</template>

<script>
import QRCode from 'qrcode'
import QRCode from 'qrcodejs2'
import { listWorkshop, getWorkshop, delWorkshop, addWorkshop, updateWorkshop } from "@/api/main/bs/workshop/workshop";

export default {
@@ -234,32 +234,35 @@
  },
  created() {
    this.getList();
    this.test1();
    // this.test1();
  },
  methods: {
    print() {
      // 本页面直接打印（有bug单岁先不要删）
      // let oldStr = window.document.body.innerHTML;
      // let newStr = document.getElementById('printMe').innerHTML;
      // document.body.innerHTML = newStr;
      // window.print();
      // document.body.innerHTML = oldStr;
      // return false;

      let printMe = document.querySelector('#printMe');
      let printWindow = window.open('', '_blank');
      printWindow.document.write(printMe.innerHTML);
      printWindow.document.close();
      printWindow.focus();
      printWindow.print();
      printWindow.close();
      // 新开页面打印
      let newStr = document.getElementById('printMe').innerHTML;
      let newWin = window.open('', '_blank');
      newWin.document.body.innerHTML = newStr;
      newWin.print();
      return false;
    },
    test1(){
      QRCode.toCanvas(this.text, {
        width: 40,
        // height: 40,
        margin: 1,

      }, (error, canvas) => {
        if (error) {
          console.error(error)
          return
        }
        // 在canvas的父元素中插入canvas元素
        this.$refs.canvasWrapper.appendChild(canvas)
      document.getElementById('canvasWrapper').innerHTML = '';
      this.$nextTick(() => {
        let qrCode = new QRCode('canvasWrapper',{
          width: 50,
          height: 50,
          text: this.text,
          colorDark: '#000',
          colorLight: '#fff'
        })
      })
    },
    advancedQuery(){