safecheck-client 3.0.30-62-t11 → 3.0.30-62-t12

package/src/filiale/wensu/pc/CheckSearchUser.vue

@@ -1,1238 +1,1238 @@
-<template>
-  <div class="flex">
-    <criteria-paged :model="model" v-ref:paged>
-      <criteria partial='criteria' @condition-changed='$parent.search' v-ref:criteria>
-        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
-          <div class="row" v-show="!$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">用户编号</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_userinfo_code"
-                     id="f_userinfo_code"
-
-                     placeholder="用户编号" condition="f_userinfo_code like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">用户姓名</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_user_name" id="f_user_name"
-                     placeholder="用户姓名" condition="f_user_name like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">小&emsp;&emsp;区</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_residential_area"
-                     id="f_residential_area"
-                     placeholder="小区" condition="f_residential_area like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">地&emsp;&emsp;址</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_address" id="f_address"
-                     placeholder="地址" condition="f_address like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style" style="width: auto;margin-top:8px;float: right">
-              <export-excel :data="$parent.$parent.searchData"
-                                 :field="$parent.$parent.excelHeaders"
-                                 :choose-col="true"
-                                 sqlurl="api/af-safecheck/logic/SafeExportExcel" sql-name="根据安检员查询用户档案"
-                                 template-name='用户安检情况'></export-excel>
-              <button type="button" class="button_search button_spacing" @click="search()">查询</button>
-              <button type="button" class="button_search button_spacing" @click="$parent.$parent.blacklist()">拉黑</button>
-              <div style="float: right" class="button_spacing"
-                   :class="{'button_shrink_left':$parent.$parent.$parent.showItem,'button_shrink_right':!$parent.$parent.$parent.showItem}"
-                   @click="$parent.$parent.hiddenr()"></div>
-              <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 class="row" v-show="!$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">用气类型</label>
-              <v-select id="f_usertype"
-                        placeholder='用气类型'
-                        class="select select_list"
-                        :value.sync="model.f_gasproperties"
-                        :value-single="true"
-                        :options='$parent.$parent.gasproperties'
-                        v-model="model.f_gasproperties"
-                        condition="f_gasproperties = '{}'"
-                        close-on-select clear-button></v-select>
-            </div>
-            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
-
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body" style="color: red;">安检筛选</label>
-              <v-select
-                placeholder='安检筛选'
-                :value-single="true"
-                class="select select_list"
-                :value.sync="$parent.$parent.SafeCheckXZ"
-                :options='$parent.$parent.SafeCheckXZs'
-                v-model="$parent.$parent.SafeCheckXZ"
-                close-on-select clear-button></v-select>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">安检起始</label>
-              <datepicker
-                :value.sync="model.f_check_start"
-                placeholder='最后安检时间起始'
-                style="width: 60%"
-                :format="'yyyy-MM-dd 00:00:00'"
-                :show-rest-button="reset"
-                v-model="model.f_check_start">
-              </datepicker>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">安检结束</label>
-              <datepicker
-                :value.sync="model.f_check_end"
-                placeholder='最后安检时间结束'
-                style="width: 60%"
-                :format="'yyyy-MM-dd 23:59:59'"
-                :show-rest-button="reset"
-                v-model="model.f_check_end">
-              </datepicker>
-            </div>
-
-<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">安检状态</label>
-              <v-select id="f_entry"
-                        placeholder='安检状态'
-                        class="select select_list"
-                        :value.sync="model.f_last_check_state"
-                        :value-single="true"
-                        :options='$parent.$parent.checkstatus'
-                        v-model="model.f_last_check_state"
-                        condition="f_last_check_state = '{}'"
-                        close-on-select clear-button></v-select>
-            </div>-->
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">隐患情况</label>
-              <v-select
-                placeholder='隐患情况'
-                class="select select_list"
-                :value-single="true"
-                v-model='model.f_check_result'
-                :value.sync="model.f_check_result"
-                :options='$parent.$parent.f_check_results'
-                condition="f_last_check_result  like '%{}%'"
-                close-on-select clear-button></v-select>
-            </div>
-            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
-          </div>
-          <div class="row" v-show="!$parent.$parent.$parent.showItem">
-
-            <div class="col-sm-4 form-group" v-show="$parent.$parent.criteriaShow" style="margin: 0">
-              <role-selector-safe
-                role-name="安检员"
-                role-lable="安&nbsp;检&nbsp;员&nbsp;"
-                @re-res="$parent.$parent.getRes"
-                :value.sync="model.f_checker_id"
-                v-model="model.f_checker_id"
-                :value-multiple="true"
-                condition=" f_checker_name in {}">
-              </role-selector-safe>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-            <label class="font_normal_body">片&emsp;&emsp;区</label>
-            <v-select class="select_list select"
-                      placeholder='片区/管理站' style="width: 60%"
-                      :value.sync="model.f_slice_area" v-model="model.f_slice_area"
-                      :options='$parent.$parent.sliceArea'
-                      filer-key="name"
-                      close-on-select clear-button
-                      condition="f_slice_area='{}'"
-                      @change="$parent.$parent.getmeterbook(model.f_slice_area)"
-                      :value-single="true">
-            </v-select>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">抄&ensp;表&ensp;册</label>
-              <v-select class="select_list select"
-                        placeholder='抄表册' style="width: 60%"
-                        :value.sync="model.f_meter_book_num" v-model="model.f_meter_book_num"
-                        :options='$parent.$parent.cbc'
-                        filer-key="name"
-                        close-on-select clear-button
-                        condition="f_meter_book_num={}"
-                        :value-single="true">
-              </v-select>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">省&ensp;市&ensp;区</label>
-              <v-select class="select_list select"
-                        placeholder='请选择' style="width: 60%"
-                        :value.sync="model.f_pcd" v-model="model.f_pcd"
-                        :options='$parent.$parent.pcds'
-                        filer-key="name"
-                        close-on-select clear-button
-                        condition="f_pcd='{}'"
-                        :value-single="true">
-              </v-select>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">用户状态</label>
-              <v-select class="select_list select"
-                        placeholder='用户状态' style="width: 60%"
-                        :value.sync="model.f_user_state" v-model="model.f_user_state"
-                        :options='$parent.$parent.userstates'
-                        close-on-select clear-button
-                        condition="f_user_state = '{}'"
-                        :value-single="true">
-              </v-select>
-            </div>
-<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">-->
-<!--              <label class="font_normal_body">用户性质</label>-->
-<!--              <v-select class="select_list select"-->
-<!--                        placeholder='用户性质' style="width: 60%"-->
-<!--                        :value.sync="model.f_gasproperties" v-model="model.f_gasproperties"-->
-<!--                        :options='$parent.$parent.gasproperties'-->
-<!--                        close-on-select clear-button-->
-<!--                        condition="f_gasproperties = '{}'"-->
-<!--                        :value-single="true">-->
-<!--              </v-select>-->
-<!--            </div>-->
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">开户网点</label>
-              <v-select class="select_list select"
-                        placeholder='开户网点' style="width: 60%"
-                        :value.sync="model.f_outlets" v-model="model.f_outlets"
-                        :options='$parent.$parent.userareas'
-                        close-on-select clear-button
-                        condition=" f_khwd = '{}'"
-                        :value-single="true">
-              </v-select>
-            </div>
-          </div>
-
-          <div class="row" v-show="$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">用户编号</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_userinfo_code"
-
-                     placeholder="用户编号" condition="f_userinfo_code like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style">
-              <label class="font_normal_body">用户姓名</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_user_name"
-                     placeholder="用户姓名" condition="f_user_name like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style" style="width: auto;margin-top:8px;float: right">
-              <export-excel :data="$parent.$parent.searchData"
-                                 :field="$parent.$parent.excelHeaders"
-                                 sqlurl="api/af-safecheck/logic/SafeExportExcel" sql-name="根据安检员查询用户档案"
-                                 template-name='用户安检情况'></export-excel>
-              <button type="button" class="button_search button_spacing" @click="search()">查询</button>
-              <button type="button" class="button_search button_spacing" @click="$parent.$parent.blacklist()">拉黑</button>
-              <div style="float: right" class="button_spacing"
-                   :class="{'button_shrink_left':$parent.$parent.$parent.showItem,'button_shrink_right':!$parent.$parent.$parent.showItem}"
-                   @click="$parent.$parent.hiddenr()"></div>
-              <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 class="row" v-show="$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">小&emsp;&emsp;区</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_residential_area"
-
-                     placeholder="小区" condition="f_residential_area like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">地&emsp;&emsp;址</label>
-              <input style="width: 60%" type="text" class="input_search" v-model="model.f_address"
-
-                     placeholder="地址" condition="f_address like '%{}%'">
-            </div>
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">用气类型</label>
-              <v-select
-                placeholder='用气类型'
-                class="select select_list"
-
-                :value.sync="model.f_gasproperties"
-                :value-single="true"
-                :options='$parent.$parent.gasproperties'
-                v-model="model.f_gasproperties"
-                condition="f_gasproperties = '{}'"
-                close-on-select clear-button></v-select>
-            </div>
-            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
-
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body" style="color: red;">安检筛选</label>
-              <v-select
-                placeholder='安检筛选'
-                :value-single="true"
-
-                class="select select_list"
-                :value.sync="$parent.$parent.SafeCheckXZ"
-                :options='$parent.$parent.SafeCheckXZs'
-                v-model="$parent.$parent.SafeCheckXZ"
-                close-on-select clear-button></v-select>
-            </div>
-
-          </div>
-          <div class="row" v-show="$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">安检起始</label>
-              <datepicker
-                :value.sync="model.f_check_start"
-                placeholder='最后安检时间起始'
-                :disabled-days-of-week="[]"
-                style="width: 60%"
-                :format="'yyyy-MM-dd'"
-                :show-rest-button="reset"
-                v-model="model.f_check_start">
-              </datepicker>
-            </div>
-            <div :class="$parent.$parent.style" v-show="$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">
-              </datepicker>
-            </div>
-
-<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">安检状态</label>
-              <v-select
-                placeholder='安检状态'
-                class="select select_list"
-
-                :value.sync="model.f_last_check_state"
-                :value-single="true"
-                :options='$parent.$parent.checkstatus'
-                v-model="model.f_last_check_state"
-                condition="f_last_check_state = '{}'"
-                close-on-select clear-button></v-select>
-            </div>-->
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">隐患情况</label>
-              <v-select
-                placeholder='隐患情况'
-                class="select select_list"
-                :value-single="true"
-                v-model='model.f_check_result'
-                :value.sync="model.f_check_result"
-                :options='$parent.$parent.f_check_results'
-                condition="f_last_check_result  like '%{}%'"
-                close-on-select clear-button></v-select>
-            </div>
-
-          </div>
-          <!--<div class="row" v-show="$parent.$parent.$parent.showItem">
-            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
-              <label class="font_normal_body">公&emsp;&emsp;司</label>
-              <right-tree @re-res="$parent.$parent.getRes" :initresid="$parent.$parent.$login.f.orgid">
-              </right-tree>
-            </div>
-
-          </div>-->
-        </div>
-      </criteria>
-      <data-grid :model="model" partial="list" class="list_area table_sy" v-ref:grid>
-        <template partial='head'>
-          <tr>
-            <th><nobr><input type="checkbox" v-model="$parent.$parent.$parent.checkAll" @click.stop="()=>{return}" />全选</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 style="padding: 0 40px">
-              <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>
-          </tr>
-        </template>
-        <template partial='body'>
-          <td style="text-align: center;white-space:nowrap;"><input type="checkbox" @click="$event.cancelBubble=true" :checked="$parent.$parent.$parent.isChecked(row.f_userinfo_code)" @change="$parent.$parent.$parent.setCheckes(row.f_userinfo_code)"></input></td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_userinfo_code }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_user_name }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_user_phone }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{row.f_meternumber}}</td>
-<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{row.f_meter_brand}}</td>-->
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_gasproperties }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_khwd }}</td>
-<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_safe_hasfurnace }}</td>-->
-<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_safe_haskitchen }}</td>-->
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_residential_area }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_address }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_checker_name }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_last_check_date }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_last_check_state }}</td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">
-            {{row.f_last_check_result1 }}
-          </td>
-          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">
-            <button class="button_spacing button_search-1" @click.stop='$parent.$parent.$parent.searchInfo(row.f_userinfo_code,row.f_address,row.f_user_type,row.f_address_detail,row.f_house_number)' >点击</button>
-          </td>
-        </template>
-      </data-grid>
-    </criteria-paged>
-    <modal :show.sync="dialogVisible" destroyOnClose={true} v-ref:modal v-if="dialogVisible">
-      <div slot="modal-header" class="modal-header">
-        <h4 class="modal-title" style="text-align: center">
-          二维码
-        </h4>
-      </div>
-      <div slot="modal-body" class="modal-body" >
-        <div id="aa" style="margin-left: 115px">
-          <div id="bb">
-            <style id="style1">
-              #bb {
-                width: 302px;
-                height: 170px;
-              }
-              #bb .img{
-                width: 40px;
-                height: 40px;
-              }
-              #bb .td1{
-                text-align: left;
-                white-space: nowrap;
-                font-size: 12px;
-                font-weight: 900;
-              }
-              #bb .td2{
-                text-align: right;
-                font-size: 10px;
-                font-weight: 900;
-              }
-              #bb .td3{
-                text-align: center;
-                font-weight: 900;
-              }
-              #bb .baseImg{
-                width: 120px;
-                height: 120px;
-                float: right;
-                overflow:hidden;
-              }
-              #bb .span{
-                white-space: nowrap;
-              }
-              #bb .td0{
-                text-align: left;
-                width: 60px;
-              }
-            </style>
-            <table>
-              <tr>
-                <td class="td0">
-                  <img class="img" src="../../../assets/wensu/1.jpg" alt="">
-                </td>
-                <td class="td0">
-                  <img class="img" src="../../../assets/wensu/2.jpg" alt="">
-                </td>
-                <td class="td3">
-                  <span class="span" style="font-size: 13px;font-weight: 900">温宿县曦隆燃气开发有限公司</span><br>
-                  <span class="span" style="font-weight: 900">天然气入户安全检查专用标签</span>
-                </td>
-              </tr>
-              <tr>
-                <td class="td1" colspan="2">用&nbsp;户&nbsp;类&nbsp;型&nbsp;:&nbsp;{{modal_user_type}}</td>
-                <td colspan="3" rowspan="6"><img class="baseImg" :src="modal_base64_img" alt="">
-              </tr>
-              <tr><td class="td1" colspan="3">片区负责人&nbsp;:&nbsp;{{modal_responsible_checker}}</td></tr>
-              <tr><td class="td1" colspan="3">联&nbsp;系&nbsp;电&nbsp;话&nbsp;:&nbsp;{{modal_responsible_phone}}</td></tr>
-              <tr><td class="td1" style="font-size: 13px" colspan="3">燃气客服电话&nbsp;:&nbsp;0997-6150333</td></tr>
-              <tr><td class="td1" style="font-size: 13px" colspan="3">燃气报警电话&nbsp;:&nbsp;0997-4533119</td></tr>
-              <tr><td class="td1" colspan="3">地址&nbsp;:&nbsp;{{modal_user_address}}</td></tr>
-              <tr><td class="td2" colspan="5">曦隆燃气&nbsp;&nbsp;&nbsp;&nbsp;情系万家</td></tr>
-            </table>
-          </div>
-        </div>
-      </div>
-      <div slot="modal-footer" class="modal-footer">
-        <print-element class="btn btn-success width-80" id="aa" styleid='style1' top='1' left='1' width='100%' height='100%' v-ref:printelement>打印</print-element>
-        <button type="button" class="btn btn-success width-80" @click="dialogVisible = false">确认</button>
-        <button type="button" class="btn btn-success width-80" @click="dialogVisible = false">取消</button>
-      </div>
-    </modal>
-    <modal :show.sync="showModal2" :backdrop="false">
-      <div slot="modal-header" class="modal-header">
-        <h4 class="modal-title">
-          批量拉黑
-        </h4>
-      </div>
-      <div slot="modal-body" class="modal-body">
-        <div v-if="true">
-          <div class="row" style="margin-top: 10px">
-            <label  class="control-label font text-left" style="float:left;margin-left:20%;margin-top:5px">拉黑备注</label>
-            <div class="col-xs-8 col-md-8">
-              <textarea style="width: 60%; height: 100px" v-model="f_remarks"></textarea>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div slot="modal-footer" class="modal-footer" style="text-align: center">
-        <button class="button_search" @click="blacklist">确认</button>
-        <button class="button_search" @click="showModal2=false">取消</button>
-      </div>
-    </modal>
-<!--    <modal :show.sync="showModal3">
-      <div slot="modal-header" class="modal-header">
-        <h4 class="modal-title">
-          转维修进度{{ progressbarWidth }}%
-        </h4>
-      </div>
-      <div slot="modal-body" class="modal-body">
-        <div class="progress">
-          <div class="progress-bar" role="progressbar" aria-valuenow="60"
-               aria-valuemin="0" aria-valuemax="100" :style="'width:'+ progressbarWidth+'%'">
-            &lt;!&ndash;          <span class="sr-only">40% 完成</span>&ndash;&gt;
-          </div>
-        </div>
-      </div>
-      <div slot="modal-footer" class="modal-footer" style="text-align: center" v-show="false"></div>
-    </modal>-->
-  </div>
-
-</template>
-
-<script>
-import {PagedList} from 'vue-client'
-import {HttpResetClass} from 'vue-client'
-import co from 'co'
-import * as Util from '../../Util'
-import Vue from 'vue'
-
-
-// let select = function * (self,userid) {
-//   let http = new HttpResetClass()
-//   let getGasman = yield http.load('POST','/rs/search', {
-//     source: 'this.getChildByName($安检员$).getUsers()',
-//     userid: userid
-//   }, {resolveMsg: null, rejectMsg: null})
-//   //tag
-//   getGasman.data.forEach((checker)=>{
-//     self.checkersid.push({label:checker.name,value:checker.id})
-//   })
-//   self.checkersid.push({label:'全部',value:''})
-// }
-
-
-export default {
-  title: '用户安检情况',
-  data() {
-    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 {
-      dialogVisible: false,
-      searchData: {
-        condition: '1=1',
-        orderitem: "f_userinfo_code",
-        timetype: "dd",
-        f_defect_content: "CASE WHEN CHARINDEX( '\"result\":\"正常\"', tp.f_defect_content ) > 0 THEN '正常' ELSE replace(replace(replace( replace( RIGHT ( tp.f_defect_content, len( tp.f_defect_content ) - 26 ), substring('{}',2,1), '' ), substring('{}',1,1), '' ),']',''),'\"','') END"
-      },
-      excelHeaders: {
-        //用户编号	用户名称	用户电话	安检次数	用气类型	小区名称	地址	安检日期	安检状态	安检结果
-
-        'f_userinfo_code': '用户编号',
-        'f_user_name': '用户名称',
-        'f_user_phone': '用户电话',
-        'f_meternumber': '用户表号',
-        'f_gasproperties': '用气类型',
-        'f_khwd': '开户网点',
-        'f_checker_name': '安检员',
-        'f_residential_area': '小区名称',
-        'f_address': '地址',
-        'f_last_check_date': '安检日期',
-        'f_last_check_state': '安检状态',
-        'f_last_check_result1': '安检结果'
-      },
-      model: new PagedList('api/af-safecheck/sql/根据安检员查询用户档案', 20, {
-        orderitem: "'f_last_check_date'",
-        timetype: "'dd'",
-        f_defect_content: 'this.f_defect_content'
-      }),
-      f_defect_content:"CASE WHEN CHARINDEX( '\"result\":\"正常\"', tp.f_defect_content ) > 0 THEN '无隐患' ELSE replace(replace(replace( replace( RIGHT ( tp.f_defect_content, len( tp.f_defect_content ) - 26 ), substring('{}',2,1), '' ), substring('{}',1,1), '' ),']',''),'\"','') END",
-      orgstrs: [{label: '全部', value: ''}],
-      checkersid: [],
-      gasproperties:[],
-      userareas:[{label: '全部', value: ''}, ...this.$appdata.getParam('开户网点')],
-      SafeCheckXZ: '',
-      civil: '',   //民用安检周期
-      civilian: '',      //非民用安检周期
-      SafeCheckXZs: [{label: '全部', value: ''}, {label: '已入户', value: '已入户'}, {label: '未入户', value: '未入户'}], // 安检筛选选项
-      SafeCheckSXs: [{label: '是', value: '是'}, {label: '否', value: '否'}, {label: '全部', value: ''}],
-      // user_states:[{label: '全部', value: ''}, ...this.$appdata.getParam('用户状态')],
-      IsShares: [{label: '是', value: '是'}, {label: '否', value: '否'}],
-      IsShare: '否',
-      checker: {},
-      NoBuys: [{label: '是', value: '是'}, {label: '否', value: '否'}],
-      criteriaShow: false,
-      checkers: [],
-      chosenOrg: {id: 0},
-      showModal: false,
-      checkedAll: false,
-      checkrows: [],
-      adjustables: [],
-      f_plan_year: year + '',
-      f_plan_month: moptions[new Date().getMonth()].value,
-      f_effective_start_time: '',  //计划有效起始时间
-      f_effective_end_time: '',    //计划有效结束时间
-      checkboxModel: {},
-      c_year_list: options,
-      c_month_list: moptions,
-      areas: this.areas(),
-      checkstatus: this.checkstatus(),
-      usertypes: this.usertypes(),
-      userstates: this.userstates(),
-      sqlname: '',
-      f_check_results: [{label: '全部', value: ''}, {label: '正常', value: '正常'}, {label: '有隐患', value: '有隐患'}],
-      creatPlanWay: '',
-      sliceArea: [],
-      cbcs:[],
-      cbc:[],
-      pcds:[],
-      modal_user_type:'',
-      modal_responsible_checker:'',
-      modal_responsible_phone:'',
-      modal_user_address:'',
-      modal_base64_img:'',
-      checkes: [],
-      checkAll: false,
-      showModal2:false,
-      showModal3:false,
-      f_remarks:'',
-      progressbarWidth:'0',
-    }
-  },
-  props: {
-    style: {
-      type: String,
-      default: 'col-sm-2 form-group'
-    },
-    style2: {
-      type: String,
-      default: 'col-sm-4 form-group'
-    },
-    checkplan: { // 传入一条安检计划信息
-      type: Object
-    },
-    additemshow: {
-      type: Boolean,
-      default: false
-    }
-  },
-  ready() {
-    // 获取分公司信息
-    this.model.f_defect_content=this.f_defect_content
-
-    //this.getfengongsi()
-    this.model.chosenOrg = {id: 0}
-    this.model.f_filialeids = this.$login.f.f_orgids
-    this.model.f_filiale = this.$login.f.f_fengongsi
-    this.model.f_OrgStr = this.$login.f.orgpathstr
-    this.Mreadibook(`('${this.$login.f.orgid}')`)
-    this.getAllMeterBook(`('${this.$login.f.orgid}')`)
-    this.getAllGasproperties()
-    this.$refs.paged.$refs.criteria.model.f_check_start = Util.toStartDateString() + ' 00:00:00'
-    this.$refs.paged.$refs.criteria.model.f_check_end = Util.toEndDateString() + ' 23:59:59'
-    // this.getAllOutlets()
-  },
-  methods: {
-    async blacklist(){
-      if(!this.checkAll && this.checkes.length==0){
-        Vue.showMessage("请先勾选你要拉黑的用户！")
-        return
-      }
-      this.$showMessage("确定需要将选中用户在营收系统进行拉黑吗？",['confirm', 'cancel']).then((res)=>{
-        if (res === 'confirm'){
-          //this.showModal3=true
-          let successCount=0
-          console.log('是否全选', this.checkAll)
-          console.log('当前选中用户', this.checkes)
-          console.log('this.model----', this.model)
-          new HttpResetClass().load('post','api/af-safecheck/logic/safe_getuser_to_blactlist', {
-            data:{
-              condition: this.model.condition.condition1,
-              condition2: this.model.condition.condition2,
-              switchCheckAll: true,
-              checkAll: this.checkAll,
-              param: this.checkes,
-              columnName: 'f_userinfo_code',
-              orderitem:' f_userinfo_code',
-              type:'update'
-            }
-          }).then((res)=>{
-            this.$showMessage("操作成功！本次选中用已标记为待拉黑状态，同步营收系统会存在延迟。")
-          }).catch((msg)=>{
-            this.$showMessage("网络异常请稍后再试！")
-          })
-
-        }
-      })
-
-      /*new HttpResetClass().load('post','API/Secheck/SetBlackList', {
-        data:{
-          id:'700002373',
-          bh:'1511080819',
-          black:true,
-          blackMemo:'测试拉黑！！！'
-        }
-      }).then(res=>{
-        if (result.data.code==200) {
-          successCount += result.data.successcon
-          this.progressbarWidth=Math.ceil((i+1)*100/(this.checkes.length))
-        }
-        console.log('拉黑返回结果----', res)
-      }).catch(err=>{
-        console.log('拉黑请求失败----', err)
-      })*/
-    },
-    isChecked (v) {
-      // 如果全选，不在的按选中算，否则，在的按选中算
-      if (this.checkAll) {
-        return this.checkes.indexOf(v) == -1
-      } else {
-        return this.checkes.indexOf(v) != -1
-      }
-    },
-    setCheckAll () {
-      this.checkAll = this.checkAll ? false : true
-      // 全选改变后，清空选中数据
-      this.checkes = []
-    },
-    setCheckes (id) {
-      let index = this.checkes.indexOf(id)
-      if (index < 0) {
-        this.checkes.push(id)
-      } else {
-        this.checkes.splice(index, 1)
-      }
-    },
-    //查询二维码
-     searchInfo(val,address,userType,checkerName,checkerPhone){
-      this.dialogVisible = true
-       new HttpResetClass().load('post','api/af-safecheck/logic/QrcodeUtil', {
-        data: {
-          id:val
-        }
-      }).then(res=>{
-         this.modal_user_type=userType
-         this.modal_user_address=address
-         this.modal_responsible_checker=checkerName
-         this.modal_responsible_phone=checkerPhone
-         this.modal_base64_img="data:image/jpg;base64,"+res.data.result
-      })
-
-    },
-    //获取省市区列表
-    getPcd(val){
-      this.pcds = [{label:'全部',value:''}]
-      new HttpResetClass().load("POST", `/api/af-safecheck/sql/safe_singleTable_OrderBy`,
-        {data:{items:"*",tablename:"t_pcd",orderitem:"id",condition:`f_orgid in ${val}`}},
-        {resolveMsg: null, rejectMsg: null}).then((pcdlist)=>{
-        pcdlist.data.forEach((result)=>{
-          this.pcds.push({label:result.f_pcd,value:result.f_pcd})
-        })
-      })
-    },
-    getmeterbook(val){
-
-      //tag
-      this.cbc=[]
-      this.cbc.push({
-        label:'全部',
-        value:''
-      })
-      if (val==''){
-
-        this.cbcs.forEach(res=>{
-          this.cbc.push({
-            label:res.f_book_name,
-            value:res.id
-          })
-        })
-      }else{
-        this.cbcs.forEach(res=>{
-          if (res.f_book_slice_area==val){
-            this.cbc.push({
-              label:res.f_book_name,
-              value:res.id
-            })
-          }
-        })
-      }
-    },
-    Mreadibook(val){
-      ////tag
-      ////tag
-      if (val){
-        new HttpResetClass().load('POST',`/api/af-safecheck/sql/safe_singleTable_OrderBy`, {data: {
-            items: 'name',
-            tablename: 't_zone',
-            condition: `parentid  in ${val}`,
-            orderitem: 'id'
-          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-          this.sliceArea=[]
-          this.sliceArea.push({
-            label:'全部',
-            value:''
-          })
-          res.data.forEach(ress=>{
-            this.sliceArea.push({
-              label:ress.name,
-              value:ress.name
-            })
-          })
-
-        })
-      }
-    },
-    // 获取县域分公司内容
-    getfengongsi() {
-      let val = {
-        source: 'this.getParentByType($organization$).getSpecialResByType($organization$)',
-        userid: `${this.$login.f.id}`
-      }
-      let http = new HttpResetClass()
-      http.load('POST', '/rs/search', {data: val}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-        res.data.forEach((item) => {
-          this.orgstrs.push({label: item.name, value: item.id})
-        })
-        //tag
-      })
-    },
-    // 县域分公司发生改变
-    // orgstrchange(val){
-    //   if(val == undefined || val == ''){
-    //     return
-    //   }else {
-    //     this.checkersid = []
-    //     let gen = select(this,val)
-    //     return co(gen)
-    //   }
-    // },
-    getDefect(val) {
-      if (val) {
-        try {
-          var defect = JSON.parse(val)
-          return defect.result
-        } catch (e) {
-          //tag
-          return '正常'
-        }
-      }
-      return '正常'
-    },
-    checkerchange(val) {
-      this.checkboxModel.f_checker = val.name
-      this.checkboxModel.f_checker_id = val.id
-    },
-    search(args) {
-      if (this.SafeCheckXZ && (args.model.f_check_start == '' || args.model.f_check_end == '')) {
-        this.$showMessage('如果选择 已安检/未安检 选项，需要选择 安检起始时间！')
-        return
-      }
-      this.checkes = []
-      /*if (this.SafeCheckXZ == '未安检') {
-        args.condition += " and ( f_last_check_date >= '" + args.model.f_check_end + "' or  f_last_check_date <= '" + args.model.f_check_start + "' or f_last_check_date is null)"
-      } else {
-        if (args.model.f_check_start) {
-          args.condition += " and f_last_check_date >= '" + args.model.f_check_start + "'"
-        }
-        if (args.model.f_check_end) {
-          args.condition += " and f_last_check_date <= '" + args.model.f_check_end + "'"
-        }
-      }*/
-      //args.condition += " and f_filialeid in  " + (this.model.f_filialeids ? this.model.f_filialeids : `(${this.$login.f.orgid})`)
-      let con = ' f_filialeid in  ' + (this.model.f_filialeids ? this.model.f_filialeids : `(${this.$login.f.orgid}) `)
-      con += args.model.f_check_start ? ` and f_offsite_time >= '${args.model.f_check_start}'` : ''
-      con += args.model.f_check_end ? ` and f_offsite_time <= '${args.model.f_check_end}'` : ''
-      if (this.SafeCheckXZ == '未入户') {
-        con += ` and f_entry_status = '入户'`
-        args.condition += ' and ruhuid is null'
-      } else if (this.SafeCheckXZ == '已入户') {
-        con += ` and f_entry_status = '入户'`
-        args.condition += ' and ruhuid is not null'
-      }
-      // con += args.model.f_last_check_state ? ` and f_entry_status = '${args.model.f_last_check_state}'` : ''
-      con += args.model.f_checker_id ? ` and f_checker_name in ${args.model.f_checker_id}` : ''
-      let condition = {
-        condition1: args.condition,
-        condition2: con
-      }
-      //tag
-      this.searchData.condition = condition
-      return this.model.search(condition, args.model)
-    },
-    checkstatus() {
-      return this.$appdata.getParam('安检状态') ? [{
-        label: '全部',
-        value: ''
-      }, ...this.$appdata.getParam('安检状态')] : [{label: '全部', value: ''}]
-    },
-    usertypes() {
-      return this.$appdata.getParam('用气类型') ? [{
-        label: '全部',
-        value: ''
-      }, ...this.$appdata.getParam('用气类型')] : [{label: '全部', value: ''}]
-    },
-    userstates() {
-      return this.$appdata.getParam('用户状态') ? [{
-        label: '全部',
-        value: ''
-      }, ...this.$appdata.getParam('用户状态')] : [{label: '全部', value: ''}]
-    },
-    hiddenr() {
-      this.$parent.showItem = !this.$parent.showItem
-    },
-    hidden() {
-      this.criteriaShow = !this.criteriaShow
-    },
-    confirm() {
-      if (!this.checkboxModel.f_plan_name) {
-        this.$showMessage('请填写安检计划名称!')
-        return
-      }
-      // if(this.f_effective_start_time == ''){
-      //   this.$showMessage('请选择有效起始日期！')
-      //   return
-      // }
-      // if(this.f_effective_end_time == ''){
-      //   this.$showMessage('请选择有效结束日期！')
-      //   return
-      // }
-      if (this.IsShare == '否') {
-        if (!this.checkboxModel.f_checker_id) {
-          this.$showMessage('请选择安检员！')
-          return
-        }
-      }
-      let gen = saveGen(this)
-      return co(gen)
-    },
-    changeStates() {
-      if (this.checkedAll) {//实现反选/
-        this.checkrows = [];
-        for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
-          this.$set('$refs.paged.model.rows[' + i + '].checked', false)
-        }
-      } else {//实现全选
-        for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
-          this.$set('$refs.paged.model.rows[' + i + '].checked', true)
-        }
-        let _this = this
-        let condition = this.$refs.paged.$refs.criteria.condition
-        let url = this.model.url
-        this.$resetpost(`${url}?pageSize=9999999`, {
-          data: {
-            condition: condition,
-            groupitem: '',
-            orderitem: 'f_residential_area',
-            f_usertype: this.model.f_usertype,
-            f_filialeids: this.model.f_filialeids,
-            month: this.model.month,
-            safeCycle: this.model.safeCycle,
-            f_checktime_start: this.model.f_checktime_start,
-            f_checktime_end: this.model.f_checktime_end,
-            SafeCheckSX: this.model.SafeCheckSX,
-            f_last_check_state: this.model.f_last_check_state
-          },
-        }, {resolveMsg: null, rejectMsg: null}, -1).then(
-          (respanse) => {
-            if (respanse.data.length >= 5000) {
-              this.$showMessage("数据量太大，请重新选择")
-            } else {
-              _this.checkrows = []
-              for (let j = 0; j < respanse.data.length; j++) {
-                _this.checkrows.push(respanse.data[j])
-              }
-              //tag;
-            }
-          })
-      }
-    },
-    addChecked(item) {
-      //tag;
-      if (!item.checked) {
-        this.checkrows.push(item);
-        //tag;
-      } else {
-        for (let i = 0; i < this.checkrows.length; i++) {
-          if (item.f_userinfo_id == this.checkrows[i].f_userinfo_id) {
-            this.checkrows.splice(i, 1)
-          }
-        }
-      }
-    },
-    ToshowModal() {
-      this.creatPlanWay = 'single'
-      if (this.checkrows.length > 0) {
-        this.showModal = true
-      } else {
-        this.$showMessage("请选择需要安检的用户!")
-      }
-    },
-    FiltrationPlan() {
-      if (this.model.rows.length == 0) {
-        this.$showMessage("暂无可生成的计划！")
-        return
-      }
-      this.creatPlanWay = 'filtration'
-      this.showModal = true
-    },
-    AllPlan() {
-      if (this.model.rows.length == 0) {
-        this.$showMessage("暂无可生成的计划！")
-        return
-      }
-      this.creatPlanWay = 'all'
-      this.showModal = true
-    },
-    cancel() {
-      this.showModal = false
-    },
-    areas() {
-      let rs = []
-      for (let i = 0; i < this.$login.f.f_allArea.length; i++) {
-        let temp = {
-          label: this.$login.f.f_allArea[i].label,
-          value: this.$login.f.f_allArea[i].label
-        }
-        rs.push(temp)
-      }
-      return [{label: '全部', value: ''}, ...rs]
-    },
-    initAdjustables() {
-      //tag
-      let arr = []
-      let filter = this.$login.f.f_orgids
-      this.$GetSaleParam.getAdjustable(filter).forEach((item) => {
-        let temp = {}
-        temp.label = `[${item.value.f_adjustable_id}]-${item.label}`
-        temp.value = `${item.value.id}`
-        arr.push(temp)
-      })
-      this.adjustables = [{label: '全部', value: ''}, ...arr]
-    },
-    getAllGasproperties(){
-      this.gasproperties=[{
-        label:'全部',
-        value:''
-      }]
-        new HttpResetClass().load('POST',`/api/af-safecheck/sql/tel_singleTable_GroupBy`, {data: {
-            items: 'f_gasproperties',
-            tablename: 't_userfiles',
-            condition: `1=1`,
-            groupitem: 'f_gasproperties'
-          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-          res.data.forEach(ress=>{
-            this.gasproperties.push({
-              label:ress.f_gasproperties,
-              value:ress.f_gasproperties
-            })
-          })
-        })
-    },
-    // getAllOutlets(){
-    //   this.userareas=[{
-    //     label:'全部',
-    //     value:''
-    //   }]
-    //   new HttpResetClass().load('POST',`/api/af-safecheck/sql/tel_singleTable_GroupBy`, {data: {
-    //       items: 'f_outlets',
-    //       tablename: 't_user_address',
-    //       condition: `1=1`,
-    //       groupitem: 'f_outlets'
-    //     }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-    //     res.data.forEach(ress=>{
-    //       this.userareas.push({
-    //         label:ress.f_outlets,
-    //         value:ress.f_outlets
-    //       })
-    //     })
-    //   })
-    // },
-    getAllMeterBook(val){
-      ////tag
-      ////tag
-      this.cbcs=[]
-      if (val){
-        new HttpResetClass().load('POST',`/api/af-safecheck/sql/safe_singleTable_OrderBy`, {data: {
-            items: 'f_book_name,f_book_slice_area,id',
-            tablename: 't_meter_book',
-            condition: `f_filiale_id  in ${val}`,
-            orderitem: 'id'
-          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-          res.data.forEach(ress=>{
-            this.cbcs.push({
-              id:ress.id,
-              f_book_name:ress.f_book_name,
-              f_book_slice_area:ress.f_book_slice_area
-            })
-          })
-          this.cbc=[]
-          this.cbc.push({
-            label:'全部',
-            value:''
-          })
-          this.cbcs.forEach(res=>{
-            this.cbc.push({
-              label:res.f_book_name,
-              value:res.id
-            })
-          })
-        })
-      }
-    },
-    getRes(obj) {
-      this.model.f_filialeids = this.$login.convertToIn(obj.resids);
-      this.Mreadibook(this.model.f_filialeids)
-      this.getAllMeterBook(this.model.f_filialeids)
-      this.getPcd(this.model.f_filialeids)
-    }
-  },
-
-  watch: {
-    'model.f_usertype'(val) {
-      if (val == '民用') {
-        this.model.safeCycle = this.civil
-      } else if (val == '非民用') {
-        this.model.safeCycle = this.civilian
-      }
-    },
-    'model.SafeCheckXZ'(val) {
-      this.model.SafeCheckSC = ''
-      if (val == '已安检') {
-        this.model.SafeCheckCQ = ''
-        this.model.SafeCheckSX = {
-          f_check_end: '', // 安检时间  查询起始条件
-          f_check_start: ''// 安检时间  查询终止条件
-        }
-      } else {
-        // 当使用筛选条件时，清空不需要的条件选项
-        this.model.f_issue_start = ''
-        this.model.f_issue_end = ''
-        this.$refs.paged.$refs.criteria.model.f_check_start = ''
-        this.$refs.paged.$refs.criteria.model.f_check_end = ''
-        this.$refs.paged.$refs.criteria.model.f_last_check_state = ''
-        this.model.month = ''
-        if (val == '应安检') {
-          this.model.SafeCheckSC = '否'
-
-          this.model.f_issue_start = Util.toStartDateString()
-          this.model.f_issue_end = Util.toStandardDateString()
-        }
-        // this.model.f_checktime_start = ''
-        // this.model.f_checktime_end = ''
-      }
-    },
-    'model.SafeCheckSC'(val) {
-      if (val == '') {
-        this.model.f_issue_start = ''
-        this.model.f_issue_end = ''
-      }
-    },
-    // 'checker'(val){
-    //   //tag
-    //   if(val){
-    //     this.checkboxModel.f_checker = this.checker[0].name
-    //     this.checkboxModel.f_checker_id = this.checker[0].id
-    //   }
-    // },
-    'model.rows'() {
-      // if (!this.checkedAll) {//实现反选/
-      // this.checkrows = [];
-      for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
-        var k = false
-        for (let j = 0; j < this.checkrows.length; j++) {
-          if (this.$refs.paged.model.rows[i].f_userinfo_id == this.checkrows[j].f_userinfo_id) {
-            this.$set('$refs.paged.model.rows[' + i + '].checked', true)
-            k = true
-            continue
-          }
-        }
-        if (!k) {
-          this.$set('$refs.paged.model.rows[' + i + '].checked', false)
-        }
-      }
-      // } else {//实现全选
-      //   // this.checkboxModel = {};
-      //   for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
-      //     this.$set('$refs.paged.model.rows[' + i + '].checked', true)
-      //   }
-      // }
-    }
-  },
-  computed: {
-    selected() {
-      return this.$refs.paged.$refs.grid.selected
-    }
-  }
-}
-</script>
-<style scoped>
-.newcolor {
-  color: red;
-}
-
-.table th {
-  background-color: #f2f6fa;
-  color: black;
-}
-</style>
+<template>
+  <div class="flex">
+    <criteria-paged :model="model" v-ref:paged>
+      <criteria partial='criteria' @condition-changed='$parent.search' v-ref:criteria>
+        <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
+          <div class="row" v-show="!$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">用户编号</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_userinfo_code"
+                     id="f_userinfo_code"
+
+                     placeholder="用户编号" condition="f_userinfo_code like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">用户姓名</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_user_name" id="f_user_name"
+                     placeholder="用户姓名" condition="f_user_name like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">小&emsp;&emsp;区</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_residential_area"
+                     id="f_residential_area"
+                     placeholder="小区" condition="f_residential_area like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">地&emsp;&emsp;址</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_address" id="f_address"
+                     placeholder="地址" condition="f_address like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style" style="width: auto;margin-top:8px;float: right">
+              <export-excel :data="$parent.$parent.searchData"
+                                 :field="$parent.$parent.excelHeaders"
+                                 :choose-col="true"
+                                 sqlurl="api/af-safecheck/logic/exportfile" sql-name="根据安检员查询用户档案"
+                                 template-name='用户安检情况'></export-excel>
+              <button type="button" class="button_search button_spacing" @click="search()">查询</button>
+              <button type="button" class="button_search button_spacing" @click="$parent.$parent.blacklist()">拉黑</button>
+              <div style="float: right" class="button_spacing"
+                   :class="{'button_shrink_left':$parent.$parent.$parent.showItem,'button_shrink_right':!$parent.$parent.$parent.showItem}"
+                   @click="$parent.$parent.hiddenr()"></div>
+              <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 class="row" v-show="!$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">用气类型</label>
+              <v-select id="f_usertype"
+                        placeholder='用气类型'
+                        class="select select_list"
+                        :value.sync="model.f_gasproperties"
+                        :value-single="true"
+                        :options='$parent.$parent.gasproperties'
+                        v-model="model.f_gasproperties"
+                        condition="f_gasproperties = '{}'"
+                        close-on-select clear-button></v-select>
+            </div>
+            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
+
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body" style="color: red;">安检筛选</label>
+              <v-select
+                placeholder='安检筛选'
+                :value-single="true"
+                class="select select_list"
+                :value.sync="$parent.$parent.SafeCheckXZ"
+                :options='$parent.$parent.SafeCheckXZs'
+                v-model="$parent.$parent.SafeCheckXZ"
+                close-on-select clear-button></v-select>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">安检起始</label>
+              <datepicker
+                :value.sync="model.f_check_start"
+                placeholder='最后安检时间起始'
+                style="width: 60%"
+                :format="'yyyy-MM-dd 00:00:00'"
+                :show-rest-button="reset"
+                v-model="model.f_check_start">
+              </datepicker>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">安检结束</label>
+              <datepicker
+                :value.sync="model.f_check_end"
+                placeholder='最后安检时间结束'
+                style="width: 60%"
+                :format="'yyyy-MM-dd 23:59:59'"
+                :show-rest-button="reset"
+                v-model="model.f_check_end">
+              </datepicker>
+            </div>
+
+<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">安检状态</label>
+              <v-select id="f_entry"
+                        placeholder='安检状态'
+                        class="select select_list"
+                        :value.sync="model.f_last_check_state"
+                        :value-single="true"
+                        :options='$parent.$parent.checkstatus'
+                        v-model="model.f_last_check_state"
+                        condition="f_last_check_state = '{}'"
+                        close-on-select clear-button></v-select>
+            </div>-->
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">隐患情况</label>
+              <v-select
+                placeholder='隐患情况'
+                class="select select_list"
+                :value-single="true"
+                v-model='model.f_check_result'
+                :value.sync="model.f_check_result"
+                :options='$parent.$parent.f_check_results'
+                condition="f_last_check_result  like '%{}%'"
+                close-on-select clear-button></v-select>
+            </div>
+            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
+          </div>
+          <div class="row" v-show="!$parent.$parent.$parent.showItem">
+
+            <div class="col-sm-4 form-group" v-show="$parent.$parent.criteriaShow" style="margin: 0">
+              <role-selector-safe
+                role-name="安检员"
+                role-lable="安&nbsp;检&nbsp;员&nbsp;"
+                @re-res="$parent.$parent.getRes"
+                :value.sync="model.f_checker_id"
+                v-model="model.f_checker_id"
+                :value-multiple="true"
+                condition=" f_checker_name in {}">
+              </role-selector-safe>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+            <label class="font_normal_body">片&emsp;&emsp;区</label>
+            <v-select class="select_list select"
+                      placeholder='片区/管理站' style="width: 60%"
+                      :value.sync="model.f_slice_area" v-model="model.f_slice_area"
+                      :options='$parent.$parent.sliceArea'
+                      filer-key="name"
+                      close-on-select clear-button
+                      condition="f_slice_area='{}'"
+                      @change="$parent.$parent.getmeterbook(model.f_slice_area)"
+                      :value-single="true">
+            </v-select>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">抄&ensp;表&ensp;册</label>
+              <v-select class="select_list select"
+                        placeholder='抄表册' style="width: 60%"
+                        :value.sync="model.f_meter_book_num" v-model="model.f_meter_book_num"
+                        :options='$parent.$parent.cbc'
+                        filer-key="name"
+                        close-on-select clear-button
+                        condition="f_meter_book_num={}"
+                        :value-single="true">
+              </v-select>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">省&ensp;市&ensp;区</label>
+              <v-select class="select_list select"
+                        placeholder='请选择' style="width: 60%"
+                        :value.sync="model.f_pcd" v-model="model.f_pcd"
+                        :options='$parent.$parent.pcds'
+                        filer-key="name"
+                        close-on-select clear-button
+                        condition="f_pcd='{}'"
+                        :value-single="true">
+              </v-select>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">用户状态</label>
+              <v-select class="select_list select"
+                        placeholder='用户状态' style="width: 60%"
+                        :value.sync="model.f_user_state" v-model="model.f_user_state"
+                        :options='$parent.$parent.userstates'
+                        close-on-select clear-button
+                        condition="f_user_state = '{}'"
+                        :value-single="true">
+              </v-select>
+            </div>
+<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">-->
+<!--              <label class="font_normal_body">用户性质</label>-->
+<!--              <v-select class="select_list select"-->
+<!--                        placeholder='用户性质' style="width: 60%"-->
+<!--                        :value.sync="model.f_gasproperties" v-model="model.f_gasproperties"-->
+<!--                        :options='$parent.$parent.gasproperties'-->
+<!--                        close-on-select clear-button-->
+<!--                        condition="f_gasproperties = '{}'"-->
+<!--                        :value-single="true">-->
+<!--              </v-select>-->
+<!--            </div>-->
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">开户网点</label>
+              <v-select class="select_list select"
+                        placeholder='开户网点' style="width: 60%"
+                        :value.sync="model.f_outlets" v-model="model.f_outlets"
+                        :options='$parent.$parent.userareas'
+                        close-on-select clear-button
+                        condition=" f_khwd = '{}'"
+                        :value-single="true">
+              </v-select>
+            </div>
+          </div>
+
+          <div class="row" v-show="$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">用户编号</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_userinfo_code"
+
+                     placeholder="用户编号" condition="f_userinfo_code like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style">
+              <label class="font_normal_body">用户姓名</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_user_name"
+                     placeholder="用户姓名" condition="f_user_name like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style" style="width: auto;margin-top:8px;float: right">
+              <export-excel :data="$parent.$parent.searchData"
+                                 :field="$parent.$parent.excelHeaders"
+                                 sqlurl="api/af-safecheck/logic/exportfile" sql-name="根据安检员查询用户档案"
+                                 template-name='用户安检情况'></export-excel>
+              <button type="button" class="button_search button_spacing" @click="search()">查询</button>
+              <button type="button" class="button_search button_spacing" @click="$parent.$parent.blacklist()">拉黑</button>
+              <div style="float: right" class="button_spacing"
+                   :class="{'button_shrink_left':$parent.$parent.$parent.showItem,'button_shrink_right':!$parent.$parent.$parent.showItem}"
+                   @click="$parent.$parent.hiddenr()"></div>
+              <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 class="row" v-show="$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">小&emsp;&emsp;区</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_residential_area"
+
+                     placeholder="小区" condition="f_residential_area like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">地&emsp;&emsp;址</label>
+              <input style="width: 60%" type="text" class="input_search" v-model="model.f_address"
+
+                     placeholder="地址" condition="f_address like '%{}%'">
+            </div>
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">用气类型</label>
+              <v-select
+                placeholder='用气类型'
+                class="select select_list"
+
+                :value.sync="model.f_gasproperties"
+                :value-single="true"
+                :options='$parent.$parent.gasproperties'
+                v-model="model.f_gasproperties"
+                condition="f_gasproperties = '{}'"
+                close-on-select clear-button></v-select>
+            </div>
+            <!--            <div class="form-group col-sm-2" v-show="$parent.$parent.criteriaShow && !$parent.$parent.$parent.showItem"></div>-->
+
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body" style="color: red;">安检筛选</label>
+              <v-select
+                placeholder='安检筛选'
+                :value-single="true"
+
+                class="select select_list"
+                :value.sync="$parent.$parent.SafeCheckXZ"
+                :options='$parent.$parent.SafeCheckXZs'
+                v-model="$parent.$parent.SafeCheckXZ"
+                close-on-select clear-button></v-select>
+            </div>
+
+          </div>
+          <div class="row" v-show="$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">安检起始</label>
+              <datepicker
+                :value.sync="model.f_check_start"
+                placeholder='最后安检时间起始'
+                :disabled-days-of-week="[]"
+                style="width: 60%"
+                :format="'yyyy-MM-dd'"
+                :show-rest-button="reset"
+                v-model="model.f_check_start">
+              </datepicker>
+            </div>
+            <div :class="$parent.$parent.style" v-show="$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">
+              </datepicker>
+            </div>
+
+<!--            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">安检状态</label>
+              <v-select
+                placeholder='安检状态'
+                class="select select_list"
+
+                :value.sync="model.f_last_check_state"
+                :value-single="true"
+                :options='$parent.$parent.checkstatus'
+                v-model="model.f_last_check_state"
+                condition="f_last_check_state = '{}'"
+                close-on-select clear-button></v-select>
+            </div>-->
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">隐患情况</label>
+              <v-select
+                placeholder='隐患情况'
+                class="select select_list"
+                :value-single="true"
+                v-model='model.f_check_result'
+                :value.sync="model.f_check_result"
+                :options='$parent.$parent.f_check_results'
+                condition="f_last_check_result  like '%{}%'"
+                close-on-select clear-button></v-select>
+            </div>
+
+          </div>
+          <!--<div class="row" v-show="$parent.$parent.$parent.showItem">
+            <div :class="$parent.$parent.style" v-show="$parent.$parent.criteriaShow">
+              <label class="font_normal_body">公&emsp;&emsp;司</label>
+              <right-tree @re-res="$parent.$parent.getRes" :initresid="$parent.$parent.$login.f.orgid">
+              </right-tree>
+            </div>
+
+          </div>-->
+        </div>
+      </criteria>
+      <data-grid :model="model" partial="list" class="list_area table_sy" v-ref:grid>
+        <template partial='head'>
+          <tr>
+            <th><nobr><input type="checkbox" v-model="$parent.$parent.$parent.checkAll" @click.stop="()=>{return}" />全选</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 style="padding: 0 40px">
+              <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>
+          </tr>
+        </template>
+        <template partial='body'>
+          <td style="text-align: center;white-space:nowrap;"><input type="checkbox" @click="$event.cancelBubble=true" :checked="$parent.$parent.$parent.isChecked(row.f_userinfo_code)" @change="$parent.$parent.$parent.setCheckes(row.f_userinfo_code)"></input></td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_userinfo_code }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_user_name }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{ row.f_user_phone }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{row.f_meternumber}}</td>
+<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center;">{{row.f_meter_brand}}</td>-->
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_gasproperties }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_khwd }}</td>
+<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_safe_hasfurnace }}</td>-->
+<!--          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_safe_haskitchen }}</td>-->
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_residential_area }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_address }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_checker_name }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_last_check_date }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">{{ row.f_last_check_state }}</td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">
+            {{row.f_last_check_result1 }}
+          </td>
+          <td v-bind:class="{newcolor:row.code==1}" style="text-align: center">
+            <button class="button_spacing button_search-1" @click.stop='$parent.$parent.$parent.searchInfo(row.f_userinfo_code,row.f_address,row.f_user_type,row.f_address_detail,row.f_house_number)' >点击</button>
+          </td>
+        </template>
+      </data-grid>
+    </criteria-paged>
+    <modal :show.sync="dialogVisible" destroyOnClose={true} v-ref:modal v-if="dialogVisible">
+      <div slot="modal-header" class="modal-header">
+        <h4 class="modal-title" style="text-align: center">
+          二维码
+        </h4>
+      </div>
+      <div slot="modal-body" class="modal-body" >
+        <div id="aa" style="margin-left: 115px">
+          <div id="bb">
+            <style id="style1">
+              #bb {
+                width: 302px;
+                height: 170px;
+              }
+              #bb .img{
+                width: 40px;
+                height: 40px;
+              }
+              #bb .td1{
+                text-align: left;
+                white-space: nowrap;
+                font-size: 12px;
+                font-weight: 900;
+              }
+              #bb .td2{
+                text-align: right;
+                font-size: 10px;
+                font-weight: 900;
+              }
+              #bb .td3{
+                text-align: center;
+                font-weight: 900;
+              }
+              #bb .baseImg{
+                width: 120px;
+                height: 120px;
+                float: right;
+                overflow:hidden;
+              }
+              #bb .span{
+                white-space: nowrap;
+              }
+              #bb .td0{
+                text-align: left;
+                width: 60px;
+              }
+            </style>
+            <table>
+              <tr>
+                <td class="td0">
+                  <img class="img" src="../../../assets/wensu/1.jpg" alt="">
+                </td>
+                <td class="td0">
+                  <img class="img" src="../../../assets/wensu/2.jpg" alt="">
+                </td>
+                <td class="td3">
+                  <span class="span" style="font-size: 13px;font-weight: 900">温宿县曦隆燃气开发有限公司</span><br>
+                  <span class="span" style="font-weight: 900">天然气入户安全检查专用标签</span>
+                </td>
+              </tr>
+              <tr>
+                <td class="td1" colspan="2">用&nbsp;户&nbsp;类&nbsp;型&nbsp;:&nbsp;{{modal_user_type}}</td>
+                <td colspan="3" rowspan="6"><img class="baseImg" :src="modal_base64_img" alt="">
+              </tr>
+              <tr><td class="td1" colspan="3">片区负责人&nbsp;:&nbsp;{{modal_responsible_checker}}</td></tr>
+              <tr><td class="td1" colspan="3">联&nbsp;系&nbsp;电&nbsp;话&nbsp;:&nbsp;{{modal_responsible_phone}}</td></tr>
+              <tr><td class="td1" style="font-size: 13px" colspan="3">燃气客服电话&nbsp;:&nbsp;0997-6150333</td></tr>
+              <tr><td class="td1" style="font-size: 13px" colspan="3">燃气报警电话&nbsp;:&nbsp;0997-4533119</td></tr>
+              <tr><td class="td1" colspan="3">地址&nbsp;:&nbsp;{{modal_user_address}}</td></tr>
+              <tr><td class="td2" colspan="5">曦隆燃气&nbsp;&nbsp;&nbsp;&nbsp;情系万家</td></tr>
+            </table>
+          </div>
+        </div>
+      </div>
+      <div slot="modal-footer" class="modal-footer">
+        <print-element class="btn btn-success width-80" id="aa" styleid='style1' top='1' left='1' width='100%' height='100%' v-ref:printelement>打印</print-element>
+        <button type="button" class="btn btn-success width-80" @click="dialogVisible = false">确认</button>
+        <button type="button" class="btn btn-success width-80" @click="dialogVisible = false">取消</button>
+      </div>
+    </modal>
+    <modal :show.sync="showModal2" :backdrop="false">
+      <div slot="modal-header" class="modal-header">
+        <h4 class="modal-title">
+          批量拉黑
+        </h4>
+      </div>
+      <div slot="modal-body" class="modal-body">
+        <div v-if="true">
+          <div class="row" style="margin-top: 10px">
+            <label  class="control-label font text-left" style="float:left;margin-left:20%;margin-top:5px">拉黑备注</label>
+            <div class="col-xs-8 col-md-8">
+              <textarea style="width: 60%; height: 100px" v-model="f_remarks"></textarea>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div slot="modal-footer" class="modal-footer" style="text-align: center">
+        <button class="button_search" @click="blacklist">确认</button>
+        <button class="button_search" @click="showModal2=false">取消</button>
+      </div>
+    </modal>
+<!--    <modal :show.sync="showModal3">
+      <div slot="modal-header" class="modal-header">
+        <h4 class="modal-title">
+          转维修进度{{ progressbarWidth }}%
+        </h4>
+      </div>
+      <div slot="modal-body" class="modal-body">
+        <div class="progress">
+          <div class="progress-bar" role="progressbar" aria-valuenow="60"
+               aria-valuemin="0" aria-valuemax="100" :style="'width:'+ progressbarWidth+'%'">
+            &lt;!&ndash;          <span class="sr-only">40% 完成</span>&ndash;&gt;
+          </div>
+        </div>
+      </div>
+      <div slot="modal-footer" class="modal-footer" style="text-align: center" v-show="false"></div>
+    </modal>-->
+  </div>
+
+</template>
+
+<script>
+import {PagedList} from 'vue-client'
+import {HttpResetClass} from 'vue-client'
+import co from 'co'
+import * as Util from '../../Util'
+import Vue from 'vue'
+
+
+// let select = function * (self,userid) {
+//   let http = new HttpResetClass()
+//   let getGasman = yield http.load('POST','/rs/search', {
+//     source: 'this.getChildByName($安检员$).getUsers()',
+//     userid: userid
+//   }, {resolveMsg: null, rejectMsg: null})
+//   //tag
+//   getGasman.data.forEach((checker)=>{
+//     self.checkersid.push({label:checker.name,value:checker.id})
+//   })
+//   self.checkersid.push({label:'全部',value:''})
+// }
+
+
+export default {
+  title: '用户安检情况',
+  data() {
+    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 {
+      dialogVisible: false,
+      searchData: {
+        condition: '1=1',
+        orderitem: "f_userinfo_code",
+        timetype: "dd",
+        f_defect_content: "CASE WHEN CHARINDEX( '\"result\":\"正常\"', tp.f_defect_content ) > 0 THEN '正常' ELSE replace(replace(replace( replace( RIGHT ( tp.f_defect_content, len( tp.f_defect_content ) - 26 ), substring('{}',2,1), '' ), substring('{}',1,1), '' ),']',''),'\"','') END"
+      },
+      excelHeaders: {
+        //用户编号	用户名称	用户电话	安检次数	用气类型	小区名称	地址	安检日期	安检状态	安检结果
+
+        'f_userinfo_code': '用户编号',
+        'f_user_name': '用户名称',
+        'f_user_phone': '用户电话',
+        'f_meternumber': '用户表号',
+        'f_gasproperties': '用气类型',
+        'f_khwd': '开户网点',
+        'f_checker_name': '安检员',
+        'f_residential_area': '小区名称',
+        'f_address': '地址',
+        'f_last_check_date': '安检日期',
+        'f_last_check_state': '安检状态',
+        'f_last_check_result1': '安检结果'
+      },
+      model: new PagedList('api/af-safecheck/sql/根据安检员查询用户档案', 20, {
+        orderitem: "'f_last_check_date'",
+        timetype: "'dd'",
+        f_defect_content: 'this.f_defect_content'
+      }),
+      f_defect_content:"CASE WHEN CHARINDEX( '\"result\":\"正常\"', tp.f_defect_content ) > 0 THEN '无隐患' ELSE replace(replace(replace( replace( RIGHT ( tp.f_defect_content, len( tp.f_defect_content ) - 26 ), substring('{}',2,1), '' ), substring('{}',1,1), '' ),']',''),'\"','') END",
+      orgstrs: [{label: '全部', value: ''}],
+      checkersid: [],
+      gasproperties:[],
+      userareas:[{label: '全部', value: ''}, ...this.$appdata.getParam('开户网点')],
+      SafeCheckXZ: '',
+      civil: '',   //民用安检周期
+      civilian: '',      //非民用安检周期
+      SafeCheckXZs: [{label: '全部', value: ''}, {label: '已入户', value: '已入户'}, {label: '未入户', value: '未入户'}], // 安检筛选选项
+      SafeCheckSXs: [{label: '是', value: '是'}, {label: '否', value: '否'}, {label: '全部', value: ''}],
+      // user_states:[{label: '全部', value: ''}, ...this.$appdata.getParam('用户状态')],
+      IsShares: [{label: '是', value: '是'}, {label: '否', value: '否'}],
+      IsShare: '否',
+      checker: {},
+      NoBuys: [{label: '是', value: '是'}, {label: '否', value: '否'}],
+      criteriaShow: false,
+      checkers: [],
+      chosenOrg: {id: 0},
+      showModal: false,
+      checkedAll: false,
+      checkrows: [],
+      adjustables: [],
+      f_plan_year: year + '',
+      f_plan_month: moptions[new Date().getMonth()].value,
+      f_effective_start_time: '',  //计划有效起始时间
+      f_effective_end_time: '',    //计划有效结束时间
+      checkboxModel: {},
+      c_year_list: options,
+      c_month_list: moptions,
+      areas: this.areas(),
+      checkstatus: this.checkstatus(),
+      usertypes: this.usertypes(),
+      userstates: this.userstates(),
+      sqlname: '',
+      f_check_results: [{label: '全部', value: ''}, {label: '正常', value: '正常'}, {label: '有隐患', value: '有隐患'}],
+      creatPlanWay: '',
+      sliceArea: [],
+      cbcs:[],
+      cbc:[],
+      pcds:[],
+      modal_user_type:'',
+      modal_responsible_checker:'',
+      modal_responsible_phone:'',
+      modal_user_address:'',
+      modal_base64_img:'',
+      checkes: [],
+      checkAll: false,
+      showModal2:false,
+      showModal3:false,
+      f_remarks:'',
+      progressbarWidth:'0',
+    }
+  },
+  props: {
+    style: {
+      type: String,
+      default: 'col-sm-2 form-group'
+    },
+    style2: {
+      type: String,
+      default: 'col-sm-4 form-group'
+    },
+    checkplan: { // 传入一条安检计划信息
+      type: Object
+    },
+    additemshow: {
+      type: Boolean,
+      default: false
+    }
+  },
+  ready() {
+    // 获取分公司信息
+    this.model.f_defect_content=this.f_defect_content
+
+    //this.getfengongsi()
+    this.model.chosenOrg = {id: 0}
+    this.model.f_filialeids = this.$login.f.f_orgids
+    this.model.f_filiale = this.$login.f.f_fengongsi
+    this.model.f_OrgStr = this.$login.f.orgpathstr
+    this.Mreadibook(`('${this.$login.f.orgid}')`)
+    this.getAllMeterBook(`('${this.$login.f.orgid}')`)
+    this.getAllGasproperties()
+    this.$refs.paged.$refs.criteria.model.f_check_start = Util.toStartDateString() + ' 00:00:00'
+    this.$refs.paged.$refs.criteria.model.f_check_end = Util.toEndDateString() + ' 23:59:59'
+    // this.getAllOutlets()
+  },
+  methods: {
+    async blacklist(){
+      if(!this.checkAll && this.checkes.length==0){
+        Vue.showMessage("请先勾选你要拉黑的用户！")
+        return
+      }
+      this.$showMessage("确定需要将选中用户在营收系统进行拉黑吗？",['confirm', 'cancel']).then((res)=>{
+        if (res === 'confirm'){
+          //this.showModal3=true
+          let successCount=0
+          console.log('是否全选', this.checkAll)
+          console.log('当前选中用户', this.checkes)
+          console.log('this.model----', this.model)
+          new HttpResetClass().load('post','api/af-safecheck/logic/safe_getuser_to_blactlist', {
+            data:{
+              condition: this.model.condition.condition1,
+              condition2: this.model.condition.condition2,
+              switchCheckAll: true,
+              checkAll: this.checkAll,
+              param: this.checkes,
+              columnName: 'f_userinfo_code',
+              orderitem:' f_userinfo_code',
+              type:'update'
+            }
+          }).then((res)=>{
+            this.$showMessage("操作成功！本次选中用已标记为待拉黑状态，同步营收系统会存在延迟。")
+          }).catch((msg)=>{
+            this.$showMessage("网络异常请稍后再试！")
+          })
+
+        }
+      })
+
+      /*new HttpResetClass().load('post','API/Secheck/SetBlackList', {
+        data:{
+          id:'700002373',
+          bh:'1511080819',
+          black:true,
+          blackMemo:'测试拉黑！！！'
+        }
+      }).then(res=>{
+        if (result.data.code==200) {
+          successCount += result.data.successcon
+          this.progressbarWidth=Math.ceil((i+1)*100/(this.checkes.length))
+        }
+        console.log('拉黑返回结果----', res)
+      }).catch(err=>{
+        console.log('拉黑请求失败----', err)
+      })*/
+    },
+    isChecked (v) {
+      // 如果全选，不在的按选中算，否则，在的按选中算
+      if (this.checkAll) {
+        return this.checkes.indexOf(v) == -1
+      } else {
+        return this.checkes.indexOf(v) != -1
+      }
+    },
+    setCheckAll () {
+      this.checkAll = this.checkAll ? false : true
+      // 全选改变后，清空选中数据
+      this.checkes = []
+    },
+    setCheckes (id) {
+      let index = this.checkes.indexOf(id)
+      if (index < 0) {
+        this.checkes.push(id)
+      } else {
+        this.checkes.splice(index, 1)
+      }
+    },
+    //查询二维码
+     searchInfo(val,address,userType,checkerName,checkerPhone){
+      this.dialogVisible = true
+       new HttpResetClass().load('post','api/af-safecheck/logic/QrcodeUtil', {
+        data: {
+          id:val
+        }
+      }).then(res=>{
+         this.modal_user_type=userType
+         this.modal_user_address=address
+         this.modal_responsible_checker=checkerName
+         this.modal_responsible_phone=checkerPhone
+         this.modal_base64_img="data:image/jpg;base64,"+res.data.result
+      })
+
+    },
+    //获取省市区列表
+    getPcd(val){
+      this.pcds = [{label:'全部',value:''}]
+      new HttpResetClass().load("POST", `/api/af-safecheck/sql/safe_singleTable_OrderBy`,
+        {data:{items:"*",tablename:"t_pcd",orderitem:"id",condition:`f_orgid in ${val}`}},
+        {resolveMsg: null, rejectMsg: null}).then((pcdlist)=>{
+        pcdlist.data.forEach((result)=>{
+          this.pcds.push({label:result.f_pcd,value:result.f_pcd})
+        })
+      })
+    },
+    getmeterbook(val){
+
+      //tag
+      this.cbc=[]
+      this.cbc.push({
+        label:'全部',
+        value:''
+      })
+      if (val==''){
+
+        this.cbcs.forEach(res=>{
+          this.cbc.push({
+            label:res.f_book_name,
+            value:res.id
+          })
+        })
+      }else{
+        this.cbcs.forEach(res=>{
+          if (res.f_book_slice_area==val){
+            this.cbc.push({
+              label:res.f_book_name,
+              value:res.id
+            })
+          }
+        })
+      }
+    },
+    Mreadibook(val){
+      ////tag
+      ////tag
+      if (val){
+        new HttpResetClass().load('POST',`/api/af-safecheck/sql/safe_singleTable_OrderBy`, {data: {
+            items: 'name',
+            tablename: 't_zone',
+            condition: `parentid  in ${val}`,
+            orderitem: 'id'
+          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+          this.sliceArea=[]
+          this.sliceArea.push({
+            label:'全部',
+            value:''
+          })
+          res.data.forEach(ress=>{
+            this.sliceArea.push({
+              label:ress.name,
+              value:ress.name
+            })
+          })
+
+        })
+      }
+    },
+    // 获取县域分公司内容
+    getfengongsi() {
+      let val = {
+        source: 'this.getParentByType($organization$).getSpecialResByType($organization$)',
+        userid: `${this.$login.f.id}`
+      }
+      let http = new HttpResetClass()
+      http.load('POST', '/rs/search', {data: val}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+        res.data.forEach((item) => {
+          this.orgstrs.push({label: item.name, value: item.id})
+        })
+        //tag
+      })
+    },
+    // 县域分公司发生改变
+    // orgstrchange(val){
+    //   if(val == undefined || val == ''){
+    //     return
+    //   }else {
+    //     this.checkersid = []
+    //     let gen = select(this,val)
+    //     return co(gen)
+    //   }
+    // },
+    getDefect(val) {
+      if (val) {
+        try {
+          var defect = JSON.parse(val)
+          return defect.result
+        } catch (e) {
+          //tag
+          return '正常'
+        }
+      }
+      return '正常'
+    },
+    checkerchange(val) {
+      this.checkboxModel.f_checker = val.name
+      this.checkboxModel.f_checker_id = val.id
+    },
+    search(args) {
+      if (this.SafeCheckXZ && (args.model.f_check_start == '' || args.model.f_check_end == '')) {
+        this.$showMessage('如果选择 已安检/未安检 选项，需要选择 安检起始时间！')
+        return
+      }
+      this.checkes = []
+      /*if (this.SafeCheckXZ == '未安检') {
+        args.condition += " and ( f_last_check_date >= '" + args.model.f_check_end + "' or  f_last_check_date <= '" + args.model.f_check_start + "' or f_last_check_date is null)"
+      } else {
+        if (args.model.f_check_start) {
+          args.condition += " and f_last_check_date >= '" + args.model.f_check_start + "'"
+        }
+        if (args.model.f_check_end) {
+          args.condition += " and f_last_check_date <= '" + args.model.f_check_end + "'"
+        }
+      }*/
+      //args.condition += " and f_filialeid in  " + (this.model.f_filialeids ? this.model.f_filialeids : `(${this.$login.f.orgid})`)
+      let con = ' f_filialeid in  ' + (this.model.f_filialeids ? this.model.f_filialeids : `(${this.$login.f.orgid}) `)
+      con += args.model.f_check_start ? ` and f_offsite_time >= '${args.model.f_check_start}'` : ''
+      con += args.model.f_check_end ? ` and f_offsite_time <= '${args.model.f_check_end}'` : ''
+      if (this.SafeCheckXZ == '未入户') {
+        con += ` and f_entry_status = '入户'`
+        args.condition += ' and ruhuid is null'
+      } else if (this.SafeCheckXZ == '已入户') {
+        con += ` and f_entry_status = '入户'`
+        args.condition += ' and ruhuid is not null'
+      }
+      // con += args.model.f_last_check_state ? ` and f_entry_status = '${args.model.f_last_check_state}'` : ''
+      con += args.model.f_checker_id ? ` and f_checker_name in ${args.model.f_checker_id}` : ''
+      let condition = {
+        condition1: args.condition,
+        condition2: con
+      }
+      //tag
+      this.searchData.condition = condition
+      return this.model.search(condition, args.model)
+    },
+    checkstatus() {
+      return this.$appdata.getParam('安检状态') ? [{
+        label: '全部',
+        value: ''
+      }, ...this.$appdata.getParam('安检状态')] : [{label: '全部', value: ''}]
+    },
+    usertypes() {
+      return this.$appdata.getParam('用气类型') ? [{
+        label: '全部',
+        value: ''
+      }, ...this.$appdata.getParam('用气类型')] : [{label: '全部', value: ''}]
+    },
+    userstates() {
+      return this.$appdata.getParam('用户状态') ? [{
+        label: '全部',
+        value: ''
+      }, ...this.$appdata.getParam('用户状态')] : [{label: '全部', value: ''}]
+    },
+    hiddenr() {
+      this.$parent.showItem = !this.$parent.showItem
+    },
+    hidden() {
+      this.criteriaShow = !this.criteriaShow
+    },
+    confirm() {
+      if (!this.checkboxModel.f_plan_name) {
+        this.$showMessage('请填写安检计划名称!')
+        return
+      }
+      // if(this.f_effective_start_time == ''){
+      //   this.$showMessage('请选择有效起始日期！')
+      //   return
+      // }
+      // if(this.f_effective_end_time == ''){
+      //   this.$showMessage('请选择有效结束日期！')
+      //   return
+      // }
+      if (this.IsShare == '否') {
+        if (!this.checkboxModel.f_checker_id) {
+          this.$showMessage('请选择安检员！')
+          return
+        }
+      }
+      let gen = saveGen(this)
+      return co(gen)
+    },
+    changeStates() {
+      if (this.checkedAll) {//实现反选/
+        this.checkrows = [];
+        for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
+          this.$set('$refs.paged.model.rows[' + i + '].checked', false)
+        }
+      } else {//实现全选
+        for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
+          this.$set('$refs.paged.model.rows[' + i + '].checked', true)
+        }
+        let _this = this
+        let condition = this.$refs.paged.$refs.criteria.condition
+        let url = this.model.url
+        this.$resetpost(`${url}?pageSize=9999999`, {
+          data: {
+            condition: condition,
+            groupitem: '',
+            orderitem: 'f_residential_area',
+            f_usertype: this.model.f_usertype,
+            f_filialeids: this.model.f_filialeids,
+            month: this.model.month,
+            safeCycle: this.model.safeCycle,
+            f_checktime_start: this.model.f_checktime_start,
+            f_checktime_end: this.model.f_checktime_end,
+            SafeCheckSX: this.model.SafeCheckSX,
+            f_last_check_state: this.model.f_last_check_state
+          },
+        }, {resolveMsg: null, rejectMsg: null}, -1).then(
+          (respanse) => {
+            if (respanse.data.length >= 5000) {
+              this.$showMessage("数据量太大，请重新选择")
+            } else {
+              _this.checkrows = []
+              for (let j = 0; j < respanse.data.length; j++) {
+                _this.checkrows.push(respanse.data[j])
+              }
+              //tag;
+            }
+          })
+      }
+    },
+    addChecked(item) {
+      //tag;
+      if (!item.checked) {
+        this.checkrows.push(item);
+        //tag;
+      } else {
+        for (let i = 0; i < this.checkrows.length; i++) {
+          if (item.f_userinfo_id == this.checkrows[i].f_userinfo_id) {
+            this.checkrows.splice(i, 1)
+          }
+        }
+      }
+    },
+    ToshowModal() {
+      this.creatPlanWay = 'single'
+      if (this.checkrows.length > 0) {
+        this.showModal = true
+      } else {
+        this.$showMessage("请选择需要安检的用户!")
+      }
+    },
+    FiltrationPlan() {
+      if (this.model.rows.length == 0) {
+        this.$showMessage("暂无可生成的计划！")
+        return
+      }
+      this.creatPlanWay = 'filtration'
+      this.showModal = true
+    },
+    AllPlan() {
+      if (this.model.rows.length == 0) {
+        this.$showMessage("暂无可生成的计划！")
+        return
+      }
+      this.creatPlanWay = 'all'
+      this.showModal = true
+    },
+    cancel() {
+      this.showModal = false
+    },
+    areas() {
+      let rs = []
+      for (let i = 0; i < this.$login.f.f_allArea.length; i++) {
+        let temp = {
+          label: this.$login.f.f_allArea[i].label,
+          value: this.$login.f.f_allArea[i].label
+        }
+        rs.push(temp)
+      }
+      return [{label: '全部', value: ''}, ...rs]
+    },
+    initAdjustables() {
+      //tag
+      let arr = []
+      let filter = this.$login.f.f_orgids
+      this.$GetSaleParam.getAdjustable(filter).forEach((item) => {
+        let temp = {}
+        temp.label = `[${item.value.f_adjustable_id}]-${item.label}`
+        temp.value = `${item.value.id}`
+        arr.push(temp)
+      })
+      this.adjustables = [{label: '全部', value: ''}, ...arr]
+    },
+    getAllGasproperties(){
+      this.gasproperties=[{
+        label:'全部',
+        value:''
+      }]
+        new HttpResetClass().load('POST',`/api/af-safecheck/sql/tel_singleTable_GroupBy`, {data: {
+            items: 'f_gasproperties',
+            tablename: 't_userfiles',
+            condition: `1=1`,
+            groupitem: 'f_gasproperties'
+          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+          res.data.forEach(ress=>{
+            this.gasproperties.push({
+              label:ress.f_gasproperties,
+              value:ress.f_gasproperties
+            })
+          })
+        })
+    },
+    // getAllOutlets(){
+    //   this.userareas=[{
+    //     label:'全部',
+    //     value:''
+    //   }]
+    //   new HttpResetClass().load('POST',`/api/af-safecheck/sql/tel_singleTable_GroupBy`, {data: {
+    //       items: 'f_outlets',
+    //       tablename: 't_user_address',
+    //       condition: `1=1`,
+    //       groupitem: 'f_outlets'
+    //     }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+    //     res.data.forEach(ress=>{
+    //       this.userareas.push({
+    //         label:ress.f_outlets,
+    //         value:ress.f_outlets
+    //       })
+    //     })
+    //   })
+    // },
+    getAllMeterBook(val){
+      ////tag
+      ////tag
+      this.cbcs=[]
+      if (val){
+        new HttpResetClass().load('POST',`/api/af-safecheck/sql/safe_singleTable_OrderBy`, {data: {
+            items: 'f_book_name,f_book_slice_area,id',
+            tablename: 't_meter_book',
+            condition: `f_filiale_id  in ${val}`,
+            orderitem: 'id'
+          }}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+          res.data.forEach(ress=>{
+            this.cbcs.push({
+              id:ress.id,
+              f_book_name:ress.f_book_name,
+              f_book_slice_area:ress.f_book_slice_area
+            })
+          })
+          this.cbc=[]
+          this.cbc.push({
+            label:'全部',
+            value:''
+          })
+          this.cbcs.forEach(res=>{
+            this.cbc.push({
+              label:res.f_book_name,
+              value:res.id
+            })
+          })
+        })
+      }
+    },
+    getRes(obj) {
+      this.model.f_filialeids = this.$login.convertToIn(obj.resids);
+      this.Mreadibook(this.model.f_filialeids)
+      this.getAllMeterBook(this.model.f_filialeids)
+      this.getPcd(this.model.f_filialeids)
+    }
+  },
+
+  watch: {
+    'model.f_usertype'(val) {
+      if (val == '民用') {
+        this.model.safeCycle = this.civil
+      } else if (val == '非民用') {
+        this.model.safeCycle = this.civilian
+      }
+    },
+    'model.SafeCheckXZ'(val) {
+      this.model.SafeCheckSC = ''
+      if (val == '已安检') {
+        this.model.SafeCheckCQ = ''
+        this.model.SafeCheckSX = {
+          f_check_end: '', // 安检时间  查询起始条件
+          f_check_start: ''// 安检时间  查询终止条件
+        }
+      } else {
+        // 当使用筛选条件时，清空不需要的条件选项
+        this.model.f_issue_start = ''
+        this.model.f_issue_end = ''
+        this.$refs.paged.$refs.criteria.model.f_check_start = ''
+        this.$refs.paged.$refs.criteria.model.f_check_end = ''
+        this.$refs.paged.$refs.criteria.model.f_last_check_state = ''
+        this.model.month = ''
+        if (val == '应安检') {
+          this.model.SafeCheckSC = '否'
+
+          this.model.f_issue_start = Util.toStartDateString()
+          this.model.f_issue_end = Util.toStandardDateString()
+        }
+        // this.model.f_checktime_start = ''
+        // this.model.f_checktime_end = ''
+      }
+    },
+    'model.SafeCheckSC'(val) {
+      if (val == '') {
+        this.model.f_issue_start = ''
+        this.model.f_issue_end = ''
+      }
+    },
+    // 'checker'(val){
+    //   //tag
+    //   if(val){
+    //     this.checkboxModel.f_checker = this.checker[0].name
+    //     this.checkboxModel.f_checker_id = this.checker[0].id
+    //   }
+    // },
+    'model.rows'() {
+      // if (!this.checkedAll) {//实现反选/
+      // this.checkrows = [];
+      for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
+        var k = false
+        for (let j = 0; j < this.checkrows.length; j++) {
+          if (this.$refs.paged.model.rows[i].f_userinfo_id == this.checkrows[j].f_userinfo_id) {
+            this.$set('$refs.paged.model.rows[' + i + '].checked', true)
+            k = true
+            continue
+          }
+        }
+        if (!k) {
+          this.$set('$refs.paged.model.rows[' + i + '].checked', false)
+        }
+      }
+      // } else {//实现全选
+      //   // this.checkboxModel = {};
+      //   for (let i = 0; i < this.$refs.paged.model.rows.length; i++) {
+      //     this.$set('$refs.paged.model.rows[' + i + '].checked', true)
+      //   }
+      // }
+    }
+  },
+  computed: {
+    selected() {
+      return this.$refs.paged.$refs.grid.selected
+    }
+  }
+}
+</script>
+<style scoped>
+.newcolor {
+  color: red;
+}
+
+.table th {
+  background-color: #f2f6fa;
+  color: black;
+}
+</style>