lvdongyang
/
jh-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
jh-admin/app/shop/view/goods/guess_you_like.html

320 lines
23 KiB
HTML
Raw Blame History

{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="SHOP_CSS/guess_you_like.css"/>
{/block}
{block name="main"}
<div id="diyView" v-if="lazyLoad">
<div class="preview-wrap">
<div class="preview-restore-wrap">
<div class="div-wrap">
<div class='diy-view-wrap layui-form' :style="{ backgroundColor : global.pageBgColor }">
<div class="preview-head">
<tabbar :global="global"></tabbar>
</div>
<div class="preview-block">
<div class="preview-draggable">
<h3 class="goods-recommend-title" v-if="data.title">
<span>{{ data.title }}</span>
</h3>
<div class="goods-list row1-of2 style-2">
<div class="goods-item" v-for="(index) in [1,2,3,4]" :key="index">
<div class="goods-img">
<img :src="changeImgUrl('public/static/img/default_img/square.png')" />
</div>
<div class="info-wrap">
<div class="goods-name">商品名称</div>
<div class="pro-info">
<div class="discount-price">
<div class="price-wrap">
<span class="unit text-color">¥</span>
<span class="price text-color">{{ index * 100 }}</span>
<span class="unit text-color">.00</span>
</div>
<div class="delete-price">¥198</div>
<div class="sale">已售63件</div>
</div>
<template v-if="data.control">
<!-- 购物车图标 -->
<div v-if="data.style == 'icon-cart'" class="cart shopping-cart-btn iconfont icongouwuche" :style="{ color : data.textColor }"></div>
<!--加号图标 -->
<div v-else-if="data.style == 'icon-add'" class="cart plus-sign-btn iconfont iconjia2" :style="{ color : data.textColor }"></div>
<!-- 按钮 -->
<div v-else-if="data.style == 'button'" class="cart buy-btn" :style="{fontWeight: (data.fontWeight ? 'bold' : 'normal'), backgroundColor : data.bgColor, color : data.textColor,borderRadius : data.aroundRadius + 'px',padding : ('0 '+ data.padding + 'px') }">{{ data.text }}</div>
<!-- 自定义图标 -->
<div v-else-if="data.style == 'icon-diy'" class="icon-diy">
<iconfont :icon="data.iconDiy.icon" v-if="data.iconDiy.icon" :value="data.iconDiy.style ? data.iconDiy.style : ''"></iconfont>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
<div class="edit-attribute">
<div class="attr-wrap">
<div class="restore-wrap">
<div class="attr-title">
<span class="title">商品推荐</span>
<div class="tab-wrap">
<span class="active bg-color" data-type="content">内容</span>
<span data-type="style">样式</span>
</div>
</div>
<div class="edit-content-wrap">
<div class="layui-form-item">
<label class="layui-form-label sm">标题名称</label>
<div class="layui-input-block">
<input type="text" name="title" v-model="data.title" maxlength="15" placeholder="请输入标题" class="layui-input" autocomplete="off" lay-verify="required" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label sm">适用页面</label>
<div class="layui-input-block">
<div @click="addSupportPage('goods_detail')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('goods_detail') != -1 }" lay-skin="primary">
<span>商品详情</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
<div @click="addSupportPage('cart')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('cart') != -1 }" lay-skin="primary">
<span>购物车</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
<div @click="addSupportPage('collect')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('collect') != -1 }" lay-skin="primary">
<span>关注页面</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
<div @click="addSupportPage('pay')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('pay') != -1 }" lay-skin="primary">
<span>支付结果页</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
<div @click="addSupportPage('order_detail')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('order_detail') != -1 }" lay-skin="primary">
<span>订单详情</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
{if addon_is_exit('supermember')}
<div @click="addSupportPage('super_member')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('super_member') != -1 }" lay-skin="primary">
<span>超级会员卡</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
{/if}
{if addon_is_exit('divideticket')}
<div @click="addSupportPage('guafen')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('guafen') != -1 }" lay-skin="primary">
<span>好友瓜分券</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
{/if}
{if addon_is_exit('fenxiao')}
<div @click="addSupportPage('fenxiao_level')" class="layui-unselect layui-form-checkbox" :class="{ 'layui-form-checked' : data.supportPage.indexOf('fenxiao_level') != -1 }" lay-skin="primary">
<span>分销等级页</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
{/if}
</div>
</div>
<div class="word-aux diy-word-aux">控制猜你喜欢模块在页面中的显示与隐藏</div>
<div class="layui-form-item">
<label class="layui-form-label sm">数据来源</label>
<div class="layui-input-block">
<div @click="data.sources = 'sort'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.sources == 'sort') }">
<i class="layui-anim layui-icon">{{ data.sources == 'sort' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>按排序获取</div>
</div>
<div @click="data.sources = 'browse'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.sources == 'browse') }">
<i class="layui-anim layui-icon">{{ data.sources == 'browse' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>按最近浏览</div>
</div>
<div @click="data.sources = 'sale'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.sources == 'sale') }">
<i class="layui-anim layui-icon">{{ data.sources == 'sale' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>按销量获取</div>
</div>
<div @click="data.sources = 'diy'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.sources == 'diy') }">
<i class="layui-anim layui-icon">{{ data.sources == 'diy' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>手动设置</div>
</div>
</div>
<div class="word-aux diy-word-aux js-sources-tips"></div>
</div>
<div class="layui-form-item js-diy-select-goods" v-if="data.sources == 'diy'">
<label class="layui-form-label sm">手动选择</label>
<div class="layui-input-block">
<div class="selected-style">
<span @click="addGoods()" :class="{ 'text-color' : data.goodsIds.length > 0 }">{{ data.goodsIds.length > 0 ? '已选' + data.goodsIds.length + '个' : '选择商品' }}</span>
<i class="iconfont iconyoujiantou"></i>
</div>
</div>
</div>
<div class="template-edit-title">
<h3>购买按钮</h3>
<div class="layui-form-item">
<label class="layui-form-label sm">是否显示</label>
<div class="layui-input-block">
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" @click="data.control = !data.control" :class="{ 'layui-form-checked' : data.control }">
<span>{{ data.control ? '显示' : '隐藏' }}</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
</div>
</div>
<template v-if="data.control">
<div class="layui-form-item">
<label class="layui-form-label sm">购物车事件</label>
<div class="layui-input-block">
<div @click="data.cartEvent='detail'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.cartEvent=='detail') }">
<i class="layui-anim layui-icon">{{ data.cartEvent=='detail' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>跳转商品详情</div>
</div>
<div @click="data.cartEvent='cart'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.cartEvent=='cart') }">
<i class="layui-anim layui-icon">{{ data.cartEvent=='cart' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>加入购物车</div>
</div>
</div>
<p class="word-aux" style="margin-left: 100px;" v-if="data.cartEvent=='cart'">只有实物商品才能加入购物车，虚拟商品会跳转到商品详情</p>
</div>
<div class="layui-form-item btn-style">
<label class="layui-form-label sm">样式</label>
<div class="layui-input-block">
<div class="item" :class="{ 'border-color' : data.style == 'button' }" @click="data.style = 'button';data.textColor= data.textColor == '#FF6A00' ? '#FFFFFF' : data.textColor">
<span class="buy-btn bg-color">按钮</span>
</div>
<div class="item" :class="{ 'border-color' : data.style == 'icon-cart' }" @click="data.style = 'icon-cart';data.textColor= data.textColor == '#FFFFFF' ? '#FF6A00' : data.textColor">
<span class="shopping-cart-btn iconfont icongouwuche text-color border-color"></span>
</div>
<div class="item" :class="{ 'border-color' : data.style == 'icon-add' }" @click="data.style = 'icon-add';data.textColor= data.textColor == '#FFFFFF' ? '#FF6A00' : data.textColor">
<span class="plus-sign-btn iconfont iconjia2 text-color border-color"></span>
</div>
<div class="item" :class="{ 'border-color' : data.style == 'icon-diy' }" @click="data.style = 'icon-diy';data.textColor= data.textColor == '#FFFFFF' ? '#FF6A00' : data.textColor">
<span class="diy-btn text-color border-color">自定义</span>
</div>
</div>
<div class="layui-input-block diy-icon" v-show="data.style == 'icon-diy'">
<img-icon-upload :data="{data : data.iconDiy, displayType : 'icon'}"></img-icon-upload>
<div class="action-box">
<div class="action" @click="iconStyle($event)"><i class="iconfont iconpifu"></i></div>
<div class="action" id="goods-list-color"><i class="iconfont iconyanse"></i></div>
</div>
</div>
</div>
<div class="layui-form-item" v-show="data.style == 'button'">
<label class="layui-form-label sm">文字</label>
<div class="layui-input-block">
<input type="text" v-model="data.text" maxlength="6" placeholder="请输入按钮文字" class="layui-input">
</div>
</div>
</template>
</div>
</div>
<div class="edit-style-wrap" style="display: none;">
<div class="template-edit-title">
<h3>购买按钮</h3>
<template v-if="data.style == 'button'">
<div class="layui-form-item">
<label class="layui-form-label sm">是否加粗</label>
<div class="layui-input-block">
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" @click="data.fontWeight = !data.fontWeight" :class="{ 'layui-form-checked' : data.fontWeight }">
<span>{{ data.fontWeight ? '加粗' : '常规' }}</span>
<i class="layui-icon layui-icon-ok"></i>
</div>
</div>
</div>
<slide :data="{ field : 'padding', label : '按钮边距', min: 0, max : 20 }"></slide>
<slide :data="{ field : 'aroundRadius', label: '圆角', min:0, max: 50 }"></slide>
</template>
<div class="layui-form-item">
<label class="layui-form-label sm">色调</label>
<div class="layui-input-block">
<div @click="data.theme='default'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.theme == 'default') }">
<i class="layui-anim layui-icon">{{ data.theme == 'default' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>跟随主题风格</div>
</div>
<div @click="data.theme='diy'" :class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (data.theme == 'diy') }">
<i class="layui-anim layui-icon">{{ data.theme == 'diy' ? "&#xe643;" : "&#xe63f;" }}</i>
<div>自定义</div>
</div>
</div>
</div>
<template v-if="data.theme == 'diy'">
<color v-if="data.style == 'button'" :data="{ field : 'bgColor', 'label' : '背景颜色', defaultColor : '#FF6A00' }"></color>
<color :data="{ field : 'textColor', 'label' : '文字颜色', defaultColor : '#FFFFFF' }"></color>
</template>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="custom-save js-bottom-custom-save">
<button class="layui-btn save">保存</button>
</div>
</div>
<input id="guessYouLikeConfig" type="hidden" value="{$config|json_encode}">
{/block}
{block name="script"}
<script>
var storeIsExit = '{$store_is_exit}';
</script>
<script src="STATIC_JS/vue.js"></script>
<script src="STATIC_EXT/colorPicker/js/colorpicker.js"></script>
<script src="STATIC_EXT/diyview/js/components.js"></script>
<script src="SHOP_JS/guess_you_like.js"></script>
{include file="app/shop/view/diy/iconfont_component.html"/}
{/block}
Reference in New Issue View Git Blame Copy Permalink