<!--
 * @Description:侧边语音呼叫栏
 * @Author: 王晓颖
 * @Date:2020-05-02 13:29:43
 -->
<template>
  <div style="display:inline-block;margin-right:10px;">
    <cti-btn :disabled="!isInCall" icon="guaji" @click="hangup">挂机</cti-btn>
    <cti-btn v-show="holdStatus==false" :disabled="!isInCall" icon="baochi" @click="hold">保持</cti-btn>
    <cti-btn v-show="holdStatus==true" :disabled="!isInCall" icon="baochi" @click="unhold">继续</cti-btn>
    <cti-btn :disabled="!isInCall" icon="hujiao" @click="transfer">转接</cti-btn>
    <cti-btn :disabled="!isInCall" icon="huiyi" @click="meeting">会议</cti-btn>
    <cti-btn :disabled="!isInCall" icon="saorao" type="danger" @click="addToBlackList">骚扰</cti-btn>
  </div>

</template>

<script>
import CtiBtn from './ctiBtn'
import { addBlack } from '@/api/blackCus'
import { mapState } from 'vuex'

export default {
  name: 'LeftCallBar',
  components: { CtiBtn },
  props: {
    tel: {
      type: String,
      required: true
    },
    holdStatus: {
      type: Boolean,
      required: true
    }
  },
  computed: {
    ...mapState({
      exten: state => state.user.exten, // 用户绑定的分机号
      wsStatus: state => state.ivr.wsStatus,
      signStatus: state => state.ivr.signStatus, // 签入签出状态
      isInCall: state => state.ivr.isInCall,
      isInComming: state => state.ivr.isInComming,
      extensionList: state => state.ivr.extensionList,
      reg: state => state.ivr.reg,
      webSocket: state => state.ivr.webSocket,
      websocketObj: state => state.ivr.websocketObj
    })
  },
  methods: {
    // 挂机
    hangup() {
      this.$emit('click', 'hangup')
    },
    // 保持
    hold() {
      this.$emit('click', 'hold')
    },
    // 解除保持
    unhold() {
      this.$emit('click', 'unhold')
    },
    transfer() {
      this.$emit('click', 'transfer')
    },
    meeting() {
      this.$emit('click', 'meeting')
    },
    addToBlackList() {
      this.$confirm(
        '确定此电话为骚扰电话，移入黑名单吗？',
        '确认操作',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      ).then(() => {
        const params = {
          name: '骚扰电话', // 拉黑原因
          tel: this.tel // 联系方式
        }
        addBlack(params).then(response => {
          if (response.code === 200) {
            this.$message.success('加入黑名单成功')
          }
        })
      })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>

</style>