统计

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

 <!--车辆排班   保养弹框-->
 <template>
   <el-dialog title="安排用车" :visible.sync="anpai" class="user-car">
-    <el-form :model="form"  ref="form" :rules="rules" label-width="140px">
+    <el-form :model="form" ref="form" :rules="rules" label-width="140px">
       <el-form-item label="车牌号">
         <span>{{currentItem.item.numberPlate}}</span>
       </el-form-item>
@@ -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" 
+          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,9 +68,8 @@
           <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>-->
+          <!--:value="item.code"></el-option>-->
         </el-select>
       </el-form-item>
       <el-form-item label="保养项目" prop="upkeepIds" v-if="form.bookType==6">
@@ -81,227 +89,233 @@
     </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{
-    margin-bottom: 0;
-  }
+.user-car .el-row {
+  margin-bottom: 0;
+}
 </style>
 <script>
-  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 {
-    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 {
-    components: {
-      ElFormItem,
-      ElCol,
-      ElRow},
-    props: ["currentItem"],
-    name: 'vehiclePlanModal',
-    data() {
-      var checkPhone = (rule, value, callback) => {
-        if (!value) {
-          return callback(new Error('手机号不能为空'));
+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 {
+  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 {
+  components: {
+    ElFormItem,
+    ElCol,
+    ElRow
+  },
+  props: ["currentItem"],
+  name: "vehiclePlanModal",
+  data() {
+    var checkPhone = (rule, value, callback) => {
+      if (!value) {
+        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}$/;
+        console.log(reg.test(value));
+        if (reg.test(value)) {
+          callback();
         } 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}$/
-          console.log(reg.test(value));
-          if (reg.test(value)) {
-            callback();
-          } else {
-            return callback(new Error('请输入正确的手机号'));
-          }
+          return callback(new Error("请输入正确的手机号"));
         }
-      };
-      return {
-        pickerOptions0: {
-          disabledDate(time) {
-            return time.getTime() < Date.now() - 8.64e7;
-          }
-        },
-        anpai:false,
-        allCompaniesArr:[],
-        upkeepList:[],
-        form:{
-          remark: "",
-          vehicleUsername: "",
-          arrivalBranchCompanyId: undefined,//还车分公司id
-          arrivalBranchCompanyName: "",//还车分公司名称
-          vehicleUserPhone:"",//使用人联系电话
-          bookType: undefined,//用途
-          times: [],
-          upkeepIds:[]
-        },
-        rules: {
-          vehicleUsername: [
-            {
-              type: 'string',
-              required: true,
-              message: '请输入使用人姓名',
-              trigger: 'blur'
-            },
-            {
-              min: 0,
-              max: 20,
-              message: '长度小于 20 个字符',
-              trigger: 'blur'
-            }
-          ],
-          arrivalBranchCompanyName:{
-            type: 'string',
-            required: true,
-            message: '请选择还车公司',
-            trigger: 'change'
-          },
-          vehicleUserPhone:{validator: checkPhone, trigger: 'blur',required: true},
-          bookType:{
-            type: 'string',
+      }
+    };
+    return {
+      pickerOptions0: {
+        disabledDate(time) {
+          return time.getTime() < Date.now() - 8.64e7;
+        }
+      },
+      anpai: false,
+      allCompaniesArr: [],
+      upkeepList: [],
+      form: {
+        remark: "",
+        vehicleUsername: "",
+        arrivalBranchCompanyId: undefined, //还车分公司id
+        arrivalBranchCompanyName: "", //还车分公司名称
+        vehicleUserPhone: "", //使用人联系电话
+        bookType: undefined, //用途
+        times: [],
+        upkeepIds: []
+      },
+      rules: {
+        vehicleUsername: [
+          {
+            type: "string",
             required: true,
-            message: '请选择用途',
-            trigger: 'change'
+            message: "请输入使用人姓名",
+            trigger: "blur"
           },
-          times: {
-            required: true,
-            message: '请选择时间',
+          {
+            min: 0,
+            max: 20,
+            message: "长度小于 20 个字符",
+            trigger: "blur"
           }
+        ],
+        arrivalBranchCompanyName: {
+          type: "string",
+          required: true,
+          message: "请选择还车公司",
+          trigger: "change"
+        },
+        vehicleUserPhone: {
+          validator: checkPhone,
+          trigger: "blur",
+          required: true
+        },
+        bookType: {
+          type: "string",
+          required: true,
+          message: "请选择用途",
+          trigger: "change"
         },
-        vehicleSchedulManage_btn_add_plan: false,//申请预定
+        times: {
+          required: true,
+          message: "请选择时间"
+        }
+      },
+      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.allCompaniesArr = response.data;
+    });
+    getAllCompany(codeAndBranchCompany => {
+      this.allCompanies = codeAndBranchCompany;
+    });
+    getUpkeepAll().then(response => {
+      this.upkeepList = response.data;
+    });
+  },
+  computed: {
+    ...mapGetters(["elements"])
+  },
+  watch: {
+    anpai(newValue, oldValue) {
+      if (!newValue) {
+        this.$emit("anpaiDialogEvent", false);
       }
+    }
+  },
+  mounted() {
+    this.anpai = true;
+  },
+  methods: {
+    /**
+     * 还车分公司
+     */
+    handleSelectArrivalCompanyName(item) {
+      this.form.arrivalBranchCompanyId = item.id;
+      this.form.arrivalBranchCompanyName = item.name;
+      console.log(item);
     },
-    created() {
-      console.log(this.currentItem);
-      this.vehicleSchedulManage_btn_add_plan = this.elements['vehicleSchedulManage:btn_add_plan'];
-      getAll()
-        .then(response => {
-          this.allCompaniesArr = response.data;
-        })
-      getAllCompany(codeAndBranchCompany => {
-        this.allCompanies = codeAndBranchCompany;
+    querySearch(queryString, cb) {
+      let selectArry = [];
+      this.allCompaniesArr.map(function(item) {
+        item.value = item.name;
+        selectArry.push(item);
       });
-      getUpkeepAll().then(response => {
-        this.upkeepList = response.data
-      })
-    },
-    computed: {
-      ...mapGetters([
-        'elements',
-      ]),
+      this.selectArry = selectArry;
+      var results = queryString
+        ? selectArry.filter(this.createFilter(queryString))
+        : selectArry;
+      // 调用 callback 返回建议列表的数据
+      cb(results);
     },
-    watch: {
-      anpai(newValue, oldValue){
-        if(!newValue){
-          this.$emit("anpaiDialogEvent", false);
-        }
-      },
+    createFilter(queryString) {
+      return restaurant => {
+        return restaurant.name.indexOf(queryString.toLowerCase()) != -1;
+      };
     },
-    mounted() {
-      this.anpai = true;
+    /**
+     * 弹框-取消
+     * */
+    cancel() {
+      this.$emit("anpaiDialogEvent", false);
     },
-    methods: {
-      /**
-       * 还车分公司
-       */
-      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){
-          item.value = item.name;
-          selectArry.push(item);
-        });
-        this.selectArry = selectArry;
-        var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry;
-        // 调用 callback 返回建议列表的数据
-        cb(results);
-      },
-      createFilter(queryString) {
-        return (restaurant) => {
-          return (restaurant.name.indexOf(queryString.toLowerCase()) != -1);
-        };
-      },
-      /**
-       * 弹框-取消
-       * */
-      cancel() {
-        this.$emit("anpaiDialogEvent", false);
-      },
-      /**
-       * 确定用车
-       * */
-      handelOk(formName){
-        const set = this.$refs;
-        // console.log(formatDate(this.form.times[0], "yyyy-MM-dd hh:mm:ss"));
-        set[formName].validate(valid => {
-          if (valid) {
-            if(this.form.bookType==6){
-              if(this.form.upkeepIds.length==0){
-                this.$notify({
-                  title: '警告',
-                  message: '请选择保养类型',
-                  type: 'warning',
-                  duration: 2000
-                });
-                return false;
-              }
+    /**
+     * 确定用车
+     * */
+    handelOk(formName) {
+      const set = this.$refs;
+      // 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) {
+              this.$notify({
+                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(","):'',//保养类型
-            };
-            bookPlan(params).then(response => {
-              if (response.status === 200) {
-                this.$emit("anpaiDialogEvent", true);
-              } else {
-                this.$notify({
-                  title: '失败',
-                  message: response.message,
-                  type: 'error',
-                  duration: 2000
-                });
-              }
-            })
           }
-        })
-      },
-
+          let params = {
+            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: "失败",
+                message: response.message,
+                type: "error",
+                duration: 2000
+              });
+            }
+          });
+        }
+      });
     }
   }
+};
 </script>
\ No newline at end of file