打印页面更新

src/common/X6.js

@@ -44,11 +44,10 @@ export default function CreateJPEG(dom) {
       },
     },
   );
-  return async function (json, tempStr) {
-    let tempObj = JSON.parse(tempStr);
-    
+  return async function (json, tempStr,assetNo) {
+    let test = JSON.parse(tempStr);
+    let tempObj = JSON.parse(test);
     for (const key in json) {
-      // console.log(json[key]);
       for (let index = 0; index < tempObj.cells.length; index++) {
 
         if (tempObj.cells[index].data.type == key) {
@@ -67,19 +66,47 @@ export default function CreateJPEG(dom) {
         graph.toJPEG(dataUri => {
           // dataUri就是base64的图片地址
           res(dataUri);
-          // console.log(dataUri);
-          // 'tempObj.jpeg' 就是图片名称
-          // DataUri.downloadDataUri(dataUri, 'tempObj.jpeg')
+          DataUri.downloadDataUri(dataUri, assetNo);
         }, {
           serializeImages: true,
           quality: 1,
         });
-      },500);
+      }, 500);
     });
 
 
   };
+}
+export const base64toFile = (url, imageName) => {
+  const arr = url.split(',');
+  const mime = arr[0].match(/.*?:(.*?);/)[1];
+  const suffix = mime.split('/')[1];
+  const bstr = window.atob(arr[1]);
+  let n = bstr.length;
+  const u8arr = new Uint8Array(n);
+  while (n--) {
+    u8arr[n] = bstr.charCodeAt(n);
+  }
+  return new File([u8arr], `${imageName}.${suffix}`, {
+    type: 'image/jpeg',
+  });
+};
 
-
-
-}
+export const downloadImages = (imageUrl, name) => {
+  const image = new Image();
+  image.setAttribute('crossOrigin', 'anonymous');
+  image.onload = function () {
+    const canvas = document.createElement('canvas');
+    canvas.width = image.width;
+    canvas.height = image.height;
+    const context = canvas.getContext('2d');
+    context.drawImage(image, 0, 0, image.width, image.height);
+    const url = canvas.toDataURL('image/png');
+    const a = document.createElement('a');
+    const event = new MouseEvent('click');
+    a.download = name;
+    a.href = url;
+    a.dispatchEvent(event);
+  };
+  image.src = imageUrl;
+};

src/common/image-src.js

@@ -2,18 +2,20 @@
 // 获取图片路径
 export function getImageSrc(className, imageName) {
   var protocol = window.location.protocol;
-  console.log('protocol:' + protocol);
+  // console.log('protocol:' + protocol);
   var host = window.location.host;
-  console.log('host:' + host);
-  var localhostPaht = protocol + '//' + host;
+  // console.log('host:' + host);
+  var localhostPath = protocol + '//' + host ||  'http://192.168.1.105:10022';
+
+  // var localhostPath = 'http://192.168.1.105:10022';
   var accountId = localStorage.getItem('#accountId');
   if (imageName == null) {
     return null;
   }
   if (imageName != null && imageName[0] == '/') {
-    return localhostPaht + '/Files/' + accountId + '/Images/' + className + imageName;
+    return localhostPath + '/Files/' + accountId + '/Images/' + className + imageName;
   } else {
-    return localhostPaht + '/Files/' + accountId + '/Images/' + className + '/' + imageName;
+    return localhostPath + '/Files/' + accountId + '/Images/' + className + '/' + imageName;
   }
 }
   
@@ -21,20 +23,20 @@ export function getImageSrc(className, imageName) {
 // 获取略缩图图片路径
 export function getThumbnailImageSrc(className, imageName) {
   var protocol = window.location.protocol;
-  console.log('protocol:' + protocol);
+  // console.log('protocol:' + protocol);
   var host = window.location.host;
-  console.log('host:' + host);
-  var localhostPaht = protocol + '//' + host;
+  // console.log('host:' + host);
+  var localhostPath = protocol + '//' + host;
   //测试用
-  //var localhostPaht = 'http://127.0.0.1:83';
-  console.log('localhostPaht:' + localhostPaht);
+  //var localhostPath = 'http://127.0.0.1:83';
+  console.log('localhostPath:' + localhostPath);
   var accountId = localStorage.getItem('#accountId');
   if (imageName == null) {
     return null;
   }
   if (imageName != null && imageName[0] == '/') {
-    return localhostPaht + '/Files/' + accountId + '/Images/' + className + '/thumbnail' + imageName;
+    return localhostPath + '/Files/' + accountId + '/Images/' + className + '/thumbnail' + imageName;
   } else {
-    return localhostPaht + '/Files/' + accountId + '/Images/' + className + '/thumbnail/' + imageName;
+    return localhostPath + '/Files/' + accountId + '/Images/' + className + '/thumbnail/' + imageName;
   }
 }

src/print/CommonTable.vue

@@ -12,7 +12,15 @@
         :scroll="{ y: 360 }"
         :pagination="pagination"
         :row-key="(record) => record.id"
-        :row-selection="isSelect ? rowSelection : null"
+        :row-selection="
+          isSelect
+            ? {
+              selectedRowKeys: state.selectedRowKeys,
+              onSelect: selectEvent,
+              onSelectAll: selectAllEvent,
+            }
+            : null
+        "
         :row-class-name="
           (_record, index) => (index % 2 === 1 ? 'table-striped' : null)
         "
@@ -38,6 +46,7 @@ import {
   defineEmits,
   watch,
   onMounted,
+  defineExpose,
 } from 'vue';
 import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN';
 const locale = ref(zhCN);
@@ -62,13 +71,19 @@ const props = defineProps({
   },
 });
 
+//  选择数据
+const state = reactive({
+  selectedRows: [],
+  selectedRowKeys: [],
+});
+
 // 分页配置
 const pagination = reactive({
   showQuickJumper: true,
   current: 1,
   pageSize: 20, // 默认每页显示数量
   showSizeChanger: true, // 显示可改变每页数量
-  pageSizeOptions: ['3', '5', '7', '9', '11', '500'], // 每页数量选项值
+  pageSizeOptions: ['20', '50', '100', '200', '300', '500'], // 每页数量选项值
   showTotal: (total, range) =>
     range[0] + '-' + range[1] + '条' + ' 共' + total + '条', // 显示总数
   onShowSizeChange: (current, pageSize) => showSizeChange(current, pageSize),
@@ -92,44 +107,52 @@ const changePage = (current, size) => {
   emit('pageParams', pagination.current, size);
 };
 
-const state = reactive({
-  selectedRows: [],
-  selectedRowKeys: [],
-});
-const rowSelection = reactive({
-  selectedRowKeys: state.selectedRowKeys,
-  // preserveSelectedRowKeys: true,
-  onSelect: (record, selected, selectedRows, nativeEvent) => {
-    if (selected) {
-      state.selectedRows.push(record);
-      state.selectedRowKeys.push(record.id);
-    } else {
-      let index = state.selectedRowKeys.indexOf(record.id);
+// 选择每一项操作
+const selectEvent = (record, selected, selectedRows) => {
+  if (selected) {
+    state.selectedRows.push(record);
+    state.selectedRowKeys.push(record.id);
+  } else {
+    let index = state.selectedRowKeys.indexOf(record.id);
+    if (index >= 0) {
+      state.selectedRows.splice(index, 1);
+      state.selectedRowKeys.splice(index, 1);
+    }
+  }
+  emit('selectColumn', state.selectedRows);
+};
+
+// 全选按钮操作
+const selectAllEvent = (selected, selectedRows, changeRows) => {
+  if (selected) {
+    state.selectedRows = state.selectedRows.concat(changeRows);
+    state.selectedRows.forEach(item => {
+      state.selectedRowKeys.push(item.id);
+    });
+  } else {
+    changeRows.forEach(item => {
+      state.selectedRows.forEach(row => {
+        if (item.id == row.id) {
+          state.selectedRows.splice(0, 1);
+        }
+      });
+      let index = state.selectedRowKeys.indexOf(item.id);
       if (index >= 0) {
         state.selectedRows.splice(index, 1);
         state.selectedRowKeys.splice(index, 1);
       }
-    }
-    emit('selectColumn', state.selectedRows);
-  },
-  onSelectAll: (selected, selectedRows, changeRows) => {
-    if (selected) {
-      state.selectedRows = state.selectedRows.concat(changeRows);
-      state.selectedRows.forEach(item => {
-        state.selectedRowKeys.push(item.id);
-      });
-    } else {
-      changeRows.forEach(item => {
-        let index = state.selectedRowKeys.indexOf(item.id);
-        if (index >= 0) {
-          state.selectedRows.splice(index, 1);
-          state.selectedRowKeys.splice(index, 1);
-        }
-      });
-    }
-    emit('selectColumn', state.selectedRows);
-  },
-});
+    });
+  }
+  emit('selectColumn', state.selectedRows);
+};
+
+// 清空选择
+const clear = () => {
+  state.selectedRowKeys = [];
+  state.selectedRows = [];
+  emit('selectColumn', state.selectedRows);
+};
+defineExpose({ clear });
 
 // 监听total变化
 watch(

src/print/PrintCard.vue

@@ -1,197 +1,224 @@
 <template>
-  <Navbar title="卡片打印" :is-go-back="true" />
-  <div class="printDiv">
-    <div>
-      <span style="color: red"> * </span>
-      <label>导入批次：</label>
-      <a-select
-        v-model:value="queryParams.batchNo"
-        show-search
-        class="commonStyle"
-        :options="batchNos.map((item) => ({ value: item.label }))"
-        @change="searchPrintInfo"
-      />
-      <label>保管人员：</label>
-      <a-select
-        v-model:value="queryParams.depositoryUser"
-        show-search
-        class="commonStyle"
-        :options="depositoryUsers.map((item) => ({ value: item.label }))"
-        @change="searchPrintInfo"
-      />
-      <label>打印状态：</label>
-      <a-select
-        v-model:value="status"
-        show-search
-        class="commonStyle"
-        :options="
-          statusOptions.map((item) => ({
-            value: `${item.value}-${item.label}`,
-            label: item.label,
-          }))
-        "
-        @change="searchPrintInfo"
-      />
-    </div>
-    <div style="margin: 8px 0 0 9px">
-      <label>公司名称：</label>
-      <a-select
-        v-model:value="queryParams.clientName"
-        show-search
-        class="commonStyle"
-        :options="clientNames.map((item) => ({ value: item.label }))"
-        @change="searchPrintInfo"
-      />
-      <label>所属部门：</label>
-      <a-select
-        v-model:value="queryParams.organizationName"
-        show-search
-        class="commonStyle"
-        :options="organizationNames.map((item) => ({ value: item.label }))"
-        @change="searchPrintInfo"
-      />
-      <label>成本中心：</label>
-      <a-select
-        v-model:value="queryParams.costCenterName"
-        show-search
-        class="commonStyle"
-        :options="costCenterNames.map((item) => ({ value: item.label }))"
-        @change="searchPrintInfo"
-      />
-      <a-button type="primary" @click="searchPrintInfo">查询</a-button>
-    </div>
-    <div style="margin: 8px 0 0 9px">
-      <label>打印模板：</label>
-      <a-select
-        v-model:value="printTemplate"
-        show-search
-        class="commonStyle"
-        :options="
-          templateNames.map((item) => ({
-            value: `${item.id}-${item.name}`,
-            label: item.name,
-          }))
-        "
-      />
-      <a-button
-        type="dashed"
-        style="margin-right: 16px"
-        @click="imageVisible = true"
-      >
-        打印预览
-      </a-button>
-      <a-button type="dashed" style="margin-right: 16px" @click="showPrintInfo">
-        打印
-      </a-button>
-    </div>
-    <a-divider />
-    <CommonTable
-      :total="total"
-      :columns="columns"
-      :is-loading="isLoading"
-      :is-select="isSelect"
-      :data-source="dataSource"
-      @select-column="selectColumn"
-      @page-params="getPageParams"
-    >
-      <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'imageUrl'">
-          <a-image :width="100" :height="50" :src="record.imageUrl" />
-        </template>
-      </template>
-    </CommonTable>
-    <a-modal
-      v-model:visible="printVisible"
-      title="包装信息"
-      ok-text="确认"
-      cancel-text="取消"
-      @ok="printCard"
-    >
-      <label>包装批号：</label>
-      <a-input
-        id="displayName"
-        v-model:value="packageBatchNo"
-        :disabled="true"
-      />
-      <label>上次的批号：</label>
-      <a-input
-        id="displayName"
-        v-model:value="lastPackageBatchNo"
-        :disabled="true"
-      />
-      <label>包装名称：</label>
-      <a-input id="displayName" v-model:value="packageName" :disabled="true" />
-      <label>上次的名称：</label>
-      <a-input
-        id="displayName"
-        v-model:value="lastPackageName"
-        :disabled="true"
-      />
-      <div class="operationBtn">
-        <a-button type="dashed" style="width: 240px" @click="lastTime">
-          同上一次
-        </a-button>
-        <a-button
-          type="dashed"
-          style="width: 240px; margin-left: 4px"
-          @click="createNew"
+  <div>
+    <div v-show="printing">
+      <Navbar title="卡片打印" :is-go-back="true" />
+      <div class="printDiv">
+        <div>
+          <span style="color: red"> * </span>
+          <label>导入批次：</label>
+          <a-select
+            v-model:value="queryParams.batchNo"
+            show-search
+            class="commonStyle"
+            :options="batchNos.map((item) => ({ value: item.label }))"
+            @change="searchPrintInfo"
+          />
+          <label>保管人员：</label>
+          <a-select
+            v-model:value="queryParams.depositoryUser"
+            show-search
+            class="commonStyle"
+            :options="depositoryUsers.map((item) => ({ value: item.label }))"
+            @change="searchPrintInfo"
+          />
+          <label>打印状态：</label>
+          <a-select
+            v-model:value="status"
+            show-search
+            class="commonStyle"
+            :options="
+              statusOptions.map((item) => ({
+                value: `${item.value}-${item.label}`,
+                label: item.label,
+              }))
+            "
+            @change="searchPrintInfo"
+          />
+        </div>
+        <div style="margin: 8px 0 0 9px">
+          <label>公司名称：</label>
+          <a-select
+            v-model:value="queryParams.clientName"
+            show-search
+            class="commonStyle"
+            :options="clientNames.map((item) => ({ value: item.label }))"
+            @change="searchPrintInfo"
+          />
+          <label>所属部门：</label>
+          <a-select
+            v-model:value="queryParams.organizationName"
+            show-search
+            class="commonStyle"
+            :options="organizationNames.map((item) => ({ value: item.label }))"
+            @change="searchPrintInfo"
+          />
+          <label>成本中心：</label>
+          <a-select
+            v-model:value="queryParams.costCenterName"
+            show-search
+            class="commonStyle"
+            :options="costCenterNames.map((item) => ({ value: item.label }))"
+            @change="searchPrintInfo"
+          />
+          <a-button type="primary" @click="searchPrintInfo">查询</a-button>
+        </div>
+        <div style="margin: 8px 0 0 9px">
+          <label>打印模板：</label>
+          <a-select
+            v-model:value="printTemplate"
+            show-search
+            class="commonStyle"
+            :options="
+              templateNames.map((item) => ({
+                value: `${item.id}-${item.name}`,
+                label: item.name,
+              }))
+            "
+            @change="getTemplateInfo"
+          />
+          <a-button
+            type="dashed"
+            style="margin-right: 16px"
+            @click="printPreview"
+          >
+            打印预览
+          </a-button>
+          <a-button
+            type="dashed"
+            style="margin-right: 16px"
+            @click="showPrintInfo"
+          >
+            打印
+          </a-button>
+          <a-button type="dashed" @click="downloadImage"> 下载全部 </a-button>
+        </div>
+        <a-divider />
+        <CommonTable
+          ref="tables"
+          :total="total"
+          :columns="columns"
+          :is-loading="isLoading"
+          :is-select="isSelect"
+          :data-source="dataSource"
+          @select-column="selectColumn"
+          @page-params="getPageParams"
         >
-          生成新的
-        </a-button>
-      </div>
-    </a-modal>
-    <a-modal
-      v-model:visible="imageVisible"
-      title="打印预览"
-      ok-text="确认"
-      cancel-text="取消"
-      :body-style="bodyStyle"
-      @ok="imageVisible = false"
-    >
-      <a-image
-        :preview="{ visible: false }"
-        :width="200"
-        class="image"
-        :src="imageUrls[0]"
-        @click="visible = true"
-      />
-      <div style="display: none">
-        <a-image-preview-group
-          :preview="{ visible, onVisibleChange: (vis) => (visible = vis) }"
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'imageUrl'">
+              <a-image
+                :width="100"
+                :height="50"
+                :src="getImageSrc(className, record.imageUrl)"
+              />
+            </template>
+          </template>
+        </CommonTable>
+        <a-modal
+          v-model:visible="printVisible"
+          title="包装信息"
+          ok-text="确认"
+          cancel-text="取消"
+          @ok="printCard"
         >
-          <a-image v-for="item in imageUrls" :key="item" :src="item" />
-        </a-image-preview-group>
+          <label>包装批号：</label>
+          <a-input
+            id="displayName"
+            v-model:value="packageBatchNo"
+            :disabled="true"
+          />
+          <label>上次的批号：</label>
+          <a-input
+            id="displayName"
+            v-model:value="lastPackageBatchNo"
+            :disabled="true"
+          />
+          <label>包装名称：</label>
+          <a-input
+            id="displayName"
+            v-model:value="packageName"
+            :disabled="true"
+          />
+          <label>上次的名称：</label>
+          <a-input
+            id="displayName"
+            v-model:value="lastPackageName"
+            :disabled="true"
+          />
+          <div class="operationBtn">
+            <a-button type="dashed" style="width: 240px" @click="lastTime">
+              同上一次
+            </a-button>
+            <a-button
+              type="dashed"
+              style="width: 240px; margin-left: 4px"
+              @click="createNew"
+            >
+              生成新的
+            </a-button>
+          </div>
+        </a-modal>
+        <a-modal
+          v-model:visible="imageVisible"
+          title="打印预览"
+          ok-text="确认"
+          cancel-text="取消"
+          :body-style="bodyStyle"
+          @ok="imageVisible = false"
+        >
+          <a-image
+            :preview="{ visible: false }"
+            :width="200"
+            class="image"
+            :src="imageUrls[0]"
+            @click="visible = true"
+          />
+          <div style="display: none">
+            <a-image-preview-group
+              :preview="{ visible, onVisibleChange: (vis) => (visible = vis) }"
+            >
+              <a-image v-for="item in imageUrls" :key="item" :src="item" />
+            </a-image-preview-group>
+          </div>
+          <template #footer />
+        </a-modal>
+        <Loading v-if="globalLoading" />
       </div>
-    </a-modal>
+    </div>
     <div ref="hua" style="float: left; z-index: -999" />
-    <Loading v-if="globalLoading" />
+    <a-modal v-model:visible="modelVisible" title="正在打印中">
+      <p>正在打印中，请稍等....</p>
+      <template #footer />
+    </a-modal>
   </div>
 </template>
 
 <script setup>
+import AuthImage from '../widget/AuthImage.vue';
 import CommonTable from './CommonTable.vue';
 import Common from '../common/Common';
 import { message } from 'ant-design-vue';
-import { ref, reactive, onMounted } from 'vue';
+import { ref, reactive, onMounted, watch } from 'vue';
+import CreateJPEG from '../common/X6';
+import { base64toFile, downloadImages } from '../common/X6';
+import { SqlApi, Notify } from 'pc-component-v3';
+import { getImageSrc } from '../common/image-src';
+import Download from '../resource/file/DownloadService';
 import {
   columns,
   dateConvert,
   multipleImageUpload,
   getTemplate,
 } from './config';
-import CreateJPEG from '../common/X6';
-import { SqlApi, Notify } from 'pc-component-v3';
-import { getImageSrc } from '../common/image-src';
 
-const imageUrls = reactive([
-  'https://gw.alipayobjects.com/zos/antfincdn/LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp',
-  'https://gw.alipayobjects.com/zos/antfincdn/cV16ZqzMjW/photo-1473091540282-9b846e7965e3.webp',
-  'https://gw.alipayobjects.com/zos/antfincdn/x43I27A55%26/photo-1438109491414-7198515b166b.webp',
-]);
+const className = ref('com.leanwo.prodog.print.model.LabelPrintLine');
+const tables = ref(null);
+const imageUrls = reactive([]);
+const modelVisible = ref(false);
+const printing = ref(true);
 const total = ref(0);
 const isSelect = ref(true);
 const isLoading = ref(false);
-const selectedRows = ref([]);
+const select = reactive({ selectedRows: [] });
 const dataSource = ref([]);
 const printVisible = ref(false);
 const imageVisible = ref(false);
@@ -239,7 +266,7 @@ const pager = reactive({
 });
 const templateId = ref('');
 const allTemplate = ref([]);
-const templateData = ref([]);
+const templateData = ref(null);
 const lastBatchNo = ref('');
 const printTemplate = ref('');
 const templateNames = ref([]);
@@ -249,7 +276,7 @@ const packageName = ref('');
 const lastPackageName = ref('');
 const newPackageName = ref('');
 const hua = ref(null);
-let getImageData;
+let getBase64;
 // 获取分页
 const getPageParams = (start, length) => {
   pager.start = (start - 1) * length;
@@ -272,9 +299,6 @@ const searchPrintInfo = () => {
         const { lines, errorMessage, errorCode } = successData;
         if (errorCode == 0) {
           total.value = successData.total;
-          lines.forEach(item => {
-            item.key = item.id;
-          });
           dataSource.value = lines;
           isLoading.value = false;
         } else {
@@ -300,8 +324,8 @@ const searchPrintInfo = () => {
 };
 // 获取所选项的数据
 const selectColumn = rows => {
-  selectedRows.value = rows;
-  console.log('onSelectChange', selectedRows.value);
+  select.selectedRows = rows;
+  console.log('onSelectChange', select.selectedRows);
 };
 // 展开打印框
 const showPrintInfo = () => {
@@ -330,57 +354,56 @@ const lastTime = () => {
   }
 };
 
-// const base64toFile = (url, imageName) => {
-//   const arr = url.split(',');
-//   const mime = arr[0].match(/.*?:(.*?);/)[1];
-//   const suffix = mime.split('/')[1];
-//   const bstr = window.atob(arr[1]);
-//   let n = bstr.length;
-//   const u8arr = new Uint8Array(n);
-//   while (n--) {
-//     u8arr[n] = bstr.charCodeAt(n);
-//   }
-//   return new File([u8arr], `${imageName}.${suffix}`, {
-//     type: 'multipart/form-data',
-//   });
-// };
-
 // 生产新的包装信息
 const createNew = () => {
   packageBatchNo.value = dateConvert(new Date());
   packageName.value = newPackageName.value;
 };
 
-// 确认打印
-const printCard = () => {
-  globalLoading.value = true;
-  const formData = new FormData();
+// 获取模板数据及 ID
+const getTemplateInfo = async () => {
   templateId.value = printTemplate.value.slice(
     0,
     printTemplate.value.indexOf('-'),
   );
   allTemplate.value.forEach(item => {
     if (item.id == templateId.value) {
-      templateData.value = JSON.stringify(item.contentX6);
+      templateData.value = item.contentX6;
     }
   });
+};
 
-  selectedRows.value.forEach(async item => {
-    item.number = item.assetNo;
-    item.name = item.assetName;
-    item.unit = item.depositoryUser;
-    item.keeper = item.organizationName;
-    item.EPC = item.depositoryUser;
-    item.BarCode =
-      'https://rfid.fa.sjtu.edu.cn/c/5C5CFA24F72542B8910F247BA014DDBB';
-    let base64 = await getImageData(item, templateData.value);
-    console.log('图片base64：',base64);
-  });
+// 打印预览
+const printPreview = async () => {
+  imageVisible.value = true;
+  printing.value = false;
+  imageUrls.length = 0;
+  let tempStr = JSON.stringify(templateData.value);
+  const rows = JSON.parse(JSON.stringify(select.selectedRows));
+  for (let key in rows) {
+    let base64 = await getBase64(rows[key], tempStr);
+    imageUrls.push(base64);
+  }
+  printing.value = true;
+};
 
+// 确认打印
+const printCard = async () => {
+  printVisible.value = false;
+  modelVisible.value = true;
+  printing.value = false;
+  const formData = new FormData();
   formData.append('customerPrintTemplateId', templateId.value);
   formData.append('packageBatchNo', packageBatchNo.value);
   formData.append('packageName', packageName.value);
-  // formData.append('file', file);
+
+  let tempStr = JSON.stringify(templateData.value);
+  const rows = JSON.parse(JSON.stringify(select.selectedRows));
+  for (let key in rows) {
+    let base64 = await getBase64(rows[key], tempStr,rows[key].assetNo);
+    let file = base64toFile(base64, rows[key].id);
+    formData.append('file', file);
+  }
 
   multipleImageUpload(formData).then(
     successData => {
@@ -389,21 +412,82 @@ const printCard = () => {
       } else {
         message.error('资产生产图片失败');
       }
-      globalLoading.value = false;
-      printVisible.value = false;
+      modelVisible.value = false;
+      printing.value = true;
       searchPrintInfo();
+      clearSelect();
     },
     errorData => {
       Common.processException(errorData);
-      globalLoading.value = false;
-      printVisible.value = false;
+      modelVisible.value = false;
+      printing.value = true;
+      clearSelect();
     },
   );
 };
 
+const downloadImage = () => {
+  globalLoading.value = true;
+  if (status.value !== undefined) {
+    queryParams.labelPrintType = status.value.slice(
+      0,
+      status.value.indexOf('-'),
+    );
+  }
+  pager.start = 0;
+  pager.length = 10000;
+  let params = { ...queryParams, ...pager };
+  if (queryParams.batchNo !== '') {
+    SqlApi.execute('20230613_140456', params).then(
+      successData => {
+        const { lines, errorMessage, errorCode } = successData;
+        if (errorCode == 0) {
+          total.value = successData.total;
+          console.log(lines,'-----------------');
+          lines.forEach(item => {
+            let url = getImageSrc(className.value, item.imageUrl);
+            downloadImages(url, item.id);
+          });
+          globalLoading.value = false;
+        } else {
+          Notify.error('查询异常', errorMessage, true);
+        }
+        globalLoading.value = false;
+      },
+      errorData => {
+        Common.processException(errorData);
+        globalLoading.value = false;
+      },
+    );
+  } else {
+    message.error('请选择导入批次');
+    status.value = '';
+    dataSource.value = [];
+    queryParams.clientName = '';
+    queryParams.costCenterName = '';
+    queryParams.depositoryUser = '';
+    queryParams.organizationName = '';
+    globalLoading.value = false;
+  }
+};
+
+// 打印后清除所有选择
+const clearSelect = () => {
+  tables.value.clear();
+};
+
+// 监听当批次切换后清空选择
+watch(
+  () => queryParams.batchNo,
+  (newVal, oldVal) => {
+    if (newVal !== oldVal) {
+      tables.value.clear();
+    }
+  },
+);
 onMounted(() => {
   init();
-  getImageData = CreateJPEG(hua.value);
+  getBase64 = CreateJPEG(hua.value);
 });
 
 // 封装通用sqlApi请求函数
@@ -431,7 +515,6 @@ const commonSqlApi = (url, data) => {
 const init = () => {
   getTemplate().then(res => {
     allTemplate.value = res.datas;
-    console.log(res);
   });
   commonSqlApi('20230613_192444', depositoryUsers); // 查询保管人
   commonSqlApi('20230613_193808', clientNames); // 查询公司
@@ -507,4 +590,18 @@ const init = () => {
   background: white;
   color: black;
 }
+.full-modal .ant-modal {
+  max-width: 100%;
+  top: 0;
+  padding-bottom: 0;
+  margin: 0;
+}
+.full-modal .ant-modal-content {
+  display: flex;
+  flex-direction: column;
+  height: calc(100vh);
+}
+.full-modal .ant-modal-body {
+  flex: 1;
+}
 </style>

src/print/config.js

@@ -1,61 +1,98 @@
 import Common from '../common/Common';
 
 export const columns = [
-  {
-    title: '公司',
-    dataIndex: 'clientName',
-    key: 'clientName',
-  },
   {
     title: '部门',
     dataIndex: 'organizationName',
     key: 'organizationName',
+    width: 160,
   },
   {
     title: '保管人',
     dataIndex: 'depositoryUser',
     key: 'depositoryUser',
-  },
-  {
-    title: '成本中心',
-    dataIndex: 'costCenterName',
-    key: 'costCenterName',
     width: 100,
   },
   {
     title: '资产名称',
     dataIndex: 'assetName',
     key: 'assetName',
+    width: 120,
   },
   {
     title: '资产编号',
     dataIndex: 'assetNo',
     key: 'assetNo',
+    width: 120,
   },
   {
     title: '二维码',
     dataIndex: 'barCode',
     key: 'barCode',
+    width: 250,
   },
   {
     title: 'EPC',
     key: 'epc',
     dataIndex: 'epc',
+    width: 140,
   },
   {
-    title: '打印次数',
-    key: 'printCount',
-    dataIndex: 'printCount',
+    title: '序号',
+    key: 'printField',
+    dataIndex: 'printField',
+    width: 80,
   },
   {
-    title: '状态',
-    key: 'labelPrintType',
-    dataIndex: 'labelPrintType',
+    title: '标签类型',
+    key: 'printField1',
+    dataIndex: 'printField1',
+    width: 180,
+  },
+  {
+    title: '所属单位',
+    key: 'printField2',
+    dataIndex: 'printField2',
+    width: 140,
   },
   {
     title: '图片',
     key: 'imageUrl',
     dataIndex: 'imageUrl',
+    width: 150,
+  },
+  {
+    title: '状态',
+    key: 'labelPrintType',
+    dataIndex: 'labelPrintType',
+    width: 80,
+    customCell: record => {
+      if (record.labelPrintType === 'To_Be_Printed') {
+        record.labelPrintType = '待打印';
+      } else if (record.labelPrintType === 'Printing') {
+        record.labelPrintType = '打印中';
+      } else if (record.labelPrintType === 'Printed') {
+        record.labelPrintType = '已打印';
+      }
+    },
+  },
+  {
+    title: '打印次数',
+    key: 'printCount',
+    dataIndex: 'printCount',
+    width: 75,
+  },
+  {
+    title: '成本中心',
+    dataIndex: 'costCenterName',
+    key: 'costCenterName',
+    width: 100,
+  },
+  {
+    title: '公司',
+    dataIndex: 'clientName',
+    key: 'clientName',
+    width: 120,
   },
 ].map(item => ({ ...item, align: 'center' }));