请款页面打印样式 及小调整

src/components/process/PurchasePayment.vue

@@ -257,6 +257,7 @@ const rules = ref({
   // accountManagementId: [{ required: true, message: "请选择付款账户", trigger: "change" }],
   purchaseId: [{ required: true, message: "请选择采购合同", trigger: "change" }],
   money: [{ required: true, message: "请输入付款金额", trigger: "blur" }],
+  name: [{ required: true, message: "请输入户名", trigger: "blur" }],
 });
 const fileList = ref([]);
 const uploadData = ref({});

src/components/process/SendFunds.vue

@@ -193,205 +193,197 @@
       </el-row>
     </el-form>
 
-    <el-dialog title="查看" v-if="openPrint" v-model="openPrint" width="680px">
-      <div id="pdfDom" style="width: 616px">
-        <div style="margin: 16px 8px; border: 1px solid black; font-size: 12px !important; color: black">
-          <div style="font-size: 16px; font-weight: 700; text-align: center; padding: 8px">
-            <span>{{ printDetails.corporationName }}</span>
-            <span style="margin-left: 16px">{{ dictDataEcho(printDetails.type, fundsType) }}审批单</span>
-          </div>
-          <div class="baseRow"></div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款部门</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.deptName }}
-            </div>
-            <div class="contentRow" style="width: 80px">货币</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictDataEcho(printDetails.currency, currencyType) }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款时间</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.createTime }}
-            </div>
-            <div class="contentRow" style="width: 80px">发票类型</div>
-            <div class="contentRow" style="width: calc(50% - 80px)"></div>
+    <el-dialog title="查看" v-if="openPrint" v-model="openPrint" width="840px">
+      <div id="pdfDom" style="width: 776px">
+        <div style="padding: 60px 30px; font-size: 12px !important; color: black">
+          <div style="font-size: 16px; text-align: center; padding: 8px">
+            <span>{{ dictDataEcho(printDetails.type, fundsType) }}审批单</span>
           </div>
-          <div class="baseRow" style="display: flex" v-if="printDetails.type == '3'">
-            <div class="contentRow" style="width: 80px">预支单</div>
-            <div class="contentRow" style="width: calc(100% - 80px)">
-              {{ printDetails.advanceText }}
-            </div>
+          <div style="padding: 8px 0">
+            <span>{{ printDetails.corporationName }}</span>
+            <span style="padding-left: 32px">创建时间: {{ printDetails.createTime }}</span>
           </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款说明</div>
-            <div class="contentRow" style="width: calc(100% - 80px)">
-              {{ printDetails.paymentRemarks }}
+          <div style="border: 1px solid black">
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">创建人</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ dictValueLabel(printDetails.createUser, userList) }}
+              </div>
             </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">凭证</div>
-            <div class="contentRow" style="width: calc(100% - 80px)"></div>
-          </div>
-          <div class="specialRow">
-            <span>请款明细</span>
-          </div>
-          <div v-if="printDetails.type == '3'">
-            <div v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%">费用类型</div>
-                <div class="contentRow" style="width: 17%">关联合同</div>
-                <div class="contentRow" style="width: 17%">预支金额</div>
-                <div class="contentRow" style="width: 32%">核销说明</div>
-                <div class="contentRow" style="width: 17%">核销金额</div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">创建人部门</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ printDetails.deptName }}
               </div>
-              <div v-for="item in printDetails.accountRequestFundsDetailList" :key="item.id">
-                <div class="baseRow" style="display: flex">
-                  <div class="contentRow" style="width: 17%">
-                    {{ dictDataEcho(item.costType, fundsCostType) }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.contractCode }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.advanceAmount }}
-                  </div>
-                  <div class="contentRow" style="width: 32%">
-                    {{ item.remarks }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.amount }}
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-if="printDetails.type !== '3'">
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">费用明细</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">费用类型</div>
+                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; text-align: center">关联合同</div>
+                  <div style="width: calc(100% - 360px); padding: 4px 8px; border-right: 1px solid black; text-align: center">款项说明</div>
+                  <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; text-align: center">货币</div>
+                  <div style="width: 100px; padding: 4px 8px; text-align: center">付款金额</div>
+                </div>
+                <template v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
+                  <div v-for="(item, index) in printDetails.accountRequestFundsDetailList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.accountRequestFundsDetailList.length ? 'border-bottom: 1px solid black;  display: flex' : ' display: flex'
+                      ">
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">
+                        {{ dictDataEcho(item.costType, fundsCostType) }}
+                      </div>
+                      <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.contractCode }}
+                      </div>
+                      <div style="width: calc(100% - 360px); padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.remarks }}
+                      </div>
+                      <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ dictDataEcho(printDetails.currency, currencyType) }}
+                      </div>
+                      <div style="width: 100px; padding: 4px 8px; display: flex; align-items: center">
+                        {{ item.amount }}
+                      </div>
+                    </div>
                   </div>
+                </template>
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-else>
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">费用明细</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">费用类型</div>
+                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; text-align: center">关联合同</div>
+                  <div style="width: calc(100% - 420px); padding: 4px 8px; border-right: 1px solid black; text-align: center">款项说明</div>
+                  <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; text-align: center">货币</div>
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">预支金额</div>
+                  <div style="width: 80px; padding: 4px 8px; text-align: center">付款金额</div>
                 </div>
+                <template v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
+                  <div v-for="(item, index) in printDetails.accountRequestFundsDetailList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.accountRequestFundsDetailList.length ? 'border-bottom: 1px solid black;  display: flex' : ' display: flex'
+                      ">
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">
+                        {{ dictDataEcho(item.costType, fundsCostType) }}
+                      </div>
+                      <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.contractCode }}
+                      </div>
+                      <div style="width: calc(100% - 420px); padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.remarks }}
+                      </div>
+                      <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ dictDataEcho(printDetails.currency, currencyType) }}
+                      </div>
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.advanceAmount }}
+                      </div>
+                      <div style="width: 80px; padding: 4px 8px; display: flex; align-items: center">
+                        {{ item.amount }}
+                      </div>
+                    </div>
+                  </div>
+                </template>
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-if="printDetails.type !== '3'">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">总报销金额</div>
+              <div style="width: calc(100% - 126px); display: flex">
+                <div style="width: calc(100% - 100px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("amount")) }}</div>
+                <div style="width: 100px; padding: 8px">{{ computeMoney("amount") }}</div>
               </div>
             </div>
             <div v-else>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%">费用类型</div>
-                <div class="contentRow" style="width: 17%">关联合同</div>
-                <div class="contentRow" style="width: 17%">预支金额</div>
-                <div class="contentRow" style="width: 32%">核销说明</div>
-                <div class="contentRow" style="width: 17%">核销金额</div>
+              <div style="display: flex; border-bottom: 1px solid black">
+                <div style="display: flex; border-bottom: 1px solid black">
+                  <div style="width: 126px; border-right: 1px solid black; padding: 8px">核销总金额</div>
+                  <div style="width: calc(100% - 126px); display: flex">
+                    <div style="width: calc(100% - 100px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("amount")) }}</div>
+                    <div style="width: 100px; padding: 8px">{{ computeMoney("amount") }}</div>
+                  </div>
+                </div>
+                <div style="width: 126px; border-right: 1px solid black; padding: 8px">预支总金额</div>
+                <div style="width: calc(100% - 126px); display: flex">
+                  <div style="width: calc(100% - 100px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("advanceAmount")) }}</div>
+                  <div style="width: 100px; padding: 8px">{{ computeMoney("advanceAmount") }}</div>
+                </div>
               </div>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 32%"></div>
-                <div class="contentRow" style="width: 17%"></div>
+              <div style="display: flex; border-bottom: 1px solid black">
+                <div style="width: 126px; border-right: 1px solid black; padding: 8px">差额 (核销 - 预支)</div>
+                <div style="width: calc(100% - 126px); display: flex">
+                  <div style="width: calc(100% - 100px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeBalance()) }}</div>
+                  <div style="width: 100px; padding: 8px">{{ computeBalance() }}</div>
+                </div>
               </div>
             </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">预支总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.advanceAmounts }}</div>
-              <div class="contentRow" style="width: 80px">核销总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.total }}</div>
-            </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">差额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)"></div>
-              <div class="contentRow" style="width: 80px">单证数量</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.quantity }}</div>
-            </div>
-          </div>
-          <div v-else>
-            <div v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%">费用类型</div>
-                <div class="contentRow" style="width: 25%">关联合同</div>
-                <div class="contentRow" style="width: 25%">款项说明</div>
-                <div class="contentRow" style="width: 25%">请款金额</div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">单据数量</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ printDetails.quantity }}
               </div>
-              <div v-for="item in printDetails.accountRequestFundsDetailList" :key="item.id">
-                <div class="baseRow" style="display: flex">
-                  <div class="contentRow" style="width: 25%">
-                    {{ dictDataEcho(item.costType, fundsCostType) }}
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 0 8px; display: flex; align-items: center">收款信息</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; text-align: center">支付方式</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">收款方户名</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">开户行</div>
+                  <div style="width: 27%; padding: 0 8px; text-align: center">收款方账号</div>
+                </div>
+                <div style="display: flex">
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ dictDataEcho(printDetails.paymentMethod, fundsPaymentMethod) }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.contractCode }}
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ printDetails.name }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.remarks }}
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ printDetails.openingBank }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.amount }}
+                  <div style="width: 27%; padding: 0 8px; display: flex; align-items: center">
+                    {{ printDetails.accountOpening }}
                   </div>
                 </div>
               </div>
             </div>
-            <div v-else>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%">费用类型</div>
-                <div class="contentRow" style="width: 25%">关联合同</div>
-                <div class="contentRow" style="width: 25%">款项说明</div>
-                <div class="contentRow" style="width: 25%">请款金额</div>
-              </div>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-              </div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">电子发票(PDF/JPG)</div>
+              <div style="width: calc(100% - 126px); padding: 8px">{{ printDetails.electronicInvoiceText }}</div>
             </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">请款总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">
-                {{ printDetails.total }}
-              </div>
-              <div class="contentRow" style="width: 80px">单证数量</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">
-                {{ printDetails.quantity }}
+            <div style="display: flex">
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">审批流程</div>
+              <div style="width: calc(100% - 126px)">
+                <template v-if="printDetails.recordList && printDetails.recordList.length > 0">
+                  <div v-for="(item, index) in printDetails.recordList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.recordList.length
+                          ? 'border-bottom: 1px solid black; padding: 4px 8px; display: flex'
+                          : 'padding: 4px 8px; display: flex'
+                      ">
+                      <div style="width: calc(100% - 120px); word-wrap: break-word">
+                        <span>{{ item.nodeName }}: </span>
+                        <span style="padding-left: 4px">{{ item.processedUser }}</span>
+                        <span style="padding-left: 4px">{{ item.remark }}</span>
+                      </div>
+                      <div style="width: 120px">{{ item.processedDate }}</div>
+                    </div>
+                  </div>
+                </template>
               </div>
             </div>
           </div>
-          <div class="specialRow">
-            <span>付款明细</span>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">付款方式</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictDataEcho(printDetails.paymentMethod, fundsPaymentMethod) }}
-            </div>
-            <div class="contentRow" style="width: 80px">付款账户</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictValueLabel(printDetails.accountManagementId, accountData) }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">户名</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.name }}
-            </div>
-            <div class="contentRow" style="width: 80px">开户银行</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.openingBank }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">账号</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.accountOpening }}
-            </div>
-            <div class="contentRow" style="width: 80px">联行号</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.interbankNumber }}
-            </div>
+          <div style="padding-top: 16px">
+            <span>打印时间: {{ presentTime }}</span>
+            <span style="padding-left: 32px">打印人: {{ useUserStore().user.nickName }}</span>
           </div>
-          <div class="specialRow">
-            <span>审批记录</span>
-          </div>
-          <template v-if="printDetails.recordList && printDetails.recordList.length > 0">
-            <div class="baseRow" style="display: flex" v-for="(item, index) in printDetails.recordList" :key="index">
-              <div class="contentRow" style="width: 80px">{{ item.nodeName }}</div>
-              <div class="contentRow" style="width: calc(100% - 330px)">
-                <span v-if="item.remark">{{ item.remark }}</span>
-              </div>
-              <div class="contentRow" style="width: 110px">{{ item.processedUser }}</div>
-              <div class="contentRow" style="width: 140px">{{ item.processedDate }}</div>
-            </div>
-          </template>
         </div>
       </div>
       <template #footer>
@@ -406,6 +398,7 @@
 import { ElMessage } from "element-plus";
 import useUserStore from "@/store/modules/user";
 import { useRoute } from "vue-router";
+import moment from "moment";
 
 const route = useRoute();
 const { proxy } = getCurrentInstance();
@@ -413,6 +406,7 @@ const defaultProps = {
   children: "children",
   label: "deptName",
 };
+const userList = ref([]);
 const formData = reactive({
   data: {
     paymentTime: "",
@@ -611,6 +605,23 @@ const getDictData = () => {
     .then((res) => {
       advanceList.value = res.rows;
     });
+  proxy
+    .get("/tenantUser/list", {
+      pageNum: 1,
+      pageSize: 10000,
+      tenantId: useUserStore().user.tenantId,
+    })
+    .then((res) => {
+      if (res.rows && res.rows.length > 0) {
+        userList.value = res.rows.map((item) => {
+          return {
+            deptId: item.deptId,
+            label: item.nickName,
+            value: item.userId,
+          };
+        });
+      }
+    });
 };
 getDictData();
 const recursive = (data) => {
@@ -697,6 +708,7 @@ const changeType = () => {
 };
 const openPrint = ref(false);
 const printDetails = ref({});
+const presentTime = ref("");
 const changeAdvanceId = (val) => {
   if (val) {
     proxy.post("/accountRequestFunds/detail", { id: val }).then((res) => {
@@ -719,6 +731,15 @@ const changeAdvanceId = (val) => {
               url: item.fileUrl,
             };
           });
+          let electronicInvoiceText = "";
+          for (let i = 0; i < resFile[val].length; i++) {
+            if (i === 0) {
+              electronicInvoiceText = resFile[val][0].fileName;
+            } else {
+              electronicInvoiceText = electronicInvoiceText + ", " + resFile[val][i].fileName;
+            }
+          }
+          printDetails.value.electronicInvoiceText = electronicInvoiceText;
         }
       });
       formData.data.accountRequestFundsDetailList = res.accountRequestFundsDetailList.map((item) => {
@@ -747,11 +768,86 @@ const clickDownload = () => {
 };
 const clickPrint = () => {
   if (formData.data.advanceId) {
+    presentTime.value = moment().format("yyyy-MM-DD HH:mm:ss");
     openPrint.value = true;
   } else {
     ElMessage("请选择关联预支");
   }
 };
+const computeMoney = (label) => {
+  let amount = 0;
+  if (printDetails.value.accountRequestFundsDetailList && printDetails.value.accountRequestFundsDetailList.length > 0) {
+    for (let i = 0; i < printDetails.value.accountRequestFundsDetailList.length; i++) {
+      if (printDetails.value.accountRequestFundsDetailList[i][label]) {
+        amount = Number(parseFloat(Number(amount) + Number(printDetails.value.accountRequestFundsDetailList[i][label])).toFixed(2));
+      }
+    }
+  }
+  return amount;
+};
+const toDx = (n) => {
+  //阿拉伯数字转换函数
+  switch (n) {
+    case "0":
+      return "零";
+    case "1":
+      return "壹";
+    case "2":
+      return "贰";
+    case "3":
+      return "叁";
+    case "4":
+      return "肆";
+    case "5":
+      return "伍";
+    case "6":
+      return "陆";
+    case "7":
+      return "柒";
+    case "8":
+      return "捌";
+    case "9":
+      return "玖";
+  }
+};
+const NumberToChinese = (m) => {
+  let unit = ["仟", "佰", "拾", "", "仟", "佰", "拾", "", "角", "分", "厘"];
+  m *= 1000;
+  m = Number(parseFloat(m).toFixed(0));
+  m += "";
+  var x = m.length;
+  var result = "";
+  for (var i = 0; i < x; i++) {
+    if (i == 3) {
+      result = "元" + result;
+    } else if (i == 7) {
+      result = "万" + result;
+    }
+    if (m.charAt(x - i - 1) == 0) {
+      if (i != 0 && i != 1 && i != 2) {
+        if (result.charAt(0) != "零" && result.charAt(0) != "元" && result.charAt(0) != "万") {
+          result = "零" + result;
+        }
+      }
+      continue;
+    }
+    result = toDx(m.charAt(x - i - 1)) + unit[unit.length - i - 1] + result;
+  }
+  result += result.charAt(result.length - 1) == "元" ? "整" : "";
+  return result;
+};
+const computeBalance = () => {
+  let balance = 0;
+  let advanceAmount = computeMoney("advanceAmount");
+  let amount = computeMoney("amount");
+  if (amount) {
+    balance = Number(amount);
+  }
+  if (advanceAmount) {
+    balance = Number(parseFloat(Number(balance) - Number(advanceAmount)).toFixed(2));
+  }
+  return balance;
+};
 </script>
 
 <style lang="scss" scoped>
@@ -762,21 +858,4 @@ const clickPrint = () => {
 ::v-deep(.el-input-number .el-input__inner) {
   text-align: left;
 }
-.baseRow {
-  min-height: 24px;
-  border-top: 1px solid black;
-}
-.contentRow {
-  border-right: 1px solid black;
-  line-height: 24px;
-  padding-left: 4px;
-}
-.specialRow {
-  font-size: 14px;
-  font-weight: 700;
-  text-align: center;
-  border-top: 1px solid black;
-  height: 30px;
-  line-height: 30px;
-}
 </style>

src/views/finance/fundManage/accountPayment/index.vue

@@ -113,10 +113,10 @@ const config = computed(() => {
         prop: "type",
       },
       render(type) {
-        if (type) {
+        if (type != '20') {
           return "请款: " + proxy.dictValueLabel(type, fundsType.value);
         } else {
-          return "采购付款";
+          return "采购付款 - 申请";
         }
       },
     },

src/views/finance/fundManage/funds/index.vue

@@ -23,205 +23,197 @@
       </byTable>
     </div>
 
-    <el-dialog title="打印" v-if="openPrint" v-model="openPrint" width="680px">
-      <div id="pdfDom" style="width: 616px">
-        <div style="margin: 16px 8px; border: 1px solid black; font-size: 12px !important; color: black">
-          <div style="font-size: 16px; font-weight: 700; text-align: center; padding: 8px">
-            <span>{{ printDetails.corporationName }}</span>
-            <span style="margin-left: 16px">{{ dictDataEcho(printDetails.type, fundsType) }}审批单</span>
+    <el-dialog title="打印" v-if="openPrint" v-model="openPrint" width="840px">
+      <div id="pdfDom" style="width: 776px">
+        <div style="padding: 60px 30px; font-size: 12px !important; color: black">
+          <div style="font-size: 16px; text-align: center; padding: 8px">
+            <span>{{ dictDataEcho(printDetails.type, fundsType) }}审批单</span>
           </div>
-          <div class="baseRow"></div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款部门</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.deptName }}
-            </div>
-            <div class="contentRow" style="width: 80px">货币</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictDataEcho(printDetails.currency, accountCurrency) }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款时间</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.createTime }}
-            </div>
-            <div class="contentRow" style="width: 80px">发票类型</div>
-            <div class="contentRow" style="width: calc(50% - 80px)"></div>
-          </div>
-          <div class="baseRow" style="display: flex" v-if="printDetails.type == '3'">
-            <div class="contentRow" style="width: 80px">预支单</div>
-            <div class="contentRow" style="width: calc(100% - 80px)">
-              {{ printDetails.advanceText }}
-            </div>
+          <div style="padding: 8px 0">
+            <span>{{ printDetails.corporationName }}</span>
+            <span style="padding-left: 32px">创建时间: {{ printDetails.createTime }}</span>
           </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">请款说明</div>
-            <div class="contentRow" style="width: calc(100% - 80px)">
-              {{ printDetails.paymentRemarks }}
+          <div style="border: 1px solid black">
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">创建人</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ dictValueLabel(printDetails.createUser, userList) }}
+              </div>
             </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">凭证</div>
-            <div class="contentRow" style="width: calc(100% - 80px)"></div>
-          </div>
-          <div class="specialRow">
-            <span>请款明细</span>
-          </div>
-          <div v-if="printDetails.type == '3'">
-            <div v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%">费用类型</div>
-                <div class="contentRow" style="width: 17%">关联合同</div>
-                <div class="contentRow" style="width: 17%">预支金额</div>
-                <div class="contentRow" style="width: 32%">核销说明</div>
-                <div class="contentRow" style="width: 17%">核销金额</div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">创建人部门</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ printDetails.deptName }}
               </div>
-              <div v-for="item in printDetails.accountRequestFundsDetailList" :key="item.id">
-                <div class="baseRow" style="display: flex">
-                  <div class="contentRow" style="width: 17%">
-                    {{ dictDataEcho(item.costType, fundsCostType) }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.contractCode }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.advanceAmount }}
-                  </div>
-                  <div class="contentRow" style="width: 32%">
-                    {{ item.remarks }}
-                  </div>
-                  <div class="contentRow" style="width: 17%">
-                    {{ item.amount }}
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-if="printDetails.type !== '3'">
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">费用明细</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">费用类型</div>
+                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; text-align: center">关联合同</div>
+                  <div style="width: calc(100% - 360px); padding: 4px 8px; border-right: 1px solid black; text-align: center">款项说明</div>
+                  <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; text-align: center">货币</div>
+                  <div style="width: 100px; padding: 4px 8px; text-align: center">付款金额</div>
+                </div>
+                <template v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
+                  <div v-for="(item, index) in printDetails.accountRequestFundsDetailList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.accountRequestFundsDetailList.length ? 'border-bottom: 1px solid black;  display: flex' : ' display: flex'
+                      ">
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">
+                        {{ dictDataEcho(item.costType, fundsCostType) }}
+                      </div>
+                      <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.contractCode }}
+                      </div>
+                      <div style="width: calc(100% - 360px); padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.remarks }}
+                      </div>
+                      <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ dictDataEcho(printDetails.currency, accountCurrency) }}
+                      </div>
+                      <div style="width: 100px; padding: 4px 8px; display: flex; align-items: center">
+                        {{ item.amount }}
+                      </div>
+                    </div>
                   </div>
+                </template>
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-else>
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">费用明细</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">费用类型</div>
+                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; text-align: center">关联合同</div>
+                  <div style="width: calc(100% - 420px); padding: 4px 8px; border-right: 1px solid black; text-align: center">款项说明</div>
+                  <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; text-align: center">货币</div>
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">预支金额</div>
+                  <div style="width: 80px; padding: 4px 8px; text-align: center">付款金额</div>
                 </div>
+                <template v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
+                  <div v-for="(item, index) in printDetails.accountRequestFundsDetailList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.accountRequestFundsDetailList.length ? 'border-bottom: 1px solid black;  display: flex' : ' display: flex'
+                      ">
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">
+                        {{ dictDataEcho(item.costType, fundsCostType) }}
+                      </div>
+                      <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.contractCode }}
+                      </div>
+                      <div style="width: calc(100% - 420px); padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.remarks }}
+                      </div>
+                      <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ dictDataEcho(printDetails.currency, accountCurrency) }}
+                      </div>
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                        {{ item.advanceAmount }}
+                      </div>
+                      <div style="width: 80px; padding: 4px 8px; display: flex; align-items: center">
+                        {{ item.amount }}
+                      </div>
+                    </div>
+                  </div>
+                </template>
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black" v-if="printDetails.type !== '3'">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">总报销金额</div>
+              <div style="width: calc(100% - 126px); display: flex">
+                <div style="width: calc(100% - 100px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("amount")) }}</div>
+                <div style="width: 100px; padding: 8px">{{ computeMoney("amount") }}</div>
               </div>
             </div>
             <div v-else>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%">费用类型</div>
-                <div class="contentRow" style="width: 17%">关联合同</div>
-                <div class="contentRow" style="width: 17%">预支金额</div>
-                <div class="contentRow" style="width: 32%">核销说明</div>
-                <div class="contentRow" style="width: 17%">核销金额</div>
+              <div style="display: flex; border-bottom: 1px solid black">
+                <div style="width: 126px; border-right: 1px solid black; padding: 8px">核销总金额</div>
+                <div style="width: calc(100% - 126px); display: flex">
+                  <div style="width: calc(100% - 80px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("amount")) }}</div>
+                  <div style="width: 80px; padding: 8px">{{ computeMoney("amount") }}</div>
+                </div>
               </div>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 17%"></div>
-                <div class="contentRow" style="width: 32%"></div>
-                <div class="contentRow" style="width: 17%"></div>
+              <div style="display: flex; border-bottom: 1px solid black">
+                <div style="width: 126px; border-right: 1px solid black; padding: 8px">预支总金额</div>
+                <div style="width: calc(100% - 126px); display: flex">
+                  <div style="width: calc(100% - 80px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney("advanceAmount")) }}</div>
+                  <div style="width: 80px; padding: 8px">{{ computeMoney("advanceAmount") }}</div>
+                </div>
+              </div>
+              <div style="display: flex; border-bottom: 1px solid black">
+                <div style="width: 126px; border-right: 1px solid black; padding: 8px">差额 (核销 - 预支)</div>
+                <div style="width: calc(100% - 126px); display: flex">
+                  <div style="width: calc(100% - 80px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeBalance()) }}</div>
+                  <div style="width: 80px; padding: 8px">{{ computeBalance() }}</div>
+                </div>
               </div>
             </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">预支总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.advanceAmounts }}</div>
-              <div class="contentRow" style="width: 80px">核销总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.total }}</div>
-            </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">差额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)"></div>
-              <div class="contentRow" style="width: 80px">单证数量</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">{{ printDetails.quantity }}</div>
-            </div>
-          </div>
-          <div v-else>
-            <div v-if="printDetails.accountRequestFundsDetailList && printDetails.accountRequestFundsDetailList.length > 0">
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%">费用类型</div>
-                <div class="contentRow" style="width: 25%">关联合同</div>
-                <div class="contentRow" style="width: 25%">款项说明</div>
-                <div class="contentRow" style="width: 25%">请款金额</div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">单据数量</div>
+              <div style="width: calc(100% - 126px); padding: 8px">
+                {{ printDetails.quantity }}
               </div>
-              <div v-for="item in printDetails.accountRequestFundsDetailList" :key="item.id">
-                <div class="baseRow" style="display: flex">
-                  <div class="contentRow" style="width: 25%">
-                    {{ dictDataEcho(item.costType, fundsCostType) }}
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 0 8px; display: flex; align-items: center">收款信息</div>
+              <div style="width: calc(100% - 126px)">
+                <div style="border-bottom: 1px solid black; display: flex">
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; text-align: center">支付方式</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">收款方户名</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">开户行</div>
+                  <div style="width: 27%; padding: 0 8px; text-align: center">收款方账号</div>
+                </div>
+                <div style="display: flex">
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ dictDataEcho(printDetails.paymentMethod, fundsPaymentMethod) }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.contractCode }}
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ printDetails.name }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.remarks }}
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                    {{ printDetails.openingBank }}
                   </div>
-                  <div class="contentRow" style="width: 25%">
-                    {{ item.amount }}
+                  <div style="width: 27%; padding: 0 8px; display: flex; align-items: center">
+                    {{ printDetails.accountOpening }}
                   </div>
                 </div>
               </div>
             </div>
-            <div v-else>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%">费用类型</div>
-                <div class="contentRow" style="width: 25%">关联合同</div>
-                <div class="contentRow" style="width: 25%">款项说明</div>
-                <div class="contentRow" style="width: 25%">请款金额</div>
-              </div>
-              <div class="baseRow" style="display: flex">
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-                <div class="contentRow" style="width: 25%"></div>
-              </div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 126px; border-right: 1px solid black; padding: 8px">电子发票(PDF/JPG)</div>
+              <div style="width: calc(100% - 126px); padding: 8px">{{ printDetails.electronicInvoiceText }}</div>
             </div>
-            <div class="baseRow" style="display: flex">
-              <div class="contentRow" style="width: 80px">请款总额</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">
-                {{ printDetails.total }}
-              </div>
-              <div class="contentRow" style="width: 80px">单证数量</div>
-              <div class="contentRow" style="width: calc(50% - 80px)">
-                {{ printDetails.quantity }}
+            <div style="display: flex">
+              <div style="width: 126px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">审批流程</div>
+              <div style="width: calc(100% - 126px)">
+                <template v-if="printDetails.recordList && printDetails.recordList.length > 0">
+                  <div v-for="(item, index) in printDetails.recordList" :key="index">
+                    <div
+                      :style="
+                        index + 1 !== printDetails.recordList.length
+                          ? 'border-bottom: 1px solid black; padding: 4px 8px; display: flex'
+                          : 'padding: 4px 8px; display: flex'
+                      ">
+                      <div style="width: calc(100% - 120px); word-wrap: break-word">
+                        <span>{{ item.nodeName }}: </span>
+                        <span style="padding-left: 4px">{{ item.processedUser }}</span>
+                        <span style="padding-left: 4px">{{ item.remark }}</span>
+                      </div>
+                      <div style="width: 120px">{{ item.processedDate }}</div>
+                    </div>
+                  </div>
+                </template>
               </div>
             </div>
           </div>
-          <div class="specialRow">
-            <span>付款明细</span>
+          <div style="padding-top: 16px">
+            <span>打印时间: {{ presentTime }}</span>
+            <span style="padding-left: 32px">打印人: {{ useUserStore().user.nickName }}</span>
           </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">付款方式</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictDataEcho(printDetails.paymentMethod, fundsPaymentMethod) }}
-            </div>
-            <div class="contentRow" style="width: 80px">付款账户</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ dictValueLabel(printDetails.accountManagementId, accountData) }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">户名</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.name }}
-            </div>
-            <div class="contentRow" style="width: 80px">开户银行</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.openingBank }}
-            </div>
-          </div>
-          <div class="baseRow" style="display: flex">
-            <div class="contentRow" style="width: 80px">账号</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.accountOpening }}
-            </div>
-            <div class="contentRow" style="width: 80px">联行号</div>
-            <div class="contentRow" style="width: calc(50% - 80px)">
-              {{ printDetails.interbankNumber }}
-            </div>
-          </div>
-          <div class="specialRow">
-            <span>审批记录</span>
-          </div>
-          <template v-if="printDetails.recordList && printDetails.recordList.length > 0">
-            <div class="baseRow" style="display: flex" v-for="(item, index) in printDetails.recordList" :key="index">
-              <div class="contentRow" style="width: 80px">{{ item.nodeName }}</div>
-              <div class="contentRow" style="width: calc(100% - 330px)">
-                <span v-if="item.remark">{{ item.remark }}</span>
-              </div>
-              <div class="contentRow" style="width: 110px">{{ item.processedUser }}</div>
-              <div class="contentRow" style="width: 140px">{{ item.processedDate }}</div>
-            </div>
-          </template>
         </div>
       </div>
       <template #footer>
@@ -236,6 +228,7 @@
 import byTable from "@/components/byTable/index";
 import useUserStore from "@/store/modules/user";
 import { ref } from "vue";
+import moment from "moment";
 
 const loading = ref(false);
 const sourceList = ref({
@@ -407,6 +400,7 @@ const userInfo = useUserStore().user;
 const tenantId = userInfo.tenantId;
 const fundsType = ref([]);
 const accountData = ref([]);
+const userList = ref([]);
 const accountCurrency = ref([]);
 const fundsCostType = ref([]);
 const fundsPaymentMethod = ref([]);
@@ -467,21 +461,50 @@ const getDictData = () => {
       };
     });
   });
+  proxy
+    .get("/tenantUser/list", {
+      pageNum: 1,
+      pageSize: 10000,
+      tenantId: useUserStore().user.tenantId,
+    })
+    .then((res) => {
+      if (res.rows && res.rows.length > 0) {
+        userList.value = res.rows.map((item) => {
+          return {
+            deptId: item.deptId,
+            label: item.nickName,
+            value: item.userId,
+          };
+        });
+      }
+    });
 };
 getDictData();
 getList();
 const openPrint = ref(false);
 const printDetails = ref({});
+const presentTime = ref("");
 const clickPrint = (row) => {
+  presentTime.value = moment().format("yyyy-MM-DD HH:mm:ss");
   openPrint.value = true;
   proxy.post("/accountRequestFunds/detail", { id: row.id }).then((res) => {
     printDetails.value = res;
-    proxy.post("/flowExample/getApprovalRecord", { id: row.flowInfoId }).then((record) => {
-      printDetails.value.recordList = record.recordList;
+    proxy.post("/fileInfo/getList", { businessIdList: [row.id] }).then((resFile) => {
+      let electronicInvoiceText = "";
+      if (resFile[row.id] && resFile[row.id].length > 0) {
+        for (let i = 0; i < resFile[row.id].length; i++) {
+          if (i === 0) {
+            electronicInvoiceText = resFile[row.id][0].fileName;
+          } else {
+            electronicInvoiceText = electronicInvoiceText + ", " + resFile[row.id][i].fileName;
+          }
+        }
+      }
+      printDetails.value.electronicInvoiceText = electronicInvoiceText;
     });
-    if (printDetails.value.type == "3" && printDetails.value.advanceId) {
-      proxy.post("/accountRequestFunds/detail", { id: printDetails.value.advanceId }).then((advance) => {
-        printDetails.value.advanceText = advance.createTime.substr(0, 10) + "  " + advance.currency + advance.total;
+    if (row.flowInfoId) {
+      proxy.post("/flowExample/getApprovalRecord", { id: row.flowInfoId }).then((record) => {
+        printDetails.value.recordList = record.recordList;
       });
     }
   });
@@ -489,27 +512,84 @@ const clickPrint = (row) => {
 const clickDownload = () => {
   proxy.getPdf("请款PDF文件");
 };
+const computeMoney = (label) => {
+  let amount = 0;
+  if (printDetails.value.accountRequestFundsDetailList && printDetails.value.accountRequestFundsDetailList.length > 0) {
+    for (let i = 0; i < printDetails.value.accountRequestFundsDetailList.length; i++) {
+      if (printDetails.value.accountRequestFundsDetailList[i][label]) {
+        amount = Number(parseFloat(Number(amount) + Number(printDetails.value.accountRequestFundsDetailList[i][label])).toFixed(2));
+      }
+    }
+  }
+  return amount;
+};
+const toDx = (n) => {
+  //阿拉伯数字转换函数
+  switch (n) {
+    case "0":
+      return "零";
+    case "1":
+      return "壹";
+    case "2":
+      return "贰";
+    case "3":
+      return "叁";
+    case "4":
+      return "肆";
+    case "5":
+      return "伍";
+    case "6":
+      return "陆";
+    case "7":
+      return "柒";
+    case "8":
+      return "捌";
+    case "9":
+      return "玖";
+  }
+};
+const NumberToChinese = (m) => {
+  let unit = ["仟", "佰", "拾", "", "仟", "佰", "拾", "", "角", "分", "厘"];
+  m *= 1000;
+  m = Number(parseFloat(m).toFixed(0));
+  m += "";
+  var x = m.length;
+  var result = "";
+  for (var i = 0; i < x; i++) {
+    if (i == 3) {
+      result = "元" + result;
+    } else if (i == 7) {
+      result = "万" + result;
+    }
+    if (m.charAt(x - i - 1) == 0) {
+      if (i != 0 && i != 1 && i != 2) {
+        if (result.charAt(0) != "零" && result.charAt(0) != "元" && result.charAt(0) != "万") {
+          result = "零" + result;
+        }
+      }
+      continue;
+    }
+    result = toDx(m.charAt(x - i - 1)) + unit[unit.length - i - 1] + result;
+  }
+  result += result.charAt(result.length - 1) == "元" ? "整" : "";
+  return result;
+};
+const computeBalance = () => {
+  let balance = 0;
+  let advanceAmount = computeMoney("advanceAmount");
+  let amount = computeMoney("amount");
+  if (amount) {
+    balance = Number(amount);
+  }
+  if (advanceAmount) {
+    balance = Number(parseFloat(Number(balance) - Number(advanceAmount)).toFixed(2));
+  }
+  return balance;
+};
 </script>
 
 <style lang="scss" scoped>
 .tenant {
   padding: 20px;
 }
-.baseRow {
-  min-height: 24px;
-  border-top: 1px solid black;
-}
-.contentRow {
-  border-right: 1px solid black;
-  line-height: 24px;
-  padding-left: 4px;
-}
-.specialRow {
-  font-size: 14px;
-  font-weight: 700;
-  text-align: center;
-  border-top: 1px solid black;
-  height: 30px;
-  line-height: 30px;
-}
 </style>

src/views/purchaseManage/purchasePayment/payment/index.vue

@@ -25,7 +25,7 @@
       <div id="pdfDom" style="width: 776px">
         <div style="padding: 60px; font-size: 12px !important; color: black">
           <div style="font-size: 16px; text-align: center; padding: 8px">
-            <span style="margin-left: 16px">采购付款</span>
+            <span>采购付款</span>
           </div>
           <div style="padding: 8px 0">
             <!-- <span>{{ printDetails.corporationName }}</span> -->
@@ -49,11 +49,10 @@
               <div style="width: 150px; border-right: 1px solid black; padding: 4px 8px; display: flex; align-items: center">费用明细</div>
               <div style="width: calc(100% - 150px)">
                 <div style="border-bottom: 1px solid black; display: flex">
-                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black">采购合同</div>
-                  <div style="width: calc(100% - 340px); padding: 4px 8px; border-right: 1px solid black">款项说明</div>
-                  <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black">货币</div>
-                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black">付款金额</div>
-                  <div style="width: 80px; padding: 4px 8px">单据数量</div>
+                  <div style="width: 120px; padding: 4px 8px; border-right: 1px solid black; text-align: center">采购合同</div>
+                  <div style="width: calc(100% - 340px); padding: 4px 8px; border-right: 1px solid black; text-align: center">款项说明</div>
+                  <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; text-align: center">货币</div>
+                  <div style="width: 140px; padding: 4px 8px; text-align: center">付款金额</div>
                 </div>
                 <template v-if="printDetails.payDetailVoList && printDetails.payDetailVoList.length > 0">
                   <div v-for="(item, index) in printDetails.payDetailVoList" :key="index">
@@ -64,36 +63,48 @@
                       <div style="width: calc(100% - 340px); padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
                         {{ item.remark }}
                       </div>
-                      <div style="width: 60px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">人民币</div>
-                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">
+                      <div style="width: 80px; padding: 4px 8px; border-right: 1px solid black; display: flex; align-items: center">人民币</div>
+                      <div style="width: 140px; padding: 4px 8px; display: flex; align-items: center">
                         {{ item.money }}
                       </div>
-                      <div style="width: 80px; padding: 4px 8px; display: flex; align-items: center">{{ printDetails.receiptsNum }}</div>
                     </div>
                   </div>
                 </template>
               </div>
             </div>
             <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 150px; border-right: 1px solid black; padding: 8px">总报销金额</div>
+              <div style="width: calc(100% - 150px); display: flex">
+                <div style="width: calc(100% - 140px); padding: 8px; border-right: 1px solid black">{{ NumberToChinese(computeMoney()) }}</div>
+                <div style="width: 140px; padding: 8px">{{ computeMoney() }}</div>
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black">
+              <div style="width: 150px; border-right: 1px solid black; padding: 8px">单据数量</div>
+              <div style="width: calc(100% - 150px); padding: 8px">
+                {{ printDetails.receiptsNum }}
+              </div>
+            </div>
+            <div style="display: flex; border-bottom: 1px solid black">
               <div style="width: 150px; border-right: 1px solid black; padding: 0 8px; display: flex; align-items: center">收款信息</div>
               <div style="width: calc(100% - 150px)">
                 <div style="border-bottom: 1px solid black; display: flex">
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black">支付方式</div>
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black">收款方户名</div>
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black">开户行</div>
-                  <div style="width: 25%; padding: 0 8px">收款方账号</div>
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; text-align: center">支付方式</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">收款方户名</div>
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; text-align: center">开户行</div>
+                  <div style="width: 27%; padding: 0 8px; text-align: center">收款方账号</div>
                 </div>
                 <div style="display: flex">
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                  <div style="width: 19%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
                     {{ dictValueLabel(printDetails.payType, fundsPaymentMethod) }}
                   </div>
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
                     {{ printDetails.name }}
                   </div>
-                  <div style="width: 25%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
+                  <div style="width: 27%; padding: 0 8px; border-right: 1px solid black; display: flex; align-items: center">
                     {{ printDetails.openingBank }}
                   </div>
-                  <div style="width: 25%; padding: 0 8px; display: flex; align-items: center">
+                  <div style="width: 27%; padding: 0 8px; display: flex; align-items: center">
                     {{ printDetails.accountOpening }}
                   </div>
                 </div>
@@ -414,7 +425,6 @@ const clickPrint = (row) => {
       let data = userList.value.filter((item) => item.value == printDetails.value.createUser);
       if (data && data.length > 0) {
         printDetails.value.deptId = data[0].deptId;
-        console.log(printDetails.value.deptId, deptList.value, "22");
       }
     }
     proxy.post("/fileInfo/getList", { businessIdList: [row.id] }).then((resFile) => {
@@ -440,6 +450,68 @@ const clickPrint = (row) => {
 const clickDownload = () => {
   proxy.getPdf("采购付款PDF文件");
 };
+const computeMoney = () => {
+  let money = 0;
+  if (printDetails.value.payDetailVoList && printDetails.value.payDetailVoList.length > 0) {
+    for (let i = 0; i < printDetails.value.payDetailVoList.length; i++) {
+      if (printDetails.value.payDetailVoList[i].money) {
+        money = Number(parseFloat(Number(money) + Number(printDetails.value.payDetailVoList[i].money)).toFixed(2));
+      }
+    }
+  }
+  return money;
+};
+const toDx = (n) => {
+  //阿拉伯数字转换函数
+  switch (n) {
+    case "0":
+      return "零";
+    case "1":
+      return "壹";
+    case "2":
+      return "贰";
+    case "3":
+      return "叁";
+    case "4":
+      return "肆";
+    case "5":
+      return "伍";
+    case "6":
+      return "陆";
+    case "7":
+      return "柒";
+    case "8":
+      return "捌";
+    case "9":
+      return "玖";
+  }
+};
+const NumberToChinese = (m) => {
+  let unit = ["仟", "佰", "拾", "", "仟", "佰", "拾", "", "角", "分", "厘"];
+  m *= 1000;
+  m = Number(parseFloat(m).toFixed(0));
+  m += "";
+  var x = m.length;
+  var result = "";
+  for (var i = 0; i < x; i++) {
+    if (i == 3) {
+      result = "元" + result;
+    } else if (i == 7) {
+      result = "万" + result;
+    }
+    if (m.charAt(x - i - 1) == 0) {
+      if (i != 0 && i != 1 && i != 2) {
+        if (result.charAt(0) != "零" && result.charAt(0) != "元" && result.charAt(0) != "万") {
+          result = "零" + result;
+        }
+      }
+      continue;
+    }
+    result = toDx(m.charAt(x - i - 1)) + unit[unit.length - i - 1] + result;
+  }
+  result += result.charAt(result.length - 1) == "元" ? "整" : "";
+  return result;
+};
 </script>
 
 <style lang="scss" scoped>