fix: 打印物流面单优化

src/api/common.ts

@@ -34,14 +34,14 @@ export function uploadFileApi(data: FormData) {
   )
   )
 }
 }
 
 
-// 获取物流面单 US
+// 打印物流面单 US
 export function getLogisticUSApi(content: string) {
 export function getLogisticUSApi(content: string) {
   return axios.get<never, BaseRespData<{ documentUrl: string }>>(
   return axios.get<never, BaseRespData<{ documentUrl: string }>>(
     `factory/podJomallOrderUs/getDocument?content=${content}`,
     `factory/podJomallOrderUs/getDocument?content=${content}`,
   )
   )
 }
 }
 
 
-// 获取物流面单 CN
+// 打印物流面单 CN
 export function getLogisticCNApi(content: string) {
 export function getLogisticCNApi(content: string) {
   return axios.get<never, BaseRespData<{ documentUrl: string }>>(
   return axios.get<never, BaseRespData<{ documentUrl: string }>>(
     `factory/podJomallOrder/getDocument?content=${content}`,
     `factory/podJomallOrder/getDocument?content=${content}`,

src/components/NavMenu.vue

@@ -117,11 +117,11 @@
         <img src="../assets/images/brush-no.png" width="24" height="24" />
         <img src="../assets/images/brush-no.png" width="24" height="24" />
       </div>
       </div>
       <div
       <div
-        title="获取物流面单"
+        title="打印物流面单"
         class="tool-item"
         class="tool-item"
         @click="getLogisticDrawer = true"
         @click="getLogisticDrawer = true"
       >
       >
-        <img src="../assets/images/package.png" width="24" height="24" />
+        <img src="../assets/images/printer.png" width="24" height="24" />
       </div>
       </div>
     </div>
     </div>
   </div>
   </div>
@@ -206,17 +206,31 @@
     </el-drawer>
     </el-drawer>
     <el-drawer
     <el-drawer
       v-model="getLogisticDrawer"
       v-model="getLogisticDrawer"
+      direction="btt"
       class="get-logistic-drawer"
       class="get-logistic-drawer"
-      title="获取物流面单"
+      title="打印物流面单"
       @close="content = ''"
       @close="content = ''"
     >
     >
-      <el-input v-model="content" placeholder="请输入单号" clearable />
-      <template #footer>
-        <span style="display: flex; justify-content: center">
-          <el-button @click="getLogisticDrawer = false"> 取 消 </el-button>
-          <el-button type="primary" @click="getLogistic">查 询</el-button>
-        </span>
-      </template>
+      <ElSelect
+        v-model="sheetPrinter"
+        placeholder="请选择打印机"
+        @change="handlePrinterChange"
+        style="width: 200px; margin-right: 10px"
+      >
+        <ElOption
+          v-for="item in printDeviceList"
+          :key="item"
+          :label="item"
+          :value="item"
+        />
+      </ElSelect>
+      <el-input
+        v-model="content"
+        placeholder="请输入单号"
+        style="width: 300px; margin-right: 10px"
+        clearable
+      />
+      <el-button type="primary" @click="getLogistic">查 询</el-button>
     </el-drawer>
     </el-drawer>
   </span>
   </span>
 </template>
 </template>
@@ -240,8 +254,11 @@ import {
 import { useRoute, useRouter } from 'vue-router'
 import { useRoute, useRouter } from 'vue-router'
 import Menu from '@/router/menu'
 import Menu from '@/router/menu'
 import userUserStore from '@/store/user'
 import userUserStore from '@/store/user'
+
 import type { FormRules } from 'element-plus'
 import type { FormRules } from 'element-plus'
 import { useValue } from '@/utils/hooks/useValue'
 import { useValue } from '@/utils/hooks/useValue'
+import useLodop from '@/utils/hooks/useLodop'
+
 import { changePasswordApi } from '@/api/auth'
 import { changePasswordApi } from '@/api/auth'
 import { getLogisticUSApi, getLogisticCNApi } from '@/api/common'
 import { getLogisticUSApi, getLogisticCNApi } from '@/api/common'
 import { filePath, FileCnPath } from '@/api/axios'
 import { filePath, FileCnPath } from '@/api/axios'
@@ -272,6 +289,9 @@ const userInfo = userStore.user
 const dialogVisible = ref(false)
 const dialogVisible = ref(false)
 const formatDrawer = ref(false)
 const formatDrawer = ref(false)
 const getLogisticDrawer = ref(false)
 const getLogisticDrawer = ref(false)
+
+const printDeviceList = ref<string[]>([])
+const sheetPrinter = ref('')
 const textareaT = ref('')
 const textareaT = ref('')
 const newTextareaT = ref('')
 const newTextareaT = ref('')
 const content = ref('')
 const content = ref('')
@@ -504,7 +524,31 @@ const copy = () => {
   })
   })
 }
 }
 
 
-// 获取物流面单
+const { getCLodop } = useLodop()
+
+const initPrintDevice = () => {
+  const lodop = getCLodop(null, null)
+  if (!lodop) return
+  const arr = []
+  // 获取打印机数量
+  const length = lodop.GET_PRINTER_COUNT()
+  for (let i = 0; i < length; i++) {
+    // 根据设备序号获取设备名
+    const name = lodop.GET_PRINTER_NAME(i)
+    arr.push(name)
+  }
+  // 获取默认打印机
+  sheetPrinter.value = lodop.GET_PRINTER_NAME(0)
+  printDeviceList.value = arr
+}
+
+// 处理打印机选择变化，保存到 localStorage
+const handlePrinterChange = (value: string) => {
+  sheetPrinter.value = value
+  localStorage.setItem('sheetPrinter', JSON.stringify(value))
+}
+
+// 打印物流面单
 const getLogistic = () => {
 const getLogistic = () => {
   if (!content.value) {
   if (!content.value) {
     ElMessage.warning('请输入单号')
     ElMessage.warning('请输入单号')
@@ -547,6 +591,24 @@ watch(
   { immediate: true },
   { immediate: true },
 )
 )
 
 
+watch(getLogisticDrawer, async (value: boolean) => {
+  if (value) {
+    initPrintDevice()
+    const locaclPrinter = localStorage.getItem('sheetPrinter')
+    if (locaclPrinter) {
+      const savedPrinter = JSON.parse(locaclPrinter)
+      // 检查保存的打印机是否在当前打印机列表中
+      if (printDeviceList.value.includes(savedPrinter)) {
+        sheetPrinter.value = savedPrinter
+      } else {
+        // 如果保存的打印机不在当前列表中，清空 localStorage 并设置为空
+        localStorage.removeItem('sheetPrinter')
+        sheetPrinter.value = ''
+      }
+    }
+  }
+})
+
 // 点击标签时切换路由
 // 点击标签时切换路由
 watch(activeTab, (newTab) => {
 watch(activeTab, (newTab) => {
   if (newTab) {
   if (newTab) {
@@ -700,9 +762,11 @@ onUnmounted(() => {
   top: calc(50% - 325px) !important;
   top: calc(50% - 325px) !important;
 }
 }
 
 
-::v-deep(.get-logistic-drawer.el-drawer.rtl) {
-  height: 200px !important;
-  top: calc(50% - 100px) !important;
+::v-deep(.get-logistic-drawer.el-drawer.btt) {
+  height: 120px !important;
+  width: 700px !important;
+  top: calc(50% - 60px) !important;
+  left: calc(50% - 350px) !important;
 }
 }
 
 
 .tool-item {
 .tool-item {