<template lang="html">
  <div class="flex" style="padding: 15px;">
    <div class="form-inline auto">
      <div class="form-group auto">
        <label for="startDate">开始日期:</label>
        <datepicker id="startDate" placeholder="开始日期"
                    v-model="model.startDate"
                    :value.sync="model.startDate"
                    :disabled-days-of-Week="[]"
                    :format="'yyyy-MM-dd'"
                    :show-reset-button="reset">
        </datepicker>
      </div>
      <div class="form-group auto">
        <label for="endDate">结束日期:</label>
        <datepicker id="endDate" placeholder="结束日期"
                    v-model="model.endDate"
                    :value.sync="model.endDate"
                    :disabled-days-of-Week="[]"
                    :format="'yyyy-MM-dd'"
                    :show-reset-button="reset">
        </datepicker>
      </div>
      <div class="form-group auto">
        <label class="control-label">组织机构</label>
        <right-tree :userid.sync='userid' :source.sync='source'  @re-res="getRes"></right-tree>
      </div>
    </div>
    <div class="flex">
      <div class="flex-row" style="flex: 1;border-bottom: 1px dashed #888;height: 50%">
        <div  style="flex: 1;border-right: 1px dashed #888;">
          <site-manager :startdate='model.startDate' :enddate='model.endDate' :f_orgstr="filialeCodeStr" v-ref:pay ></site-manager>
        </div>
        <div  style="flex: 1;">
          <bank-manager :startdate='model.startDate' :enddate='model.endDate' :f_orgstr="filialeCodeStr" v-ref:pay></bank-manager>
        </div>
      </div>
      <div class="flex-row" style="flex: 1;height: auto">

        <div class="flex-row" style="flex: 1;">
          <div  style="flex: 1;">
            <paymentpie :startdate='model.startDate' :enddate='model.endDate' :f_orgstr="filialeCodeStr" v-ref:pay ></paymentpie>
          </div>
          <div style="flex: 1;border-right: 1px dashed #888;">
            <usertype-pie :startdate='model.startDate' :enddate='model.endDate' :f_orgstr="filialeCodeStr" v-ref:pay ></usertype-pie>
          </div>
        </div>

        <div style="flex: 1;">
          <bussiness-type :startdate='model.startDate' :enddate='model.endDate' :f_orgstr="filialeCodeStr" v-ref:pay ></bussiness-type>
        </div>
      </div>
    </div>
  </div>

</template>

<script>
  import * as Util from '../../Util'
  export default {
    data() {
      return {
        model: {
          startDate: Util.toStandardDateString(),
          endDate: Util.toStandardDateString()
        },
        filialeNameStr: null,
        filialeCodeStr: this.$login.f.orgpathstr,
        userid: this.$login.f.id,
        source:`tool.getFullTree(this.getRights().where(row.getType() != $zone$).where(row.getType() != $role$))`,
      }
    },
    methods: {
      searchdata() {
        this.$refs.pay.searchdata()
      },
      getRes(obj) {
        this.filialeNameStr = obj.res
        this.filialeCodeStr = obj.resids
      },
    }
  }
</script>

<style lang="css">
</style>
