<template>
  <div>
      <Table
        :columns="columns"
        :data="tableData"
        class="tableStyle"
      />
  </div>
</template>
<script>
export default {
  data() {
    return {
      columns: [
        {
          align: 'center',
          title: '页面名称',
          key: 'name',
          
        },
        {
          align: 'center',
          title: '操作',
          render: (h, params) => {
            const row = params.row;
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.select(row);
                  }
                }
              }, '选择')
            ]);
          },
        }
      ],
      tableData: [
        {
          name: '首页tab',
          url: 'home'
        },
        {
          name: '购物车tab',
          url: 'shopcart'
        },
        {
          name: '我的tab',
          url: 'user'
        }
      ]
    }
  },
  methods: {
    select(row) {
      this.$emit('selectPage', {
        pageType: 1,
        pageUrl: row.url,
        pageName: row.name
      });
    }
  }
}
</script>