<template>
  <div class="flex-row binary" id="unit">
    <div class="basic-main" @keyup.enter="search1">
      <div class="flex">
        <div class="flex" style="flex:1;" v-show="!echarts">
          <criteria-paged :model="model" :pager='true' v-ref:paged>
            <criteria @condition-changed='$parent.search' partial='criteria' v-ref:cri>
              <div class="form-horizontal select-overspread container-fluid auto" novalidate partial>
                <div class="row" width="100%">

                  <div class="col-sm-2 form-group">
                    <!--                    <label class="font_normal_body">组织机构</label>-->
                    <!--                    <res-select :initresid="$parent.$parent.orgid"-->
                    <!--                                @res-select="$parent.$parent.getRes"-->
                    <!--                                restype='organization'style="width: 60%">-->
                    <!--                    </res-select>-->
                    <label class="font_normal_body">公&emsp;&emsp;司</label>
                    <right-tree @re-res="$parent.$parent.getRes"
                                :initresid='$parent.$parent.orgid'></right-tree>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body">用户类型</label>
                    <v-select :options='$parent.$parent.usertypes'
                              :value.sync="model.f_user_type"
                              close-on-select
                              style="width:60%"
                              condition="uf.f_user_type = '{}'"
                              @change="$parent.$parent.userTypeChange()"
                              id="f_user_type"
                              placeholder='用户类型'
                              v-model="model.f_user_type">
                    </v-select>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body">用气性质</label>
                    <v-select :options='$parent.$parent.gasproperties'
                              :value.sync="model.f_gasproperties"
                              close-on-select
                              style="width:60%"
                              condition="uf.f_gasproperties = '{}'"
                              id="f_gasproperties"
                              placeholder='用气性质'
                              v-model="model.f_gasproperties">
                    </v-select>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body" style="word-break:keep-all;">调价时间</label>
                    <datepicker :format="'yyyy-MM-dd HH:mm:ss'"
                                :value.sync="model.startDate"
                                style="width:60%"
                                placeholder="起始时间"
                                v-model="model.startDate"
                    ></datepicker>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body" style="word-break:keep-all;">&emsp;&ensp;至&emsp;</label>
                    <datepicker :format="'yyyy-MM-dd HH:mm:ss'"
                                :value.sync="model.endDate"
                                placeholder="结束时间"
                                style="width:60%"
                                v-model="model.endDate"
                    ></datepicker>
                  </div>
                  <div class="span" style="float:right;">
                    <button @click="search()" class="button_search button_spacing">查询</button>
                    <button @click="$parent.$parent.clearmsg" class="button_clear button_spacing">清空</button>
                    <export-excel :data="$parent.$parent.getCondition" class="button_export button_spacing"
                                  :field="$parent.$parent.getfield"
                                  sqlurl="api/af-revenue/logic/openapi/exportfile" sql-name="webmeter_PriceInstructList"
                                  template-name='调价分析'
                                  :choose-col="true"></export-excel>
                    <!--                    <button @click="$parent.$parent.showEcharts()" class="button_export button_spacing">显示图表</button>-->
                    <div style="float: right" class="button_spacing"
                         :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                         @click="$parent.$parent.hidden()"></div>
                  </div>
                </div>
              </div>
            </criteria>
            <data-grid :model="model" id="reportgas" partial='list' class="list_area table_sy" v-ref:grid>
              <template partial='head'>
                <tr>
                  <th style="text-align:center">序号</th>
                  <th style="text-align:center">
                    <nobr>调价日期</nobr>
                  </th>
                  <th style="text-align:center" title="调价户数:调价记录数量">
                    <nobr>调价户数</nobr>
                  </th>
                  <th style="text-align:center" title="指令总数:调价记录生成的指令数量">
                    <nobr>指令总数</nobr>
                  </th>
                  <th style="text-align:center" title="指令总数:未发送指令户数">
                    <nobr>未生成指令户数</nobr>
                  </th>
                  <th style="text-align:center" title="已发送待执行数目">
                    <nobr>已发送待执行数目</nobr>
                  </th>
                  <th style="text-align:center" title="执行失败数目">
                    <nobr>执行失败数目</nobr>
                  </th>
                  <th style="text-align:center" title="成功指令数">
                    <nobr>成功指令数</nobr>
                  </th>
                  <th style="text-align:center" title="指令生成率:指令总数/调价户数">
                    <nobr>指令生成率</nobr>
                  </th>
                  <th style="text-align:center" title="指令待执行率:待执行数目/指令总数">
                    <nobr>指令待执行率</nobr>
                  </th>
                  <th style="text-align:center" title="指令生成率:指令成功数/指令总数">
                    <nobr>指令成功率</nobr>
                  </th>
                </tr>
              </template>
              <template partial='body' partial='list' v-ref:grid>
                <tr>
                  <td style="text-align:center">{{ $index + 1 }}</td>
                  <td style="text-align:center;width: 170px;">{{ row.f_operate_date }}</td>
                  <td style="text-align:center">{{ row.pricesum }}</td>
                  <td style="text-align:center">{{ row.instructsum }}</td>
                  <td style="text-align:center">
                    <span @click="$parent.$parent.$parent.openDetail(row,' and ins.id is null ',row.noinstructsum)"><a
                      style="cursor:pointer;">{{ row.noinstructsum }}</a></span>
                  </td>
                  <td style="text-align:center">
                    <span
                      @click="$parent.$parent.$parent.openDetail(row,` and ins.f_instruct_state ='待发送' `,row.awaitsum)"><a
                      style="cursor:pointer;">{{ row.awaitsum }}</a></span>
                  </td>
                  <td style="text-align:center">
                    <span
                      @click="$parent.$parent.$parent.openDetail(row,` and ins.f_instruct_state ='执行失败'` ,row.failsum)"><a
                      style="cursor:pointer;">{{ row.failsum }}</a></span>
                  </td>
                  <td style="text-align:center">{{ row.succsum }}</td>
                  <td style="text-align:center">{{ row.production_rate }}</td>
                  <td style="text-align:center">{{ row.await_rate }}</td>
                  <td style="text-align:center">{{ row.succ_rate }}</td>
                </tr>
              </template>
              <template partial='foot'></template>
            </data-grid>
          </criteria-paged>
        </div>
        <!--        <div style="height: 40px;width: 100%;" v-show="echarts">-->
        <!--          <button @click="showEcharts()" class="button_search button_spacing">隐藏图表</button>-->
        <!--        </div>-->
        <!--        &lt;!&ndash;      图显示模板&ndash;&gt;-->
        <!--        <div class="span " style="width: 100%;" v-show="echarts">-->
        <!--          <user-instruct-echarts-list :condition="condition" :echarts="echarts"-->
        <!--                                      :enddate="endDate" :startdate="startDate"></user-instruct-echarts-list>-->
        <!--        </div>-->
      </div>
    </div>
  </div>
</template>
<script>
import {PagedList} from 'vue-client'
import * as Util from '../../../Util'
import plugins from '../../../plugins/GetLoginInfoService'
import plugin from 'system-clients/src/plugins/GetLoginInfoService'

export default {
  title: '调价分析',
  data() {
    return {
      model: new PagedList('api/af-revenue/sql/webmeter_PriceInstructList', 100, {
        startDate: 'this.model.startDate',
        endDate: 'this.model.endDate'
      }),
      condition: '1=1',
      startDate: '',
      gasproperties: [{label: '全部', value: ''}],
      endDate: '',
      getfield: {
        "f_operate_date": "调价日期",
        "pricesum": "调价户数",
        "instructsum": "指令总数",
        "noinstructsum": "未生成指令数",
        "awaitsum": "已发送待执行数目",
        "failsum": "执行失败数目",
        "succsum": "成功指令数",
        "production_rate": "指令生成率",
        "await_rate": "指令待执行率",
        "succ_rate": "指令成功率",
      },
      criteriaShow: false,
      echarts: false,
      searchshow: false,
      orgCondtionStr: '(' + this.$login.f.orgid + ')',
      orgid: [this.$login.f.orgid]
    }
  },
  ready() {
    this.$refs.paged.$refs.cri.model.startDate = Util.addDate(new Date(), -6).substring(0, 10) + ' 00:00:00'
    this.$refs.paged.$refs.cri.model.endDate = Util.toStandardDateString() + ' 23:59:59'
    this.getdata()
  },
  methods: {
    userTypeChange() {
      this.gasproperties = [{label: '全部', value: ''}]
      if (this.$refs.paged.$refs.cri.model !== null) {
        this.$refs.paged.$refs.cri.model.f_gasproperties = ''

        console.log(this.$refs.paged.$refs.cri.model.f_user_type[0])
        this.gasproperties = this.$appdata.getParam(this.$refs.paged.$refs.cri.model.f_user_type[0])
        // this.gasproperties.push({label: '全部', value: ''})
      } else {
        this.gasproperties = [{label: '全部', value: ''}]
      }
    },
    openDetail(row, type, num) {
      if (num === 0) {
        console.log('用户数为0')
      }
      this.$dispatch('change-tab', {
        startDate: row.f_operate_date + ' 00:00:00',
        endDate: row.f_operate_date + ' 23:59:59',
        condition: this.condition + type
      })
    },
    search1() {
      this.$refs.paged.$refs.cri.search()
    },
    // 查询开关
    hidden() {
      this.criteriaShow = !this.criteriaShow
    },
    getdata() {
      this.startDate = this.$refs.paged.$refs.cri.model.startDate
      this.endDate = this.$refs.paged.$refs.cri.model.endDate
      if (this.orgCondtionStr)
        this.condition = this.$refs.paged.$refs.cri.condition + 'and uf.f_orgid in ' + this.orgCondtionStr
      this.$refs.paged.$refs.cri.search()
    },
    // 显示柱状图
    showEcharts() {
      this.echarts = !this.echarts
    },
    close() {
      this.show = false
    },
    clearmsg () {
      Object.keys(this.$refs.paged.$refs.cri.model).forEach((key) => {
        this.$refs.paged.$refs.cri.model[key] = []
      })
    },
    search(args) {
      this.startDate = this.$refs.paged.$refs.cri.model.startDate
      this.endDate = this.$refs.paged.$refs.cri.model.endDate
      if (this.endDate == '' || this.startDate == '') {
        return this.$showMessage("时间区间的开始和结束时间不能为空！")
      }
      if (this.orgCondtionStr)
        args.condition = `${args.condition}` + 'and uf.f_orgid in ' + this.orgCondtionStr
      this.condition = args.condition
      this.model.search(args.condition, args.model)
    },
    getRes(obj) {
      this.orgCondtionStr = plugins.convertToIn(obj.resids) ? plugin.convertToIn(obj.resids) : '(' + this.$login.f.orgid + ')'
    }
    // getRes(obj) {
    //   this.orgCondtionStr = plugins.convertToIn(obj)
    // }
  },
  computed: {
    getCondition() {
      var con = ""
      if (this.orgCondtionStr) {
        con = `${this.$refs.paged.$refs.cri.condition} and uf.f_orgid in  ${this.orgCondtionStr}`
      } else {
        con = `${this.$refs.paged.$refs.cri.condition} `
      }
      return {
        condition: con,
        startDate: `${this.$refs.paged.$refs.cri.model.startDate}`,
        endDate: `${this.$refs.paged.$refs.cri.model.endDate}`
      }

    },
    usertypes() {
      return [{label: '全部', value: ''}, ...this.$appdata.getParam('用户类型')]
    },
    Getuserstyle() {
      return [{label: '全部', value: ''}, ...this.$appdata.getParam('用气类型')]
    }
  }
}
</script>
<style>
.mystyle {
  margin-left: 80px;
}

.datapanel {
  color: #333;
  background-color: white;
  box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px;
  padding: 10px 10px 10px 10px;
  border-radius: 15px;
}
</style>
