print.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <div class="print-page-header">
  3. <a-radio-group key="4" id="print-printerType" v-model="printerType">
  4. <a-radio value="NEEDLE">针式</a-radio>
  5. <a-radio value="INK">喷墨</a-radio>
  6. </a-radio-group>
  7. <a-button key="3" id="print-preview-btn" :disabled="disabled" @click="handlePrint('preview')">打印预览</a-button>
  8. <a-button key="2" type="primary" id="print-print-btn" :disabled="disabled" @click="handlePrint('print')">快捷打印</a-button>
  9. <a-button
  10. key="1"
  11. type="primary"
  12. class="button-warning"
  13. id="print-export-btn"
  14. v-if="showExport"
  15. :disabled="disabled"
  16. @click="handlePrint('export')">导出Excel</a-button>
  17. <!-- 打印 -->
  18. <div id="print"></div>
  19. </div>
  20. </template>
  21. <script>
  22. export default {
  23. name: 'Print',
  24. props: {
  25. disabled: {
  26. type: Boolean,
  27. default: false
  28. },
  29. showExport: {
  30. type: Boolean,
  31. default: true
  32. }
  33. },
  34. data () {
  35. return {
  36. printerType: 'NEEDLE' // 打印机类型
  37. }
  38. },
  39. methods: {
  40. handlePrint (type) {
  41. this.$emit('handlePrint', type, this.printerType)
  42. }
  43. }
  44. }
  45. </script>
  46. <style lang="less">
  47. .print-page-header{
  48. display: inline-block;
  49. > *{
  50. margin-left: 5px;
  51. }
  52. }
  53. </style>