|
|
@@ -0,0 +1,378 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <BaseDialog
|
|
|
+ :width="activeData.type == 1 || type == 1 ? '1100px' : '1300px'"
|
|
|
+ :isShow.sync="isShow"
|
|
|
+ :title="activeData.type == 1 ? '单据打印' : '明细打印'"
|
|
|
+ @submit="submitForm"
|
|
|
+ @close="close"
|
|
|
+ @open="init"
|
|
|
+ :confirmStatus="false"
|
|
|
+ >
|
|
|
+ <div id="print">
|
|
|
+ <h3 style="text-align: center">
|
|
|
+ {{ activeData.type == 1 ? "费用支出单据" : "费用支出明细" }}
|
|
|
+ </h3>
|
|
|
+ <template v-if="activeData.type == 1">
|
|
|
+ <table
|
|
|
+ class="table1"
|
|
|
+ border
|
|
|
+ cellspacing="0"
|
|
|
+ cellpadding="5"
|
|
|
+ width="100%"
|
|
|
+ >
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ 款项用途：{{
|
|
|
+ ["", "机构分成", "业务提成", "佣金结算", "供应商结算"][type]
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ <td>付款日期：2022-12-12 12:12:12</td>
|
|
|
+ <td>付款金额：￥8000.00</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p>用途详细：</p>
|
|
|
+ <p>机构名称：{{ formData.tenantName }}</p>
|
|
|
+ <template v-if="type !== 1">
|
|
|
+ <p>业务员：{{ formData.createUsername }}</p>
|
|
|
+ <p>业务号：{{ formData.createNo }}</p>
|
|
|
+ </template>
|
|
|
+ <template v-if="type !== 3">
|
|
|
+ <p>
|
|
|
+ 账款类型：{{
|
|
|
+ ["", "月份", "季度", "半年", "年度"][formData.billType]
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ <p>账款时间：{{ formData.remark }}</p>
|
|
|
+ </template>
|
|
|
+ <template v-if="type == 3">
|
|
|
+ <p>订单单号：{{ formData.orderSn }}</p>
|
|
|
+ <p>下单企业：{{ formData.purchaseOrg }}</p>
|
|
|
+ </template>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <p>收款信息：</p>
|
|
|
+ <p>
|
|
|
+ 收款方式：{{ ["", "账号支付", "扫码支付", "现金支付"][1] }}
|
|
|
+ </p>
|
|
|
+ <template v-if="true">
|
|
|
+ <p>收款账户：{{ formData.bankName }}</p>
|
|
|
+ <p>收款银行：{{ formData.bank }}</p>
|
|
|
+ <p>收款账号：{{ formData.bankAccount }}</p>
|
|
|
+ </template>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <p>款项明细：</p>
|
|
|
+ <template v-if="type == 3">
|
|
|
+ <p>结算佣金：{{ formData.payMoney | formatPrice }}</p>
|
|
|
+ <p>税前佣金：{{ formData.pretaxBrokerage | formatPrice }}</p>
|
|
|
+ <p>佣金税占比：{{ formData.deductMoney }}</p></template
|
|
|
+ >
|
|
|
+ <template v-else>
|
|
|
+ <p>应付分成：{{ formData.payMoney | formatPrice }}</p>
|
|
|
+ <p>
|
|
|
+ 完单分成：{{
|
|
|
+ (formData.payMoney + formData.deductMoney) | formatPrice
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ <p>退款扣除：{{ formData.deductMoney | formatPrice }}</p>
|
|
|
+ </template>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td colspan="3">
|
|
|
+ <p>审核进度：</p>
|
|
|
+ <el-steps
|
|
|
+ :space="200"
|
|
|
+ :active="formData.checkRoles.length"
|
|
|
+ finish-status="success"
|
|
|
+ align-center
|
|
|
+ >
|
|
|
+ <el-step
|
|
|
+ v-for="(item, index) in formData.checkRoles"
|
|
|
+ :title="item"
|
|
|
+ :key="index"
|
|
|
+ ></el-step>
|
|
|
+ </el-steps>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeData.type == 2">
|
|
|
+ <table
|
|
|
+ border
|
|
|
+ width="100%"
|
|
|
+ cellspacing="0"
|
|
|
+ cellpadding="5"
|
|
|
+ class="table2"
|
|
|
+ >
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <td width="50">序号</td>
|
|
|
+ <td
|
|
|
+ v-for="(item, index) in tableSet"
|
|
|
+ :key="index"
|
|
|
+ :width="item.width"
|
|
|
+ >
|
|
|
+ {{ item.label }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr v-for="(item, index) in tableData" :key="index">
|
|
|
+ <td>{{ index + 1 }}</td>
|
|
|
+ <td v-for="(items, indexs) in tableSet" :key="indexs">
|
|
|
+ <span v-if="items.scope === 'time'">{{
|
|
|
+ $methodsTools.onlyForma(item[items.prop])
|
|
|
+ }}</span>
|
|
|
+ <span v-else-if="items.scope === 'formatPrice'">
|
|
|
+ {{ item[items.prop] | formatPrice }}
|
|
|
+ </span>
|
|
|
+ <span v-else-if="items.scope === 'type'">
|
|
|
+ {{ items.values[item[items.prop]] }}
|
|
|
+ </span>
|
|
|
+ <div v-else-if="items.scope === 'businessNames'">
|
|
|
+ <div v-for="(bus, i) in item[items.prop]" :key="i">
|
|
|
+ {{ bus }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span v-else>
|
|
|
+ {{ item[items.prop] }}
|
|
|
+ </span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td :colspan="setLen - 2">合计</td>
|
|
|
+ <td>
|
|
|
+ {{ computedMoney(tableData, setLen - 3) | formatPrice }}
|
|
|
+ </td>
|
|
|
+ <td v-if="type !== 3">
|
|
|
+ {{ computedMoney(tableData, setLen - 2) | formatPrice }}
|
|
|
+ </td>
|
|
|
+ <td v-else></td>
|
|
|
+ <td>
|
|
|
+ {{ computedMoney(tableData, setLen - 1) | formatPrice }}
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <template slot="slotBtnRight">
|
|
|
+ <el-button v-print="'#print'" type="primary">打印</el-button>
|
|
|
+ </template>
|
|
|
+ </BaseDialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "",
|
|
|
+ props: {
|
|
|
+ dialogVisible: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ activeData: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {};
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ formData: {
|
|
|
+ checkRoles: [],
|
|
|
+ },
|
|
|
+ tableData: [
|
|
|
+ {
|
|
|
+ createUsername: "张三",
|
|
|
+ createNo: "6280305",
|
|
|
+ brokerage: 97,
|
|
|
+ businessList: null,
|
|
|
+ checkStatus: 2,
|
|
|
+ createSysUserId: null,
|
|
|
+ deductMoney: null,
|
|
|
+ divideCompanyMoney: 1065.6,
|
|
|
+ divideLogId: 1701,
|
|
|
+ divideMoney: null,
|
|
|
+ divideSellerMoney: 0,
|
|
|
+ divideType: 1,
|
|
|
+ id: 218,
|
|
|
+ orderCreateTime: 1685672071,
|
|
|
+ orderFrom: 3,
|
|
|
+ orderPrice: 1580,
|
|
|
+ orderSn: "10002306021014201758856",
|
|
|
+ orderTime: 1682905393,
|
|
|
+ orderType: 1,
|
|
|
+ payMoney: null,
|
|
|
+ payStatus: 0,
|
|
|
+ pretaxBrokerage: 100,
|
|
|
+ refundSn: null,
|
|
|
+ refundTime: null,
|
|
|
+ remark: null,
|
|
|
+ roleId: 16,
|
|
|
+ roleName: "出纳",
|
|
|
+ status: 1,
|
|
|
+ tenantId: null,
|
|
|
+ tenantName: "祥粤云学堂（旧系统）",
|
|
|
+ businessNames: [
|
|
|
+ "继续教育 / 施工现场专业人员（七大员）",
|
|
|
+ "考前培训 / 一级建造师",
|
|
|
+ ],
|
|
|
+ purchaseOrg: "广东南粤有限公司",
|
|
|
+ payType: 1,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this.$api[
|
|
|
+ this.activeData.type == 1
|
|
|
+ ? "settlereceiptsdata"
|
|
|
+ : "settlereceiptsdetaildata"
|
|
|
+ ](this.activeData.settleId).then((res) => {
|
|
|
+ if (this.activeData.type == 1) {
|
|
|
+ this.formData = res.data;
|
|
|
+ }
|
|
|
+ if (this.activeData.type == 2) {
|
|
|
+ this.tableData = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ close() {},
|
|
|
+ submitForm() {},
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ computedMoney: function () {
|
|
|
+ return function (array, index) {
|
|
|
+ const property = this.tableSet[index].prop;
|
|
|
+ return array.reduce((a, b) => a + b[property], 0);
|
|
|
+ };
|
|
|
+ },
|
|
|
+ isShow: {
|
|
|
+ get() {
|
|
|
+ return this.dialogVisible;
|
|
|
+ },
|
|
|
+ set(val) {
|
|
|
+ this.$emit("update:dialogVisible", false);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ type() {
|
|
|
+ return 3;
|
|
|
+ },
|
|
|
+ tableSet() {
|
|
|
+ if (this.type != 3) {
|
|
|
+ let tableSet = [
|
|
|
+ { label: "完单时间", prop: "orderTime", width: "160", scope: "time" },
|
|
|
+ {
|
|
|
+ label: "订单日期",
|
|
|
+ prop: "orderCreateTime",
|
|
|
+ width: "160",
|
|
|
+ scope: "time",
|
|
|
+ },
|
|
|
+ { label: "订单号", prop: "orderSn", width: "200" },
|
|
|
+ { label: "业务员", prop: "createUsername", width: "80" },
|
|
|
+ { label: "业务号", prop: "createNo", width: "80" },
|
|
|
+ {
|
|
|
+ label: "业务类型",
|
|
|
+ prop: "businessNames",
|
|
|
+ scope: "businessNames",
|
|
|
+ width: "160",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "分成类型",
|
|
|
+ prop: "orderType",
|
|
|
+ scope: "type",
|
|
|
+ values: {
|
|
|
+ 1: "完单分成",
|
|
|
+ 2: "退款扣除",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ { label: "订单金额", prop: "orderPrice", scope: "formatPrice" },
|
|
|
+ { label: "税前佣金", prop: "pretaxBrokerage", scope: "formatPrice" },
|
|
|
+ { label: "应付分成", prop: "payMoney", scope: "formatPrice" },
|
|
|
+ ];
|
|
|
+ if (this.type == 1) {
|
|
|
+ tableSet.splice(3, 2);
|
|
|
+ }
|
|
|
+ return tableSet;
|
|
|
+ } else {
|
|
|
+ return [
|
|
|
+ {
|
|
|
+ label: "订单日期",
|
|
|
+ prop: "orderCreateTime",
|
|
|
+ width: "160",
|
|
|
+ scope: "time",
|
|
|
+ },
|
|
|
+ { label: "订单号", prop: "orderSn", width: "200" },
|
|
|
+ { label: "业务员", prop: "createUsername", width: "80" },
|
|
|
+ { label: "业务号", prop: "createNo", width: "80" },
|
|
|
+ { label: "下单企业", prop: "purchaseOrg", width: "130" },
|
|
|
+ {
|
|
|
+ label: "业务类型",
|
|
|
+ prop: "businessNames",
|
|
|
+ scope: "businessNames",
|
|
|
+ width: "160",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "支付方式",
|
|
|
+ prop: "payType",
|
|
|
+ scope: "type",
|
|
|
+ values: {
|
|
|
+ 1: "完单分成",
|
|
|
+ 2: "退款扣除",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ { label: "税前佣金", prop: "pretaxBrokerage", scope: "formatPrice" },
|
|
|
+ { label: "佣金税占比", prop: "orderPrice", scope: "formatPrice" },
|
|
|
+ { label: "结算佣金", prop: "payMoney", scope: "formatPrice" },
|
|
|
+ ];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setLen() {
|
|
|
+ return this.tableSet.length;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+#print {
|
|
|
+ h3 {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ table {
|
|
|
+ table-layout: fixed;
|
|
|
+ }
|
|
|
+ .table1 {
|
|
|
+ td {
|
|
|
+ vertical-align: top;
|
|
|
+ padding-left: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ td {
|
|
|
+ padding: 10px 5px;
|
|
|
+ p:first-child {
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/ .el-step__head.is-success {
|
|
|
+ color: #000;
|
|
|
+ border-color: #000;
|
|
|
+ }
|
|
|
+ /deep/ .el-step__title.is-success {
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+}
|
|
|
+.table2 {
|
|
|
+ td {
|
|
|
+ text-align: center;
|
|
|
+ word-break: break-all;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
谢杰标