<template>
  <div>
    <!-- 功能业务 -->
    <criteria-paged :model="model" v-ref:cp>
      <criteria partial='criteria' @condition-changed='$parent.searchCondition' v-ref:cri>
        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
          <div class="row">
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>工程编号：</strong></label>
              <input type="text" style="width:60%" class="input_search" placeholder='工程编号' v-model="model.f_apply_num"
                     v-on:keyup.enter="$parent.$parent.search()"
                     condition="f_apply_num like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>客户名称：</strong></label>
              <input type="text" style="width:60%" class="input_search" v-model="model.f_user_name"
                     v-on:keyup.enter="$parent.$parent.search()" condition="f_user_name like '%{}%'" placeholder='客户名称'>
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>联系电话：</strong></label>
              <input type="text" style="width:60%" class="input_search" placeholder='联系电话' v-model="model.f_phone"
                     v-on:keyup.enter="$parent.$parent.search()"
                     condition="f_phone like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>联&ensp;系&ensp;人：</strong></label>
              <input type="text" style="width:60%" class="input_search" placeholder='联系人' v-model="model.f_contact"
                     v-on:keyup.enter="$parent.$parent.search()"
                     condition="f_contact like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>设计人员：</strong></label>
              <v-select class="select select_list"
                        placeholder='设计人员'
                        v-model="model.f_designer_people"
                        :value.sync="model.f_designer_people"
                        :options='$parent.$parent.designerPeoples'
                        :value-single="true"
                        close-on-select
                        condition="f_designer_people = '{}'">
              </v-select>
            </div>
            <div class="form-group col-sm-3 button-range">
              <button class="button_search button_spacing" @click="$parent.$parent.search()" v-el:cx>查询</button>
              <button class="button_search button_spacing" @click="$parent.$parent.loadPage()">返回</button>
              <button class="button_clear button_spacing"  @click="$parent.$parent.clear()">清空</button>
              <div
                :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                @click="$parent.$parent.criteriaShow = !$parent.$parent.criteriaShow"
                class="button_spacing"
                style="float: right">
              </div>
            </div>
          </div>
          <div class="row" v-show="$parent.$parent.criteriaShow">
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>合同编号：</strong></label>
              <input type="text" style="width:60%" class="input_search" placeholder='合同编号' v-model="model.f_contract_number"
                     v-on:keyup.enter="$parent.$parent.search()"
                     condition="f_contract_number like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>报建类型：</strong></label>
              <v-select
                v-model="model.f_apply_type"
                placeholder='报建类型'
                condition="f_apply_type in {}"
                :value.sync="model.f_apply_type"
                :options='$parent.$parent.applytype'
                class="select select_list"
                multiple
                @change="$parent.$parent.applyTypeChange()"></v-select>
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>办理环节：</strong></label>
              <v-select
                v-model="model.defname"
                placeholder='办理环节'
                condition="defname = '{}'"
                :value.sync="model.defname"
                :options='$parent.$parent.defnames'
                class="select select_list"
                :value-single="true"
                close-on-select ></v-select>
            </div>
            <div class="form-group col-sm-2" v-if="false">
              <label class="font_normal_body"><strong>报建性质：</strong></label>
              <v-select
                v-model="model.f_apply_nature"
                placeholder='报建性质'
                condition="f_apply_nature = '{}'"
                :value.sync="model.f_apply_nature"
                :options='$parent.$parent.applyNatures'
                class="select select_list"
                :value-single="true"
                close-on-select ></v-select>
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>用户地址：</strong></label>
              <input type="text" style="width:60%" class="input_search" placeholder='用户地址' v-model="model.f_address"
                     v-on:keyup.enter="$parent.$parent.search()"
                     condition="f_address like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label  for="startDate" class="font_normal_body"><strong>开始时间：</strong></label>
              <datepicker id="startDate" placeholder="开始日期"
                          style="width: 60%!important;"
                          v-model="model.startDate"
                          :value.sync="model.startDate"
                          :format="'yyyy-MM-dd 00:00:00'"
                          :show-reset-button="true"
                          condition="f_apply_date >= '{}'">
              </datepicker>
            </div>
            <div class="form-group col-sm-2">
              <label for="endDate" class="font_normal_body"><strong>结束时间：</strong></label>
              <datepicker id="endDate" placeholder="结束日期"
                          style="width: 60%!important;"
                          v-model="model.endDate"
                          :value.sync="model.endDate"
                          :format="'yyyy-MM-dd 23:59:59'"
                          :show-reset-button="true"
                          condition="f_apply_date <= '{}'">
              </datepicker>
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body"><strong>来&emsp;&emsp;源：</strong></label>
              <v-select
                v-model="model.f_apply_source"
                placeholder='来源'
                condition="u.f_apply_source = '{}'"
                :value.sync="model.f_apply_source"
                :options='$parent.$parent.sources'
                class="select select_list"
                :value-single="true"
                close-on-select >
              </v-select>
            </div>
          </div>
        </div>
      </criteria>
      <data-grid v-if="$parent.showData" :model="model" partial='list' v-ref:grid class="list_area table_sy">
        <template partial='head'>
          <tr class="title">
            <th style="white-space: nowrap;">序号</th>
            <th style="white-space: nowrap;">工程编号</th>
            <th style="white-space: nowrap;">客户名称</th>
            <th style="white-space: nowrap;">联系人</th>
            <th style="white-space: nowrap;">合同编号</th>
            <th style="white-space: nowrap;">电话</th>
            <th style="white-space: nowrap;">地址</th>
            <th style="white-space: nowrap;">来源</th>
            <th style="white-space: nowrap;">报建类型</th>
            <th style="white-space: nowrap;">报建性质</th>
            <th style="white-space: nowrap;">办理环节</th>
            <th style="white-space: nowrap;">流程状态</th>
            <th style="white-space: nowrap;">报建日期</th>
            <th style="white-space: nowrap;">操作</th>
          </tr>
        </template>
        <template partial='body'>
          <tr>
            <td style="text-align: center;">
              <nobr><font>{{$index+1}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_apply_num}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_user_name}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_contact}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_contract_number}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_phone}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_address}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_apply_source}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_apply_type}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_apply_nature}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.defname}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_sub_state}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <nobr><font>{{row.f_apply_date}}</font></nobr>
            </td>
            <td style="text-align: center;">
              <dropdown>
                <button @click="$parent.$parent.$parent.checkfuncs(row)" type="button" data-toggle="dropdown" style="border: 0px;background: none;">
                  <span class="glyphicon glyphicon-th-list" style="position: inherit;"></span>
                </button>
                <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-right">
                  <li v-for="(index,func) in $parent.$parent.$parent.funcs" v-if="$parent.$parent.$parent.$parent.showFunc(func.personexpression)">
                    <a href="#" @click="$parent.$parent.$parent.$parent.func(func,row)">{{func.title}}</a>
                  </li>
                </ul>
              </dropdown>
            </td>
          </tr>
        </template>
      </data-grid>
    </criteria-paged>
  </div>
</template>
<script>
import {HttpResetClass, PagedList} from 'vue-client'
  import {isEmpty} from '../../Util'
import Vue from "vue";
  export default {
    title: '报建业务信息',
    props: ['showData'],
    data () {
      return {
        model: new PagedList('rs/sql/checkuserfunction', 20, {
          data: {
            f_filiale: "榆林."+this.$login.f.orgs
          }
        }),
        funcs: [], // 功能列表
        applytype: [{label: '全部', value: ''}, ...this.$appdata.getParam('报建类型')?this.$appdata.getParam('报建类型'):[]],
        defnames: isEmpty(this.$appdata.getParam('办理环节')) ? [{label: '全部', value: ''}] : [{label: '全部', value: ''}, ...this.$appdata.getParam('办理环节')], // 流程节点
        criteriaShow: false,
        sources:[{label: '微信公众号', value: '微信公众号'},{label: '线下发起', value: '线下发起'}],
        designerPeoples:  this.getDesigner()
      }
    },
    ready () {
      // 调用查询
      this.search()
    },
    methods: {
      searchCondition (args) {
        args.condition = args.condition
        if (args.condition.includes('民用报建')) {
          args.condition = args.condition.replace('f_apply_type = \'民用报建\'', '(f_apply_type = \'民用报建\' or f_apply_type = \'分户挂表\')');
        }
        console.log("args.condition",args.condition)
        this.model.search(args.condition, args.model)
      },
      // 查询
      search () {
        this.$dispatch('search')
      },
      loadPage () {
        this.$dispatch('loadPage')
      },
      // 获取配置
      async checkfuncs (row) {

        this.funcs = []
        let functions = JSON.parse(JSON.stringify(this.$function_vue.functions))

        for (const item of functions) {
          // 显示类型
          if (item.showApplyTypes) {
            if (item.showApplyTypes.indexOf(row.f_apply_type) === -1) {
              continue
            }
          }
          // 显示节点
          if (item.showDefnames) {
            if (item.showDefnames.indexOf(row.defname) === -1) {
              continue
            }
          }
          // 显示设备
          if (item.device && item.device !== 'pc') {
            continue
          }
          this.funcs.push(item)
        }
      },
      // 点击功能操作
      func (func, row) {
        this.$dispatch('func', func, row)
      },
      // 权限控制
      showFunc (personexpression) {

        if (isEmpty(personexpression)) {
          return true
        }

        let mark = personexpression.charAt(0)

        let str = personexpression.substring(2, personexpression.length-1)

        if (mark === 'D' && this.$login.f.f_department_name.includes(str)) {
          return true
        }
        if (mark === 'R' && this.$login.f.rolesnames.includes(str)) {
          return true
        }
        if (personexpression.indexOf('RS') === 0) {
          for (str of personexpression.substring(3, personexpression.length-1).split(',')) {
            if(this.$login.f.rolesnames.includes(str)){
              return true
            }
          }
        }
        if (mark === 'P' && this.$login.f.id.includes(str)) {
          return true
        }

        return false
      },
      async applyTypeChange () {
        if (!isEmpty(this.$refs.cp.$refs.cri.model.f_apply_type)) {
          let http = new HttpResetClass()
          let res = await http.load('POST', 'rs/logic/getDefnameByType', {
              f_apply_type: this.$refs.cp.$refs.cri.model.f_apply_type
            },
            {resolveMsg: null, rejectMsg: '流程标识获取失败！！！'}
          )

          this.defnames = [{label: '全部', value: ''}, ...res.data]
        } else {
          this.defnames = isEmpty(this.$appdata.getParam('办理环节')) ? [{label: '全部', value: ''}] : [{label: '全部', value: ''}, ...this.$appdata.getParam('办理环节')]
        }
      },
      async getDesigner() {
        let http = new HttpResetClass()
        let data = {
          source: 'this.getParentByType($organization$).getChildByName($设计人员$).getChildren()',
          userid: this.$login.f.id
        }
        http.load('POST', 'rs/search', {
          data
        }, {resolveMsg: null, rejectMsg: null}).then((res) => {
          console.log("ces",res.data.map(item => {
            return {
              label: item.name,
              value: item.name
            }
          }))
          this.designerPeoples = res.data.map(item => {
            return {
              label: item.name,
              value: item.name
            }
          })
        })

      },
      clear () {
        Object.keys(this.$refs.cp.$refs.cri.model).forEach((key) => {
          this.$refs.cp.$refs.cri.model[key] = null
          this.$refs.cp.$refs.cri.model.f_apply_type = []
        })
      }
    },
    computed: {
    },
    events: {
    }
  }
</script>
<style scoped>
</style>
