<template>
	 <div class="container resource basic-message contaNEW">
      <div class="pop-banner clearfix">
        <!-- <div class="operate-btns">
    </div> -->
        <h3 class="current-module">消息平台</h3>
      </div>
      <!-- start-->
      <div class="fr">
        <form class="search-bar mb-20  mt-15" active="###">
          <input type="text" placeholder="输入关键词" v-model="search1.search_LIKE_SupplierName">
          <div class="search-btn">
            <input type="button" @click="getSupplyRelation">
          </div>
        </form>
        <div class="basic-message-root">
     <!--      <div class="min-search">
            <input class="min-search-txt" type="text" v-model="search1.search_LIKE_SupplierName">
            <button class="min-search-btn" @click="getSupplyRelation"></button>
          </div> -->
          <div class="bmr-result">
            <div class="bmr-result-top clearfix">
              <em>共选择
                <i>{{checkSupplier.length}}</i> 家供应商</em>
              <div class="checkbox-control fr">
                <input type="checkbox" name="cb" id="cb1" v-model="selAllCheck">
                <label class="checkbox" for="cb1">全选</label>
              </div>
            </div>
            <div class="root-node bmr-result-list bd-none" style="max-height: 600px;">
              <template v-for="(indexI,supplyRelation) in supplyRelationList">
                <div class="list-node checkbox-control checkbox-bold"  @click="activeIClick(indexI)">
                  <span class="node-btn" v-if="activeI[indexI]"></span>
                  <span class="node-btn1" v-else></span>
                 <!--  <input type="checkbox" name="cb" value="{{supplyRelation.distrbGUID}}" id="{{supplyRelation.distrbGUID}}"
                  v-model="checkDisList[index]"> -->
                  <label class="label" for="{{supplyRelation.distrbGUID}}">
                    <span>{{ supplyRelation.distrbName }}</span>
                  </label>
                </div>
                <div class="list-show checkbox-control" v-show="activeI[indexI]" style='margin-left:43px;width:80%;'> <!-- v-model="checkSupplier[indexI][indexJ]"> -->
                  <template v-for="(indexJ,supplierName) in supplyRelation.supplierNameList">
                    <input type="checkbox" name="cb" value="{{ supplyRelation.supplierGUIDList[indexJ] }}"
                        id="{{supplyRelation.supplierNameList[indexJ]}}" v-model="checkSupplier">
                    <label class="checkbox" for="{{supplyRelation.supplierNameList[indexJ]}}">{{ supplierName }}</label>
                  </template>
                </div>
              </template>
            </div>
          </div>
        </div>
       </div>
      <div class="basic-message-form">
        <div class="basic-message-tit has-button clearfix" style="height: 65px;">
          <button class="btn button-green mt-15" v-if="'/hospital/message:sendMsg' | myqx this.$route.params.id!=0" disabled="disabled">发 送</button>
          <button class="btn button-green mt-15" @click="sendMsg" v-else>发 送</button>
        </div>
        <div class="pd-form clearfix">
          <div class="form-group form-label">
            <label for="cn1" class="label">标题</label>
            <div class="control form-required">
              <input type="text" id="cn1" maxlength="10" v-rule v-model="msg.messagetitle" v-bind:readonly="readonly" class="inp2">
              <div class="form-tips-info">提示：标题字数不能超过10个汉字</div>
            </div>
          </div>
          <div class="form-group form-label">
            <label class="label" for='cn2'>消息内容</label>
            <div class="control form-required">
              <textarea id="cn10" rows="2" maxlength="20" v-rule v-model="msg.messagecontent" v-bind:readonly="readonly" class="inp4"></textarea>
              <div class="form-tips-info">提示：内容字数不能超过20个汉字</div>
            </div>
          </div>
        </div>
        <div class="basic-message-tit clearfix">
          <h3>消息发送方式</h3>
        </div>
        <div class="pd-form clearfix">
          <div class="group-row">
            <div class="form-group w220">
              <label for="cn1" class="label w110">接收站内通知</label>
              <div class="radio-control">
                <input type="radio" id="radio01" name="radioio" value="Y" v-model="msg.isinstation" v-bind:disabled="disabled">
                <label class="radio" for="radio01">是</label>
                <input type="radio" name="radioio" value="N" v-model="msg.isinstation" id="radio02" v-bind:disabled="disabled">
                <label class="radio" for="radio02">否</label>
              </div>
            </div>
            <div class="form-group fl ml-30 w220">
              <label class="label">接收邮件通知</label>
              <div class="radio-control">
                <input type="radio" id="radio03" name="radioio1" value="Y" v-model="msg.isemail" v-bind:disabled="disabled">
                <label class="radio" for="radio03">是</label>
                <input type="radio" name="radioio1" value="N" v-model="msg.isemail" id="radio04" v-bind:disabled="disabled">
                <label class="radio" for="radio04">否</label>
              </div>
            </div>
          </div>
          <div class="group-row">
            <div class="form-group w220">
              <label for="cn2" class="label w110">接收短信通知</label>
              <div class="radio-control">
                <input type="radio" id="radio05" name="radioio2" value="Y" v-model="msg.issms" v-bind:disabled="disabled">
                <label class="radio" for="radio05">是</label>
                <input type="radio" name="radioio2" value="N" v-model="msg.issms" id="radio06" v-bind:disabled="disabled">
                <label class="radio" for="radio06">否</label>
              </div>
            </div>
            <div class="form-group fl ml-30 w220">
              <label class="label">接收APP通知</label>
              <div class="radio-control">
                <input type="radio" id="radio07" name="radioio3" value="Y" v-model="msg.isapp" v-bind:disabled="disabled">
                <label class="radio" for="radio07">是</label>
                <input type="radio" name="radioio3" value="N" v-model="msg.isapp" id="radio08" v-bind:disabled="disabled">
                <label class="radio" for="radio08">否</label>
              </div>
            </div>
          </div>
          <div class="group-row">
            <div class="form-group w220">
              <label for="cn3" class="label w110">接收微信通知</label>
              <div class="radio-control">
                <input type="radio" id="radio09" name="radioio4" value="Y" v-model="msg.iswebchat" v-bind:disabled="disabled">
                <label class="radio" for="radio09">是</label>
                <input type="radio" name="radioio4" value="N" v-model="msg.iswebchat" id="radio010" v-bind:disabled="disabled">
                <label class="radio" for="radio010">否</label>
              </div>
            </div>
          </div>
        </div>
        <div class="info-send-type" v-if="msg.guid!=null">
          <span class="fl">发送人：{{msg.sender}}</span>
          <span>发送时间：{{msg.sendtime}}</span>
          <span class="fr">发送状态：已发</span>
        </div>
        <div class="basic-message-tit clearfix">
          <h3>消息接收对象</h3>
          <span class=" fr text-color-red" href="javascript:;"> 消息发送异常查看</span>
        </div>
        <div class="epi-form">
          <div class="group-row">
            <div class="form-group form-label">
              <label for="cn3" class="label fl">供应商</label>
              <div class="control ml-0 w300">
                <input type="text" id="cn3" maxlength="20" v-rule v-model="search2.search_LIKE_chinesename" @blur="getReceivedMsg(true)" class="inp3">
              </div>
            </div>
            <div class="form-group form-label w260">
              <label for="cn4" class="label fl" style="width:4em;">人员</label>
              <div class="control w260 ml-0">
                <input type="text" id="cn4" maxlength="8" v-rule v-model="search2.search_LIKE_receiver" @blur="getReceivedMsg(true)" class="inp2">
              </div>
            </div>
          </div>
        </div>
        <table class="itable itable-thead-13px">
          <thead>
            <tr>
              <th class="w50">序号</th>
              <th class="w70">接收者</th>
              <th class="w80">站内到达</th>
              <th class="w80">短信到达</th>
              <th class="w80">微信到达</th>
              <th class="w80">APP到达</th>
              <th class="w80">邮件到达</th>
            </tr>
          </thead>
          <tbody>
            <tr v-for="m in msgReceivedList">
              <td>{{$index+1}}</td>
              <td>{{m.receiver}}<br/>{{m.chinesename}}</td>
              <td>{{m.instationreceived | instationreceived}}
                <br/>{{m.instationreceivedtime}}
              </td>
              <td> {{m.smsreceived | smsreceived}}
                <br/>{{m.smsreceivedtime}}
              </td>
              <td>{{m.webchatreceived | webchatreceived}}
                <br/>{{m.webchatreceivedtime}}
              </td>
              <td>{{m.appreceived | appreceived}}
                <br/>{{m.appreceivedtime}}
              </td>
              <td>{{m.emailreceived | emailreceived}}
                <br/>{{m.emailreceivedtime}}
              </td>
            </tr>
          </tbody>
        </table>
        <div class="pagination m-20-0">
          <em class="page">明细条目数【{{ search2.total }}】</em>
          <pagination
           @page-change="getData"
           :class="['m-20-0']"
           :page-no.sync="search2.page"
           :total-pages.sync="search2.totalPages"></pagination>
          <em>共{{search2.totalPages}}页</em>
        </div>
      </div>
      <!-- end-->
    </div>
</template>
<script>
module.exports={
  data: function(){
    return {
      msgList: [],
      checkIdList:[],
      msg:{},
      search: {
        pageSize: 50,
        page: 1,
        totalPages: 0,
        total:0
      },
      iCount: [],                   //外层记录内层数量
      activeI :[],                  //外层显示
      supplyRelationList :[],
      medguid:'',
      checkDisList:[],
      checkSupplier:[],
      selAllCheck:false,
      search1:{
        search_EQ_medguid:'',
        search_LIKE_SupplierName:''
      },
      checkedSupplier:0,
      search2:{
        pageSize: 5,
        page: 1,
        totalPages: 0,
        total:0,
        search_EQ_guid:'',
        search_LIKE_chinesename:'',
        search_LIKE_receiver:''
      },
      msgReceivedList:[],
      msgVO:{
        trmessagenotification:{},
        chinesename:'',
        supplierguids:[],
        // id:''
      },

      // 11-16 王永刚判断bug 修改
      readonly:false,
      disabled:false,
    };
  },
  methods: {
    getData: function(){
      var self = this;
      if(this.$route.params.id != 0 ){
        Ajax.get('/message/msgDetail/'+this.$route.params.id)
        .then(function (response){
          var data = response.data.data;
          self.$set('msg',data);
          self.getReceivedMsg();
          self.$set('readonly',true);
          self.$set('disabled',true);
        });
      } else {
          self.$set('msg',{});
          self.loadPage();
          self.$set('readonly',false);
          self.$set('disabled',false);
      }
    },
    loadPage:function(){
      this.$set('msg.isinstation','Y');
      this.$set('msg.isemail','Y');
      this.$set('msg.issms','Y');
      this.$set('msg.isapp','Y');
      this.$set('msg.iswebchat','Y');
    },
    //外层显示控制
    activeIClick: function(indexI){
      this.$set('activeI['+indexI+']',!this.activeI[indexI]);
    },
    // 通过医院GUID查询供应关系
    getSupplyRelation: function(){
        var self = this;
        self.supplyRelationList=[];
        // alert(this.$store.state.user.curUser.medguid);
        this.search1.search_EQ_medguid = this.$store.state.user.curUser.medguid;
        Ajax.get('/message/listSupplyRelation',this.search1)
          .then(function (response){
          var data = response.data;
          if(data.errorCode == 0){
             var supplyRelationListTemp = {};
             // supplyRelationListTemp.distrbGUID=[];
            for(var i=0;i<data.data.length;i++){
              // supplyRelationListTemp.distrbGUID = data.data[i].DistrbGUID;
              supplyRelationListTemp.distrbName = data.data[i].DistrbName==null?"直供":data.data[i].DistrbName;
              // supplyRelationListTemp.distrbGUID = data.data[i].DistrbName==null?"直供":data.data[i].DistrbName;
              supplyRelationListTemp.supplierNameList = data.data[i].SupplierName.split(",");
              supplyRelationListTemp.supplierGUIDList = data.data[i].SupplierGUID.split(",");
              // supplyRelationListTemp.distrbGUID.push(false);
              self.checkDisList.push(false);
              self.activeI.push(true);

              self.supplyRelationList.push(supplyRelationListTemp);
            }
          }else{
            // alert(data.message);
          }
        })
    },
    //发送消息
    sendMsg:function(){

        var self=this;
        if(self.msg.messagetitle==""||self.msg.messagetitle==null){
          layer.msg('标题不能为空！');
          return;
        };
        if(self.msg.messagecontent==""||self.msg.messagecontent==null){
          layer.msg('消息内容不能为空！');
          return;
        };
        if(this.checkSupplier.length==0){
          layer.msg('请选择您要发送的供应商！');
          return;
        }
        self.receiveMessage();
        this.msg.dept = self.$store.state.user.curUser.hdeptguid;
        this.msg.sender=self.$store.state.user.curUser.realname;
        this.msgVO.trmessagenotification=this.msg;
        Ajax.post('/message/sendMsg',this.msgVO)
        .then(function (response){
             var data=response.data;
             if(data.errorCode==0){
                layer.msg('发送成功！');
                self.$route.router.go('/basicMessage');
            }else{
                layer.msg('发送失败！');
            }
        });
    },
    //接收短信
    receiveMessage:function(){
      var self=this;
      self.msgVO.supplierguids=[];
      for(var a=0;a<self.checkSupplier.length;a++){
        self.msgVO.supplierguids.push(self.checkSupplier[a]);
      }
      // var guids="";
      // var ids="";
      // for(var i=0;i<this.checkSupplier.length;i++){
      //   if(i==(this.checkSupplier.length-1)){
      //     guids+=this.checkSupplier[i];
      //   }else{
      //     guids+=this.checkSupplier[i]+"@@";
      //   }
      // }
      // ids = this.msg.isinstation+"@@"+this.msg.isemail+"@@"+this.msg.issms+"@@"+this.msg.isapp+"@@"+this.msg.iswebchat;
      // this.msgVO.supplierguids=guids;
      // this.msgVO.id=ids;
    },
      //接收消息对象
    getReceivedMsg:function(isfresh){
      var self = this;
      if (isfresh) {
         self.search.page = 1;
      }
      self.search2.search_EQ_guid = this.msg.guid;
      Ajax.get('/message/msgReceivedInfo',self.search2)
         .then(function (response){
          var data = response.data.data;
          self.$set('msgReceivedList',data.list);
          self.search2.totalPages = data.totalPages;
          self.search2.total = data.total;
        });
    },
  },
  route:{
    activate : function(){
      this.getData();
      this.getSupplyRelation();
      this.getReceivedMsg();
    }
  },
  watch:{
        'selAllCheck':function(){
        var self=this;
        var supplierGUIDList=self.supplyRelationList[0].supplierGUIDList;

        if(self.selAllCheck){
          for(var a=0;a<supplierGUIDList.length;a++){
            self.checkSupplier.push(supplierGUIDList[a]);
            self.checkDisList.push(true);
          }
        }else{
          self.checkSupplier=[];
          self.checkDisList=[];
        }

      }
      /*'selAll': function(val){
           if(val && this.supplyRelationList.length>0){
              this.checkDisList = [];
              this.checkSupplier = [];
              this.checkedSupplier = 0;
              for(var i=0;i<this.supplyRelationList.length;i++){
                this.checkDisList.push(this.supplyRelationList[i].distrbGUID);
                var list = [];
                for (var j = 0; j < this.supplyRelationList[i].supplierNameList.length; j++) {
                  list.push(this.supplyRelationList[i].supplierNameList[j]);
                  this.checkedSupplier++;
                }
                this.checkSupplier.push(list);
              }

            }else{
               this.checkDisList=[];
               this.checkSupplier = [];
               this.checkedSupplier = 0;
            }
        }*/
  }
};
</script>