vd/frontend/src/views/stats/order/js/index.js

import {
  sumBy
} from 'service/util';
export default {
  name: 'StatsOrder',
  components: {
    UiDetail: resolve => require(['views/stats/order/detail'], resolve)
  },
  data() {
    return {
      search: {
        show: true
      },
      detailObj: {
        type: null,
        options: {}
      },
      options: {
        company_name: '',
        package_name: '',
        pay_channel: '',
        time: [
          this.moment().subtract('1', 'months').startOf('month').format('YYYY-MM-DD'),
          this.moment().subtract('1', 'months').endOf('month').format('YYYY-MM-DD')
        ]
      },
      data: [],
      list: [],
      stats: {},
      page: {
        total: 0,
        limit: 10,
        page: 1
      },
      columns: [{
        title: '企业名称',
        key: 'company_name'
      },
      {
        title: '套餐名称',
        key: 'package_name',
        width: 150
      },
      {
        title: '支付方式',
        key: 'pay_channel_name',
        width: 120
      },
      {
        title: '单价',
        key: 'unit_price',
        width: 120
      },
      {
        title: '人数',
        key: 'members',
        width: 120
      },
      {
        title: '数量',
        key: 'counts',
        width: 120
      },
      {
        title: '总金额',
        key: 'custom_price',
        width: 150
      },
      {
        title: '操作',
        key: 'action',
        width: 170,
        render: (h, {
          row,
          column,
          index
        }) => {
          let html = [];

          html.push(h('Button', {
            props: {
              type: 'primary',
              size: 'small',
              disabled: false,
              icon: 'md-create'
            },
            class: ['btn'],
            on: {
              click: (event) => {
                this.isShowLoading(true);

                let params = {
                  page: 1,
                  limit: 10,
                  type: this.type,
                  order_id: row.order_id,
                  orderBy: 'id',
                  sortedBy: 'asc'
                };

                service.get('api/stats/order/detail', {
                  params
                }).then(res => {
                  this.isShowLoading(false);
                  if (res.code == 0) {
                    this.detailObj = {
                      show: true,
                      options: params,
                      list: res.data
                    };
                  }
                }).catch(() => {
                  this.isShowLoading(false);
                });
              }
            }
          }, '查看明细'));

          if (html.length) {
            return h('div', html);
          }
        }
      }
      ]
    };
  },
  created() {
    this.index();
  },
  mounted() {
    window.onresize = () => {
      this.tableFooter();
    };
  },
  methods: {
    /**
     * [index 列表]
     * @param  {Number} page [description]
     * @return {[type]}      [description]
     */
    index() {
      this.isShowLoading(true);
      this.type = Number(this.$route.params.type);
      this.data = [];

      let options = Object.assign({
        orderBy: 'company_id',
        sortedBy: 'asc',
        type: this.type
      },
      this.options);

      let params = this.searchDataHandle({}, {
        limit: 0
      }, options);

      service.get('api/stats/order', {
        params
      }).then(res => {
        this.isShowLoading(false);
        if (res.code == 0) {
          this.list = res.data;
          this.page.total = this.list.length;
          this.changePage(1);
        }
      }).catch(() => {
        this.isShowLoading(false);
      });
    },

    /**
     * [request 刷新]
     * @return {[type]} [description]
     */
    request() {
      let page = this.page.page;

      if (this.data.length == 1) {
        page = this.returnPage(this.page.total, this.page.page, this.page.limit);
      }

      this.index();
      this.changePage(page);
    },

    resetSearch() {
      for (let k in this.options) {
        if (k === 'time') {
          this.options[k] = [
            this.moment().subtract('1', 'months').startOf('month').format('YYYY-MM-DD'),
            this.moment().subtract('1', 'months').endOf('month').format('YYYY-MM-DD')
          ];
        } else {
          this.options[k] = '';
        }
      }

      this.page = {
        total: 0,
        limit: 10,
        page: 1
      };

      this.index();
    },
    changeLimit(limit) {
      this.page.limit = limit;
      this.changePage(1);
    },
    changePage(page) {
      this.page.page = page;
      this.data = this.list.slice((page - 1) * this.page.limit, page * this.page.limit);

      this.stats = {
        members: sumBy(this.list, 'members'),
        counts: sumBy(this.list, 'counts'),
        custom_price: sumBy(this.list, 'custom_price')
      };

      this.tableFooter();
    },
    tableFooter() {
      this.$nextTick(() => {
        setTimeout(() => {
          let html = $('.ivu-table-header colgroup').html();
          $('.table-footer-colgroup').html(html);
        }, 10);
      });
    },
    exportExcel() {
      this.isShowLoading(true);

      this.type = Number(this.$route.params.type);

      let options = Object.assign({
        orderBy: 'company_id',
        sortedBy: 'asc',
        type: this.type
      },
      this.options);

      let params = this.searchDataHandle({}, {
        limit: 0
      }, options);

      service.get('api/stats/order/export', {
        params
      }).then((res) => {
        if (res.code === 0) {
          this.downloadFile(res.data);
        }

        this.isShowLoading(false);
      }).catch(() => {
        this.isShowLoading(false);
      });
    }
  }
};