<template>
  <div class="app-container">
    <!-- 顶部操作区域 -->
    <div class="filter-container">
      <div class="filter-control">
        <span>咨询人:</span>
        <el-input
          v-model="listQuery.questionMan"
          placeholder="咨询人"
          clearable
          @keyup.enter.native="getList"
          @clear="getList"
        />
      </div>
      <div class="filter-control">
        <span>所属协销:</span>
        <el-select v-model="listQuery.serviceProviderId" clearable @change="getList">
          <el-option value="" label="请选择" />
          <el-option
            v-for="item in sellerList"
            :key="item.serviceProviderId"
            :label="item.linkMan"
            :value="item.serviceProviderId"
          />
        </el-select>
      </div>
      <div class="filter-control">
        <span>同步至机构:</span>
        <el-select v-model="listQuery.concat" style="width: 120px" clearable @change="getList">
          <el-option value="" label="请选择" />
          <el-option :value="1" label="已同步" />
          <el-option :value="2" label="未同步" />
        </el-select>
      </div>
      <div class="filter-control">
        <el-button type="primary" @click="getList"> 查询 </el-button>
      </div>
    </div>
    <!-- 列表 -->
    <el-table v-loading="isLoading" :data="list" border style="width: 100%" height="600">
      <el-table-column prop="questionMan" label="咨询人" align="center" width="150" />
      <el-table-column prop="serviceName" label="所属协销" align="center" width="150">
        <template slot-scope="{ row }">
          {{ row.serviceName ? row.serviceName : '---' }}
        </template>
      </el-table-column>
      <el-table-column prop="clubId" label="同步至机构" align="center">
        <template slot-scope="{ row }">
          <el-tag v-if="row.clubId" type="success" size="small">已同步({{ row.clubName }})</el-tag>
          <el-tag v-else type="danger" size="small">未同步</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="addTime" label="创建时间" align="center">
        <template slot-scope="{ row }">
          {{ row.addTime ? row.addTime : '---' }}
        </template>
      </el-table-column>
      <el-table-column prop="concactTime" label="同步时间" align="center">
        <template slot-scope="{ row }">
          {{ row.concactTime ? row.concactTime : '---' }}
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="200">
        <template slot-scope="{ row }">
          <el-button type="primary" size="mini" style="margin: 2px" @click="handleRecordDetail(row)">
            查看信息
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 页码 -->
    <pagination
      :total="total"
      :page-sizes="[10, 20, 30, 100]"
      :page-size="20"
      :page.sync="listQuery.pageNum"
      :limit.sync="listQuery.pageSize"
      @pagination="visitRemarkList"
    />
  </div>
</template>

<script>
import { visitRemarkList } from '@/api/user/consult/consult'
import { getServiceList } from '@/api/library/keyword'
const defaultListQuery = {
  questionMan: '', // 咨询人
  serviceProviderId: '', // 协销Id
  concat: '', //  是否同步 1已同步2未同步
  pageNum: 1,
  pageSize: 20
}
export default {
  name: 'RecordList',
  filters: {},
  data() {
    return {
      isLoading: true,
      time: '',
      listQuery: Object.assign({}, defaultListQuery),
      sellerList: [],
      list: [],
      total: 0
    }
  },
  computed: {},
  created() {
    this.getServiceList()
    this.getList()
  },
  mounted() {},
  methods: {
    // 获取行为记录列表
    getList() {
      this.listQuery.pageNum = 1
      this.list = []
      if (this.time && this.time.length > 0) {
        this.listQuery.startTime = this.time[0]
        this.listQuery.endTime = this.time[1]
      } else {
        this.listQuery.startTime = ''
        this.listQuery.endTime = ''
      }
      this.visitRemarkList()
    },

    // 获取关键词列表
    async visitRemarkList() {
      try {
        this.isLoading = true
        const res = await visitRemarkList(this.listQuery)
        this.list = res.data.results
        this.total = res.data.totalRecord
        this.isLoading = false
      } catch (error) {
        console.log(error)
      }
    },

    // 获取协销列表
    async getServiceList() {
      try {
        const res = await getServiceList(this.shopListQuery)
        this.sellerList = res.data
      } catch (error) {
        console.log(error)
      }
    },
    // 查看信息详情
    handleRecordDetail(row) {
      const type = row.clubId ? 1 : 2
      let query = {}
      if (row.clubId) {
        query = { clubId: row.clubId, type: type }
      } else {
        query = { questionManId: row.questionManId, type: type }
      }
      this.$router.push({
        path: '/user/consult/unreg-detail',
        query: query
      })
    }
  }
}
</script>

<style></style>
