chenrui 4 anni fa
parent
commit
daab90e237

+ 16 - 5
src/config/router.config.js

@@ -46,7 +46,7 @@ export const asyncRouterMap = [{
   },
   {
     path: '/SetmealSales',
-    redirect: '/SetmealSales/OrderCenter',
+    redirect: '/SetmealSales/VerificationRecords',
     name: 'SetmealSales',
     component: PageView,
     meta: {
@@ -55,15 +55,26 @@ export const asyncRouterMap = [{
       permission: 'M_order_0'
     },
     children: [{
-      path: '/SetmealSales/WriteOffRecords',
-      name: 'WriteOffRecords',
-      component: () => import('@/views/SetmealSales/WriteOffRecords.vue'),
+      path: '/SetmealSales/VerificationRecords',
+      name: 'VerificationRecords',
+      component: () => import('@/views/SetmealSales/VerificationRecords.vue'),
       meta: {
         title: '核销记录',
         icon: 'file-text'
         // permission: 'M_order_list'
       }
-    }]
+    },
+    {
+      path: '/SetmealSales/PurchasedSetmeal',
+      name: 'PurchasedSetmeal',
+      component: () => import('@/views/SetmealSales/PurchasedSetmeal.vue'),
+      meta: {
+        title: '已购套餐',
+        icon: 'file-text'
+        // permission: 'M_order_list'
+      }
+    }
+    ]
   },
   {
     path: '/auth',

+ 0 - 208
src/views/SetmealSales/OrderDetailModal.vue

@@ -1,208 +0,0 @@
-<template>
-  <div>
-    <a-modal
-      title="查看详情"
-      :footer="null"
-      :width="1100"
-      :destroyOnClose="true"
-      @cancel="isShow = false"
-      v-model="isShow">
-      <v-select ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear v-show="false"></v-select>
-      <div class="orderDetail-content">
-        <a-form>
-          <a-row :gutter="24">
-            <a-col :span="8">
-              <a-form-item label="下单时间" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.orderTime }}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="单号" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.orderNo }}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="门店名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.storeName }}</span>
-              </a-form-item>
-            </a-col>
-          </a-row>
-          <a-row :gutter="24">
-            <a-col :span="8">
-              <a-form-item label="服务名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.itemName }}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.customerMobile }}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="状态" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.orderStatus }}</span>
-              </a-form-item>
-            </a-col>
-          </a-row>
-          <a-row :gutter="24">
-            <a-col :span="8">
-              <a-form-item label="应付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.payableAmount }} 元</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="实付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span v-if=" orderDetailData.payStatus == 'PAID' ">{{ orderDetailData.paymentAmount }} 元</span>
-                <span v-if=" orderDetailData.payStatus != 'PAID' ">{{ 0 }} 元</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="优惠(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.orderCoupons ? orderDetailData.couponAmount : 0 }} 元</span>
-              </a-form-item>
-            </a-col>
-          </a-row>
-          <a-row :gutter="24">
-            <a-col :span="8">
-              <a-form-item label="使用优惠券" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <span>{{ orderDetailData.orderCoupons ? orderDetailData.orderCoupons[0].couponTitle : '--' }}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="8">
-              <a-form-item label="洗车照片" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-                <div style="display: flex;">
-                  <div class="imgBox">
-                    <div>
-                      <img v-if="orderDetailData.beginImage" class="imgCar" :src="orderDetailData.beginImage" alt="" @click="isShowBeginImageModal=true">
-                      <div v-if="!orderDetailData.beginImage" class="imgCar">--</div>
-                    </div>
-                    <div>洗车前</div>
-                  </div>
-                  <div class="imgBox">
-                    <div>
-                      <img v-if="orderDetailData.endImage" class="imgCar" :src="orderDetailData.endImage" alt="" @click="isShowEndImageModal=true">
-                      <div v-if="!orderDetailData.endImage" class="imgCar">--</div>
-                    </div>
-                    <div>洗车后</div>
-                  </div>
-                </div>
-              </a-form-item>
-            </a-col>
-          </a-row>
-          <a-row style="text-align: center;margin-top: 100px;">
-            <a-col>
-              <a-form-item>
-                <a-button type="default" @click="isShow=false">返回列表</a-button>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </a-form>
-      </div>
-    </a-modal>
-    <!-- 查看洗车前后照片对比 -->
-    <a-modal
-      class="imgModal"
-      title="洗车前照片"
-      :width="600"
-      :footer="null"
-      :destroyOnClose="true"
-      @cancel="isShowBeginImageModal=false"
-      v-model="isShowBeginImageModal">
-      <img :src="orderDetailData.beginImage" class="pic" />
-    </a-modal>
-    <a-modal
-      class="imgModal"
-      title="洗车后照片"
-      :width="600"
-      :footer="null"
-      :destroyOnClose="true"
-      @cancel="isShowEndImageModal=false"
-      v-model="isShowEndImageModal">
-      <img :src="orderDetailData.endImage" class="pic" />
-    </a-modal>
-  </div>
-</template>
-
-<script>
-import {
-  Upload,
-  VSelect
-} from '@/components'
-import {
-  orderDetail
-} from '../../api/order.js'
-export default {
-  components: {
-    Upload,
-    VSelect
-  },
-  name: 'OrderDetailModal',
-  props: {
-    openModal: { //  弹框是否展示
-      type: Boolean,
-      default: false
-    },
-    nowId: {
-      type: Number,
-      default: null
-    }
-  },
-  data () {
-    return {
-      orderDetailData: [],
-      isShow: this.openModal,
-      isShowBeginImageModal: false, // 洗车前图片弹窗
-      isShowEndImageModal: false // 洗车后图片弹窗
-    }
-  },
-  methods: {},
-  watch: {
-    //  父页面传过来的弹框状态以及当前行id
-    openModal (newValue, oldValue) {
-      this.isShow = newValue
-    },
-    nowId (newValue, oldValue) {
-      if (newValue) {
-        orderDetail({
-          id: newValue
-        }).then(res => {
-          // console.log(res, '------------')
-          this.orderDetailData = res.data
-          if (res.status == 200) {
-            setTimeout(() => {
-              res.data.orderStatus = this.$refs.orderStatus.getNameByCode(res.data.orderStatus)
-            }, 500)
-          }
-        })
-      }
-    },
-    //  重定义的弹框状态
-    isShow (val) {
-      if (!val) {
-        this.$emit('close')
-      }
-    }
-  }
-}
-</script>
-<style lang="less">
-	.orderDetail-content .ant-form-inline .ant-form-item {
-		margin-bottom: 20px;
-	}
-
-	.imgBox {
-		text-align: center;
-		margin-left: 10px;
-		.imgCar {
-			height: 50px;
-			width: auto;
-		}
-	}
-	.pic {
-		transform: scale(1);
-		display: block;
-		max-width: 100%;
-		height: 100%;
-		margin: 0 auto;
-	}
-</style>

+ 4 - 4
src/views/SetmealSales/WriteOffRecords.vue → src/views/SetmealSales/PurchasedSetmeal.vue

@@ -84,7 +84,7 @@
       </span>
     </s-table>
     <!-- 查看详情弹窗 -->
-    <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" />
+    <!-- <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" /> -->
   </a-card>
 </template>
 
@@ -101,14 +101,14 @@ import {
   orderTotal,
   exportOrder
 } from '@/api/order.js'
-import OrderDetailModal from './OrderDetailModal.vue'
+// import OrderDetailModal from './OrderDetailModal.vue'
 import moment from 'moment'
 export default {
   name: 'OrderCenter',
   components: {
     STable,
-    VSelect,
-    OrderDetailModal
+    VSelect
+    // OrderDetailModal
   },
   data () {
     return {

+ 403 - 0
src/views/SetmealSales/VerificationRecords.vue

@@ -0,0 +1,403 @@
+<template>
+  <a-card :bordered="false">
+    <!-- 搜索条件 -->
+    <div class="orderCenter-searchForm">
+      <a-form ref="searchForm">
+        <a-row :gutter="48">
+          <a-col :span="6">
+            <a-form-item label="下单时间" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <a-range-picker v-model="time" :format="dateFormat" :placeholder="['开始时间','结束时间']" @change="onChange" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="网点名称" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <a-select placeholder="请选择" allowClear v-model="storeId" mode="multiple">
+                <a-select-option v-for="item in storeOptionData" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="单号" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <a-input v-model.trim="searchForm.orderNo" placeholder="请输入" allowClear />
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="服务项目" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <a-select placeholder="请选择" allowClear v-model="searchForm.itemId">
+                <a-select-option v-for="item in itemOptionData" :key="item.id" :value="item.id">{{ item.itemName }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="48">
+          <a-col :span="6">
+            <a-form-item label="手机号码" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <a-input v-model.trim="searchForm.customerMobile" placeholder="请输入" allowClear :maxLength="11" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="状态" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+              <v-select v-model="searchForm.orderStatus" ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear></v-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-button style="margin-right: 10px;" type="primary" @click="handleSearch">查询</a-button>
+            <a-button type="" @click="handleRest">重置</a-button>
+            <a-button type="" :loading="loading" class="export-btn" @click="handleExport">导出</a-button>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 合计 -->
+    <div class="total">
+      <a-icon type="info-circle" class="iconImg" />
+      <strong>合计:</strong><span v-model="orderTotal">{{ orderTotal || 0 }} 单</span><strong style="margin-left: 15px;">实收:</strong><span
+        v-model="paymentAmountTotal">{{ paymentAmountTotal || 0 }} 元</span>
+    </div>
+    <!-- 列表 -->
+    <s-table
+      ref="table"
+      size="default"
+      :rowKey="(record) => record.id"
+      :columns="columns"
+      :data="loadData"
+      bordered>
+      <!-- 状态 -->
+      <span slot="orderStatus" slot-scope="text">
+        {{ $refs.orderStatus.getNameByCode(text) }}
+      </span>
+      <!-- 实收金额 -->
+      <span slot="paymentAmount" slot-scope="text, record">
+        <template v-if=" record.payStatus == 'PAID' ">{{ record.paymentAmount }}</template>
+        <template v-else-if=" record.payStatus != 'PAID' ">{{ 0 }}</template>
+      </span>
+      <!-- 优惠 -->
+      <span slot="couponAmount" slot-scope="text, record">
+        <template v-if=" record.orderStatus != 'CANCELED' ">{{ record.couponAmount }}</template>
+        <template v-else-if=" record.orderStatus == 'CANCELED' ">{{ 0 }}</template>
+      </span>
+      <!-- 操作 -->
+      <span slot="action" slot-scope="text, record">
+        <a-button type="primary" @click="seeDetail(record)">查看</a-button>
+        <!-- 本期暂不做 -->
+        <!-- <a-button type="danger" @click="refund(record)">退款</a-button> -->
+      </span>
+    </s-table>
+    <!-- 查看详情弹窗 -->
+    <!-- <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" /> -->
+  </a-card>
+</template>
+
+<script>
+import {
+  STable,
+  VSelect
+} from '@/components'
+import getDate from '@/libs/getDate.js'
+import {
+  orderCenterList,
+  itemList,
+  storeList,
+  orderTotal,
+  exportOrder
+} from '@/api/order.js'
+// import OrderDetailModal from './OrderDetailModal.vue'
+import moment from 'moment'
+export default {
+  name: 'OrderCenter',
+  components: {
+    STable,
+    VSelect
+    // OrderDetailModal
+  },
+  data () {
+    return {
+      storeId: [], // 网点名称
+      // 查询参数
+      searchForm: {
+        beginDate: null, // 创建的开始时间
+        endDate: null, // 创建的结束时间
+        storeIdList: [], // 网点名称
+        orderNo: '', // 单号
+        itemId: undefined, // 服务项目
+        customerMobile: '', // 手机号码
+        orderStatus: '' // 状态
+      },
+      loading: false, // 导出loading
+      orderTotal: '', // 合计开单数量
+      paymentAmountTotal: '', // 合计实收金额
+      itemOptionData: [], // 服务项目数据
+      storeOptionData: [], // 网点名称数据
+      openDetailModal: false, // 查看详情弹窗 默认关闭
+      detailId: null, // 初始化id
+      // 将默认当天时间日期回显在时间选择框中
+      time: [
+        moment(getDate.getToday().starttime, this.dateFormat),
+        moment(getDate.getToday().endtime, this.dateFormat)
+      ],
+      dateFormat: 'YYYY-MM-DD',
+      columns: [{
+        title: '下单时间',
+        dataIndex: 'orderTime',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '单号',
+        dataIndex: 'orderNo',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '网点名称',
+        dataIndex: 'storeName',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '服务项目',
+        dataIndex: 'itemName',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '手机号码',
+        dataIndex: 'customerMobile',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '应收(¥)',
+        dataIndex: 'payableAmount',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '优惠(¥)',
+        dataIndex: 'couponAmount',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'couponAmount'
+        }
+      },
+      {
+        title: '实收(¥)',
+        dataIndex: 'paymentAmount',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'paymentAmount'
+        }
+
+      },
+      {
+        title: '状态',
+        dataIndex: 'orderStatus',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'orderStatus'
+        }
+      },
+      {
+        title: '操作',
+        dataIndex: 'action',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'action'
+        }
+
+      }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.searchForm.beginDate == null ? this.searchForm.beginDate = getDate.getToday().starttime : null
+        this.searchForm.endDate == null ? this.searchForm.endDate = getDate.getToday().endtime : null
+        this.searchForm.storeIdList = this.storeId
+        return orderCenterList(Object.assign(parameter, this.searchForm)).then(res => {
+          // console.log(res,'0000000000000000000')
+          if (res.status == 200) {
+            return res.data
+            this.getTotal()
+          }
+        })
+      }
+    }
+  },
+  methods: {
+    moment,
+    // 创建时间change
+    onChange (dates, dateStrings) {
+      if ((dates, dateStrings)) {
+        this.searchForm.beginDate = dateStrings[0]
+        this.searchForm.endDate = dateStrings[1]
+      }
+      console.log(this.searchForm.beginDate, this.searchForm.endDate)
+    },
+    // 获取服务项目数据
+    getItemListData () {
+      itemList({
+        pageNo: 1,
+        pageSize: 1000
+      }).then(res => {
+        // console.log(res, '-----------')
+        if (res.status == 200) {
+          this.itemOptionData = res.data.list || []
+        } else {
+          this.itemOptionData = []
+        }
+      })
+    },
+    // 获取网点名称数据
+    getStoreListData () {
+      storeList({
+        pageNo: 1,
+        pageSize: 1000
+      }).then(res => {
+        // console.log(res, '-----------')
+        if (res.status == 200) {
+          this.storeOptionData = res.data.list || []
+        } else {
+          this.storeOptionData = []
+        }
+      })
+    },
+    // 合计
+    getTotal () {
+      const params = {
+        beginDate: this.searchForm.beginDate,
+        endDate: this.searchForm.endDate,
+        storeIdList: this.searchForm.storeIdList,
+        orderNo: this.searchForm.orderNo,
+        itemId: this.searchForm.itemId,
+        customerMobile: this.searchForm.customerMobile,
+        orderStatus: this.searchForm.orderStatus
+      }
+      params.beginDate == null ? params.beginDate = getDate.getToday().starttime : null
+      params.endDate == null ? params.endDate = getDate.getToday().endtime : null
+      params.storeIdList = this.storeId
+      orderTotal(params).then(res => {
+        console.log(res, '--------')
+        if (res.status == 200) {
+          this.orderTotal = res.data.orderNum || 0
+          this.paymentAmountTotal = res.data.paymentAmount || 0
+        }
+      })
+    },
+    // 查看详情--跳转到对应的详情页
+    seeDetail (record) {
+      // 将当前行的id传递给详情页
+      this.openDetailModal = true
+      this.detailId = record.id
+    },
+    // 退款---暂不做
+    // refund(row) {
+    //   const _this = this
+    //   this.$confirm({
+    //     title: '警告',
+    //     content: '确认退款后 款项将通过原渠道退回 且不可撤回,确认退款?',
+    //     okText: '确定',
+    //     cancelText: '取消',
+    //     // onOk() {
+    //
+    //     // }
+    //   })
+    // },
+    // 查询
+    handleSearch () {
+      this.$refs.table.refresh()
+      this.getTotal()
+    },
+    // 重置
+    handleRest () {
+      this.searchForm.beginDate = getDate.getToday().starttime
+      this.searchForm.endDate = getDate.getToday().endtime
+      this.time = [
+        moment(getDate.getToday().starttime, this.dateFormat),
+        moment(getDate.getToday().endtime, this.dateFormat)
+      ]
+      this.storeId = []
+      this.searchForm.orderNo = ''
+      this.searchForm.itemId = undefined
+      this.searchForm.customerMobile = ''
+      this.searchForm.orderStatus = ''
+      // this.$refs.searchForm.resetFields()
+      this.$refs.table.refresh()
+      this.getTotal()
+    },
+    // 导出
+    handleExport () {
+      this.loading = true
+      const params = {
+        beginDate: this.searchForm.beginDate == null ? getDate.getToday().starttime : this.searchForm.beginDate,
+        endDate: this.searchForm.endDate == null ? getDate.getToday().endtime : this.searchForm.endDate,
+        storeIdList: this.storeId,
+        orderNo: this.searchForm.orderNo,
+        itemId: this.searchForm.itemId,
+        customerMobile: this.searchForm.customerMobile,
+        orderStatus: this.searchForm.orderStatus
+      }
+      exportOrder(params).then(res => {
+        console.log(res)
+        this.loading = false
+        this.download(res)
+      })
+    },
+    download (data) {
+      if (!data) {
+        return
+      }
+      const url = window.URL.createObjectURL(new Blob([data]))
+      const link = document.createElement('a')
+
+      link.style.display = 'none'
+      link.href = url
+      const a = moment().format('YYYYMMDDhhmmss')
+      const fname = '订单记录-' + a
+      console.log(fname, '111111')
+      link.setAttribute('download', fname + '.xlsx')
+
+      document.body.appendChild(link)
+      link.click()
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      vm.getItemListData()
+      vm.handleRest()
+      vm.getStoreListData()
+    })
+  }
+}
+</script>
+<style lang="less">
+	.orderCenter-searchForm {
+
+		// 搜索框的下间距
+		.ant-form-item {
+			margin-bottom: 10px;
+		}
+	}
+  .export-btn{
+    background-color: #ff9900;
+    border-color: #ff9900;
+    color: #fff;
+    margin-left: 10px;
+  }
+	// 合计
+	.total {
+		margin: 15px 0 25px;
+		width: 100%;
+		background-color: #e6f7ff;
+		border: 1px solid #91d5ff;
+		padding: 8px 15px 8px 27px;
+		border-radius: 4px;
+
+		.iconImg {
+			color: #1890FF;
+			margin-right: 10px;
+		}
+	}
+</style>