|
|
@@ -0,0 +1,148 @@
|
|
|
+<template>
|
|
|
+ <div class="shop-list">
|
|
|
+ <x-crud @load="onLoad">
|
|
|
+ <template #slot-date-select>
|
|
|
+ <el-date-picker v-model="currentDateList" type="daterange" align="right" unlink-panels range-separator="至" start-placeholder="开始日期" @change="getDate" value-format="yyyy-MM-dd"
|
|
|
+ end-placeholder="结束日期" :picker-options="pickerOptions" size="mini"> </el-date-picker>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-export-due>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:60px;" @click="exportData()">导出数据</el-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-total-amount>
|
|
|
+ <span style="font-size:15px;font-weight:bold;"></span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ </x-crud>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { mapGetters } from 'vuex';
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ crud: null,
|
|
|
+ pickerOptions: {
|
|
|
+ shortcuts: [{
|
|
|
+ text: '最近一周',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近一个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近三个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ currentDateList:[],
|
|
|
+ startTime:'',
|
|
|
+ endTime:'',
|
|
|
+ searchTime:''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['shopInfo']),
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ exportData(){
|
|
|
+ // this.$service.statCg.getProfit({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime,export:1}).then(res => {
|
|
|
+ // if(res.file){
|
|
|
+ // window.location.href = res.file
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ },
|
|
|
+ onLoad({ ctx, app }) {
|
|
|
+ this.app = app;
|
|
|
+ ctx.service({
|
|
|
+ page: () => {
|
|
|
+ return this.$service.stat.sendYj({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime}).then((res) => {
|
|
|
+ let list = [...res.list]
|
|
|
+ return {
|
|
|
+ list: list
|
|
|
+ };
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('table', {
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ label: '姓名',
|
|
|
+ prop: 'staffName',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '订单数',
|
|
|
+ prop: 'orderNum',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '花材数',
|
|
|
+ prop: 'itemNum',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '金额',
|
|
|
+ prop: 'amount',
|
|
|
+ align: 'center',
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ op: {
|
|
|
+ visible: true,
|
|
|
+ props: {
|
|
|
+ width: 250,
|
|
|
+ align: 'center',
|
|
|
+ fixed: 'right',
|
|
|
+ label: '操作'
|
|
|
+ },
|
|
|
+ layout: []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('layout', [
|
|
|
+ [ 'slot-date-select',
|
|
|
+ 'slot-order-debt',
|
|
|
+ 'slot-export-due',
|
|
|
+ 'flex1'
|
|
|
+ ],
|
|
|
+ [ 'data-table' ],
|
|
|
+ ['slot-total-amount','flex1']
|
|
|
+ ])
|
|
|
+ .done();
|
|
|
+ app.refresh();
|
|
|
+ },
|
|
|
+ getDate(){
|
|
|
+ if(this.currentDateList){
|
|
|
+ this.searchTime = 'custom'
|
|
|
+ this.startTime = this.currentDateList[0]
|
|
|
+ this.endTime = this.currentDateList[1]
|
|
|
+ }else{
|
|
|
+ this.searchTime = ''
|
|
|
+ this.startTime = ''
|
|
|
+ this.endTime = ''
|
|
|
+ }
|
|
|
+ this.app.refresh({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime});
|
|
|
+ }
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+.shop-list {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+</style>
|