var tmpl=`
  <div>
    <slot name="header">
    <span>{{title}}</span>
    </slot>
    <el-row  :gutter="gutter" style="margin-top:5px;">
      <el-col  :xs="span" :sm="span" :md="span" :lg="span" :xl="span" v-for="item in datasrc">
          <el-card class="box-card" body-style="padding:3px" :style="styleFunc(item)" shadow="hover">
            <slot name="content" :item="item">slot name content placeholder</slot>
          </el-card>
      </el-col>
    </el-row>
     <gsb-pagerimage ref="pagerRef" @pageChange="pageChanged"></gsb-pagerimage>
  </div>
`
module.exports=
`{
   template:'${tmpl}',
   props:['datasrc',"cardminheight","title","gutter","margintop","xspan","noline"],
   data:function(){
     return {
       span:this.xspan?Number(this.xspan):6,
     };
   },
   mounted:function(){

   },
   methods:{
     rowclick:function(r){
       console.log(r);
       this.$emit("rowclick",r);
     },
     moreclick:function(id){
       this.$emit("moreclick",id);
     },
     styleFunc:function(item){
       return {
         "min-height":this.cardminheight,
         "border-radius":"8px",
         "border":"1px solid #eee",
         "margin-top":this.margintop,
         "text-align":"center",
         "padding":"1px"
       };
     },
     buildQuery(qobj){
       var rtn={};
       if(qobj){
         rtn.search=qobj;
         if(qobj.queryClick){
          this.$refs.pagerRef.pageInfo.currentPage=1;
          delete qobj.queryClick;
         }
       }else{
         this.$refs.searchForm.getModel().queryClick=false;
         rtn.search=this.$refs.searchForm.getModel();
       }
       rtn.pageInfo={pageSize:this.$refs.pagerRef.pageInfo.pageSize,pageNo:this.$refs.pagerRef.pageInfo.currentPage};
       delete this.$refs.searchForm.getModel().queryClick;
       return rtn;
     },
     pageChanged(ps,cp){
       if(this.isDataAuto){
           this.fetchData();
       }else{
          this.$emit("pagechanged",ps,cp,this.currentSearchObj);
       }
     },
     setpageTotal(total){
        this.$refs.pagerRef.pageInfo.total=total;
     },
     fetchData:function(qobj){
       if(!this.isLazy){
         var self=this;
         var methodName=this.listMethod?this.listMethod:"findAndCountAll";
         var url=this.getUrl(methodName);
         var qc=this.buildQuery(qobj);
         this.$root.showMask();
         this.$root.postReq(url,qc).then(d=>{
             this.data=d.data.rows;
             this.$refs.pagerRef.pageInfo.total=d.data.count;
             this.$root.hideMask();

         });
       }


     },
     fetchData2:function(qobj){
         var self=this;
         var methodName=this.listMethod?this.listMethod:"findAndCountAll";
         var url=this.getUrl(methodName);
         var qc=this.buildQuery(qobj);
         this.$root.showMask();
         this.$root.postReq(url,qc).then(d=>{
             this.data=d.data.rows;
             this.$refs.pagerRef.pageInfo.total=d.data.count;
             this.$root.hideMask();
         });
     },
   },
   vname:"gsb-flowlayout1"
}`
