获取地址,获取不同地区的里海云仓

This commit is contained in:
cc_zbp 2023-05-19 11:12:35 +08:00
parent 17dcf15a47
commit 1539e07755
2 changed files with 407 additions and 465 deletions

View File

@ -7,7 +7,7 @@
<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">{{location_Arr.location_name}}</view> <view class="town_name">{{street}}</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>
@ -51,13 +51,14 @@
type: Boolean, type: Boolean,
default: false default: false
}, },
location_Arr:{ location_Arr: {
type:Object, type: Object,
default:()=>({}) default: () => ({})
} }
}, },
data() { data() {
return { return {
street: '',
showPicker: false, showPicker: false,
styleConfig: [], styleConfig: [],
columnData: [], columnData: [],
@ -76,20 +77,19 @@
}, },
} }
}, },
// computed: mapGetters(['location']), computed: mapGetters(['location']),
watch: {}, watch: {},
created() { created() {
this.getBanner() this.getBanner()
this.Area() this.Area()
// this.selfLocation() this.street = JSON.parse(this.location).address_component.street
// const loca = JSON.parse(this.location)
// this.street = loca.address_component.street
}, },
methods: { methods: {
selectLocation() { selectLocation() {
this.isSelectPlace ? this.showPicker = true : '' this.isSelectPlace ? this.showPicker = true : ''
}, },
confirm(e) { confirm(e) {
this.street = e.value[1].name
this.showPicker = false this.showPicker = false
this.$emit('selectPlce', e) this.$emit('selectPlce', e)
}, },
@ -110,17 +110,13 @@
} }
}, },
Area() { Area() {
getArea({ getArea({ city_code: 510500 }).then(res => {
city_code: 510500
}).then(res => {
this.$refs.uPicker.setColumnValues(0, res.data); this.$refs.uPicker.setColumnValues(0, res.data);
this.Street(res.data[0]['code']); this.Street(res.data[0]['code']);
}); });
}, },
Street(code) { Street(code) {
getStreet({ getStreet({ area_code: code }).then(res => {
area_code: code
}).then(res => {
this.$refs.uPicker.setColumnValues(1, res.data); this.$refs.uPicker.setColumnValues(1, res.data);
}); });
}, },
@ -139,12 +135,7 @@
}, },
async getBanner(id) { async getBanner(id) {
let that = this; let that = this;
const { data } = await getDiy({ id: 0 })
const {
data
} = await getDiy({
id: 0
})
that.styleConfig = that.objToArr(data.value); that.styleConfig = that.objToArr(data.value);
/* 循环数组得到数据*/ /* 循环数组得到数据*/
that.styleConfig.forEach((item, index, arr) => { that.styleConfig.forEach((item, index, arr) => {

View File

@ -1,498 +1,449 @@
<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" :location_Arr="locationArr"></zbpSwiper> <zbpSwiper :isSelectPlace="true" @selectPlce="selectPlce" :location_Arr="locationArr"></zbpSwiper>
<view class="shop_wrapper"> <view class="shop_wrapper">
<navigator class="l_yun" hover-class="none" <!-- locationArr.address_reference.town.id -->
:url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${locationArr.address_reference.town.id}`" <navigator class="l_yun" hover-class="none"
:style=" {'background-image': `url(${bgData[0].pic})`}"> :url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_id}`"
<view class=" text-name"> :style=" {'background-image': `url(${bgData[0].pic})`}">
<text>{{locationArr.location_name}}</text> <view class=" text-name">
<view class="name_town">-供销综合云市场-</view> <text>{{town}}</text>
</view> <view class="name_town">-供销综合云市场-</view>
</navigator> </view>
<view class="r_lihai" hover-class="none" @click="go_shop()" </navigator>
:style=" {'background-image': `url(${bgData[1].pic})`}"> <view class="r_lihai" @click="go_shop" :style=" {'background-image': `url(${bgData[1].pic})`}">
<view class="title">里海云仓</view> <view class="title">里海云仓</view>
</view> </view>
</view> </view>
<view class="tabs_wrapper flex_a_c_j_sb"> <view class="tabs_wrapper flex_a_c_j_sb">
<view class="title flex_a_c">热点资讯</view> <view class="title flex_a_c">热点资讯</view>
<navigator class="flex_a_c" hover-class="none" url="/pages/news_list/index"> <navigator class="flex_a_c" hover-class="none" url="/pages/news_list/index">
更多 更多
<view class="iconfont icon-gengduo3"></view> <view class="iconfont icon-gengduo3"></view>
</navigator> </navigator>
</view> </view>
<view class="article_box"> <view class="article_box">
<block v-for="(item, index) in recoList.slice(0,2)" :key="index"> <block v-for="(item, index) in recoList.slice(0,2)" :key="index">
<navigator :url='"/pages/news_details/index?id="+item.article_id' hover-class='none' <navigator :url='"/pages/news_details/index?id="+item.article_id' hover-class='none' class='article-item'>
class='article-item'> <view class='text'>
<view class='text'> <view class='name'>{{item.title}}</view>
<view class='name'>{{item.title}}</view> <view class="time">{{item.create_time}}</view>
<view class="time">{{item.create_time}}</view> </view>
</view> <view class='pictrue'>
<view class='pictrue'> <image :src='item.image_input'></image>
<image :src='item.image_input'></image> </view>
</view> </navigator>
</navigator> </block>
</block> </view>
</view>
<view class="tabs_wrapper"> <view class="tabs_wrapper">
<u-tabs :list="tabsData.list" @click="tabsChange" keyName="title" lineColor="#F84221"></u-tabs> <u-tabs :list="tabsData.list" @click="tabsChange" keyName="title" lineColor="#F84221"></u-tabs>
</view> </view>
<view class="goods"> <view class="goods">
<block v-for="(item,index) in articleList" :key="index"> <block v-for="(item,index) in articleList" :key="index">
<view class="goods_item" @click="gogogo(item)"> <view class="goods_item" @click="gogogo(item)">
<image class="goods_img" :src="item.image_input" mode="aspectFill"></image> <image class="goods_img" :src="item.image_input" 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'" <image :src="(item.author && item.author.avatar) || '/static/images/f.png'" mode="aspectFill"
mode="aspectFill" class="g_img"></image> class="g_img"></image>
<view class="g_name">{{item.author}}</view> <view class="g_name">{{item.author}}</view>
</view> </view>
<view class="nice_box" @click.stop="giveStart(item)"> <view class="nice_box" @click.stop="giveStart(item)">
<text class="iconfont" <text class="iconfont" :class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
:class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text> <text class="collect">{{item.count_start}}</text>
<text class="collect">{{item.count_start}}</text> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </block>
</block> </view>
</view> <view class="empty_wrapper" v-if="emptyShow">
<view class="empty_wrapper" v-if="emptyShow"> <u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
<u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty> </view>
</view> </view>
</view>
<!-- <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 zbpSwiper from '@/components/zbpSwiper' import zbpSwiper from '@/components/zbpSwiper'
import { import { mapGetters } from 'vuex'
mapGetters import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
} from 'vuex' import { graphicStartApi } from '@/api/community.js'
import mTabbar from '@/components/m-tabbar/m-tabbar.vue' import { getArticleList, getArticleCategoryList, get_cloud_shop } from '@/api/api.js'
import { import { getHotBanner } from '@/api/store.js'
graphicStartApi import { Toast } from '@/libs/uniApi'
} from '@/api/community.js' import { getGeocoder } from '@/api/store.js';
import { export default {
getArticleList, components: {
getArticleCategoryList, mTabbar,
get_cloud_shop zbpSwiper
} from '@/api/api.js' },
import { data() {
getHotBanner return {
} from '@/api/store.js' tabsData: {
import { list: [],
Toast tabsActive: 0
} from '@/libs/uniApi' },
import { town: '',
getGeocoder emptyShow: false,
} from '@/api/store.js'; articleList: [],
recoList: [],
export default { street_id: '',
components: { bgData: [{ pic: '' }, { pic: '' }],
mTabbar, store_id: '',
zbpSwiper locationArr: ({}),
}, setrecommend_address: "",
data() { mer_id: 0
return { }
tabsData: { },
list: [], onLoad() {
tabsActive: 0 getHotBanner('good').then(res => {
}, this.bgData = res.data
town: '', })
emptyShow: false, this.getArticle()
articleList: [], getArticleList(19).then(res => {
recoList: [], this.recoList = res.data.list
street_id: '', })
bgData: [{ console.log("位置", JSON.parse(this.location));
pic: '' const LOCA = JSON.parse(this.location)
}, { this.street_id = LOCA.address_reference.town.id
pic: '' this.getCloudShopMerId(this.street_id)
}], this.town = LOCA.address_component.street ?? ''
store_id: '', },
locationArr: ({}), onShow() {},
setrecommend_address: "", computed: mapGetters(['location']),
mer_id: 0 watch: {
} location(newVal, oldVal) {
}, console.log('newVal', newVal);
return newVal
onLoad() { }
getHotBanner('good').then(res => { },
this.bgData = res.data methods: {
}) selectPlce(e) {
uni.$on('resetLocation', function() { console.log("e", e);
console.log('resetLocation'); this.street_id = e.value[1].code
}) this.store_id = e.value[1].id
this.getArticle() this.town = e.value[1].name
this.selfLocation() this.getCloudShopMerId(e.value[1].code)
getArticleList(19).then(res => { },
this.recoList = res.data.list getCloudShopMerId(id) {
}) get_cloud_shop(id).then(res => {
}, this.mer_id = res.data.mer_id ?? 0
onShow() {}, })
methods: { },
selfLocation() { navigat() {
let self = this uni.navigateTo({
uni.getLocation({ url: '/pages/store/settledApply/settledApply'
type: 'gcj02', })
success: (res) => { },
let latitude, longitude; gogogo(item) {
latitude = res.latitude.toString(); uni.navigateTo({
longitude = res.longitude.toString(); url: '/pages/news_details/index?id=' + item.article_id
this.latitude = res.latitude })
this.longitude = res.longitude },
getGeocoder({ go_shop() {
lat: latitude, if (this.mer_id == 0) {
long: longitude return Toast('当前区域没有云仓库')
}).then(res => { }
this.locationArr = res.data console.log(this.mer_id)
this.locationArr.location_name = res.data.address_component.street uni.navigateTo({
get_cloud_shop(res.data.address_reference.town.id).then(re => { url: '/pages/store/home/index?id=' + this.mer_id + '&LihaiYun=Lihai'
if(re.data.mer_id){ })
this.mer_id = re.data.mer_id },
} async getArticle() {
}) let list = []
}).catch(err => Toast(err)) const { data } = await getArticleCategoryList()
data.map((item, index) => {
}, if (item.title !== '推荐') {
fail: (err) => { list.push(item)
Toast(err) }
}, })
}); this.tabsData.list = list
this.getArticleList(list[0].article_category_id)
}, },
async getArticleList(id) {
selectPlce(e) { const { data } = await getArticleList(id)
this.articleList = data.list
this.street_id = e.value[1].code },
this.store_id = e.value[1].id //
this.town = e.value[1].name giveStart(item) {
get_cloud_shop(e.value[1].code).then(re => { // let status = item.status ? 0 : 1
this.mer_id = re.data.mer_id // graphicStartApi(item.community_id, { status: status }).then(res => {
}) // Toast(res.message)
// this.getArticleList()
}, // })
navigat() { },
uni.navigateTo({ tabsChange(item) {
url: '/pages/store/settledApply/settledApply' this.getArticleList(item.article_category_id)
}) this.street_id = item.id
}, this.tabsData.tabsActive = item.index
gogogo(item) { },
uni.navigateTo({ },
url: '/pages/news_details/index?id=' + item.article_id onPullDownRefresh() {
}) uni.stopPullDownRefresh()
}, }
go_shop(id) { }
if (this.mer_id == 0) {
Toast('当前区域没有云仓库')
return false
}
console.log(this.mer_id)
uni.navigateTo({
url: '/pages/store/home/index?id=' + this.mer_id + '&LihaiYun=Lihai'
})
},
async getArticle() {
let list = []
const {
data
} = await getArticleCategoryList()
data.map((item, index) => {
if (item.title !== '推荐') {
list.push(item)
}
})
this.tabsData.list = list
this.getArticleList(list[0].article_category_id)
},
async getArticleList(id) {
const {
data
} = await getArticleList(id)
this.articleList = data.list
},
//
giveStart(item) {
// let status = item.status ? 0 : 1
// graphicStartApi(item.community_id, { status: status }).then(res => {
// Toast(res.message)
// this.getArticleList()
// })
},
tabsChange(item) {
this.getArticleList(item.article_category_id)
this.street_id = item.id
this.tabsData.tabsActive = item.index
},
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.Circle_friends { .Circle_friends {
background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%); background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
} }
.shop_wrapper { .shop_wrapper {
height: 192.98rpx; height: 192.98rpx;
width: 694.74rpx; width: 694.74rpx;
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-top: 0; margin-top: 0;
.l_yun { .l_yun {
width: 456.14rpx; width: 456.14rpx;
border-radius: 16rpx; 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;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
.text-name { .text-name {
margin-top: 14.04rpx; margin-top: 14.04rpx;
text-align: center; text-align: center;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
font-size: 29.82rpx; font-size: 29.82rpx;
text { text {
font-size: 40.35rpx; font-size: 40.35rpx;
} }
} }
.yun_title { .yun_title {
color: #B24322; color: #B24322;
background-color: #ffad99; background-color: #ffad99;
height: 56.14rpx; height: 56.14rpx;
clip-path: polygon(0% 0, 100% 0, 90% 100%, 0 100%); clip-path: polygon(0% 0, 100% 0, 90% 100%, 0 100%);
text-align: center; text-align: center;
line-height: 56.14rpx; line-height: 56.14rpx;
padding: 0 31.58rpx 0 21.05rpx; padding: 0 31.58rpx 0 21.05rpx;
width: max-content; width: max-content;
.iconlihai { .iconlihai {
font-size: 24.56rpx; font-size: 24.56rpx;
margin-left: 16rpx; margin-left: 16rpx;
} }
} }
.text_cont { .text_cont {
position: absolute; position: absolute;
left: 21.05rpx; left: 21.05rpx;
bottom: 47.37rpx; bottom: 47.37rpx;
color: #7F1616; color: #7F1616;
font-weight: 700; font-weight: 700;
font-size: 31.58rpx; font-size: 31.58rpx;
.name_town { .name_town {
font-size: 49.12rpx; font-size: 49.12rpx;
} }
} }
} }
.r_lihai { .r_lihai {
width: 217.54rpx; width: 217.54rpx;
height: 100%; height: 100%;
font-size: 35.09rpx; font-size: 35.09rpx;
padding-top: 28.07rpx; padding-top: 28.07rpx;
text-align: center; text-align: center;
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: 16rpx; border-radius: 16rpx;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
.title { .title {
margin-top: 105.26rpx; margin-top: 105.26rpx;
} }
} }
} }
.tabs_wrapper { .tabs_wrapper {
width: 694.74rpx; width: 694.74rpx;
margin: 38.6rpx auto; margin: 38.6rpx auto;
margin-bottom: 21.05rpx; margin-bottom: 21.05rpx;
.title { .title {
font-size: 31.58rpx; font-size: 31.58rpx;
font-weight: bold; font-weight: bold;
&::before { &::before {
content: ''; content: '';
display: inline-block; display: inline-block;
width: 3px; width: 3px;
height: 31.58rpx; height: 31.58rpx;
background-color: #F84221; background-color: #F84221;
margin-right: 7.02rpx; margin-right: 7.02rpx;
} }
} }
} }
.article_box { .article_box {
height: 100%; height: 100%;
width: 694.74rpx; width: 694.74rpx;
margin: 0 auto; margin: 0 auto;
background-color: #fff; background-color: #fff;
border-radius: 16rpx; border-radius: 16rpx;
padding: 0 24.56rpx; padding: 0 24.56rpx;
box-sizing: border-box; box-sizing: border-box;
.title-box { .title-box {
height: 87.72rpx; height: 87.72rpx;
text { text {
font-size: 28.07rpx; font-size: 28.07rpx;
} }
} }
.article-item { .article-item {
display: flex; display: flex;
// height: 175.44rpx; // height: 175.44rpx;
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;
padding: 21.05rpx 0; padding: 21.05rpx 0;
.text { .text {
flex: 1; flex: 1;
height: 122.81rpx; height: 122.81rpx;
margin-right: 17.54rpx; margin-right: 17.54rpx;
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.name { .name {
font-size: 26.32rpx; font-size: 26.32rpx;
color: #282828; color: #282828;
} }
} }
.pictrue { .pictrue {
width: 175.44rpx; width: 175.44rpx;
height: 122.81rpx; height: 122.81rpx;
image { image {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 8px; border-radius: 8px;
} }
} }
} }
} }
.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>