<template>
  <div>
    <Tabs v-model="type" :list="typeList" @changeVal="typeChange"/>
    <div class="table">
      <el-table v-loading="loading" :data="list" element-loading-background="rgba(0, 0, 0, 0.3)"
                height="250px">
        <el-table-column label="资源类型" prop="key"/>
        <el-table-column label="所属网格" prop="key"/>
        <el-table-column label="姓名/名称" prop="key"/>
        <el-table-column label="联系电话" prop="key"/>
        <el-table-column label="状态" prop="name"/>
        <el-table-column label="距离" prop="name"/>
        <el-table-column label="操作" prop="op" width="250">
          <template slot-scope="scope">
            <CallPhone text="拨打电话"/>
            <span class="view" @click="handleViews(scope.row)">查看</span>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
          v-show="total > 0"
          :limit.sync="queryParams.pageSize"
          :page.sync="queryParams.pageNo"
          :total="total"
          @pagination="getList"
      />
    </div>
  </div>
</template>

<script>
import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
import CallPhone from "@/views/dataBoard/cpts/CallPhone";

export default {
  name: "DisputeDispatch",
  components: {Pagination, Tabs, CallPhone},
  data() {
    return {
      total: 10,
      queryParams: {},
      type: "1",
      list: [],
      loading: false,
      typeList: [
        {
          label: "网格员",
          value: "1",
        },
        {
          label: "公益岗",
          value: "2",
        },
        {
          label: "志愿者",
          value: "3",
        },
        {
          label: "社区自组织",
          value: "4",
        },
        {
          label: "联建单位",
          value: "5",
        },
        {
          label: "15分钟生活圈商家",
          value: "5",
        },
      ],
    }
  },
  mounted() {

  },
  methods: {
    getList() {

    },
    typeChange() {

    }
  }
}
</script>

<style scoped lang="scss">
@import "@/assets/scss/dataBoard/table2.scss";
.table {
  margin-top: 20px;
}

.handle {
  font-size: 14px;
  margin-left: 10px;
  color: #9A69EC;
}

.view {
  font-size: 14px;
  margin-left: 10px;
  color: #007FF1;
}
</style>