<template>
  <div class="material">

      <div style="padding-top: 5%;">
          <ul class="title" >
            <li style="width: 10%">序号</li>
            <li style="width: 20%">表名称</li>
          </ul>
      </div>


      <div  class="content"  @click="goFillScan(1)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">1</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">小餐饮经营许可证</div>
      </div>

      <div  class="content"  @click="goFillScan(2)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">2</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">仅销售预包装食品经营者备案</div>
      </div>

      <div  class="content"  @click="goFillScan(3)" v-if="serviceId==null"><!-- 各区域通用 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">3</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">公共场合卫生许可新办申请表</div>
      </div>

      <div  class="content"  @click="goFillScan(4)" v-if="serviceId==null"><!-- 各区域通用 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">4</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">公共场所卫生许可承诺书</div>
      </div>

      <div  class="content"  @click="goFillScan(5)" v-if="serviceId=='S100529'||serviceId=='S100535'"><!--宜宾市民中心和宜宾市兴文县政务中心 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">1</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">不动产买卖合同</div>
      </div>

      <div  class="content"  @click="goFillScan(6)" v-if="serviceId=='S100529'||serviceId=='S100535'"><!--宜宾市民中心和宜宾市兴文县政务中心 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">2</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">房屋赠予合同</div>
      </div>

      <div  class="content"  @click="goFillScan(7)" v-if="serviceId=='S100535'"><!--宜宾市兴文县政务中心 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">3</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">职工参保登记</div>
      </div>


<!--      <div  class="content"  @click="goFillScan(8)" v-if="serviceId=='S100537'">&lt;!&ndash; 宜昌伍家岗 &ndash;&gt;-->
<!--        <div  style="width: 10%;text-align:left;margin-left: 6%">1</div>-->
<!--        <div  style="width: 50%;text-align:left;margin-left: 3.2%">公共场合卫生许可新办申请表</div>-->
<!--      </div>                 屏蔽了,两个表整合一块去了                           -->

<!--      <div  class="content"  @click="goFillScan(9)" v-if="serviceId=='S100537'">&lt;!&ndash; 宜昌伍家岗 &ndash;&gt;-->
<!--        <div  style="width: 10%;text-align:left;margin-left: 6%">2</div>-->
<!--        <div  style="width: 50%;text-align:left;margin-left: 3.2%">公共场所卫生许可承诺书</div>-->
<!--      </div>-->

      <div  class="content"  @click="goFillScan(8)" v-if="serviceId=='S100537'"><!-- 宜昌伍家岗 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">1</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">公共场所卫生许可新办</div>
      </div>

      <div  class="content"  @click="goFillScan(10)" v-if="serviceId=='S100537'"><!-- 宜昌伍家岗 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">2</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">食品经营许可证注销表</div>
      </div>

      <div  class="content"  @click="goFillScan(11)" v-if="serviceId=='S100537'"><!-- 宜昌伍家岗 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">3</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">小餐饮经营许可表</div>
      </div>

      <div  class="content"  @click="goFillScan(12)" v-if="serviceId=='S100537'"><!-- 宜昌伍家岗 -->
        <div  style="width: 10%;text-align:left;margin-left: 6%">4</div>
        <div  style="width: 50%;text-align:left;margin-left: 3.2%">健康证申请表</div>
      </div>

      <div  class="content"  @click="goFillScan(13)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">5</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">异地就医备案个人承诺书</div>
      </div>

      <div  class="content"  @click="goFillScan(14)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">6</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">医保个人承诺书</div>
      </div>

      <div  class="content"  @click="goFillScan(15)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">7</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">申领职业年金个人账户余额承诺书</div>
      </div>

      <div  class="content"  @click="goFillScan(16)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">8</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">还款证明</div>
      </div>

      <div  class="content"  @click="goFillScan(17)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">9</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">抵押物转让同意书</div>
      </div>

      <div  class="content"  @click="goFillScan(18)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">10</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">宜宾市住房公积金提取申请表</div>
      </div>

      <div  class="content"  @click="goFillScan(19)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">11</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">居住权协议</div>
      </div>

      <div  class="content"  @click="goFillScan(20)" v-if="serviceId==null"><!-- 各区域通用 -->
          <div  style="width: 10%;text-align:left;margin-left: 6%">12</div>
          <div  style="width: 50%;text-align:left;margin-left: 3.2%">不动产民间借贷</div>
      </div>


      <div style="position: fixed;bottom: 80px;width: 98%;">
          <div style="position: absolute;margin-left:30%;">
            <img style="width: 80%;" src="../../assets/images/btn/btnCancel.png" @click="cancelClick" id="cancel">
          </div>
      </div>

  </div>
</template>

<script>
import { layer } from "@layui/layer-vue";
export default{
	data() {
	  return {
      serviceId: '',//机器人ID
      voiceParameter:{//语音播放参数
        cmd: "cmd",//语音指令，可参考属性voiceInstruct
        animation: 0,//虚拟任务动作编号可参考属性animationEnum
        videocontent: "请选择需要填报的表",//语音内容
        callback: "PlayAudioCallback"//接口回调函数
      },

	  }
	},
	created() {

    this.serviceId = this.$route.query.serviceId
    if(robotType)this.openVoice()//语音播放

	},
	methods:{

    goFillScan(formIndex){//表列表事件
      if (formIndex==5 || formIndex==6 || formIndex==16 || formIndex==17 || formIndex==18 || formIndex==19 || formIndex==20){
        this.$router.push({ path: '/contractScan',query:{formIndex:formIndex}});
      }else {
        this.$router.push({ path: '/fillScanMaterial',query:{formIndex:formIndex}});
      }
    },

		cancelClick() { //取消按钮
			if(robotType){
				robotsdk.closeExternalApp({
				  mode:0 
				});
			}
		},

    openVoice(){
      robotsdk.playAudio(this.voiceParameter);//虚拟人物播放语音及动作
    },

    PlayAudioCallback (res){//语音回调
      console.info("语音播放回调结果============"+res);
    },

	}
}

</script>

<style scoped>
.material{
  background-image: url('../../assets/images/background.png');
  background-repeat: no-repeat;
  background-size: cover;
  overflow:auto;
  margin-bottom: 20px;
  padding: 0 70px;
  height:100%;
}
.title  li{
  float:left;
  color: #ffffff;
  font-size: 24px;
  text-align:center;
  padding-top:10px;
}
.title{
  background-image: url('../../assets/images/materialsDetailTr.png');
  background-repeat:no-repeat;
  background-size:100% 100%;
  height:50px;
}
.content  div{
  color: #ffffff;
  font-size: 24px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.content{
  margin-top:1%;
  background-image: url('../../assets/images/materialsDetailTd.png');
  background-repeat:no-repeat;
  background-size:100% 100%;
  display:flex;
  flex-direction:row;
}
</style>