统计

src/router/index.js

@@ -413,6 +413,12 @@ export const asyncRouterMap = [{
       component: _import('order/memberOrderInfo/index'),
       name: '会员订单管理',
       authority: 'memberOrderInfo'
+    },
+    {
+      path: 'orderStatistics',
+      component: _import('order/orderStatistics/index'),
+      name: '会员订单统计',
+      authority: 'orderStatistics'
     }
   ]
 },

src/views/order/orderStatistics/index.vue

+<template>
+  <div class="app-container calendar-list-container">
+    <div class="filter-container">
+      <el-form ref="queryForm" :model="listQuery" label-width="100px">
+        <el-row>
+          <el-col :span="5">
+            <el-form-item label="统计时间:">
+              <el-date-picker
+                v-model="listQuery.time"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                @change="changeTime"
+                placeholder="请选择统计时间"
+              ></el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5">
+            <el-form-item label="统计方式:" class="wayMsg">
+              <span
+                v-for="(item,index) in way"
+                :key="index"
+                :class="{active:isactive==item.label}"
+                @click="changeWay(item.label)"
+              >{{item.label}}</span>
+            </el-form-item>
+          </el-col>
+          <el-col :span="5" style="float:right;text-align:right">
+            <el-button class="filter-item" type="primary" v-waves @click="handleFilter">导出为Excel</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <el-table
+        :key="tableKey"
+        :data="list"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%"
+      >
+        <el-table-column align="center" label="时间">
+          <template scope="scope">
+            <span>{{scope.row.id}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="普通会员购买量">
+          <template scope="scope">
+            <span>{{scope.row.no}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="支付金额(普通会员)">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="黄金会员购买量">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="支付金额(普通会员)">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="支付金额(黄金会员)">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="钻石会员购买量">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="支付金额(钻石会员)">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+         <el-table-column align="center" label="总支付金额">
+          <template scope="scope">
+            <span>{{scope.row.name}}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  created() {},
+  data() {
+    return {
+      // 统计时间筛选
+      listQuery: {
+        time: "null"
+      },
+      //统计方式筛选
+      way: [
+        {
+          label: "全部",
+          id: "0"
+        },
+        {
+          label: "日统计",
+          id: "1"
+        },
+        {
+          label: "周统计",
+          id: "2"
+        },
+        {
+          label: "月统计",
+          id: "3"
+        }
+      ],
+      isactive: "全部"
+    };
+  },
+  methods: {
+    //统计时间筛选
+    changeTime() {
+      console.log("----");
+    },
+    //统计方式筛选
+    changeWay(val) {
+      this.isactive = val;
+    },
+    //导出
+    handleFilter() {}
+  }
+};
+</script>
+<style>
+.wayMsg span {
+  margin: 10px;
+  cursor: pointer;
+}
+.active {
+  color: #409eff;
+  font-weight: bold;
+}
+</style>
\ No newline at end of file

src/views/vehicle/vehicleSchedulManage/vehiclePlanModal.vue

@@ -29,14 +29,23 @@
         <span v-if="currentItem.item.vehicleModel.keyword">{{currentItem.item.vehicleModel.keyword}}</span>
       </el-form-item>
       <el-form-item label="选择时间" prop="times">
-        <el-date-picker
+        <!-- <el-date-picker
           v-model="form.times"
           type="datetimerange"
           :picker-options="pickerOptions0"
           format="yyyy-MM-dd HH:00:00"
           value-format="yyyy-MM-dd HH:00:00"
-          placeholder="选择时间范围">
-        </el-date-picker>
+          placeholder="选择时间范围"
+        ></el-date-picker> -->
+        <el-time-picker
+          is-range
+          v-model="form.times"
+          range-separator="-"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          placeholder="选择时间范围"
+          value-format="HH-mm-ss"
+        ></el-time-picker>
       </el-form-item>
       <el-form-item label="还车分公司" prop="arrivalBranchCompanyName">
         <el-autocomplete
@@ -59,7 +68,6 @@
           <el-option label="客户用车" value="9"></el-option>
           <el-option label="其他" value="10"></el-option>
 
-
           <!--<el-option v-for="item  in getAllUseType() " :key="item.code" :label="item.val"-->
           <!--:value="item.code"></el-option>-->
         </el-select>
@@ -81,63 +89,60 @@
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button @click="cancel()">取消</el-button>
-      <el-button type="primary" @click="handelOk('form')" v-if="vehicleSchedulManage_btn_add_plan">确 定</el-button>
+      <el-button
+        type="primary"
+        @click="handelOk('form')"
+        v-if="vehicleSchedulManage_btn_add_plan"
+      >确 定</el-button>
     </div>
   </el-dialog>
 </template>
 <style>
-  .user-car .el-row{
+.user-car .el-row {
   margin-bottom: 0;
-  }
+}
 </style>
 <script>
-  import {mapGetters} from 'vuex';
-  import {
+import { mapGetters } from "vuex";
+import {
   VEHICLE_CONSTANT_VEHICLE_BRAND,
   VEHICLE_CONSTANT_VEHICLE_USE,
   VEHICLE_CONSTANT_BRAND_CODE_UNKOWN,
   BELONG_TO_TYPE_OWN,
   VEHICLE_CONSTANT_USE_TYPE_UNKOWN,
   VEHICLE_CONSTANT_STATUS_NORMAL
-  } from '../../../store/modules/baseInfo';
-  import {
+} from "../../../store/modules/baseInfo";
+import {
   getConstantByTypeAndCode,
   getConstantListByType,
   getAllInsuranceCompany,
   getInsuranceCompany
-  } from 'api/base_info/constant/';
-  import {
-    getAllCompany,
-    getAll
-  } from 'api/base_info/branch_company/';
-  import {
-    bookPlan,
-    getUpkeepAll
-  } from 'api/vehicle/vehicleSchedulManage';
-  import ElRow from "element-ui/packages/row/src/row";
-  import ElCol from "element-ui/packages/col/src/col";
-  import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
-  import {
-    formatDate
-  } from 'utils/dateFormattor';
-  export default {
+} from "api/base_info/constant/";
+import { getAllCompany, getAll } from "api/base_info/branch_company/";
+import { bookPlan, getUpkeepAll } from "api/vehicle/vehicleSchedulManage";
+import ElRow from "element-ui/packages/row/src/row";
+import ElCol from "element-ui/packages/col/src/col";
+import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
+import { formatDate } from "utils/dateFormattor";
+export default {
   components: {
     ElFormItem,
     ElCol,
-      ElRow},
+    ElRow
+  },
   props: ["currentItem"],
-    name: 'vehiclePlanModal',
+  name: "vehiclePlanModal",
   data() {
     var checkPhone = (rule, value, callback) => {
       if (!value) {
-          return callback(new Error('手机号不能为空'));
+        return callback(new Error("手机号不能为空"));
       } else {
-          const reg = /^[1](([3][0-9])|([4][5,7,9])|([5][0-9])|([6][6])|([7][1,2,3,5,6,7,8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/
+        const reg = /^[1](([3][0-9])|([4][5,7,9])|([5][0-9])|([6][6])|([7][1,2,3,5,6,7,8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/;
         console.log(reg.test(value));
         if (reg.test(value)) {
           callback();
         } else {
-            return callback(new Error('请输入正确的手机号'));
+          return callback(new Error("请输入正确的手机号"));
         }
       }
     };
@@ -147,80 +152,83 @@
           return time.getTime() < Date.now() - 8.64e7;
         }
       },
-        anpai:false,
-        allCompaniesArr:[],
-        upkeepList:[],
-        form:{
+      anpai: false,
+      allCompaniesArr: [],
+      upkeepList: [],
+      form: {
         remark: "",
         vehicleUsername: "",
-          arrivalBranchCompanyId: undefined,//还车分公司id
-          arrivalBranchCompanyName: "",//还车分公司名称
-          vehicleUserPhone:"",//使用人联系电话
-          bookType: undefined,//用途
+        arrivalBranchCompanyId: undefined, //还车分公司id
+        arrivalBranchCompanyName: "", //还车分公司名称
+        vehicleUserPhone: "", //使用人联系电话
+        bookType: undefined, //用途
         times: [],
-          upkeepIds:[]
+        upkeepIds: []
       },
       rules: {
         vehicleUsername: [
           {
-              type: 'string',
+            type: "string",
             required: true,
-              message: '请输入使用人姓名',
-              trigger: 'blur'
+            message: "请输入使用人姓名",
+            trigger: "blur"
           },
           {
             min: 0,
             max: 20,
-              message: '长度小于 20 个字符',
-              trigger: 'blur'
+            message: "长度小于 20 个字符",
+            trigger: "blur"
           }
         ],
-          arrivalBranchCompanyName:{
-            type: 'string',
+        arrivalBranchCompanyName: {
+          type: "string",
           required: true,
-            message: '请选择还车公司',
-            trigger: 'change'
+          message: "请选择还车公司",
+          trigger: "change"
         },
-          vehicleUserPhone:{validator: checkPhone, trigger: 'blur',required: true},
-          bookType:{
-            type: 'string',
+        vehicleUserPhone: {
+          validator: checkPhone,
+          trigger: "blur",
+          required: true
+        },
+        bookType: {
+          type: "string",
           required: true,
-            message: '请选择用途',
-            trigger: 'change'
+          message: "请选择用途",
+          trigger: "change"
         },
         times: {
           required: true,
-            message: '请选择时间',
+          message: "请选择时间"
         }
       },
-        vehicleSchedulManage_btn_add_plan: false,//申请预定
-      }
+      vehicleSchedulManage_btn_add_plan: false //申请预定
+    };
   },
   created() {
     console.log(this.currentItem);
-      this.vehicleSchedulManage_btn_add_plan = this.elements['vehicleSchedulManage:btn_add_plan'];
-      getAll()
-        .then(response => {
+    this.vehicleSchedulManage_btn_add_plan = this.elements[
+      "vehicleSchedulManage:btn_add_plan"
+    ];
+    getAll().then(response => {
       this.allCompaniesArr = response.data;
-        })
+    });
     getAllCompany(codeAndBranchCompany => {
       this.allCompanies = codeAndBranchCompany;
     });
     getUpkeepAll().then(response => {
-        this.upkeepList = response.data
-      })
+      this.upkeepList = response.data;
+    });
   },
   computed: {
-      ...mapGetters([
-        'elements',
-      ]),
+    ...mapGetters(["elements"])
   },
   watch: {
-      anpai(newValue, oldValue){
-        if(!newValue){
+    anpai(newValue, oldValue) {
+      if (!newValue) {
         this.$emit("anpaiDialogEvent", false);
       }
-      },
+    }
   },
   mounted() {
     this.anpai = true;
@@ -229,25 +237,27 @@
     /**
      * 还车分公司
      */
-      handleSelectArrivalCompanyName(item){
+    handleSelectArrivalCompanyName(item) {
       this.form.arrivalBranchCompanyId = item.id;
       this.form.arrivalBranchCompanyName = item.name;
       console.log(item);
     },
     querySearch(queryString, cb) {
       let selectArry = [];
-        this.allCompaniesArr.map(function(item){
+      this.allCompaniesArr.map(function(item) {
         item.value = item.name;
         selectArry.push(item);
       });
       this.selectArry = selectArry;
-        var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry;
+      var results = queryString
+        ? selectArry.filter(this.createFilter(queryString))
+        : selectArry;
       // 调用 callback 返回建议列表的数据
       cb(results);
     },
     createFilter(queryString) {
-        return (restaurant) => {
-          return (restaurant.name.indexOf(queryString.toLowerCase()) != -1);
+      return restaurant => {
+        return restaurant.name.indexOf(queryString.toLowerCase()) != -1;
       };
     },
     /**
@@ -259,49 +269,53 @@
     /**
      * 确定用车
      * */
-      handelOk(formName){
+    handelOk(formName) {
       const set = this.$refs;
-        // console.log(formatDate(this.form.times[0], "yyyy-MM-dd hh:mm:ss"));
+      // console.log(this.form.times)
+      console.log(formatDate(this.form.times[0], "hh:mm:ss"));
+      console.log(formatDate(this.form.times[1], "hh:mm:ss"));
       set[formName].validate(valid => {
         if (valid) {
-            if(this.form.bookType==6){
-              if(this.form.upkeepIds.length==0){
+          if (this.form.bookType == 6) {
+            if (this.form.upkeepIds.length == 0) {
               this.$notify({
-                  title: '警告',
-                  message: '请选择保养类型',
-                  type: 'warning',
+                title: "警告",
+                message: "请选择保养类型",
+                type: "warning",
                 duration: 2000
               });
               return false;
             }
           }
           let params = {
-              vehicleId:this.currentItem.item.id,
-              bookStartDate: formatDate(this.form.times[0], "yyyy-MM-dd hh") + ":00:00",//预定开始时间
-              bookEndDate: formatDate(this.form.times[1], "yyyy-MM-dd hh") + ":00:00",//预定结束时间
-              retCompany: this.form.arrivalBranchCompanyId,//还车分公司
-              bookType: this.form.bookType,//预定车辆用途类型
-              vehicleUsername: this.form.vehicleUsername,//使用人姓名
-              vehicleUserPhone: this.form.vehicleUserPhone,//使用人电话
-              remark: this.form.remark,//说明
-              upkeepIds:this.form.bookType==6?this.form.upkeepIds.join(","):'',//保养类型
+            vehicleId: this.currentItem.item.id,
+            bookStartDate:
+              formatDate(this.form.times[0], "hh:mm:ss"), //预定开始时间
+            bookEndDate:
+              formatDate(this.form.times[1], "hh:mm:ss"), //预定结束时间
+            retCompany: this.form.arrivalBranchCompanyId, //还车分公司
+            bookType: this.form.bookType, //预定车辆用途类型
+            vehicleUsername: this.form.vehicleUsername, //使用人姓名
+            vehicleUserPhone: this.form.vehicleUserPhone, //使用人电话
+            remark: this.form.remark, //说明
+            upkeepIds:
+              this.form.bookType == 6 ? this.form.upkeepIds.join(",") : "" //保养类型
           };
           bookPlan(params).then(response => {
             if (response.status === 200) {
               this.$emit("anpaiDialogEvent", true);
             } else {
               this.$notify({
-                  title: '失败',
+                title: "失败",
                 message: response.message,
-                  type: 'error',
+                type: "error",
                 duration: 2000
               });
             }
-            })
+          });
         }
-        })
-      },
-
+      });
     }
   }
+};
 </script>
\ No newline at end of file