<template>
  <div class='m-container'>
    <h2>试听课设置</h2>
    <div class="m-core">
      <!-- <div class='newBand'>新建</div> -->
      <!-- 列表 -->
      <div class="tableWrap">
        <el-table :data='tableList'
                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
          <el-table-column align='center'
                           label="试听课可选专业">
          </el-table-column>
          <el-table-column align='center'
                           label="收费方式">
          </el-table-column>
          <el-table-column align='center'
                           label="收费金额">
          </el-table-column>
          <el-table-column align='center'
                           label="操作">
            <template slot-scope="scope">
              <el-button type="text">删除</el-button>
              <el-button type="text">停用</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination :total="pageInfo.total"
                    :page.sync="pageInfo.page"
                    :limit.sync="pageInfo.limit"
                    :page-sizes="pageInfo.page_size"
                    @pagination="getList" />
      </div>
    </div>

  </div>
</template>
<script>
import pagination from '@/components/Pagination/index'
import store from '@/store'
export default {
  name: 'tryClass',
  components: { pagination },
  data () {
    return {
      tableList: [],
      pageInfo: {
        // 分页规则
        limit: 10, // 限制显示条数
        page: 1, // 当前页
        total: 0, // 总条数
        page_size: [10, 20, 40, 50] // 选择限制显示条数
      },
      organId: null
    }
  },
  mounted () {
    this.getList()
    this.getAreaList()
  },
  methods: {
    messageTips (title, res) {
      if (res.code == 200) {
        this.$message.success(title + '成功')
        this.branchStatus = false
        this.getList()
      } else {
        this.$message.error(res.msg)
      }
    },
    getList () {

    }
  }
}
</script>
<style lang="scss" scoped>
.el-button--primary {
  background: #14928a;
  border-color: #14928a;
  color: #fff;
  &:hover,
  &:active,
  &:focus {
    background: #14928a;
    border-color: #14928a;
    color: #fff;
  }
}
/deep/.el-date-editor.el-input {
  width: 100% !important;
}
/deep/.el-select {
  width: 98% !important;
}
</style>