往来明细账

src/api/report.js

@@ -17,6 +17,14 @@ function transactionReportBossXls(formData) {
   return request.post(constant.serverUrl + "/report/transactionReportBossXls", formData);
 }
 
+function yearSOA(formData) {
+  return request.post(constant.serverUrl + "/report/yearSOA", formData);
+}
+
+function yearSOAXls(formData) {
+  return request.post(constant.serverUrl + "/report/yearSOAXls", formData);
+}
+
 export default {
-  transactionRanking,transactionRankingXls,transactionReportBoss,transactionReportBossXls
+  transactionRanking,transactionRankingXls,transactionReportBoss,transactionReportBossXls,yearSOA,yearSOAXls
 }

src/routers/modules/report.js

@@ -26,6 +26,15 @@ var routers = [
                 title: '月度交易额报表'
         }
     },
+    {
+        path: '/report/yearSOA',
+        name: 'ReportYearSOA',
+        component: () => import('@/views/report/yearSOA.vue'),
+        meta: {
+                roles: ["admin"],
+                title: '年度对账单'
+        }
+    },
 ]
 
 export default routers;

src/views/report/yearSOA.vue

@@ -0,0 +1,142 @@
+<template>
+  <div>
+    <el-breadcrumb separator=">">
+      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+      <el-breadcrumb-item>
+        <a href="#">统计报表</a>
+      </el-breadcrumb-item>
+      <el-breadcrumb-item>
+        <a href="#/report/yearTransactionRanking">年度对账单</a>
+      </el-breadcrumb-item>
+    </el-breadcrumb>
+    <el-divider></el-divider>
+    <!--
+      要resetFields起作用，必须配置:model和prop
+    -->
+    <el-form ref="queryForm" :model="queryModel" inline class="demo-form-inline">
+      <el-form-item label="客户" prop="customerId">
+        <el-select size="mini" v-model="queryModel.customerId" filterable>
+          <el-option v-for="customer in customerList" :key="customer.id" :label="customer.allName" :value="customer.id"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="年度" prop="selectDate">
+        <el-date-picker type="year" size="mini" :editable="false" v-model="queryModel.selectDate"></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" size="mini" icon="ios-search" @click="changePage" :loading="loading">查询</el-button>&nbsp;
+        <el-button type="info" size="mini" style="margin-left: 8px" @click="handleReset('queryForm')">重置</el-button>&nbsp;
+        <el-button v-if="dataList.length > 0" type="success" size="mini" icon="ios-search" @click="exportXls" :loading="loading">下载</el-button>&nbsp;
+      </el-form-item>
+    </el-form>
+    <el-divider></el-divider>
+    <el-table :data="dataList" style="min-height:400px;" v-loading="loading" stripe>
+      <el-table-column label="日期" width="120">
+        <template slot-scope="{row}">
+          <span v-if="row.month != null && row.day != null">{{dataYear}}-{{row.month}}-{{row.day}}</span>
+          <span v-if="row.month == '合计'">{{row.month}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="planNumber" label="计划单号"></el-table-column>
+      <el-table-column prop="summary" label="摘要"></el-table-column>
+      <el-table-column prop="debit" label="借方" width="120"></el-table-column>
+      <el-table-column prop="credit" label="贷方" width="120"></el-table-column>
+      <el-table-column prop="balance" label="余额" width="120"></el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+import Constant from "@/constant";
+import reportApi from "@/api/report";
+import customerApi from "@/api/base/customer";
+import NProgress from "nprogress"; // progress bar
+import "nprogress/nprogress.css"; // progress bar style
+
+export default {
+  data() {
+    return {
+      queryModel: {
+        "customerId": "",
+        "selectDate": "",
+      },
+      loading: false,
+      customerList: [],
+      dataName: "",
+      dataYear: "",
+      dataList: [],
+    };
+  },
+  methods: {
+    changePage() {
+      var self = this;
+      self.loading = true;
+
+      var formData = new FormData();
+      formData.append("customerId", self.queryModel.customerId);
+      formData.append("selectDate", self.queryModel.selectDate);
+
+      reportApi.yearSOA(formData).then(function (response) {
+        self.loading = false;
+
+        var jsonData = response.data;
+        if(jsonData.result){
+          self.dataYear = jsonData.data.year;
+          self.dataName = jsonData.data.name;
+          self.dataList = jsonData.data.list;
+        }
+      }).catch((error) => {
+        self.loading = false;
+      });
+    },
+    exportXls() {
+      var self = this;
+      self.loading = true;
+
+      var formData = new FormData();
+      formData.append("customerId", self.queryModel.customerId);
+      formData.append("selectDate", self.queryModel.selectDate);
+
+      reportApi.yearSOAXls(formData).then(function (response) {
+        self.loading = false;
+
+        var jsonData = response.data;
+        self.$message({
+          showClose: true,
+          dangerouslyUseHTMLString: true,
+          message: jsonData.message + `,<a href="${jsonData.data}" target="_blank">点击下载</a>&nbsp;`,
+          duration: 30000,
+        });
+      }).catch((error) => {
+        self.loading = false;
+      });
+    },
+    handleReset(name) {
+      this.$refs[name].resetFields();
+    },
+  },
+  mounted: function () {
+    customerApi.findList().then(response => {
+      this.customerList = response.data.data;
+    });
+  },
+};
+</script>
+<style lang="scss" scoped>
+.el-breadcrumb {
+  margin: 10px;
+  line-height: 20px;
+}
+
+.el-divider {
+  margin: 5px 0;
+}
+
+.demo-form-inline {
+  margin-left: 10px;
+  text-align: left;
+}
+
+.button-group {
+  margin-left: 10px;
+  text-align: left;
+}
+</style>