|
@@ -4,7 +4,7 @@
|
|
|
<div style="display: flex; align-items: center; justify-content: space-between">
|
|
|
<h1>调拨记录</h1>
|
|
|
<div>
|
|
|
- <el-button type="primary">导出</el-button>
|
|
|
+ <el-button type="primary" @click="exportTableData">导出</el-button>
|
|
|
<el-button type="primary" :disabled="multiple" v-print="printTransferOrder" @click="batchPrint">批量打印</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -34,107 +34,110 @@
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div id="transferOrder" style="display: none; width: 850px">
|
|
|
- <h1 style="display: flex; justify-content: center">行政事业单位资产调拨单</h1>
|
|
|
- <div style="display: flex; margin-top: -10px; margin-left: 20px; font-size:13px">
|
|
|
- <div style="display:flex; flex-direction: column">
|
|
|
- <div style="margin-bottom: 2px">调拨单位:茂名市应急管理局</div>
|
|
|
- <div>调出单位性质:行政单位</div>
|
|
|
+ <div v-for="(record, index) in selectedRecords" :key="index" class="print-page">
|
|
|
+ <h1 style="display: flex; justify-content: center">行政事业单位资产调拨单</h1>
|
|
|
+ <div style="display: flex; margin-top: -10px; margin-left: 20px; font-size:13px">
|
|
|
+ <div style="display:flex; flex-direction: column">
|
|
|
+ <div style="margin-bottom: 2px">调拨单位:茂名市应急管理局</div>
|
|
|
+ <div>调出单位性质:行政单位</div>
|
|
|
+ </div>
|
|
|
+ <div style="display:flex; flex-direction: column; margin-left: 200px; margin-bottom: 2px">
|
|
|
+ <div style="margin-bottom: 2px">调入单位:茂南区人民政府站前街道办事处</div>
|
|
|
+ <div>调入单位行政:行政单位</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div style="display:flex; flex-direction: column; margin-left: 200px; margin-bottom: 2px">
|
|
|
- <div style="margin-bottom: 2px">调入单位:茂南区人民政府站前街道办事处</div>
|
|
|
- <div>调入单位行政:行政单位</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="asset-table-container" style="margin-top: -1px">
|
|
|
- <table class="asset-table">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th style="width: 150px">资产名称</th>
|
|
|
- <th style="width: 100px">购置时间</th>
|
|
|
- <th style="width: 80px">数量</th>
|
|
|
- <th>单价</th>
|
|
|
- <th style="width: 150px">账面价值</th>
|
|
|
- <th style="width: 150px">调拨原因</th>
|
|
|
- <th style="width: 120px">备注</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- <tr v-for="(asset, index) in selectedData" :key="index">
|
|
|
- <td>{{ asset.material_name }}</td>
|
|
|
- <td>{{ asset.application_time }}</td>
|
|
|
- <td>{{ asset.num }}</td>
|
|
|
- <td>{{ asset.price }}</td>
|
|
|
- <td>{{ asset.material_name }}</td>
|
|
|
- <td>{{ asset.material_name }}</td>
|
|
|
- <td>{{ asset.material_name }}</td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
- <tbody>
|
|
|
- <tr v-for="i in 2" :key="i">
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>合计</td>
|
|
|
- <td> </td>
|
|
|
- <td>{{ numSum }}</td>
|
|
|
- <td>{{ priceSum }}</td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- <td> </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td colspan="7" style="text-align: left; padding: 8px;">
|
|
|
- 调拨处理办法:1、无偿调拨               2、有偿调拨
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr style="height: 120px; vertical-align: top; position: relative;">
|
|
|
- <td colspan="2" style="text-align: left; position: relative;">
|
|
|
- 调出单位意见:
|
|
|
- <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
- 年 月 日
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- <td colspan="3" style="text-align: left; position: relative;">
|
|
|
- 调入单位意见:
|
|
|
- <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
- 年 月 日
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- <td colspan="2" rowspan="2" style="text-align: left; position: relative; vertical-align: top;">
|
|
|
- 财政部门意见:
|
|
|
- <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
- 年 月 日
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr style="height: 120px; vertical-align: top; position: relative;">
|
|
|
- <td colspan="2" style="text-align: left; position: relative;">
|
|
|
- 调出单位主管部门意见:
|
|
|
- <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
- 年 月 日
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- <td colspan="3" style="text-align: left; position: relative;">
|
|
|
- 调入单位主管部门意见:
|
|
|
- <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
- 年 月 日
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- <div style="display: flex; justify-content: space-between; font-size: 13px">
|
|
|
- <div>本表一式五份</div>
|
|
|
- <div>填报人:</div>
|
|
|
- <div>联系电话:15200000000</div>
|
|
|
+ <div class="asset-table-container" style="margin-top: -1px">
|
|
|
+ <table class="asset-table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th style="width: 150px">资产名称</th>
|
|
|
+ <th style="width: 100px">购置时间</th>
|
|
|
+ <th style="width: 80px">数量</th>
|
|
|
+ <th>单价</th>
|
|
|
+ <th style="width: 150px">账面价值</th>
|
|
|
+ <th style="width: 150px">调拨原因</th>
|
|
|
+ <th style="width: 120px">备注</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr v-for="(asset, assetIndex) in record.material" :key="assetIndex">
|
|
|
+ <td>{{ asset.name }}</td>
|
|
|
+ <td>{{ asset.purchaseTime }}</td>
|
|
|
+ <td>{{ asset.num }}</td>
|
|
|
+ <td>{{ asset.price }}</td>
|
|
|
+ <td>{{ calculateBookValue(asset.num, asset.price) }}</td>
|
|
|
+ <td>{{ record.reason_transfer }}</td>
|
|
|
+ <td>{{ record.notes }}</td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ <tbody>
|
|
|
+ <tr v-for="i in 2" :key="i">
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>合计</td>
|
|
|
+ <td> </td>
|
|
|
+ <td>{{ calculateSum(record.material, 'num') }}</td>
|
|
|
+ <td> </td>
|
|
|
+ <td>{{ calculateSum2(record.material, 'bookValue') }}</td>
|
|
|
+ <td> </td>
|
|
|
+ <td> </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="7" style="text-align: left; padding: 8px;">
|
|
|
+ 调拨处理办法:1、无偿调拨               2、有偿调拨
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr style="height: 120px; vertical-align: top; position: relative;">
|
|
|
+ <td colspan="2" style="text-align: left; position: relative;">
|
|
|
+ 调出单位意见:
|
|
|
+ <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
+ 年 月 日
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="text-align: left; position: relative;">
|
|
|
+ 调入单位意见:
|
|
|
+ <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
+ 年 月 日
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ <td colspan="2" rowspan="2" style="text-align: left; position: relative; vertical-align: top;">
|
|
|
+ 财政部门意见:
|
|
|
+ <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
+ 年 月 日
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr style="height: 120px; vertical-align: top; position: relative;">
|
|
|
+ <td colspan="2" style="text-align: left; position: relative;">
|
|
|
+ 调出单位主管部门意见:
|
|
|
+ <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
+ 年 月 日
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ <td colspan="3" style="text-align: left; position: relative;">
|
|
|
+ 调入单位主管部门意见:
|
|
|
+ <div style="position: absolute; right: 8px; bottom: 8px; font-size: 12px;">
|
|
|
+ 年 月 日
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ <div style="display: flex; justify-content: space-between; font-size: 13px">
|
|
|
+ <div>本表一式五份</div>
|
|
|
+ <div>填报人:</div>
|
|
|
+ <div>联系电话:15200000000</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
</div>
|
|
|
<TransferRecordDetail v-if="viewRecord" :id="material_id" @close="handleCancel" />
|
|
|
<TransferRecordEdit v-if="editRecord" :id="material_id" @close="handleCancel" />
|
|
@@ -147,11 +150,30 @@ import { ElTable, ElTableColumn, ElText } from 'element-plus';
|
|
|
import TransferRecordDetail from '@/views/comprehensiveGuarantee/MaterialReserveManagement/TransferRecordDetail.vue';
|
|
|
import TransferRecordEdit from '@/views/comprehensiveGuarantee/MaterialReserveManagement/TransferRecordEdit.vue';
|
|
|
import { ref } from 'vue';
|
|
|
+import { fillingTable } from '@/api/dataFilling/fillingManage';
|
|
|
+import { download2 } from '@/utils/request';
|
|
|
|
|
|
const tableData = ref([
|
|
|
{
|
|
|
id: '1',
|
|
|
- material_name: '皮划艇',
|
|
|
+ material: [
|
|
|
+ {
|
|
|
+ name: '皮划艇',
|
|
|
+ type: '2039TP',
|
|
|
+ unit: '只',
|
|
|
+ num: '5',
|
|
|
+ price: '5000',
|
|
|
+ purchaseTime: '2025-03-31'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '电脑',
|
|
|
+ type: '2039TP',
|
|
|
+ unit: '台',
|
|
|
+ num: '3',
|
|
|
+ price: '8000',
|
|
|
+ purchaseTime: '2025-03-31'
|
|
|
+ }
|
|
|
+ ],
|
|
|
application_time: '2023-01-01',
|
|
|
applicant: '应急局',
|
|
|
processing_person: '张三',
|
|
@@ -166,13 +188,20 @@ const tableData = ref([
|
|
|
contacts: '张三',
|
|
|
contacts_phone: '13309897689',
|
|
|
notes: '无',
|
|
|
- num: '5',
|
|
|
- price: '5000',
|
|
|
reason: 'no',
|
|
|
},
|
|
|
{
|
|
|
id: '2',
|
|
|
- material_name: '电脑',
|
|
|
+ material: [
|
|
|
+ {
|
|
|
+ name: '皮划艇',
|
|
|
+ type: '2039TP',
|
|
|
+ unit: '只',
|
|
|
+ num: '5',
|
|
|
+ price: '5000',
|
|
|
+ purchaseTime: '2025-03-31'
|
|
|
+ }
|
|
|
+ ],
|
|
|
application_time: '2023-01-01',
|
|
|
applicant: '应急局',
|
|
|
processing_person: '张三',
|
|
@@ -187,55 +216,52 @@ const tableData = ref([
|
|
|
contacts: '张三',
|
|
|
contacts_phone: '13309897689',
|
|
|
notes: '无',
|
|
|
- num: '9',
|
|
|
- price: '2000',
|
|
|
reason: 'no',
|
|
|
}
|
|
|
]);
|
|
|
-const selectedData = ref([]);
|
|
|
const viewRecord = ref(false);
|
|
|
const editRecord = ref(false);
|
|
|
const material_id = ref();
|
|
|
-const numSum = ref();
|
|
|
-const priceSum = ref();
|
|
|
const multiple = ref(true);
|
|
|
const multipleTable = ref();
|
|
|
+const selectedRecords = ref([]); // 存储被选中的完整记录
|
|
|
+const ids = ref<Array<number | string>>([]);
|
|
|
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
|
|
|
+const filename = '行政事业单位资产调拨单';
|
|
|
|
|
|
const printOrder = (row) => {
|
|
|
multipleTable.value.clearSelection();
|
|
|
- if (selectedData.value.length === 0) {
|
|
|
- selectedData.value.push(row);
|
|
|
- } else {
|
|
|
- selectedData.value = [];
|
|
|
- selectedData.value.push(row);
|
|
|
- }
|
|
|
- totalQuantity();
|
|
|
- totalPrice();
|
|
|
+ selectedRecords.value = [row]; // 单条记录打印
|
|
|
}
|
|
|
const batchPrint = () => {
|
|
|
- totalQuantity();
|
|
|
- totalPrice();
|
|
|
+ const selection = multipleTable.value.getSelectionRows();
|
|
|
+ selectedRecords.value = selection; // 存储所有被选中的记录
|
|
|
}
|
|
|
+// 计算单条记录中物资的合计
|
|
|
+const calculateSum = (materials, field) => {
|
|
|
+ return materials.reduce((sum, item) => {
|
|
|
+ return sum + (field === 'num' ? parseInt(item[field]) : parseFloat(item[field]));
|
|
|
+ }, 0);
|
|
|
+}
|
|
|
+// 计算合计行
|
|
|
+const calculateSum2 = (materials, field) => {
|
|
|
+ return materials.reduce((sum, item) => {
|
|
|
+ if (field === 'bookValue') {
|
|
|
+ return sum + (parseInt(item.num) * parseFloat(item.price));
|
|
|
+ }
|
|
|
+ return sum + (field === 'num' ? parseInt(item[field]) : parseFloat(item[field]));
|
|
|
+ }, 0).toFixed(2);
|
|
|
+};
|
|
|
+// 计算单行账面价值(数量×单价)
|
|
|
+const calculateBookValue = (num, price) => {
|
|
|
+ return (parseInt(num) * parseFloat(price)).toFixed(2);
|
|
|
+};
|
|
|
+
|
|
|
let printTransferOrder = reactive({
|
|
|
id: 'transferOrder', // 这里是要打印元素的ID
|
|
|
popTitle: '',
|
|
|
extraCss: '/print.css'
|
|
|
});
|
|
|
-const totalQuantity = () => {
|
|
|
- let total = 0;
|
|
|
- selectedData.value.forEach((item) => {
|
|
|
- total += parseInt(item.num);
|
|
|
- })
|
|
|
- numSum.value = total;
|
|
|
-}
|
|
|
-const totalPrice = () => {
|
|
|
- let total = 0;
|
|
|
- selectedData.value.forEach((item) => {
|
|
|
- total += parseFloat(item.price);
|
|
|
- })
|
|
|
- priceSum.value = total;
|
|
|
-}
|
|
|
-
|
|
|
const handleView = (row) => {
|
|
|
viewRecord.value = true;
|
|
|
material_id.value = row.id;
|
|
@@ -249,10 +275,11 @@ const handleCancel = () => {
|
|
|
}
|
|
|
const handleSelectionChange = (selection) => {
|
|
|
multiple.value = selection.length === 0;
|
|
|
- selectedData.value = [];
|
|
|
- selection.forEach((item) => {
|
|
|
- selectedData.value.push(item);
|
|
|
- })
|
|
|
+ selectedRecords.value = selection;
|
|
|
+};
|
|
|
+const exportTableData = () => {
|
|
|
+ fillingTable(ids.value[0]);
|
|
|
+ download2(baseUrl + '/api/dataFilling/export_to_excel?report_id='+ids.value[0], filename + '.xlsx');
|
|
|
};
|
|
|
</script>
|
|
|
|
|
@@ -288,9 +315,16 @@ const handleSelectionChange = (selection) => {
|
|
|
color: #333;
|
|
|
padding: 8px;
|
|
|
}
|
|
|
+
|
|
|
@media print {
|
|
|
#transferOrder {
|
|
|
display: block !important;
|
|
|
}
|
|
|
+ .print-page {
|
|
|
+ page-break-after: always; /* 每个表格后强制分页 */
|
|
|
+ }
|
|
|
+ .print-page:last-child {
|
|
|
+ page-break-after: auto; /* 最后一个表格后不分页 */
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|