From 7c2cdcbc7f5585b96fba76a07b0e4417a09c4d7e Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 02 六月 2026 11:06:10 +0800
Subject: [PATCH] 新疆马铃薯 1.过程检验下载添加3个模版

---
 src/views/inventoryManagement/dispatchLog/Record.vue |  864 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 864 insertions(+), 0 deletions(-)

diff --git a/src/views/inventoryManagement/dispatchLog/Record.vue b/src/views/inventoryManagement/dispatchLog/Record.vue
new file mode 100644
index 0000000..431fd24
--- /dev/null
+++ b/src/views/inventoryManagement/dispatchLog/Record.vue
@@ -0,0 +1,864 @@
+<template>
+  <div>
+    <div class="search_form" style="margin-bottom: 10px">
+      <el-form ref="searchFormRef" :model="searchForm" class="demo-form-inline">
+        <el-row :gutter="20">
+          <el-col :span="4">
+            <el-form-item label="鍑哄簱鏃ユ湡" prop="timeStr">
+              <el-date-picker
+                v-model="searchForm.timeStr"
+                type="date"
+                placeholder="璇烽�夋嫨鏃ユ湡"
+                value-format="YYYY-MM-DD"
+                format="YYYY-MM-DD"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="浜у搧澶х被" prop="productName">
+              <el-input
+                v-model="searchForm.productName"
+                style="width: 240px"
+                placeholder="璇疯緭鍏�"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="瑙勬牸鍨嬪彿" prop="model">
+              <el-input
+                v-model="searchForm.model"
+                style="width: 240px"
+                placeholder="璇疯緭鍏�"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="鎵瑰彿" prop="batchNo">
+              <el-input
+                v-model="searchForm.batchNo"
+                style="width: 240px"
+                placeholder="璇疯緭鍏�"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label="鏉ユ簮" prop="recordType">
+              <el-select
+                v-model="searchForm.recordType"
+                style="width: 240px"
+                placeholder="璇烽�夋嫨"
+                clearable
+              >
+                <el-option
+                  v-for="item in stockRecordTypeOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <!-- 鎸夐挳 -->
+          <el-col :span="4">
+            <el-form-item>
+              <el-button type="primary" @click="getList"> 鎼滅储 </el-button>
+              <el-button @click="resetSearch"> 閲嶇疆 </el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+    <div class="actions">
+      <el-button type="primary" @click="handleBatchApprove">瀹℃壒</el-button>
+      <el-button @click="handleOut">瀵煎嚭</el-button>
+      <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+      <el-button type="primary" plain @click="handlePrint">鎵撳嵃</el-button>
+    </div>
+    <div class="table_list">
+      <el-table
+        :data="tableData"
+        border
+        v-loading="tableLoading"
+        @selection-change="handleSelectionChange"
+        :expand-row-keys="expandedRowKeys"
+        :row-key="(row) => row.id"
+        style="width: 100%"
+        height="calc(100vh - 18.5em)"
+      >
+        <el-table-column align="center" type="selection" width="55" />
+        <el-table-column align="center" label="搴忓彿" type="index" width="60" />
+        <el-table-column
+          label="鍑哄簱鎵规"
+          prop="outboundBatches"
+          min-width="100"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="鍑哄簱鏃ユ湡"
+          prop="updateTime"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="浜у搧澶х被"
+          prop="productName"
+          show-overflow-tooltip
+        />
+        <el-table-column label="瑙勬牸鍨嬪彿" prop="model" show-overflow-tooltip />
+        <el-table-column label="鎵瑰彿" prop="batchNo" show-overflow-tooltip />
+        <el-table-column label="鍗曚綅" prop="unit" show-overflow-tooltip />
+        <el-table-column
+          label="鍑哄簱鏁伴噺"
+          prop="stockOutNum"
+          show-overflow-tooltip
+        />
+        <el-table-column label="鍑哄簱浜�" prop="createBy" show-overflow-tooltip />
+        <el-table-column label="鏉ユ簮" prop="recordType" show-overflow-tooltip>
+          <template #default="scope">
+            {{ getRecordType(scope.row.recordType) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="瀹℃壒鐘舵��"
+          prop="approvalStatus"
+          show-overflow-tooltip
+        >
+          <template #default="scope">
+            <el-tag
+              :type="getApprovalStatusTagType(scope.row.approvalStatus)"
+              size="small"
+            >
+              {{ getApprovalStatusLabel(scope.row.approvalStatus) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        layout="total, sizes, prev, pager, next, jumper"
+        :page="page.current"
+        :limit="page.size"
+        @pagination="paginationChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import pagination from "@/components/PIMTable/Pagination.vue";
+import { ref } from "vue";
+import { ElMessageBox } from "element-plus";
+import useUserStore from "@/store/modules/user";
+import { getCurrentDate } from "@/utils/index.js";
+import {
+  getStockOutPage,
+  delPendingStockOut,
+  batchApproveStockOutRecords,
+} from "@/api/inventoryManagement/stockOut.js";
+import {
+  findAllQualifiedStockOutRecordTypeOptions,
+  findAllUnQualifiedStockOutRecordTypeOptions,
+} from "@/api/basicData/enum.js";
+
+const userStore = useUserStore();
+const { proxy } = getCurrentInstance();
+const tableData = ref([]);
+const selectedRows = ref([]);
+const tableLoading = ref(false);
+// 鏉ユ簮绫诲瀷閫夐」
+const stockRecordTypeOptions = ref([]);
+const page = reactive({
+  current: 1,
+  size: 100,
+});
+const total = ref(0);
+
+const props = defineProps({
+  type: {
+    type: String,
+    required: true,
+    default: "0",
+  },
+  topParentProductId: {
+    type: [String, Number],
+    default: undefined,
+  },
+});
+
+// 鎵撳嵃鐩稿叧
+const printPreviewVisible = ref(false);
+const printData = ref([]);
+
+// 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁
+const data = reactive({
+  searchForm: {
+    supplierName: "",
+    timeStr: "",
+    recordType: "",
+  },
+});
+const { searchForm } = toRefs(data);
+
+const searchFormRef = ref(null);
+
+const resetSearch = () => {
+  searchFormRef.value?.resetFields();
+  page.current = 1;
+  getList();
+};
+
+const paginationChange = (obj) => {
+  page.current = obj.page;
+  page.size = obj.limit;
+  getList();
+};
+const getList = () => {
+  tableLoading.value = true;
+  getStockOutPage({
+    ...searchForm.value,
+    ...page,
+    topParentProductId: props.topParentProductId,
+  })
+    .then((res) => {
+      tableLoading.value = false;
+      tableData.value = res.data.records;
+      tableData.value.map((item) => {
+        item.children = [];
+      });
+      total.value = res.data.total;
+    })
+    .catch(() => {
+      tableLoading.value = false;
+    });
+};
+
+const getRecordType = (recordType) => {
+  return (
+    stockRecordTypeOptions.value.find((item) => item.value === recordType)
+      ?.label || ""
+  );
+};
+
+const approvalStatusLabelMap = {
+  0: "寰呭鎵�",
+  1: "閫氳繃",
+  2: "椹冲洖",
+  3: "寰呯‘璁�",
+  pending: "寰呭鎵�",
+  approved: "閫氳繃",
+  rejected: "椹冲洖",
+  PENDING: "寰呭鎵�",
+  APPROVED: "閫氳繃",
+  REJECTED: "椹冲洖",
+};
+
+const getApprovalStatusLabel = (status) => {
+  if (status === null || status === undefined || status === "") {
+    return "寰呭鎵�";
+  }
+  return approvalStatusLabelMap[status] || "寰呭鎵�";
+};
+
+// 閫氳繃/椹冲洖鍥哄畾鑹诧紱鍏朵綑锛堝惈寰呭鎵广�佺┖鍊笺�佹湭鏄犲皠浣嗘枃妗堜负寰呭鎵癸級缁熶竴鐢� warning 棰勮鑹�
+const getApprovalStatusTagType = (status) => {
+  if (
+    status === 1 ||
+    status === "1" ||
+    status === "approved" ||
+    status === "APPROVED"
+  )
+    return "success";
+  if (
+    status === 2 ||
+    status === "2" ||
+    status === "rejected" ||
+    status === "REJECTED"
+  )
+    return "danger";
+  return "warning";
+};
+
+// 鑾峰彇鏉ユ簮绫诲瀷閫夐」
+const fetchStockRecordTypeOptions = () => {
+  if (props.type === "0") {
+    findAllQualifiedStockOutRecordTypeOptions().then((res) => {
+      stockRecordTypeOptions.value = res.data;
+    });
+    return;
+  }
+  findAllUnQualifiedStockOutRecordTypeOptions().then((res) => {
+    stockRecordTypeOptions.value = res.data;
+  });
+};
+
+// 琛ㄦ牸閫夋嫨鏁版嵁
+const handleSelectionChange = (selection) => {
+  // 杩囨护鎺夊瓙鏁版嵁
+  selectedRows.value = selection.filter((item) => item.id);
+  console.log("selection", selectedRows.value);
+};
+const expandedRowKeys = ref([]);
+
+const handleBatchApprove = () => {
+  if (selectedRows.value.length === 0) {
+    proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
+    return;
+  }
+  const ids = selectedRows.value.map((item) => item.id);
+  ElMessageBox.confirm("璇烽�夋嫨瀹℃壒缁撴灉", "瀹℃壒", {
+    confirmButtonText: "閫氳繃",
+    cancelButtonText: "椹冲洖",
+    type: "warning",
+    distinguishCancelAndClose: true,
+  })
+    .then(() => {
+      batchApproveStockOutRecords({ ids, approvalStatus: 1 })
+        .then(() => {
+          proxy.$modal.msgSuccess("瀹℃壒閫氳繃鎴愬姛");
+          getList();
+        })
+        .catch(() => {
+          proxy.$modal.msgError("瀹℃壒閫氳繃澶辫触");
+        });
+    })
+    .catch((action) => {
+      if (action === "cancel") {
+        batchApproveStockOutRecords({ ids, approvalStatus: 2 })
+          .then(() => {
+            proxy.$modal.msgSuccess("瀹℃壒椹冲洖鎴愬姛");
+            getList();
+          })
+          .catch(() => {
+            proxy.$modal.msgError("瀹℃壒椹冲洖澶辫触");
+          });
+        return;
+      }
+      proxy.$modal.msg("宸插彇娑�");
+    });
+};
+
+// 瀵煎嚭
+const handleOut = () => {
+  ElMessageBox.confirm("鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
+    confirmButtonText: "纭",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
+    .then(() => {
+      proxy.download(
+        "/stockOutRecord/exportStockOutRecord",
+        { type: props.type },
+        props.type === "0" ? "鍚堟牸鍑哄簱鍙拌处.xlsx" : "涓嶅悎鏍煎嚭搴撳彴璐�.xlsx"
+      );
+    })
+    .catch(() => {
+      proxy.$modal.msg("宸插彇娑�");
+    });
+};
+
+// 鍒犻櫎
+const handleDelete = () => {
+  let ids = [];
+  if (selectedRows.value.length > 0) {
+    ids = selectedRows.value.map((item) => item.id);
+  } else {
+    proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
+    return;
+  }
+  ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "瀵煎嚭", {
+    confirmButtonText: "纭",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
+    .then(() => {
+      delPendingStockOut(ids).then((res) => {
+        proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+        getList();
+      });
+    })
+    .catch(() => {
+      proxy.$modal.msg("宸插彇娑�");
+    });
+};
+
+// 鎵撳嵃鍔熻兘
+const handlePrint = () => {
+  if (selectedRows.value.length === 0) {
+    proxy.$modal.msgWarning("璇烽�夋嫨瑕佹墦鍗扮殑鏁版嵁");
+    return;
+  }
+  printData.value = [...selectedRows.value];
+  console.log("鎵撳嵃鏁版嵁:", printData.value);
+  printPreviewVisible.value = true;
+};
+
+// 鎵ц鎵撳嵃
+const executePrint = () => {
+  console.log("寮�濮嬫墽琛屾墦鍗帮紝鏁版嵁鏉℃暟:", printData.value.length);
+  console.log("鎵撳嵃鏁版嵁:", printData.value);
+
+  // 鍒涘缓涓�涓柊鐨勬墦鍗扮獥鍙�
+  const printWindow = window.open("", "_blank", "width=800,height=600");
+
+  // 鏋勫缓鎵撳嵃鍐呭
+  let printContent = `
+      <!DOCTYPE html>
+      <html>
+      <head>
+        <meta charset="UTF-8">
+        <title>鎵撳嵃棰勮</title>
+        <style>
+          body {
+            margin: 0;
+            padding: 0;
+            font-family: "SimSun", serif;
+            background: white;
+          }
+                                                       .print-page {
+              width: 200mm;
+              height: 75mm;
+              padding: 10mm;
+              padding-left: 20mm;
+              background: white;
+              box-sizing: border-box;
+              page-break-after: always;
+              page-break-inside: avoid;
+            }
+           .print-page:last-child {
+             page-break-after: avoid;
+           }
+          .delivery-note {
+            width: 100%;
+            height: 100%;
+            font-size: 12px;
+            line-height: 1.2;
+            display: flex;
+            flex-direction: column;
+            color: #000;
+          }
+          .header {
+            text-align: center;
+            margin-bottom: 8px;
+          }
+          .company-name {
+            font-size: 18px;
+            font-weight: bold;
+            margin-bottom: 4px;
+          }
+          .document-title {
+            font-size: 16px;
+            font-weight: bold;
+          }
+          .info-section {
+            margin-bottom: 8px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          }
+          .info-row {
+            line-height: 20px;
+          }
+          .label {
+            font-weight: bold;
+            width: 60px;
+            font-size: 12px;
+          }
+          .value {
+            margin-right: 20px;
+            min-width: 80px;
+            font-size: 12px;
+          }
+                   .table-section {
+                   margin-bottom: 40px;
+            //  flex: 0.6;
+           }
+          .product-table {
+            width: 100%;
+            border-collapse: collapse;
+            border: 1px solid #000;
+          }
+                   .product-table th, .product-table td {
+             border: 1px solid #000;
+             padding: 6px;
+             text-align: center;
+             font-size: 12px;
+             line-height: 1.4;
+           }
+          .product-table th {
+            font-weight: bold;
+          }
+          .total-value {
+            font-weight: bold;
+          }
+          .footer-section {
+            margin-top: auto;
+          }
+          .footer-row {
+            display: flex;
+            margin-bottom: 3px;
+            line-height: 22px;
+            justify-content: space-between;
+          }
+          .footer-item {
+            display: flex;
+            margin-right: 20px;
+          }
+          .footer-item .label {
+            font-weight: bold;
+            width: 80px;
+            font-size: 12px;
+          }
+          .footer-item .value {
+            min-width: 80px;
+            font-size: 12px;
+          }
+          .address-item .address-value {
+            min-width: 200px;
+          }
+          @media print {
+            body {
+              margin: 0;
+              padding: 0;
+            }
+                       .print-page {
+               margin: 0;
+               padding: 10mm;
+               /* padding-left: 20mm; */
+               page-break-inside: avoid;
+               page-break-after: always;
+             }
+             .print-page:last-child {
+               page-break-after: avoid;
+             }
+          }
+        </style>
+      </head>
+      <body>
+    `;
+
+  // 涓烘瘡鏉℃暟鎹敓鎴愭墦鍗伴〉闈�
+  printData.value.forEach((item, index) => {
+    printContent += `
+        <div class="print-page">
+          <div class="delivery-note">
+            <div class="header">
+              <div class="document-title">闆跺敭鍙戣揣鍗�</div>
+            </div>
+            
+            <div class="info-section">
+              <div class="info-row">
+                <div>
+                  <span class="label">鍙戣揣鏃ユ湡锛�</span>
+                  <span class="value">${formatDate(item.createTime)}</span>
+                </div>
+                <div>
+                  <span class="label">瀹㈡埛鍚嶇О锛�</span>
+                  <span class="value">${item.supplierName}</span>
+                </div>
+              </div>
+              <div class="info-row">
+                <span class="label">鍗曞彿锛�</span>
+                <span class="value">${item.code || ""}</span>
+              </div>
+            </div>
+
+            <div class="table-section">
+              <table class="product-table">
+                <thead>
+                  <tr>
+                    <th>浜у搧鍚嶇О</th>
+                    <th>瑙勬牸鍨嬪彿</th>
+                    <th>鍗曚綅</th>
+                    <th>鍗曚环</th>
+                    <th>闆跺敭鏁伴噺</th>
+                    <th>闆跺敭閲戦</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td>${item.productName || "鐮傜伆鐮�"}</td>
+                    <td>${item.model || "鏍囧噯"}</td>
+                    <td>${item.unit || "鍧�"}</td>
+                    <td>${item.taxInclusiveUnitPrice || "0"}</td>
+                    <td>${item.inboundNum || "2000"}</td>
+                    <td>${item.taxInclusiveTotalPrice || "0"}</td>
+                  </tr>
+                </tbody>
+                <tfoot>
+                  <tr>
+                    <td class="label">鍚堣</td>
+                    <td class="total-value"></td>
+                    <td class="total-value"></td>
+                    <td class="total-value"></td>
+                    <td class="total-value">${item.inboundNum || "2000"}</td>
+                    <td class="total-value">${
+                      item.taxInclusiveTotalPrice || "0"
+                    }</td>
+                  </tr>
+                </tfoot>
+              </table>
+            </div>
+
+            <div class="footer-section">
+              <div class="footer-row">
+                <div class="footer-item">
+                  <span class="label">鏀惰揣鐢佃瘽锛�</span>
+                  <span class="value"></span>
+                </div>
+                <div class="footer-item">
+                  <span class="label">鏀惰揣浜猴細</span>
+                  <span class="value"></span>
+                </div>
+                <div class="footer-item address-item">
+                  <span class="label">鏀惰揣鍦板潃锛�</span>
+                  <span class="value address-value"></span>
+                </div>
+              </div>
+              <div class="footer-row">
+                <div class="footer-item">
+                  <span class="label">鎿嶄綔鍛橈細</span>
+                  <span class="value">${userStore.nickName || "鎾曞紑鍓�"}</span>
+                </div>
+                <div class="footer-item">
+                  <span class="label">鎵撳嵃鏃ユ湡锛�</span>
+                  <span class="value">${formatDateTime(new Date())}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      `;
+  });
+
+  printContent += `
+      </body>
+      </html>
+    `;
+
+  // 鍐欏叆鍐呭鍒版柊绐楀彛
+  printWindow.document.write(printContent);
+  printWindow.document.close();
+
+  // 绛夊緟鍐呭鍔犺浇瀹屾垚鍚庢墦鍗�
+  printWindow.onload = () => {
+    setTimeout(() => {
+      printWindow.print();
+      printWindow.close();
+      printPreviewVisible.value = false;
+    }, 500);
+  };
+};
+
+// 鏍煎紡鍖栨棩鏈�
+const formatDate = (dateString) => {
+  if (!dateString) return getCurrentDate();
+  const date = new Date(dateString);
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${year}/${month}/${day}`;
+};
+
+// 鏍煎紡鍖栨棩鏈熸椂闂�
+const formatDateTime = (date) => {
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  const seconds = String(date.getSeconds()).padStart(2, "0");
+  return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
+};
+onMounted(() => {
+  getList();
+  fetchStockRecordTypeOptions();
+});
+
+watch(
+  () => props.topParentProductId,
+  () => {
+    page.current = 1;
+    getList();
+  }
+);
+</script>
+
+<style scoped lang="scss">
+.print-preview-dialog {
+  .el-dialog__body {
+    padding: 0;
+    max-height: 80vh;
+    overflow-y: auto;
+  }
+}
+
+.print-preview-container {
+  .print-preview-header {
+    padding: 15px;
+    border-bottom: 1px solid #e4e7ed;
+    text-align: center;
+
+    .el-button {
+      margin: 0 10px;
+    }
+  }
+
+  .print-preview-content {
+    padding: 20px;
+    background-color: #f5f5f5;
+    min-height: 400px;
+  }
+}
+
+.print-page {
+  width: 220mm;
+  height: 90mm;
+  padding: 10mm;
+  margin: 0 auto;
+  background: white;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  margin-bottom: 10px;
+  box-sizing: border-box;
+}
+
+.delivery-note {
+  width: 100%;
+  height: 100%;
+  font-family: "SimSun", serif;
+  font-size: 10px;
+  line-height: 1.2;
+  display: flex;
+  flex-direction: column;
+}
+
+.header {
+  text-align: center;
+  margin-bottom: 8px;
+
+  .company-name {
+    font-size: 18px;
+    font-weight: bold;
+    margin-bottom: 4px;
+  }
+
+  .document-title {
+    font-size: 16px;
+    font-weight: bold;
+  }
+}
+
+.info-section {
+  margin-bottom: 8px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .info-row {
+    line-height: 20px;
+
+    .label {
+      font-weight: bold;
+      width: 60px;
+      font-size: 14px;
+    }
+
+    .value {
+      margin-right: 20px;
+      min-width: 80px;
+      font-size: 14px;
+    }
+  }
+}
+
+.table-section {
+  margin-bottom: 4px;
+  flex: 1;
+
+  .product-table {
+    width: 100%;
+    border-collapse: collapse;
+    border: 1px solid #000;
+
+    th,
+    td {
+      border: 1px solid #000;
+      padding: 6px;
+      text-align: center;
+      font-size: 14px;
+      line-height: 1.4;
+    }
+
+    th {
+      font-weight: bold;
+    }
+
+    .total-label {
+      text-align: right;
+      font-weight: bold;
+    }
+
+    .total-value {
+      font-weight: bold;
+    }
+  }
+}
+
+.footer-section {
+  .footer-row {
+    display: flex;
+    margin-bottom: 3px;
+    line-height: 20px;
+    justify-content: space-between;
+
+    .footer-item {
+      display: flex;
+      margin-right: 20px;
+
+      .label {
+        font-weight: bold;
+        width: 80px;
+        font-size: 14px;
+      }
+
+      .value {
+        min-width: 80px;
+        font-size: 14px;
+      }
+
+      &.address-item {
+        .address-value {
+          min-width: 200px;
+        }
+      }
+    }
+  }
+}
+
+@media print {
+  .app-container {
+    display: none;
+  }
+
+  .print-page {
+    box-shadow: none;
+    margin: 0;
+    padding: 10mm;
+    padding-left: 20mm;
+    page-break-inside: avoid;
+    page-break-after: always;
+  }
+  .print-page:last-child {
+    page-break-after: avoid;
+  }
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  margin-bottom: 10px;
+}
+</style>

--
Gitblit v1.9.3