| | |
| | | <el-table-column align="center" type="selection" width="55" /> |
| | | <el-table-column type="expand"> |
| | | <template #default="props"> |
| | | <el-table :data="props.row.children" border show-summary :summary-method="summarizeChildrenTable"> |
| | | <el-table-column align="center" label="序号" type="index" width="60" /> |
| | | <el-table-column label="产品大类" prop="productCategory" /> |
| | | <el-table-column label="规格型号" prop="specificationModel" /> |
| | | <el-table-column label="单位" prop="unit" /> |
| | | <el-table-column label="数量" prop="quantity" /> |
| | | <el-table-column label="税率(%)" prop="taxRate" /> |
| | | <el-table-column label="含税单价(元)" prop="taxInclusiveUnitPrice" :formatter="formattedNumber" /> |
| | | <el-table-column label="含税总价(元)" prop="taxInclusiveTotalPrice" :formatter="formattedNumber" /> |
| | | <el-table-column label="不含税总价(元)" prop="taxExclusiveTotalPrice" :formatter="formattedNumber" /> |
| | | <el-table :data="props.row.children" border show-summary :summary-method="summarizeChildrenTable" style="min-width: 1200px;" |
| | | scrollbar-always-on> |
| | | <el-table-column align="center" label="序号" type="index" width="70" /> |
| | | <el-table-column label="产品大类" prop="productCategory" width="160" /> |
| | | <el-table-column label="规格型号" prop="specificationModel" width="220" /> |
| | | <el-table-column label="单位" prop="unit" width="100" /> |
| | | <el-table-column label="数量" prop="quantity" width="120" /> |
| | | <el-table-column label="税率(%)" prop="taxRate" width="120" /> |
| | | <el-table-column label="含税单价(元)" prop="taxInclusiveUnitPrice" :formatter="formattedNumber" width="160" /> |
| | | <el-table-column label="含税总价(元)" prop="taxInclusiveTotalPrice" :formatter="formattedNumber" width="180" /> |
| | | <el-table-column label="不含税总价(元)" prop="taxExclusiveTotalPrice" :formatter="formattedNumber" width="180" /> |
| | | <!-- <el-table-column fixed="right" label="操作" width="150" align="center">--> |
| | | <!-- <template #default="scope">--> |
| | | <!-- <el-button link type="primary" size="small" @click="openDeliveryForm(props.row, scope.row)">发货</el-button>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | </el-table> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | <el-table-column label="客户名称" prop="customerName" width="300" show-overflow-tooltip /> |
| | | <el-table-column label="业务员" prop="salesman" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="项目名称" prop="projectName" width="180" show-overflow-tooltip /> |
| | | <el-table-column label="审核状态" width="140"> |
| | | <template #default="scope"> |
| | | |
| | | <el-tag |
| | | v-if="(scope.row.approveStatus ?? scope.row.approvalStatus) == 0" |
| | | type="warning" |
| | | >待审核</el-tag> |
| | | <el-tag |
| | | v-else-if="(scope.row.approveStatus ?? scope.row.approvalStatus) == 1" |
| | | type="primary" |
| | | >审核中</el-tag> |
| | | <el-tag |
| | | v-else-if="(scope.row.approveStatus ?? scope.row.approvalStatus) == 2" |
| | | type="success" |
| | | >审核完成</el-tag> |
| | | <el-tag |
| | | v-else-if="(scope.row.approveStatus ?? scope.row.approvalStatus) == 3" |
| | | type="danger" |
| | | >审核未通过</el-tag> |
| | | <el-tag |
| | | v-else-if="(scope.row.approveStatus ?? scope.row.approvalStatus) == 4" |
| | | type="info" |
| | | >已重新提交</el-tag> |
| | | <el-tag v-else type="info">-</el-tag> |
| | | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="销售类型" width="120"> |
| | | <template #default="scope"> |
| | | <el-tag |
| | | :type="scope.row.salesType === '紧急' ? 'danger' : 'info'" |
| | | >{{ scope.row.salesType || '-' }}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="付款方式" prop="paymentMethod" show-overflow-tooltip /> |
| | | <el-table-column label="合同金额(元)" prop="contractAmount" width="220" show-overflow-tooltip |
| | | :formatter="formattedNumber" /> |
| | | <el-table-column label="录入人" prop="entryPersonName" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="录入日期" prop="entryDate" width="120" show-overflow-tooltip /> |
| | | <el-table-column label="签订日期" prop="executionDate" width="120" show-overflow-tooltip /> |
| | | <el-table-column fixed="right" label="操作" min-width="200" align="center"> |
| | | <el-table-column fixed="right" label="操作" min-width="150" align="center"> |
| | | <template #default="scope"> |
| | | <el-button link type="primary" size="small" :disabled="scope.row.invoiceTotal>0 || scope.row.entryPersonName !== userStore.nickName" @click="openForm('edit', scope.row)">编辑</el-button> |
| | | <el-button link type="primary" size="small" @click="openForm('edit', scope.row)">编辑</el-button> |
| | | <!-- <el-button link type="primary" size="small" @click="openForm('view', scope.row)">详情</el-button>--> |
| | | <el-button link type="primary" size="small" @click="downLoadFile(scope.row)">附件</el-button> |
| | | <el-button link type="primary" size="small" @click="openDeliveryForm(scope.row)">发货</el-button> |
| | |
| | | <el-col :span="12"> |
| | | <el-form-item label="录入日期:" prop="entryDate"> |
| | | <el-date-picker style="width: 100%" v-model="form.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" |
| | | type="date" placeholder="请选择" clearable disabled /> |
| | | type="date" placeholder="请选择" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="12"> |
| | | <el-form-item label="付款方式"> |
| | | <el-input v-model="form.paymentMethod" placeholder="请输入" clearable :disabled="operationType === 'view'" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="销售类型:" prop="salesType"> |
| | | <el-select |
| | | v-model="form.salesType" |
| | | placeholder="请选择" |
| | | clearable |
| | | :disabled="operationType === 'view'" |
| | | style="width: 100%" |
| | | > |
| | | <el-option label="普通" value="普通" /> |
| | | <el-option label="紧急" value="紧急" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | <el-form-item v-if="operationType !== 'view'"> |
| | | <template #label> |
| | | <span>审批人选择:</span> |
| | | <el-button type="primary" @click="addApproverNode" style="margin-left: 8px;">新增节点</el-button> |
| | | </template> |
| | | <div style="display: flex; align-items: flex-end; flex-wrap: wrap;"> |
| | | <div |
| | | v-for="(node, index) in approverNodes" |
| | | :key="node.id" |
| | | style="margin-right: 30px; text-align: center; margin-bottom: 10px;" |
| | | > |
| | | <div> |
| | | <span>审批人</span> |
| | | → |
| | | </div> |
| | | <el-select |
| | | v-model="node.userId" |
| | | placeholder="选择人员" |
| | | style="width: 140px; margin-bottom: 8px;" |
| | | > |
| | | <el-option |
| | | v-for="user in userList" |
| | | :key="user.userId" |
| | | :label="user.nickName" |
| | | :value="user.userId" |
| | | /> |
| | | </el-select> |
| | | <div> |
| | | <el-button |
| | | type="danger" |
| | | size="small" |
| | | @click="removeApproverNode(index)" |
| | | v-if="approverNodes.length > 1" |
| | | >删除</el-button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <div class="company-name">鼎诚瑞实业有限责任公司</div> |
| | | <div class="document-title">零售发货单</div> |
| | | </div> |
| | | |
| | | |
| | | <div class="info-section"> |
| | | <div class="info-row"> |
| | | <div> |
| | |
| | | <span class="value">{{ formatDate(item.createTime) }}</span> |
| | | </div> |
| | | <div> |
| | | |
| | | |
| | | <span class="label">客户名称:</span> |
| | | <span class="value">{{ item.customerName || '张爱有' }}</span> |
| | | </div> |
| | |
| | | <span class="value">{{ item.salesContractNo }}</span> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | <div class="table-section"> |
| | | <table class="product-table"> |
| | | <thead> |
| | |
| | | </tfoot> |
| | | </table> |
| | | </div> |
| | | |
| | | |
| | | <div class="footer-section"> |
| | | <div class="footer-row"> |
| | | <div class="footer-item"> |
| | |
| | | import pagination from "@/components/PIMTable/Pagination.vue"; |
| | | import {onMounted, ref} from "vue"; |
| | | import { addShippingInfo } from "@/api/salesManagement/deliveryLedger.js"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import {ElMessage, ElMessageBox} from "element-plus"; |
| | | import useUserStore from "@/store/modules/user"; |
| | | import { userListNoPage } from "@/api/system/user.js"; |
| | | import FileList from "./fileList.vue"; |
| | |
| | | delLedger, |
| | | addOrUpdateSalesLedgerProduct, |
| | | delProduct, |
| | | delLedgerFile, |
| | | delLedgerFile, getProductInventory, |
| | | } from "@/api/salesManagement/salesLedger.js"; |
| | | import { modelList, productTreeList } from "@/api/basicData/product.js"; |
| | | import useFormData from "@/hooks/useFormData.js"; |
| | | import dayjs from "dayjs"; |
| | | import { |
| | | getStockInPage |
| | | } from "@/api/inventoryManagement/stockIn.js"; |
| | | |
| | | |
| | | const userStore = useUserStore(); |
| | | const { proxy } = getCurrentInstance(); |
| | |
| | | }); |
| | | const total = ref(0); |
| | | const fileList = ref([]); |
| | | const approverNodes = ref([{ id: 1, userId: null }]); |
| | | let nextApproverId = 2; |
| | | |
| | | // 用户信息表单弹框数据 |
| | | const operationType = ref(""); |
| | |
| | | productData: [], |
| | | executionDate: "", |
| | | paymentMethod: "", |
| | | salesType: "普通", |
| | | }, |
| | | rules: { |
| | | salesType: [{ required: true, message: "请选择销售类型", trigger: "change" }], |
| | | salesman: [{ required: true, message: "请选择", trigger: "change" }], |
| | | customerContractNo: [ |
| | | { required: true, message: "请输入", trigger: "blur" }, |
| | |
| | | }); |
| | | const { form, rules } = toRefs(data); |
| | | const { form: searchForm } = useFormData(data.searchForm); |
| | | const addApproverNode = () => { |
| | | approverNodes.value.push({ id: nextApproverId++, userId: null }); |
| | | }; |
| | | const removeApproverNode = (index) => { |
| | | approverNodes.value.splice(index, 1); |
| | | }; |
| | | // 产品表单弹框数据 |
| | | const productFormVisible = ref(false); |
| | | const productOperationType = ref(""); |
| | |
| | | |
| | | // 发货相关 |
| | | const deliveryFormVisible = ref(false); |
| | | const currentDeliveryRow = ref(null); |
| | | const currentDeliveryContext = ref(null); |
| | | const deliveryFormData = reactive({ |
| | | deliveryForm: { |
| | | shippingDate: "", |
| | |
| | | operationType.value = type; |
| | | form.value = {}; |
| | | productData.value = []; |
| | | approverNodes.value = [{ id: 1, userId: null }]; |
| | | nextApproverId = 2; |
| | | let userLists = await userListNoPage(); |
| | | userList.value = userLists.data; |
| | | customerList().then((res) => { |
| | |
| | | getSalesLedgerWithProducts({ id: row.id, type: 1 }).then((res) => { |
| | | form.value = { ...res }; |
| | | form.value.entryPerson = Number(res.entryPerson); |
| | | if (!form.value.salesType) { |
| | | form.value.salesType = "普通"; |
| | | } |
| | | productData.value = form.value.productData; |
| | | fileList.value = form.value.salesLedgerFiles; |
| | | const approveUserIds = form.value.approveUserIds || form.value.approverIds; |
| | | if (approveUserIds) { |
| | | const ids = String(approveUserIds) |
| | | .split(",") |
| | | .map((id) => Number(id.trim())) |
| | | .filter((id) => !Number.isNaN(id)); |
| | | if (ids.length > 0) { |
| | | approverNodes.value = ids.map((id, idx) => ({ id: idx + 1, userId: id })); |
| | | nextApproverId = ids.length + 1; |
| | | } |
| | | } |
| | | }); |
| | | } |
| | | // let userAll = await userStore.getInfo() |
| | |
| | | // } |
| | | // }); |
| | | form.value.entryDate = getCurrentDate(); // 设置默认录入日期为当前日期 |
| | | if (type === "add") { |
| | | form.value.salesType = "普通"; |
| | | } |
| | | dialogFormVisible.value = true; |
| | | }; |
| | | function changs(val) { |
| | |
| | | const submitForm = () => { |
| | | proxy.$refs["formRef"].validate((valid) => { |
| | | if (valid) { |
| | | if (operationType.value !== "view") { |
| | | const hasEmptyApprover = approverNodes.value.some((node) => !node.userId); |
| | | if (hasEmptyApprover) { |
| | | proxy.$modal.msgWarning("请为所有审批节点选择审批人"); |
| | | return; |
| | | } |
| | | form.value.approveUserIds = approverNodes.value.map((node) => node.userId).join(","); |
| | | } |
| | | console.log('productData.value--', productData.value) |
| | | if (productData.value !== null && productData.value.length > 0) { |
| | | form.value.productData = proxy.HaveJson(productData.value); |
| | |
| | | proxy.$modal.msgWarning("请选择要打印的数据"); |
| | | return; |
| | | } |
| | | |
| | | |
| | | // 显示加载状态 |
| | | proxy.$modal.loading("正在获取产品数据,请稍候..."); |
| | | |
| | | |
| | | try { |
| | | // 为每个选中的销售台账记录查询对应的产品数据 |
| | | const printDataWithProducts = []; |
| | | |
| | | |
| | | for (const row of selectedRows.value) { |
| | | try { |
| | | // 调用productList接口查询产品数据 |
| | | const productRes = await productList({ salesLedgerId: row.id, type: 1 }); |
| | | |
| | | |
| | | // 将产品数据整合到销售台账记录中 |
| | | const rowWithProducts = { |
| | | ...row, |
| | | products: productRes.data || [] |
| | | }; |
| | | |
| | | |
| | | printDataWithProducts.push(rowWithProducts); |
| | | } catch (error) { |
| | | console.error(`获取销售台账 ${row.id} 的产品数据失败:`, error); |
| | |
| | | }); |
| | | } |
| | | } |
| | | |
| | | |
| | | printData.value = printDataWithProducts; |
| | | console.log('打印数据(包含产品):', printData.value); |
| | | printPreviewVisible.value = true; |
| | | |
| | | |
| | | } catch (error) { |
| | | console.error('获取产品数据失败:', error); |
| | | proxy.$modal.msgError("获取产品数据失败,请重试"); |
| | |
| | | const executePrint = () => { |
| | | console.log('开始执行打印,数据条数:', printData.value.length); |
| | | console.log('打印数据:', printData.value); |
| | | |
| | | |
| | | // 创建一个新的打印窗口 |
| | | const printWindow = window.open('', '_blank', 'width=800,height=600'); |
| | | |
| | | |
| | | // 构建打印内容 |
| | | let printContent = ` |
| | | <!DOCTYPE html> |
| | |
| | | </head> |
| | | <body> |
| | | `; |
| | | |
| | | |
| | | // 为每条数据生成打印页面 |
| | | printData.value.forEach((item, index) => { |
| | | printContent += ` |
| | |
| | | <div class="company-name">鼎诚瑞实业有限责任公司</div> |
| | | <div class="document-title">零售发货单</div> |
| | | </div> |
| | | |
| | | |
| | | <div class="info-section"> |
| | | <div class="info-row"> |
| | | <div> |
| | |
| | | </tr> |
| | | </thead> |
| | | <tbody> |
| | | ${item.products && item.products.length > 0 ? |
| | | ${item.products && item.products.length > 0 ? |
| | | item.products.map(product => ` |
| | | <tr> |
| | | <td>${product.productCategory || ''}</td> |
| | |
| | | <td>${product.quantity || '0'}</td> |
| | | <td>${product.taxInclusiveTotalPrice || '0'}</td> |
| | | </tr> |
| | | `).join('') : |
| | | `).join('') : |
| | | '<tr><td colspan="6" style="text-align: center; color: #999;">暂无产品数据</td></tr>' |
| | | } |
| | | </tbody> |
| | |
| | | </div> |
| | | `; |
| | | }); |
| | | |
| | | |
| | | printContent += ` |
| | | </body> |
| | | </html> |
| | | `; |
| | | |
| | | |
| | | // 写入内容到新窗口 |
| | | printWindow.document.write(printContent); |
| | | printWindow.document.close(); |
| | | |
| | | |
| | | // 等待内容加载完成后打印 |
| | | printWindow.onload = () => { |
| | | setTimeout(() => { |
| | |
| | | // 根据含税总价计算含税单价和数量 |
| | | const calculateFromTotalPrice = () => { |
| | | if (isCalculating.value) return; |
| | | |
| | | |
| | | const totalPrice = parseFloat(productForm.value.taxInclusiveTotalPrice); |
| | | const quantity = parseFloat(productForm.value.quantity); |
| | | |
| | | |
| | | if (!totalPrice || !quantity || quantity <= 0) { |
| | | return; |
| | | } |
| | | |
| | | |
| | | isCalculating.value = true; |
| | | |
| | | |
| | | // 计算含税单价 = 含税总价 / 数量 |
| | | productForm.value.taxInclusiveUnitPrice = (totalPrice / quantity).toFixed(2); |
| | | |
| | | |
| | | // 如果有税率,计算不含税总价 |
| | | if (productForm.value.taxRate) { |
| | | productForm.value.taxExclusiveTotalPrice = |
| | |
| | | productForm.value.taxRate |
| | | ); |
| | | } |
| | | |
| | | |
| | | isCalculating.value = false; |
| | | }; |
| | | |
| | |
| | | return; |
| | | } |
| | | if (isCalculating.value) return; |
| | | |
| | | |
| | | const exclusiveTotalPrice = parseFloat(productForm.value.taxExclusiveTotalPrice); |
| | | const quantity = parseFloat(productForm.value.quantity); |
| | | const taxRate = parseFloat(productForm.value.taxRate); |
| | | |
| | | |
| | | if (!exclusiveTotalPrice || !quantity || quantity <= 0 || !taxRate) { |
| | | return; |
| | | } |
| | | |
| | | |
| | | isCalculating.value = true; |
| | | |
| | | |
| | | // 先计算含税总价 = 不含税总价 / (1 - 税率/100) |
| | | const taxRateDecimal = taxRate / 100; |
| | | const inclusiveTotalPrice = exclusiveTotalPrice / (1 - taxRateDecimal); |
| | | productForm.value.taxInclusiveTotalPrice = inclusiveTotalPrice.toFixed(2); |
| | | |
| | | |
| | | // 计算含税单价 = 含税总价 / 数量 |
| | | productForm.value.taxInclusiveUnitPrice = (inclusiveTotalPrice / quantity).toFixed(2); |
| | | |
| | | |
| | | isCalculating.value = false; |
| | | }; |
| | | |
| | |
| | | return; |
| | | } |
| | | if (isCalculating.value) return; |
| | | |
| | | |
| | | const quantity = parseFloat(productForm.value.quantity); |
| | | const unitPrice = parseFloat(productForm.value.taxInclusiveUnitPrice); |
| | | |
| | | |
| | | if (!quantity || quantity <= 0 || !unitPrice) { |
| | | return; |
| | | } |
| | | |
| | | |
| | | isCalculating.value = true; |
| | | |
| | | |
| | | // 计算含税总价 |
| | | productForm.value.taxInclusiveTotalPrice = (unitPrice * quantity).toFixed(2); |
| | | |
| | | |
| | | // 如果有税率,计算不含税总价 |
| | | if (productForm.value.taxRate) { |
| | | productForm.value.taxExclusiveTotalPrice = |
| | |
| | | productForm.value.taxRate |
| | | ); |
| | | } |
| | | |
| | | |
| | | isCalculating.value = false; |
| | | }; |
| | | |
| | |
| | | return; |
| | | } |
| | | if (isCalculating.value) return; |
| | | |
| | | |
| | | const quantity = parseFloat(productForm.value.quantity); |
| | | const unitPrice = parseFloat(productForm.value.taxInclusiveUnitPrice); |
| | | |
| | | |
| | | if (!quantity || quantity <= 0 || !unitPrice) { |
| | | return; |
| | | } |
| | | |
| | | |
| | | isCalculating.value = true; |
| | | |
| | | |
| | | // 计算含税总价 |
| | | productForm.value.taxInclusiveTotalPrice = (unitPrice * quantity).toFixed(2); |
| | | |
| | | |
| | | // 如果有税率,计算不含税总价 |
| | | if (productForm.value.taxRate) { |
| | | productForm.value.taxExclusiveTotalPrice = |
| | |
| | | productForm.value.taxRate |
| | | ); |
| | | } |
| | | |
| | | |
| | | isCalculating.value = false; |
| | | }; |
| | | |
| | |
| | | return; |
| | | } |
| | | if (isCalculating.value) return; |
| | | |
| | | |
| | | const inclusiveTotalPrice = parseFloat(productForm.value.taxInclusiveTotalPrice); |
| | | const taxRate = parseFloat(productForm.value.taxRate); |
| | | |
| | | |
| | | if (!inclusiveTotalPrice || !taxRate) { |
| | | return; |
| | | } |
| | | |
| | | |
| | | isCalculating.value = true; |
| | | |
| | | |
| | | // 计算不含税总价 |
| | | productForm.value.taxExclusiveTotalPrice = |
| | | proxy.calculateTaxExclusiveTotalPrice( |
| | | inclusiveTotalPrice, |
| | | taxRate |
| | | ); |
| | | |
| | | |
| | | isCalculating.value = false; |
| | | }; |
| | | /** |
| | |
| | | |
| | | // 打开发货弹框 |
| | | const openDeliveryForm = (row) => { |
| | | currentDeliveryRow.value = row; |
| | | deliveryForm.value = { |
| | | shippingDate: getCurrentDate(), |
| | | shippingCarNumber: "", |
| | | }; |
| | | deliveryFormVisible.value = true; |
| | | getProductInventory({ salesLedgerId: row.id, type:1 }).then((res) => { |
| | | currentDeliveryRow.value = row; |
| | | deliveryForm.value = { |
| | | shippingDate: getCurrentDate(), |
| | | shippingCarNumber: "", |
| | | }; |
| | | deliveryFormVisible.value = true; |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg); |
| | | }); |
| | | }; |
| | | |
| | | // 提交发货表单 |
| | |
| | | proxy.$refs["deliveryFormRef"].validate((valid) => { |
| | | if (valid) { |
| | | addShippingInfo({ |
| | | salesLedgerId: currentDeliveryRow.value.id, |
| | | salesLedgerId: currentDeliveryContext.value.parentRow.id, |
| | | salesLedgerProductId: currentDeliveryContext.value.productRow.id, |
| | | shippingDate: deliveryForm.value.shippingDate, |
| | | shippingCarNumber: deliveryForm.value.shippingCarNumber, |
| | | }) |
| | | .then(() => { |
| | | proxy.$modal.msgSuccess("发货成功"); |
| | | closeDeliveryDia(); |
| | | getList(); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msgError("发货失败,请重试"); |
| | |
| | | const closeDeliveryDia = () => { |
| | | proxy.resetForm("deliveryFormRef"); |
| | | deliveryFormVisible.value = false; |
| | | currentDeliveryRow.value = null; |
| | | currentDeliveryContext.value = null; |
| | | }; |
| | | |
| | | onMounted(() => { |
| | |
| | | padding: 15px; |
| | | border-bottom: 1px solid #e4e7ed; |
| | | text-align: center; |
| | | |
| | | |
| | | .el-button { |
| | | margin: 0 10px; |
| | | } |
| | | } |
| | | |
| | | |
| | | .print-preview-content { |
| | | padding: 20px; |
| | | background-color: #f5f5f5; |
| | |
| | | .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; |
| | |
| | | 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; |
| | |
| | | .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; |
| | |
| | | font-size: 14px; |
| | | line-height: 1.4; |
| | | } |
| | | |
| | | |
| | | th { |
| | | font-weight: bold; |
| | | } |
| | | |
| | | |
| | | .total-label { |
| | | text-align: right; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | |
| | | .total-value { |
| | | font-weight: bold; |
| | | } |
| | |
| | | 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; |
| | |
| | | .app-container { |
| | | display: none; |
| | | } |
| | | |
| | | |
| | | .print-page { |
| | | box-shadow: none; |
| | | margin: 0; |