基础资料账户管理账户余额点击弹出收付详情

src/views/tirePartsMall/basicData/accountManagement/detailsPage.vue

@@ -19,21 +19,100 @@
     </div>
     <div style="margin-top: 50px">
       <trade-card title="基础信息">
-        <avue-form class="trading-form" :option="optionForm" v-model="form" ref="form"></avue-form>
+        <avue-form class="trading-form" :option="optionForm" v-model="form" ref="form">
+          <template slot="accountBalance">
+            <el-link type="primary" @click="accountBalanceClick(form.accountBalance)">{{ form.accountBalance }}</el-link>
+          </template>
+        </avue-form>
       </trade-card>
     </div>
+
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      :modal-append-to-body="false"
+      width="80%">
+
+      <el-tabs v-model="activeName" @tab-click="handleClick">
+        <el-tab-pane label="收款" name="collection">
+          <el-table
+            :data="collectionData"
+            stripe
+            style="width: 100%">
+            <el-table-column prop="sysNo" label="单号"/>
+            <el-table-column prop="corpId" label="客户"/>
+            <el-table-column prop="settlementDate" label="结算日期"/>
+            <el-table-column prop="amount" label="金额"/>
+            <el-table-column prop="financeStatus" label="类型"/>
+          </el-table>
+          <el-pagination
+            @size-change="collectionSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="collectionPagination.current"
+            :page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400]"
+            :page-size="collectionPagination.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="collectionPagination.total">
+          </el-pagination>
+        </el-tab-pane>
+        <el-tab-pane label="付款" name="payment">
+          <el-table
+            :data="paymentData"
+            stripe
+            style="width: 100%">
+            <el-table-column prop="sysNo" label="单号"/>
+            <el-table-column prop="corpId" label="供应商"/>
+            <el-table-column prop="settlementDate" label="结算日期"/>
+            <el-table-column prop="amount" label="金额"/>
+            <el-table-column prop="financeStatus" label="类型"/>
+          </el-table>
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="paymentPagination.current"
+            :page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400]"
+            :page-size="paymentPagination.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="paymentPagination.total">
+          </el-pagination>
+        </el-tab-pane>
+      </el-tabs>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+      </span>
+    </el-dialog>
+
   </div>
 </template>
 
 <script>
 
 import { typeSave, detail, editenable } from "@/api/tirePartsMall/basicData/accountManagement";
+import { getList } from "@/api/collectionSettlement/index";
+import { corpsDescListAll } from "@/api/tirePartsMall/salesManagement/saleOrder";
 
 export default {
   name: "detailsPage",
   data() {
     return {
+      activeName: 'collection',
+      khCorpList: [],
+      gysCorpList: [],
+      collectionData: [],
+      paymentData: [],
+      collectionPagination: {
+        size: 10,
+        total: 0,
+        current: 1
+      },
+      paymentPagination: {
+        size: 10,
+        total: 0,
+        current: 1
+      },
       form: {},
+      dialogVisible: false,
       optionForm: {
         menuBtn: false,
         span: 8,
@@ -115,6 +194,117 @@ export default {
     }
   },
   methods: {
+    handleCurrentChange(currentPage) {
+      if (this.activeName === 'collection') {
+        this.collectionPagination.current = currentPage
+        getList(this.collectionPagination).then(res => {
+          this.collectionData = res.data.data.records
+          this.collectionPagination.total = res.data.data.total
+          this.collectionData.map(data => {
+            for (let corp of this.khCorpList) {
+              if (data.corpId == corp.id) {
+                data.corpId = corp.cname
+                break
+              }
+            }
+            return data
+          })
+        })
+      } else if (this.activeName === 'payment') {
+        this.paymentPagination.current = currentPage
+        getList(this.paymentPagination).then(res => {
+          this.paymentData = res.data.data.records
+          this.paymentPagination.total = res.data.data.total
+          this.paymentData.map(data => {
+            for (let corp of this.gysCorpList) {
+              if (data.corpId == corp.id) {
+                data.corpId = corp.cname
+                break
+              }
+            }
+            return data
+          })
+
+        })
+      }
+    },
+    accountBalanceClick() {
+      corpsDescListAll({corpType: 'KH', enableOrNot: 1}).then(res => {
+        this.khCorpList = res.data.data
+
+        this.activeName = 'collection'
+        this.collectionPagination.billType = 'SK'
+        this.collectionPagination.dc = 'd'
+        this.collectionPagination.accountName = this.form.id
+        this.collectionPagination.accountId = this.form.id
+        this.collectionPagination.current = 1
+
+        getList(this.collectionPagination).then(res => {
+          this.collectionData = res.data.data.records
+          this.collectionData.map(data => {
+            for (let corp of this.khCorpList) {
+              if (data.corpId == corp.id) {
+                data.corpId = corp.cname
+                break
+              }
+            }
+            return data
+          })
+
+          this.collectionPagination.total = res.data.data.total
+          this.dialogVisible = true
+        })
+      })
+
+      corpsDescListAll({corpType: 'GYS', enableOrNot: 1}).then(res => {
+        this.gysCorpList = res.data.data
+      })
+    },
+    handleClick() {
+      if (this.activeName === 'collection') {
+        // 收款
+        this.collectionPagination.billType = 'SK'
+        this.collectionPagination.dc = 'd'
+        this.collectionPagination.accountName = this.form.id
+        this.collectionPagination.accountId = this.form.id
+        this.collectionPagination.current = 1
+
+        getList(this.collectionPagination).then(res => {
+          this.collectionData = res.data.data.records
+          this.collectionPagination.total = res.data.data.total
+          this.collectionData.map(data => {
+            for (let corp of this.khCorpList) {
+              if (data.corpId == corp.id) {
+                data.corpId = corp.cname
+                break
+              }
+            }
+            return data
+          })
+        })
+      } else if (this.activeName === 'payment') {
+        // 付款
+        this.paymentPagination.billType = 'FK'
+        this.paymentPagination.dc = 'c'
+        this.paymentPagination.accountName = this.form.id
+        this.paymentPagination.accountId = this.form.id
+        this.paymentPagination.current = 1
+
+        getList(this.paymentPagination).then(res => {
+          this.paymentData = res.data.data.records
+          this.paymentPagination.total = res.data.data.total
+          this.paymentData.map(data => {
+            for (let corp of this.gysCorpList) {
+              if (data.corpId == corp.id) {
+                data.corpId = corp.cname
+                break
+              }
+            }
+            return data
+          })
+        })
+      }
+    },
     //启用禁用
     enableNot() {
       let data = this.form