Skip to content

S
shop_mobile_uni
Commit e0e5420a authored by 王建威's avatar 王建威
Browse files
Options

首页改版

parent 47c4c159
Hide whitespace changes
Inline Side-by-side
Showing with 1214 additions and 9 deletions
.DS_Store
View file @ e0e5420a
No preview for this file type
components/uni-countdown/uni-countdown.vue 0 → 100755
View file @ e0e5420a
<template>
<view class="uni-countdown">
<text v-if="showDay" :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }" class="uni-countdown__number">{{ d }}</text>
<text v-if="showDay" :style="{ color: splitorColor }" class="uni-countdown__splitor">天</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }" class="uni-countdown__number">{{ h }}</text>
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? ':' : '时' }}</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }" class="uni-countdown__number">{{ i }}</text>
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? ':' : '分' }}</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }" class="uni-countdown__number">{{ s }}</text>
<text v-if="!showColon" :style="{ color: splitorColor }" class="uni-countdown__splitor">秒</text>
</view>
</template>
<script>
/**
* Countdown 倒计时
* @description 倒计时组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=25
* @property {String} backgroundColor 背景色
* @property {String} color 文字颜色
* @property {Number} day 天数
* @property {Number} hour 小时
* @property {Number} minute 分钟
* @property {Number} second 秒
* @property {Boolean} showDay = [true|false] 是否显示天数
* @property {Boolean} showColon = [true|false] 是否以冒号为分隔符
* @property {String} splitorColor 分割符号颜色
* @event {Function} timeup 倒计时时间到触发事件
* @example <uni-countdown :day="1" :hour="1" :minute="12" :second="40"></uni-countdown>
*/
export default {
name: 'UniCountdown',
props: {
showDay: {
type: Boolean,
default: true
},
showColon: {
type: Boolean,
default: true
},
backgroundColor: {
type: String,
default: '#FFFFFF'
},
borderColor: {
type: String,
default: '#000000'
},
color: {
type: String,
default: '#000000'
},
splitorColor: {
type: String,
default: '#000000'
},
day: {
type: Number,
default: 0
},
hour: {
type: Number,
default: 0
},
minute: {
type: Number,
default: 0
},
second: {
type: Number,
default: 0
}
},
data() {
return {
timer: null,
syncFlag: false,
d: '00',
h: '00',
i: '00',
s: '00',
leftTime: 0,
seconds: 0
}
},
watch: {
day(val) {
this.changeFlag()
},
hour(val) {
this.changeFlag()
},
minute(val) {
this.changeFlag()
},
second(val) {
this.changeFlag()
}
},
created: function(e) {
this.startData();
},
beforeDestroy() {
clearInterval(this.timer)
},
methods: {
toSeconds(day, hours, minutes, seconds) {
return day * 60 * 60 * 24 + hours * 60 * 60 + minutes * 60 + seconds
},
timeUp() {
clearInterval(this.timer)
this.$emit('timeup')
},
countDown() {
let seconds = this.seconds
let [day, hour, minute, second] = [0, 0, 0, 0]
if (seconds > 0) {
day = Math.floor(seconds / (60 * 60 * 24))
hour = Math.floor(seconds / (60 * 60)) - (day * 24)
minute = Math.floor(seconds / 60) - (day * 24 * 60) - (hour * 60)
second = Math.floor(seconds) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60)
} else {
this.timeUp()
}
if (day < 10) {
day = '0' + day
}
if (hour < 10) {
hour = '0' + hour
}
if (minute < 10) {
minute = '0' + minute
}
if (second < 10) {
second = '0' + second
}
this.d = day
this.h = hour
this.i = minute
this.s = second
},
startData() {
this.seconds = this.toSeconds(this.day, this.hour, this.minute, this.second)
console.log(this.seconds)
if (this.seconds <= 0) {
return
}
this.countDown()
this.timer = setInterval(() => {
this.seconds--
if (this.seconds < 0) {
this.timeUp()
return
}
this.countDown()
}, 1000)
},
changeFlag() {
if (!this.syncFlag) {
this.seconds = this.toSeconds(this.day, this.hour, this.minute, this.second)
this.startData();
this.syncFlag = true;
}
}
}
}
</script>
<style scoped>
.uni-countdown {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: flex-start;
padding: 2rpx 0;
}
.uni-countdown__splitor {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
line-height: 48rpx;
padding: 5rpx;
font-size: 24rpx;
}
.uni-countdown__number {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
width: 52rpx;
height: 48rpx;
line-height: 48rpx;
margin: 5rpx;
text-align: center;
font-size: 24rpx;
}
</style>
\ No newline at end of file
main.js
View file @ e0e5420a
import Vue from 'vue' import Vue from 'vue'
import App from './App' import App from './App'
import { php } from './common/host.js'; import store from './store/store.js';
import { php, gp } from './common/host.js';
Vue.config.productionTip = false Vue.config.productionTip = false
...@@ -39,8 +40,31 @@ function addCart(spec_id, quantity, isLogin) { ...@@ -39,8 +40,31 @@ function addCart(spec_id, quantity, isLogin) {
}); });
} }
}) })
} }
// 跳转商品详情页,只传一个商品ID,方便以后全局修改
function jumpGoodDetail(goods_id) {
window.location.href = `${php}app=goods&id=${goods_id}`;
}
// 跳转外部链接,使用webview
function jump(url) {
// #ifdef H5
window.location.href = url;
// #endif
// #ifndef H5
const link = url
store.dispatch('changeWebviewUrl',link)
uni.redirectTo({
url: `/pages/web/web`,
});
// #endif
}
Vue.prototype.$jumpGoodDetail = jumpGoodDetail;
Vue.prototype.$jump = jump;
Vue.prototype.$addCart = addCart; Vue.prototype.$addCart = addCart;
Vue.prototype.$noGoodsImg = 'https://dbc-static.oss-cn-beijing.aliyuncs.com/credit/shangpinmorentu%402x.png'; Vue.prototype.$noGoodsImg = 'https://dbc-static.oss-cn-beijing.aliyuncs.com/credit/shangpinmorentu%402x.png';
Vue.prototype.$defaultPortrait = 'https://dbc-static.oss-cn-beijing.aliyuncs.com/credit/default_user_portrait.gif'; Vue.prototype.$defaultPortrait = 'https://dbc-static.oss-cn-beijing.aliyuncs.com/credit/default_user_portrait.gif';
...@@ -49,6 +73,7 @@ Vue.prototype.$defaultClassImg = 'https://dbc-static.oss-cn-beijing.aliyuncs.com ...@@ -49,6 +73,7 @@ Vue.prototype.$defaultClassImg = 'https://dbc-static.oss-cn-beijing.aliyuncs.com
App.mpType = 'app' App.mpType = 'app'
const app = new Vue({ const app = new Vue({
...App ...App,
store
}) })
app.$mount() app.$mount()
manifest.json
View file @ e0e5420a
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
"disableHostCheck": true, "disableHostCheck": true,
"proxy": { "proxy": {
"/uni/api": { "/uni/api": {
"target": "http://39.96.85.45:9093/", "target": "http://192.168.50.133:6564/",
"changeOrigin": true, "changeOrigin": true,
"secure": false, "secure": false,
"pathRewrite": { "pathRewrite": {
......
pages.json
View file @ e0e5420a
...@@ -6,6 +6,9 @@ ...@@ -6,6 +6,9 @@
"navigationBarTitleText": "白条专区" "navigationBarTitleText": "白条专区"
} }
}, },
{
"path": "pages/home/home"
},
{ {
"path": "pages/category/category", "path": "pages/category/category",
"style": { "style": {
......
pages/category/Category.vue
View file @ e0e5420a
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
</view> </view>
<view class="goods_box" v-if="goods_list instanceof Array"> <view class="goods_box" v-if="goods_list instanceof Array">
<view class="goods_item" v-for="(item, index) in goods_list" :key="index"> <view class="goods_item" v-for="(item, index) in goods_list" :key="index">
<image :src="item.default_image || $noGoodsImg" @click="jumpPhpPage(`app=goods&id=${item.goods_id}`)"></image> <image :src="item.default_image || $noGoodsImg" @click="$jumpPhpPage(item.goods_id)"></image>
<view class="goods_item_info"> <view class="goods_item_info">
<p>{{item.goods_name}}</p> <p>{{item.goods_name}}</p>
<p>{{item.goods_subname}}</p> <p>{{item.goods_subname}}</p>
......
pages/detail/Detail.vue
View file @ e0e5420a
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
</view> </view>
<view class="goods_box" v-if="goods_list instanceof Array"> <view class="goods_box" v-if="goods_list instanceof Array">
<view class="goods_item" v-for="(item, index) in goods_list" :key="index"> <view class="goods_item" v-for="(item, index) in goods_list" :key="index">
<image :src="item.default_image || $noGoodsImg" @click="jumpPhpPage(`app=goods&id=${item.goods_id}`)"></image> <image :src="item.default_image || $noGoodsImg" @click="$jumpPhpPage(item.goods_id)"></image>
<view class="goods_item_info"> <view class="goods_item_info">
<p>{{item.goods_name}}</p> <p>{{item.goods_name}}</p>
<p>{{item.goods_subname}}</p> <p>{{item.goods_subname}}</p>
......
pages/home/components/custowstyle.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="customer_content" :class="style_setting.padding_type === 1 ? 'need_padding' : ''" :style="[{'border-radius': style_setting.border_radius*2+'rpx','height': style_setting.height*2+'rpx'}, style_setting.bg_show ? {'background-image': 'url('+style_setting.bg_url+')'} : {'background-color': style_setting.bg_color}]" @click="style_setting.link ? $jump(style_setting.link) : null">
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
style_setting: this.wrapper_props.style_setting
}
}
}
</script>
<style lang="less">
.customer_content {
background-repeat: no-repeat;
background-size: 100% 100%;
}
.need_padding {
width: 93.6%;
margin: 0 auto;
}
</style>
pages/home/components/functionmenu.vue 0 → 100644
View file @ e0e5420a
<template>
<view>
<view v-if="style_setting.rank === 1" class="rank rank1" :style="[style_setting.bg_show ? {'background-image':style_setting.bg_url} : {'background-color': style_setting.bg_color},{'border-bottom-left-radius':style_setting.radius_bottom_left*2+'rpx', 'border-bottom-right-radius':style_setting.radius_bottom_right*2+'rpx', 'border-top-left-radius':style_setting.radius_top_left*2+'rpx', 'border-top-right-radius':style_setting.radius_top_right*2+'rpx'}]">
<view class="menuItem" v-for="(item, key) in menuArray" :key="key" :style="{'width': width}" @click="$jump(item.img_href)">
<image :src="item.img_url" class="icon_img"></image>
<text v-if="style_setting.font_show" class="title" :style="{'color': style_setting.font_color}">{{item.title}}</text>
</view>
</view>
<swiper v-else indicator-dots="true" :style="{'height': style_setting.rank*200+10+'rpx'}">
<swiper-item v-for="(item, key) in menuArray" :key="key" class="rank rank1">
<view class="menuItem" v-for="(val, index) in item" :key="index" :style="{'width': width}" @click="$jump(item.img_href)">
<image :src="val.img_url" class="icon_img"></image>
<text v-if="style_setting.font_show" class="title" :style="{'color': style_setting.font_color}">{{val.title}}</text>
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
},
},
data() {
return {
width: '',
menuArray: this.wrapper_props.menuList,
style_setting: this.wrapper_props.style_setting
}
},
mounted() {
const { rank, arrange } = this.style_setting;
const width = Math.floor(100/arrange);
this.width = width + '%';
if(rank != 1) {
const rate = rank * arrange;
let array = [];
for (var i = 0, j = this.menuArray.length; i < j; i += rate) {
array.push(this.menuArray.slice(i, i + rate));
}
this.menuArray = array;
}
},
methods: {
}
}
</script>
<style lang="less" scoped>
.rank {
background-size: 100% 100%;
background-repeat: no-repeat;
width: 702rpx;
margin: 0 auto;
}
.rank1 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.rank1:after {
flex: auto;
content: '';
}
.menuItem {
text-align: center;
padding: 22rpx 0;
}
.icon_img {
display: block;
width: 96rpx;
height: 96rpx;
margin: 0 auto;
}
.title {
font-size: 24rpx;
}
</style>
pages/home/components/goodslist.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="goods_content">
<view v-if="style_setting.arrange == 1" class="goods_box" :class="dataList.length % style_setting.listType !== 0 ? 'needAfter' : ''" :style="{'background-color': style_setting.bg_color}">
<view v-for="(item, key) in dataList" :key="key" class="goods_item" :style="width ? {'width':width} : ''">
<view :class="style_setting.listType === 2 ? 'image_box2' : 'image_box'">
<image v-if="style_setting.sign_show" class="logo" :style="{'width': style_setting.sign_size*2+'rpx','height': style_setting.sign_size*2+'rpx'}" :src="style_setting.sign_url"></image>
<image class="goods_img" :src="item.default_image || $noGoodsImg" @click="$jumpGoodDetail(item.goods_id)"></image>
</view>
<text class="goods_name" v-if="style_setting.title_show">{{item.goods_name}}</text>
<text class="goods_sub_name" v-if="style_setting.sub_title_show">{{item.goods_subname || '　'}}</text>
<view class="goods_price">
<text v-if="style_setting.price_show">￥{{item.price}}</text>
<i v-if="style_setting.cart_show" @click="$addCart(item.spec_id)"></i>
</view>
</view>
</view>
<swiper v-else indicator-dots="true" class="swiper_content">
<swiper-item v-for="(val, index) in dataList" :key="index" class="goods_box2" :class="val.length < style_setting.listType ? 'needAfter' : ''">
<view v-for="(item, key) in val" :key="key" class="goods_item" :style="width ? {'width':width} : ''">
<view :class="style_setting.listType === 2 ? 'image_box2' : 'image_box'">
<image v-if="style_setting.sign_show" class="logo" :style="{'width': style_setting.sign_size*2+'rpx','height': style_setting.sign_size*2+'rpx'}" :src="style_setting.sign_url"></image>
<image class="goods_img" :src="item.default_image || $noGoodsImg" @click="$jumpGoodDetail(item.goods_id)"></image>
</view>
<text class="goods_name" v-if="style_setting.title_show">{{item.goods_name}}</text>
<text class="goods_sub_name" v-if="style_setting.sub_title_show">{{item.goods_subname || '　'}}</text>
<view class="goods_price">
<text v-if="style_setting.price_show">￥{{item.price}}</text>
<i v-if="style_setting.cart_show" @click="$addCart(item.spec_id)"></i>
</view>
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
dataList: [],
style_setting: this.wrapper_props.style_setting,
width: ''
}
},
mounted() {
const { listType, arrange, goods_data_type } = this.style_setting;
const { goods_list, cate_goods_list } =this.wrapper_props;
if(listType == 2) {
this.width = '320rpx';
} else if (listType == 3 ) {
this.width = '210rpx';
} else {
this.width = '150rpx';
}
let list = [];
if(goods_data_type === 3) {
list = goods_list;
} else {
list = cate_goods_list.concat(goods_list)
}
this.dataList = list;
if(arrange == 2) {
let array = [];
for (var i = 0, j = list.length; i < j; i += listType) {
array.push(list.slice(i, i + listType));
}
this.dataList = array;
}
}
}
</script>
<style lang="less" scoped>
.swiper_content {
height: 320rpx;
width: 702rpx;
margin: 0 auto;
padding: 24rpx;
box-sizing: border-box;
}
.goods_box, .goods_box2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 702rpx;
margin: 0 auto;
padding: 24rpx;
box-sizing: border-box;
.goods_item {
margin-bottom: 20rpx;
display: flex;
flex-direction: column;
align-items: center;
}
}
.needAfter::after {
// content: '';
flex: auto;
}
.image_box, .image_box2 {
width: 160rpx;
height: 160rpx;
position: relative;
margin-bottom: 8rpx;
.logo {
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.goods_img {
width: 100%;
height: 100%;
}
}
.image_box2 {
width:320rpx;
height: 320rpx;
}
.goods_name {
font-size: 22rpx;
color: #212121;
font-weight: 500;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 32rpx;
line-height: 32rpx;
margin-bottom: 6rpx;
width: 90%;
}
.goods_sub_name {
font-size: 22rpx;
color: #6e6e6e;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 90%;
}
.goods_price {
width: 90%;
position: relative;
top: -4rpx;
height: 40rpx;
line-height: 40rpx;
display: flex;
justify-content: space-between;
text {
font-size: 24rpx;
color: #c3a070;
}
i {
display: inline-block;
width: 40rpx;
height: 40rpx;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAAAAACN7WTCAAABfElEQVRIx2P4TyZgGNU4qnFUIxEafx87+eYvORqvVFRUbiTLxstTSktW/yHHj7/2FRa9ICtw/kzM2wa2/MTmzZs2gTAEbL3yi0Co7sye/A9IfcpGBVlZU/7i1/g4o/gryObzEJtgdm4uyliDX+PXgpQn2Ly0LaUNv8Z/PYl7sGlcnTiRQMpZETsXm8aJccsJaDwTXfULU9/3ouiDBDS+j4z5jKnxU3T4IwIaf+SFXMXUeCsk+jOh3NEfuBpT4+bAwl+ENK7x68bUOMOvl2B+vOmd8h1d7F+F9xKCGj/5e75DF/sc6X6MoMbfOS7oiv6/dnF5SbjomODYhV4O7HIM+ExY4z5b+1lr1gPBurVr16xZs3rVipnetpV/CWv8XmiFAbzuElPKfd4wpb8PCPr7+yeAwMRJK14Mt5L822ZQmJ6FhOOHTSDOub/EaFwVCwYfwJxFYHbcR2I03stJTk5OgqaC6xkgTjdRNv7//R0I/sEKaWTOaI08qnHoaQQAAyi97TBEkioAAAAASUVORK5CYII=) no-repeat;
background-size: 100% 100%;
}
}
</style>
pages/home/components/hotrecommd.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="hot_main_content">
<view class="clearfix">
<view class="hot_head_left">
<view>
<text class="hot_title">
<i v-if="style_setting.icon_url_show" class="hot_icon" :style="{'background-image':'url('+style_setting.icon_url+')'}"></i>
{{style_setting.title}}
</text>
<text class="hot_sub_title">{{style_setting.sub_title}}</text>
</view>
</view>
<view class="hot_cate_list">
<text class="hot_cate_item" v-for="(item, key) in cate_list" :key="key" @click="changeCate(key)">{{item.cate_name}}</text>
</view>
</view>
<view class="flex_goods" v-for="(val, key) in cate_list" :key="key" v-if="key === hotIndex">
<view class="hot_goods_item" v-for="(item, index) in val.goods_list" :key="index">
<image class="hot_goods_icon" :src="style_setting.angle_sign_url"></image>
<image class="hot_goods_img" :src="item.default_image || $noGoodsImg" @click="$jumpGoodDetail(item.goods_id)"></image>
<text class="hot_goods_name" v-if="style_setting.title_show">{{item.title}}</text>
<text class="hot_goods_subname" v-if="style_setting.sub_title_show">{{item.sub_title}}</text>
<view class="between_price">
<view class="between_left" v-if="style_setting.price_show">
<text class="hot_pro_price">￥{{item.price}}</text>
<!-- <text class="hot_price">￥{{item.price}}</text> -->
</view>
<i class="hot_cart_icon" v-if="style_setting.cart_show" @click="$addCart(item.spec_id)"></i>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props:{
wrapper_props: {
type: Object
}
},
data() {
return {
style_setting: this.wrapper_props.style_setting,
cate_list: this.wrapper_props.cate_list,
hotIndex: 0
}
},
methods: {
changeCate(index) {
this.hotIndex = index
}
}
}
</script>
<style lang="less" scoped>
.clearfix::after {
content: "";
display: block;
height: 0;
clear:both;
visibility: hidden;
}
.hot_main_content {
width: 93.6%;
margin: 0 auto;
}
.hot_head_left {
display: inline-block;
float: left;
}
.hot_icon {
display: inline-block;
width: 28rpx;
height: 28rpx;
background-repeat: no-repeat;
background-size: 100% 100%;
}
.hot_title {
font-size: 32rpx;
font-family: PingFangSC-Medium,PingFang SC;
font-weight: 500;
color: #464646;
line-height: 44rpx;
display: block;
}
.hot_sub_title {
font-size: 22rpx;
color: #7c7c7c;
line-height: 32rpx;
display: block;
}
.hot_cate_list {
white-space: nowrap;
overflow: scroll;
position: relative;
top: 10rpx;
}
.hot_cate_list::-webkit-scrollbar {
display: none;
}
.hot_cate_item {
width: 164rpx;
height: 88rpx;
line-height: 88rpx;
display: inline-block;
font-family: PingFangSC-Medium,PingFang SC;
font-weight: 500;
color: #464646;
font-size: 32rpx;
text-align: center;
}
.flex_goods {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.hot_goods_item {
position: relative;
width: 346rpx;
text-align: center;
margin-top: 20rpx;
background: #fff;
padding-bottom: 12rpx;
.hot_goods_icon {
position: absolute;
left: 0;
top: 0;
width: 80rpx;
height: 80rpx;
z-index: 2;
}
.hot_goods_img {
width: 280rpx;
height: 280rpx;
}
.hot_goods_name, .hot_goods_subname {
width: 280rpx;
display: block;
text-align: left;
font-size: 26rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin: 0 auto;
}
.hot_goods_name {
color: #212121;
margin-top: 16rpx;
}
.hot_goods_subname {
color: #6e6e6e;
}
}
.between_price {
position: relative;
width: 280rpx;
height: 44rpx;
margin: 12rpx auto 0;
.between_left {
position: absolute;
left: 0;
}
text {
display: block;
text-align: left;
}
.hot_pro_price {
font-size: 32rpx;
font-family: PingFangSC-Regular,PingFang SC;
font-weight: 400;
color: #c3a070;
}
.hot_price {
font-size: 24rpx;
font-family: PingFangSC-Light,PingFang SC;
font-weight: 300;
color: #aeaeae;
text-decoration: line-through;
}
.hot_cart_icon {
display: inline-block;
width: 44rpx;
height: 44rpx;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAAAAACN7WTCAAABfElEQVRIx2P4TyZgGNU4qnFUIxEafx87+eYvORqvVFRUbiTLxstTSktW/yHHj7/2FRa9ICtw/kzM2wa2/MTmzZs2gTAEbL3yi0Co7sye/A9IfcpGBVlZU/7i1/g4o/gryObzEJtgdm4uyliDX+PXgpQn2Ly0LaUNv8Z/PYl7sGlcnTiRQMpZETsXm8aJccsJaDwTXfULU9/3ouiDBDS+j4z5jKnxU3T4IwIaf+SFXMXUeCsk+jOh3NEfuBpT4+bAwl+ENK7x68bUOMOvl2B+vOmd8h1d7F+F9xKCGj/5e75DF/sc6X6MoMbfOS7oiv6/dnF5SbjomODYhV4O7HIM+ExY4z5b+1lr1gPBurVr16xZs3rVipnetpV/CWv8XmiFAbzuElPKfd4wpb8PCPr7+yeAwMRJK14Mt5L822ZQmJ6FhOOHTSDOub/EaFwVCwYfwJxFYHbcR2I03stJTk5OgqaC6xkgTjdRNv7//R0I/sEKaWTOaI08qnHoaQQAAyi97TBEkioAAAAASUVORK5CYII=) no-repeat;
background-size: 100% 100%;
position: absolute;
right: 0;
top: 0;
}
}
}
</style>
pages/home/components/maintitle.vue 0 → 100644
View file @ e0e5420a
<template>
<view>
<view v-if="style_setting.styleType === 1" class="maintitle_content1" :style="{'height': style_setting.titleHeight*2+'rpx','line-height': style_setting.titleHeight*2+'rpx','background-color':style_setting.bg_color,'padding-top':style_setting.padding_top*2+'rpx','padding-bottom':style_setting.padding_bottom*2+'rpx',}">
<view>
<i class="main_icon" :style="{'background-image':'url('+style_setting.icon_url+')'}" v-if="style_setting.iconShow"></i>
<text class="main_title" :style="{'font-size':style_setting.title_font_size*2+'rpx','color':style_setting.title_color}">{{style_setting.title}}</text>
<text class="main_sub_title" :style="{'font-size': style_setting.sub_title_font_size*2+'rpx','color':style_setting.sub_title_color}">{{style_setting.sub_title}}</text>
</view>
<text v-if="style_setting.view_more_show" :style="{'font-size':style_setting.view_more_font_size*2+'rpx','color': style_setting.view_more_color}" @click="jumpPage(style_setting.view_more_link)">{{style_setting.view_more_font_title}}
<svg viewBox="64 64 896 896" class="" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false"><path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path></svg>
</text>
</view>
<view v-if="style_setting.styleType === 2" class="maintitle_content2" :style="{'height': style_setting.titleHeight*2+'rpx','line-height': style_setting.titleHeight*2+'rpx','background-color':style_setting.bg_color,'padding-top':style_setting.padding_top*2+'rpx','padding-bottom':style_setting.padding_bottom*2+'rpx',}">
<view class="main_title" :style="{'font-size':style_setting.title_font_size*2+'rpx','color':style_setting.title_color, 'height':style_setting.title_font_size*2+'rpx'}">{{style_setting.title}}</view>
<view class="main_sub_title" :style="{'font-size': style_setting.sub_title_font_size*2+'rpx','color':style_setting.sub_title_color,'height':style_setting.sub_title_font_size*2+'rpx'}">{{style_setting.sub_title}}</view>
</view>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
style_setting: this.wrapper_props.style_setting
}
},
methods: {
jumpPage(url) {
}
}
}
</script>
<style lang="less" scoped>
.maintitle_content1 {
width: 650rpx;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 16rpx 16rpx 0 0;
padding: 0 24rpx 0 28rpx;
text {
vertical-align: middle;
margin-left: 10rpx;
}
}
.maintitle_content2 {
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 16rpx 16rpx 0 0;
width: 702rpx;
margin: 0 auto;
view {
line-height: initial;
height: 50%;
}
view:nth-of-type(2) {
margin-top: 10rpx;
}
}
.main_icon {
display: inline-block;
width: 52rpx;
height: 52rpx;
vertical-align: middle;
background-size: 100% 100%;
background-repeat: no-repeat;
}
</style>
pages/home/components/multimage.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="mult_content">
<view class="mult_item" v-for="(item, key) in list" :key="key" :style="{'left':item.left*rate+'rpx','top':item.top*rate+'rpx','right':item.right*rate+'rpx','bottom':item.bottom*rate+'rpx','width':item.width*rate+'rpx','height':item.height*rate+'rpx'}" @click="jumpPage(item.link)">
<image :src="item.img_url"></image>
</view>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
rate: 3,
style_setting: this.wrapper_props.style_setting,
list: this.wrapper_props.list
}
},
mounted() {
const { type } = this.style_setting;
const rate = 750 / (type + 3);
this.rate = rate;
}
}
</script>
<style lang="less" scoped>
.mult_content {
position: relative;
height: 750rpx;
.mult_item {
position: absolute;
image {
width: 100%;
height: 100%;
}
}
}
</style>
pages/home/components/navigation.vue 0 → 100644
View file @ e0e5420a
<template>
<view>
<view class="navigation" :style="[{'height': style_setting.height*2+'rpx', 'line-height': style_setting.height*2+'rpx'}, style_setting.bg_show ? {'background-image': 'url('+style_setting.bg_url+')'} : {'background-color': style_setting.bg_color}]">
<text class="navigation_text" v-for="(item, key) in list" :key="key" v-if="item.title_show" :style="[{'color': item.title_color}, item.title_bg_show ? {'background-image': 'url('+item.title_bg_url+')'} : '']">
<i v-if="style_setting.title_icon_show" class="navigation_icon" :style="{'background-image': 'url('+item.title_icon_url+')'}"></i>
<text>{{item.title}}</text>
</text>
</view>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
style_setting: this.wrapper_props.style_setting,
list: this.wrapper_props.list
}
}
}
</script>
<style lang="less" scoped>
.navigation {
white-space: nowrap;
overflow: scroll;
background-repeat: no-repeat;
background-size: 100% 100%;
.navigation_text {
background-size: 100% 100%;
background-repeat: no-repeat;
width: 25%;
text-align: center;
display: inline-block;
font-size: 32rpx;
text {
vertical-align: middle;
}
.navigation_icon {
display: inline-block;
width: 32rpx;
height: 32rpx;
background-size: 100% 100%;
background-repeat: no-repeat;
vertical-align: middle;
margin-right: 8rpx;
}
}
}
.navigation::-webkit-scrollbar {
display: none;
}
</style>
\ No newline at end of file
pages/home/components/promotion.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="promo_content" :style="style_setting.bg_show ? {'background-image': 'url('+style_setting.bg_url+')'} : {'background-color': style_setting.bg_color}">
<view class="flex">
<view>
<i v-if="style_setting.icon_show" class="promo_icon" :style="{'background-image': 'url('+style_setting.icon_url+')'}"></i>
<text class="promo_title" :style="{'color': style_setting.title_color, 'font-size': style_setting.title_font*2+'rpx'}">{{style_setting.title}}</text>
<!-- <text class="countdown">
<uni-countdown :timer="style_setting.count_down_time"></uni-countdown>
</text> -->
</view>
<text class="check_more" @click="jumpPage(style_setting.more_link)">{{style_setting.more_title}}
<svg viewBox="64 64 896 896" class="" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false"><path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path></svg>
</text>
</view>
<view class="promo_goods_content" :class="flexAutoFlag ? 'promo_goods_content_after' : ''">
<view class="promo_goods_item" v-for="(item,key) in list" :key="key" @click="$jumpGoodDetail(item.goods_id)">
<image :src="item.default_image || $noGoodsImg"></image>
<text class="pro_price">￥{{item.pro_price}}</text>
<text class="price">￥{{item.price}}</text>
</view>
</view>
</view>
</template>
<script>
import uniCountdown from "@/components/uni-countdown/uni-countdown.vue"
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
style_setting: this.wrapper_props.style_setting,
list: this.wrapper_props.goods_list,
flexAutoFlag: false
}
},
mounted() {
const num = this.list.length % 4;
if(num !== 0) {
this.flexAutoFlag = true;
}
},
methods: {
},
components:{
uniCountdown
}
}
</script>
<style lang="less" scoped>
.promo_content {
width: 702rpx;
border-radius: 16rpx;
background-repeat: no-repeat;
background-size: 100% 100%;
margin: 0 auto;
padding: 0 24rpx 0 28rpx;
box-sizing: border-box;
}
.flex {
display: flex;
justify-content: space-between;
align-items: center;
height: 88rpx;
}
.promo_icon {
display: inline-block;
width: 48rpx;
height: 48rpx;
background-size: 100% 100%;
background-repeat: no-repeat;
vertical-align: middle;
}
.promo_title {
font-weight: 500;
vertical-align: middle;
margin: 0 12rpx;
}
.check_more {
font-size: 22rpx;
color: rgb(33, 33, 33);
}
.promo_goods_content {
margin: 24rpx 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.promo_goods_content_after:after {
content: '';
flex: auto;
}
.promo_goods_item {
width: 140rpx;
text-align: center;
margin-bottom: 20rpx;
image {
width:140rpx;
height: 140rpx;
}
.pro_price {
color: #c3a070;
font-size: 24rpx;
width: 140rpx;
display: block;
}
.price {
color: #aeaeae;
font-size: 24rpx;
text-decoration: line-through;
width: 140rpx;
display: block;
}
}
</style>
pages/home/components/searchbar.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="flex_searchbar" :style="{'background':wrapper_props.bg_color}">
<i class="logo" :style="{'background-image': 'url('+wrapper_props.logo_url+')'}"></i>
<view class="search_view flex">
<i class="search_icon" @click="search"></i>
<input type="text" class="search_input" v-model="keyword" :placeholder="wrapper_props.placeholder">
</view>
<text class="login_btn" @click="jumpPhpPage('app=member&act=login')" v-if="!isLogin">登录</text>
<uni-icons v-else type="person" size="30" @click="jumpPhpPage('app=member')"></uni-icons>
</view>
</template>
<script>
import { php } from '../../../common/host.js';
import uniIcons from "@/components/uni-icons/uni-icons.vue";
export default {
props: {
wrapper_props: {
type: Object,
required: true
}
},
data() {
return {
isLogin: 0,
keyword: ''
}
},
methods: {
jumpPhpPage(url) {
let link = url ? `${php}${url}` : php;
window.location.href = link;
}
},
components: {
uniIcons
}
}
</script>
<style lang="less" scoped>
.flex_searchbar {
display: flex;
justify-content: space-between;
padding: 24rpx;
.flex {
display: flex;
}
.logo {
width: 192rpx;
height: 60rpx;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.search_view {
width: 380rpx;
height: 60rpx;
background: #F5F5F5;
border-radius: 30rpx;
}
.search_icon {
display: inline-block;
width: 56rpx;
height: 56rpx;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAAAAAA5AE8dAAACh0lEQVRYw83ZMW/aQBTAcb7K3xaGDcQUIUWtEFKmMKRbVT5AEBOV+gFgZmEh6tatH4HIK8qUISGIFgllyFQhaqlyLjRpIR1I0jTCl9p5r81t9sk/2Xe+u3fvUtdryvLH3DylpNaQV08j16DLqwtjhNHF3BhhdHFpjDT688JIoxKt+RBdfjdGGl3OjTi6EDRvUVHzBl2KmitU2DQp2X7/jV4ZeVRqHN1HF+KmSV1fGnl0YRTQuQZq/hc6nYyGJ8PRZCqGBvudWimX9bK5Uq2zH0igYbecd7ktbr7cDZ+KBv2Kw5/FqfQfe9svVvS05d1Z7p3utU7t6AcbelZNr5hi0x8MBn6zuLpMV8+s6HsLelYCoFAf390a1wsAlKzqx2j0tArgNfz7PRP6DQ+gamuBb5Fo0EoDmfbswf1ZOwOkW0GS3u97QGZvTc1eBvD6CdCwAnjttXVtD6iE8dGuAzRma+tmDcDpxkaDMlDwIx7yC0A5iIv28kA96gvDOpDvxUU7LjCOfGoMuJ2Y6HQXKFr6twjUpvHQSQloWtAmUJrEQ0c5wLegPpAbxUOHWXAGFnTgQHYYDz3xwLWiLngnz+BNVdpUpfenNYX/VGVE/dXY338Ws5TKfKoz86usUY+sprxLtJra1312hskCNEuEAs6LSbKoLyqWWpXNo/NEoWRE1Pd2C4DtQ8n49OvBxuoDjkUj6eNVQ2wchElj/l5n9ybm3+30bv6kw20Atg4kdyfnR5sAvJTdR01eOIAjvDkbvnLgjTB6/mnHef35H24jVTa8KltzlSSCTrpDJTGjk0LSSXappOV0Eog6qU6dpKxO+lgn0a2Tktc5PFA65tA5kFE6OtI55JI4jvsF01XE0L1M7eEAAAAASUVORK5CYII=) no-repeat;
background-size: 100% 100%;
}
.search_input {
height: 60rpx;
}
.login_btn {
width: 92rpx;
height: 60rpx;
line-height: 60rpx;
background: #FFCD00;
border-radius: 16rpx;
color: #212121;
font-size: 28rpx;
text-align: center;
}
}
</style>
pages/home/components/slide.vue 0 → 100644
View file @ e0e5420a
<template>
<view>
<swiper :autoplay="slide_setting.autoplay" :style="{'background-color': slide_setting.bg_color, 'height': slide_setting.slideHeight*2+'rpx'}" circular="true" interval="3000" :indicator-dots="slide_setting.dots">
<swiper-item v-for="(item, key) in slide_list" :key="key">
<view :style="{'height': slide_setting.slideHeight*2+'rpx'}">
<image class="slide_img" :src="item.img_url" @click="jumpPage(item.img_href)"></image>
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
props: {
wrapper_props: {
type: Object
}
},
data() {
return {
slide_setting: this.wrapper_props.slide_setting,
slide_list: this.wrapper_props.slide_list
}
},
methods: {
jumpPage(url) {
}
}
}
</script>
<style lang="less" scoped>
.slide_img {
width: 100%;
height: 100%;
}
</style>
pages/home/home.vue 0 → 100644
View file @ e0e5420a
<template>
<view class="homeContent">
<component v-for="(item, index) in data" :key="index" :is="item.name" :wrapper_props="item.wrapper_props"></component>
<BottomBar />
</view>
</template>
<script>
import SearchBar from './components/searchbar.vue';
import Navigation from './components/navigation.vue';
import Slide from './components/slide.vue';
import MainTitle from './components/maintitle.vue';
import GoodsList from './components/goodslist.vue';
import FunctionMenu from './components/functionmenu.vue';
import Promotion from './components/promotion.vue';
import HotRecommd from './components/hotrecommd.vue';
import CustomStyle from './components/custowstyle.vue';
import MultImage from './components/multimage.vue';
import BottomBar from "@/components/BottomBar/BottomBar.vue";
export default {
data() {
return {
data: []
}
},
onLoad() {
this.getData();
},
methods: {
getData() {
uni.request({
url: '/uni/api/index/style_info',
method: 'GET',
dataType: 'json',
success: (res) => {
this.data = res.data.data;
}
});
}
},
components: {
BottomBar,
SearchBar,
Navigation,
Slide,
MainTitle,
GoodsList,
FunctionMenu,
Promotion,
HotRecommd,
CustomStyle,
MultImage
}
}
</script>
<style lang="less" scoped>
.homeContent {
padding-bottom: 110rpx;
background-color: #f8f8f8;
}
</style>
pages/index/index.vue
View file @ e0e5420a
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
</view> </view>
<view class="part_three_bottom"> <view class="part_three_bottom">
<view class="hot_goods" v-for="(item, index) in credit_goods_list" :key="index"> <view class="hot_goods" v-for="(item, index) in credit_goods_list" :key="index">
<image :src="item.default_image || $noGoodsImg" @click="jumpPhpPage(`app=goods&id=${item.goods_id}`)"></image> <image :src="item.default_image || $noGoodsImg" @click="$jumpPhpPage(item.goods_id)"></image>
<p>{{item.goods_name}}</p> <p>{{item.goods_name}}</p>
<!-- <text>9个月账期</text> --> <!-- <text>9个月账期</text> -->
</view> </view>
......
pages/web/Web.vue
View file @ e0e5420a
...@@ -11,8 +11,8 @@ ...@@ -11,8 +11,8 @@
url: '' url: ''
} }
}, },
onLoad(e) { mounted() {
this.url = e.url this.url = this.$store.state.webviewUrl;
} }
} }
</script> </script>
......
store/store.js 0 → 100644
View file @ e0e5420a
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
webviewUrl: ''
},
mutations: {
changeWebviewUrl(state, url) {
state.webviewUrl = url;
}
},
actions: {
changeWebviewUrl(context, url) {
context.commit('changeWebviewUrl', url);
}
}
})
export default store
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment