vr-shopxo-source/application/admin/view/default/goods/spec.html

256 lines
17 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!-- 规格快捷操作 -->
<div class="spec-quick am-margin-bottom-lg">
<div>
<div class="am-alert am-alert-warning am-radius" data-am-alert>
<button type="button" class="am-close">&times;</button>
<p>快捷操作可以快速创建商品SKU大量节省SKU编辑时间快捷操作数据不影响SKU数据仅生成的时候重新覆盖SKU。</p>
</div>
<span class="business-operations-submit quick-spec-title-add">+快捷操作</span>
<span class="business-operations-submit am-margin-left-sm am-icon-gg quick-spec-created">生成规格</span>
</div>
<div class="goods-specifications business-form-group" {{if empty($data['spec_base'])}}style="display: none;"{{/if}}>
<table class="am-table am-table-bordered am-table-centered am-table-striped am-table-hover table-thead-beautify">
<thead>
<tr>
<th class="spec-quick-th-title">规格名</th>
<th class="spec-quick-th-value">规格值</th>
</tr>
</thead>
<tbody>
{{if !empty($data['spec_base'])}}
{{foreach $data.spec_base as $spec_base_key=>$spec_base}}
<tr>
<td class="am-text-middle">
<i class="am-close am-close-spin quick-title-remove">×</i>
<input type="text" value="{{$spec_base.title}}" name="spec_base_title_{{$spec_base_key}}" placeholder="规格名" />
</td>
<td class="spec-quick-td-value am-cf">
{{if !empty($spec_base['value'])}}
{{foreach $spec_base.value as $value}}
<div class="am-fl am-margin-xs value-item">
<input type="text" class="am-fl" name="spec_base_value_{{$spec_base_key}}[]" value="{{$value}}" placeholder="规格值" />
<i class="am-close quick-value-remove">×</i>
</div>
{{/foreach}}
{{/if}}
<div class="am-fl am-margin-xs value-item am-text-left"><span class="business-operations-submit quick-spec-value-add" data-index="{{$spec_base_key}}">+添加规格值</span>
</div>
</td>
</tr>
{{/foreach}}
{{/if}}
</tbody>
</table>
</div>
</div>
<!-- 规格常规操作 -->
<div>
<span class="business-operations-submit specifications-nav-title-add">+添加规格</span>
<span class="business-operations-submit am-margin-left-sm specifications-nav-set-all am-icon-cogs" data-am-modal="{target: '#spec-popup-all-operation'}"> 高级批量设置</span>
</div>
<div class="goods-specifications am-padding-top-sm">
<!-- 规格列表 -->
<div class="specifications-container am-scrollable-horizontal">
<table class="am-table am-table-bordered am-table-centered specifications-table am-margin-bottom-sm am-table-striped am-table-hover table-thead-beautify am-margin-bottom-0">
<thead class="title-nav">
<tr>
{{if !empty($specifications['type'])}}
{{foreach $specifications.type as $type_v}}
<th class="table-title table-title-{{$type_v.id}}">
<i class="am-close title-nav-remove" data-index="{{$type_v.id}}">×</i>
<input type="text" name="specifications_name_{{$type_v.id}}" placeholder="规格名" value="{{$type_v.name}}" data-validation-message="请填写规格名" required />
</th>
{{/foreach}}
{{/if}}
<th class="title-start">
<span>价格(元)</span>
<i class="am-icon-edit"></i>
</th>
<th>
<span>重量(kg)</span>
<i class="am-icon-edit"></i>
</th>
<th>
<span>规格编码</span>
<i class="am-icon-edit"></i>
</th>
<th>
<span>条形码</span>
<i class="am-icon-edit"></i>
</th>
<th>
<span>原价(元)</span>
<i class="am-icon-edit"></i>
</th>
<th class="extend-btn">扩展</th>
<th class="operation-btn">操作</th>
</tr>
</thead>
<tbody>
{{if empty($specifications['value'])}}
<tr class="line-0" data-line-tag=".line-0">
<td class="am-text-middle value-start">
<input type="text" name="specifications_price[]" placeholder="价格" class="am-radius" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的销售金额" required />
</td>
<td class="am-text-middle">
<input type="number" name="specifications_weight[]" placeholder="重量" class="am-radius" maxlength="80" min="0.00" max="100000000.00" step="0.01" data-validation-message="规格重量 0.00~100000000.00" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_coding[]" placeholder="编码" class="am-radius" maxlength="80" data-validation-message="规格编码最多80个字符" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_barcode[]" placeholder="条形码" class="am-radius" maxlength="80" data-validation-message="条形码最多80个字符" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_original_price[]" placeholder="原价" class="am-radius" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的原价" />
</td>
<td class="am-text-middle">
<input type="hidden" name="specifications_extends[]" value="" class="line-extend-input" />
<a href="javascript:;" class="am-text-xs am-text-secondary line-extend-btn">编辑</a>
</td>
<td class="am-text-middle">
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-sm line-move" data-type="top">上移</a>
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-sm line-move" data-type="bottom">下移</a>
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-xs line-copy">复制</a>
<a href="javascript:;" class="am-text-xs am-text-danger line-remove">移除</a>
</td>
</tr>
{{/if}}
{{if !empty($specifications['value'])}}
{{foreach $specifications.value as $line_k=>$line_v}}
<tr class="line-{{$line_k}} {{if $line_k gt 0}} line-not-first{{/if}}" data-line-tag=".line-{{$line_k}}">
{{foreach $line_v as $v}}
{{if isset($v['data_type'])}}
{{switch v.data_type}}
{{case spec}}
<td class="am-text-middle table-value table-value-{{$v.data.key}}">
<input type="text" name="specifications_value_{{$v.data.key}}[]" placeholder="规格值" value="{{$v.data.value}}" data-validation-message="请填写规格值" required />
</td>
{{/case}}
{{case base}}
<td class="am-text-middle value-start">
<input type="text" name="specifications_price[]" placeholder="价格" class="am-radius" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的销售金额" value="{{$v.data.price}}" required />
</td>
<td class="am-text-middle">
<input type="number" name="specifications_weight[]" placeholder="重量" class="am-radius" min="0.00" max="100000000.00" step="0.01" data-validation-message="规格重量 0.00~100000000.00" value="{{if $v['data']['weight'] gt 0}}{{$v.data.weight}}{{/if}}" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_coding[]" placeholder="编码" class="am-radius" maxlength="80" data-validation-message="规格编码最多80个字符" value="{{$v.data.coding}}" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_barcode[]" placeholder="条形码" class="am-radius" maxlength="80" data-validation-message="条形码最多80个字符" value="{{$v.data.barcode}}" />
</td>
<td class="am-text-middle">
<input type="text" name="specifications_original_price[]" placeholder="原价" class="am-radius" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的原价" value="{{if $v['data']['original_price'] gt 0}}{{$v.data.original_price}}{{/if}}" />
</td>
<td class="am-text-middle">
<input type="hidden" name="specifications_extends[]" value="{{$v.data.extends}}" class="line-extend-input" />
<a href="javascript:;" class="am-text-xs am-text-secondary line-extend-btn">编辑</a>
</td>
<td class="am-text-middle">
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-sm line-move" data-type="top">上移</a>
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-sm line-move" data-type="bottom">下移</a>
<a href="javascript:;" class="am-text-xs am-text-secondary am-margin-right-xs line-copy">复制</a>
<a href="javascript:;" class="am-text-xs am-text-danger line-remove">移除</a>
</td>
{{/case}}
{{/switch}}
{{/if}}
{{/foreach}}
</tr>
{{/foreach}}
{{/if}}
</tbody>
</table>
</div>
<div class="am-margin-top-sm">
<span class="business-operations-submit specifications-line-add">+添加一行</span>
</div>
<div class="spec-images-list">
<div class="am-alert am-radius">
规格名称与规格值保持一致,相同规格名称添加一次即可,重复添加则后面覆盖前面,顺序不影响前端展示效果。
<span class="business-operations-submit specifications-line-images-add">+添加规格图片</span>
<span class="business-operations-submit specifications-line-images-auto-add am-margin-left-sm am-icon-dot-circle-o"><input type="text" class="am-inline-block am-text-center am-margin-horizontal-xs am-radius" value="1" />列规格自动生成</span>
</div>
<ul class="spec-images-content">
{{if !empty($specifications['type'])}}
{{foreach $specifications.type as $type}}
{{if !empty($type['value'])}}
{{foreach $type.value as $spec_key=>$spec}}
{{if !empty($spec['images'])}}
<li class="spec-images-items spec-images-items-{{$type.id}}{{$spec_key}}">
<input type="text" name="spec_images_name[{{$type.id}}{{$spec_key}}]" placeholder="规格名称" class="am-radius t-c" data-validation-message="请填写规格名称" value="{{$spec.name}}" required >
<ul class="plug-file-upload-view spec-images-view-{{$type.id}}{{$spec_key}}" data-form-name="spec_images[{{$type.id}}{{$spec_key}}]" data-max-number="1" data-delete='0' data-dialog-type="images">
<li>
<input type="hidden" name="spec_images[{{$type.id}}{{$spec_key}}]" value="{{$spec.images_old}}" data-validation-message="请上传规格图片" required />
<img src="{{$spec.images}}" />
<i>×</i>
</li>
</ul>
<div class="plug-file-upload-submit" data-view-tag="ul.spec-images-view-{{$type.id}}{{$spec_key}}">+上传图片</div>
</li>
{{/if}}
{{/foreach}}
{{/if}}
{{/foreach}}
{{/if}}
</ul>
</div>
</div>
<!-- 所有规格批量操作弹层 -->
<div class="am-popup" id="spec-popup-all-operation">
<div class="am-popup-inner">
<div class="am-popup-hd">
<h4 class="am-popup-title">高级批量设置</h4>
<span data-am-modal-close class="am-close">&times;</span>
</div>
<div class="am-popup-bd">
<div class="am-alert am-alert-secondary spec-title-container"></div>
<div class="am-form-group">
<label class="block">销售价格</label>
<input type="text" placeholder="价格" class="am-radius popup_all_price" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的销售金额" />
</div>
<div class="am-form-group">
<label class="block">重量</label>
<input type="number" placeholder="重量" class="am-radius popup_all_weight" maxlength="80" min="0.00" max="100000000.00" step="0.01" data-validation-message="规格重量 0.00~100000000.00" />
</div>
<div class="am-form-group">
<label class="block">编码</label>
<input type="text" placeholder="编码" class="am-radius popup_all_coding" maxlength="80" data-validation-message="规格编码最多80个字符" />
</div>
<div class="am-form-group">
<label class="block">条形码</label>
<input type="text" placeholder="条形码" class="am-radius popup_all_barcode" maxlength="80" data-validation-message="条形码最多80个字符" />
</div>
<div class="am-form-group">
<label class="block">原价</label>
<input type="text" placeholder="原价" class="am-radius popup_all_original_price" pattern="^([0-9]{1}\d{0,6})(\.\d{1,2})?$" data-validation-message="请填写有效的原价" />
</div>
<div class="am-form-group am-form-group-refreshing am-text-center">
<button type="button" class="am-btn am-btn-warning am-radius am-btn-sm am-margin-right-lg" data-am-modal-close>取消</button>
<button type="button" class="am-btn am-btn-secondary am-radius am-btn-sm am-margin-left-lg">确认</button>
</div>
</div>
</div>
</div>
<!-- 单个规格批量操作弹层 -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="spec-modal-all-operation">
<div class="am-modal-dialog">
<div class="am-modal-hd">批量操作
<a href="javascript: void(0)" class="am-close" data-am-modal-close>&times;</a>
</div>
<div class="am-modal-bd">
<div class="am-input-group am-input-group-sm">
<input type="text" class="am-form-field" placeholder="批量设置的值" />
<span class="am-input-group-btn">
<button type="button" class="am-btn am-btn-default">确认</button>
</span>
</div>
</div>
</div>
</div>