mkm/nk-shop2.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复地址错误

Browse Source 
修复供应链列表错误
This commit is contained in:
mkm 2023-05-15 22:46:19 +08:00 committed by shengchanzhe
parent 3e1f97f269
commit a46be7373a
3 changed files with 876 additions and 744 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

522
components/zbpSwiper.vue
View File

@ -1,245 +1,321 @@
<template> <template>
<view class="zbp-head-wrapper"> <view class="zbp-head-wrapper">
<view class="color-lump"></view> <view class="color-lump"></view>
<view class="bg-img"> <view class="bg-img">
<img :src="bgColor" alt=""> <img :src="bgColor" alt="">
</view> </view>
<view class="site-box flex_a_c_j_sb"> <view class="site-box flex_a_c_j_sb">
<view class="place_wrapper flex_a_c" @click="selectLocation"> <view class="place_wrapper flex_a_c" @click="selectLocation">
<view class="iconfont icon-weizhi"></view> <view class="iconfont icon-weizhi"></view>
<view class="town_name">{{street}}</view> <view class="town_name">{{recommend_address}}</view>
</view> </view>
<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;"></view>
</navigator> </navigator>
</view> </view>
<!-- 搜索栏 --> <!-- 搜索栏 -->
<navigator url="/pages/columnGoods/goods_search/index" hover-class="none" class="search_content flex_a_c_j_sb"> <navigator url="/pages/columnGoods/goods_search/index" hover-class="none" class="search_content flex_a_c_j_sb">
<view class="flex_a_c"> <view class="flex_a_c">
<view class="iconfont icon-sousuo"></view> <view class="iconfont icon-sousuo"></view>
<input type="text" v-model="keyword" placeholder="搜索产品或店铺"> <input type="text" v-model="keyword" placeholder="搜索产品或店铺">
</view> </view>
<button class="search_btn">搜索</button> <button class="search_btn">搜索</button>
</navigator> </navigator>
<!-- 轮播图 --> <!-- 轮播图 -->
<view class="supply_chains-head"> <view class="supply_chains-head">
<swiper class="swiper l_center" @change="swiperChange" :indicator-dots="swiper.indicatorDots" <swiper class="swiper l_center" @change="swiperChange" :indicator-dots="swiper.indicatorDots"
:autoplay="swiper.autoplay" :interval="swiper.interval" :duration="swiper.duration" :autoplay="swiper.autoplay" :interval="swiper.interval" :duration="swiper.duration"
indicator-active-color="#fff"> indicator-active-color="#fff">
<block v-for="(item,index) in swiper['url']" :key="index"> <block v-for="(item,index) in swiper['url']" :key="index">
<swiper-item class="swi_item"> <swiper-item class="swi_item">
<u--image radius="15" :showLoading="true" :src="item.img" width="694.74rpx" height="242.11rpx" <u--image radius="15" :showLoading="true" :src="item.img" width="694.74rpx" height="242.11rpx"
mode="aspectFill"> mode="aspectFill">
</u--image> </u--image>
</swiper-item> </swiper-item>
</block> </block>
</swiper> </swiper>
</view> </view>
<u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm" <u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker> @cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
</view> </view>
</template> </template>
<script> <script>
import { getArea, getStreet } from '@/api/article.js'; import {
import { getIndexData, getDiy } from '@/api/api.js' getArea,
import { mapGetters } from 'vuex' getStreet
export default { } from '@/api/article.js';
props: { import {
isSelectPlace: { getIndexData,
type: Boolean, getDiy
default: false } from '@/api/api.js'
} import {getGeocoder } from '@/api/store.js';
},
data() { import {
return { mapGetters
showPicker: false, } from 'vuex'
columnData: [], export default {
keyword: '', props: {
street: '', isSelectPlace: {
bgColor: '', type: Boolean,
swiper: { default: false
url: [{ }
img: '' },
}], data() {
indicatorDots: true, // 显示面板指示点 return {
vertical: false, // 滑动方向是否为纵向 showPicker: false,
autoplay: true, // 是否自动切换 styleConfig: [],
interval: 2000, // 自动切换时间间隔 columnData: [],
duration: 400 // 滑动动画时长 homeCombData:[],
}, keyword: '',
} recommend_address: '',
}, bgColor: '',
computed: mapGetters(['location']), swiper: {
watch: {}, url: [{
created() { img: ''
const loca = JSON.parse(this.location) }],
this.street = loca.address_component.street indicatorDots: true, // 显示面板指示点
this.getBanner() vertical: false, // 滑动方向是否为纵向
this.Area() autoplay: true, // 是否自动切换
}, interval: 2000, // 自动切换时间间隔
methods: { duration: 400 // 滑动动画时长
selectLocation() { },
this.isSelectPlace ? this.showPicker = true : '' }
}, },
confirm(e) { // computed: mapGetters(['location']),
this.showPicker = false watch: {},
this.$emit('selectPlce', e) created() {
}, //#ifdef APP
changeHandler(e) { this.selfLocation()
const { columnIndex, value, values, index, picker = this.$refs.uPicker } = e; //#endif
if (columnIndex === 0) { // const loca = JSON.parse(this.location)
getStreet({ area_code: value[0]['code'] }).then(res => { // this.street = loca.address_component.street
picker.setColumnValues(1, res.data); this.getBanner()
}); this.Area()
} },
}, methods: {
Area() { selectLocation() {
getArea({ city_code: 510500 }).then(res => { this.isSelectPlace ? this.showPicker = true : ''
this.$refs.uPicker.setColumnValues(0, res.data); },
this.Street(res.data[0]['code']); confirm(e) {
}); this.showPicker = false
}, this.$emit('selectPlce', e)
Street(code) { },
getStreet({ area_code: code }).then(res => { changeHandler(e) {
this.$refs.uPicker.setColumnValues(1, res.data); const {
}); columnIndex,
}, value,
swiperChange(e) { values,
let { current, source } = e.detail; index,
if (source === 'autoplay' || source === 'touch') { picker = this.$refs.uPicker
this.bgColor = this.swiper.url[e.detail.current]['img'] } = e;
} if (columnIndex === 0) {
}, getStreet({
async getBanner() { area_code: value[0]['code']
const { data } = await getDiy({ id: 0 }) }).then(res => {
/* 对象转数组*/ picker.setColumnValues(1, res.data);
let obj = Object.keys(data.value).sort(); });
let styleConfig = obj.map(key => data.value[key]); }
/* 循环数组得到数据*/ },
styleConfig.forEach((item, index, arr) => { Area() {
if (item.name == 'headerSerch' || item.name == 'homeComb') { getArea({
item.name == 'homeComb' ? this.swiper.url = item.swiperConfig.list : ''; city_code: 510500
} }).then(res => {
}) this.$refs.uPicker.setColumnValues(0, res.data);
this.bgColor = this.swiper.url[0].img this.Street(res.data[0]['code']);
}, });
} },
} Street(code) {
getStreet({
area_code: code
}).then(res => {
this.$refs.uPicker.setColumnValues(1, res.data);
});
},
selfLocation() {
let self = this
uni.getLocation({
type: 'gcj02',
success: (res) => {
let latitude, longitude;
latitude = res.latitude.toString();
longitude = res.longitude.toString();
this.latitude = res.latitude
this.longitude = res.longitude
getGeocoder({
lat: latitude,
long: longitude
}).then(res => {
console.log(res)
this.detaile_address = res.data.address;
this.location_address = res.data.address;
this.recommend_address = res.data.formatted_addresses.recommend.length > 4 ? res.data.formatted_addresses.recommend.slice(0,7) + '...' : res.data.formatted_addresses.recommend
}).catch(err => {
uni.showToast({
title: err,
icon: 'none'
})
})
},
fail: (res) => {
uni.showToast({
title: res,
icon: 'none',
duration: 1000
});
},
});
},
swiperChange(e) {
let {
current,
source
} = e.detail;
if (source === 'autoplay' || source === 'touch') {
this.bgColor = this.swiper.url[e.detail.current]['img']
}
},
// 对象转数组
objToArr(data) {
let obj = Object.keys(data).sort();
let m = obj.map(key => data[key]);
return m;
},
async getBanner(id) {
let that = this;
const {
data
} = await getDiy({
id: 0
})
that.styleConfig = that.objToArr(data.value);
/* 循环数组得到数据*/
that.styleConfig.forEach((item, index, arr) => {
if (item.name == 'headerSerch' || item.name == 'homeComb') {
if (item.name == 'homeComb') {
that.swiper.url = item.swiperConfig.list
}
}
})
this.bgColor = this.swiper.url[0].img
},
}
}
</script> </script>
<style lang="scss"> <style lang="scss">
.zbp-head-wrapper { .zbp-head-wrapper {
position: relative; position: relative;
padding-top: 78.95rpx; padding-top: 78.95rpx;
overflow: hidden; overflow: hidden;
.color-lump { .color-lump {
z-index: 1; z-index: 1;
position: absolute; position: absolute;
bottom: -86px; bottom: -86px;
left: 50%; left: 50%;
transform: translate(-50%, 0); transform: translate(-50%, 0);
width: 102%; width: 102%;
height: 133px; height: 133px;
border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0;
background-color: #fff; background-color: #fff;
} }
.bg-img { .bg-img {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
top: 0; top: 0;
/* #ifdef MP || APP-PLUS */ /* #ifdef MP || APP-PLUS */
z-index: -1; z-index: -1;
/* #endif */ /* #endif */
/* #ifdef H5 */ /* #ifdef H5 */
z-index: 0; z-index: 0;
/* #endif */ /* #endif */
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%;
filter: blur(30rpx); filter: blur(30rpx);
transform: scale(1.5); transform: scale(1.5);
} }
} }
.site-box { .site-box {
margin: 0 auto; margin: 0 auto;
width: 694.74rpx; width: 694.74rpx;
height: 66.67rpx; height: 66.67rpx;
margin-bottom: 26.32rpx; margin-bottom: 26.32rpx;
position: relative; position: relative;
// 位置 // 位置
.place_wrapper { .place_wrapper {
color: #fff; color: #fff;
margin-right: 24.56rpx; margin-right: 24.56rpx;
font-size: 31.58rpx; font-size: 31.58rpx;
.town_name { .town_name {
margin-left: 10.53rpx; margin-left: 10.53rpx;
} }
} }
.iconfont { .iconfont {
font-size: 35.09rpx; font-size: 35.09rpx;
} }
} }
.my-main { .my-main {
transition: background-color .5s ease; transition: background-color .5s ease;
} }
.search_content { .search_content {
margin: 0 auto; margin: 0 auto;
width: 694.74rpx; width: 694.74rpx;
height: 61.4rpx; height: 61.4rpx;
padding: 2px 2px 2px 21.05rpx; padding: 2px 2px 2px 21.05rpx;
border-radius: 100px; border-radius: 100px;
background: #fff; background: #fff;
margin-bottom: 17.54rpx; margin-bottom: 17.54rpx;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
.icon-sousuo { .icon-sousuo {
font-size: 26.32rpx; font-size: 26.32rpx;
font-weight: bold; font-weight: bold;
color: #c8c7c6; color: #c8c7c6;
margin-right: 17.54rpx; margin-right: 17.54rpx;
} }
.search_btn { .search_btn {
color: #fff; color: #fff;
width: 105.26rpx; width: 105.26rpx;
height: 52.63rpx; height: 52.63rpx;
line-height: 52.63rpx; line-height: 52.63rpx;
background: #f84221; background: #f84221;
border-radius: 100px; border-radius: 100px;
font-size: 28.07rpx; font-size: 28.07rpx;
} }
} }
.supply_chains-head { .supply_chains-head {
margin-bottom: 17.54rpx; margin-bottom: 17.54rpx;
position: relative; position: relative;
z-index: 2; z-index: 2;
.swiper { .swiper {
width: 694.74rpx; width: 694.74rpx;
height: 242.11rpx; height: 242.11rpx;
margin: 0 auto; margin: 0 auto;
.swi_item { .swi_item {
width: 100%; width: 100%;
height: 242.11rpx; height: 242.11rpx;
} }
} }
} }
} }
</style> </style>

928
pages/home/index.vue
View File

@ -1,493 +1,549 @@
<template> <template>
<view class="Circle_friends"> <view class="Circle_friends">
<view class="circle_friends_wrapper"> <view class="circle_friends_wrapper">
<zbpSwiper></zbpSwiper> <zbpSwiper></zbpSwiper>
<view class="tabs_wrapper"> <view class="tabs_wrapper">
<u-tabs :list="tabsData.list" @click="tabsChange" :activeStyle="tabsData.activeStyle" <u-tabs :list="tabsData.list" @click="tabsChange" :activeStyle="tabsData.activeStyle"
:inactiveStyle="tabsData.inactiveStyle" lineHeight="0" keyName="cate_name"></u-tabs> :inactiveStyle="tabsData.inactiveStyle" lineHeight="0" keyName="cate_name"></u-tabs>
</view> </view>
<view class="goods"> <view class="goods">
<block v-for="(item,index) in cateGoods" :key="index"> <block v-for="(item,index) in cateGoods" :key="index">
<view class="goods_item" @click="gogogo(item)"> <view class="goods_item" @click="gogogo(item)">
<image class="goods_img" :src="item.image[0]" mode="aspectFill"></image> <image class="goods_img" :src="item.image[0]" mode="aspectFill"></image>
<view class="botm"> <view class="botm">
<view class="title">{{item.title}}</view> <view class="title">{{item.title}}</view>
<view class="goods_info flex_a_c"> <view class="goods_info flex_a_c">
<view class="l_info flex_a_c"> <view class="l_info flex_a_c">
<image :src="(item.author && item.author.avatar) || '/static/images/f.png'" mode="aspectFill" <image :src="(item.author && item.author.avatar) || '/static/images/f.png'"
class="g_img"></image> mode="aspectFill" class="g_img"></image>
<view class="g_name">{{item.author && item.author.nickname}}</view> <view class="g_name">{{item.author && item.author.nickname}}</view>
</view> </view>
<view class="nice_box" @click.stop="giveStart(item)"> <view class="nice_box" @click.stop="giveStart(item)">
<text class="iconfont" :class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text> <text class="iconfont"
<text class="collect">{{item.count_start}}</text> :class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
</view> <text class="collect">{{item.count_start}}</text>
</view> </view>
</view> </view>
</view> </view>
</block> </view>
</view> </block>
<view class="empty_wrapper" v-if="emptyShow"> </view>
<u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty> <view class="empty_wrapper" v-if="emptyShow">
</view> <u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
</view> </view>
</view>
<u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm" <u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker> @cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
<!-- <view class="bg_color"></view> --> <!-- <view class="bg_color"></view> -->
<!-- <m-tabbar native> <!-- <m-tabbar native>
<template v-slot:tabbar_index_2> <template v-slot:tabbar_index_2>
<view class="custom_style"> <view class="custom_style">
<view class="custom_style_icon"></view> <view class="custom_style_icon"></view>
</view> </view>
</template> </template>
</m-tabbar> --> </m-tabbar> -->
</view> </view>
</template> </template>
<script> <script>
import mTabbar from '@/components/m-tabbar/m-tabbar.vue' import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
import zbpSwiper from '@/components/zbpSwiper' import zbpSwiper from '@/components/zbpSwiper'
import { getSlideAPI } from '@/api/lihai.js' import {
import { graphicLstApi, getTopicList, graphicStartApi } from '@/api/community.js' getSlideAPI
import { getIndexData, getDiy } from '@/api/api.js' } from '@/api/lihai.js'
import { getGeocoder, merClassifly } from '@/api/store.js'; import {
import { getArea, getStreet } from '@/api/article.js'; graphicLstApi,
import { Toast } from '@/libs/uniApi' getTopicList,
export default { graphicStartApi
components: { } from '@/api/community.js'
mTabbar, import {
zbpSwiper getIndexData,
}, getDiy
data() { } from '@/api/api.js'
return { import {
bgColor: '', getGeocoder,
showPicker: false, merClassifly
columnData: [], } from '@/api/store.js';
show: false, import {
swiper: { getArea,
url: [{ getStreet
img: '' } from '@/api/article.js';
}], import {
indicatorDots: true, // 显示面板指示点 Toast
vertical: false, // 滑动方向是否为纵向 } from '@/libs/uniApi'
autoplay: true, // 是否自动切换 export default {
interval: 2000, // 自动切换时间间隔 components: {
duration: 500 // 滑动动画时长 mTabbar,
}, zbpSwiper
tabsData: { },
list: [], data() {
tabsActive: 0, return {
activeStyle: { bgColor: '',
color: '#fff', showPicker: false,
fontWeight: 'bold', columnData: [],
borderRadius: '100px', show: false,
backgroundColor: '#F84221', swiper: {
padding: '15.79rpx 21.05rpx' url: [{
}, img: ''
inactiveStyle: { }],
color: '#000', indicatorDots: true, // 显示面板指示点
padding: '15.79rpx 21.05rpx', vertical: false, // 滑动方向是否为纵向
} autoplay: true, // 是否自动切换
}, interval: 2000, // 自动切换时间间隔
where: { duration: 500 // 滑动动画时长
category_id: 0, },
page: 1, tabsData: {
limit: 30 list: [],
}, tabsActive: 0,
currentItemId: 69, // 默认获取 社区的数据 0 表示推荐 || 69 社区 activeStyle: {
keyword: '', color: '#fff',
location: '', fontWeight: 'bold',
emptyShow: false, borderRadius: '100px',
street: '', backgroundColor: '#F84221',
cateGoods: [] padding: '15.79rpx 21.05rpx'
} },
}, inactiveStyle: {
onLoad() { color: '#000',
this.getBanner() padding: '15.79rpx 21.05rpx',
this.getCateList() }
this.getGoods() },
this.selfLocation() where: {
this.Area() category_id: 0,
}, page: 1,
onShow() {}, limit: 30
methods: { },
// 轮播图变化背景 currentItemId: 69, // 默认获取 社区的数据 0 表示推荐 || 69 社区
swiperChange(e) { keyword: '',
let { current, source } = e.detail; location: '',
if (source === 'autoplay' || source === 'touch') { emptyShow: false,
this.bgColor = this.swiper.url[e.detail.current]['img'] street: '',
} cateGoods: []
}, }
confirm(e) { },
this.where.street_id = e.value[1].code onLoad() {
this.showPicker = false this.getBanner()
}, this.getCateList()
changeHandler(e) { this.getGoods()
const { columnIndex, value, values, index, picker = this.$refs.uPicker } = e; this.selfLocation()
if (columnIndex === 0) { this.Area()
getStreet({ area_code: value[0]['code'] }).then(res => { },
this.$refs.uPicker.setColumnValues(1, res.data); onShow() {},
}); methods: {
} // 轮播图变化背景
}, swiperChange(e) {
Area() { let {
getArea({ city_code: 510500 }).then(res => { current,
this.$refs.uPicker.setColumnValues(0, res.data); source
this.Street(res.data[0]['code']); } = e.detail;
}); if (source === 'autoplay' || source === 'touch') {
}, this.bgColor = this.swiper.url[e.detail.current]['img']
Street(code) { }
getStreet({ area_code: code }).then(res => { },
this.$refs.uPicker.setColumnValues(1, res.data); confirm(e) {
}); this.where.street_id = e.value[1].code
}, this.showPicker = false
gogogo(item) { },
if (this.tabsData.tabsActive == 1) { changeHandler(e) {
uni.navigateTo({ const {
url: '/pages/short_video/nvueSwiper/index?id=' + item.community_id columnIndex,
}) value,
} else { values,
uni.navigateTo({ index,
url: '/pages/plantGrass/plant_detail/index?id=' + item.community_id picker = this.$refs.uPicker
}) } = e;
} if (columnIndex === 0) {
}, getStreet({
giveStart(item) { area_code: value[0]['code']
let status = item.relevance_id ? 0 : 1 }).then(res => {
graphicStartApi(item.community_id, { status: status }).then(res => { this.$refs.uPicker.setColumnValues(1, res.data);
Toast(res.message) });
this.getGoods() }
}) },
}, Area() {
dianji() { getArea({
this.show = !this.show city_code: 510500
}, }).then(res => {
// 获取发现商品 this.$refs.uPicker.setColumnValues(0, res.data);
getGoods: function() { this.Street(res.data[0]['code']);
// 数据写死：默认社区数据 category_id=69&page=1&limit=30 });
graphicLstApi(this.where).then(res => { },
this.cateGoods = res.data.list Street(code) {
res.data.list.length <= 0 ? this.emptyShow = true : this.emptyShow = false getStreet({
}) area_code: code
}, }).then(res => {
/*获取分类列表*/ this.$refs.uPicker.setColumnValues(1, res.data);
async getCateList() { });
const { data } = await getTopicList() },
this.tabsData.list = [{ gogogo(item) {
cate_name: "推荐", if (this.tabsData.tabsActive == 1) {
category_id: 0 uni.navigateTo({
}, { cate_name: "视频", category_id: -1, children: [] }, ...data] //#ifdef APP
}, url: '/pages/short_video/appSwiper/index?id=' + item.community_id
tabsChange(item) { //#endif
this.where.category_id = item.category_id //#ifndef APP
this.getGoods() url: '/pages/short_video/nvueSwiper/index?id=' + item.community_id
this.street_id = item.id //#endif
this.tabsData.tabsActive = item.index })
if (item.index == 1) { } else {
uni.navigateTo({ uni.navigateTo({
url: '/pages/short_video/nvueSwiper/index?id=' + '136' url: '/pages/plantGrass/plant_detail/index?id=' + item.community_id
}) })
} }
}, },
async getBanner() { giveStart(item) {
const { data } = await getDiy({ id: 0 }) let status = item.relevance_id ? 0 : 1
if (data.value['1683638943100000']) { graphicStartApi(item.community_id, {
this.swiper.url = data.value['1683638943100000'].swiperConfig.list status: status
} else { }).then(res => {
this.swiper.url = data.value['1683875164005000'].swiperConfig.list Toast(res.message)
} this.getGoods()
this.bgColor = this.swiper.url[0].img })
}, },
selfLocation() { dianji() {
uni.getLocation({ this.show = !this.show
type: 'gcj02', },
success: (res) => { // 获取发现商品
let latitude, longitude; getGoods: function() {
latitude = res.latitude.toString(); // 数据写死：默认社区数据 category_id=69&page=1&limit=30
longitude = res.longitude.toString(); graphicLstApi(this.where).then(res => {
getGeocoder({ lat: latitude, long: longitude }).then(res => { this.cateGoods = res.data.list
this.$store.commit('setLocation', res.data) res.data.list.length <= 0 ? this.emptyShow = true : this.emptyShow = false
this.street = res.data.address_component.street })
}).catch(err => { },
uni.showToast({ title: err, icon: 'none' }) /*获取分类列表*/
}) async getCateList() {
}, const {
fail: (err) => { data
uni.showToast({ } = await getTopicList()
title: err.errMsg, this.tabsData.list = [{
icon: 'none', cate_name: "推荐",
duration: 1000 category_id: 0
}); }, {
} cate_name: "视频",
}); category_id: -1,
}, children: []
}, }, ...data]
onPullDownRefresh() { },
this.getBanner() tabsChange(item) {
this.getCateList() this.where.category_id = item.category_id
this.getGoods() this.getGoods()
this.selfLocation() this.street_id = item.id
this.Area() this.tabsData.tabsActive = item.index
uni.stopPullDownRefresh() if (item.index == 1) {
} uni.navigateTo({
} url: '/pages/short_video/nvueSwiper/index?id=' + '136'
})
}
},
async getBanner() {
const {
data
} = await getDiy({
id: 0
})
if (data.value['1683638943100000']) {
this.swiper.url = data.value['1683638943100000'].swiperConfig.list
} else {
this.swiper.url = data.value['1683875164005000'].swiperConfig.list
}
this.bgColor = this.swiper.url[0].img
},
selfLocation() {
uni.getLocation({
type: 'gcj02',
success: (res) => {
let latitude, longitude;
latitude = res.latitude.toString();
longitude = res.longitude.toString();
getGeocoder({
lat: latitude,
long: longitude
}).then(res => {
this.$store.commit('setLocation', res.data)
this.street = res.data.address_component.street
}).catch(err => {
uni.showToast({
title: err,
icon: 'none'
})
})
},
fail: (err) => {
uni.showToast({
title: err.errMsg,
icon: 'none',
duration: 1000
});
}
});
},
},
onPullDownRefresh() {
this.getBanner()
this.getCateList()
this.getGoods()
this.selfLocation()
this.Area()
uni.stopPullDownRefresh()
}
}
</script> </script>
<style lang="scss"> <style lang="scss">
page { page {
// background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%); // background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
} }
// 顶部 // 顶部
.head-wrapper { .head-wrapper {
position: relative; position: relative;
padding-top: 78.95rpx; padding-top: 78.95rpx;
overflow: hidden; overflow: hidden;
.color-lump { .color-lump {
z-index: 1; z-index: 1;
position: absolute; position: absolute;
bottom: -86px; bottom: -86px;
left: 50%; left: 50%;
transform: translate(-50%, 0); transform: translate(-50%, 0);
width: 102%; width: 102%;
height: 133px; height: 133px;
border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0;
background-color: #fff; background-color: #fff;
} }
.bg-img { .bg-img {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
top: 0; top: 0;
/* #ifdef MP || APP-PLUS */ /* #ifdef MP || APP-PLUS */
z-index: -1; z-index: -1;
/* #endif */ /* #endif */
/* #ifdef H5 */ /* #ifdef H5 */
z-index: 0; z-index: 0;
/* #endif */ /* #endif */
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%;
filter: blur(30rpx); filter: blur(30rpx);
transform: scale(1.5); transform: scale(1.5);
} }
} }
.site-box { .site-box {
margin: 0 auto; margin: 0 auto;
width: 694.74rpx; width: 694.74rpx;
height: 66.67rpx; height: 66.67rpx;
margin-bottom: 26.32rpx; margin-bottom: 26.32rpx;
position: relative; position: relative;
// 位置 // 位置
.place_wrapper { .place_wrapper {
color: #fff; color: #fff;
margin-right: 24.56rpx; margin-right: 24.56rpx;
font-size: 31.58rpx; font-size: 31.58rpx;
.town_name { .town_name {
margin-left: 10.53rpx; margin-left: 10.53rpx;
} }
} }
.iconfont { .iconfont {
font-size: 35.09rpx; font-size: 35.09rpx;
} }
} }
.my-main { .my-main {
transition: background-color .5s ease; transition: background-color .5s ease;
} }
.search_content { .search_content {
margin: 0 auto; margin: 0 auto;
width: 694.74rpx; width: 694.74rpx;
height: 61.4rpx; height: 61.4rpx;
padding: 2px 2px 2px 21.05rpx; padding: 2px 2px 2px 21.05rpx;
border-radius: 100px; border-radius: 100px;
background: #fff; background: #fff;
margin-bottom: 17.54rpx; margin-bottom: 17.54rpx;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
.icon-sousuo { .icon-sousuo {
font-size: 26.32rpx; font-size: 26.32rpx;
font-weight: bold; font-weight: bold;
color: #c8c7c6; color: #c8c7c6;
margin-right: 17.54rpx; margin-right: 17.54rpx;
} }
.search_btn { .search_btn {
color: #fff; color: #fff;
width: 105.26rpx; width: 105.26rpx;
height: 52.63rpx; height: 52.63rpx;
line-height: 52.63rpx; line-height: 52.63rpx;
background: #f84221; background: #f84221;
border-radius: 100px; border-radius: 100px;
font-size: 28.07rpx; font-size: 28.07rpx;
} }
} }
.supply_chains-head { .supply_chains-head {
margin-bottom: 31.58rpx; margin-bottom: 31.58rpx;
position: relative; position: relative;
z-index: 2; z-index: 2;
.swiper { .swiper {
width: 694.74rpx; width: 694.74rpx;
height: 242.11rpx; height: 242.11rpx;
margin: 0 auto; margin: 0 auto;
.swi_item { .swi_item {
width: 100%; width: 100%;
height: 242.11rpx; height: 242.11rpx;
} }
} }
} }
} }
.Circle_friends { .Circle_friends {
position: relative; position: relative;
padding: 0 0 87.72rpx 0; padding: 0 0 87.72rpx 0;
background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%); background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
} }
.circle_friends_wrapper { .circle_friends_wrapper {
position: relative; position: relative;
z-index: 2; z-index: 2;
} }
.bg_color { .bg_color {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
height: 940.35rpx; height: 940.35rpx;
background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/home_bg.png") no-repeat; background: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/home_bg.png") no-repeat;
background-size: cover; background-size: cover;
} }
.search_wrapper { .search_wrapper {
width: 694.74rpx; width: 694.74rpx;
margin: 0 auto; margin: 0 auto;
} }
.tabs_wrapper { .tabs_wrapper {
width: 694.74rpx; width: 694.74rpx;
margin: 0 auto; margin: 0 auto;
margin-top: 0; margin-top: 0;
margin-bottom: 21.05rpx; margin-bottom: 21.05rpx;
::v-deep .u-tabs__wrapper__nav__item { ::v-deep .u-tabs__wrapper__nav__item {
padding: 0 !important; padding: 0 !important;
} }
} }
.empty_wrapper { .empty_wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.goods { .goods {
margin: 0 auto; margin: 0 auto;
width: 694.74rpx; width: 694.74rpx;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
.goods_item { .goods_item {
width: 342.11rpx; width: 342.11rpx;
height: 491.23rpx; height: 491.23rpx;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-bottom: 10.53rpx; margin-bottom: 10.53rpx;
.goods_img { .goods_img {
width: 100%; width: 100%;
height: 294.74rpx; height: 294.74rpx;
} }
.botm { .botm {
flex: 1; flex: 1;
padding: 0 14.04rpx; padding: 0 14.04rpx;
padding-bottom: 21.05rpx; padding-bottom: 21.05rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.title { .title {
margin: 12px 0; margin: 12px 0;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
.goods_info { .goods_info {
justify-content: space-between; justify-content: space-between;
.g_img { .g_img {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
border-radius: 50%; border-radius: 50%;
} }
.g_name { .g_name {
margin-left: 8.77rpx; margin-left: 8.77rpx;
width: 100.63rpx; width: 100.63rpx;
text-overflow: ellipsis; text-overflow: ellipsis;
/* 溢出显示省略号 */ /* 溢出显示省略号 */
overflow: hidden; overflow: hidden;
/* 溢出隐藏 */ /* 溢出隐藏 */
white-space: nowrap; white-space: nowrap;
/* 强制不换行 */ /* 强制不换行 */
} }
.nice_box { .nice_box {
display: flex; display: flex;
align-items: center; align-items: center;
.isshow { .isshow {
color: #FE3530 !important; color: #FE3530 !important;
} }
.iconfont { .iconfont {
font-size: 30rpx; font-size: 30rpx;
} }
.icon-shoucang1 { .icon-shoucang1 {
color: #F84221; color: #F84221;
} }
.collect { .collect {
font-size: 24rpx; font-size: 24rpx;
margin-left: 5rpx; margin-left: 5rpx;
} }
} }
} }
} }
} }
} }
</style> </style>

12
pages/supply_chains/supply_chains.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="Circle_friends"> <view class="Circle_friends">
<view class="circle_friends_wrapper"> <view class="circle_friends_wrapper">
<zbpSwiper :isSelectPlace="true" @selectPlce="selectPlce"></zbpSwiper> <zbpSwiper></zbpSwiper>
<view class="shop_wrapper"> <view class="shop_wrapper">
<navigator class="l_yun" hover-class="none" <navigator class="l_yun" hover-class="none"
:url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_id}`"> :url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_id}`">
@ -162,7 +162,7 @@
} }
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
page { page {
background-color: #F5F5F5; background-color: #F5F5F5;
} }
@ -188,7 +188,7 @@
.l_yun { .l_yun {
width: 456.14rpx; width: 456.14rpx;
border-radius: 8px; border-radius: 16rpx;
background-image: url("@/static/images/zonghe.png"); background-image: url("@/static/images/zonghe.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
@ -223,7 +223,7 @@
.iconlihai { .iconlihai {
font-size: 24.56rpx; font-size: 24.56rpx;
margin-left: 8px; margin-left: 16rpx;
} }
} }
@ -250,7 +250,7 @@
background: url("@/static/images/lihaiyun.png") no-repeat; background: url("@/static/images/lihaiyun.png") no-repeat;
background-size: cover; background-size: cover;
box-sizing: border-box; box-sizing: border-box;
border-radius: 8px; border-radius: 16rpx;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
@ -271,7 +271,7 @@
width: 694.74rpx; width: 694.74rpx;
margin: 0 auto; margin: 0 auto;
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 16rpx;
padding: 0 24.56rpx; padding: 0 24.56rpx;
box-sizing: border-box; box-sizing: border-box;