一线凭证和打印

snowy-admin-web/package.json

@@ -42,6 +42,7 @@
 		"lodash-es": "4.17.21",
 		"nprogress": "0.2.0",
 		"pinia": "2.1.7",
+		"print-js": "^1.6.0",
 		"qs": "6.11.2",
 		"screenfull": "6.0.2",
 		"sm-crypto": "0.3.13",

snowy-admin-web/src/views/yqyc/general-ledger/one/certificate.vue

@@ -0,0 +1,74 @@
+<template>
+	<a-modal
+      v-model:open="open"
+      title="记账凭证"
+      centered
+      width="90%"
+  >
+      <div class="certificate-detail">
+        <a-space class="go-back-button">
+          <a-button :href="fileUrl" size="small" target="_blank">
+            <template #icon><download-outlined /></template>
+          </a-button>
+        </a-space>
+        <a-spin :spinning="loading">
+          <vue-office-excel
+            :src="fileUrl"
+            class="xn-ht82"
+            @rendered="renderedHandler"
+            @error="errorHandler"
+          />
+        </a-spin>
+      </div>
+      <template #footer></template>
+	</a-modal>
+</template>
+
+<script setup name="certificateDetail">
+	import tool from '@/utils/tool'
+	import { cloneDeep } from 'lodash-es'
+  import VueOfficeExcel from "@vue-office/excel";
+	// 抽屉状态
+	const open = ref(false)
+  const loading = ref(false)
+  const fileUrl = ref()
+
+	// 打开抽屉
+	const onOpen = (record, view = false) => {
+		open.value = true
+    loading.value = true
+		if (record) {
+      fileUrl.value = 'http://localhost:18070/dev/file/download?id=1809072860417298434'
+		}
+	}
+	// 关闭抽屉
+	const onClose = () => {
+		open.value = false
+    fileUrl.value = ''
+	}
+  // 渲染完成
+  const renderedHandler = () => {
+    loading.value = false
+  }
+  // 渲染失败
+  const errorHandler = () => {
+    message.warning('渲染失败，请尝试重新打开！')
+  }
+	// 抛出函数
+	defineExpose({
+		onOpen
+	})
+</script>
+<style lang="less" scoped>
+.certificate-detail {
+  height: 800px;
+  overflow-y: auto;
+  .go-back-button {
+    position: absolute;
+    float: right;
+    right: 10px;
+    z-index: 999;
+  }
+}
+
+</style>

snowy-admin-web/src/views/yqyc/general-ledger/one/index.vue

@@ -125,6 +125,12 @@
             </template>
             批量导出
           </a-button>
+          <a-button @click="onPrint">
+            <template #icon>
+              <PrinterOutlined />
+            </template>
+            打印
+          </a-button>
         </a-space>
       </template>
       <template #bodyCell="{ column, record }">
@@ -154,6 +160,8 @@
               <a-button type="link" danger size="small" v-if="hasPerm('qyFrontlineWarehouseDelete')">删除</a-button>
             </a-popconfirm>
             <a-button type="link" primary size="small" @click="goodsDetailRef.onOpen(record)">{{ (record.warehouseType == 0 ? '入' : '出') + '库单' }}</a-button>
+            <a-divider type="vertical"/>
+            <a-button type="link" primary size="small" @click="certificateDetailRef.onOpen(record)">记账凭证</a-button>
           </a-space>
         </template>
       </template>
@@ -162,6 +170,7 @@
   <Detail v-else ref="detailRef" @onClose="indexShow = true" @successful="onSearch()"/>
   <EnterpriseDetail ref="enterpriseDetailRef"/>
   <GoodsDetail ref="goodsDetailRef"/>
+  <CertificateDetail ref="certificateDetailRef"/>
 </template>
 
 <script setup name="qyfrontlinewarehouse">
@@ -170,8 +179,10 @@ import {cloneDeep} from 'lodash-es'
 import Detail from './detail.vue'
 import EnterpriseDetail from '@/views/yqyc/component/enterprise/detail.vue'
 import GoodsDetail from './goods.vue'
+import CertificateDetail from './certificate.vue'
 import qyFrontlineWarehouseApi from '@/api/yqyc/qyFrontlineWarehouseApi'
 import downloadUtil from "@/utils/downloadUtil";
+import printJS from "print-js";
 
 const {proxy} = getCurrentInstance()
 const searchFormState = ref({
@@ -184,6 +195,7 @@ const filterParam = ref({})
 const detailRef = ref()
 const enterpriseDetailRef = ref()
 const goodsDetailRef = ref()
+const certificateDetailRef = ref()
 const indexShow = ref(true)
 const toolConfig = {refresh: true, height: true, columnSetting: true, striped: false}
 // 查询区域显示更多控制
@@ -247,6 +259,13 @@ const columns = ref([
     dataIndex: 'accountTime',
     sorter: true,
   },
+  {
+    title: '操作',
+    dataIndex: 'action',
+    align: 'center',
+    width: 200,
+    fixed: 'right',
+  }
 ])
 watch(() => searchFormStateReal.value.warehouseType, (n) => {
   columns.value.forEach(v => {
@@ -260,12 +279,10 @@ watch(() => searchFormStateReal.value.warehouseType, (n) => {
 })
 // 操作栏通过权限判断是否显示
 if (hasPerm(['qyFrontlineWarehouseEdit', 'qyFrontlineWarehouseDelete'])) {
-  columns.value.push({
-    title: '操作',
-    dataIndex: 'action',
-    align: 'center',
-    width: 200,
-    fixed: 'right',
+  columns.value.forEach(v => {
+    if (v.dataIndex === 'action') {
+      v.width = 400
+    }
   })
 }
 const selectedRowKeys = ref([])
@@ -358,6 +375,9 @@ const onDetail = (record = null, view) => {
     detailRef.value.onOpen(record, view)
   })
 }
+const onPrint = () => {
+  printJS('http://localhost:18070/dev/file/download?id=1809073783625551874', 'pdf')
+}
 const accountTypeOptions = tool.dictList('account_type')
 const businessTypeOptions = tool.dictList('bussiness_type')
 const measurementUnitOptions = tool.dictList('measurement unit')