<template>
  <view class="zrtx-box">
    <view class="title" style="text-align: center; font-size: 20px; font-weight: bold;">
      {{dic}}
    </view>
    <view class="table_cur">
      <table>
        <tr>
          <th style="width: 50px;">
            姓名
            </th>
          <th style="width: 130px">单位</th>
          <th style="width: 80px;">
            职务
            </th>
            <th style="width: 100px;">
              联系方式
              </th>
        </tr>
        <view style="max-height: 500px; overflow-y: auto">
      <tr>
            <td style="width: 50px">{{info.personName}}</td>
            <td style="width: 130px;">{{info.orgName}}</td>
            <td style="width: 80px">{{info.position}}</td>
            <td style="width: 100px;color: #62bafa;" @click="show = true">{{info.tel}}</td>
          </tr>
        </view>
      </table>
      
    </view>
    <u-action-sheet :actions="list" :title="title" :show="show" :description="info.tel" @select="selectClick" :closeOnClickOverlay="true" :closeOnClickAction="true"></u-action-sheet>
  </view>
</template>

<script>
  import {repDict} from "../../utils/dicType.js"
  export default {
    props:{
      info:Object,
      default:{}
    },
    data() {
      return {
        show:false,
        title:"",
        list: [
        				{
        					name:'呼叫'
        				},
                {
        					name:'复制'
        				},
                {
        					name:'取消'
        				},
        			],
      }
    },
    computed:{
      dic(){
        return repDict(this.info.repType)
      }
    },
    methods: {
      selectClick(obj){
      			if(obj.name == "呼叫"){
              uni.makePhoneCall({
              	phoneNumber: this.info.tel,
              });
               this.show = false
            }else if(obj.name == "复制"){
              uni.setClipboardData({
                data:this.info.tel,
                showToast:true
              })
              this.show = false
            }
            // else if(obj.name == "保存至手机通讯录"){
            //   uni.addPhoneContact({
            //   	lastName: this.info.personName.substr(0,1),
            //   	firstName: this.info.personName.substr(1),
            //   	mobilePhoneNumber: this.info.tel,
            //   	success: function () {
            //       uni.$showMsg("保存成功")
            //   	},
            //   	fail: function () {
            //   		console.log('fail');
            //   	}
            //   });
            // }
            else{
              this.show = false
            }
      		}
    }
  }
</script>

<style lang="scss" scoped>
.zrtx-box{
  border: 1px solid #c1f2ce;
  border-radius: 2px;
  padding:10px 10px 5px 10px;
  background-color: #ebfbef;
  margin-bottom: 10px;
  .table_div {
    height: 100%;
    max-width: calc(100% - 0px);
    max-height: calc(100vh);
    flex: 1;
    padding-top: 0px;
    overflow-x: scroll;
  }
  /*table样式*/
  .table_cur {
    margin-top: 20px;
    width: 100%;
    empty-cells: show;
    border-collapse: collapse;
    font-size: 14px;
  }
  .table_cur tr {
    display: flex;
    line-height: 65rpx;
  }
  .table_cur th {
    height: 65rpx;
    font-size: 14px;
    // font-weight: bold;
    
    font-weight: 100;
    padding: 0px 10px;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center !important;
  }
  
  .table_cur td {
    height: 65rpx;
    // border-bottom: 1px solid #d8ddeb;
    font-size: 14px;
    color: #2f4056;
    padding: 0 10px;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center !important;
  }
}
</style>
