服务器部署

.env.production

@@ -1,3 +1,3 @@
 OUT_PUT_DIR=dist/printing-portal
 
-VUE_APP_BACKEND_URL=http://47.98.231.198:8086/printing-server
+VUE_APP_BACKEND_URL=http://192.168.77.111/printing-server

src/api/report.js

@@ -9,6 +9,10 @@ function transactionRankingXls(formData) {
   return request.post(constant.serverUrl + "/report/transactionRankingXls", formData);
 }
 
+function transactionReportBoss(formData) {
+  return request.post(constant.serverUrl + "/report/transactionReportBoss", formData);
+}
+
 export default {
-  transactionRanking,transactionRankingXls
+  transactionRanking,transactionRankingXls,transactionReportBoss
 }

src/routers/modules/report.js

@@ -17,6 +17,15 @@ var routers = [
                 title: '月度交易额排行'
         }
     },
+    {
+        path: '/report/monthTransactionList',
+        name: 'ReportMonthTransactionList',
+        component: () => import('@/views/report/monthTransactionList.vue'),
+        meta: {
+                roles: ["admin"],
+                title: '月度交易额报表'
+        }
+    },
 ]
 
 export default routers;

src/views/report/monthTransactionList.vue

@@ -0,0 +1,136 @@
+<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/monthTransactionRanking">月度交易额报表</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="selectDate">
+        <el-date-picker type="month" 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="tableData.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="tableData" style="min-height:400px;" v-loading="loading" stripe>
+      <el-table-column prop="customerName" label="客户"></el-table-column>
+      <el-table-column prop="actualAmount" label="加工金额"></el-table-column>
+      <el-table-column prop="clothAmount" label="坯布金额"></el-table-column>
+      <el-table-column prop="rollAmount" label="力工金额"></el-table-column>
+      <el-table-column prop="totalAmount" label="总金额"></el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+import Constant from "@/constant";
+import reportApi from "@/api/report";
+import NProgress from "nprogress"; // progress bar
+import "nprogress/nprogress.css"; // progress bar style
+
+export default {
+  data() {
+    return {
+      queryModel: {
+        "selectDate": "",
+        "startDay": "",
+        "endDay": "",
+      },
+      loading: false,
+      tableData: [],
+    };
+  },
+  methods: {
+    changePage() {
+      var self = this;
+      self.loading = true;
+
+      var formData = new FormData();
+      formData.append("startDay", self.queryModel.startDay);
+      formData.append("endDay", self.queryModel.endDay);
+
+      reportApi.transactionReportBoss(formData).then(function (response) {
+        self.loading = false;
+
+        var jsonData = response.data;
+
+        self.tableData = jsonData.data;
+      }).catch((error) => {
+        self.loading = false;
+      });
+    },
+    exportXls() {
+      var self = this;
+      self.loading = true;
+
+      var formData = new FormData();
+      formData.append("startDay", self.queryModel.startDay);
+      formData.append("endDay", self.queryModel.endDay);
+      formData.append("limit", self.queryModel.limit);
+      formData.append("title", "月度交易额排行");
+
+      reportApi.transactionRankingXls(formData).then(function (response) {
+        self.loading = false;
+
+        var jsonData = response.data;
+        self.$message({
+          showClose: true,
+          dangerouslyUseHTMLString: true,
+          message: response.message + `,<a href="${jsonData.data}" target="_blank">点击下载</a>&nbsp;`,
+          duration: 30000,
+        });
+      }).catch((error) => {
+        self.loading = false;
+      });
+    },
+    handleReset(name) {
+      this.$refs[name].resetFields();
+    },
+  },
+  watch: {
+    "queryModel.selectDate"(value) {
+      if(value != ""){
+        var date = new Date(value);
+        this.queryModel.startDay = date.getFullYear() + "-" + (date.getMonth() + 1) + "-01";
+        var lastDate = new Date(date.setMonth(date.getMonth() + 1));
+        this.queryModel.endDay = lastDate.getFullYear() + "-" + (lastDate.getMonth() + 1) + "-01";
+      }
+      else{
+        this.queryModel.startDay = "";
+        this.queryModel.endDay = "";
+      }
+    }
+  },
+};
+</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>

src/views/report/monthTransactionRanking.vue

@@ -25,8 +25,8 @@
     </el-form>
     <el-divider></el-divider>
     <el-table :data="tableData" style="min-height:400px;" v-loading="loading" stripe>
-      <el-table-column prop="name" label="客户"></el-table-column>
-      <el-table-column prop="value" label="金额"></el-table-column>
+      <el-table-column prop="customerName" label="客户"></el-table-column>
+      <el-table-column prop="totalAmount" label="金额"></el-table-column>
     </el-table>
   </div>
 </template>
@@ -83,9 +83,12 @@ export default {
         self.loading = false;
 
         var jsonData = response.data;
-        console.log(jsonData);
-
-        // self.tableData = jsonData.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;
       });

src/views/report/yearTransactionRanking.vue

@@ -25,8 +25,8 @@
     </el-form>
     <el-divider></el-divider>
     <el-table :data="tableData" style="min-height:400px;" v-loading="loading" stripe>
-      <el-table-column prop="name" label="客户"></el-table-column>
-      <el-table-column prop="value" label="金额"></el-table-column>
+      <el-table-column prop="customerName" label="客户"></el-table-column>
+      <el-table-column prop="totalAmount" label="金额"></el-table-column>
     </el-table>
   </div>
 </template>
@@ -83,9 +83,12 @@ export default {
         self.loading = false;
 
         var jsonData = response.data;
-        console.log(jsonData);
-
-        // self.tableData = jsonData.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;
       });