<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_checker condition="f_checker 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_plan_name condition="f_plan_name 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: 45%;" @click="$parent.$parent.selfSearch">查询</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>
          <div @click="$parent.$parent.$parent. changepage(row.id)" 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-7 text-left input-font" style="width: 79%">{{ row.f_userinfo_code }}</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_plan_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_issued }}
                  </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_checker }}</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.plan_count }}
                    <!--<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-6">
                  <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.checked }}</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.unchecked}}</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.ceshi(row.f_user_phone)">转发</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" >
          </div>
          <div class="col-xs-4" style="padding-left: 2px">
            <input placeholder="计划名称" type="text"  v-model="plan"  style="height:30px;width: 100px;line-height: 35px"/>
          </div>
          <div class="col-xs-1">
          </div>
          <div class="col-xs-2" style="float: right">
            <button type="button" class="btn btn-lg " @click="plansearch" style="height: 30px;line-height: 1px;padding: 0px">查询</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" style="text-align: center">
        <button  class="button_search button_spacing" @click="isok()">确认</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) => {
  //     //tag
  //     res.data.forEach((checker)=>{
  //       self.checkers.push({label:checker.name,value:checker.id})
  //     })
  //     self.checkers.push({label:'全部',value:''})
  //   })
  // }
  export default {
    title: '111',
    data() {
      return {
        checkplan:new SearchList(true),
        check:'',
        plan:'',
        planid:'',
        goplanid:'',
        model:new PagedList(`${this.$androidUtil.getProxyUrl()}/rs/sql/预约计划下发`,20,{groupitem:"''",f_filialeids:"'("+Vue.user.orgid+")'",orderitem:"'f_create_time'"}),
        showModal:false,
        needid:'',
        criteriaShow: true,
        planoption:[],
        condition:'',
        checkers:[],
        param: null,
        f_preset_dt : Util.to3339TimeString(),
        //f_filialeids:'('+Vue.user.orgid+')',
        //f_filialeids:'(453)',
        fcreatetime:'f_create_time'
      }
    },
    ready(){
      //tag
      this.selfSearch()
    },
    methods: {
      changepage(val){
        var pardate = {
          _this:this,
          title:'安检抽单',
          safe:false
        }
        this.$dispatch('gotoson',pardate)
        this.$goto('extract-plan-item', {goid: val},'self')
      },
      selfSearch () {
        let condition = "1=1"
        if(this.$refs.paged.$refs.cri.model.f_checker)
          condition += " and f_checker like '%"+this.$refs.paged.$refs.cri.model.f_checker+"%'"
        if(this.$refs.paged.$refs.cri.model.f_plan_name)
          condition += " and f_plan_name like '%"+this.$refs.paged.$refs.cri.model.f_plan_name+"%'"
        //tag
        //tag
        //tag
        this.model.search(condition)
      },
      // hidden() {
      //   this.criteriaShow = !this.criteriaShow
      // },
    }
  }
</script>
