|  |  |  | 
|---|
|  |  |  | background-color: #f1f1f1; | 
|---|
|  |  |  | padding: 5px; | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | /*overflow: hidden;*/ | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /*header {*/ | 
|---|
|  |  |  | /*    position: absolute;*/ | 
|---|
|  |  |  | /*}*/ | 
|---|
|  |  |  | /*main {*/ | 
|---|
|  |  |  | /*    padding-top: 30px;*/ | 
|---|
|  |  |  | /*}*/ | 
|---|
|  |  |  | main { | 
|---|
|  |  |  | padding-bottom: 5px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 头部搜索栏 */ | 
|---|
|  |  |  | .search-box { | 
|---|
|  |  |  | 
|---|
|  |  |  | background-color: #eaeaea; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .box-tag-item-label { | 
|---|
|  |  |  | padding: 5px 10px; | 
|---|
|  |  |  | border-bottom: 1px solid #f6f6f6; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .box-tag-item-content { | 
|---|
|  |  |  | font-size: x-large; | 
|---|
|  |  |  | font-weight: bold; | 
|---|
|  |  |  | padding: 10px 0 0 20px; | 
|---|
|  |  |  | padding: 15px 0 0 20px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 商品标签 */ | 
|---|
|  |  |  | 
|---|
|  |  |  | .box-mat-item:hover { | 
|---|
|  |  |  | background-color: #eaeaea; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .box-mat-item-label { | 
|---|
|  |  |  | font-size: x-large; | 
|---|
|  |  |  | .box-mat-item-content { | 
|---|
|  |  |  | padding: 15px 0 0 20px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .box-mat-item-content-matnr { | 
|---|
|  |  |  | font-size: small; | 
|---|
|  |  |  | font-weight: bold; | 
|---|
|  |  |  | padding: 10px 0 0 20px; | 
|---|
|  |  |  | margin-bottom: 5px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .box-mat-item-content-maktx { | 
|---|
|  |  |  | font-size: large; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | </head> | 
|---|
|  |  |  | 
|---|
|  |  |  | var template = Handlebars.compile(tpl); | 
|---|
|  |  |  | var html = template(res); | 
|---|
|  |  |  | $('#main-contain').html(html); | 
|---|
|  |  |  | toTop(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | var tagId = parentId; | 
|---|
|  |  |  | showMat(tagId); | 
|---|
|  |  |  | 
|---|
|  |  |  | var template = Handlebars.compile(tpl); | 
|---|
|  |  |  | var html = template(res); | 
|---|
|  |  |  | $('#main-contain').html(html); | 
|---|
|  |  |  | toTop(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | $('#main-contain').html('<div style="text-align: center; margin-top: 15px"><span style="font-size: large">暂无商品</span></div>'); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function toTop() { | 
|---|
|  |  |  | window.scrollTo({ | 
|---|
|  |  |  | left: 0, | 
|---|
|  |  |  | top: 0, | 
|---|
|  |  |  | behavior: 'smooth' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <script type="text/template" id="tagTpl"> | 
|---|
|  |  |  | {{#each data}} | 
|---|
|  |  |  | <div class="box-tag-item"> | 
|---|
|  |  |  | <input name="tagId" type="hidden" value="{{this.id}}"> | 
|---|
|  |  |  | <div class="box-tag-item-label">{{this.name}}</div> | 
|---|
|  |  |  | <div class="box-tag-item-label"> | 
|---|
|  |  |  | <span class="layui-badge layui-badge-green pull-right">归类</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="box-tag-item-content">{{this.name}}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | {{/each}} | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | 
|---|
|  |  |  | {{#each data}} | 
|---|
|  |  |  | <div class="box-mat-item"> | 
|---|
|  |  |  | <input name="matnr" type="hidden" value="{{this.matnr}}"> | 
|---|
|  |  |  | <div class="box-mat-item-label">{{this.maktx}}</div> | 
|---|
|  |  |  | <div class="box-tag-item-label"> | 
|---|
|  |  |  | <span class="layui-badge layui-badge-blue pull-right">商品</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="box-mat-item-content"> | 
|---|
|  |  |  | <div class="box-mat-item-content-matnr">{{this.matnr}}</div> | 
|---|
|  |  |  | <div class="box-mat-item-content-maktx">{{this.maktx}}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | {{/each}} | 
|---|
|  |  |  | </script> | 
|---|