<template>
  <div class="PropertyPower">
    <div>
       总记录条数<i>{{listPage.total}}</i>条
      </div>
      <div>
        <el-row type="flex" justify="start">
          <el-col :span="6">
            <el-input v-model="inputValue" placeholder="请输入姓名或者手机号"></el-input>
          </el-col>
          <el-col :span="6">
            <el-button @click="getSearch" type="primary" round size="mini">查询</el-button>
            <el-button @click="resetSearch" type="info" round plain size="mini">重置</el-button>
          </el-col>
        </el-row>
      </div>
    <el-table
      :data="tableData"
      border
      :header-cell-style="{'background-color': '#fafafa',
    'font-weight':'800'}"
    >
      <el-table-column
        property="userName"
        label="姓名"
        min-width="80"
        align="center"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        property="areaName"
        label="区域"
        min-width="100"
        align="center"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        property="projectName"
        label="项目"
        min-width="120"
        align="center"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column label="项目权限" min-width="100" align="center" :show-overflow-tooltip="true">
        <template slot-scope="rows">
          <div>{{rows.row.userRole==="22"?"评价权限":"查询权限"}}</div>
        </template>
      </el-table-column>
      <el-table-column
        property="userMobile"
        label="手机号码"
        min-width="100"
        align="center"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column label="操作" min-width="100" align="center" :show-overflow-tooltip="true">
        <template slot-scope="rows">
          <el-button v-if="PropertyBtn.PropertyBtn18" @click.native="CancelPower(rows)" type="primary" size="small" plain>取消权限</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagenation">
      <span>
        <el-pagination
          background
          layout="prev, pager, next, sizes, total, jumper"
          :total="listPage.total"
          @current-change="click"
          @size-change="handleSizeChange"
          :page-sizes="[5, 10, 25, 50]"
          :page-size="listPage.pagesize"
        ></el-pagination>
      </span>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      loading: true,
      listPage: {
        pagesize: 10,
        currpage: 1,
        total: 0
      },
      inputValue:"",
      queryCondition:'',
      PropertyBtn:{
        PropertyBtn18:0
      }
    };
  },
  created() {
    var PropertyBtn = {}
    this.getButton(14).then(result => {
      if (result.data.statusCode==="1") {
        PropertyBtn = result.data.data
        PropertyBtn.map((item)=>{
          if(item.id==18){
            this.PropertyBtn.PropertyBtn18 = item.checked?1:0 
          }
        })
      }
    });
  },
  mounted() {},
  methods: {
    //   分页条数
    handleSizeChange(val) {
      this.pagesize = val;
      this.load();
    },
    click(val) {
      this.listPage.currpage = val;
      this.load();
    },
    load() {
      var url = "system/property/list";
      var param = {
        companyId: JSON.parse(sessionStorage.getItem("companyID")).id,
        pageNum: this.listPage.currpage,
        pageSize: this.listPage.pagesize,
        queryCondition:this.inputValue
      };
      this.axios.post(url, param).then(res => {
        if (res.statusCode == "0") {
          this.$message.error(res.message);
        } else {
          this.tableData = res.data.rows;
          this.listPage.total=res.data.total;
        }
      });
    },
    CancelPower(rows) {
      const h = this.$createElement;
      const _this = this;
      var a;
      this.$msgbox({
        title: "踢出团队",
        message: h("p", null, [
          h("span", null, "确定取消 "),
          h(
            "span",
            { style: "color:red;padding:0 5px;font-size:1.4rem" },
            rows.row.userName
          ),
          h("span", null, "的"),
          h(
            "span",
            { style: "color:red;padding:0 5px;font-size:1.4rem" },
            rows.row.userRole == "22" ? "评价权限" : "查询权限"
          ),
          h("span", null, "吗?")
        ]),
        showCancelButton: true,
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        beforeClose: (action, instance, done) => {
          if (action === "confirm") {
            instance.confirmButtonLoading = true;
            instance.confirmButtonText = "执行中...";
            var url = "system/property/cancelPermission";
            var param = {
              userId: rows.row.userId,
              projectId: rows.row.projectId
            };
            _this.axios.post(url, param).then(res => {
              if (res.statusCode) {
                done();
                a=res;
                instance.confirmButtonLoading = false;
              }
            });
          } else {
            done();
          }
        }
      }).then(action => {
        _this.load();
       if(a.statusCode==="1"){
         this.$message({
            type: "success",
            message: a.message
          });
       }else{
         this.$message({
            type: "error",
            message: a.message
          });

       }
      }).catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    getSearch(){
       this.listPage.pagesize = 15;
      this.listPage.currpage = 1;
      this.queryCondition = this.inputValue;
      this.load();
    },
    resetSearch(){
       this.listPage.pagesize = 15;
      this.listPage.currpage = 1;
      this.queryCondition = '';
      this.inputValue='';
      this.load();
    },
  }
};
</script>