<template>
  <div class="layout-no-cols right-list-toolbar">
    <div>
      <el-row>
        <el-col :offset="14" :span="10" class="dropdown-search-box-r search-bar-algin-toolbar search-bar-social-media-accounts">
          <el-input v-model="keyWord" placeholder="请输入媒体名称" @keyup.enter.native="search" size="medium">
            <el-select placeholder="所属分类" clearable slot="prepend" v-model="typeID" @change="search">
              <el-option v-for="item in accountTypes" :label="item.name" :value="item.ID" :key="item.ID"></el-option>
            </el-select>
          </el-input>
          <span class="search-icon"><i class="fa fa-search" @click="search" title="查询"></i></span>
        </el-col>
      </el-row>
      <account-list @callback="gotoDetailPage" ref="dataTable" :getDataURL="getDataURL" line-priv="" :page-size="20">
        <template slot="options">
          <el-table-column align="center" label="操作" width="120">
          <template slot-scope="scope">
            <el-button @click.stop="gotoDetailPage(scope.row)" type="text" class="green"><i class="fa fa-comments-o f16"></i>评论管理</el-button>
          </template>
        </el-table-column>
        </template>
      </account-list>
    </div>
  </div>
</template>
<script>
import accountList from './components/AccountList.vue'
const pCode = 'WeChatMedia,WeChatAccount,SinaWeiBo'
export default {
  components: {
    'account-list': accountList
  },
  data() {
    return {
      keyWord: '', // 查询关键字
      typeID: '',
      accountTypes: []
    }
  },
  created() {
    this.getAccountTypes()
  },
  methods: {
    async getAccountTypes() {
      let res = await axios.get('/ui/accounttypes')
      this.accountTypes = res.data.data
    },
    getDataURL() {
      return ['/ui/mediaaccounts',
        {
          params: { pCode: pCode, typeID: this.typeID, keyWord: encodeURIComponent(this.keyWord) }
        }
      ]
    },
    gotoDetailPage(row) {
      if (!row || !row.ID) {
        return
      }
      if (row.PCode === 'SinaWeiBo') {
        this.$router.push({path: `/socialmedia/weiboMsg/${row.ID}`, query: { PCode: row.PCode }})
      } else {
        this.$router.push({path: `/socialmedia/commentsList/${row.ID}`, query: { PCode: row.PCode }})
      }
    },
    search() {
      this.$refs.dataTable.loadData()
    }
  }
}
</script>
<style scope>

</style>
