修改打印组件。

packages/print/src/PrintEpc.vue

@@ -9,21 +9,15 @@
       v-model:show="modal"
       title="发卡机发卡"
     >
-      <div
-        v-if="printResult != null && printResult.command == 'read'"
-        class="alert alert-info"
-        role="alert"
-      >
-        {{ printResult.success ? '操作成功' : '操作失败' }},读取到{{ printResult.tagCount }}个标签,{{ printResult.epcs }}
-      </div>
-
-      <div
-        v-if="printResult != null && printResult.command == 'write'"
-        class="alert alert-danger"
-        role="alert"
-      >
-        {{ printResult.success ? '操作成功' : '操作失败' }},{{ printResult.message }}待写入EPC：{{ lastWriteEpc }}
+      <div class="form-horizontal">
+        <div class="form-group">
+          <label class="col-sm-2 control-label">EPC</label>
+          <div class="col-sm-10">
+            <input v-model="lastWriteEpc" type="text" class="form-control" placeholder="EPC" />
+          </div>
+        </div>
       </div>
+      
 
       <div
         v-if="printResult != null && printResult.command == 'restore'"
@@ -35,35 +29,44 @@
 
       <button
         type="button"
-        class="btn btn-info"
+        class="btn btn-default m-button"
         @click="printSingleEpc(lastWriteEpc)"
       >
-        再次打印
+        打印
       </button>
 
       <button
         type="button"
-        class="btn btn-info"
+        class="btn btn-default m-button"
         @click="restoreEpc"
       >
-        恢复标签
+        重置
       </button>
 
       <button
         type="button"
-        class="btn btn-info"
+        class="btn btn-default m-button"
         @click="readEpc"
       >
         读取
       </button>
 
-      <button
-        type="button"
-        class="btn btn-danger"
-        @click="modal = false"
+
+      <div
+        v-if="printResult != null && printResult.command == 'write'"
+        class="alert alert-danger"
+        role="alert"
       >
-        关闭
-      </button>
+        {{ printResult.success ? '操作成功' : '操作失败' }},{{ printResult.message }}待写入EPC：{{ lastWriteEpc }}
+      </div>
+      
+      <div
+        v-if="printResult != null && printResult.command == 'read'"
+        class="alert alert-info"
+        role="alert"
+      >
+        {{ printResult.success ? '操作成功' : '操作失败' }},读取到{{ printResult.tagCount }}个标签,{{ printResult.epcs }}
+      </div>
     </Modal>
     <Loading v-if="loading" />
   </div>
@@ -87,7 +90,13 @@ export default {
       type: String,
       default: '',
     },
+    'visible':{
+      type: Boolean,
+      default: false,
+    },
   },
+  
+  emits: ['update:visible'],
 
   data: function () {
     return {
@@ -102,10 +111,20 @@ export default {
         epc: '',        // 打印的EPC
       },
       loading: false,
-      modal: false,
     };
   },
 
+  computed: {
+    modal: {
+      get(){
+        return this.visible;
+      },
+      set(value){
+        this.$emit('update:visible', value);
+      },
+    },
+  },
+
 
   methods: {
     /**
@@ -140,7 +159,6 @@ export default {
         }
       }
 
-      _self.lastWriteEpc = epc;
 
       this.printSingleEpc(epc);
     },
@@ -152,6 +170,7 @@ export default {
     printSingleEpc: function (epc) {
       let _self = this;
 
+      _self.lastWriteEpc = epc;
       _self.modal = false;
 
       let promise = PrintEpcUtil.printSingleEpc(this.printerName, epc);
@@ -223,3 +242,10 @@ export default {
   },
 };
 </script>
+
+<style scoped>
+  .m-button{
+    margin-right: 1rem;
+    margin-bottom: 1rem;
+  }
+</style>

packages/print/src/PrintUtil.js

@@ -71,12 +71,7 @@ export default {
     var promise = new Promise((resolve, reject) => {
       _self.connectNodeRed(resolve, reject, commandStr);
     });
-    promise.then(successData => {
-      // resolve();
-    }, errorData => {
-      console.log(errorData);
-      // reject(errorData);
-    });
+    return promise;
   },
 
 
@@ -96,7 +91,6 @@ export default {
     var promise = new Promise((resolve, reject) => {
       _self.connectNodeRed(resolve, reject, commandStr);
     });
-    console.log(promise);
     return promise;
   },
 

packages/print/src/PrintWidget.vue

@@ -3,10 +3,9 @@
     <label for="select-printer">{{ $t('lang.PrintWidget.selectPrinter') }}</label>
     <select
       id="select-printer"
-      v-model="selectedPrinter"
+      v-model="selectedPrinterComputed"
       class="form-control"
       style="width: 15em"
-      @change="selectedPrinterChanged"
     >
       <option value="" />
       <option
@@ -50,18 +49,39 @@ export default {
       type: Boolean,
       default: false,
     }, 
+    // 是否显示打印按钮
+    'selectedPrinter':
+    {
+      type: String,
+      default: '',
+    }, 
   },
 
 
-  emits: ['changePrinter', 'print'],
+  emits: ['changePrinter', 'print', 'update:selectedPrinter'],
 
   data: function () {
     return {
       'printers': [], // 系统上的打印机
-      'selectedPrinter': '',   // 选择的打印机
     };
   },
 
+  computed: {
+    selectedPrinterComputed: {
+      get(){
+        return this.selectedPrinter;
+      },
+      set(value){
+        this.$emit('update:selectedPrinter', value);
+        if (value != null) {
+          localStorage.setItem(this.key, value);
+        } else {
+          localStorage.removeItem(this.key);
+        }
+      },
+    },
+  },
+
 
 
   mounted: function () {
@@ -82,17 +102,6 @@ export default {
 
   methods: {
 
-    /**
-     * 选择的打印机发生改变，保存打印机的设置
-     */
-    selectedPrinterChanged: function () {
-      this.$emit('changePrinter');
-      if (this.selectedPrinter != null) {
-        localStorage.setItem(this.key, this.selectedPrinter);
-      } else {
-        localStorage.removeItem(this.key);
-      }
-    },
 
     /**
      * 恢复选择的打印机
@@ -100,9 +109,9 @@ export default {
     restoreSelectedPrinter: function () {
       var selectedPrinterStr = localStorage.getItem(this.key);
       if (selectedPrinterStr != null && selectedPrinterStr.length > 0) {
-        this.selectedPrinter = selectedPrinterStr;
+        this.$emit('update:selectedPrinter', selectedPrinterStr);
       } else {
-        this.selectedPrinter = '';
+        this.$emit('update:selectedPrinter', '');
       }
     },
 

webpack.dev.js

@@ -17,7 +17,7 @@ module.exports = WebpackMerge.merge(baseConfig, {
     proxy: {
       '/api': {
           //要访问的跨域的域名
-          target: 'http://127.0.0.1:83/',
+          target: 'http://192.168.1.129:10022/',
           ws: true, // 是否启用websockets
           //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样客户端端和服务端进行数据的交互就不会有跨域问题
           changOrigin: true,