<style>
  .empowerManage .template_comheader {
    padding: 13px 20px;
    border-bottom: 1px solid #EBEEF5;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
  }

  .empowerManage .template_comheader>div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
  }

  .empowerManage .temp_content {
    margin-top: 10px;
    background: #fff;
    padding: 20px;
  }

  .empowerManage .temp_imgStyle {
    display: inline-block;
    margin-right: 10px;
  }

</style>
<template>
  <div class="empowerManage">
    <div class="template_comheader">
      <div>
        <span>授权管理</span>
        <el-button type="primary" size="small" @click="CommonJump('empowerEdit',{ID:0})">新增用户</el-button>
      </div>
    </div>
    <div class="temp_content">
    
        <el-table :data="dataList" border style="width: 100%">
            <el-table-column prop="ID" label="ID" width="80"></el-table-column>
            <el-table-column  label="类型">
                <template slot-scope="scope">
                    <span v-if="scope.row.Type==1">用户</span>
                    <span v-if="scope.row.Type==2">集团</span>
                </template>    
            </el-table-column>
            <el-table-column prop="DomainName" label="域名"></el-table-column>
            <el-table-column prop="Account" label="关联erp账号"></el-table-column>
            <el-table-column prop="MallUserName" label="电商员工姓名"></el-table-column>
            <el-table-column  label="状态">
              <template slot-scope="scope">
                  <span v-if="scope.row.Status==1">待审核</span>
                  <span v-if="scope.row.Status==2">已审核</span>
                  <span v-if="scope.row.Status==3">已拒绝</span>
                  <span v-if="scope.row.Status==4">已作废</span>
              </template>    
            </el-table-column>
            <el-table-column  label="是否推送IM消息">
              <template slot-scope="scope">
                  <span style="color:red" v-if="scope.row.IsSendIMMsg==0">否</span>
                  <span style="color:green" v-if="scope.row.IsSendIMMsg==1">是</span>
              </template>    
            </el-table-column>
            <el-table-column prop="CreateDate" label="创建时间"></el-table-column>
            <el-table-column prop="UpdateDate" label="更新时间"></el-table-column>
            <el-table-column label="操作">
            <template slot-scope="scope">
                <el-tooltip class="item" effect="dark" content="编辑" placement="top" v-if="scope.row.Status==3">
                <img src="../../assets/img/setup/edit.png" alt="" class="temp_imgStyle" @click="EditeTemplate(scope.row)">
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="删除" placement="top">
                <img src="../../assets/img/setup/del.png" alt="" class="temp_imgStyle" @click="DeleteTemplate(scope.row)">
                </el-tooltip>
                <template v-if="scope.row.IsSendIMMsg==0">
                  <el-tooltip class="item" effect="dark" content="开启IM推送" placement="top">
                    <img src="../../assets/img/userman/status_5_active.png" alt="" class="temp_imgStyle" @click="OpenImSend(scope.row)">
                  </el-tooltip>
                </template>
                <template v-if="scope.row.IsSendIMMsg==1">
                  <el-tooltip class="item" effect="dark" content="关闭IM推送" placement="top">
                    <img src="../../assets/img/userman/status_6_active.png" alt="" class="temp_imgStyle" @click="OpenImSend(scope.row)">
                  </el-tooltip>
                </template>
            </template>
            </el-table-column>
        </el-table>
        <el-pagination style="text-align:right" background @current-change="handleCurrentChange"  :current-page.sync="msg.pageIndex"
            :page-size="msg.pageSize" layout="prev, pager, next" :total="total">
        </el-pagination>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        dataList: [],
        msg: {
          pageIndex: 1,
          pageSize: 15,
        },
        total: 0
      };
    },
    created() {

    },
    methods: {
      handleCurrentChange(val) {
        this.msg.pageIndex = val;
        this.getList();
      },
      getList() {
        this.assetsApipost("/api/Authorize/GetAuthorizePageList", this.msg, res => {
          if (res.data.resultCode == 1) {
            this.dataList = res.data.data.pageData;
            this.total = res.data.data.count;
          } else {
            this.Info(res.data.message);
          }
        })
      },
      //修改授权信息
      EditeTemplate(item) {
        this.CommonJump('empowerEdit', {
          ID: item.ID,
          Type: item.Type
        });
      },
      //删除授权信息
      DeleteTemplate(item) {
        let that = this;
        that.Confirm("是否删除?", function () {
          that.assetsApipost("/api/Authorize/DelERPAuthorize", {
            ID: item.ID,
          }, res => {
            if (res.data.resultCode == 1) {
                that.Success(res.data.message);
              that.getList();
            } else {
              that.Info(res.data.message);
            }
          })
        });
      },
      //开启IM推送
      OpenImSend(item){
        var type=0,text='';
        if(item.IsSendIMMsg==0){
          type=1
          text='是否开启IM推送'
        }else{
          type=0
          text='是否关闭IM推送'
        }
        let that = this; 
        that.$confirm(text, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let msg={
            Ids:item.ID,
            IsSendIMMsg:type
          }
          this.apipost('/api/Authorize/UpdateSendIMMsg', msg,
            res => {
              if (res.data.resultCode === 1) {
                this.getList();
                this.Success(res.data.message)
              } else {
                this.Error(res.data.message);
              }
            },
            null
          );
        }).catch(() => {

        });
      }
    },
    mounted() {
      this.getList();
    }
  };

</script>
