Explorar o código

单位应收应付新版

chenrui %!s(int64=2) %!d(string=hai) anos
pai
achega
d2dd9d4ec7

+ 47 - 0
src/config/router.config.js

@@ -1312,6 +1312,53 @@ export const asyncRouterMap = [
               }
             ]
           },
+          {
+            path: '/financialManagement/companyReceivablePayableNew',
+            redirect: '/financialManagement/companyReceivablePayableNew/list',
+            name: 'companyReceivablePayableNew',
+            component: BlankLayout,
+            meta: {
+              title: '单位应收应付管理(新版)',
+              icon: 'transaction'
+              // permission: 'M_companyReceivablePayableNewList'
+            },
+            hideChildrenInMenu: true,
+            children: [
+              {
+                path: 'list',
+                name: 'companyReceivablePayableNewList',
+                component: () => import(/* webpackChunkName: "financialManagement" */ '@/views/financialManagement/companyReceivablePayableNew/list.vue'),
+                meta: {
+                  title: '单位应收应付列表',
+                  icon: 'transaction',
+                  hidden: true
+                  // permission: 'M_companyReceivablePayableNewList'
+                }
+              },
+              {
+                path: 'collectionPayment/:sn/:name/:type',
+                name: 'companyReceivablePayableNewCollectionPayment',
+                component: () => import(/* webpackChunkName: "financialManagement" */ '@/views/financialManagement/companyReceivablePayableNew/collectionPayment.vue'),
+                meta: {
+                  title: '编辑单位应收应付',
+                  icon: 'transaction',
+                  hidden: true
+                  // permission: 'M_collectionPayment'
+                }
+              },
+              {
+                path: 'detail/:sn/:name/:type',
+                name: 'companyReceivablePayableNewDetail',
+                component: () => import(/* webpackChunkName: "financialManagement" */ '@/views/financialManagement/companyReceivablePayableNew/detail.vue'),
+                meta: {
+                  title: '单位应收应付详情',
+                  icon: 'transaction',
+                  hidden: true
+                  // permission: 'M_companyReceivablePayableNew_detail'
+                }
+              }
+            ]
+          },
           {
             path: '/financialManagement/companyCollectionPayment',
             redirect: '/financialManagement/companyCollectionPayment/list',

+ 217 - 0
src/views/financialManagement/companyReceivablePayableNew/chooseBillModal.vue

@@ -0,0 +1,217 @@
+<template>
+  <a-drawer
+    :zIndex="zIndex"
+    title="全部单据"
+    placement="right"
+    class="chooseBillModal-modal jg-page-wrap"
+    :visible="isShow"
+    @close="isShow=false"
+    width="70%"
+    :get-container="false"
+    :wrap-style="{ position: 'absolute' }">
+    <a-spin :spinning="spinning" tip="Loading...">
+      <!-- 搜索条件 -->
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+          <a-row :gutter="15">
+            <a-col :md="7" :sm="24">
+              <a-form-item label="单据号">
+                <a-input id="chooseBillModal-bizNo" v-model.trim="queryParam.bizNo" allowClear placeholder="请输入单据号"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="7" :sm="24">
+              <a-form-item label="单据类型">
+                <v-select
+                  v-model="queryParam.bizType"
+                  ref="bizType"
+                  id="chooseBillModal-bizType"
+                  code="SETTLE_BIZ_TYPE"
+                  placeholder="请选择单据类型"
+                  allowClear></v-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="10" :sm="24">
+              <a-form-item label="关联单据创建时间">
+                <rangeDate ref="createDate" @change="createDateChange" />
+              </a-form-item>
+            </a-col>
+            <a-col :md="7" :sm="24">
+              <a-form-item label="审核时间">
+                <rangeDate ref="rangeDate" @change="dateChange" />
+              </a-form-item>
+            </a-col>
+            <a-col :md="5" :sm="24">
+              <a-button style="margin-bottom: 18px;" type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="chooseBillModal-refresh">查询</a-button>
+              <a-button style="margin: 0 0 18px 8px" @click="resetSearchForm" :disabled="disabled" id="chooseBillModal-reset">重置</a-button>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <div class="btn-cont">
+        <a-button type="primary" ghost id="chooseBillModal-modal-save" @click="handleSave">批量更新</a-button>
+      </div>
+      <!-- 列表 -->
+      <s-table
+        class="sTable"
+        ref="table"
+        size="small"
+        :rowKey="(record) => record.id"
+        :row-selection="{ columnWidth: 40 }"
+        @rowSelection="rowSelectionFun"
+        :columns="columns"
+        :data="loadData"
+        :showPagination="false"
+        :scroll="{ y: 400 }"
+        :defaultLoadData="false"
+        bordered>
+      </s-table>
+
+    </a-spin>
+  </a-drawer>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { settleInfoAllList } from '@/api/settle'
+export default {
+  name: 'ChooseBillModal',
+  components: { STable, VSelect, rangeDate },
+  mixins: [commonMixin],
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    nowChoose: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
+    settleClientSn: {
+      type: String,
+      default: ''
+    },
+    settleClientType: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    const _this = this
+    return {
+      spinning: false,
+      isShow: this.openModal, //  是否打开弹框
+      disabled: false,
+      queryParam: {
+        auditBeginDate: '',
+        auditEndDate: '',
+        bizNo: '',
+        bizType: undefined,
+        bizCreateBeginDate: undefined,
+        bizCreateEndDate: undefined
+      },
+      allData: [],
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '6%', align: 'center' },
+        { title: '单据号', dataIndex: 'bizNo', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '单据类型', dataIndex: 'bizTypeDictValue', width: '12%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '关联单据创建时间', dataIndex: 'bizCreateDate', width: '25%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '审核时间', dataIndex: 'auditTime', width: '18%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '金额', dataIndex: 'totalAmount', width: '12%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '余额', dataIndex: 'unsettleAmount', width: '12%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        this.spinning = true
+        return settleInfoAllList(Object.assign(this.queryParam, { settleClientType: this.settleClientType, settleClientSn: this.settleClientSn, notEqZero: 1 })).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const selectedRowKeys = []
+            const selectedRows = []
+            for (var i = 0; i < data.length; i++) {
+              data[i].no = i + 1
+              data[i].settleAmount = data[i].unsettleAmount
+              const ind = this.nowChoose.findIndex(item => item.id == data[i].id)
+              if (ind != -1) {
+                selectedRowKeys.push(data[i].id)
+                selectedRows.push(data[i])
+              }
+            }
+            this.$refs.table.setTableSelected(selectedRowKeys, selectedRows) // 设置表格选中项
+            this.disabled = false
+          }
+          this.spinning = false
+          return data
+        })
+      },
+      rowSelectionInfo: null
+    }
+  },
+  methods: {
+    // 表格选中项
+    rowSelectionFun (obj) {
+      this.rowSelectionInfo = obj || null
+    },
+    // 关联单据创建时间
+    createDateChange (date) {
+      this.queryParam.bizCreateBeginDate = date[0]
+      this.queryParam.bizCreateEndDate = date[1]
+    },
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.auditBeginDate = date[0]
+      this.queryParam.auditEndDate = date[1]
+    },
+    // 确定
+    handleSave () {
+      this.$emit('ok', this.rowSelectionInfo && this.rowSelectionInfo.selectedRows)
+      this.isShow = false
+    },
+    // 重置
+    resetSearchForm () {
+      this.$refs.rangeDate.resetDate()
+      this.$refs.createDate.resetDate()
+      this.queryParam.auditBeginDate = ''
+      this.queryParam.auditEndDate = ''
+      this.queryParam.bizCreateBeginDate = ''
+      this.queryParam.bizCreateEndDate = ''
+      this.queryParam.bizNo = ''
+      this.queryParam.bizType = undefined
+      this.$refs.table.refresh(true)
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      const _this = this
+      if (!newValue) {
+        _this.$emit('close')
+        _this.$refs.table.clearSelected() // 清空表格选中项
+        _this.resetSearchForm()
+      } else {
+        setTimeout(() => {
+          _this.$refs.table.refresh(true)
+        }, 200)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .chooseBillModal-modal{
+    .btn-cont {
+      margin-bottom: 10px;
+    }
+  }
+</style>

+ 494 - 0
src/views/financialManagement/companyReceivablePayableNew/collectionPayment.vue

@@ -0,0 +1,494 @@
+<template>
+  <div class="jg-page-wrap collectionPayment-wrap">
+    <a-spin :spinning="spinning" tip="Loading...">
+      <a-page-header :ghost="false" :backIcon="false" class="collectionPayment-back" >
+        <!-- 自定义的二级文字标题 -->
+        <template slot="subTitle">
+          <p style=" display: inline-block;margin-right:30px;color: #000;font-size: 16px;font-weight: 600;">客户:{{ $route.params.name!='undefined'?$route.params.name: '--' }}</p>
+          <a-button id="purchaseNewOrderEdit-back-btn" type="link" @click="handleBack" class="button-default"> <a-icon type="rollback" /> 返回列表</a-button>
+        </template>
+        <template slot="extra" v-if="$hasPermissions('B_cPayment_printAndExport')">
+          <div style="margin-top: 5px;">
+            <PrintPanel ref="printBox"  @handlePrint="handlePrint">
+              <div style="padding:10px;" slot="extendCons">
+                <a-checkbox v-model="printAllName" :checked="printAllName" id="salesQuery-printAllName">打印完整产品名称</a-checkbox>
+                <a-checkbox v-model="printOrgCode" :checked="printOrgCode" id="salesQuery-printOrgCode">打印原厂编码</a-checkbox>
+                <a-checkbox v-model="printRemarks" :checked="printRemarks" id="salesQuery-printRemarks">打印备注</a-checkbox>
+              </div>
+            </PrintPanel>
+            <a-divider type="vertical" />
+            <a-button id="salesNewOrderEdit-add-btn" type="link" @click="openModal=true"><a-icon type="plus" />选择单据</a-button>
+          </div>
+        </template>
+      </a-page-header>
+      <!-- 已选单据 -->
+      <a-card size="small" :bordered="false" class="collectionPayment-cont">
+        <div class="table-operator">
+          <div class="alert-message">
+            共 <strong>{{ chooseLoadData.length }}</strong>条明细 ,
+            金额合计<strong>{{ toThousands(totalAmount) }}</strong> ,
+            余额合计<strong>{{ toThousands(totalBalance) }}</strong> ,
+            本次结算金额合计<strong>{{ toThousands(currentTotalBalance) }}</strong>
+          </div>
+        </div>
+        <!-- 列表 -->
+        <a-table
+          class="sTable"
+          ref="chooseTable"
+          size="small"
+          :rowKey="(record) => record.id"
+          :columns="chooseColumns"
+          :dataSource="chooseLoadData"
+          :scroll="{ y: 300 }"
+          :loading="loading"
+          :locale="{emptyText: '请先选择单据'}"
+          :pagination="false"
+          bordered>
+          <!-- 序号 -->
+          <template slot="no" slot-scope="text, record, index">
+            {{ index+1 }}
+          </template>
+          <!-- 本次结算金额 -->
+          <template slot="settleAmount" slot-scope="text, record">
+            <a-input-number
+              id="collectionPayment-settleAmount"
+              v-model="record.settleAmount"
+              :precision="2"
+              :min="record.unsettleAmount<0 ? record.unsettleAmount : 0"
+              :max="record.unsettleAmount<0 ? 0 : record.unsettleAmount"
+              @change="amountSettledChange"
+              size="small"
+              placeholder="请输入"
+              style="width: 100%;" />
+          </template>
+          <!-- 操作 -->
+          <template slot="action" slot-scope="text, record">
+            <a-button size="small" type="link" class="button-error" @click="handleDel(record)" id="collectionPayment-del-btn">移除</a-button>
+          </template>
+        </a-table>
+      </a-card>
+      <a-card size="small" :bordered="false" class="collectionPayment-cont">
+        <a-collapse :activeKey="['1']">
+          <a-collapse-panel key="1" header="收付款信息">
+            <a-form-model
+              id="collectionPayment-form"
+              ref="ruleForm"
+              :model="form"
+              :rules="rules"
+              :label-col="formItemLayout.labelCol"
+              :wrapper-col="formItemLayout.wrapperCol">
+              <a-row :gutter="20">
+                <a-col span="12">
+                  <a-form-model-item prop="amountSettled">
+                    <template slot="label">
+                      本次结算金额(<span :class="isPositive ? 'green':'red'">{{ isPositive ? '收款' : '付款' }}</span>)
+                    </template>
+                    <a-input-number
+                      id="collectionPayment-amountSettled"
+                      v-model="form.amountSettled"
+                      @change="amountSettledTotalChange"
+                      :precision="2"
+                      placeholder=""
+                      :max="maxAmountSettled"
+                      style="width: 100%;" />
+                  </a-form-model-item>
+                </a-col>
+                <a-col span="12">
+                  <a-form-model-item label="折让金额" prop="discountAmount">
+                    <a-input-number
+                      id="collectionPayment-discountAmount"
+                      v-model="form.discountAmount"
+                      :precision="2"
+                      :min="0"
+                      :max="form.amountSettled"
+                      placeholder="请输入"
+                      style="width: 100%;"
+                      allowClear />
+                  </a-form-model-item>
+                </a-col>
+                <a-col span="12">
+                  <a-form-model-item prop="actualSettlementAmount">
+                    <template slot="label">
+                      本次实际结算金额(<span :class="isPositive ? 'green':'red'">{{ isPositive ? '收款' : '付款' }}</span>)
+                    </template>
+                    <a-input-number
+                      id="collectionPayment-actualSettlementAmount"
+                      v-model="actualSettlementAmount"
+                      disabled
+                      :precision="2"
+                      placeholder=""
+                      style="width: 100%;" />
+                  </a-form-model-item>
+                </a-col>
+                <a-col span="12">
+                  <a-form-model-item label="结算方式" prop="settleStyleSn">
+                    <v-select
+                      code="SETTLE_STYLE"
+                      id="collectionPayment-settleStyleSn"
+                      v-model="form.settleStyleSn"
+                      @change="settleStyleChange"
+                      allowClear
+                      placeholder="请选择结算方式"
+                    ></v-select>
+                  </a-form-model-item>
+                </a-col>
+                <a-col span="12">
+                  <a-form-model-item v-if="enableFundAccount" label="结算账户" prop="settleAccountSn">
+                    <settleAccount
+                      id="collectionPayment-settleAccountSn"
+                      v-model="form.settleAccountSn"
+                      :settleStyleSn="form.settleStyleSn"
+                      @change="settleAccountChange"
+                      placeholder="请选择结算账户">
+                    </settleAccount>
+                  </a-form-model-item>
+                </a-col>
+                <a-col span="24">
+                  <a-form-model-item label="备注" prop="remark" :label-col="{ span: 3 }" :wrapper-col="{ span: 20 }">
+                    <a-textarea id="collectionPayment-remark" :maxLength="100" v-model="form.remark" placeholder="请输入备注(最多100个字符)" allowClear />
+                  </a-form-model-item>
+                </a-col>
+              </a-row>
+            </a-form-model>
+          </a-collapse-panel>
+        </a-collapse>
+      </a-card>
+    </a-spin>
+    <div class="affix-cont">
+      <a-button
+        type="primary"
+        id="collectionPayment-submit"
+        size="large"
+        :disabled="spinning"
+        class="button-primary"
+        @click="handleSubmit"
+        style="padding: 0 60px;">提交</a-button>
+    </div>
+    <choose-bill-modal
+      ref="chooseBillModal"
+      :openModal="openModal"
+      :nowChoose="chooseLoadData"
+      :settleClientType="$route.params.type"
+      :settleClientSn="$route.params.sn"
+      @ok="handleOk"
+      @close="handleClose" />
+  </div>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { mapActions } from 'vuex'
+import debounce from 'lodash/debounce'
+import { STable, VSelect } from '@/components'
+import chooseBillModal from './chooseBillModal.vue'
+import { settleUnitSave, settleUnitPrint, settleUnitExport, settleInfoAllList } from '@/api/settle'
+import Print from '@/views/common/print.vue'
+import settleAccount from '@/views/common/settleAccount'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { hdPrint } from '@/libs/JGPrint'
+import PrintPanel from '@/views/common/printPanel.vue'
+export default {
+  name: 'CollectionPaymentDetail',
+  components: { STable, VSelect, chooseBillModal, Print, settleAccount, rangeDate,PrintPanel },
+  mixins: [commonMixin],
+  data () {
+    this.amountSettledChange = debounce(this.amountSettledChange, 800)
+    this.amountSettledTotalChange = debounce(this.amountSettledTotalChange, 800)
+    const _this = this
+    return {
+      disabled: false,
+      spinning: false,
+      loading: false, //  表格加载中
+      chooseQueryParam: {
+        productCode: '',
+        productName: ''
+      },
+      // 表头
+      chooseColumns: [
+        { title: '序号', scopedSlots: { customRender: 'no' }, width: '5%', align: 'center' },
+        { title: '单据号', dataIndex: 'bizNo', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '单据类型', dataIndex: 'bizTypeDictValue', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '关联单据创建时间', dataIndex: 'bizCreateDate', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '审核时间', dataIndex: 'auditTime', width: '15%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '金额', dataIndex: 'totalAmount', width: '10%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '余额', dataIndex: 'unsettleAmount', width: '10%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '本次结算金额', scopedSlots: { customRender: 'settleAmount' }, width: '15%', align: 'center' },
+        { title: '操作', scopedSlots: { customRender: 'action' }, width: '10%', align: 'center' }
+      ],
+      chooseLoadData: [],
+      formItemLayout: {
+        labelCol: { span: 6 },
+        wrapperCol: { span: 16 }
+      },
+      form: {
+        amountSettled: 0,
+        discountAmount: 0, //  折让金额
+        settleStyleSn: undefined,
+        settleClientName: '',
+        settleAccountSn: undefined,
+        settleAccountName: undefined,
+        remark: ''
+      },
+      rules: {
+        amountSettled: [{ required: true, message: '请输入本次结算金额,系统将自动分配到已选单据上', trigger: 'change' }],
+        discountAmount: [{ required: true, message: '请输入折让金额', trigger: 'blur' }],
+        settleStyleSn: [{ required: true, message: '请选择结算方式', trigger: 'change' }],
+        settleAccountSn: [{ required: true, message: '请选择结算账户', trigger: 'change' }]
+      },
+      openModal: false, //  弹框
+      isPositive: true, // 是否是正值
+      isChangeAs: false,
+      maxAmountSettled: 0,
+      enableFundAccount: false,
+      printOrgCode: false, // 打印原创编码
+      printAllName: false, // 打印全部名称
+      printRemarks: false, // 打印备注
+    }
+  },
+  computed: {
+    // 本次结算金额合计
+    currentTotalBalance () {
+      let val = 0
+      this.chooseLoadData.map(item => {
+        val += (Number(item.settleAmount) * 1000)
+      })
+      return val / 1000
+    },
+    // 金额合计
+    totalAmount () {
+      let val = 0
+      this.chooseLoadData.map(item => {
+        val += (Number(item.totalAmount) * 1000)
+      })
+      return val / 1000
+    },
+    // 余额合计
+    totalBalance () {
+      let val = 0
+      this.chooseLoadData.map(item => {
+        val += (Number(item.unsettleAmount) * 1000)
+      })
+      return val / 1000
+    },
+    // 实结算金额
+    actualSettlementAmount () {
+      const val = (this.form.amountSettled * 1000 - this.form.discountAmount * 1000) / 1000
+      return val
+    }
+  },
+  methods: {
+    ...mapActions(['GetSettleAccountState']),
+    // 打印预览/快捷打印
+    handlePrint (type, printerType) {
+      const _this = this
+      const params = _this.getParams()
+      _this.spinning = true
+      let url = settleUnitPrint
+      if (type == 'export') { //  导出
+        url = settleUnitExport
+      }
+      // 打印或导出
+      hdPrint(printerType, type, url, params, '单位应收应付', function () {
+        _this.spinning = false
+      })
+    },
+    // 选择结算方式
+    settleStyleChange (v, name) {
+      this.form.settleStyleName = name.dispName
+      if (this.form.settleAccountSn) {
+        this.form.settleAccountSn = undefined
+      }
+    },
+    settleAccountChange (v, name) {
+      this.form.settleAccountName = name
+    },
+    // 应结算金额
+    amountSettledChange () {
+      console.log(this.isChangeAs)
+      if (!this.isChangeAs) {
+        let val = 0
+        this.chooseLoadData.map(item => {
+          val += (Number(item.settleAmount) * 1000)
+        })
+        val = val / 1000
+        this.isPositive = val > 0
+        this.form.amountSettled = Math.abs(val)
+        this.maxAmountSettled = Math.abs(val)
+      }
+    },
+    // 修改本次结算金额,自动分配
+    amountSettledTotalChange (v) {
+      console.log(this.isChangeAs, v, this.totalBalance, this.isPositive)
+      if (v <= Math.abs(this.totalBalance)) {
+        this.isChangeAs = true
+        const sa = v
+        const list = this.chooseLoadData
+        // 恢复初始值
+        list.map((item, index) => {
+          item.settleAmount = item.unsettleAmount
+        })
+        this.maxAmountSettled = Math.abs(this.totalBalance)
+        // 开始计算
+        let temp = 0
+        let ti = 0
+        for (let i = 0; i < list.length; i++) {
+          temp = temp + list[i].settleAmount * (this.isPositive ? 1 : -1)
+          if (temp >= sa) {
+            ti = i
+            break
+          }
+        }
+        console.log(ti, temp, sa)
+        list[ti].settleAmount = (list[ti].settleAmount - (temp - sa) * (this.isPositive ? 1 : -1)).toFixed(2)
+        // ti 之后的都改成0
+        for (let i = ti + 1; i < list.length; i++) {
+          list[i].settleAmount = 0
+        }
+        list.splice()
+        this.isChangeAs = false
+      }
+    },
+    // 选择单据
+    handleChoose () {
+      this.openModal = true
+    },
+    //  移除
+    handleDel (record) {
+      const ind = this.chooseLoadData.findIndex(item => item.id == record.id)
+      this.chooseLoadData.splice(ind, 1)
+      this.amountSettledChange()
+    },
+    getParams () {
+      const _this = this
+      const form = _this.form
+      form.settleClientName = _this.$route.params.name
+      form.settleClientSn = _this.$route.params.sn || undefined
+      form.settleClientType = _this.chooseLoadData[0].settleClientType
+      form.settleType = _this.isPositive ? 'R' : 'P'
+      form.settleAmount = _this.form.amountSettled
+      form.realSettleAmount = _this.actualSettlementAmount
+      form.detailList = []
+      _this.chooseLoadData.map(item => {
+        form.detailList.push({
+          bizSn: item.bizSn,
+          settleAmount: item.settleAmount,
+          prFlag: item.prFlag
+        })
+      })
+      return form
+    },
+    // 提交
+    handleSubmit () {
+      const _this = this
+      if (_this.chooseLoadData.length == 0) {
+        _this.$message.warning('请选择单据后再提交信息')
+        return
+      }
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          _this.spinning = true
+          const form = this.getParams()
+          settleUnitSave(form).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.handleBack()
+              _this.spinning = false
+            } else {
+              _this.spinning = false
+            }
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    handleOk (selectedRows) {
+      this.chooseLoadData = selectedRows.sort((a, b) => {
+        const at = new Date(a.auditTime).getTime()
+        const bt = new Date(b.auditTime).getTime()
+        return at - bt
+      })
+      // this.chooseLoadData = selectedRows.reverse()
+      this.amountSettledChange()
+    },
+    // 返回列表
+    handleBack () {
+      this.$router.push({ path: `/financialManagement/companyReceivablePayableNew/list` })
+    },
+    // 关闭
+    handleClose () {
+      this.openModal = false
+    },
+    // 默认获取所有单据
+    getsettleInfoAllList () {
+      this.loading = true
+      this.disabled = true
+      settleInfoAllList({ settleClientSn: this.$route.params.sn, settleClientType: this.$route.params.type, notEqZero: 1 }).then(res => {
+        res.data.map(item => {
+          item.settleAmount = item.unsettleAmount
+        })
+        this.chooseLoadData = res.data || []
+        this.loading = false
+        this.disabled = false
+        this.amountSettledChange()
+      })
+    },
+    pageInit () {
+      this.chooseLoadData = []
+      this.getsettleInfoAllList()
+    },
+    // 重置
+    resetSearchForm () {
+      this.getsettleInfoAllList()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+    }
+  },
+  activated () {
+    // 如果是新页签打开或者进入新的子页(例:存在列表第2条数据编辑页页签时再打开第4条数据的编辑页),则重置当前页面
+    if (this.$store.state.app.isNewTab || !this.$store.state.app.isNewSubTab) {
+      this.pageInit()
+    }
+    // 结算账户状态查询
+    if (this.$hasPermissions('M_fundAccountList') && this.$hasPermissions('B_fundAccountEnable')) {
+      this.GetSettleAccountState().then(res => {
+        if (res.status == 200) {
+          this.enableFundAccount = res.data.functionEnableFlag == 1
+        }
+      })
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {})
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .collectionPayment-wrap{
+    position: relative;
+    height: 100%;
+    padding-bottom: 51px;
+    box-sizing: border-box;
+    >.ant-spin-nested-loading{
+      overflow-y: auto;
+      height: 100%;
+    }
+    .collectionPayment-cont{
+      margin-top: 10px;
+      .green{
+        color: #19be6b;
+      }
+      .red{
+        color: #ed1c24;
+      }
+    }
+    .affix-cont{
+      text-align:right !important;
+    }
+  }
+</style>

+ 190 - 0
src/views/financialManagement/companyReceivablePayableNew/detail.vue

@@ -0,0 +1,190 @@
+<template>
+  <div class="companyCollectionPaymentDetail-wrap jg-page-wrap">
+    <a-spin :spinning="spinning" tip="Loading...">
+      <a-page-header :ghost="false" :backIcon="false" class="companyCollectionPaymentDetail-cont" >
+        <!-- 自定义的二级文字标题 -->
+        <template slot="subTitle">
+          <p style=" display: inline-block;margin-right: 30px;color: #000;font-size: 16px;font-weight: 600;">客户:{{ $route.params.name!='undefined'?$route.params.name: '--' }}</p>
+          <a-button id="companyCollectionPaymentDetail-back-btn" type="link" @click="handleBack" class="button-default"> <a-icon type="rollback" /> 返回列表</a-button>
+        </template>
+      </a-page-header>
+      <a-card>
+        <!-- 搜索条件 -->
+        <div class="table-page-search-wrapper">
+          <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+            <a-row :gutter="15">
+              <a-col :md="6" :sm="24">
+                <a-form-item label="单据号">
+                  <a-input id="companyReceivablePayableDetail-bizNo" v-model.trim="queryParam.bizNo" allowClear placeholder="请输入单据号"/>
+                </a-form-item>
+              </a-col>
+              <a-col :md="6" :sm="24">
+                <a-form-item label="审核时间">
+                  <rangeDate ref="rangeDate" @change="dateChange" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="6" :sm="24">
+                <span class="table-page-search-submitButtons">
+                  <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="companyReceivablePayableDetail-refresh">查询</a-button>
+                  <a-button style="margin-left: 8px" @click="resetSearchForm" :disabled="disabled" id="companyReceivablePayableDetail-reset">重置</a-button>
+                  <!-- <a-button
+                    type="danger"
+                    style="margin-left: 8px"
+                    @click="handleExport"
+                    :disabled="disabled"
+                    :loading="exportLoading"
+                    id="companyReceivablePayableDetail-export-btn">导出</a-button> -->
+                </span>
+              </a-col>
+            </a-row>
+          </a-form>
+        </div>
+        <!-- alert -->
+        <div class="table-operator">
+          <div class="alert-message">
+            共 <strong>{{ total }}</strong> 条明细,
+            金额合计 <strong>{{ (productTotal&&(productTotal.totalAmount || productTotal.totalAmount==0)) ? toThousands(productTotal.totalAmount) : '--' }}</strong> ,
+            余额合计 <strong>{{ (productTotal&&(productTotal.unsettleAmount || productTotal.unsettleAmount==0)) ? toThousands(productTotal.unsettleAmount) : '--' }}</strong>
+          </div>
+        </div>
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.id"
+          :columns="columns"
+          :data="loadData"
+          :defaultLoadData="false"
+          bordered>
+          <!-- 采购数量 -->
+          <template slot="purchaseNum" slot-scope="text, record">
+            <span>{{ record.purchaseNum }}</span>
+          </template>
+          <!-- 缺货数量 -->
+          <template slot="outOfStockNum" slot-scope="text, record">
+            <span>{{ record.outOfStockNum }}</span>
+          </template>
+        </s-table>
+      </a-card>
+    </a-spin>
+  </div>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+// import { downloadExcel } from '@/libs/JGPrint.js'
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { settleInfoList, settleInfoQueryReceiptOrPaySum } from '@/api/settle'
+export default {
+  name: 'CompanyReceivablePayableDetail',
+  components: { STable, VSelect, rangeDate },
+  mixins: [commonMixin],
+  data () {
+    const _this = this
+    return {
+      spinning: false,
+      disabled: false, //  查询、重置按钮是否可操作
+      // 查询参数
+      queryParam: {
+        auditBeginDate: '',
+        auditEndDate: '',
+        bizNo: ''
+      },
+      exportLoading: false, // 导出loading
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '6%', align: 'center' },
+        { title: '单据号', dataIndex: 'bizNo', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '类型', dataIndex: 'bizTypeDictValue', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '审核时间', dataIndex: 'auditTime', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '金额', dataIndex: 'totalAmount', width: '17%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '余额', dataIndex: 'unsettleAmount', width: '17%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        this.spinning = true
+        const params = Object.assign(parameter, this.queryParam, { settleClientSn: this.$route.params.sn, settleClientType: this.$route.params.type })
+        return settleInfoList(params).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            this.getTotal(params)
+            const no = (data.pageNo - 1) * data.pageSize
+            for (var i = 0; i < data.list.length; i++) {
+              data.list[i].no = no + i + 1
+            }
+            this.disabled = false
+            this.total = data.count || 0
+          }
+          this.spinning = false
+          return data
+        })
+      },
+      basicInfoData: null, //  基本信息
+      total: 0, //  总条数
+      productTotal: null //  合计
+    }
+  },
+  methods: {
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.auditBeginDate = date[0]
+      this.queryParam.auditEndDate = date[1]
+    },
+    //  返回列表
+    handleBack () {
+      this.$router.push({ path: '/financialManagement/companyReceivablePayableNew/list' })
+    },
+    // 合计
+    getTotal (param) {
+      settleInfoQueryReceiptOrPaySum(param).then(res => {
+        if (res.status == 200 && res.data) {
+          this.productTotal = res.data
+        } else {
+          this.productTotal = null
+        }
+      })
+    },
+    // 重置
+    resetSearchForm () {
+      this.$refs.rangeDate.resetDate()
+      this.queryParam.auditBeginDate = ''
+      this.queryParam.auditEndDate = ''
+      this.queryParam.bizNo = ''
+      this.$refs.table.refresh(true)
+    },
+    //  导出
+    handleExport () {
+      // const params = this.queryParam
+      // this.exportLoading = true
+      // customerBundleExportDelay(params).then(res => {
+      //   this.exportLoading = false
+	  // downloadExcel(res, '单位应收应付')
+      // })
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.resetSearchForm()
+    }
+  },
+  activated () {
+    // 如果是新页签打开或者进入新的子页(例:存在列表第2条数据编辑页页签时再打开第4条数据的编辑页),则重置当前页面
+    if (this.$store.state.app.isNewTab || !this.$store.state.app.isNewSubTab) {
+      this.resetSearchForm()
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {})
+  }
+}
+</script>
+
+<style lang="less">
+  .companyCollectionPaymentDetail-cont{
+    margin-bottom: 10px;
+  }
+</style>

+ 218 - 0
src/views/financialManagement/companyReceivablePayableNew/list.vue

@@ -0,0 +1,218 @@
+<template>
+  <div class="jg-page-wrap">
+    <a-card size="small" :bordered="false" class="table-page-search-wrapper">
+      <!-- 搜索条件 -->
+      <div ref="tableSearch">
+        <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+          <a-row :gutter="15">
+            <a-col :md="6" :sm="24">
+              <a-form-item label="客户名称">
+                <a-input id="companyReceivablePayableNewList-settleClientName" v-model.trim="queryParam.settleClientNameCurrent" allowClear placeholder="请输入客户名称"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="单位类型">
+                <v-select
+                  v-model="queryParam.settleClientType"
+                  ref="settleClientType"
+                  id="companyReceivablePayableNewList-settleClientType"
+                  code="SETTLE_CLIENT_TYPE"
+                  placeholder="请选择单位类型"
+                  allowClear></v-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <span class="table-page-search-submitButtons">
+                <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="companyReceivablePayableNewList-refresh">查询</a-button>
+                <a-button style="margin-left: 8px" @click="resetSearchForm()" :disabled="disabled" id="companyReceivablePayableNewList-reset">重置</a-button>
+              </span>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+    </a-card>
+    <a-card size="small" :bordered="false" class="companyReceivablePayableNewList-wrap">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 统计 -->
+        <div class="table-operator">
+          <div class="alert-message">
+            共 <strong>{{ total }}</strong> 条记录,
+            应收金额合计 <strong>{{ (productTotal&&(productTotal.receipt || productTotal.receipt==0)) ? toThousands(productTotal.receipt) : '--' }}</strong> ,
+            应付金额合计 <strong>{{ (productTotal&&productTotal.pay) ? toThousands(productTotal.pay) : 0 }}</strong>
+          </div>
+        </div>
+        <!-- 列表 -->
+        <s-table
+          class="sTable fixPagination"
+          ref="table"
+          :style="{ height: tableHeight+84.5+'px' }"
+          size="small"
+          :rowKey="(record) => record.settleClientSn"
+          rowKeyName="settleClientSn"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+          <!-- 客户名称 -->
+          <template slot="customerName" slot-scope="text, record">
+            <span v-if="record.settleClientType&&record.settleClientType=='CUSTOMER'">{{ record.settleClientNameCurrent||'--' }}</span>
+            <span v-else>{{ record.settleClientName||'--' }}</span>
+          </template>
+          <!-- 操作 -->
+          <template slot="action" slot-scope="text, record">
+            <a-button
+              v-if="$hasPermissions('M_collectionPayment')"
+              size="small"
+              type="link"
+              class="button-primary"
+              @click="handleCollectionPayment(record)"
+              id="companyReceivablePayableNewList-collectionPayment-btn">收付款</a-button>
+            <!-- v-if="$hasPermissions('M_companyReceivablePayableNew_detail')" -->
+            <a-button
+              size="small"
+              type="link"
+              class="button-success"
+              @click="handleDetail(record)"
+              id="companyReceivablePayableNewList-detail-btn">详情</a-button>
+            <span v-if="!$hasPermissions('M_collectionPayment') && !$hasPermissions('M_companyReceivablePayableNew_detail')">--</span>
+          </template>
+        </s-table>
+      </a-spin>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { STable, VSelect } from '@/components'
+import { settleUnitClientList, settleInfoQuerySum } from '@/api/settle'
+export default {
+  name: 'CollectionPaymentList',
+  components: { STable, VSelect },
+  mixins: [commonMixin],
+  data () {
+    const _this = this
+    return {
+      spinning: false,
+      disabled: false, //  查询、重置按钮是否可操作
+      tableHeight: 0,
+      // 查询参数
+      queryParam: {
+        settleClientNameCurrent: '',
+        settleClientType: undefined
+      },
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
+        { title: '客户名称', width: '20%', align: 'center', scopedSlots: { customRender: 'customerName' } },
+        { title: '单位类型', dataIndex: 'settleClientTypeDictValue', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '应收金额', dataIndex: 'unSettleAmountReceipt', width: '20%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '应付金额', dataIndex: 'unSettleAmountPay', width: '20%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '操作', scopedSlots: { customRender: 'action' }, width: '15%', align: 'center' }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        this.spinning = true
+        return settleUnitClientList(Object.assign(parameter, this.queryParam)).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            this.getTotal(Object.assign(parameter, this.queryParam))
+            const no = (data.pageNo - 1) * data.pageSize
+            for (var i = 0; i < data.list.length; i++) {
+              data.list[i].no = no + i + 1
+              // 应付金额  值为负,应显示为正
+              data.list[i].unSettleAmountPay = Math.abs(data.list[i].unSettleAmountPay) || 0
+            }
+            this.disabled = false
+            this.total = data.count || 0
+          }
+          this.spinning = false
+          return data
+        })
+      },
+      total: 0, //  总条数
+      productTotal: null
+    }
+  },
+  methods: {
+    //  详情
+    handleDetail (row) {
+      if (row.settleClientType == 'CUSTOMER') {
+        this.$router.push({ path: `/financialManagement/companyReceivablePayableNew/detail/${row.settleClientSn}/${row.settleClientNameCurrent}/${row.settleClientType}` })
+      } else {
+        this.$router.push({ path: `/financialManagement/companyReceivablePayableNew/detail/${row.settleClientSn}/${row.settleClientName}/${row.settleClientType}` })
+      }
+    },
+    // 合计
+    getTotal (param) {
+      settleInfoQuerySum(param).then(res => {
+        if (res.status == 200 && res.data) {
+          this.productTotal = res.data
+        } else {
+          this.productTotal = null
+        }
+      })
+    },
+    //  收付款
+    handleCollectionPayment (row) {
+      if (row.settleClientType == 'CUSTOMER') {
+        this.$router.push({ path: `/financialManagement/companyReceivablePayableNew/collectionPayment/${row.settleClientSn}/${row.settleClientNameCurrent}/${row.settleClientType}` })
+      } else {
+        this.$router.push({ path: `/financialManagement/companyReceivablePayableNew/collectionPayment/${row.settleClientSn}/${row.settleClientName}/${row.settleClientType}` })
+      }
+    },
+    //  重置
+    resetSearchForm () {
+      this.queryParam.settleClientNameCurrent = ''
+      this.queryParam.settleClientType = undefined
+      this.$refs.table.refresh(true)
+    },
+    pageInit () {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 260
+    }
+  },
+  watch: {
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+      this.resetSearchForm()
+    }
+  },
+  activated () {
+    // 如果是新页签打开,则重置当前页面
+    if (this.$store.state.app.isNewTab) {
+      this.pageInit()
+      this.resetSearchForm()
+    }
+    // 仅刷新列表,不重置页面
+    if (this.$store.state.app.updateList) {
+      this.pageInit()
+      this.$refs.table.refresh()
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {})
+  }
+}
+</script>
+<style lang="less">
+  .companyReceivablePayableNewList-wrap{
+    .sTable{
+      margin-top: 10px;
+    }
+  }
+</style>