330 lines
7.5 KiB
Vue
330 lines
7.5 KiB
Vue
<template>
|
|
<view>
|
|
<top-bar></top-bar>
|
|
<common-header></common-header>
|
|
<category-bar alwaysShowCategory></category-bar>
|
|
|
|
<!-- banner -->
|
|
<view class="banner-outer">
|
|
<el-carousel height="365px">
|
|
<el-carousel-item v-for="item in 4" :key="item">
|
|
<image class="carousel-img"
|
|
src="http://jyx.gxwebsoft.com/uploads/20210521/336a76fbf9fe44a07b5cfd4caf6f8bb9.jpg"
|
|
mode="scaleToFill"></image>
|
|
</el-carousel-item>
|
|
</el-carousel>
|
|
</view>
|
|
<!-- banner下 -->
|
|
<div class="group-inner3">
|
|
<div class="group-inner3-list">
|
|
<a href="/support/brand.html" rel="nofollow" target="_blank">
|
|
<div class="group-inner3-listleft">
|
|
<h2>厂家直营</h2>
|
|
<p>产地货源 正规优价</p>
|
|
</div>
|
|
<div class="group-inner3-listright">
|
|
<img src="/static/images/home1.png">
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="group-inner3-list">
|
|
<a href="/market/index.html" rel="nofollow" target="_blank">
|
|
<div class="group-inner3-listleft">
|
|
<h2>采购·找现货</h2>
|
|
<p>专属采购助手<br>
|
|
为您匹配优质供应商</p>
|
|
</div>
|
|
<div class="group-inner3-listright">
|
|
<img src="/static/images/home2.png">
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="group-inner3-list">
|
|
<a href="/yellowpage/index.html" rel="nofollow" target="_blank">
|
|
<div class="group-inner3-listleft">
|
|
<h2>供应·找买家 </h2>
|
|
<p>快速发布您的产品<br>
|
|
让网上生意变的如此简单</p>
|
|
</div>
|
|
<div class="group-inner3-listright">
|
|
<img src="/static/images/home3.png">
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="clear:both;width: 100%;"></div>
|
|
|
|
<!-- 询价列表 start -->
|
|
<view class="enquiry-outer">
|
|
<view class="" style="height: 40px;"></view>
|
|
<el-divider>
|
|
<view class="divider-text">最新询价信息</view>
|
|
</el-divider>
|
|
<view class="" style="height: 40px;"></view>
|
|
<div class="mod-inner2Listcenter clearfix sliper">
|
|
<ul class="clearfix">
|
|
<li v-for="(item, index) in enquirySheetData" class="inli-mask" :key="index">
|
|
<a href="javascript:void(0)" style="display: block;" rel="nofollow" target="_blank">
|
|
<div class="detail">
|
|
<div class="detail-kind clearfix">
|
|
<div class="tag">报价中</div>
|
|
<div class="kind"><span>{{item.answerNumber || 0}}</span>家已报价</div>
|
|
</div>
|
|
<div class="detail-infor">
|
|
<span>`</span><span>50支</span>
|
|
</div>
|
|
<div class="detail-num">
|
|
<span v-if="item.user.accountType == 1" class="company">{{item.user.person.personName}}</span>
|
|
<span v-if="item.user.accountType == 2" class="company">{{item.user.company.companyName}}</span>
|
|
<span class="time">{{item._add_time_str}}</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
|
|
<div style="clear:both;width: 100%;"></div>
|
|
</ul>
|
|
</div>
|
|
</view>
|
|
<!-- 询价列表 end -->
|
|
|
|
<!-- 现货市场 start -->
|
|
<view class="" style="height: 40px;"></view>
|
|
<view class="spot-outer">
|
|
<el-divider>
|
|
<view class="divider-text">现货市场</view>
|
|
</el-divider>
|
|
<view class="" style="height: 40px;"></view>
|
|
<view class="goods-list">
|
|
<view v-for="(item, index) in spotGoodsData" :key="index" class="goods">
|
|
<view class="goods-title">{{item.name}}</view>
|
|
<view class="goods-stock">库存：{{item.stock}}吨</view>
|
|
<view class="goods-address">供货地：{{item.addressStr}}</view>
|
|
<view class="goods-image">
|
|
<image :src="item.user.businessCard.logo" mode="aspectFit"></image>
|
|
</view>
|
|
<view v-if="item.user.accountType == 1" class="goods-company">{{item.user.person.personName}}</view>
|
|
<view v-if="item.user.accountType == 2" class="goods-company">{{item.user.company.companyName}}
|
|
</view>
|
|
<el-button @click="vk.navigateTo('/pages/spot/goods/detail?id=' + item._id);" type="primary" plain
|
|
round size="small">立即查看</el-button>
|
|
</view>
|
|
</view>
|
|
<view class="text-center">
|
|
<el-button>查看更多</el-button>
|
|
</view>
|
|
</view>
|
|
<!-- 现货市场 end -->
|
|
|
|
<common-footer></common-footer>
|
|
</view>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
var vk = uni.vk;
|
|
export default {
|
|
data() {
|
|
// 页面数据变量
|
|
return {
|
|
// init请求返回的数据
|
|
spotGoodsData: [],
|
|
enquirySheetData: [],
|
|
data: {
|
|
|
|
},
|
|
// 表单请求数据
|
|
form1: {
|
|
|
|
},
|
|
scrollTop: 0,
|
|
}
|
|
},
|
|
onPageScroll(e) {
|
|
this.scrollTop = e.scrollTop;
|
|
},
|
|
// 监听 - 页面每次【加载时】执行(如：前进)
|
|
onLoad(options = {}) {
|
|
vk = uni.vk;
|
|
this.options = options;
|
|
this.init(options);
|
|
},
|
|
// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
|
|
onReady() {
|
|
|
|
},
|
|
// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
|
|
onShow() {
|
|
|
|
},
|
|
// 监听 - 页面每次【隐藏时】执行(如：返回)
|
|
onHide() {
|
|
|
|
},
|
|
// 监听 - 点击右上角转发时
|
|
onShareAppMessage(options) {
|
|
|
|
},
|
|
// 函数
|
|
methods: {
|
|
getSpotGoods() {
|
|
vk.callFunction({
|
|
url: 'client/spot/goods/pub/getList',
|
|
loading: false,
|
|
data: {
|
|
pageIndex: 1,
|
|
pageSize: 10,
|
|
},
|
|
success: (data) => {
|
|
console.log('data: ', data);
|
|
data.rows.forEach(item => {
|
|
try {
|
|
item.addressStr = item.address.province.name + "-" + item.address.city
|
|
.name + "-" + item.address.area.name
|
|
} catch (err) {
|
|
item.addressStr = ""
|
|
}
|
|
})
|
|
this.spotGoodsData = data.rows
|
|
}
|
|
});
|
|
},
|
|
getEnquirySheetList() {
|
|
vk.callFunction({
|
|
url: 'client/enquiry/sheet/pub/getList',
|
|
loading: false,
|
|
data: {
|
|
pageIndex: 1,
|
|
pageSize: 10,
|
|
},
|
|
success: (data) => {
|
|
this.enquirySheetData = data.rows
|
|
}
|
|
});
|
|
},
|
|
// 页面数据初始化函数
|
|
init(options) {
|
|
this.getSpotGoods()
|
|
this.getEnquirySheetList()
|
|
},
|
|
pageTo(path) {
|
|
vk.navigateTo(path);
|
|
}
|
|
},
|
|
// 监听器
|
|
watch: {
|
|
|
|
},
|
|
// 计算属性
|
|
computed: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.banner-outer {}
|
|
|
|
.carousel-img {
|
|
width: 760px;
|
|
height: 365px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.el-divider__text {
|
|
background-color: initial;
|
|
}
|
|
|
|
.el-carousel__item {
|
|
text-align: center;
|
|
}
|
|
|
|
.divider-text {
|
|
color: #393735;
|
|
font-size: 28px;
|
|
padding: 0 20px;
|
|
background-color: #f4f4f4;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.enquiry-outer{
|
|
width: 1200px;
|
|
margin: 0px auto;
|
|
}
|
|
|
|
.enquiry-outer .mod-inner2Listcenter {
|
|
|
|
padding: 20px 0;
|
|
}
|
|
|
|
.spot-outer{
|
|
width: 1200px;
|
|
margin: 0px auto;
|
|
}
|
|
.goods-list {
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
.goods {
|
|
width: 217px;
|
|
height: 280px;
|
|
background-color: #FFFFFF;
|
|
box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.05);
|
|
text-align: center;
|
|
margin-right: 20px;
|
|
margin-bottom: 25px;
|
|
|
|
&-title {
|
|
font-size: 15px;
|
|
color: #101010;
|
|
height: 62px;
|
|
padding-top: 20px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
&-stock {
|
|
font-size: 12px;
|
|
color: #BD3124;
|
|
}
|
|
|
|
&-address {
|
|
font-size: 12px;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
&-image {
|
|
width: 200px;
|
|
height: 70px;
|
|
margin: 0 auto;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
&-company {
|
|
color: #4F4F4F;
|
|
font-size: 14px;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
&-buy {
|
|
width: 108px;
|
|
height: 30px;
|
|
line-height: 30px;
|
|
background-color: rgba(255, 255, 255, 1);
|
|
color: rgba(169, 41, 36, 1);
|
|
font-size: 13px;
|
|
text-align: center;
|
|
font-family: Roboto;
|
|
border: 1px solid rgba(169, 41, 36, 1);
|
|
margin: 0 auto;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
</style> |