up

src/views/login/index.vue

@@ -25,7 +25,7 @@
               <svg-icon icon-class="password" />
             </span>
             <el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
-              placeholder="请输入密码" auto-complete="off" name="password" tabindex="2" auto-complete="off" @keyup.enter.native="handleLogin" />
+              placeholder="请输入密码" name="password" tabindex="2" auto-complete="off" @keyup.enter.native="handleLogin" />
 
           </el-form-item>
 

src/views/report/visit/periodRpt.vue

@@ -7,12 +7,8 @@
           <div slot="content"></div>
           <slot>
             <div>
-             <el-date-picker
+              <el-date-picker v-model="searchFields.date" value-format="yyyy-MM-dd" type="date" placeholder="选择日期">
-                   v-model="searchFields.date"
+              </el-date-picker>
-                   value-format="yyyy-MM-dd"
-                   type="date"
-                   placeholder="选择日期">
-                 </el-date-picker>
 
               <Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
               <Button type="primary" @click="viewPart" style="margin-left: 10px">{{btnText}}</Button>
@@ -41,7 +37,7 @@
         </el-table>
       </div>
       <div v-else>
-        <line-chart :chartData="periodData" :height="chartHeight"/>
+        <line-chart :chartData="periodData" :height="chartHeight" />
       </div>
     </div>
 
@@ -50,7 +46,9 @@
 <script>
   import LxHeader from "@/components/LxHeader/index.vue";
   import LineChart from '../components/LineChart'
-  import { ElMapExportTable } from "table-excel";
+  import {
+    ElMapExportTable
+  } from "table-excel";
   import {
     detailRpt
   } from "@/api/report/visit.js";
@@ -68,34 +66,54 @@
       return {
         showData: false,
         searchFields: {
-          date:"",
+          date: "",
         },
         tableData: [],
         tableHeight: 0,
-        chartHeight:"",
+        chartHeight: "",
-        btnText:"数据展示",
+        btnText: "数据展示",
         periodData: {
-          xArr:[],
+          xArr: [],
-          series:{},
+          series: {},
-          legendArr:["预约人数","入场人数","男性人数","女性人数"]
+          legendArr: ["预约人数", "入场人数", "男性人数", "女性人数"]
         }
       }
     },
     methods: {
       /** 导出按钮操作 */
-      handleGo(){
+      handleGo() {
         var data = this.tableData; // 这里面是数据列表
-        const column = [
+        const column = [{
-          { title: "时段", dataIndex: "daterange" }, // dataIndex为数据列表中的数据字段
+            title: "时段",
-          { title: "预约人数", dataIndex: "plan_total" },
+            dataIndex: "daterange"
-          { title: "入场人数", dataIndex: "use_total" },
+          }, // dataIndex为数据列表中的数据字段
-          { title: "性别男", dataIndex: "man_total" },
+          {
-          { title: "性别女", dataIndex: "woman_total" },
+            title: "预约人数",
-          { title: "核销比", dataIndex: "per" },
+            dataIndex: "plan_total"
+          },
+          {
+            title: "入场人数",
+            dataIndex: "use_total"
+          },
+          {
+            title: "性别男",
+            dataIndex: "man_total"
+          },
+          {
+            title: "性别女",
+            dataIndex: "woman_total"
+          },
+          {
+            title: "核销比",
+            dataIndex: "per"
+          },
         ];
-        const instance = new ElMapExportTable(
+        const instance = new ElMapExportTable({
-          { column, data },
+            column,
-          { progress: progress => console.log(progress) }// 进度条回调
+            data
+          }, {
+            progress: progress => console.log(progress)
+          } // 进度条回调
         );
         instance.download("时段统计报表"); // 导出的文件名
       },
@@ -111,24 +129,30 @@
         var topHeight = 50; //页面 头部
         let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
         that.tableHeight = tableHeight;
-        that.chartHeight = tableHeight+"px";
+        that.chartHeight = tableHeight + "px";
         this.searchFields.date = this.getToday();
 
       },
       load() {
         // this.showData = true;
-        var planarr=[];
+        var planarr = [];
-        var xArr=[];
+        var xArr = [];
-        var usearr=[];
+        var usearr = [];
         var manarr = [];
         var womanarr = [];
 
         detailRpt({
-          date:this.searchFields.date
+          date: this.searchFields.date
         }).then((res) => {
-          for (var m of res) {
+          console.log(res)
+          var _res = [];
+          Object.keys(res).map((key, item) => {
+            _res.push(res[key])
+          });
+          for (var m of _res) {
+            console.log(m)
             m.per = ((m.use_total / (m.plan_total == 0 ? 1 : m.plan_total)) * 100).toFixed(2) + "%"
-            m.daterange =  m.start_time+"-"+m.end_time;
+            m.daterange = m.time;
             xArr.push(m.daterange);
             planarr.push(
               m.plan_total
@@ -145,41 +169,42 @@
 
           }
           this.periodData.xArr = xArr;
-          this.periodData.series=[
+          this.periodData.series = [{
-            {
+              name: "预约人数",
-              name:"预约人数",
               type: 'bar',
-              data:planarr
+              data: planarr
             },
             {
-              name:"入场人数",
+              name: "入场人数",
               type: 'bar',
-              data:usearr
+              data: usearr
             },
             {
-              name:"男性人数",
+              name: "男性人数",
               type: 'bar',
-              data:manarr
+              data: manarr
             },
             {
-              name:"女性人数",
+              name: "女性人数",
               type: 'bar',
-              data:womanarr
+              data: womanarr
             },
           ]
 
-          this.tableData = res
+          this.tableData = _res
 
-        }).catch((res) => {})
+        }).catch((res) => {
+          console.log(res)
+        })
       },
-      getToday(){
+      getToday() {
-        let date =new Date()
+        let date = new Date()
         var y = date.getFullYear();
-        var m = date.getMonth()+1;
+        var m = date.getMonth() + 1;
-              m = m <10?'0'+ m : m;
+        m = m < 10 ? '0' + m : m;
         var d = date.getDate();
-              d = d <10?'0'+ d : d;
+        d = d < 10 ? '0' + d : d;
-        return y +'-'+ m +'-'+ d;
+        return y + '-' + m + '-' + d;
       },
 
     }