|
|
@@ -0,0 +1,201 @@
|
|
|
+<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="getSearchDate" value-format="yyyy-MM-dd"
|
|
|
+ end-placeholder="结束日期" :picker-options="pickerOptions" size="mini"> </el-date-picker>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-order-debt="{scope}">
|
|
|
+ <el-radio-group v-model="debt" @change="changeDebt" style="margin-right:20px;padding-top:6px;margin-left:20px;">
|
|
|
+ <el-radio label="-1">全部</el-radio>
|
|
|
+ <el-radio label="1">待结款</el-radio>
|
|
|
+ <el-radio label="0">已结款</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-total-amount>
|
|
|
+ <span style="font-size:15px;font-weight:bold;">订单金额:{{ totalOrderPrice }}</span>
|
|
|
+ <span style="font-size:15px;font-weight:bold;margin-left:15px;">退款金额:{{ totalTkPrice }}</span>
|
|
|
+ <span style="font-size:15px;font-weight:bold;margin-left:15px;">实际金额:{{ totalActPrice }}</span>
|
|
|
+ <span style="font-size:15px;font-weight:bold;margin-left:15px;">含(纸箱:{{ totalCarton }}</span>
|
|
|
+ <span style="font-size:15px;font-weight:bold;margin-left:15px;">打包费:{{ totalPack }}</span>
|
|
|
+ <span style="font-size:15px;font-weight:bold;margin-left:15px;">运费:{{ totalFreight }})</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-export-data>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:60px;" @click="exportDue()">导出数据</el-button>
|
|
|
+ </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:'',
|
|
|
+ totalActPrice:0,
|
|
|
+ totalOrderPrice:0,
|
|
|
+ totalCarton:0,
|
|
|
+ totalPack:0,
|
|
|
+ totalFreight:0,
|
|
|
+ totalTkPrice:0,
|
|
|
+ debt:'-1'
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['shopInfo']),
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ exportDue(){
|
|
|
+ this.$service.order.getYj({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime,debt:this.debt,export:1}).then(res => {
|
|
|
+ if(res.file){
|
|
|
+ window.location.href = res.file
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onLoad({ ctx, app }) {
|
|
|
+ this.app = app;
|
|
|
+ ctx.service({
|
|
|
+ page: () => {
|
|
|
+ return this.$service.order.getYj({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime,debt:this.debt}).then((res) => {
|
|
|
+ this.totalActPrice = res.totalActPrice ? res.totalActPrice : 0
|
|
|
+ this.totalOrderPrice = res.totalOrderPrice ? res.totalOrderPrice : 0
|
|
|
+ this.totalCarton = res.totalCarton ? res.totalCarton : 0
|
|
|
+ this.totalPack = res.totalPack ? res.totalPack : 0
|
|
|
+ this.totalFreight = res.totalFreight ? res.totalFreight : 0
|
|
|
+ this.totalTkPrice = res.totalTkPrice ? res.totalTkPrice : 0
|
|
|
+ return {
|
|
|
+ list: res.list
|
|
|
+ };
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('table', {
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ label: 'ID',
|
|
|
+ prop: 'id',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '客户',
|
|
|
+ prop: 'name',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '手机号',
|
|
|
+ prop: 'mobile',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '订单数',
|
|
|
+ prop: 'num',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '订单金额',
|
|
|
+ prop: 'orderPrice',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '退款金额',
|
|
|
+ prop: 'tkPrice',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '实际金额',
|
|
|
+ prop: 'actPrice',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '纸箱费',
|
|
|
+ prop: 'carton',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '打包费',
|
|
|
+ prop: 'pack',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '运费',
|
|
|
+ prop: 'freight',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ op: {
|
|
|
+ visible: true,
|
|
|
+ props: {
|
|
|
+ width: 250,
|
|
|
+ align: 'center',
|
|
|
+ fixed: 'right',
|
|
|
+ label: '操作'
|
|
|
+ },
|
|
|
+ layout: []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .set('layout', [
|
|
|
+ [ 'slot-date-select',
|
|
|
+ 'slot-order-debt',
|
|
|
+ 'flex1',
|
|
|
+ 'slot-export-data'
|
|
|
+ ],
|
|
|
+ [ 'data-table' ],
|
|
|
+ ['slot-total-amount','flex1']
|
|
|
+ ])
|
|
|
+ .done();
|
|
|
+ app.refresh();
|
|
|
+ },
|
|
|
+ getSearchDate(){
|
|
|
+ this.searchTime = 'custom'
|
|
|
+ this.startTime = this.currentDateList[0]
|
|
|
+ this.endTime = this.currentDateList[1]
|
|
|
+ this.app.refresh({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime,debt:this.debt});
|
|
|
+ },
|
|
|
+ changeDebt(e){
|
|
|
+ this.debt = e
|
|
|
+ this.app.refresh({searchTime:this.searchTime,startTime:this.startTime,endTime:this.endTime,debt:this.debt})
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+.shop-list {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+</style>
|