<template lang="html">
  <div id="stand-work-list" class="flex bg-white p-10 datapanel">
    <div class="span">
      <criteria-paged :model="model" v-ref:paged >
        <criteria partial='criteria' v-ref:criteria  @condition-changed='$parent.search'>
          <div v-show="$parent.$parent.isdeal" novalidate class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row" width="100%">
              <div class="col-sm-3 form-group form-input-group" >
                <label class="control-label">材料名称</label>
                <input type="text" class="form-control"
                       v-model="model.f_material_name"
                       placeholder='材料名称'
                       condition="f_material_name like '{}%'">
              </div>
              <div  v-if="$parent.$parent.searchshow">
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">材料类型</label>
                  <input type="text" class="form-control"
                         v-model="model.f_material_type"
                         placeholder='材料类型'
                         condition="f_material_type = '{}'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">材料型号</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_model"
                         placeholder='材料型号'
                         condition="f_material_model like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">材料规格</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_specific"
                         placeholder='材料规格'
                         condition="f_material_specific like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">材料用途</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_purpose"
                         placeholder='材料用途'
                         condition="f_material_purpose like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">单价区间</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_price1"
                         placeholder='最低单价'
                         condition="f_material_price like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">至&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_purpose2"
                         placeholder='最高单价'
                         condition="f_material_price like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">实际数量</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_number"
                         placeholder='实际数量'
                         condition="f_material_number like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">总数量</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_totalnum"
                         placeholder='总数量'
                         condition="f_material_totalnum like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">生产厂家</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_material_manufactor"
                         placeholder='总数量'
                         condition="f_material_manufactor like '%{}%'"
                  >
                </div>
                <div class="col-sm-3 form-group form-input-group" >
                  <label class="control-label">供应商名称</label>
                  <input type="text" class="form-control fixed-width"
                         v-model="model.f_supplier_name"
                         placeholder='供应商名称'
                         condition="f_supplier_name like '%{}%'"
                  >
                </div>
<!--                <div class="col-sm-3 form-group form-input-group" >-->
<!--                  <label class="control-label">用户类型</label>-->
<!--                  <v-select-->
<!--                    placeholder='用户类型'-->
<!--                    :value.sync="model.f_user_type"-->
<!--                    v-model="model.f_user_type"-->
<!--                    :options='$parent.$parent.Gasusertype'-->
<!--                    close-on-select condition="f_user_type='{}'">-->
<!--                  </v-select>-->
<!--                </div>-->
              </div>

              <div class="col-sm-3 form-group">
                <label class="control-label"></label>
                <button class="btn btn-success width-100" @click="search()" v-el:cba>查询</button>
                <label class="control-label"></label>
                <button class="btn btn-default width-100" @click="$parent.$parent.clearmsg">清空</button>
                <label class="control-label"></label>
<!--                <button class="btn btn-success width-100" @click="$parent.$parent.SaveAsFile('meterlist')">导出</button>-->
              </div>
              <div v-show="!$parent.$parent.searchshow" @click="$parent.$parent.clickshow" style="position: relative;float: right;margin-right: 1%;">
                <img src="../../assets/shousuo.png"><span>展开</span>
              </div>
              <div v-show="$parent.$parent.searchshow" @click="$parent.$parent.clickshow" style="position: relative;float: right;margin-right: 1%;">
                <img src="../../assets/shangsheng.png"><span>收缩</span>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid  id='meterlist' partial='list' v-ref:grid :model="model">
          <template partial='head'>
            <tr>
              <th style="text-align:center"><nobr>材料名称</nobr></th>
              <th style="text-align:center"><nobr>材料类型</nobr></th>
              <th style="text-align:center"><nobr>材料型号</nobr></th>
              <th style="text-align:center"><nobr>材料规格</nobr></th>
              <th style="text-align:center;"><nobr>材料用途</nobr></th>
              <th style="text-align:center"><nobr>单价</nobr></th>
              <th style="text-align:center"><nobr>实际数量</nobr></th>
              <th style="text-align:center"><nobr>总数量</nobr></th>
              <th style="text-align:center"><nobr>生产厂家</nobr></th>
              <th style="text-align:center"><nobr>供应商名称</nobr></th>
            </tr>
          </template>
          <template partial='body'>
            <tr>
              <td style="text-align:center"><nobr>{{row.f_material_name}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_type}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_model}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_gasproperties2}}</nobr></td>
<!--              <td style="text-align:center" v-show="$parent.$parent.$parent.isdeal">-->
<!--                <nobr>-->
<!--                  <span @click="$parent.$parent.$parent.dealmsg(row)"><a>{{row.f_meternumber}}</a></span>-->
<!--                </nobr>-->
<!--              </td>-->
<!--              <td style="text-align:center;color:#3c763d" v-show="!$parent.$parent.$parent.isdeal"><nobr>-->
<!--                <span @click="$parent.$parent.$parent.dealmsg(row)"><a>{{row.f_meternumber}}</a></span>-->
<!--              </nobr></td>-->
              <td style="text-align:center"><nobr>{{row.f_material_specific}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_purpose}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_price}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_number}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_totalnum}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_material_manufactor}}</nobr></td>
              <td style="text-align:center"><nobr>{{row.f_supplier_name}}</nobr></td>
            </tr>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>
</template>
<script>
  import { PagedList } from 'vue-client'

  export default {
        title:'材料列表',
        name: "materialList",

    data(){
          //配置后台systemModule，sql
       return{
         model: new PagedList('rs/sql/singleTable_OrderBy', 50),
         row: null,
         searchshow: true,
         obj: {
           userid: this.$login.f.id,
           source: `tool.getFullTree(this.getRights().where(row.getType() == $organization$))`,
           res: this.$login.f.f_fengongsi,
           resids: this.$login.f.f_orgids
         },
         show: false,
         isdeal: true,
         f_signal_1: '',
         f_signal_2: '',
         str: '',
         f_batterylevel_1: 0,
         f_batterylevel_2: 0
       }
    },
    ready(){
      this.$refs.paged.$refs.criteria.model.f_start_date = Util.toStandardDateString() + ' 00:00:00'
      this.$refs.paged.$refs.criteria.model.f_end_date = Util.toStandardDateString() + ' 23:59:59'
      this.$refs.paged.$refs.criteria.search()
    },

    watch: {
      //
      // 'searchobj' (val) {
      //   if (this.searchobj != null) {
      //     this.$refs.paged.$refs.criteria.model.f_meternumber = this.searchobj.f_meternumber
      //     this.$refs.paged.$refs.criteria.search()
      //   }
      // }
    },
    methods:{
          //导出使用
      // SaveAsFile(str) {
      //   this.$showMessage('您是否需要导出本页数据？', ['confirm', 'cancel']).then((res) => {
      //     if (res === 'confirm') {
      //       let style = '<style>' +
      //         'td {border-width: 1px;padding: 2px;border-style: solid; border-color:black; border-collapse:collapse;} .tdright{text-align: right;}  .tdcenter{text-align: center;}</style>';
      //       let strHtml = style + document.getElementById(str).innerHTML;
      //       console.log(strHtml);
      //       let LODOP = getLodop();
      //       LODOP.PRINT_INIT('');
      //       LODOP.ADD_PRINT_TABLE(5, 5, '99%', '100%', strHtml);
      //       LODOP.SAVE_TO_FILE('表具管理.xls')
      //     }
      //   })
      // },
      clearmsg () {
        this.$refs.paged.$refs.criteria.model = {}
      },
      clickshow () {
        this.searchshow = !this.searchshow
      },
      dealmsg (val) {
        val.model = this.model.model
        this.$emit('deal-msg', val)
      },
      search (args) {
        this.obj.resids = this.obj.resids.replace(/\./g, '')
        args.condition = `${args.condition}`
        this.model.search(args.condition, args.model)
      },
      getRes (obj) {
        this.obj.res = obj.res
        this.obj.resids = obj.resids.replace(/\./g, '')
      }
    },
    computed: {
    }
    }

</script>

<style scoped>

</style>
