mkm/new_shop_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

界面修改

Browse Source
This commit is contained in:
DESKTOP-GMUNQ1B\k 2024-03-11 18:01:38 +08:00
parent 5a769016c6
commit 856e037e6c
27 changed files with 7613 additions and 2348 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/WaterfallsFlow/WaterfallsFlow.vue
View File

@ -3,8 +3,7 @@
<!-- left --> <!-- left -->
<view> <view>
<view id="left" v-if="leftList.length"> <view id="left" v-if="leftList.length">
<view v-for="(item,index) in leftList" :key="index" <view v-for="(item,index) in leftList" :key="index" class="wf-item" @tap="itemTap(item)">
class="wf-item" @tap="itemTap(item)">
<WaterfallsFlowItem :item="item" :isStore="isStore" :type="type" @goShop="goShop" /> <WaterfallsFlowItem :item="item" :isStore="isStore" :type="type" @goShop="goShop" />
</view> </view>
</view> </view>
@ -12,8 +11,7 @@
<!-- right --> <!-- right -->
<view> <view>
<view id="right" v-if="rightList.length"> <view id="right" v-if="rightList.length">
<view v-for="(item,index) in rightList" :key="index" <view v-for="(item,index) in rightList" :key="index" class="wf-item" @tap="itemTap(item)">
class="wf-item" @tap="itemTap(item)">
<WaterfallsFlowItem :item="item" :isStore="isStore" :type="type" @goShop="goShop" /> <WaterfallsFlowItem :item="item" :isStore="isStore" :type="type" @goShop="goShop" />
</view> </view>
</view> </view>
@ -86,7 +84,8 @@ export default {
this.rightList = []; this.rightList = [];
this.boxHeight = []; this.boxHeight = [];
this.allList.forEach((v, i) => { this.allList.forEach((v, i) => {
if(this.allList.length < 3 || (this.allList.length <= 7 && this.allList.length - i > 1) || (this.allList.length > 7 && this.allList.length - i > 2)) { if (this.allList.length < 3 || (this.allList.length <= 7 && this.allList.length - i >
1) || (this.allList.length > 7 && this.allList.length - i > 2)) {
if (i % 2) { if (i % 2) {
this.rightList.push(v); this.rightList.push(v);
} else { } else {
@ -109,8 +108,7 @@ export default {
immediate: true, immediate: true,
deep: true deep: true
}, },
mounted(){ mounted() {},
},
// 监听标记，当标记发生变化，则执行下一个item排序 // 监听标记，当标记发生变化，则执行下一个item排序
mark() { mark() {
@ -137,9 +135,9 @@ export default {
} else { } else {
// 根据左右列表高度判断下一个item应该插入哪边 // 根据左右列表高度判断下一个item应该插入哪边
if (!this.boxHeight.length) { if (!this.boxHeight.length) {
this.rightList.length < this.leftList.length this.rightList.length < this.leftList.length ?
? this.rightList.push(this.allList[i]) this.rightList.push(this.allList[i]) :
: this.leftList.push(this.allList[i]); this.leftList.push(this.allList[i]);
} else { } else {
const leftOrRight = this.boxHeight[0] > this.boxHeight[1] ? 1 : 0; const leftOrRight = this.boxHeight[0] > this.boxHeight[1] ? 1 : 0;
if (leftOrRight) { if (leftOrRight) {
@ -159,7 +157,8 @@ export default {
setTimeout(() => { setTimeout(() => {
uni.createSelectorQuery().in(this).select('#right').boundingClientRect(res => { uni.createSelectorQuery().in(this).select('#right').boundingClientRect(res => {
res ? this.boxHeight[1] = res.height : ''; res ? this.boxHeight[1] = res.height : '';
uni.createSelectorQuery().in(this).select('#left').boundingClientRect(res => { uni.createSelectorQuery().in(this).select('#left').boundingClientRect(
res => {
res ? this.boxHeight[0] = res.height : ''; res ? this.boxHeight[0] = res.height : '';
this.mark = this.mark + 1; this.mark = this.mark + 1;
}).exec(); }).exec();
@ -188,16 +187,19 @@ $grid-gap: 10px;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
grid-gap: $grid-gap; grid-gap: $grid-gap;
} }
.wf-item { .wf-item {
width: calc((100vw - 2 * #{$page-padding} - #{$grid-gap}) / 2); width: calc((100vw - 2 * #{$page-padding} - #{$grid-gap}) / 2);
padding-bottom: $grid-gap; padding-bottom: $grid-gap;
} }
.wf-page1 .wf-item { .wf-page1 .wf-item {
margin-top: 20rpx; margin-top: 20rpx;
background-color: #fff; background-color: #fff;
border-radius: 20rpx; border-radius: 20rpx;
padding-bottom: 0; padding-bottom: 0;
} }
.wf-item-page { .wf-item-page {
padding-bottom: 20rpx; padding-bottom: 20rpx;
} }

186
components/recommend/index.vue
View File

@ -1,8 +1,50 @@
<template> <template>
<view class='recommend'> <view class='recommend'>
<view class="common-hd"> <view class="common-hd">
<view class="title" :style="{ 'background-image': `url(${domain}/static/images/index-title.png)`}">为你推荐</view> <image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/137f4202403091116454932.webp" mode=""></image>
</view> </view>
<!-- nav导航 -->
<view class="nav">
<view class="nav-item">
<view class="nav-item-up">
<image src="../../static/images/dong.gif" mode=""></image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">里海云仓</view>
<view class="nav-item-down-desc">供销物资市场</view>
</view>
</view>
<view class="nav-item">
<view class="nav-item-up">
<image src="../../static/images/dong.gif" mode=""></image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">供销云市场</view>
<view class="nav-item-down-desc">综合线上大市场</view>
</view>
</view>
<view class="nav-item">
<view class="nav-item-up">
<image src="../../static/images/dong.gif" mode=""></image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">名优特产</view>
<view class="nav-item-down-desc">地方特色特产</view>
</view>
</view>
</view>
<!-- tab导航 -->
<view class="tabs">
<block v-for="(item,indx) in tabsArr" :key="indx">
<view :class="{'tabs-item-active':item.val==currTabs}" class="tabs-item" @click="changeTab(item.val)">
<view class="tabs-item-main">{{item.name}}</view>
<view class="tabs-item-sub">{{item.desc}}</view>
</view>
</block>
</view>
<view class='recommendList' :class="indexP?'on':''"> <view class='recommendList' :class="indexP?'on':''">
<WaterfallsFlow :wfList='hostProduct' @itemTap="goDetail" :type="0" /> <WaterfallsFlow :wfList='hostProduct' @itemTap="goDetail" :type="0" />
</view> </view>
@ -19,14 +61,26 @@
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com> // | Author: CRMEB Team <admin@crmeb.com>
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
import {mapGetters} from "vuex"; import {
import { goShopDetail } from '@/libs/order.js' mapGetters
import {initiateAssistApi} from '@/api/activity.js'; } from "vuex";
import {toLogin} from '@/libs/login.js'; import {
goShopDetail
} from '@/libs/order.js'
import {
initiateAssistApi
} from '@/api/activity.js';
import {
toLogin
} from '@/libs/login.js';
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue' import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
import { HTTP_REQUEST_URL } from '@/config/app'; import {
HTTP_REQUEST_URL
} from '@/config/app';
export default { export default {
components:{WaterfallsFlow}, components: {
WaterfallsFlow
},
computed: mapGetters(['uid']), computed: mapGetters(['uid']),
props: { props: {
hostProduct: { hostProduct: {
@ -47,6 +101,24 @@
data() { data() {
return { return {
domain: HTTP_REQUEST_URL, domain: HTTP_REQUEST_URL,
tabsArr: [{
name: '全部',
desc: '猜你喜欢',
val: 1
}, {
name: '里海云仓',
desc: '大家都在买',
val: 2
}, {
name: '云市场',
desc: '商户汇聚',
val: 3
}, {
name: '名优特产',
desc: '特色农副',
val: 4
}],
currTabs: 1
}; };
}, },
mounted() { mounted() {
@ -61,6 +133,11 @@
}, 500) }, 500)
}, },
methods: { methods: {
changeTab(e) {
this.currTabs = e;
},
goDetail(item) { goDetail(item) {
goShopDetail(item, this.uid).then(res => { goShopDetail(item, this.uid).then(res => {
if (this.isLogin) { if (this.isLogin) {
@ -91,7 +168,14 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 118rpx; height: 118rpx;
image {
width: 340rpx;
height: 42rpx;
}
.title { .title {
height: 42rpx;
padding: 0 80rpx; padding: 0 80rpx;
font-size: 34rpx; font-size: 34rpx;
color: $theme-color; color: $theme-color;
@ -101,13 +185,101 @@
background-position: left center; background-position: left center;
} }
} }
// 里海云仓 供销云市场 名优特产
.nav {
display: flex;
margin-bottom: 40rpx;
.nav-item {
width: 33.3%;
overflow: hidden;
border-radius: 20rpx;
&:not(:nth-last-child(1)) {
margin-right: 12rpx;
}
.nav-item-up {
width: 100%;
height: 198rpx;
image {
width: 100%;
height: 100%;
}
}
.nav-item-down {
height: 102rpx;
padding: 12rpx 0 0 20rpx;
box-sizing: border-box;
background: linear-gradient(to right, #72BE53 0%, #46B03A 100%);
.nav-item-down-title {
margin-bottom: 4rpx;
font-weight: 600;
font-size: 30rpx;
color: #FFFFFF;
}
.nav-item-down-desc {
font-weight: 400;
font-size: 24rpx;
color: #FFFFFF;
}
}
}
}
.tabs {
display: flex;
justify-content: space-between;
margin: 0 -20rpx 30rpx;
.tabs-item {
width: 25%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.tabs-item-main {
font-weight: bold;
font-size: 30rpx;
color: #333;
font-family: PingFangSC-Medium, PingFangSC-Medium;
}
.tabs-item-sub {
font-size: 22rpx;
color: #999;
}
}
.tabs-item-active {
.tabs-item-main {
color: #40AE36;
}
.tabs-item-sub {
padding: 0 12rpx;
background-color: #40AE36;
color: #fff;
border-radius: 20rpx;
}
}
}
.recommend .recommendList { .recommend .recommendList {
padding: 0 20rpx; padding: 0 20rpx;
min-height: 100rpx; min-height: 100rpx;
} }
.recommend .recommendList.on { .recommend .recommendList.on {
padding: 0; padding: 0;
} }
/deep/.looming-gray { /deep/.looming-gray {
border-radius: 16rpx 16rpx 0 0; border-radius: 16rpx 16rpx 0 0;
} }

43
pages.json
View File

@ -22,45 +22,47 @@
"scrollIndicator": false //禁用原生导航栏 "scrollIndicator": false //禁用原生导航栏
} }
} }
}, }, {
{ "path": "pages/whole_sale/index",
"style": {
"enablePullDownRefresh": true,
"navigationBarTitleText": "批发",
"navigationStyle": "custom"
}
}, {
"path": "pages/gather/gather", "path": "pages/gather/gather",
"style": { "style": {
"enablePullDownRefresh": true, "enablePullDownRefresh": true,
"navigationBarTitleText": "工作台" "navigationBarTitleText": "工作台",
"navigationStyle": "custom"
} }
}, }, {
{
"path": "pages/order_addcart/order_addcart", "path": "pages/order_addcart/order_addcart",
"style": { "style": {
"enablePullDownRefresh": true, "enablePullDownRefresh": true,
"navigationBarTitleText": "购物车" "navigationBarTitleText": "购物车"
} }
}, }, {
{
"path": "pages/plant_grass/index", "path": "pages/plant_grass/index",
"style": { "style": {
// "navigationStyle": "custom", // "navigationStyle": "custom",
"navigationBarTitleText": "种草社区" "navigationBarTitleText": "种草社区"
} }
}, }, {
{
"path": "pages/user/index", "path": "pages/user/index",
"style": { "style": {
"enablePullDownRefresh": true, "enablePullDownRefresh": true,
"navigationBarTitleText": "个人中心", "navigationBarTitleText": "个人中心",
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, }, {
{
"path": "pages/small_page/index", "path": "pages/small_page/index",
"style": { "style": {
"navigationBarTitleText": "微页面" "navigationBarTitleText": "微页面"
// "navigationStyle": "custom", // "navigationStyle": "custom",
} }
}, }, {
{
"path": "pages/goods_details/index", "path": "pages/goods_details/index",
"style": { "style": {
"navigationStyle": "custom" "navigationStyle": "custom"
@ -1441,7 +1443,7 @@
}, },
"tabBar": { "tabBar": {
"color": "#282828", "color": "#282828",
"selectedColor": "#E93323", "selectedColor": "#40AE36",
"borderStyle": "white", "borderStyle": "white",
"backgroundColor": "#ffffff", "backgroundColor": "#ffffff",
"list": [{ "list": [{
@ -1450,13 +1452,12 @@
"selectedIconPath": "static/images/1-002.png", "selectedIconPath": "static/images/1-002.png",
"text": "首页" "text": "首页"
}, },
// { {
// "pagePath": "pages/goods_cate/goods_cate" "pagePath": "pages/whole_sale/index",
// , "iconPath": "static/images/2-001.png",
// "iconPath": "static/images/2-001.png", "selectedIconPath": "static/images/2-002.png",
// "selectedIconPath": "static/images/2-002.png", "text": "批发"
// "text": "分类" },
// },
// { // {
// "pagePath": "pages/plant_grass/index", // "pagePath": "pages/plant_grass/index",
// "iconPath": "static/images/5-001.png", // "iconPath": "static/images/5-001.png",

275
pages/gather/gather.vue
View File

@ -1,19 +1,194 @@
<style lang="scss" scoped>
.gather {
.gather-header {
background-color: #40AE36;
.location {
height: 98rpx;
padding: 0 28rpx;
.box {
height: 98rpx;
}
.town_name {
color: #fff;
margin-left: 18rpx;
font-size: 30rpx;
}
}
}
.swiperBg {
z-index: 1;
.colorBg {
position: absolute;
left: 0;
top: 0;
height: 130rpx;
width: 100%;
}
.page_swiper {
position: relative;
width: 100%;
height: auto;
margin: 0 auto;
border-radius: 10rpx;
overflow-x: hidden;
z-index: 8;
padding: 0 10rpx;
swiper-item {
border-radius: 10rpx;
}
.swiper-item,
image,
.acea-row.row-between-wrapper {
width: 100%;
margin: 0 auto;
border-radius: 10rpx;
}
swiper {
width: 100%;
display: block;
height: auto;
&.scalex {
/deep/.uni-swiper-slide-frame {
transform: translate(0, 0) !important;
}
}
}
image {
transform: scale(0.93);
transition: all 0.6s ease;
}
swiper-item.active,
swiper-item.scalex {
image {
transform: scale(1);
}
}
/*用来包裹所有的小圆点 */
.dots {
width: 156rpx;
height: 36rpx;
display: flex;
flex-direction: row;
position: absolute;
left: 320rpx;
bottom: 0;
}
/*未选中时的小圆点样式 */
.dot {
width: 16rpx;
height: 6rpx;
border-radius: 6rpx;
margin-right: 6rpx;
background-color: rgba(255, 255, 255, .4);
/*选中以后的小圆点样式 */
&.active {
width: 32rpx;
height: 6rpx;
background-color: rgba(255, 255, 255, .4);
}
}
}
}
.title-img {
display: flex;
align-items: center;
justify-content: center;
height: 68rpx;
margin-bottom: 40rpx;
image {
width: 340rpx;
height: 42rpx;
}
.title {
height: 42rpx;
padding: 0 80rpx;
font-size: 34rpx;
color: $theme-color;
font-weight: bold;
background-repeat: no-repeat;
background-size: 100% auto;
background-position: left center;
}
}
}
</style>
<template> <template>
<view class="gather"> <view class="gather">
<u-empty :show="jurisdiction" mode="permission" :text="emptyText"
icon="http://cdn.uviewui.com/uview/empty/permission.png"></u-empty> <!--顶部定位-->
<view class="business com special_work" v-if="jurisdiction == false"> <view class="gather-header">
<view class="title project"> <view style="height: var(--status-bar-height);"></view>
<view>更多功能</view> <view class="location">
<view v-if="!editFlag" class="edit" @click="editFlag = true">编辑</view> <view class="box flex_a_c_j_sb">
<view v-else class="edit" @click="editComfirm">完成</view> <view class="place_wrapper flex_a_c" @click="changeMap">
<view class="iconfont icon-weizhi" style="color:#fff;font-size:40rpx;"></view>
<view class="town_name">{{street||'定位中' }}</view>
</view> </view>
<view class="flex_a_c_j_sb">
<navigator style="margin-right: 30rpx;" url="/pages/chat/customer_list/index?type=0"
hover-class="none">
<view class="iconfont icon-saoma" style="color:#fff;font-size:40rpx;"> </view>
</navigator>
<navigator url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-xiaoxi" style="color:#fff;font-size:40rpx;"> </view>
</navigator>
</view>
</view>
</view>
</view>
<!--轮播图-->
<view class="swiperBg">
<view class="swiper page_swiper">
<swiper :autoplay="false" :circular="circular" :interval="intervals" :duration="duration"
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff" :current="swiperCur"
style="height:330rpx;margin: 0 auto;width:710rpx;" @change="swiperChange"
:class="{ scalex:isScale }">
<block v-for="(item,index) in imgUrls" :key="index">
<swiper-item :class="{ active: index == swiperCur,scalex:isScale }">
<view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'>
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e2f0520240203154207556.png"
class="slide-image aa" style="height:330rpx;" mode="aspectFill">
</image>
</view>
</swiper-item>
</block>
</swiper>
<view class="dots">
<block v-for="(item,index) in imgUrls" :key="index">
<view class="dot" :class="index == swiperCur ? ' active' : ''"></view>
</block>
</view>
</view>
</view>
<view class="title-img">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/807b8202403111125379295.webp" mode=""></image>
</view>
<view class="business com special_work" v-if="jurisdiction == false">
<view class="content"> <view class="content">
<block v-if="nowMenuList.length > 0"> <block v-if="nowMenuList.length > 0">
<u-transition v-for="(item, index) in nowMenuList" :key="item.name" show> <u-transition v-for="(item, index) in nowMenuList" :key="item.name" show>
<view class="examine" @click=" <view class="examine" @click="editFlag ? removeMenu(item) : clickMenu(item)">
editFlag ? removeMenu(item) : clickMenu(item)
">
<image class="icon_img" :src="item.pic" mode="aspectFit"> <image class="icon_img" :src="item.pic" mode="aspectFit">
</image> </image>
<u-icon v-if="editFlag" class="icon" name="minus-circle-fill" color="red"></u-icon> <u-icon v-if="editFlag" class="icon" name="minus-circle-fill" color="red"></u-icon>
@ -21,8 +196,15 @@
</view> </view>
</u-transition> </u-transition>
</block> </block>
<view v-else-if="!editFlag" @click="editFlag = true" <view class="add-box examine"
style="text-align: center; width: 100%; color: #aaa">还没有应用,点我添加应用</view> style="display: flex;justify-content: center;flex-direction: column;align-items: center;"
@click="editFlag = true">
<view class="add-box-icon"
style="margin-bottom: 14rpx; width:84rpx;height:84rpx;border: 2rpx solid #40AE36;border-radius: 10rpx;display: flex;justify-content: center;align-items: center;">
<u-icon name="plus" size="25" :bold="true" color="#40AE36"></u-icon>
</view>
<text>添加应用</text>
</view>
</view> </view>
</view> </view>
<view v-if="editFlag" class="business com special_work edit_card"> <view v-if="editFlag" class="business com special_work edit_card">
@ -65,6 +247,9 @@
export default { export default {
data() { data() {
return { return {
imgUrls: [{
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e2f0520240203154207556.png'
}],
locationArr: ({}), locationArr: ({}),
isshow: false, isshow: false,
emptyText: '暂无可用应用', emptyText: '暂无可用应用',
@ -95,8 +280,7 @@
...mapGetters(['userInfo', 'location', 'isLogin']) ...mapGetters(['userInfo', 'location', 'isLogin'])
}, },
created() {}, created() {},
onLoad() { onLoad() {},
},
onShow() { onShow() {
if (this.isLogin) { if (this.isLogin) {
this.emptyText = '暂无可用应用' this.emptyText = '暂无可用应用'
@ -112,8 +296,7 @@
this.getUserInfo() this.getUserInfo()
uni.stopPullDownRefresh() uni.stopPullDownRefresh()
}, },
beforeDestroy() { beforeDestroy() {},
},
mounted() { mounted() {
}, },
@ -529,37 +712,37 @@
transform: rotate(360deg); transform: rotate(360deg);
} }
.location { // .location {
background-color: #f6f6f6; // background-color: #f6f6f6;
width: 680rpx; // width: 680rpx;
height: 150rpx; // height: 150rpx;
position: absolute; // position: absolute;
top: 0; // top: 0;
z-index: 9999; // z-index: 9999;
border-radius: 20rpx; // border-radius: 20rpx;
left: 50%; // left: 50%;
margin-left: -340rpx; // margin-left: -340rpx;
margin-top: 80rpx; // margin-top: 80rpx;
padding-left: 20rpx; // padding-left: 20rpx;
.locationa { // .locationa {
font-size: 28rpx; // font-size: 28rpx;
color: #000; // color: #000;
font-weight: 500; // font-weight: 500;
margin-top: 30rpx; // margin-top: 30rpx;
margin-bottom: 15rpx; // margin-bottom: 15rpx;
} // }
.locationb { // .locationb {
font-size: 20rpx; // font-size: 20rpx;
color: #5a5a5a; // color: #5a5a5a;
} // }
.locationx { // .locationx {
color: #000; // color: #000;
position: absolute; // position: absolute;
top: 10rpx; // top: 10rpx;
right: 20rpx; // right: 20rpx;
} // }
} // }
</style> </style>

565
pages/gather/gather_backup.vue Normal file
View File

@ -0,0 +1,565 @@
<template>
<view class="gather">
<u-empty :show="jurisdiction" mode="permission" :text="emptyText"
icon="http://cdn.uviewui.com/uview/empty/permission.png"></u-empty>
<view class="business com special_work" v-if="jurisdiction == false">
<view class="title project">
<view>更多功能</view>
<view v-if="!editFlag" class="edit" @click="editFlag = true">编辑</view>
<view v-else class="edit" @click="editComfirm">完成</view>
</view>
<view class="content">
<block v-if="nowMenuList.length > 0">
<u-transition v-for="(item, index) in nowMenuList" :key="item.name" show>
<view class="examine" @click="
editFlag ? removeMenu(item) : clickMenu(item)
">
<image class="icon_img" :src="item.pic" mode="aspectFit">
</image>
<u-icon v-if="editFlag" class="icon" name="minus-circle-fill" color="red"></u-icon>
<text class="text">{{ item.name }}</text>
</view>
</u-transition>
</block>
<view v-else-if="!editFlag" @click="editFlag = true"
style="text-align: center; width: 100%; color: #aaa">还没有应用,点我添加应用</view>
</view>
</view>
<view v-if="editFlag" class="business com special_work edit_card">
<view class="title project" style="padding: 0 28rpx">
<view>编辑功能</view>
<view class="edit2" @click="editComfirm">完成</view>
</view>
<view class="content">
<u-transition v-for="(item, index) in AllMenuList" :key="item.name" show>
<view class="examine" @click="pushMenu(item)">
<image class="icon_img" :src="item.pic" mode="aspectFit"> </image>
<u-icon class="icon" name="plus-circle-fill"></u-icon>
<text class="text">{{ item.name }}</text>
</view>
</u-transition>
</view>
</view>
</view>
</template>
<script>
import {
mapState,
mapGetters
} from 'vuex'
import {
getStoreList,
getUserInfo
} from '@/api/user.js'
import {
Toast
} from '@/libs/uniApi';
import {
applet
} from '@/api/public.js';
// #ifdef APP-PLUS
import uniMP from '@/utils/uniMP.js';
// #endif
export default {
data() {
return {
locationArr: ({}),
isshow: false,
emptyText: '暂无可用应用',
jurisdiction: false, // 是否有权限
mer_id: '',
userInfoData: {
mer_info: {
type_id: 0
}
},
prefix: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/11/',
isShow: false,
isFshow: false,
street: '',
// 编辑中标记
editFlag: false,
// 所有菜单的按钮
AllMenuList: [],
nowMenuList: [],
street: '',
showPicker: false,
columnData: [],
isFshow: false,
backColor: 'rgba(252, 252, 252, 0)'
};
},
computed: {
...mapGetters(['userInfo', 'location', 'isLogin'])
},
created() {},
onLoad() {
},
onShow() {
if (this.isLogin) {
this.emptyText = '暂无可用应用'
this.jurisdiction = false
this.initAllAppLet();
} else {
this.emptyText = '请登录'
this.jurisdiction = true
}
this.getUserInfo();
},
onPullDownRefresh() {
this.getUserInfo()
uni.stopPullDownRefresh()
},
beforeDestroy() {
},
mounted() {
},
// #ifdef APP-PLUS
onPageScroll(e) {
const scrollTop = e.scrollTop;
if (scrollTop <= 20) {
this.backColor = 'rgba(252, 252, 252, 0)'
this.isFshow = false
} else if (20 < scrollTop && scrollTop <= 100) {
this.backColor = 'rgba(252, 252, 252, .5)'
this.isFshow = true
} else if (scrollTop > 100) {
this.backColor = 'rgba(252, 252, 252, 1)'
this.isFshow = true
}
},
// #endif
onHide() {
uni.$emit('showLoading', false);
},
methods: {
scrolling() {
// 滚动条距文档顶部的距离
let scrollTop =
window.pageYOffset ||
document.documentElement.scrollTop ||
document.body.scrollTop;
// 滚动条滚动的距离
let scrollStep = scrollTop - this.oldScrollTop;
// console.log("header 滚动距离 ", scrollTop);
// 更新——滚动前，滚动条距文档顶部的距离
this.oldScrollTop = scrollTop;
//变量windowHeight是可视区的高度
let windowHeight =
document.documentElement.clientHeight || document.body.clientHeight;
//变量scrollHeight是滚动条的总高度
let scrollHeight =
document.documentElement.scrollHeight || document.body.scrollHeight;
//滚动条到底部的条件
if (scrollTop + windowHeight == scrollHeight) {
//你想做的事情
// console.log("header 你已经到底部了");
}
if (scrollTop <= 20) {
this.backColor = 'rgba(252, 252, 252, 0)'
this.isFshow = false
} else if (20 < scrollTop && scrollTop <= 100) {
this.backColor = 'rgba(252, 252, 252, .5)'
this.isFshow = true
} else if (scrollTop > 100) {
this.backColor = 'rgba(252, 252, 252, 1)'
this.isFshow = true
}
},
initAllAppLet(){
applet().then(res=>{
this.AllMenuList = res.data;
this.initMenu();
// this.showControllerAllLet();
}).catch(e=>{
console.log(e);
})
},
// 根据类型来判断是否显示
showControllerAllLet() {
let user;
if (typeof this.$store.state.app.userInfo == 'string') {
user = JSON.parse(this.$store.state.app.userInfo)
} else user = JSON.parse(JSON.stringify(this.$store.state.app.userInfo))
if (user?.show_controller_applet) {
this.AllMenuList.push({
name: '大屏控制',
icon: '/static/applet/dp.png',
data: {
id: '__UNI__83ABA97',
url: 'https://ceshi-worker-task.lihaink.cn/uploads/files/20231016/20231016112144fac6d9128.wgt',
},
type: 4,
})
}
},
// 初始化菜单
initMenu() {
let nowMenu = uni.getStorageSync('gatherMenuList');
try {
let list = JSON.parse(nowMenu||'[]');
let now = [];
let all = [];
this.AllMenuList.forEach((item) => {
if(list.find(t => t.name == item.name)?.name != item.name) all.push(item);
else now.push(item)
})
this.AllMenuList = all;
this.nowMenuList = now;
} catch (e) {
this.nowMenuList = [];
console.log(e);
}
},
clickMenu(data) {
this.getUniMp(data);
},
// 添加菜单
pushMenu(data) {
this.nowMenuList.push(data);
this.AllMenuList = this.AllMenuList.filter((item) => {
return item.name != data.name;
})
},
// 移除菜单
removeMenu(data) {
this.AllMenuList.push(data);
this.nowMenuList = this.nowMenuList.filter((item) => {
return item.name != data.name;
})
},
// 编辑完成
editComfirm() {
this.editFlag = false;
uni.setStorageSync('gatherMenuList', JSON.stringify(this.nowMenuList));
},
getUniMp(data) {
let that = this;
// #ifdef APP-PLUS
if(data.version) return uniMP.loadAppletMP(data);
else switch (data.type) {
case 1:
uniMP.loadMP(data.data);
break;
case 2:
uniMP.loadMPx(data.data);
break;
case 3:
uniMP.loadMPurl(data.data);
break;
case 4:
uniMP.loadMPdns(data.data);
break;
}
return;
// #endif
// #ifdef H5
// if (type == 2) {
// this.navigator(`/pages/moreProject/moreProject`);
// } else {
// uni.showToast({
// icon: 'none',
// title: 'H5不支持打开小程序'
// })
// }
uni.showToast({
icon: 'none',
title: 'H5不支持打开小程序'
})
// #endif
},
navigator(url, t) {
// if (this.userInfoData.is_wsxx === 0 && t != '商户设置') return Toast("请完善商户信息");
uni.navigateTo({
url: url
})
},
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.userInfoData = res.data;
that.$store.commit('SET_USERINFO', res.data);
// console.log(res.data.service);
if (res.data.service == null) {
// console.log('123');
this.isShow = false
} else {
this.isShow = true
this.mer_id = res.data.service.mer_id
}
if (!res.data.mer_info) {
that.$set(this, 'jurisdiction', false);
}
});
},
}
};
</script>
<style lang="scss" scoped>
.gather {
padding-bottom: 164.91rpx;
background: linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
position: relative;
}
.sitebox {
animation-name: fadeIn;
animation-duration: 3s;
animation-fill-mode: forwards;
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.site-box1 {
width: 706rpx;
/* #ifdef MP || APP-PLUS */
height: 160rpx;
/* #endif */
/* #ifdef H5 */
height: 120rpx;
/* #endif */
margin-bottom: 26.32rpx;
position: absolute;
top: 45rpx;
left: 20rpx;
z-index: 999;
// 位置
.place_wrapper {
color: #fff;
margin-right: 0rpx;
font-size: 30rpx;
.town_name {
margin-left: 21rpx;
}
}
.iconfont {
font-size: 35.09rpx;
}
}
.site-box {
width: 100%;
/* #ifdef MP || APP-PLUS */
height: 160rpx;
/* #endif */
/* #ifdef H5 */
height: 120rpx;
/* #endif */
margin-bottom: 26.32rpx;
position: absolute;
top: 0rpx;
position: fixed;
z-index: 999;
/* #ifdef MP || APP-PLUS */
padding-top: 75rpx;
/* #endif */
/* #ifdef H5 */
padding-top: 25rpx;
/* #endif */
// background-color: #e5e5e5;
// background: url("@/static/images/bg2.png") no-repeat;
background-size: 100% 100%;
padding-right: 20rpx;
// 位置
.place_wrapper {
color: #fff;
margin-right: 24.56rpx;
font-size: 30rpx;
opacity: 0;
.town_name {
margin-left: 21rpx;
}
}
.iconfont {
opacity: 0;
font-size: 30rpx;
font-size: 35.09rpx;
}
}
.top_box {
// padding-top: 180rpx;
background: linear-gradient(#36a2ff, #fff);
}
.com {
margin-left: 50%;
transform: translate(-50%);
}
.business {
width: 694.74rpx;
// margin-bottom: 175rpx;
}
.special_work {
// padding: 17.54rpx;
width: 694.74rpx;
padding-top: 30rpx;
border-radius: 17.54rpx;
// box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.16);
.title {
font-size: 31.58rpx;
font-weight: 700;
margin-bottom: 38.6rpx;
}
.project {
display: flex;
justify-content: space-between;
align-items: flex-end;
.edit {
font-size: 26rpx;
font-weight: 400;
&::after {
content: ">";
margin-left: 10rpx;
}
}
.edit2 {
font-size: 26rpx;
font-weight: 400;
}
}
.content {
display: flex;
align-content: center;
flex-wrap: wrap;
// justify-content: space-between;
.examine {
margin-bottom: 35rpx;
width: 173.68rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
// margin: 0 0 33.33rpx 33.33rpx !important;
.icon_img {
width: 83.16rpx;
height: 83.16rpx;
}
.icon {
position: absolute;
top: -5rpx;
right: 25rpx;
}
.text {
font-size: 26.32rpx;
margin-top: 21.05rpx;
color: #000;
}
}
.text {
font-size: 29.82rpx;
color: #a4a4a4;
}
}
.cont_jus {
margin-top: 56.14rpx;
justify-content: flex-start;
&:first-child {
// margin-right: 33rpx;
}
.examine {
margin-right: 48rpx;
&:first-child {
margin-right: 48rpx;
}
}
}
}
.edit_card {
background-color: #fff;
padding-top: 28rpx;
}
.rotate-box {
transform: rotate(0deg);
transition: transform .5s ease-out;
}
.rotate-box:active {
transform: rotate(360deg);
}
.location {
background-color: #f6f6f6;
width: 680rpx;
height: 150rpx;
position: absolute;
top: 0;
z-index: 9999;
border-radius: 20rpx;
left: 50%;
margin-left: -340rpx;
margin-top: 80rpx;
padding-left: 20rpx;
.locationa {
font-size: 28rpx;
color: #000;
font-weight: 500;
margin-top: 30rpx;
margin-bottom: 15rpx;
}
.locationb {
font-size: 20rpx;
color: #5a5a5a;
}
.locationx {
color: #000;
position: absolute;
top: 10rpx;
right: 20rpx;
}
}
</style>

261
pages/index/component/homeComb.vue
View File

@ -1,140 +1,39 @@
<template> <template>
<view class="page_count"> <view class="page_count">
<view class="bg-img"> <!--顶部定位-->
<img :src="bgColor" alt=""> <view class="my-main header">
</view>
<!--搜索-->
<view :class="{scrolled:isScrolled}" class="my-main">
<view style="height: var(--status-bar-height);"></view> <view style="height: var(--status-bar-height);"></view>
<view class="location"> <view class="location">
<view class="box flex_a_c_j_sb"> <view class="box flex_a_c_j_sb">
<view class="place_wrapper flex_a_c" @click="changeMap"> <view class="place_wrapper flex_a_c" @click="changeMap">
<view class="iconfont icon-weizhi" style="color:#fff;"></view> <view class="iconfont icon-weizhi" style="color:#fff;font-size:40rpx;"></view>
<view class="town_name">{{street||'定位中' }}</view> <view class="town_name">{{street||'定位中' }}</view>
</view> </view>
<view class="flex_a_c_j_sb"> <view class="flex_a_c_j_sb">
<navigator style="margin-right: 30rpx;" url="/pages/chat/customer_list/index?type=0" hover-class="none"> <navigator style="margin-right: 30rpx;" url="/pages/chat/customer_list/index?type=0"
<view class="iconfont icon-saoma" style="color:#fff;"> </view> hover-class="none">
<view class="iconfont icon-saoma" style="color:#fff;font-size:40rpx;"> </view>
</navigator> </navigator>
<navigator url="/pages/chat/customer_list/index?type=0" hover-class="none"> <navigator url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-xiaoxi" style="color:#fff;"> </view> <view class="iconfont icon-xiaoxi" style="color:#fff;font-size:40rpx;"> </view>
</navigator> </navigator>
</view> </view>
</view> </view>
</view>
<!-- #ifdef H5 -->
<view>
<view class="header">
<view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view>
<view class="serch-box tui-skeleton">
<view class="serch-wrapper flex">
<view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view>
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect box">
<view class='swiperTxt'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
circular="true" @change="textChange">
<block v-for="(item,index) in hotWords" :key='index'>
<swiper-item catchtouchmove='catchTouchMove'>
<view class='acea-row row-between-wrapper'>
<view class='text acea-row row-between-wrapper'>
<view class='newsTitle line1'>{{item.val}}</view>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<text class="iconfont icon-xiazai5"></text>
</navigator>
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect">
搜索商品
<text class="iconfont icon-xiazai5"></text>
</navigator>
<!-- <navigator class="btn skeleton-rect" url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-xiaoxi" style="color:#fff;"></view>
<text class="iconnum" v-if="userInfo.total_unread">{{ userInfo.total_unread }}</text>
</navigator> -->
</view>
</view>
</view>
<view :style="'height:'+isTop+'px'"></view>
</view>
<!-- #endif -->
<!-- #ifdef MP || APP-PLUS -->
<view>
<view class="mp-header" id="home">
<!-- <view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view> -->
<view class="serch-box tui-skeleton">
<view class="serch-wrapper flex">
<!-- <view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view> -->
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect box">
<view class='swiperTxt'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
circular="true" @change="textChange">
<block v-for="(item,index) in hotWords" :key='index'>
<swiper-item catchtouchmove='catchTouchMove'>
<view class='acea-row row-between-wrapper'>
<view class='text acea-row row-between-wrapper'>
<view class='newsTitle line1'>{{item.val}}</view>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<text class="iconfont icon-xiazai5"></text>
</navigator>
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect">
搜索商品
<text class="iconfont icon-xiazai5"></text>
</navigator>
</view>
</view>
</view>
<view :style="'height:'+(marTop + 10)+'px;'"></view>
<!-- <view :style="'height:'+statusBarHeight"></view> -->
</view>
<!-- #endif -->
<!--选项卡-->
<view v-if="tabTitle.length>0" style="visibility: hidden;" :style="{ height: navHeight + 'px' }"></view>
<view v-if="tabTitle.length>0" class="navTabBox tabNav" :class="{bgwhite:isScrolled}" :style="'top:'+isTop+'px'">
<view class="longTab" :style='"width:"+mainWidth+"px"'>
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;" scroll-with-animation :scroll-left="tabLeft" show-scrollbar="true">
<view class="longItem" :data-index="index" :class="index===tabClick?'click':''" @click="changeTab(item,index)" v-for="(item,index) in tabTitle" :key="index" :id="'id'+index">{{item.info[0].value}}</view>
<view class="underlineBox" :style='"transform:translateX("+isLeft+"px);width:"+isWidth+"px"'>
<view class="underline"></view>
</view>
</scroll-view>
</view>
</view> </view>
</view> </view>
<!--轮播图--> <!--轮播图-->
<view class="swiperBg" :style="{ marginTop: swiperTop+'px'}"> <view class="swiperBg" :style="{ marginTop: (swiperTop + 15)+'px'}">
<view style="height: 50rpx;"></view>
<block>
<view class="swiper page_swiper" v-if="imgUrls.length"> <view class="swiper page_swiper" v-if="imgUrls.length">
<swiper <swiper :autoplay="false" :circular="circular" :interval="intervals" :duration="duration"
:autoplay="true" indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff" :current="swiperCur"
:circular="circular" style="height:330rpx;margin: 0 auto;width:710rpx;" @change="swiperChange"
:interval="intervals" :class="{ scalex:isScale }">
:duration="duration"
indicator-color="rgba(255,255,255,0.6)"
indicator-active-color="#fff"
:current="swiperCur"
previous-margin="30rpx"
next-margin="30rpx"
:style="'height:'+(imageH+10)+'rpx;'"
@change="swiperChange"
:class="{ scalex:isScale }"
>
<block v-for="(item,index) in imgUrls" :key="index"> <block v-for="(item,index) in imgUrls" :key="index">
<swiper-item :class="{ active: index == swiperCur,scalex:isScale }"> <swiper-item :class="{ active: index == swiperCur,scalex:isScale }">
<view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'> <view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'>
<image :src="item.img" class="slide-image aa" :style="'height:'+ imageH +'rpx;'" mode="aspectFill"></image> <image :src="item.img" class="slide-image aa" style="height:330rpx;" mode="aspectFill">
</image>
</view> </view>
</swiper-item> </swiper-item>
</block> </block>
@ -145,7 +44,6 @@
</block> </block>
</view> </view>
</view> </view>
</block>
</view> </view>
</view> </view>
</template> </template>
@ -162,7 +60,9 @@
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px'; let statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
import { configMap } from '@/utils'; import {
configMap
} from '@/utils';
export default { export default {
name: 'homeComb', name: 'homeComb',
props: { props: {
@ -187,7 +87,9 @@
default: () => {} default: () => {}
}, },
}, },
computed: configMap({site_logo: ''}), computed: configMap({
site_logo: ''
}),
data() { data() {
return { return {
statusBarHeight: statusBarHeight, statusBarHeight: statusBarHeight,
@ -290,7 +192,11 @@
if (that.tabTitle.length > 0 && that.tabTitle[0]['value'] != '推荐') { if (that.tabTitle.length > 0 && that.tabTitle[0]['value'] != '推荐') {
that.tabTitle.unshift({ that.tabTitle.unshift({
img: '', img: '',
info: [{value: "推荐"},{value: false}] info: [{
value: "推荐"
}, {
value: false
}]
}) })
} }
that.$nextTick(function() { that.$nextTick(function() {
@ -323,14 +229,20 @@
else return url.replace('http://', 'https://'); else return url.replace('http://', 'https://');
}, },
swiperChange(e) { swiperChange(e) {
let { current, source } = e.detail; let {
current,
source
} = e.detail;
if (source === 'autoplay' || source === 'touch') { if (source === 'autoplay' || source === 'touch') {
this.swiperCur = e.detail.current; this.swiperCur = e.detail.current;
this.bgColor = this.imgUrls[e.detail.current]['img'] this.bgColor = this.imgUrls[e.detail.current]['img']
} }
}, },
textChange(e) { textChange(e) {
let { current, source } = e.detail; let {
current,
source
} = e.detail;
if (source === 'autoplay' || source === 'touch') { if (source === 'autoplay' || source === 'touch') {
this.searchVal = this.hotWords[e.detail.current]['val'] this.searchVal = this.hotWords[e.detail.current]['val']
} }
@ -346,7 +258,9 @@
this.isLeft = index * this.isWidth + 16 //设置下划线位置 this.isLeft = index * this.isWidth + 16 //设置下划线位置
this.tabId = item.info[1].value this.tabId = item.info[1].value
this.bgColor = this.tabId ? item.img : this.dataConfig.swiperConfig.list[0]['img'] this.bgColor = this.tabId ? item.img : this.dataConfig.swiperConfig.list[0]['img']
this.imgUrls = this.tabId ? [{img:item.img}] : this.dataConfig.swiperConfig.list this.imgUrls = this.tabId ? [{
img: item.img
}] : this.dataConfig.swiperConfig.list
this.$emit('changeDiy', this.tabId); this.$emit('changeDiy', this.tabId);
} }
}, },
@ -357,6 +271,7 @@
.page_count { .page_count {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
.bg-img { .bg-img {
position: absolute; position: absolute;
width: 100%; width: 100%;
@ -371,6 +286,7 @@
z-index: 0; z-index: 0;
filter: blur(0); filter: blur(0);
overflow: hidden; overflow: hidden;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -379,45 +295,61 @@
} }
} }
} }
.my-main { .my-main {
// transition: background-color .5s ease; background-color: #40AE36;
.location { .location {
padding: 10rpx 28rpx 0 28rpx; padding: 0 28rpx;
.box {
height: 98rpx;
}
.town_name { .town_name {
color: #fff; color: #fff;
margin-left: 18rpx; margin-left: 18rpx;
font-size: 30rpx;
} }
} }
} }
.swiperTxt { .swiperTxt {
width: 300rpx; width: 300rpx;
line-height: 64rpx; line-height: 64rpx;
height: 64rpx; height: 64rpx;
overflow: hidden; overflow: hidden;
} }
.swiperTxt .text { .swiperTxt .text {
width: 480rpx; width: 480rpx;
} }
.swiperTxt .text .newsTitle { .swiperTxt .text .newsTitle {
width: 300rpx; width: 300rpx;
font-size: 24rpx; font-size: 24rpx;
color: #ffffff; color: #ffffff;
} }
.swiperTxt swiper { .swiperTxt swiper {
height: 100%; height: 100%;
} }
.header { .header {
z-index: 99; z-index: 99;
position: fixed; position: fixed;
left: 0; left: 0;
width: 100%; width: 100%;
.btn { .btn {
position: relative; position: relative;
margin-left: 30rpx; margin-left: 30rpx;
.iconfont { .iconfont {
font-size: 45rpx; font-size: 45rpx;
} }
} }
.iconnum { .iconnum {
min-width: 14rpx; min-width: 14rpx;
color: #E93323; color: #E93323;
@ -429,21 +361,27 @@
font-size: 10px; font-size: 10px;
padding: 0 5px; padding: 0 5px;
} }
.serch-wrapper { .serch-wrapper {
align-items: center; align-items: center;
padding: 20rpx 30rpx 20rpx 30rpx; padding: 20rpx 30rpx 20rpx 30rpx;
.logo { .logo {
width: 133rpx; width: 133rpx;
margin-right: 20rpx; margin-right: 20rpx;
} }
image { image {
width: 133rpx; width: 133rpx;
height: 66rpx; height: 66rpx;
} }
.box { .box {
flex: 1; flex: 1;
} }
.input,.uninput {
.input,
.uninput {
line-height: 64rpx; line-height: 64rpx;
height: 64rpx; height: 64rpx;
padding: 0 0 0 30rpx; padding: 0 0 0 30rpx;
@ -454,6 +392,7 @@
z-index: 2; z-index: 2;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
.iconfont { .iconfont {
position: absolute; position: absolute;
right: 20rpx; right: 20rpx;
@ -463,33 +402,41 @@
} }
} }
} }
.mp-header { .mp-header {
z-index: 99; z-index: 99;
position: fixed; position: fixed;
left: 0; left: 0;
width: 100%; width: 100%;
.box { .box {
flex: 1; flex: 1;
} }
.serch-box { .serch-box {
margin-top: 10rpx; margin-top: 10rpx;
} }
.serch-wrapper { .serch-wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
// padding: 0 50rpx 20rpx 30rpx; // padding: 0 50rpx 20rpx 30rpx;
padding: 0 28rpx; padding: 0 28rpx;
height: 76rpx; height: 76rpx;
.logo { .logo {
width: 133rpx; width: 133rpx;
margin-right: 20rpx; margin-right: 20rpx;
line-height: 0; line-height: 0;
} }
image { image {
width: 118rpx; width: 118rpx;
height: 42rpx; height: 42rpx;
} }
.input,.uninput {
.input,
.uninput {
display: flex; display: flex;
/* #ifdef MP */ /* #ifdef MP */
flex: 0; flex: 0;
@ -508,6 +455,7 @@
font-size: 28rpx; font-size: 28rpx;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
.iconfont { .iconfont {
position: absolute; position: absolute;
right: 20rpx; right: 20rpx;
@ -515,19 +463,24 @@
color: #eeeeee; color: #eeeeee;
} }
} }
/* #ifdef MP */ /* #ifdef MP */
.uninput { .uninput {
max-width: 500rpx; max-width: 500rpx;
} }
.input { .input {
max-width: 340rpx; max-width: 340rpx;
} }
/* #endif */ /* #endif */
} }
} }
.tabNav { .tabNav {
padding-top: 10rpx; padding-top: 10rpx;
} }
.navTabBox { .navTabBox {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
padding: 0 30rpx; padding: 0 30rpx;
@ -536,14 +489,17 @@
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
position: fixed; position: fixed;
scroll-view { scroll-view {
width: 100%; width: 100%;
padding-right: 30rpx; padding-right: 30rpx;
height: 70rpx; height: 70rpx;
} }
.click { .click {
color: white; color: white;
} }
.longTab { .longTab {
.longItem { .longItem {
height: 50upx; height: 50upx;
@ -555,13 +511,16 @@
max-width: 160rpx; max-width: 160rpx;
margin-right: 30rpx; margin-right: 30rpx;
position: relative; position: relative;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
&.click { &.click {
font-weight: bold; font-weight: bold;
font-size: 30rpx; font-size: 30rpx;
color: #FFFFFF; color: #FFFFFF;
&::after { &::after {
content: ''; content: '';
transition: .5s; transition: .5s;
@ -577,6 +536,7 @@
} }
} }
} }
.scrolled { .scrolled {
z-index: 5000; z-index: 5000;
position: fixed; position: fixed;
@ -586,36 +546,49 @@
width: 100%; width: 100%;
// background: #fff!important; // background: #fff!important;
background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/23bd9202402271611232730.png'); background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/23bd9202402271611232730.png');
background-color: #f1f1f1; /* 设置背景色 */ background-color: #f1f1f1;
background-size: 100% 100%; /* 让背景图片铺满整个盒子 */ /* 设置背景色 */
background-repeat: no-repeat; /* 不重复 */ background-size: 100% 100%;
/* 让背景图片铺满整个盒子 */
background-repeat: no-repeat;
/* 不重复 */
transition: background-color .5s ease; transition: background-color .5s ease;
.longItem,.click,.category text{
.longItem,
.click,
.category text {
color: #000000 !important; color: #000000 !important;
} }
.navTabBox,.mp-header,.header{
.navTabBox,
.mp-header,
.header {
// transition: background-color .5s ease; // transition: background-color .5s ease;
// background: #ffffff; // background: #ffffff;
} }
.btn .iconfont { .btn .iconfont {
color: #333333 !important; color: #333333 !important;
} }
.iconnum { .iconnum {
background: #333333 !important; background: #333333 !important;
} }
.underline { .underline {
background: #000000 !important; background: #000000 !important;
} }
.click { .click {
&::after { &::after {
background-color: #fff !important; background-color: #fff !important;
} }
} }
} }
.swiperBg { .swiperBg {
z-index: 1; z-index: 1;
margin-top: 10rpx;
padding-bottom: 30rpx;
.colorBg { .colorBg {
position: absolute; position: absolute;
left: 0; left: 0;
@ -623,6 +596,7 @@
height: 130rpx; height: 130rpx;
width: 100%; width: 100%;
} }
.page_swiper { .page_swiper {
position: relative; position: relative;
width: 100%; width: 100%;
@ -632,33 +606,43 @@
overflow-x: hidden; overflow-x: hidden;
z-index: 8; z-index: 8;
padding: 0 10rpx; padding: 0 10rpx;
swiper-item { swiper-item {
border-radius: 10rpx; border-radius: 10rpx;
} }
.swiper-item, image, .acea-row.row-between-wrapper {
.swiper-item,
image,
.acea-row.row-between-wrapper {
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
border-radius: 10rpx; border-radius: 10rpx;
} }
swiper { swiper {
width: 100%; width: 100%;
display: block; display: block;
height: auto; height: auto;
&.scalex { &.scalex {
/deep/.uni-swiper-slide-frame { /deep/.uni-swiper-slide-frame {
transform: translate(0, 0) !important; transform: translate(0, 0) !important;
} }
} }
} }
image { image {
transform: scale(0.93); transform: scale(0.93);
transition: all 0.6s ease; transition: all 0.6s ease;
} }
swiper-item.active, swiper-item.scalex{
swiper-item.active,
swiper-item.scalex {
image { image {
transform: scale(1); transform: scale(1);
} }
} }
/*用来包裹所有的小圆点 */ /*用来包裹所有的小圆点 */
.dots { .dots {
width: 156rpx; width: 156rpx;
@ -669,6 +653,7 @@
left: 320rpx; left: 320rpx;
bottom: 0; bottom: 0;
} }
/*未选中时的小圆点样式 */ /*未选中时的小圆点样式 */
.dot { .dot {
width: 16rpx; width: 16rpx;
@ -676,6 +661,7 @@
border-radius: 6rpx; border-radius: 6rpx;
margin-right: 6rpx; margin-right: 6rpx;
background-color: rgba(255, 255, 255, .4); background-color: rgba(255, 255, 255, .4);
/*选中以后的小圆点样式 */ /*选中以后的小圆点样式 */
&.active { &.active {
width: 32rpx; width: 32rpx;
@ -685,12 +671,15 @@
} }
} }
} }
/deep/.dot0 .uni-swiper-dots-horizontal { /deep/.dot0 .uni-swiper-dots-horizontal {
left: 10%; left: 10%;
} }
/deep/.dot1 .uni-swiper-dots-horizontal { /deep/.dot1 .uni-swiper-dots-horizontal {
left: 50%; left: 50%;
} }
/deep/.dot2 .uni-swiper-dots-horizontal { /deep/.dot2 .uni-swiper-dots-horizontal {
left: 90%; left: 90%;
} }

697
pages/index/component/homeComb_backup.vue Normal file
View File

@ -0,0 +1,697 @@
<template>
<view class="page_count">
<view class="bg-img">
<img :src="bgColor" alt="">
</view>
<!--搜索-->
<view :class="{scrolled:isScrolled}" class="my-main">
<view style="height: var(--status-bar-height);"></view>
<view class="location">
<view class="box flex_a_c_j_sb">
<view class="place_wrapper flex_a_c" @click="changeMap">
<view class="iconfont icon-weizhi" style="color:#fff;"></view>
<view class="town_name">{{street||'定位中' }}</view>
</view>
<view class="flex_a_c_j_sb">
<navigator style="margin-right: 30rpx;" url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-saoma" style="color:#fff;"> </view>
</navigator>
<navigator url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-xiaoxi" style="color:#fff;"> </view>
</navigator>
</view>
</view>
</view>
<!-- #ifdef H5 -->
<view>
<view class="header">
<view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view>
<view class="serch-box tui-skeleton">
<view class="serch-wrapper flex">
<view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view>
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect box">
<view class='swiperTxt'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
circular="true" @change="textChange">
<block v-for="(item,index) in hotWords" :key='index'>
<swiper-item catchtouchmove='catchTouchMove'>
<view class='acea-row row-between-wrapper'>
<view class='text acea-row row-between-wrapper'>
<view class='newsTitle line1'>{{item.val}}</view>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<text class="iconfont icon-xiazai5"></text>
</navigator>
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect">
搜索商品
<text class="iconfont icon-xiazai5"></text>
</navigator>
<!-- <navigator class="btn skeleton-rect" url="/pages/chat/customer_list/index?type=0" hover-class="none">
<view class="iconfont icon-xiaoxi" style="color:#fff;"></view>
<text class="iconnum" v-if="userInfo.total_unread">{{ userInfo.total_unread }}</text>
</navigator> -->
</view>
</view>
</view>
<view :style="'height:'+isTop+'px'"></view>
</view>
<!-- #endif -->
<!-- #ifdef MP || APP-PLUS -->
<view>
<view class="mp-header" id="home">
<!-- <view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view> -->
<view class="serch-box tui-skeleton">
<view class="serch-wrapper flex">
<!-- <view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view> -->
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect box">
<view class='swiperTxt'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
circular="true" @change="textChange">
<block v-for="(item,index) in hotWords" :key='index'>
<swiper-item catchtouchmove='catchTouchMove'>
<view class='acea-row row-between-wrapper'>
<view class='text acea-row row-between-wrapper'>
<view class='newsTitle line1'>{{item.val}}</view>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<text class="iconfont icon-xiazai5"></text>
</navigator>
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
hover-class="none" class="skeleton-rect">
搜索商品
<text class="iconfont icon-xiazai5"></text>
</navigator>
</view>
</view>
</view>
<view :style="'height:'+(marTop + 10)+'px;'"></view>
<!-- <view :style="'height:'+statusBarHeight"></view> -->
</view>
<!-- #endif -->
<!--选项卡-->
<view v-if="tabTitle.length>0" style="visibility: hidden;" :style="{ height: navHeight + 'px' }"></view>
<view v-if="tabTitle.length>0" class="navTabBox tabNav" :class="{bgwhite:isScrolled}" :style="'top:'+isTop+'px'">
<view class="longTab" :style='"width:"+mainWidth+"px"'>
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;" scroll-with-animation :scroll-left="tabLeft" show-scrollbar="true">
<view class="longItem" :data-index="index" :class="index===tabClick?'click':''" @click="changeTab(item,index)" v-for="(item,index) in tabTitle" :key="index" :id="'id'+index">{{item.info[0].value}}</view>
<view class="underlineBox" :style='"transform:translateX("+isLeft+"px);width:"+isWidth+"px"'>
<view class="underline"></view>
</view>
</scroll-view>
</view>
</view>
</view>
<!--轮播图-->
<view class="swiperBg" :style="{ marginTop: swiperTop+'px'}">
<view style="height: 50rpx;"></view>
<block>
<view class="swiper page_swiper" v-if="imgUrls.length">
<swiper
:autoplay="true"
:circular="circular"
:interval="intervals"
:duration="duration"
indicator-color="rgba(255,255,255,0.6)"
indicator-active-color="#fff"
:current="swiperCur"
previous-margin="30rpx"
next-margin="30rpx"
:style="'height:'+(imageH+10)+'rpx;'"
@change="swiperChange"
:class="{ scalex:isScale }"
>
<block v-for="(item,index) in imgUrls" :key="index">
<swiper-item :class="{ active: index == swiperCur,scalex:isScale }">
<view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'>
<image :src="item.img" class="slide-image aa" :style="'height:'+ imageH +'rpx;'" mode="aspectFill"></image>
</view>
</swiper-item>
</block>
</swiper>
<view class="dots">
<block v-for="(item,index) in imgUrls" :key="index">
<view class="dot" :class="index == swiperCur ? ' active' : ''"></view>
</block>
</view>
</view>
</block>
</view>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
import { configMap } from '@/utils';
export default {
name: 'homeComb',
props: {
dataConfig: {
type: Object,
default: () => {}
},
isScrolled: {
type: Boolean,
default: false
},
isScale: {
type: Boolean,
default: false
},
isMenu: {
type: Boolean,
default: false
},
userInfo: {
type: Object,
default: () => {}
},
},
computed: configMap({site_logo: ''}),
data() {
return {
statusBarHeight: statusBarHeight,
scrollHeight: 0,
autoplay: true,
interval: this.dataConfig.titleConfig.value * 1000 || 2500,
duration: 500,
marTop: 50,
searchH: 0,
logoConfig: this.dataConfig.logoConfig.url,
hotWords: this.dataConfig.hotWords.list || [],
tabClick: 0, //导航栏被点击
isLeft: 0, //导航栏下划线位置
isWidth: 0, //每个导航栏占位
mainWidth: 0,
tabLeft:0,
swiperIndex:0,
childIndex:0,
childID:0,
tabTitle:this.dataConfig.listConfig.list || [],
fixedTop: 0,
isTop: 0,
navHeight: 38,
indicatorDots: false,
circular: true,
autoplay: true,
intervals: 3000,
duration: 500,
imgUrls: [], //图片轮播数据
imageH: 0,
swiperCur: 0,
swiperType: 1,
searchVal: this.dataConfig.hotWords && this.dataConfig.hotWords.list[0]['val'] || '',
bgColor: this.dataConfig.swiperConfig.list && this.dataConfig.swiperConfig.list[0]['img'],
tabId: false,
isCategory: false,
swiperTop: 0,
isFixed: true,
street: ''
};
},
watch: {
imageH(nVal,oVal){
this.imageH = nVal
}
},
created() {
var that = this
// 获取设备宽度
uni.getSystemInfo({
success(e) {
that.mainWidth = e.windowWidth
that.isWidth = (e.windowWidth-65) / 8
}
})
setTimeout((e) => {
const query = uni.createSelectorQuery().in(this);
if(that.tabTitle.length>0){
query.select('.navTabBox').boundingClientRect(data => {
that.navHeight = data.height > 42 ? data.height : 42
}).exec();
}else{
that.navHeight = 0
}
// #ifdef H5
query.select('.header').boundingClientRect(data => {
that.isTop = data.height
that.marTop = data.height
}).exec();
// #endif
// #ifdef MP || APP-PLUS
// #ifdef APP-PLUS
const menuButton = 0
//#endif
// #ifdef MP
const menuButton = uni.getMenuButtonBoundingClientRect();
//#endif
query
.select('.serch-box')
.boundingClientRect(data => {
this.marTop = data.height
}).exec();
//#endif
}, 500)
that.isTop = (uni.getSystemInfoSync().statusBarHeight + this.marTop)
that.imgUrls = that.dataConfig.swiperConfig.list
that.$nextTick(function() {
setTimeout((e) => {
// #ifdef H5
that.swiperTop = that.navHeight+that.marTop
//#endif
// #ifdef MP || APP-PLUS
that.swiperTop = that.navHeight + uni.getSystemInfoSync().statusBarHeight + that.marTop
//#endif
}, 500)
})
},
mounted(){
let that = this;
if(that.tabTitle.length>0 && that.tabTitle[0]['value'] != '推荐'){
that.tabTitle.unshift({
img: '',
info: [{value: "推荐"},{value: false}]
})
}
that.$nextTick(function() {
uni.getImageInfo({
src: that.setDomain(that.imgUrls[0].img),
success: function(res) {
if (res && res.height > 0) {
let height = res.height * ((750-20) / res.width)
that.$set(that, 'imageH', height);
} else {
that.$set(that, 'imageH', 375);
}
},
fail: function(error) {
that.$set(that, 'imageH', 375);
}
})
})
},
methods: {
goDetail(url){
let urls = url.info[1].value
this.$util.JumpPath(urls);
},
//替换安全域名
setDomain: function(url) {
url = url ? url.toString() : '';
//本地调试打开,生产请注销
if (url.indexOf("https://") > -1) return url;
else return url.replace('http://', 'https://');
},
swiperChange(e) {
let { current, source } = e.detail;
if (source === 'autoplay' || source === 'touch') {
this.swiperCur = e.detail.current;
this.bgColor = this.imgUrls[e.detail.current]['img']
}
},
textChange(e) {
let { current, source } = e.detail;
if (source === 'autoplay' || source === 'touch') {
this.searchVal = this.hotWords[e.detail.current]['val']
}
},
/**显示全部分类*/
showCategory() {
this.isCategory = true;
},
/*跳转为页面*/
changeTab(item, index) {
if(this.tabClick == index) return
this.tabClick = index //设置导航点击了哪一个
this.isLeft = index * this.isWidth + 16 //设置下划线位置
this.tabId = item.info[1].value
this.bgColor = this.tabId ? item.img : this.dataConfig.swiperConfig.list[0]['img']
this.imgUrls = this.tabId ? [{img:item.img}] : this.dataConfig.swiperConfig.list
this.$emit('changeDiy', this.tabId);
}
},
}
</script>
<style lang="scss" scoped>
.page_count {
position: relative;
overflow: hidden;
.bg-img {
position: absolute;
width: 100%;
height: 100%;
top: 0;
/* #ifdef MP || APP-PLUS */
z-index: -1;
/* #endif */
/* #ifdef H5 */
z-index: 0;
/* #endif */
z-index: 0;
filter: blur(0);
overflow: hidden;
img {
width: 100%;
height: 100%;
filter: blur(30rpx);
transform: scale(1.5);
}
}
}
.my-main{
// transition: background-color .5s ease;
.location{
padding: 10rpx 28rpx 0 28rpx;
.town_name{
color: #fff;
margin-left: 18rpx;
}
}
}
.swiperTxt {
width: 300rpx;
line-height: 64rpx;
height: 64rpx;
overflow: hidden;
}
.swiperTxt .text {
width: 480rpx;
}
.swiperTxt .text .newsTitle {
width: 300rpx;
font-size: 24rpx;
color: #ffffff;
}
.swiperTxt swiper {
height: 100%;
}
.header {
z-index: 99;
position: fixed;
left: 0;
width: 100%;
.btn {
position: relative;
margin-left: 30rpx;
.iconfont {
font-size: 45rpx;
}
}
.iconnum {
min-width: 14rpx;
color: #E93323;
background: #fff;
border-radius: 15rpx;
position: absolute;
right: -10rpx;
top: -10rpx;
font-size: 10px;
padding: 0 5px;
}
.serch-wrapper {
align-items: center;
padding: 20rpx 30rpx 20rpx 30rpx;
.logo {
width: 133rpx;
margin-right: 20rpx;
}
image {
width: 133rpx;
height: 66rpx;
}
.box{
flex: 1;
}
.input,.uninput {
line-height: 64rpx;
height: 64rpx;
padding: 0 0 0 30rpx;
background: rgba(0,0,0,.2);
color: #fff;
border-radius: 30rpx;
font-size: 28rpx;
z-index: 2;
position: relative;
box-sizing: border-box;
.iconfont {
position: absolute;
right: 20rpx;
top: 0;
color: #eeeeee;
}
}
}
}
.mp-header {
z-index: 99;
position: fixed;
left: 0;
width: 100%;
.box{
flex: 1;
}
.serch-box{
margin-top: 10rpx;
}
.serch-wrapper {
display: flex;
align-items: center;
// padding: 0 50rpx 20rpx 30rpx;
padding: 0 28rpx;
height: 76rpx;
.logo {
width: 133rpx;
margin-right: 20rpx;
line-height: 0;
}
image {
width: 118rpx;
height: 42rpx;
}
.input,.uninput {
display: flex;
/* #ifdef MP */
flex: 0;
/* #endif */
/* #ifdef APP-PLUS */
flex: 1;
/* #endif */
flex: 1;
align-items: center;
height: 64rpx;
line-height: 64rpx;
padding: 0 50rpx 0 30rpx;
background: rgba(0,0,0,.2);
border-radius: 100rpx;
color: #ffffff;
font-size: 28rpx;
position: relative;
box-sizing: border-box;
.iconfont {
position: absolute;
right: 20rpx;
top: 0;
color: #eeeeee;
}
}
/* #ifdef MP */
.uninput{
max-width: 500rpx;
}
.input{
max-width: 340rpx;
}
/* #endif */
}
}
.tabNav {
padding-top: 10rpx;
}
.navTabBox {
color: rgba(255, 255, 255, 1);
padding: 0 30rpx;
z-index: 10;
left: 0;
width: 100%;
box-sizing: border-box;
position: fixed;
scroll-view{
width:100%;
padding-right: 30rpx;
height: 70rpx;
}
.click {
color: white;
}
.longTab {
.longItem{
height: 50upx;
display: inline-block;
line-height: 50upx;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
max-width: 160rpx;
margin-right: 30rpx;
position: relative;
&:last-child{
margin-right: 0;
}
&.click{
font-weight: bold;
font-size: 30rpx;
color: #FFFFFF;
&::after{
content: '';
transition: .5s;
width: 33rpx;
height: 4rpx;
background: #FFFFFF;
position: absolute;
bottom: -4rpx;
left: 50%;
margin-left: -16rpx;
}
}
}
}
}
.scrolled{
z-index: 5000;
position: fixed;
min-height: 90rpx;
left: 0;
top: 0;
width: 100%;
// background: #fff!important;
background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/23bd9202402271611232730.png');
background-color: #f1f1f1; /* 设置背景色 */
background-size: 100% 100%; /* 让背景图片铺满整个盒子 */
background-repeat: no-repeat; /* 不重复 */
transition: background-color .5s ease;
.longItem,.click,.category text{
color: #000000!important;
}
.navTabBox,.mp-header,.header{
// transition: background-color .5s ease;
// background: #ffffff;
}
.btn .iconfont{
color: #333333!important;
}
.iconnum{
background: #333333!important;
}
.underline{
background: #000000!important;
}
.click{
&::after{
background-color:#fff!important;
}
}
}
.swiperBg {
z-index: 1;
margin-top: 10rpx;
padding-bottom: 30rpx;
.colorBg {
position: absolute;
left: 0;
top: 0;
height: 130rpx;
width: 100%;
}
.page_swiper {
position: relative;
width: 100%;
height: auto;
margin: 0 auto;
border-radius: 10rpx;
overflow-x: hidden;
z-index: 8;
padding: 0 10rpx;
swiper-item{
border-radius: 10rpx;
}
.swiper-item, image, .acea-row.row-between-wrapper {
width: 100%;
margin: 0 auto;
border-radius: 10rpx;
}
swiper{
width: 100%;
display: block;
height: auto;
&.scalex{
/deep/.uni-swiper-slide-frame{
transform: translate(0,0)!important;
}
}
}
image {
transform: scale(0.93);
transition: all 0.6s ease;
}
swiper-item.active, swiper-item.scalex{
image {
transform: scale(1);
}
}
/*用来包裹所有的小圆点 */
.dots {
width: 156rpx;
height: 36rpx;
display: flex;
flex-direction: row;
position: absolute;
left: 320rpx;
bottom: 0;
}
/*未选中时的小圆点样式 */
.dot {
width: 16rpx;
height: 6rpx;
border-radius: 6rpx;
margin-right: 6rpx;
background-color: rgba(255,255,255,.4);
/*选中以后的小圆点样式 */
&.active {
width: 32rpx;
height: 6rpx;
background-color: rgba(255,255,255,.4);
}
}
}
}
/deep/.dot0 .uni-swiper-dots-horizontal{
left: 10%;
}
/deep/.dot1 .uni-swiper-dots-horizontal{
left: 50%;
}
/deep/.dot2 .uni-swiper-dots-horizontal{
left: 90%;
}
</style>

1731
pages/index/index-backup.vue Normal file
View File

File diff suppressed because it is too large Load Diff

350
pages/index/index.vue
View File

File diff suppressed because it is too large Load Diff

312
pages/order_addcart/order_addcart.vue
View File

@ -1,16 +1,39 @@
<template> <template>
<view :style="viewColor"> <view :style="viewColor">
<view class='shoppingCart'> <view class='shoppingCart'>
<view class='labelNav acea-row row-around row-middle'>
<view class='item'><text class='iconfont icon-xuanzhong'></text>100%正品保证</view> <!-- 头部 -->
<view class='item'><text class='iconfont icon-xuanzhong'></text>所有商品精挑细选</view> <view class="shoppingCart-head">
<view class='item'><text class='iconfont icon-xuanzhong'></text>售后无忧</view> <view style="height: var(--status-bar-height);"></view>
<!-- 滚动tab -->
<scroll-view scroll-x="true">
<view class="scrollview">
<block v-for="(item,indx) in tabsArr" :key="indx">
<view class="scrollview-item" :class="{'scrollview-active':tabsCurr == item.val}"
@click="tabsChange(item.val)">
{{item.name}}
</view> </view>
</block>
</view>
</scroll-view>
</view>
<view class="func">
<!-- 分段器 -->
<view class="subsection">
<u-subsection :list="['综合云市场','商户购物车']" activeColor="#40AE36" :current="subsecCurr"
mode="subsection" @change="subsecChange"></u-subsection>
</view>
<view class='nav acea-row row-between-wrapper'> <view class='nav acea-row row-between-wrapper'>
<view>购物数量 <text class='num t-color'>{{cartTotalCount}}</text></view> <view>购物数量：<text class='num t-color'>{{cartTotalCount}}</text></view>
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0" class='administrate acea-row row-center-wrapper' <view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"
@click='manage'>{{ footerswitch ? '管理' : '取消'}}</view> class='administrate acea-row row-center-wrapper' @click='manage'>{{ footerswitch ? '管理' : '取消'}}
</view> </view>
</view>
</view>
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0"> <view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0">
<view class='list'> <view class='list'>
<block v-for="(item,index) in cartList.valid" :key="index"> <block v-for="(item,index) in cartList.valid" :key="index">
@ -20,31 +43,38 @@
<text v-if="!item.allCheck" class="iconfont icon-weixuanzhong"></text> <text v-if="!item.allCheck" class="iconfont icon-weixuanzhong"></text>
<text v-else class="iconfont icon-xuanzhong1"></text> <text v-else class="iconfont icon-xuanzhong1"></text>
</view> </view>
<navigator :url="hide_mer_status == 0 ? '/pages/store/home/index?id='+item.mer_id : '#'" class="info"> <navigator :url="hide_mer_status == 0 ? '/pages/store/home/index?id='+item.mer_id : '#'"
class="info">
<text class="iconfont icon-shangjiadingdan"></text> <text class="iconfont icon-shangjiadingdan"></text>
<view class="name">{{item.mer_name}}</view> <view class="name">{{item.mer_name}}</view>
<text class="iconfont icon-xiangyou"></text> <text class="iconfont icon-xiangyou"></text>
</navigator> </navigator>
<view class="coupon-btn" v-if="item.hasCoupon>0" @click="giveCoupon(item)">优惠券</view> <view class="coupon-btn" v-if="item.hasCoupon>0" @click="giveCoupon(item)">优惠券</view>
</view> </view>
<navigator v-for="goods in item.list" :key="goods.cart_id" :url='"/pages/goods_details/index?id="+goods.product.product_id' <navigator v-for="goods in item.list" :key="goods.cart_id"
hover-class='none' class='picTxt acea-row'> :url='"/pages/goods_details/index?id="+goods.product.product_id' hover-class='none'
class='picTxt acea-row'>
<view class="checkbox" @click.stop="goodsCheck(goods,index)"> <view class="checkbox" @click.stop="goodsCheck(goods,index)">
<text v-if="!goods.check" class="iconfont icon-weixuanzhong"></text> <text v-if="!goods.check" class="iconfont icon-weixuanzhong"></text>
<text v-else class="iconfont icon-xuanzhong1"></text> <text v-else class="iconfont icon-xuanzhong1"></text>
</view> </view>
<view class='pictrue'> <view class='pictrue'>
<image :src='(goods.productAttr && goods.productAttr.image) || goods.product.image'></image> <image :src='(goods.productAttr && goods.productAttr.image) || goods.product.image'>
</image>
<!-- <image v-else :src='item.productInfo.image'></image> --> <!-- <image v-else :src='item.productInfo.image'></image> -->
</view> </view>
<view class='text'> <view class='text'>
<view class='line1'>{{goods.product.store_name}}</view> <view class='line1'>{{goods.product.store_name}}</view>
<view class='infor line1' v-if="goods.productAttr.sku" @click.stop='changeCart(goods,goods.product_id)'> <view class='infor line1' v-if="goods.productAttr.sku"
@click.stop='changeCart(goods,goods.product_id)'>
{{goods.productAttr.sku}} {{goods.productAttr.sku}}
<text class="iconfont icon-xiala1"></text> <text class="iconfont icon-xiala1"></text>
</view> </view>
<view v-if="goods.product.once_max_count>0 && goods.product.once_min_count>0" class="buy_limit"> <view v-if="goods.product.once_max_count>0 && goods.product.once_min_count>0"
<text v-if="goods.product.once_min_count>0">{{goods.product.once_min_count}}件起购，</text><text v-if="goods.product.once_max_count>0">最多{{goods.product.once_max_count}}件</text> class="buy_limit">
<text
v-if="goods.product.once_min_count>0">{{goods.product.once_min_count}}件起购，</text><text
v-if="goods.product.once_max_count>0">最多{{goods.product.once_max_count}}件</text>
</view> </view>
<view class='money acea-row row-middle'> <view class='money acea-row row-middle'>
<text>￥{{goods.productAttr.price}}</text> <text>￥{{goods.productAttr.price}}</text>
@ -54,9 +84,12 @@
</view> </view>
</view> </view>
<view class='carnum acea-row row-center-wrapper'> <view class='carnum acea-row row-center-wrapper'>
<view class="reduce" :class="goods.numSub ? 'on' : ''" @click.stop='subCart(goods)'>-</view> <view class="reduce" :class="goods.numSub ? 'on' : ''" @click.stop='subCart(goods)'>
-</view>
<view class='num'>{{goods.cart_num}}</view> <view class='num'>{{goods.cart_num}}</view>
<view class="plus" :class="(goods.numAdd || (goods.cart_num >= goods.productAttr.stock)) ? 'on' : ''" @click.stop='addCart(goods)'>+</view> <view class="plus"
:class="(goods.numAdd || (goods.cart_num >= goods.productAttr.stock)) ? 'on' : ''"
@click.stop='addCart(goods)'>+</view>
</view> </view>
</navigator> </navigator>
</view> </view>
@ -64,15 +97,19 @@
</view> </view>
<view class='invalidGoods' v-if="cartList.invalid.length > 0"> <view class='invalidGoods' v-if="cartList.invalid.length > 0">
<view class='goodsNav acea-row row-between-wrapper'> <view class='goodsNav acea-row row-between-wrapper'>
<view @click='goodsOpen'><text class='iconfont' :class='goodsHidden==true?"icon-xiangxia":"icon-xiangshang"'></text>失效商品</view> <view @click='goodsOpen'><text class='iconfont'
:class='goodsHidden==true?"icon-xiangxia":"icon-xiangshang"'></text>失效商品</view>
<view class='del' @click='unsetCart'><text class='iconfont icon-shanchu1'></text>清空</view> <view class='del' @click='unsetCart'><text class='iconfont icon-shanchu1'></text>清空</view>
</view> </view>
<view class='goodsList' :hidden='goodsHidden'> <view class='goodsList' :hidden='goodsHidden'>
<block v-for="(item,index) in cartList.invalid" :key='index'> <block v-for="(item,index) in cartList.invalid" :key='index'>
<navigator v-if="item.product" :url="'/pages/goods_details/index?id='+item.product_id" class='item acea-row row-between-wrapper' hover-class='none'> <navigator v-if="item.product" :url="'/pages/goods_details/index?id='+item.product_id"
class='item acea-row row-between-wrapper' hover-class='none'>
<view class='invalid'>失效</view> <view class='invalid'>失效</view>
<view class='pictrue'> <view class='pictrue'>
<image :src='(item.productAttr && item.productAttr.image) || (item.product&&item.product.image)'></image> <image
:src='(item.productAttr && item.productAttr.image) || (item.product&&item.product.image)'>
</image>
</view> </view>
<view class='text acea-row row-column-between'> <view class='text acea-row row-column-between'>
<view class='line1 name'>{{item.product.store_name}}</view> <view class='line1 name'>{{item.product.store_name}}</view>
@ -87,13 +124,15 @@
</view> </view>
</view> </view>
</view> </view>
<view class='noCart' v-if="recommend" :style="{marginTop:cartList.invalid.length ==0 && cartList.invalid.length ==0?'170rpx':'' }"> <view class='noCart' v-if="recommend"
:style="{marginTop:cartList.invalid.length ==0 && cartList.invalid.length ==0?'170rpx':'' }">
<view class='pictrue'> <view class='pictrue'>
<image :src="`${domain}/static/images/noCart.png`"></image> <image :src="`${domain}/static/images/noCart.png`"></image>
<view>暂无商品，去添加点什么吧</view> <view>暂无商品，去添加点什么吧</view>
</view> </view>
<recommend v-if="recommend_switch == 1" :hostProduct='hostProduct' :isLogin="isLogin"></recommend> <recommend v-if="recommend_switch == 1" :hostProduct='hostProduct' :isLogin="isLogin"></recommend>
<view class='loadingicon acea-row row-center-wrapper' v-if="hostProduct.length>5 && recommend_switch == 1"> <view class='loadingicon acea-row row-center-wrapper'
v-if="hostProduct.length>5 && recommend_switch == 1">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}} <text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view> </view>
</view> </view>
@ -123,14 +162,12 @@
</view> </view>
<!-- 优惠券弹窗 --> <!-- 优惠券弹窗 -->
<block v-if="coupon.coupon"> <block v-if="coupon.coupon">
<couponListWindow <couponListWindow :coupon='coupon' @ChangCouponsClose="ChangCouponsClose"
:coupon='coupon' @ChangCouponsUseState="ChangCouponsUseState"></couponListWindow>
@ChangCouponsClose="ChangCouponsClose"
@ChangCouponsUseState="ChangCouponsUseState"
></couponListWindow>
</block> </block>
<!-- 组件 --> <!-- 组件 -->
<addcartWindow :attr="attr" :isShow='1' :iSplus='1' :destri='1' @myevent="onMyEvent" @ChangeAttr="ChangeAttr" @goCat="goCat" @attrVal="attrVal" id='product-window'></addcartWindow> <addcartWindow :attr="attr" :isShow='1' :iSplus='1' :destri='1' @myevent="onMyEvent" @ChangeAttr="ChangeAttr"
@goCat="goCat" @attrVal="attrVal" id='product-window'></addcartWindow>
<!--自定义底部tab栏--> <!--自定义底部tab栏-->
<customTab :newData="newData" :activeRouter="activeRouter"></customTab> <customTab :newData="newData" :activeRouter="activeRouter"></customTab>
</view> </view>
@ -148,16 +185,38 @@
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
import couponListWindow from '@/components/couponListWindow'; import couponListWindow from '@/components/couponListWindow';
import addcartWindow from '@/components/addcartWindow'; import addcartWindow from '@/components/addcartWindow';
import { getNavigation } from "@/api/public"; import {
getNavigation
} from "@/api/public";
import customTab from '@/components/customTab'; import customTab from '@/components/customTab';
import { getCartList,getCartCounts,changeCartNum,cartDel,cartProductAttr } from '@/api/order.js'; import {
import { getCoupons,getShopCoupons } from '@/api/api.js'; getCartList,
import { getProductHot,collectAll} from '@/api/store.js'; getCartCounts,
import { mapGetters } from "vuex"; changeCartNum,
cartDel,
cartProductAttr
} from '@/api/order.js';
import {
getCoupons,
getShopCoupons
} from '@/api/api.js';
import {
getProductHot,
collectAll
} from '@/api/store.js';
import {
mapGetters
} from "vuex";
import recommend from '@/components/recommend'; import recommend from '@/components/recommend';
import { configMap } from '@/utils'; import {
import { HTTP_REQUEST_URL } from '@/config/app'; configMap
import { toLogin } from '@/libs/login.js'; } from '@/utils';
import {
HTTP_REQUEST_URL
} from '@/config/app';
import {
toLogin
} from '@/libs/login.js';
const app = getApp(); const app = getApp();
export default { export default {
props: { props: {
@ -174,6 +233,15 @@
}, },
data() { data() {
return { return {
tabsArr: [{
name: '用户购物车',
val: 1
}, {
name: '商户购物车',
val: 2
}],
tabsCurr: 1,
subsecCurr: 0,
domain: HTTP_REQUEST_URL, domain: HTTP_REQUEST_URL,
loading: false, //是否加载中 loading: false, //是否加载中
loadend: false, //是否加载完毕 loadend: false, //是否加载完毕
@ -221,7 +289,11 @@
activeRouter: '', activeRouter: '',
}; };
}, },
computed: configMap({hide_mer_status: 1,recommend_switch:0,navigation: {}}, mapGetters(['isLogin','viewColor'])), computed: configMap({
hide_mer_status: 1,
recommend_switch: 0,
navigation: {}
}, mapGetters(['isLogin', 'viewColor'])),
onReady() {}, onReady() {},
mounted: function() {}, mounted: function() {},
onLoad: function(options) { onLoad: function(options) {
@ -252,6 +324,15 @@
} }
}, },
methods: { methods: {
tabsChange(e) {
this.tabsCurr = e;
},
subsecChange(e) {
console.log(e);
this.subsecCurr = e;
},
goRouter(item) { goRouter(item) {
var pages = getCurrentPages(); var pages = getCurrentPages();
var page = (pages[pages.length - 1]).$page.fullPath; var page = (pages[pages.length - 1]).$page.fullPath;
@ -418,7 +499,8 @@
"store_name", "store_name",
goods.product.store_name goods.product.store_name
); );
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : goods.product.image); this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : goods
.product.image);
this.$set(this.attr.productSelect, "price", productSelect.price); this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", productSelect.stock); this.$set(this.attr.productSelect, "stock", productSelect.stock);
this.$set(this.attr.productSelect, "unique", productSelect.unique); this.$set(this.attr.productSelect, "unique", productSelect.unique);
@ -497,7 +579,8 @@
} }
}, },
attrVal(val) { attrVal(val) {
this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attr_values[val.indexn]); this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attr_values[val
.indexn]);
}, },
/** /**
* 属性变动赋值 * 属性变动赋值
@ -509,16 +592,17 @@
this.newVal = this.productValue[res]; this.newVal = this.productValue[res];
if (productSelect) this.$set(this, "uniqueValue", productSelect.unique); if (productSelect) this.$set(this, "uniqueValue", productSelect.unique);
if (productSelect && productSelect.stock > 0) { if (productSelect && productSelect.stock > 0) {
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this.attrImage); this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this
.attrImage);
this.$set(this.attr.productSelect, "price", productSelect.price); this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", productSelect.stock); this.$set(this.attr.productSelect, "stock", productSelect.stock);
this.$set(this.attr.productSelect, "unique", productSelect.unique); this.$set(this.attr.productSelect, "unique", productSelect.unique);
this.$set(this, "uniqueValue", productSelect.unique); this.$set(this, "uniqueValue", productSelect.unique);
this.$set(this.attr.productSelect, "cart_num", 1); this.$set(this.attr.productSelect, "cart_num", 1);
this.$set(this, "attrValue", res); this.$set(this, "attrValue", res);
} } else {
else { this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this.attrImage); .attrImage);
this.$set(this.attr.productSelect, "price", productSelect.price); this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", 0); this.$set(this.attr.productSelect, "stock", 0);
this.$set(this.attr.productSelect, "unique", ""); this.$set(this.attr.productSelect, "unique", "");
@ -575,7 +659,8 @@
cart_num: that.goods.cart_num, cart_num: that.goods.cart_num,
product_attr_unique: that.newVal.unique product_attr_unique: that.newVal.unique
}).then(res => { }).then(res => {
if (that.goods.hasOwnProperty('productAttr') && that.goods.cart_num > that.goods.productAttr.stock) { if (that.goods.hasOwnProperty('productAttr') && that.goods.cart_num > that.goods
.productAttr.stock) {
that.goods.cart_num = that.goods.productAttr.stock; that.goods.cart_num = that.goods.productAttr.stock;
that.goods.numAdd = true; that.goods.numAdd = true;
that.goods.numSub = false; that.goods.numSub = false;
@ -712,7 +797,8 @@
// 总金额 //总数 // 总金额 //总数
el.list.forEach(e => { el.list.forEach(e => {
if (e.check) { if (e.check) {
totalMoney = this.$util.$h.Add(totalMoney, this.$util.$h.Mul(e.productAttr.price, e.cart_num)) totalMoney = this.$util.$h.Add(totalMoney, this.$util.$h.Mul(e.productAttr
.price, e.cart_num))
totalNum += e.cart_num totalNum += e.cart_num
} }
}) })
@ -758,7 +844,8 @@
}, },
// 清空 // 清空
unsetCart: function() { unsetCart: function() {
let that = this,ids = []; let that = this,
ids = [];
for (let i = 0, len = that.cartList.invalid.length; i < len; i++) { for (let i = 0, len = that.cartList.invalid.length; i < len; i++) {
ids.push(that.cartList.invalid[i].cart_id); ids.push(that.cartList.invalid[i].cart_id);
} }
@ -790,7 +877,9 @@
ids: ids.join(',') ids: ids.join(',')
}).then(res => { }).then(res => {
goodsArr = res.data goodsArr = res.data
getShopCoupons(item.mer_id).then(({data})=>{ getShopCoupons(item.mer_id).then(({
data
}) => {
uni.hideLoading(); uni.hideLoading();
couponList = goodsArr.concat(data) couponList = goodsArr.concat(data)
this.$set(this.coupon, 'list', couponList); this.$set(this.coupon, 'list', couponList);
@ -839,19 +928,23 @@
z-index: 5; z-index: 5;
top: 0; top: 0;
} }
.icon-xiala1 { .icon-xiala1 {
display: inline-block; display: inline-block;
transform: rotate(180deg); transform: rotate(180deg);
font-size: 14rpx; font-size: 14rpx;
padding: 0 5rpx; padding: 0 5rpx;
} }
.shoppingCart .labelNav .item .iconfont { .shoppingCart .labelNav .item .iconfont {
font-size: 25rpx; font-size: 25rpx;
margin-right: 10rpx; margin-right: 10rpx;
} }
.t-color { .t-color {
color: var(--view-theme); color: #40AE36;
} }
.shoppingCart { .shoppingCart {
/* #ifndef MP */ /* #ifndef MP */
padding-bottom: 180rpx; padding-bottom: 180rpx;
@ -859,9 +952,53 @@
/* #ifdef MP */ /* #ifdef MP */
padding-bottom: calc(180rpx+ constant(safe-area-inset-bottom)); padding-bottom: calc(180rpx+ constant(safe-area-inset-bottom));
padding-bottom: calc(180rpx + env(safe-area-inset-bottom)); padding-bottom: calc(180rpx + env(safe-area-inset-bottom));
/* #endif */ /* #endif */
.shoppingCart-head {
background-color: #40AE36;
.scrollview {
display: flex;
align-items: center;
height: 98rpx;
padding-left: 32rpx;
.scrollview-item {
margin-right: 30rpx;
font-size: 28rpx;
color: #FFFFFF;
} }
.shoppingCart .nav {
.scrollview-active {
position: relative;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
&::after {
content: "";
display: inline-block;
position: absolute;
bottom: -6rpx;
left: 50%;
transform: translateX(-50%);
width: 100%;
height: 6rpx;
background-color: #FFFFFF;
}
}
}
}
.func {
padding-top: 20rpx;
background-color: #fff;
.subsection {
margin: 0 30rpx;
}
.nav {
width: 100%; width: 100%;
height: 80rpx; height: 80rpx;
background-color: #fff; background-color: #fff;
@ -869,11 +1006,12 @@
box-sizing: border-box; box-sizing: border-box;
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
position: fixed; // position: fixed;
left: 0; left: 0;
z-index: 5; z-index: 5;
top: 76rpx; top: 76rpx;
} }
.shoppingCart .nav .administrate { .shoppingCart .nav .administrate {
font-size: 26rpx; font-size: 26rpx;
color: #282828; color: #282828;
@ -882,30 +1020,39 @@
border-radius: 6rpx; border-radius: 6rpx;
border: 1px solid #868686; border: 1px solid #868686;
} }
}
}
.shoppingCart .noCart { .shoppingCart .noCart {
margin-top: 20rpx; margin-top: 20rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
background-color: #fff; background-color: #fff;
padding-top: 0.1rpx; padding-top: 0.1rpx;
} }
.shoppingCart .noCart .pictrue { .shoppingCart .noCart .pictrue {
text-align: center; text-align: center;
margin: 78rpx auto 56rpx auto; margin: 78rpx auto 56rpx auto;
padding-bottom: 60rpx; padding-bottom: 60rpx;
} }
.shoppingCart .noCart .pictrue image { .shoppingCart .noCart .pictrue image {
width: 414rpx; width: 414rpx;
height: 305rpx; height: 305rpx;
} }
.shoppingCart .noCart .pictrue view { .shoppingCart .noCart .pictrue view {
color: #999; color: #999;
} }
.shoppingCart .list { .shoppingCart .list {
margin: 171rpx 0 20rpx; margin: 20rpx 0 20rpx;
} }
.shoppingCart .list .item { .shoppingCart .list .item {
background-color: #fff; background-color: #fff;
margin-bottom: 15rpx; margin-bottom: 15rpx;
.store-title { .store-title {
display: flex; display: flex;
align-items: center; align-items: center;
@ -913,35 +1060,43 @@
padding: 0 30rpx; padding: 0 30rpx;
height: 85rpx; height: 85rpx;
border-bottom: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;
.checkbox { .checkbox {
width: 60rpx; width: 60rpx;
.iconfont { .iconfont {
font-size: 40rpx; font-size: 40rpx;
color: #CCCCCC; color: #CCCCCC;
} }
.icon-xuanzhong1 { .icon-xuanzhong1 {
color: var(--view-theme); color: #40AE36;
} }
} }
.info { .info {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
.iconfont { .iconfont {
font-size: 36rpx; font-size: 36rpx;
} }
.name { .name {
margin: 0 0 0 10rpx; margin: 0 0 0 10rpx;
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
font-weight: bold; font-weight: bold;
} }
.icon-xiangyou { .icon-xiangyou {
margin-top: 6rpx; margin-top: 6rpx;
font-size: 22rpx; font-size: 22rpx;
color: #999; color: #999;
} }
} }
.coupon-btn { .coupon-btn {
color: var(--view-theme); color: var(--view-theme);
font-size: 22rpx; font-size: 22rpx;
@ -953,53 +1108,64 @@
} }
} }
} }
.vipImg { .vipImg {
width: 65rpx; width: 65rpx;
height: 28rpx; height: 28rpx;
margin-left: 10rpx; margin-left: 10rpx;
image { image {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: block; display: block;
} }
} }
.shoppingCart .list .item .picTxt { .shoppingCart .list .item .picTxt {
width: 100%; width: 100%;
padding: 25rpx 30rpx; padding: 25rpx 30rpx;
position: relative; position: relative;
align-items: center; align-items: center;
border-bottom: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;
.checkbox { .checkbox {
width: 60rpx; width: 60rpx;
.iconfont { .iconfont {
font-size: 40rpx; font-size: 40rpx;
color: #CCCCCC; color: #CCCCCC;
} }
.icon-xuanzhong1 { .icon-xuanzhong1 {
color: var(--view-theme); color: #40AE36;
} }
} }
} }
.shoppingCart .list .item .picTxt .pictrue { .shoppingCart .list .item .picTxt .pictrue {
width: 160rpx; width: 160rpx;
height: 160rpx; height: 160rpx;
} }
.shoppingCart .list .item .picTxt .pictrue image { .shoppingCart .list .item .picTxt .pictrue image {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6rpx; border-radius: 6rpx;
} }
.shoppingCart .list .item .picTxt .text { .shoppingCart .list .item .picTxt .text {
width: 444rpx; width: 444rpx;
margin-left: 20rpx; margin-left: 20rpx;
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
} }
.shoppingCart .list .item .picTxt .buy_limit { .shoppingCart .list .item .picTxt .buy_limit {
margin-top: 10rpx; margin-top: 10rpx;
color: #E93323; color: #E93323;
font-size: 22rpx; font-size: 22rpx;
} }
.shoppingCart .list .item .picTxt .text .infor { .shoppingCart .list .item .picTxt .text .infor {
display: inline-block; display: inline-block;
padding: 6rpx; padding: 6rpx;
@ -1010,17 +1176,20 @@
background-color: #F5F5F5; background-color: #F5F5F5;
max-width: 460rpx; max-width: 460rpx;
} }
.shoppingCart .list .item .picTxt .text .money { .shoppingCart .list .item .picTxt .text .money {
font-size: 32rpx; font-size: 32rpx;
color: #282828; color: #282828;
margin-top: 28rpx; margin-top: 28rpx;
} }
.shoppingCart .list .item .picTxt .carnum { .shoppingCart .list .item .picTxt .carnum {
height: 47rpx; height: 47rpx;
position: absolute; position: absolute;
bottom: 30rpx; bottom: 30rpx;
right: 30rpx; right: 30rpx;
} }
.shoppingCart .list .item .picTxt .carnum view { .shoppingCart .list .item .picTxt .carnum view {
border: 1px solid #a4a4a4; border: 1px solid #a4a4a4;
min-width: 66rpx; min-width: 66rpx;
@ -1030,25 +1199,31 @@
font-size: 28rpx; font-size: 28rpx;
color: #a4a4a4; color: #a4a4a4;
} }
.shoppingCart .list .item .picTxt .carnum .reduce { .shoppingCart .list .item .picTxt .carnum .reduce {
border-right: 0; border-right: 0;
// border-radius: 3rpx 0 0 3rpx; // border-radius: 3rpx 0 0 3rpx;
} }
.shoppingCart .list .item .picTxt .carnum .reduce.on, .shoppingCart .list .item .picTxt .carnum .reduce.on,
.shoppingCart .list .item .picTxt .carnum .plus.on { .shoppingCart .list .item .picTxt .carnum .plus.on {
border-color: #e3e3e3; border-color: #e3e3e3;
color: #dedede; color: #dedede;
} }
.shoppingCart .list .item .picTxt .carnum .plus { .shoppingCart .list .item .picTxt .carnum .plus {
border-left: 0; border-left: 0;
// border-radius: 0 3rpx 3rpx 0; // border-radius: 0 3rpx 3rpx 0;
} }
.shoppingCart .list .item .picTxt .carnum .num { .shoppingCart .list .item .picTxt .carnum .num {
color: #282828; color: #282828;
} }
.shoppingCart .invalidGoods { .shoppingCart .invalidGoods {
background-color: #fff; background-color: #fff;
} }
.shoppingCart .invalidGoods .goodsNav { .shoppingCart .invalidGoods .goodsNav {
width: 100%; width: 100%;
height: 66rpx; height: 66rpx;
@ -1057,25 +1232,30 @@
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
} }
.shoppingCart .invalidGoods .goodsNav .iconfont { .shoppingCart .invalidGoods .goodsNav .iconfont {
color: #424242; color: #424242;
font-size: 28rpx; font-size: 28rpx;
margin-right: 17rpx; margin-right: 17rpx;
} }
.shoppingCart .invalidGoods .goodsNav .del { .shoppingCart .invalidGoods .goodsNav .del {
font-size: 26rpx; font-size: 26rpx;
color: #999; color: #999;
} }
.shoppingCart .invalidGoods .goodsNav .del .icon-shanchu1 { .shoppingCart .invalidGoods .goodsNav .del .icon-shanchu1 {
color: #999; color: #999;
font-size: 33rpx; font-size: 33rpx;
vertical-align: -2rpx; vertical-align: -2rpx;
margin-right: 8rpx; margin-right: 8rpx;
} }
.shoppingCart .invalidGoods .goodsList .item { .shoppingCart .invalidGoods .goodsList .item {
padding: 20rpx 30rpx; padding: 20rpx 30rpx;
border-top: 1px solid #f5f5f5; border-top: 1px solid #f5f5f5;
} }
.shoppingCart .invalidGoods .goodsList .item .invalid { .shoppingCart .invalidGoods .goodsList .item .invalid {
font-size: 22rpx; font-size: 22rpx;
color: #fff; color: #fff;
@ -1086,31 +1266,38 @@
text-align: center; text-align: center;
line-height: 36rpx; line-height: 36rpx;
} }
.shoppingCart .invalidGoods .goodsList .item .pictrue { .shoppingCart .invalidGoods .goodsList .item .pictrue {
width: 140rpx; width: 140rpx;
height: 140rpx; height: 140rpx;
} }
.shoppingCart .invalidGoods .goodsList .item .pictrue image { .shoppingCart .invalidGoods .goodsList .item .pictrue image {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6rpx; border-radius: 6rpx;
} }
.shoppingCart .invalidGoods .goodsList .item .text { .shoppingCart .invalidGoods .goodsList .item .text {
width: 433rpx; width: 433rpx;
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
height: 140rpx; height: 140rpx;
} }
.shoppingCart .invalidGoods .goodsList .item .text .name { .shoppingCart .invalidGoods .goodsList .item .text .name {
width: 100%; width: 100%;
} }
.shoppingCart .invalidGoods .goodsList .item .text .infor { .shoppingCart .invalidGoods .goodsList .item .text .infor {
font-size: 24rpx; font-size: 24rpx;
} }
.shoppingCart .invalidGoods .goodsList .item .text .end { .shoppingCart .invalidGoods .goodsList .item .text .end {
font-size: 26rpx; font-size: 26rpx;
color: #bbb; color: #bbb;
} }
.shoppingCart .footer { .shoppingCart .footer {
z-index: 9; z-index: 9;
width: 100%; width: 100%;
@ -1127,6 +1314,7 @@
bottom: 0; bottom: 0;
/*#endif*/ /*#endif*/
} }
.shoppingCart .footer.on { .shoppingCart .footer.on {
/*#ifdef MP || APP-PLUS*/ /*#ifdef MP || APP-PLUS*/
bottom: 98rpx; bottom: 98rpx;
@ -1134,14 +1322,17 @@
bottom: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/ bottom: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
/*#endif*/ /*#endif*/
} }
.shoppingCart .footer .checkAll { .shoppingCart .footer .checkAll {
font-size: 28rpx; font-size: 28rpx;
color: #282828; color: #282828;
margin-left: 16rpx; margin-left: 16rpx;
} }
.shoppingCart .footer .money { .shoppingCart .footer .money {
font-size: 30rpx; font-size: 30rpx;
} }
.shoppingCart .footer .placeOrder { .shoppingCart .footer .placeOrder {
color: #fff; color: #fff;
font-size: 30rpx; font-size: 30rpx;
@ -1151,8 +1342,9 @@
text-align: center; text-align: center;
line-height: 70rpx; line-height: 70rpx;
margin-left: 22rpx; margin-left: 22rpx;
background-color: var(--view-theme); background-color: #40AE36;
} }
.shoppingCart .footer .button .bnt { .shoppingCart .footer .button .bnt {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
@ -1162,27 +1354,33 @@
height: 60rpx; height: 60rpx;
text-align: center; text-align: center;
line-height: 60rpx; line-height: 60rpx;
&.bt-color { &.bt-color {
color: var(--view-theme); color: var(--view-theme);
border: 1px solid var(--view-theme); border: 1px solid var(--view-theme);
} }
} }
.shoppingCart .footer .button form~form { .shoppingCart .footer .button form~form {
margin-left: 17rpx; margin-left: 17rpx;
} }
.allcheckbox { .allcheckbox {
display: flex; display: flex;
align-items: center; align-items: center;
width: 260rpx; width: 260rpx;
.iconfont { .iconfont {
margin-right: 20rpx; margin-right: 20rpx;
font-size: 40rpx; font-size: 40rpx;
color: #CCCCCC; color: #CCCCCC;
} }
.icon-xuanzhong1 { .icon-xuanzhong1 {
color: var(--view-theme); color: #40AE36;
} }
} }
.page-footer { .page-footer {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
@ -1199,9 +1397,11 @@
box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32); box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/ padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/ padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/
&.filter { &.filter {
filter: blur(2rpx); filter: blur(2rpx);
} }
.foot-item { .foot-item {
display: flex; display: flex;
width: max-content; width: max-content;
@ -1209,6 +1409,7 @@
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
position: relative; position: relative;
.count-num { .count-num {
position: absolute; position: absolute;
display: flex; display: flex;
@ -1225,15 +1426,16 @@
padding: 4rpx; padding: 4rpx;
} }
} }
.foot-item image { .foot-item image {
height: 50rpx; height: 50rpx;
width: 50rpx; width: 50rpx;
text-align: center; text-align: center;
margin: 0 auto; margin: 0 auto;
} }
.foot-item .txt { .foot-item .txt {
font-size: 24rpx; font-size: 24rpx;
} }
} }
</style> </style>

1239
pages/order_addcart/order_addcart_backup.vue Normal file
View File

File diff suppressed because it is too large Load Diff

11
pages/user/index.vue
View File

@ -768,7 +768,7 @@
position: relative; position: relative;
width: 100%; width: 100%;
padding: 35rpx 0 0rpx; padding: 35rpx 0 0rpx;
background-image: linear-gradient(90deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%); background-image: linear-gradient(to left, #72BE53 0%, #46B03A 100%);
&.svip-card { &.svip-card {
padding: 35rpx 0 120rpx; padding: 35rpx 0 120rpx;
@ -1016,7 +1016,7 @@
.iconfont { .iconfont {
font-size: 62rpx; font-size: 62rpx;
color: var(--view-theme); color: #40AE36;
} }
} }
@ -1112,7 +1112,7 @@
.order-status-num { .order-status-num {
background-color: #fff; background-color: #fff;
color: var(--view-theme); color: #40AE36;
border-radius: 200rpx; border-radius: 200rpx;
position: absolute; position: absolute;
right: -12rpx; right: -12rpx;
@ -1125,14 +1125,13 @@
height: 30rpx; height: 30rpx;
padding: 0 8rpx; padding: 0 8rpx;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid var(--view-theme); border: 1px solid #40AE36;
} }
} }
.sys-head { .sys-head {
position: relative; position: relative;
width: 100%; width: 100%;
// background: linear-gradient(90deg, $bg-star1 0%, $bg-end1 100%);
.bg { .bg {
position: absolute; position: absolute;
@ -1140,7 +1139,7 @@
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-image: linear-gradient(90deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%); background-image: linear-gradient(to left, #72BE53 0%, #46B03A 100%);
background-size: 100% auto; background-size: 100% auto;
background-position: left bottom; background-position: left bottom;
} }

26
pages/users/order_confirm/index.vue
View File

@ -1918,7 +1918,7 @@
} }
.t-color { .t-color {
color: var(--view-theme); color: #40AE36;
} }
.order-submission .address .addressCon .setaddress { .order-submission .address .addressCon .setaddress {
@ -2032,7 +2032,7 @@
} }
.order-submission .virtual_form .item-require { .order-submission .virtual_form .item-require {
color: red; color: #40AE36;
margin-right: 4rpx; margin-right: 4rpx;
} }
@ -2200,14 +2200,14 @@
} }
.order-submission .wrapper .item .list .payItem.on { .order-submission .wrapper .item .list .payItem.on {
border-color: var(--view-theme); border-color: #40AE36;
color: var(--view-theme); color: #40AE36;
} }
.order-submission .wrapper .item .list .payItem .name { .order-submission .wrapper .item .list .payItem .name {
width: 50%; width: 50%;
text-align: center; text-align: center;
border-right: 1px solid #eee; border-right: 1px solid #40AE36;
justify-content: left; justify-content: left;
padding-left: 80rpx; padding-left: 80rpx;
} }
@ -2255,7 +2255,7 @@
} }
.order-submission .moneyList .item .money { .order-submission .moneyList .item .money {
color: #868686; color: #40AE36;
display: flex; display: flex;
align-items: center; align-items: center;
} }
@ -2298,7 +2298,7 @@
} }
.pColor { .pColor {
color: var(--view-priceColor); color: #40AE36;
} }
.order-submission .footer .settlement { .order-submission .footer .settlement {
@ -2306,7 +2306,7 @@
color: #fff; color: #fff;
width: 240rpx; width: 240rpx;
height: 70rpx; height: 70rpx;
background-color: var(--view-theme); background-color: #40AE36;
border-radius: 50rpx; border-radius: 50rpx;
text-align: center; text-align: center;
line-height: 70rpx; line-height: 70rpx;
@ -2422,7 +2422,7 @@
.price { .price {
margin-top: 20rpx; margin-top: 20rpx;
color: var(--view-priceColor); color: #40AE36;
position: relative; position: relative;
text { text {
@ -2567,11 +2567,11 @@
padding-right: 30rpx; padding-right: 30rpx;
padding-bottom: 30rpx; padding-bottom: 30rpx;
font-size: 26rpx; font-size: 26rpx;
color: #282828; color: #40AE36;
.price { .price {
margin-left: 10rpx; margin-left: 10rpx;
color: var(--view-priceColor); color: #40AE36;
font-size: 28rpx; font-size: 28rpx;
font-weight: bold; font-weight: bold;
@ -2630,11 +2630,11 @@
} }
.iconfont { .iconfont {
color: var(--view-theme); color: #40AE36;
} }
.map_text { .map_text {
color: var(--view-theme); color: #40AE36;
} }
} }
} }

317
pages/whole_sale/index.vue Normal file
View File

@ -0,0 +1,317 @@
<style lang="scss" scoped>
page {
background-color: #F8F9FA;
}
.wholeSale {
.wholeSale-header {
margin-bottom: 20rpx;
background-color: #40AE36;
.scrollview {
display: flex;
align-items: center;
height: 98rpx;
padding-left: 32rpx;
.scrollview-item {
margin-right: 30rpx;
font-size: 28rpx;
color: #FFFFFF;
}
.scrollview-active {
position: relative;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
&::after {
content: "";
display: inline-block;
position: absolute;
bottom: -6rpx;
left: 50%;
transform: translateX(-50%);
width: 100%;
height: 6rpx;
background-color: #FFFFFF;
}
}
}
}
.wholeSale-con {
margin: 0 30rpx;
.search_content {
margin-bottom: 40rpx;
height: 70rpx;
padding: 2px 2px 2px 21.05rpx;
border-radius: 80rpx;
background: #EDEFF2;
position: relative;
box-sizing: border-box;
.search_content_wrap {
width: 100%;
.icon-sousuo {
font-size: 26.32rpx;
font-weight: bold;
color: #c8c7c6;
margin-right: 17.54rpx;
}
input {
width: 80%;
}
}
.search_btn {
width: 106rpx;
height: 60rpx;
line-height: 60rpx;
background: #40AE36;
border-radius: 100px;
font-size: 28rpx;
color: #fff;
}
}
.category {
width: 100%;
overflow: auto;
margin-bottom: 70rpx;
.category-wrap {
display: flex;
padding-bottom: 20rpx;
.category-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-right: 38rpx;
text {
margin-top: 16rpx;
font-size: 24rpx;
color: #666666;
white-space: nowrap;
}
}
.category-item-active {
position: relative;
&::after {
content: "";
display: inline-block;
position: absolute;
bottom: -6rpx;
width: 100%;
height: 6rpx;
background-color: #40AE36;
border-radius: 4rpx;
}
}
}
}
.cate {
width: 100%;
overflow: auto;
margin-bottom: 30rpx;
.cate-wrap {
display: flex;
padding-bottom: 8rpx;
.cate-item {
text {
padding: 4rpx 16rpx;
white-space: nowrap;
font-size: 30rpx;
color: #333;
}
}
.cate-item-active {
text {
color: #40AE36;
font-weight: bold;
}
}
}
}
.comprehensive {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 50rpx;
[class^=comprehensive-] {
display: flex;
align-items: center;
text {
margin-right: 12rpx;
font-size: 26rpx;
color: #666666;
}
image {
width: 28rpx;
height: 28rpx;
}
.loudou {
width: 24rpx;
height: 24rpx;
}
}
}
}
}
</style>
<template>
<view class="wholeSale">
<!-- 顶部 -->
<view class="wholeSale-header">
<!-- 适配不同机 -->
<view style="height: var(--status-bar-height);"></view>
<!-- 滚动tab -->
<scroll-view scroll-x="true" :scroll-top="100" :show-scrollbar="false" scroll-into-view="a1">
<view class="scrollview">
<block v-for="(item,indx) in tabsArr" :key="indx">
<view class="scrollview-item" :id="'a' + indx"
:class="{'scrollview-active':tabsCurr == item.val}" @click="tabsChange(item.val)">
{{item.name}}
</view>
</block>
</view>
</scroll-view>
</view>
<!-- 内容 -->
<view class="wholeSale-con">
<!-- 搜索 -->
<navigator url="/pages/columnGoods/goods_search/index" hover-class="none"
class="search_content flex_a_c_j_sb">
<view class="flex_a_c search_content_wrap">
<view class="iconfont icon-sousuo" style="font-size: 39rpx;"></view>
<input type="text" placeholder="搜索您需要批发进货的产品名称" placeholder-style="font-size: 30rpx;color:#999;"
disabled>
</view>
<button class="search_btn">搜索</button>
</navigator>
<!-- 商品大分类 -->
<view class="category">
<scroll-view scroll-x="true">
<view class="category-wrap">
<block v-for="(item,index) in 10" :key="index">
<view class="category-item category-item-active">
<u-image width="108rpx" height="108rpx" shape="circle" :lazy-load="true">
<template v-slot:loading>
<u-loading-icon color="#999" size="15" />
</template>
</u-image>
<text>水果蔬菜</text>
</view>
</block>
</view>
</scroll-view>
</view>
<!-- 商品小分类 -->
<view class="cate">
<scroll-view scroll-x="true">
<view class="cate-wrap">
<block v-for="(item,index) in 10" :key="index">
<view class="cate-item" :class="{'cate-item-active':index == 0}">
<text>水果</text>
</view>
</block>
</view>
</scroll-view>
</view>
<!-- 综合查询 -->
<view class="comprehensive">
<view class="comprehensive-price">
<text>价格</text>
<image src="../../static/new_define/priceChange.png"></image>
</view>
<view class="comprehensive-sales_num">
<text>销量</text>
</view>
<view class="comprehensive-discount">
<text>抵扣</text>
<image class="loudou" src="../../static/new_define/loudou.png"></image>
</view>
</view>
<!-- 流水瀑布 -->
<WaterfallsFlow :wfList='hostProduct' @itemTap="goDetail" :type="0" />
</view>
</view>
</template>
<script>
import {
goShopDetail
} from '@/libs/order.js'
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
export default {
components: {
WaterfallsFlow
},
data() {
return {
tabsArr: [{
name: '里海云仓批发',
val: 1
}, {
name: '供销云市场批发',
val: 2
}, {
name: '名优特产批发',
val: 3
}],
tabsCurr: 1
}
},
methods: {
tabsChange(e) {
this.tabsCurr = e;
},
goDetail(item) {
goShopDetail(item, this.uid).then(res => {
if (this.isLogin) {
initiateAssistApi(item.activity_id).then(res => {
let id = res.data.product_assist_set_id;
uni.hideLoading();
uni.navigateTo({
url: '/pages/activity/assist_detail/index?id=' + id
});
}).catch((err) => {
uni.showToast({
title: err,
icon: 'none'
})
});
} else {
toLogin();
}
})
}
}
}
</script>

BIN
static/images/1-001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/images/1-002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
static/images/2-001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/images/2-002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
static/images/3-001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
static/images/3-002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
static/images/4-001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
static/images/4-002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.0 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
static/images/5-001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
static/images/5-002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 6.0 KiB

BIN
static/images/组 21508@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
static/new_define/loudou.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 427 B

BIN
static/new_define/priceChange.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 329 B