vd/frontend/src/views/virtual/packages/js/index.js

import * as API from 'api/virtual/packages';
export default {
  name: 'Companies',
  components: {
    UiEdit: resolve => require(['views/virtual/packages/edit'], resolve)
  },
  data() {
    return {
      params: {
        name: ''
      },
      trashed: null,
      list_data: null,
      editObj: {
        show: false,
        data: null
      },
      detailObj: {
        show: false,
        data: null
      },
      search: {
        show: false
      },
      table_titles: [
        {
          type: 'expand',
          width: 50,
          render: (h, params) => {
            let row = params.row;
            let Col = [];

            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '成本价(元): ' + Number(row['cost_price']).toFixed(2)));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '指导价(元): ' + Number(row['guide_price']).toFixed(2)));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '语音分钟数: ' + row['voices']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '短信条数: ' + row['messages']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '是否开通短信功能: ' + (row['has_message_switch'] ? '有' : '无')));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '是否开通LBS功能: ' + (row['has_lbs'] ? '有' : '无')));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '重置周期（月）: ' + row['reset_months']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '生效周期（月）: ' + row['effect_months']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '到期延长（月）: ' + row['delay_months']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '套餐说明: ' + row['description']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '创建时间: ' + row['created_at']));
            Col.push(h('Col', { props: { span: 6 }, class: ['fz-12'] }, '更新时间: ' + row['updated_at']));

            return h('Row', {}, Col);
          }
        },
        {
          title: 'ID',
          key: 'id',
          width: 120
        },
        {
          title: '套餐编号',
          key: 'sn',
          width: 200
        },
        {
          title: '套餐名称',
          key: 'name',
          width: 120
        },
        {
          title: '运营商',
          key: 'carrier_operator_name',
          width: 100
        },
        {
          title: '流量值（M）',
          key: 'flows',
          width: 120
        },
        {
          title: '套餐周期(月)',
          key: 'service_months',
          width: 120
        },
        {
          title: '说明',
          key: 'description'
        },
        {
          title: '创建时间',
          key: 'created_at',
          width: 170
        },
        {
          title: '操作',
          key: 'action',
          width: 170,
          render: (h, {
            row,
            column,
            index
          }) => {
            let html = [];

            if (row.deleted_at) {
              return h('Tag', { props: { color: 'default' } }, '该套餐已被删除');
            }

            if (this.haveJurisdiction('index')) {
              html.push(h('Button', {
                props: {
                  type: 'success',
                  size: 'small',
                  disabled: false,
                  icon: 'md-eye'
                },
                class: ['btn'],
                on: {
                  click: (event) => {
                    this.detailObj = {
                      show: true,
                      data: row
                    };
                  }
                }
              }, '查看'));
            }

            if (this.haveJurisdiction('update')) {
              html.push(h('Button', {
                props: {
                  type: 'primary',
                  size: 'small',
                  disabled: false,
                  icon: 'ios-create'
                },
                class: ['btn'],
                on: {
                  click: (event) => {
                    this.openEdit(true, row);
                  }
                }
              }, '编辑'));
            }

            if (this.haveJurisdiction('destroy')) {
              html.push(h('Button', {
                props: {
                  type: 'error',
                  size: 'small',
                  disabled: false,
                  icon: 'md-trash'
                },
                class: ['btn'],
                on: {
                  click: () => {
                    this.$Modal.confirm({
                      title: '提示',
                      content: '删除后该企业不可使用，请谨慎操作',
                      onOk: () => {
                        API.destroy({
                          ids: row.id
                        }).then(res => {
                          if (res.code == 0) {
                            this.$Message.success('删除成功');
                            this.request();
                          }
                        });
                      }
                    });
                  }
                }
              }, '删除'));
            }

            if (html.length) {
              return h('div', html);
            }
          }
        }
      ]
    };
  },
  created() {
    this.index(1);
  },
  methods: {
    /**
     * [index 列表]
     * @param  {Number} page [description]
     * @return {[type]}      [description]
     */
    index(page = 1) {
      let type = this.$route.query.type;

      if (typeof(type) === 'undefined') {
        this.$Message.error('非法请求');
        return;
      }

      let data = this.searchDataHandle(this.params, { page }, { 'type': type, 'trashed': this.trashed, 'orderBy': 'id', 'sortedBy': 'asc' });
      this.isShowLoading(true);
      API.index(data).then(res => {
        this.isShowLoading(false);
        if (res.code == 0) {
          this.list_data = res.data;
        }
      }).catch(() => {
        this.isShowLoading(false);
      });
    },

    /**
     * [openEdit 打开编辑弹窗]
     * @return {[type]} [description]
     */
    openEdit(bool, data = null) {
      this.editObj = {
        show: bool,
        data
      };
    },

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

      if (this.list_data.data.length == 1) {
        page = this.returnPage(result.total, result.current_page, result.per_page);
      }

      this.index(page);
    },

    resetSearch() {
      for (let k in this.params) {
        this.params[k] = '';
      }
      this.trashed = null;
      this.index(1);
    }
  }
};