<template>
  <div class="flex-row">
    <div class="basic-main">
      <button class="btn btn-xs" v-show="!criteriaShow" @click="show()">
        <span
          class="glyphicon glyphicon-chevron-down"
          style="color: #000"
        ></span>
      </button>
      <criteria-paged :model="model" v-ref:paged>
        <criteria
          partial="criteria"
          class="search_area"
          v-show="$parent.criteriaShow"
          @condition-changed="$parent.search"
          v-ref:criteria
        >
          <div
            novalidate
            class="form-horizontal select-overspread container-fluid auto"
            partial
          >
            <div class="row">
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">用户编号</label>
                <input
                  type="text"
                  class="input_search"
                  v-model="model.f_userinfo_code"
                  id="f_userinfo_code"
                  style="width: 60%"
                  placeholder="用户编号"
                  condition="ui.f_userinfo_code like '%{}%'"
                />
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">用户姓名</label>
                <input
                  type="text"
                  class="input_search"
                  v-model="model.f_user_name"
                  id="f_user_name"
                  style="width: 60%"
                  placeholder="用户姓名"
                  condition="ui.f_user_name like '%{}%'"
                />
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">
                  &nbsp;&nbsp;&nbsp;地址&nbsp;&nbsp;&nbsp;</label
                >
                <input
                  type="text"
                  class="input_search"
                  v-model="model.f_address"
                  id="f_address"
                  style="width: 60%; margin-left: 2px"
                  placeholder="地址"
                  condition="f_address like '%{}%'"
                />
              </div>
              <div
                class="col-sm-8"
                style="width: 40%"
                v-if="$parent.$parent.criteriaShow"
              >
                <role-selector
                  role-name="安检员"
                  role-lable="安&nbsp;检&nbsp;员&nbsp;"
                  @re-res="$parent.$parent.getRes"
                  :value.sync="model.f_checker_name"
                  v-model="model.f_checker_name"
                  condition="f_checker_name = '{}'"
                >
                </role-selector>
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">用户类型</label>
                <v-select
                  id="f_usertype"
                  placeholder="用户类型"
                  class="select select_list"
                  style="width: 60%"
                  :value.sync="model.f_usertype"
                  :value-single="true"
                  :options="$parent.$parent.usertypes"
                  v-model="model.f_usertype"
                  condition="uf.f_user_type = '{}'"
                  close-on-select
                  clear-button
                >
                </v-select>
              </div>
              <div
                class="col-sm-4"
                style="width: 20%"
                v-if="$parent.$parent.criteriaShow"
              >
                <label class="font_normal_body">开始时间</label>
                <datepicker
                  class="select_list select"
                  :value.sync="model.f_check_start"
                  placeholder="开始时间"
                  style="width: 60%"
                  :disabled-days-of-week="[]"
                  :format="'yyyy-MM-dd'"
                  :show-rest-button="reset"
                  v-model="model.f_check_start"
                  condition="f_upload_date > ='{} 00:00:00'"
                >
                </datepicker>
              </div>
              <div
                class="col-sm-4"
                style="width: 20%"
                v-if="$parent.$parent.criteriaShow"
              >
                <label class="font_normal_body">结束时间</label>
                <datepicker
                  :value.sync="model.f_check_end"
                  placeholder="结束时间"
                  style="width: 60%"
                  :disabled-days-of-week="[]"
                  :format="'yyyy-MM-dd'"
                  :show-rest-button="reset"
                  v-model="model.f_check_end"
                  condition="f_upload_date <=  '{} 23:59:59'"
                >
                </datepicker>
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">气量筛选</label>
                <input
                  type="text"
                  class="input_search"
                  v-model="model.f_gas_start"
                  id="f_gas_start"
                  style="width: 60%"
                  placeholder="日均气量≥()m³"
                  condition="cast(aa as float) >= {}"
                />
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">气量筛选</label>
                <input
                  type="text"
                  class="input_search"
                  v-model="model.f_gas_end"
                  id="f_gas_end"
                  style="width: 60%"
                  placeholder="日均气量≤()m³"
                  condition="cast(aa as float) <= '{}'"
                />
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">调价居民</label>
                <v-select
                  id="f_gasuser"
                  placeholder="调价居民"
                  class="select select_list"
                  style="width: 60%"
                  :value.sync="model.f_gasuser"
                  :value-single="true"
                  :options="$parent.$parent.gasusertypes"
                  v-model="model.f_gasuser"
                  condition="{}='是'"
                  close-on-select
                  clear-button
                >
                </v-select>
              </div>
              <div class="col-sm-4" style="width: 20%">
                <label class="font_normal_body">气表类型</label>
                <v-select
                  id="f_meter_classify"
                  placeholder="气表类型"
                  class="select select_list"
                  style="width: 60%"
                  :value.sync="model.f_meter_classify"
                  :value-single="true"
                  :options="$parent.$parent.f_meter_types"
                  v-model="model.f_meter_classify"
                  condition="gc.f_meter_classify like '%{}%'"
                  close-on-select
                  clear-button
                >
                </v-select>
              </div>
              <div
                class="col-sm-4"
                style="width: 20%"
                v-if="$parent.$parent.criteriaShow"
              >
                <label class="font_normal_body">统计日期</label>
                <datepicker
                  :value.sync="model.f_total_date"
                  placeholder="统计日期"
                  style="width: 60%"
                  :disabled-days-of-week="[]"
                  :format="'yyyy-MM-dd'"
                  :show-rest-button="reset"
                  v-model="model.f_total_date"
                >
                </datepicker>
              </div>
            </div>
            <div class="row">
              <div class="col-sm-8"></div>
              <div style="float: right; margin-right: 10px">
                <!--                <export-excel   :data="$parent.$parent.searchData"-->
                <!--                                :field="$parent.$parent.excelHeaders"-->
                <!--                                sqlurl="api/af-safecheck/logic/exportfile" sql-name="safeGasDay" :template-name='$parent.$parent.excelTitle'></export-excel>-->
                <export-excel-plus
                  :data="$parent.$parent.searchData"
                  :field="$parent.$parent.excelHeaders"
                  :exportprogress="true"
                  sqlurl="api/af-safecheck/logic/exportfileplus"
                  sql-name="safeGasDay"
                  :template-name="$parent.$parent.excelTitle"
                  :choose-col="true"
                ></export-excel-plus>
              </div>

              <div class="span" style="float: right; margin-right: 10px">
                <button
                  type="button"
                  class="button_search button_spacing"
                  @click="search()"
                >
                  查询
                </button>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid
          :model="model"
          partial="list"
          class="list_area table_sy"
          v-ref:grid
        >
          <template partial="head">
            <tr>
              <th><nobr>用户编号</nobr></th>
              <th><nobr>用户名称</nobr></th>
              <th><nobr>用户地址</nobr></th>
              <th><nobr>气表类型</nobr></th>
              <th><nobr>用户总累购</nobr></th>
              <th><nobr>用户当前表累购</nobr></th>
              <th><nobr>本次安检日期</nobr></th>
              <th><nobr>上次安检日期</nobr></th>
              <th><nobr>本次安检已用</nobr></th>
              <th><nobr>上次安检已用</nobr></th>
              <th><nobr>本次安检剩余</nobr></th>
              <th><nobr>上次安检剩余</nobr></th>
              <th><nobr>期间累购气量</nobr></th>
              <th><nobr>间隔天数</nobr></th>
              <th><nobr>期间用气量</nobr></th>
              <th><nobr>日均用气量</nobr></th>
              <!--            <th><nobr>style="text-align: center;white-space: nowrap"</nobr></th>-->
              <th><nobr>壁挂炉</nobr></th>
              <th><nobr>热水器</nobr></th>
              <th><nobr>距离上次安检</nobr></th>
              <th><nobr>距离上次购气</nobr></th>
            </tr>
          </template>
          <template partial="body">
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.f_userinfo_code }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.f_user_name }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.f_address }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.f_meter_classify }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.hisgas }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.totalgas }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.f_offsite_time }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.lasttime }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.used }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.lastused }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.remain }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.lastremain }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.amounttotalgas2 }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.amountday }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.amountusedgas2 }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.aa }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.bigualu }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.reshuiqi }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.laskcheckdate }}
            </td>
            <td
              v-bind:class="{ newcolor: row.code == 1 }"
              style="text-align: center; white-space: nowrap"
            >
              {{ row.lastgasdate }}
            </td>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>
</template>

<script>
import { PagedList } from "vue-client";
import { HttpResetClass } from "vue-client";
import co from "co";
import echarts from "echarts";
import * as Util from "./../Util";
import Vue from "vue";

let select = function* (self) {
  let http = new HttpResetClass();
  let getGasman = yield 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 }
  );
  console.log("获取安检员", getGasman);
  self.checkersid.push({ label: "全部", value: "" });
  getGasman.data.forEach((checker) => {
    self.checkersid.push({ label: checker.name, value: checker.id });
  });
};

export default {
  title: "日均用气量查询",
  data() {
    let model = new PagedList("api/af-safecheck/sql/getGasDay", 20, {
      totaldate: "this.totaldate",
    });
    model.totaldate = this.f_total_date;
    let options = [];
    let year = new Date().getFullYear();
    for (let i = year; i <= year + 3; i++)
      options.push({ label: i + "", value: i + "" });
    let moptions = [];
    for (let i = 1; i <= 12; i++)
      moptions.push({ label: i + "", value: i + "" });

    return {
      criteriaShow: true,
      usertypes: [
        { label: "全部", value: "" },
        ...this.$appdata.getParam("用户类型"),
      ],
      gasusertypes: [
        { label: "全部", value: "" },
        { label: "热水器", value: "reshuiqi" },
        { label: "壁挂炉", value: "bigualu" },
      ],
      f_meter_types: [
        { label: "全部", value: "" },
        { label: "气量卡表", value: "气量卡表" },
        { label: "机表", value: "机表" },
        { label: "物联网表", value: "物联网表" },
      ],
      //excelTitle:'用户安检情况导出'+Util.toStandardTimeString().substring(11,19).replace(new RegExp( ':' , "g" ),""),
      excelTitle: "用户日均用气量导出",
      searchData: {
        condition: "1=1",
        f_total_date: Util.toStandardTimeString().substring(0, 10),
      },
      excelHeaders: {
        //用户编号	用户名称	用户电话	安检次数	用户类型	小区名称	地址	安检日期	安检状态	安检结果

        f_userinfo_code: "用户编号",
        f_user_name: "用户名称",
        f_meter_classify:'气表类型',
        f_address: "用户地址",
        hisgas: "用户总累购",
        totalgas: "用户当前表累购",
        f_offsite_time: "本次安检日期",
        lasttime: "上次安检日期",
        used: "本次安检已用",
        lastused: "上次安检已用",
        remain: "本次安检剩余",
        lastremain: "上次安检剩余",
        amounttotalgas2: "期间累购气量",
        amountday: "间隔天数",
        amountusedgas2: "期间用气量",
        aa: "日均用气量",
        bigualu: "壁挂炉",
        reshuiqi: "热水器",
        laskcheckdate: "距上次安检",
        lastgasdate: "距上次购气",
      },
      f_filialeids1: `(${this.$login.f.orgid})`,
      model: model,
      checkersid: [],
      f_checker: "",
    };
  },
  props: {
    checkplan: {
      // 传入一条安检计划信息
      type: Object,
    },
    additemshow: {
      type: Boolean,
      default: false,
    },
  },
  ready() {
    this.$refs.paged.$refs.criteria.model.f_total_date =
      Util.toStandardTimeString().substring(0, 10);
    this.model.f_checker = "";
    this.model.f_filialeids = this.$login.f.f_orgids;
    let gen = select(this);
    co(gen);
  },
  methods: {
    search(args) {
      if (this.$refs.paged.$refs.criteria.model.f_total_date) {
        this.model.params.f_total_date =
          this.$refs.paged.$refs.criteria.model.f_total_date;
        this.searchData.f_total_date =
          this.$refs.paged.$refs.criteria.model.f_total_date;
      }
      args.condition +=
        " and ui.f_filialeid in  " +
        (this.model.f_filialeid
          ? this.model.f_filialeid
          : `(${this.$login.f.orgid})`);
      this.searchData.condition = args.condition;
      return this.model.search(args.condition, args.model);
    },
    checkstatus() {
      return [
        { label: "全部", value: "" },
        ...this.$appdata.getParam("安检状态"),
      ];
    },
    // usertypes() {
    //   return [{label: '全部', value: ''}, ...this.$appdata.getParam('用户类型')]
    // },
    userstates() {
      return [
        { label: "全部", value: "" },
        ...this.$appdata.getParam("用户状态"),
      ];
    },
    show() {
      this.criteriaShow = true;
    },
    hidden() {
      this.criteriaShow = false;
    },
    cancel() {
      this.showModal = false;
    },

    getRes(obj) {
      this.model.f_filialeid = this.$login.convertToIn(obj.resids);
      console.log("f_filialeid值发生改变：" + this.model.f_filialeid);
    },
    getRes1(obj) {
      this.f_filialeids1 = this.$login.convertToIn(obj.resids);
      console.log("打嗝日志----：" + "-----" + this.f_filialeids1);
    },
  },

  watch: {
    "model.f_checker_id"(val) {
      console.log("77777777777777");
      console.log(val);
    },
  },
  computed: {},
};
</script>
<style scoped>
.newcolor {
  color: red;
}
.table th {
  background-color: #f2f6fa;
  color: black;
}
</style>
