62 lines
2.8 KiB
HTML
62 lines
2.8 KiB
HTML
{extend name="base"/}
|
|
{block name="resources"}
|
|
<link rel="stylesheet" href="STATIC_EXT/colorPicker/css/colorpicker.css" />
|
|
<link rel="stylesheet" href="STATIC_EXT/diyview/css/diyview.css" />
|
|
<link rel="stylesheet" href="STATIC_EXT/diyview/css/bottom_nav_design.css" />
|
|
{/block}
|
|
{block name="main"}
|
|
<div id="bottomNav" class="layui-form">
|
|
|
|
<div class="preview">
|
|
|
|
<div class="preview-head">
|
|
<span>底部导航</span>
|
|
</div>
|
|
|
|
<div class="preview-block">
|
|
<ul v-show="data.list.length>0" :style="{ backgroundColor : data.backgroundColor }">
|
|
<li v-for="(item,index) in data.list" @mouseover="mouseOver(index)" @mouseout="mouseOut()" :key="item.id">
|
|
<div v-show="data.type == 1 || data.type == 2">
|
|
<template v-if="selected == index">
|
|
<img v-if="item.selected_icon_type == 'img'" :src="(selected == index ? (item.selectedIconPath? changeImgUrl(item.selectedIconPath) : changeImgUrl('public/static/img/default_img/square.png')) : (item.iconPath? changeImgUrl(item.iconPath) : changeImgUrl('public/static/img/default_img/square.png')) )"/>
|
|
<iconfont v-else :icon="selected == index ? item.selectedIconPath : item.iconPath" :value="selected == index ? (item.selected_style ? item.selected_style : null) :(item.style ? item.style : null)"></iconfont>
|
|
</template>
|
|
<template v-else>
|
|
<img v-if="item.icon_type == 'img'" :src="(selected == index ? (item.selectedIconPath? changeImgUrl(item.selectedIconPath) : changeImgUrl('public/static/img/default_img/square.png')) : (item.iconPath? changeImgUrl(item.iconPath) : changeImgUrl('public/static/img/default_img/square.png')) )"/>
|
|
<iconfont v-else :icon="selected == index ? item.selectedIconPath : item.iconPath" :value="selected == index ? (item.selected_style ? item.selected_style : null) :(item.style ? item.style : null)"></iconfont>
|
|
</template>
|
|
</div>
|
|
<span :style="{ fontSize : ( data.fontSize + 'px'), color : (selected == index ? data.textHoverColor : data.textColor ) }" v-show="data.type == 1 || data.type == 3">{{ item.text }}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="custom-save">
|
|
<button class="layui-btn save">保存</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="edit-attribute">
|
|
<bottom-menu></bottom-menu>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{if condition="$bottom_nav_info"}
|
|
<input type="hidden" id="info" value='{:json_encode($bottom_nav_info)}' />
|
|
{/if}
|
|
{/block}
|
|
{block name="script"}
|
|
<script>
|
|
{if condition="$bottom_nav_info"}
|
|
var bottomNavInfo = JSON.parse($("#info").val().toString());
|
|
{else/}
|
|
var bottomNavInfo = null;
|
|
{/if}
|
|
</script>
|
|
<script src="STATIC_JS/vue.js"></script>
|
|
{include file="diy/iconfont_component"/}
|
|
<script src="STATIC_EXT/colorPicker/js/colorpicker.js"></script>
|
|
<script src="STATIC_EXT/diyview/js/ddsort.js"></script>
|
|
<script src="STATIC_EXT/diyview/js/components.js"></script>
|
|
<script src="STATIC_EXT/diyview/js/shop_bottom_nav.js"></script>
|
|
{/block} |