<template>
  <div class="p-10">
    <criteria-paged :model="model" v-ref:cp>
      <criteria partial='criteria' @condition-changed='$parent.searchCondition' v-ref:cri>
        <div partial class="auto">
          <div class="row form-group app-input">
            <label class="">客户名称：</label>
            <div class="col-xs-8" >
              <input class="" v-model=model.f_user_name condition="u.f_user_name like '%{}%'" />
            </div>
          </div>
          <div class="row form-group app-input" v-if="$parent.$parent.criteriaShow">
            <label class="">联系电话：</label>
            <div class="col-xs-8" >
              <input class="" v-model=model.f_phone condition="u.f_phone like '%{}%'" />
            </div>
          </div>
          <div class="row form-group app-input" v-if="$parent.$parent.criteriaShow">
            <label class="">工程编号：</label>
            <div class="col-xs-8" >
              <input class="" v-model=model.f_apply_num condition="u.f_apply_num like '%{}%'" />
            </div>
          </div>
          <div class="row form-group app-input" v-if="$parent.$parent.criteriaShow">
            <label class="">报建类型：</label>
            <div class="col-xs-8" >
              <v-select
                width="100%"
                v-model="model.f_apply_type"
                placeholder='报建类型'
                condition="u.f_apply_type like '%{}%'"
                :value.sync="model.f_apply_type"
                :options='$parent.$parent.applytype'
                class="select select_list"
                :value-single="true"
                close-on-select ></v-select>
            </div>
          </div>
          <div class="row form-group text-right" style="">
            <button class="btn btn-primary" @click="$parent.$parent.search()">查询</button>
            <button class="btn btn-info" @click="$parent.$parent.clear()">清空</button>
            <button class="btn" :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}" @click="$parent.$parent.criteriaShow = !$parent.$parent.criteriaShow"></button>
          </div>
        </div>
      </criteria>

      <list :model="model" partial='list'>
        <div partial class="auto app-text panel">
          <div class="panel-body panel-self">
            <div class="col-xs-12">
              <p class="col-xs-3 text-left font"><b>工程编号：</b></p>
              <p class="col-xs-9 text-left input-font">{{ row.f_apply_num }}</p>
            </div>
            <div class="col-xs-12">
              <p class="col-xs-3 text-left font"><b>客户名称：</b></p>
              <p class="col-xs-9 text-left input-font">{{ row.f_user_name }}</p>
            </div>
            <div class="col-xs-12">
              <p class="col-xs-3 text-left font"><b>电&emsp;&emsp;话：</b></p>
              <p class="col-xs-9 text-left input-font">
                {{ row.f_phone }}&ensp;
              </p>
            </div>
            <div class="col-xs-12">
              <p class="col-xs-3 text-left font"><b>报建类型：</b></p>
              <p class="col-xs-9 text-left input-font">{{ row.f_apply_type }}</p>
            </div>
            <div class="col-xs-12">
              <p class="col-xs-3 text-left font"><b>办理环节：</b></p>
              <p class="col-xs-9 text-left input-font">{{ row.defname }}</p>
            </div>
            <div class="col-xs-12 text-right">
              <button class="btn btn-info" @click="$parent.$parent.$parent.click(row)">处理</button>
            </div>
          </div>
        </div>
      </list>
    </criteria-paged>
  </div>
</template>
<script>
import Vue from 'vue'
import { PagedList, HttpResetClass } from 'vue-client'
export default {
  title: '签字待办',
  data () {
    return {
      model: new PagedList(`${this.$androidUtil.getProxyUrl()}/rs/sql/signcheckuser`, 20, {
        data: {
          userid: Vue.user.id,
          f_filiale:"榆林."+Vue.user.orgs
        }
      }),
      criteriaShow: false,
      applytype: [{label: '全部', value: ''}, ...this.$appdata.getParam('报建类型')]
    }
  },
  ready () {
    this.search()
  },
  methods: {
    clear () {
      Object.keys(this.$refs.cp.$refs.cri.model).forEach((key) => {
        this.$refs.cp.$refs.cri.model[key] = null
      })
    },
    // 查询
    search () {
      this.$refs.cp.$refs.cri.search()
    },
    searchCondition (args) {
      this.model.search(args.condition, args.model)
    },
    click (row) {
      let _this = this
      this.$dispatch('gotoson', {
        _this: _this,
        title: row.defname,
        safe: true
      })
      this.$goto('app-service-control', {selectdata: row}, 'self', _this.search)
    }
  },
  events: {
  },
  watch: {
  },
  computed: {
  }
}
</script>
<style scoped>
.panel-self{
  border-radius: 10px;
  border:1px solid #499EDF;
  background-color: #F8F8F8;
}
.font{
  font: 15px PingFang-SC-Medium;
  color: #666666;
}

.button_shrink_top {
  width: 34px;
  height: 34px;
  border: solid 1px #6aa6e2;
  background-size: 100%;
  background-image: url("../../../../static/newStyle/stretch_top.png")
}

.button_shrink_bottom {
  width: 34px;
  height: 34px;
  border: solid 1px #6aa6e2;
  background-size: 100%;
  background-image: url("../../../../static/newStyle/stretch_bottom.png")
}
</style>
<style lang="less">
.app-input {
  label {
    float: left;
  }
  .select {
    button {
      border: none;
      outline: none;
      text-align: left;
      .btn-placeholder {
        color: #ACA899
      }
    }
  }
  .datepicker {
    .form-control:focus {
      border: none!important;
      outline: none!important;
      -webkit-box-shadow: none;
      box-shadow: none;
    }
  }
}
</style>
