fix: 修改打印组件和系统端口

.env

@@ -1,5 +1,5 @@
 # port
-VITE_PORT = 3200
+VITE_PORT = 3100
 
 # spa-title
 VITE_GLOB_APP_TITLE = 后台管理系统

src/views/infra/print/index.vue

@@ -16,7 +16,7 @@
               </template>
               <a-popover v-model="paperPopVisible" title="设置纸张宽高(mm)" trigger="click">
                 <template #content>
-                  <a-input-group compact style="margin: 10px 10px">
+                  <a-input-group compact style="margin: 10px">
                     <a-input
                       type="number"
                       v-model="paperWidth"
@@ -28,7 +28,7 @@
                         width: 30px;
                         border-left: 0;
                         pointer-events: none;
-                        backgroundcolor: #fff;
+                        background-color: #fff;
                       "
                       placeholder="~"
                       disabled
@@ -70,7 +70,7 @@
                 </a-tooltip>
               </a-input-group>
             </div>
-            <div class="mt-2 flex justify-between">
+            <div class="flex justify-between mt-2">
               <a-button type="primary" @click="rotatePaper()">旋转</a-button>
               <!-- <a-button type="primary" icon="eye" @click="preView"> 预览 </a-button> -->
               <a-button type="primary" @click="print"> 打印 </a-button>
@@ -86,15 +86,16 @@
             </div>
             <div class="mt-2">
               <div>
-                <div class="title">provider1 默认样式</div>
+                <!-- <div class="title">provider1 默认样式</div> -->
                 <!-- provider1 的容器; 加上 class "rect-printElement-types" 使用默认样式 -->
                 <!-- 当然可以 重写 或者 自定义样式 -->
-                <div id="provider-container1" class="rect-printElement-types clear-both" />
+                <div id="provider-container1" class="clear-both rect-printElement-types" />
               </div>
               <div class="mt-2">
-                <div class="title">provider2 自定义样式</div>
+                <!-- <div class="title">provider2 自定义样式</div> -->
+                <div class="title">样式</div>
                 <!-- provider2 的容器; -->
-                <div id="provider-container2" class="rect-printElement-types clear-both" />
+                <div id="provider-container2" class="clear-both rect-printElement-types" />
               </div>
             </div>
           </a-card>
@@ -121,7 +122,7 @@
   import { disAutoConnect, hiprint } from 'vue-plugin-hiprint';
   import { Card, Row, Col } from 'ant-design-vue';
   import { ZoomInOutlined, ZoomOutOutlined } from '@ant-design/icons-vue';
-  import { provider1 } from './provider1';
+  // import { provider1 } from './provider1';
   import { provider2 } from './provider2';
   import template from './template';
   import printData from './printData';
@@ -134,13 +135,13 @@
   const TEMPLATE_KEY = getCurrentInstance().type.name; // 存储模板对象的 key
   console.log('🚀 ~ file: index.vue:110 ~ getCurrentInstance:', getCurrentInstance());
   const {
-    curPaper,
+    // curPaper,
     paperTypes,
     curPaperType,
     paperPopVisible,
     paperWidth,
     paperHeight,
-    showPaperPop,
+    // showPaperPop,
     setPaper,
     setPaperOther,
     scaleMin,
@@ -150,7 +151,8 @@
 
   // 初始化 provider
   hiprint.init({
-    providers: [provider1(), provider2()],
+    // providers: [provider1(), provider2()],
+    providers: [provider2()],
   });
 
   onMounted(() => {
@@ -238,11 +240,11 @@
    * 导出模板 json
    * 必须确保 hiprintTemplate 已成功创建
    */
-  const exportJson = () => {
-    const json = hiprintTemplate.getJson();
-    console.log(json);
-    alert('导出成功! 请查看控制台输出');
-  };
+  // const exportJson = () => {
+  //   const json = hiprintTemplate.getJson();
+  //   console.log(json);
+  //   alert('导出成功! 请查看控制台输出');
+  // };
   /**
    * 导出模板 json tid
    * 仅导出 options, 不导出 printElementType
@@ -277,10 +279,12 @@
     white-space: nowrap;
     text-overflow: ellipsis;
   }
+
   ::v-deep(.rect-printElement-types .hiprint-printElement-type > li > ul > li) {
     width: 33.333% !important;
     float: none;
   }
+
   ::v-deep(.rect-printElement-types .hiprint-printElement-type > li > ul) {
     display: flex;
     list-style: none;
@@ -299,6 +303,7 @@
     overflow-x: auto;
     overflow-y: auto;
   }
+
   .title {
     font-size: 16px;
     margin: 10px 10px 10px 0;