<style scoped>
  .bg {
    background-color: blue;
    height: 1px;
    border: 0;
  }
  .app-row {
    background-color: white;
    padding: 10px 10px 0 10px;
    border-bottom: 1px solid rgba(235, 235, 235, 0.5);
  }
  .search_input {
    border: 0;
    outline: none;
  }
  .font{
    font: 15px PingFang-SC-Medium;
    color: #666666;
  }
  .input-font{
    font: 15px PingFang-SC-Medium;
    color: #333333;
  }
  .btn-font{
    font:600 16px PingFang-SC-Bold;
    color: #499EDF;
  }
  .btn-color{
    background-color: #FFFFFF;
    border-radius: 10px ;
    border: 1px solid #499EDF;
  }
  .app-text {
    font-size: 12px;
  }
  .panel-self{
    border-radius: 10px;
    border:1px solid #499EDF;
    background-color: #F8F8F8;
  }
  .yybtn-color{
    background-color:#499edf;
    border-radius: 4px ;
    border: 1px solid #499EDF;
    color: #FFFFFF;
    font: 14px PingFang-SC-Bold;
  }
  .qxbtn-color{
    background-color: #FFFFFF;
    border-radius: 4px ;
    color: #499edf;
    font: 14px PingFang-SC-Bold;
    border: 1px solid #499EDF;
  }

  .button_shrink_top {width: 35px; height: 35px; background-size:100%;background-image: url("../../../static/newStyle/stretch_top.png")}
  .button_shrink_bottom {width: 35px; height: 35px;  background-size:100%;background-image: url("../../../static/newStyle/stretch_bottom.png")}
  .button_shrink_left {width: 35px; height: 35px;  background-size:100%;background-image: url("../../../static/newStyle/stretch_left.png")}
  .button_shrink_right {width: 35px; height: 35px; background-size:100%;background-image: url("../../../static/newStyle/stretch_right.png")}
</style>

<template>
  <div class="auto">
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='search' v-ref:cri>
        <div partial>
          <form>
            <div class="row app-row" v-if="$parent.$parent.criteriaShow">
              <div class="col-xs-4">
                <img src="../../assets/用户姓名.png" style="width: 20px;margin-bottom: 5px" alt="">
                <label  class="font text-left">用户姓名：</label>
              </div>
              <div class="col-xs-8" >
                <input  class="search_input input-font" v-model=model.f_user_name condition="f_user_name like '%{}%'" />
              </div>
            </div>



            <div class="row app-row" v-if="$parent.$parent.criteriaShow">
              <div class="col-xs-4">
                <img src="../../assets/用户ID.png" style="width: 20px;margin-bottom: 5px" alt="">
                <label for="f_userinfo_code" class="font text-left">用户编号：</label>
              </div>
              <div class="col-xs-8" >
                <input id="f_userinfo_code" class="search_input input-font"
                       v-model=model.f_userinfo_code condition="f_userinfo_code like '%{}%'" />
              </div>
            </div>


            <div class="row app-row" v-if="$parent.$parent.criteriaShow">
              <div class="col-xs-4">
                <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
                <label class="font text-left">用户地址：</label>
              </div>
              <div class="col-xs-8" >
                <input class="search_input input-font"
                       v-model=model.f_keyword condition="f_address like '%{}%'"  />
              </div>
            </div>

            <div class="row text-center" style="margin-top: 20px;">
              <button type="button" class="btn btn-lg btn-font btn-color" style="width: 25%;" @click="$parent.$parent.selfSearch">查询</button>
              <button type="button" class="btn btn-lg btn-font btn-color" style="width: 25%;margin-left: 10px" @click="$parent.$parent.selectplanmany">抽取</button>
              <div style="float: right;margin-right: 3% " class="button_spacing" :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"  @click="$parent.$parent.hidden()"></div>

            </div>
            <div style="height:30px;"></div>
          </form>
        </div>
      </criteria>
      <list :model="model" partial='list'>
        <div partial>
          <!--@click="$parent.$parent.$parent.selectplan(row.id)"-->
          <div  class="auto app-text" style="margin-top: 5px;">
            <div class="panel" style="padding: 10px 10px 5px 10px;">
              <div class="panel-body panel-self">
                <div class="col-xs-12">
                  <p class="panel-title col-xs-5 text-left font" style="width: 21%;float: left"><b>用户编号:</b></p>
                  <p class="panel-title col-xs-5 text-left input-font" style="width: 74%">{{ row.f_userinfo_code }}</p>
                  <p class="panel-title col-xs-2 text-left input-font" style="width: 5%;float:right">
                    <input type="checkbox" @click="$parent.$parent.$parent.setPlanParam(row.id, $event)"/>
                  </p>
                </div>
                <div class="col-xs-12">
                  <p class="panel-title col-xs-5 text-left font" style="width: 21%;float: left"><b>用户名称:</b></p>
                  <p class="panel-title col-xs-7 text-left input-font" style="width: 79%">{{ row.f_user_name }}</p>
                </div>
                <div class="col-xs-6">
                  <p class="panel-title col-xs-5 text-left font"><b>用户类型:</b></p>
                  <p class="panel-title col-xs-7 text-left input-font">{{ row.f_user_type }}
                  </p>
                </div>
                <div class="col-xs-6">
                  <p class="panel-title col-xs-5 text-left font"><b>计划名称:</b></p>
                  <p class="panel-title col-xs-7 text-left input-font">{{ row.f_plan_name }}</p>
                </div>
                <div class="col-xs-12">
                  <p class="panel-title text-left font" style="width: 23%;float: left"><b>用户电话:</b></p>
                  <p class="panel-title text-left input-font" style="width: 77%">{{ row.f_user_phone2 ? row.f_user_phone2 : row.f_user_phone }}
                    <img src="../../assets/phone.png" style="width: 6%" v-on:click.stop.prevent='$parent.$parent.$parent.makeAPhoneCall(row.f_user_phone2 ? row.f_user_phone2 : row.f_user_phone)'></img>
                  </p>
                </div>

                <div class="col-xs-12">
                  <p class="panel-title text-left font" style="width: 21%;float: left"><b>用户地址:</b></p>
                  <p class="panel-title text-left input-font" style="width: 79%">{{ row.f_address }}</p>
                </div>
                <div class="col-xs-6">
                  <p class="panel-title col-xs-5 text-left font"><b>安检状态:</b></p>
                  <p class="panel-title col-xs-7 text-left input-font">{{ row.f_state == '已检'?'临时保存':row.f_state }}</p>
                </div>
                <div class="col-xs-6">
                  <p class="panel-title col-xs-5 text-left font"><b>上传状态:</b></p>
                  <p class="panel-title col-xs-7 text-left input-font">{{ row.f_upload_state }}</p>
                </div>
                <!--<div class="col-xs-6">-->
                  <!--<button type="button" class="btn btn-default" @click="$parent.$parent.$parent.selectplan(row.id)">转发</button>-->
                <!--</div>-->

              </div>
            </div>
          </div>
        </div>
      </list>
    </criteria-paged>
    <modal :show.sync="showModal" v-ref:modal>
      <div slot="modal-header" class="modal-header">
        <h4 class="modal-title">
          选择计划
        </h4>
      </div>
      <div slot="modal-body" class="modal-body">
        <div class="col-xs-12">
          <div class="col-xs-1">
            <!--<label  style="font-size:20px;line-height: 35px">人员 </label>-->
          </div>
          <div class="col-xs-4" style="padding-left: 2px">
            <input  class="select-style" placeholder="计划名称" type="text"  v-model="plan"  style="border: 1px solid #93B2D3;height:34px;width: 100%;line-height: 35px"/>
          </div>
          <div class="col-xs-1" >
            <!--<label  style="font-size: 20px;line-height: 35px">计划</label>-->
          </div>
          <!--<input placeholder="安检员" type="text"  v-model="check" style="height:30px;width: 100px"/>-->
          <div class="col-xs-2" style="float: right">
            <button type="button" class="btn btn-primary" @click="plansearch" style="background-color:#499edf;float: right;margin-right:10px;border: 1px solid #93B2D3;height:34px;width: 100%;line-height: 1px;padding-left: 12px">查询</button>
          </div>
        </div>

        <table class="table table_sy">
          <thead>
          <tr>
            <th style="width: 30px"></th>
            <th style="font-family: 'Adobe 黑体 Std R'">计划名称</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="row in planoption">
            <td @click="select(row, $index)" >{{row.selected==true ? '☆' : '&nbsp;&nbsp;&nbsp;&nbsp;'}}</td>
            <td @click="select(row, $index)" style="text-align: center">{{row.label}}</td>
          </tr>
          </tbody>
        </table>
      </div>
      <div slot="modal-footer" class="modal-footer">
        <button  class="button_search button_spacing" @click="isok()">确认</button>
        <button  class="button_clear button_spacing" @click="iscancel()">取消</button>
      </div>
    </modal>
    <modal :show.sync="showModal2" v-ref:modal>
      <div slot="modal-header" class="modal-header">
        <h4 class="modal-title">
          选择计划
        </h4>
      </div>
      <div slot="modal-body" class="modal-body">
        <div class="col-xs-12">
          <div class="col-xs-1">
            <!--<label  style="font-size:20px;line-height: 35px">人员 </label>-->
          </div>
          <div class="col-xs-4" style="padding-left: 2px">
            <input  class="select-style" placeholder="计划名称" type="text"  v-model="plan"  style="border: 1px solid #93B2D3;height:34px;width: 100%;line-height: 35px"/>
          </div>
          <div class="col-xs-1" >
            <!--<label  style="font-size: 20px;line-height: 35px">计划</label>-->
          </div>
          <!--<input placeholder="安检员" type="text"  v-model="check" style="height:30px;width: 100px"/>-->
          <div class="col-xs-2" style="float: right">
            <button type="button" class="btn btn-primary" @click="plansearch" style="background-color:#499edf;float: right;margin-right:10px;border: 1px solid #93B2D3;height:34px;width: 100%;line-height: 1px;padding-left: 12px">查询</button>
          </div>
        </div>

        <table class="table table_sy">
          <thead>
          <tr>
            <th style="width: 30px"></th>
            <th style="font-family: 'Adobe 黑体 Std R'">计划名称</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="row in planoption">
            <td @click="select(row, $index)" >{{row.selected==true ? '☆' : '&nbsp;&nbsp;&nbsp;&nbsp;'}}</td>
            <td @click="select(row, $index)" style="text-align: center">{{row.label}}</td>
          </tr>
          </tbody>
        </table>
      </div>
      <div slot="modal-footer" class="modal-footer">
        <button  class="button_search button_spacing" @click="manyisok()">确认</button>
        <button  class="button_clear button_spacing" @click="iscancel()">取消</button>
      </div>
    </modal>
  </div>

</template>

<script>
  import LocalPagedList from '../../plugins/LocalPagedList'
  import Vue from 'vue'
  import { PagedList,HttpResetClass,SearchList } from 'vue-client'
  import * as Util from '../Util'
  // let select = function * (self) {
  //   let http = new HttpResetClass()
  //   http.load('POST', '/rs/search', {
  //     source: 'this.getParentByType($department$).getAllChildrens().where(row.getAttributes().get($rolestr$).indexOf($安检员$) != -1))',
  //     userid: self.$login.f.id
  //   }, {resolveMsg: null, rejectMsg: null}).then((res) => {
  //     console.log('获取安检员', res)
  //     res.data.forEach((checker)=>{
  //       self.checkers.push({label:checker.name,value:checker.id})
  //     })
  //     self.checkers.push({label:'全部',value:''})
  //   })
  // }
  export default {
    title: '222',
    data() {
      return {
        planparam:[],
        checkplan:new SearchList(true),
        plan:'',
        planid:'',
        goplanid:'',
        model:new PagedList(`${this.$androidUtil.getProxyUrl()}/api/af-safecheck/sql/androidGetuserinfo`,20,{condition:'this.condition'}),
        showModal:false,
        showModal2:false,
        needid:'',
        criteriaShow: false,
        planoption:[],
        condition:'',
        checkers:[],
        param: null,
        f_preset_dt : Util.to3339TimeString(),
      }
    },
    ready(){
      console.log('进入安检抽单界面')
     // console.log(this.aaa)
      this.selfSearch()
    },
    methods: {
      async selectplan(val){
        this.planoption=[]
        await this.checkplan.searchList(`${this.$androidUtil.getProxyUrl()}/api/af-safecheck/sql/预约计划下发`, {},{condition:"f_checker_id='"+Vue.user.id+"'",groupitem:"",f_filialeids:"("+Vue.user.orgid+")",orderitem:"f_create_time"})
        let resoult=this.checkplan.list.data
        for (let i = 0; i < resoult.length; i++) {
          this.planoption.push({label: resoult[i].f_plan_name,selected:false, value: resoult[i].id})
        }
        this.needid=val
        this.showModal = true
        console.log(resoult)
      },
      async selectplanmany(){
        this.planoption=[]
        await this.checkplan.searchList(`${this.$androidUtil.getProxyUrl()}/api/af-safecheck/sql/预约计划下发`, {},{condition:"f_checker_id='"+Vue.user.id+"'",groupitem:"",f_filialeids:"("+Vue.user.orgid+")",orderitem:"f_create_time"})
        let resoult=this.checkplan.list.data
        for (let i = 0; i < resoult.length; i++) {
          this.planoption.push({label: resoult[i].f_plan_name,selected:false, value: resoult[i].id})
        }
        this.showModal2 = true
        console.log(resoult)
      },
      iscancel(){
        this.showModal=false
        this.showModal2=false
        this.changenull()
      },
      isok(){
        if(this.planoption.length==0){
          this.$showMessage("请选择计划")
          return false
        }
        for (let i = 0; i <this.planoption.length ; i++) {
          if (this.planoption[i]["selected"]==true){
            this.planid=this.planoption[i].value
            break
          }
        }
        if(this.planid==''){
          this.$showMessage("请选择计划")
          return false
        }
        this.okput()
        this.changenull()
        this.selfSearch()
      },
      manyisok(){
        if(this.planoption.length==0){
          this.$showMessage("请选择计划")
          return false
        }
        for (let i = 0; i <this.planoption.length ; i++) {
          if (this.planoption[i]["selected"]==true){
            this.planid=this.planoption[i].value
            break
          }
        }
        if(this.planid==''){
          this.$showMessage("请选择计划")
          return false
        }
        this.manyokput()
        this.changenull()
        this.selfSearch()
      },

      changenull(){
        this.showModal=false
        this.showModal2=false
        this.planoption=[]
        this.plan=''
      },
      async okput(){
        let http=new HttpResetClass()
        let res=await http.load('POST', `${this.$androidUtil.getProxyUrl()}/api/af-safecheck/logic/ExtractCheckPlanItem`, {data:{
            condition:"it.id='"+this.needid+"'",
            f_plan_id:this.planid,
            switchCheckAll:false,
            checkAll:false,
            f_operator:Vue.user.name
          }
        }, {resolveMsg: null, rejectMsg: null})
      },
      async manyokput(){
        let http=new HttpResetClass()
        let res=await http.load('POST', `${this.$androidUtil.getProxyUrl()}/api/af-safecheck/logic/ExtractCheckPlanItem`, {data:{
            columnName:"it.id",
            condition:"1=1",
            param:this.planparam,
            f_plan_id:this.planid,
            switchCheckAll:true,
            checkAll:false,
            f_operator:Vue.user.name
          }
        }, {resolveMsg: null, rejectMsg: null})
      },
      async plansearch(){
        console.log("8888888888888888888888")
        console.log(Vue.user.id)

        this.planoption=[]
        let condition="f_checker_id="+Vue.user.id+" and f_plan_name like '%"+this.plan+"%'"
        let http=new HttpResetClass()
        let res=await http.load('POST', `${this.$androidUtil.getProxyUrl()}/api/af-safecheck/sql/预约计划下发`, {data:{
            condition:condition,
            f_filialeids:"("+Vue.user.orgid+")",
            groupitem:'',
            orderitem:'id'
          }
        }, {resolveMsg: null, rejectMsg: null})
        let resoult=res.data
        for (let i = 0; i < resoult.length; i++) {
          this.planoption.push({label: resoult[i].f_plan_name,selected:false, value: resoult[i].id})
        }
        console.log("9999999999999999999999999")
      },
      select(row, idx) {
        //console.log(idx)
        this.$set('planoption[' + idx + '].selected', true)
        //console.log(this.planoption)
        for (let i = 0; i <this.planoption.length ; i++) {
          if (i!=idx){
            this.planoption[i]["selected"]=false
          }
        }
      },
      planclose(){
        this.showModal=false
      },
      async queryplan(val){
        this.needid=val

        this.showModal = true
      },
      makeAPhoneCall(phoneNumber) {
        this.$androidUtil.makeAPhoneCall(phoneNumber)
      },
      search(args) {
        this.model.rows = []
        this.model.search(args.condition, args.model)
      },
      selfSearch () {
        //console.log("888888888888888")
        let condition = " and ti.f_plan_id='"+this.goid+"'"
       if(this.$refs.paged.$refs.cri.model.f_userinfo_code)
          condition += " and ti.f_userinfo_code like '%"+this.$refs.paged.$refs.cri.model.f_userinfo_code+"%'"
        if(this.$refs.paged.$refs.cri.model.f_keyword)
          condition += " and ti.f_address like '%"+this.$refs.paged.$refs.cri.model.f_keyword+"%'"
        if(this.$refs.paged.$refs.cri.model.f_user_name)
          condition += " and ti.f_user_name like '%"+this.$refs.paged.$refs.cri.model.f_user_name+"%'"
        console.log('condition ===> '+ condition)
        this.model.search("((f_complete = '' or f_complete = null or f_complete = '未完成') or (f_state = '未检')) and ti.f_no_checkplan = '有计划安检'" + condition)
      },
      hidden() {
        this.criteriaShow = !this.criteriaShow
      },
      setPlanParam(detailsType, event) {
        if (event.srcElement.checked) {
          this.planparam.push(detailsType)
          console.log(this.planparam)
        } else {
          if(this.planparam.length>0){
            let planid=  this.planparam.findIndex((value) => {
              return value === detailsType
            })
            this.planparam.splice(planid, 1)
            console.log(this.planparam)

          }

        }
      },
    }
  }
</script>
