前端代码合并提交

src/views/noCar/calculateInfostatis.vue

@@ -0,0 +1,192 @@
+<template>
+    <div class="calculateInfo_container">
+      <div class="title">
+        <el-row>
+          <el-col :span="24">
+            <div class="top">
+               <div class="demo-input-suffix">
+                <el-input  placeholder="客户名称" class="input-demo" v-model="formCondition.customId"></el-input>
+
+                <el-input  placeholder="购方税号" class="input-demo" v-model="formCondition.buyerTaxpayerCode"></el-input>
+                 <el-input  placeholder="购方名称" class="input-demo" v-model="formCondition.buyerName"></el-input>
+
+              </div>
+              <div class="demo-input-suffix" style="margin-top: 5px;margin-left: 10px;">
+                <el-date-picker v-model="formCondition.invoiceMakeTime" type="daterange" value-format="yyyy-MM-dd HH:mm:SS" range-separator="至" start-placeholder="开票时间始" end-placeholder="开票时间止"></el-date-picker>
+                <el-date-picker v-model="formCondition.calculateTime" type="daterange" value-format="yyyy-MM-dd HH:mm:SS" range-separator="至" start-placeholder="计费时间始" end-placeholder="计费时间止"></el-date-picker>
+                <el-button type="success" style="margin-left: 1%;" @click="loadData">查询</el-button>
+                      <el-button type="primary" style="margin-left: 1%;" @click="exportExcel">导出报表</el-button>
+              </div>
+            </div>
+          </el-col>
+        </el-row>
+      </div>
+      <!-- 表格部分 -->
+        <template>
+        <el-table
+          class="table"
+          v-loading="loading"
+          ref="multipleTable"
+          :data="calculateInfo"
+          :height="heightt"
+          border
+          tooltip-effect="dark">
+          <el-table-column
+            label="客户主体"
+            prop="customId"
+            show-overflow-tooltip>
+          </el-table-column>
+           <el-table-column
+            label="购方名称"
+            prop="buyerName"
+            show-overflow-tooltip>
+          </el-table-column>
+          <el-table-column
+            label="购方税号"
+            prop="buyerTaxpayerCode"
+            show-overflow-tooltip>
+          </el-table-column>
+          <el-table-column
+            label="费用个数"
+            prop="feeCount"
+            show-overflow-tooltip>
+          </el-table-column>
+        </el-table>
+      </template>
+    </div>
+</template>
+<script type="text/javascript">
+import FileSaver from "file-saver";
+import XLSX from "xlsx";
+      export default {
+        data(){
+          return{
+            formCondition:{
+            },
+            calculateInfo:[],
+            current: 1,
+             hightt:'0px',
+            pagesize: 8,
+            total:''
+          }
+        },
+        created() {
+          this.heightt = tableHeight;
+          this.loadData();
+        },
+         filters: {
+            rounding (value) {
+              return value.toFixed(2)
+            }
+        },
+        methods:{
+          // 列表展示
+          async loadData() {
+            const formData = new FormData();
+            formData.append('current', this.current);
+            formData.append('size', this.pagesize);
+            for(var i in this.formCondition){
+                formData.append(i,this.formCondition[i]);
+            }
+            const response = await this.$http.post(`noCar/findNocarCalculateInfoStatis`, formData);
+            if (response.data.code === 0) {
+              this.calculateInfo = response.data.data;
+            }
+          },
+
+         
+       async    exportExcel() {
+         let curr = this.current;
+      let pagesize1 = this.pagesize;
+      this.current = 1; 
+      this.pagesize = this.total;
+      await this.loadData();
+      // 设置当前日期
+      let time = new Date();
+      //console.log(time);
+      let year = time.getFullYear();
+      let month = time.getMonth() + 1;
+      let day = time.getDate();
+      let name = "无车计费查询列表_"+year + "" + month + "" + day;
+      // console.log(name)
+      /* generate workbook object from table */
+      //  .table要导出的是哪一个表格
+      var wb = XLSX.utils.table_to_book(document.querySelector(".table"),{ raw: true });
+      /* get binary string as output */
+      var wbout = XLSX.write(wb, {
+        bookType: "xlsx",
+        bookSST: true,
+        type: "array"
+      });
+      try {
+        //  name+'.xlsx'表示导出的excel表格名字
+        FileSaver.saveAs(
+          new Blob([wbout], { type: "application/octet-stream" }),
+          name + ".xlsx"
+        );
+      } catch (e) {
+        if (typeof console !== "undefined") console.log(e, wbout);
+      }
+       this.current = curr; 
+      this.pagesize = pagesize1;
+      this.loadData();
+      return wbout;
+    },
+        }
+      };
+</script>
+<style>
+.calculateInfo_container {
+  border: 1px solid #d9d9d9;
+  border-radius: 10px;
+}
+.calculateInfo_container .title {
+  font-size: 5px;
+  margin-bottom: 20px;
+}
+.calculateInfo_container .top {
+  padding-top: 20px;
+  padding-left: 20px;
+}
+.calculateInfo_container .text {
+  display: inline-block;
+  color: #000;
+  font-size: 16px ;
+  margin-left: 1%;
+}
+.calculateInfo_container .input-demo {
+  display: inline-block;
+  width: 20%;
+  margin-left: 1%;
+}
+.calculateInfo_container .block {
+  font-size: 5px;
+  text-align: center;
+  margin-top: 25px;
+  margin-bottom: 25px;
+}
+.calculateInfo_container .el-dialog {
+  width: 60%;
+}
+.calculateInfo_container .el-dialog__header, .el-dialog__body {
+  padding: 0 20px;
+}
+.calculateInfo_container .tou {
+  font-size: 20px;
+  height: 30px;
+  line-height: 30px;
+  padding-top: 15px;
+}
+.calculateInfo_container .line {
+  margin-top: 15px;
+  margin-bottom: 15px;
+  width: 100%;
+  height: 2px;
+  background-color: #d9d9d9;
+}
+.calculateInfo_container .xinxi {
+  text-align: center;
+  margin: 15px auto;
+  font-size: 18px;
+}
+</style>