1196 lines
39 KiB
Vue
1196 lines
39 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="/static/images/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="javascript:;" @click="navTo('/pages/spot/goods/goods')" rel="nofollow">
|
||
<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="javascript:;" @click="navTo('/pages/enquiry/list')" rel="nofollow">
|
||
<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>
|
||
|
||
<view class="register">
|
||
<view class="left">
|
||
<view class="text">
|
||
<text>免费注册！！</text>
|
||
<el-divider class="divider" direction="vertical"/>
|
||
<view class="ad-text2">
|
||
<text class="yellow">成为平台会员 免费询价</text>
|
||
<text class="white">企业专享价 续重免运费 增值权益 免息账期 采购管家</text>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="right">
|
||
<el-button type="warning" round @click.native="navTo('/pages/auth/login/login')">
|
||
立即注册
|
||
<i class="el-icon-arrow-right"></i>
|
||
</el-button>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
|
||
<!-- <gap height="100" />-->
|
||
|
||
<div style="clear:both;width: 100%;"></div>
|
||
|
||
<!-- 询价列表 start -->
|
||
<view class="enquiry-outer">
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-divider>
|
||
<view class="divider-text">最新询价信息</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<div class="mod-inner2Listcenter clearfix sliper">
|
||
<ul class="clearfix">
|
||
<li v-for="(item, index) in enquirySheetData" class="inli-mask" :key="index"
|
||
@click="vk.navigateTo('/pages/enquiry/detail?id=' + item._id);">
|
||
<a href="javascript:void(0)" style="display: block;" rel="nofollow">
|
||
<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>{{item.}}</span><span>{{}}支</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 class="show-more" @click="navTo('/pages/enquiry/list')"><i class="el-icon-view"></i>查看更多</div>
|
||
</ul>
|
||
</div>
|
||
</view>
|
||
<!-- 询价列表 end -->
|
||
|
||
<!-- 现货市场 start -->
|
||
<view class="" style="height: 20px;"></view>
|
||
<view class="spot-outer">
|
||
<el-divider>
|
||
<view class="spot-divider-text">现货市场</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<view class="goods-list">
|
||
<view v-for="(item, index) in spotGoodsData" :key="index" class="goods"
|
||
:style="{marginRight:( index % 4 === 0 && index > 0) ? 0 : '25px'}">
|
||
<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 class="empty-bg-plain-btn"
|
||
@click="vk.navigateTo('/pages/spot/goods/detail?id=' + item._id);" type="primary" plain
|
||
size="small">立即查看
|
||
</el-button>
|
||
</view>
|
||
</view>
|
||
<div class="show-more" @click="navTo('/pages/spot/goods/goods')"><i class="el-icon-view"></i>查看更多</div>
|
||
</view>
|
||
<!-- 现货市场 end -->
|
||
<gap height="50"/>
|
||
|
||
<!-- 合作商家 start -->
|
||
<view class="" style="height: 20px;"></view>
|
||
<view class="spot-outer">
|
||
<el-divider>
|
||
<view class="spot-divider-text">合作商家</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<view class="goods-list">
|
||
<view v-for="(item, index) in spotGoodsData" :key="index" class="goods"
|
||
:style="{marginRight:( index % 4 === 0 && index > 0) ? 0 : '25px'}">
|
||
<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 class="empty-bg-plain-btn"
|
||
@click="vk.navigateTo('/pages/spot/goods/detail?id=' + item._id);" type="primary" plain
|
||
size="small">立即查看
|
||
</el-button>
|
||
</view>
|
||
</view>
|
||
<div class="show-more"><i class="el-icon-view"></i>查看更多</div>
|
||
</view>
|
||
<!-- 合作商家 end -->
|
||
|
||
|
||
<!-- 金久信服务商展示 start -->
|
||
<view class="w1200">
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-divider>
|
||
<view class="divider-text">金久信服务商展示</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<view class="server-card2">
|
||
<view class="item b1">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/icon9.png" mode="widthFix"
|
||
style="width: 40px;"></image>
|
||
<!-- <i class="el-icon-lock"></i> -->
|
||
<view class="text">交易安全</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易安全</el-button>
|
||
</view>
|
||
</view>
|
||
<view class="item b2">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/icon10.png" mode="widthFix"
|
||
style="width: 40px;"></image>
|
||
<!-- <i class="el-icon-lock"></i> -->
|
||
<view class="text">代检代查</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">代检代查</el-button>
|
||
</view>
|
||
</view>
|
||
<view class="item b3">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/icon11.png" mode="widthFix"
|
||
style="width: 40px;"></image>
|
||
<!-- <i class="el-icon-lock"></i> -->
|
||
<view class="text">优势资源匹配</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">优势资源匹配</el-button>
|
||
</view>
|
||
</view>
|
||
<view class="item b4">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/icon12.png" mode="widthFix"
|
||
style="width: 40px;"></image>
|
||
<!-- <i class="el-icon-lock"></i> -->
|
||
<view class="text">交易模式多元化</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易模式多元化</el-button>
|
||
</view>
|
||
</view>
|
||
<view class="item b5">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/icon13.png" mode="widthFix"
|
||
style="width: 40px;"></image>
|
||
<!-- <i class="el-icon-lock"></i> -->
|
||
<view class="text">电子合同</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">电子合同</el-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!-- 合作商家 end -->
|
||
|
||
<!-- 交易模式 start -->
|
||
<view class="w1200">
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-divider>
|
||
<view class="divider-text">交易模式</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-row :gutter="10" class="wrap" justify="space-between">
|
||
<el-col :span="6">
|
||
<el-card shadow="hover" class="transaction-card">
|
||
<view class="item">
|
||
<view class="p1">
|
||
<i class="el-icon-lock"></i>
|
||
自主交易
|
||
</view>
|
||
<view class="p2">
|
||
<view class="line"></view>
|
||
</view>
|
||
<view class="p3">
|
||
<text>货款直付销售商</text>
|
||
<text>双方平台保证金</text>
|
||
</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易流程</el-button>
|
||
</view>
|
||
</view>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-card shadow="hover" class="transaction-card">
|
||
<view class="item">
|
||
<view class="p1">
|
||
<i class="el-icon-key"></i>
|
||
金久信公正
|
||
</view>
|
||
<view class="p2">
|
||
<view class="line"></view>
|
||
</view>
|
||
<view class="p3">
|
||
<text>货款直付平台</text>
|
||
<text>交易成功后支付至销售商</text>
|
||
</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易流程</el-button>
|
||
</view>
|
||
</view>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-card shadow="hover" class="transaction-card">
|
||
<view class="item">
|
||
<view class="p1">
|
||
<i class="el-icon-postcard"></i>
|
||
信誉采购
|
||
</view>
|
||
<view class="p2">
|
||
<view class="line"></view>
|
||
</view>
|
||
<view class="p3">
|
||
<text>平台接受信誉采购的销售商</text>
|
||
<text>进行交易、到期后结算</text>
|
||
</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易流程</el-button>
|
||
</view>
|
||
</view>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-card shadow="hover" class="transaction-card">
|
||
<view class="item">
|
||
<view class="p1">
|
||
<i class="el-icon-medal"></i>
|
||
金久信自营
|
||
</view>
|
||
<view class="p2">
|
||
<view class="line"></view>
|
||
</view>
|
||
<view class="p3">
|
||
<text>货款直付平台</text>
|
||
<text>交易成功后支付至销售商</text>
|
||
</view>
|
||
<view class="p4">
|
||
<el-button plain round size="mini">交易流程</el-button>
|
||
</view>
|
||
</view>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
<!-- 交易模式 end -->
|
||
|
||
|
||
<!-- 新闻资讯 start -->
|
||
<view class="w1200">
|
||
<el-row :gutter="10" class="wrap" justify="space-between">
|
||
<el-col :span="18">
|
||
<el-card shadow="hover" class="news-card">
|
||
<div slot="header" class="clearfix">
|
||
<span class="card-title">金久信·金融服务</span>
|
||
<el-button style="float: right; color: #BD3124;" size="mini">马上开通</el-button>
|
||
</div>
|
||
<div class="jrfw-img">
|
||
<el-row :gutter="20" justify="space-between" class="jrfw-row">
|
||
<el-col :span="12">
|
||
<el-card shadow="hover">
|
||
<div class="jrfw-img-item">
|
||
<div class="info">
|
||
<div class="title">·买家采购更放心</div>
|
||
<div class="desc">先收货后付款，账期最长
|
||
<text>60</text>
|
||
天
|
||
</div>
|
||
<gap height="20"></gap>
|
||
<div class="title">·卖家销售无压力</div>
|
||
<div class="desc">账期交易未到期，资金提前放。</div>
|
||
</div>
|
||
<div class="pic">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/gg1.png"
|
||
mode="aspectFit"></image>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-card shadow="hover">
|
||
<div class="jrfw-img-item">
|
||
<div class="info">
|
||
<div class="title">利率低至年化4.35%</div>
|
||
<div class="desc">赊销卖钢材，回款不担心</div>
|
||
</div>
|
||
<div class="pic">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/gg2.png"
|
||
mode="aspectFit"></image>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
|
||
<!-- <image src="https://oss.wsdns.cn/20231207/a3ea8ffd7242453eb2242ffaaa89116d.png"
|
||
mode="widthFix"></image> -->
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-card shadow="hover" class="news-card">
|
||
<div slot="header" class="clearfix">
|
||
<span class="card-title">最新入驻</span>
|
||
</div>
|
||
<div class="news-list">
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
<el-link :underline="false">广西聚钱财实业有限公司</el-link>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
<!-- 新闻资讯 end -->
|
||
|
||
<!-- 买家入门 卖家入门 start -->
|
||
<view class="w1200">
|
||
<el-row :gutter="10" class="wrap" justify="space-between">
|
||
<el-col :span="12">
|
||
<el-card shadow="hover" class="news-card">
|
||
<div slot="header" class="clearfix">
|
||
<span class="card-title">买家入门</span>
|
||
<el-button style="float: right; padding: 3px 0; color: #999999;" type="text"
|
||
@click="navTo(`/pages/otherArticle/list?id=6573d7c3e0ec19b5047ffa8c`)">更多>
|
||
</el-button>
|
||
</div>
|
||
<div class="content">
|
||
<div class="news-img">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/xw1.jpg" mode="widthFix">
|
||
</image>
|
||
</div>
|
||
<div class="tabs">
|
||
<div class="news-list">
|
||
<el-link v-for="(item, index) in buyerArticleList" :key="index"
|
||
@click="navTo(`/pages/otherArticle/detail?id=${item._id}`)">{{
|
||
item.name
|
||
}}
|
||
</el-link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="12" class="wrap" justify="space-between">
|
||
<el-card shadow="hover" class="news-card">
|
||
<div slot="header" class="clearfix">
|
||
<span class="card-title">卖家入门</span>
|
||
<el-button style="float: right; padding: 3px 0; color: #999999;" type="text"
|
||
@click="navTo(`/pages/otherArticle/list?id=6573d7bde0ec19b5047ff941`)">更多>
|
||
</el-button>
|
||
</div>
|
||
<div class="content">
|
||
<div class="news-img">
|
||
<image src="http://jyx.gxwebsoft.com/public/index/images/xw2.jpg" mode="widthFix">
|
||
</image>
|
||
</div>
|
||
<div class="tabs">
|
||
<div class="tabs">
|
||
<div class="news-list">
|
||
<el-link @click="navTo(`/pages/otherArticle/detail?id=${item._id}`)"
|
||
v-for="(item, index) in sellerArticleList" :key="index">{{
|
||
item.name
|
||
}}
|
||
</el-link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
<!-- 买家入门 卖家入门 end -->
|
||
|
||
<!-- 资讯中心 start -->
|
||
<view class="w1200">
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-divider>
|
||
<view class="divider-text">资讯中心</view>
|
||
</el-divider>
|
||
<view class="" style="height: 20px;"></view>
|
||
<el-row :gutter="10" class="wrap" justify="space-between">
|
||
<el-col :span="6" v-for="(item, index) in articleList" :key="index">
|
||
<el-card shadow="hover">
|
||
<div slot="header" class="clearfix">
|
||
<span>{{ item.title }}</span>
|
||
</div>
|
||
<div class="news-list">
|
||
<el-link @click="navTo(`/pages/otherArticle/detail?id=${article._id}`)"
|
||
v-for="(article, articleIndex) in item.list" :key="articleIndex"
|
||
:underline="false">
|
||
{{ article.name }}
|
||
</el-link>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
<!-- 资讯中心 end -->
|
||
|
||
|
||
<view class="ad-bottom">
|
||
<el-row :gutter="10" class="wrap" justify="space-between">
|
||
<el-col :span="12">
|
||
<view class="item">
|
||
<image src="http://jyx.gxwebsoft.com/uploads/20210506/8a6b689d22ffcb382dad758e15e933f9.jpg"
|
||
mode="widthFix"/>
|
||
</view>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<view class="item">
|
||
<image src="http://jyx.gxwebsoft.com/uploads/20210506/13a1ee4c52fda80a7e03080198944671.jpg"
|
||
mode="widthFix"/>
|
||
</view>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<view class="item">
|
||
<image src="http://jyx.gxwebsoft.com/uploads/20210521/41e761a2f98cdf5a7e873ead16fb47eb.jpg"
|
||
mode="widthFix"/>
|
||
</view>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<view class="item">
|
||
<image src="http://jyx.gxwebsoft.com/uploads/20210506/8e24bf5d6b29858a8c5b1256b29ffadc.jpg"
|
||
mode="widthFix"/>
|
||
</view>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
|
||
<!-- <el-card class="register-count">
|
||
金久信已帮助6,157,952位企业解决产品供需难题
|
||
在线提交您的需求，即享专业服务
|
||
</el-card> -->
|
||
|
||
|
||
<gap height="50"/>
|
||
<common-footer></common-footer>
|
||
<right-bar></right-bar>
|
||
</view>
|
||
</template>
|
||
|
||
|
||
<script>
|
||
import Gap from "../../components/gap/gap.vue";
|
||
|
||
var vk = uni.vk;
|
||
export default {
|
||
components: {
|
||
Gap
|
||
},
|
||
data() {
|
||
// 页面数据变量
|
||
return {
|
||
// init请求返回的数据
|
||
spotGoodsData: [],
|
||
enquirySheetData: [],
|
||
data: {},
|
||
// 表单请求数据
|
||
form1: {},
|
||
scrollTop: 0,
|
||
buyerTabs: 'first',
|
||
sellerTabs: 'first',
|
||
sellerArticleList: [],
|
||
buyerArticleList: [],
|
||
articleList: [
|
||
{
|
||
id: '657451bb6e5d2d335ab78b3a',
|
||
title: '市场信息',
|
||
list: []
|
||
},
|
||
{
|
||
id: '65745200337a9f07565fb08d',
|
||
title: '期货信息',
|
||
list: []
|
||
},
|
||
{
|
||
id: '6574520a7ad52d34471a9582',
|
||
title: '行情分析',
|
||
list: []
|
||
},
|
||
{
|
||
id: '6574521499c62431df5b562c',
|
||
title: '行业动态',
|
||
list: []
|
||
},
|
||
]
|
||
}
|
||
},
|
||
onPageScroll(e) {
|
||
this.scrollTop = e.scrollTop;
|
||
},
|
||
// 监听 - 页面每次【加载时】执行(如：前进)
|
||
onLoad(options = {}) {
|
||
console.log(options)
|
||
vk = uni.vk;
|
||
this.options = options;
|
||
this.init(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()
|
||
this.getBuyerArticle()
|
||
this.getArticle()
|
||
this.geSellerArticle()
|
||
},
|
||
navTo(path) {
|
||
vk.navigateTo(path);
|
||
},
|
||
getBuyerArticle() {
|
||
vk.callFunction({
|
||
url: 'client/otherArticle/list/pub/getList',
|
||
data: {
|
||
pageIndex: 1,
|
||
pageSize: 5,
|
||
parentId: '6573d7c3e0ec19b5047ffa8c',
|
||
},
|
||
success: (data) => {
|
||
this.buyerArticleList = data.rows
|
||
}
|
||
});
|
||
},
|
||
geSellerArticle() {
|
||
vk.callFunction({
|
||
url: 'client/otherArticle/list/pub/getList',
|
||
data: {
|
||
pageIndex: 1,
|
||
pageSize: 5,
|
||
parentId: '6573d7bde0ec19b5047ff941',
|
||
},
|
||
success: (data) => {
|
||
this.sellerArticleList = data.rows
|
||
}
|
||
});
|
||
},
|
||
getArticle() {
|
||
this.articleList.forEach((item, index) => {
|
||
vk.callFunction({
|
||
url: 'client/otherArticle/list/pub/getList',
|
||
data: {
|
||
pageIndex: 1,
|
||
pageSize: 5,
|
||
parentId: item.id,
|
||
},
|
||
success: (data) => {
|
||
this.articleList[index].list = data.rows
|
||
}
|
||
});
|
||
})
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.w1200 {
|
||
width: 1200px;
|
||
margin: 20px auto;
|
||
}
|
||
|
||
.register {
|
||
background-color: #3d5fda;
|
||
width: 1200px;
|
||
height: 88px;
|
||
margin: 20px auto;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.text {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 30px;
|
||
color: #ffffff;
|
||
padding-left: 50px;
|
||
|
||
.divider {
|
||
margin: 0 30px;
|
||
transform: translateX(-10%);
|
||
}
|
||
|
||
.ad-text2 {
|
||
display: flex;
|
||
flex-direction: column;
|
||
font-size: 18px;
|
||
|
||
// transform: rotate(0.1turn);
|
||
.yellow {
|
||
color: #fcb800;
|
||
font-size: 25px;
|
||
}
|
||
|
||
.white {
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
padding-right: 50px;
|
||
display: flex;
|
||
}
|
||
}
|
||
|
||
.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;
|
||
}
|
||
|
||
.spot-divider-text {
|
||
color: #393735;
|
||
font-size: 28px;
|
||
font-weight: bold;
|
||
padding: 0 20px;
|
||
background-color: white;
|
||
}
|
||
|
||
.enquiry-outer {
|
||
width: 1200px;
|
||
margin: 0px auto;
|
||
|
||
.inli-mask {
|
||
padding: 20px;
|
||
min-height: 120px;
|
||
}
|
||
}
|
||
|
||
.show-more {
|
||
clear: both;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #ffffff;
|
||
background-color: #BD3124;
|
||
text-align: center;
|
||
width: 150px;
|
||
margin: 0 auto;
|
||
height: 40px;
|
||
cursor: pointer;
|
||
|
||
.el-icon-view {
|
||
font-size: 18px;
|
||
padding-right: 5px;
|
||
}
|
||
}
|
||
|
||
.enquiry-outer .mod-inner2Listcenter {
|
||
|
||
padding: 20px 0;
|
||
}
|
||
|
||
.spot-outer {
|
||
width: 1200px;
|
||
margin: 0px auto;
|
||
background-color: white;
|
||
padding: 50px;
|
||
}
|
||
|
||
.goods-list {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.goods {
|
||
width: 200px;
|
||
//height: 280px;
|
||
background-color: #FFFFFF;
|
||
box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.05);
|
||
text-align: center;
|
||
//margin-right: 25px;
|
||
margin-bottom: 25px;
|
||
padding: 10px 20px;
|
||
|
||
&-title {
|
||
font-size: 15px;
|
||
color: #101010;
|
||
height: 62px;
|
||
padding-top: 20px;
|
||
font-weight: bold;
|
||
text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
-webkit-line-clamp: 2;
|
||
}
|
||
|
||
&-stock {
|
||
font-size: 12px;
|
||
color: #BD3124;
|
||
}
|
||
|
||
&-address {
|
||
font-size: 12px;
|
||
margin: 10px 0;
|
||
}
|
||
|
||
&-image {
|
||
width: 100%;
|
||
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;
|
||
}
|
||
|
||
|
||
.goods-address {
|
||
color: gray;
|
||
}
|
||
|
||
}
|
||
|
||
.detail-num .company {
|
||
font-size: 15px !important;
|
||
line-height: 2em;
|
||
}
|
||
|
||
.ad-bottom {
|
||
width: 1200px;
|
||
margin: 40px auto;
|
||
|
||
.item {
|
||
margin: 3px 0;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.wrap {
|
||
flex-wrap: wrap;
|
||
}
|
||
}
|
||
|
||
.register-count {
|
||
width: 1200px;
|
||
margin: auto;
|
||
}
|
||
|
||
.card-title {
|
||
color: #BD3124;
|
||
}
|
||
|
||
.clearfix {
|
||
font-size: 16px;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.news-list {
|
||
width: 330px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: self-start;
|
||
line-height: 1.8em;
|
||
}
|
||
|
||
.news-card {
|
||
.news-img {
|
||
image {
|
||
width: 200px;
|
||
}
|
||
}
|
||
|
||
.content {
|
||
display: flex;
|
||
|
||
.tabs {
|
||
padding: 0 20px;
|
||
}
|
||
|
||
.news-list {
|
||
width: 330px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: self-start;
|
||
line-height: 1.8em;
|
||
// .ellipsis {
|
||
// width: 320px;
|
||
// display: flex;
|
||
// flex-direction: column;
|
||
// align-items: self-start;
|
||
// overflow: hidden;
|
||
// white-space: nowrap;
|
||
// text-overflow: ellipsis;
|
||
// }
|
||
}
|
||
}
|
||
}
|
||
|
||
.jrfw-img {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
flex: 1;
|
||
|
||
.jrfw-row {
|
||
width: 100%;
|
||
|
||
}
|
||
|
||
height: 184px;
|
||
|
||
image {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
.jrfw-img-item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
flex: 1;
|
||
|
||
.info {
|
||
.title {
|
||
font-weight: 400;
|
||
font-size: 17px;
|
||
}
|
||
|
||
.desc {
|
||
color: #666666;
|
||
|
||
text {
|
||
font-size: 20px;
|
||
color: #BD3124;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pic {
|
||
width: 156px;
|
||
|
||
image {
|
||
width: 156px;
|
||
height: 136px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.transaction-card {
|
||
.item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
height: 150px;
|
||
|
||
.p1 {
|
||
font-size: 20px;
|
||
font-weight: 500;
|
||
|
||
i {
|
||
font-size: 20px;
|
||
padding: 0 4px;
|
||
}
|
||
}
|
||
|
||
.p2 {
|
||
.line {
|
||
width: 40px;
|
||
height: 3px;
|
||
border-radius: 100px;
|
||
background-color: #BD3124;
|
||
}
|
||
}
|
||
|
||
.p3 {
|
||
display: flex;
|
||
flex-direction: column;
|
||
text-align: center;
|
||
font-size: 15px;
|
||
color: #666;
|
||
}
|
||
}
|
||
}
|
||
|
||
.transaction-card:hover {
|
||
background-color: #BD3124;
|
||
|
||
.p1 {
|
||
color: #ffffff;
|
||
}
|
||
|
||
.p2 {
|
||
.line {
|
||
width: 40px;
|
||
height: 3px;
|
||
border-radius: 100px;
|
||
background-color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.p3 {
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.server-card2 {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.item {
|
||
width: 240px;
|
||
height: 270px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
cursor: pointer;
|
||
|
||
i {
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
}
|
||
|
||
.p4 {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.text {
|
||
display: none;
|
||
}
|
||
|
||
}
|
||
|
||
.b1 {
|
||
background: url('http://jyx.gxwebsoft.com/public/index/images/god1hover.jpg');
|
||
background-position: center;
|
||
background-size: 150%;
|
||
}
|
||
|
||
.b1:hover {
|
||
width: 380px;
|
||
/* 添加过渡属性效果 */
|
||
transition: width .1s linear;
|
||
|
||
.text {
|
||
display: block;
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
padding-top: 10px;
|
||
}
|
||
}
|
||
|
||
.b2 {
|
||
background: url('http://jyx.gxwebsoft.com/public/index/images/god2hover.jpg');
|
||
background-position: center;
|
||
background-size: 150%;
|
||
}
|
||
|
||
.b2:hover {
|
||
width: 380px;
|
||
/* 添加过渡属性效果 */
|
||
transition: width .1s linear;
|
||
|
||
.text {
|
||
display: block;
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
padding-top: 10px;
|
||
}
|
||
}
|
||
|
||
.b3 {
|
||
background: url('http://jyx.gxwebsoft.com/public/index/images/god3hover.jpg');
|
||
background-position: center;
|
||
background-size: 150%;
|
||
}
|
||
|
||
.b3:hover {
|
||
width: 380px;
|
||
/* 添加过渡属性效果 */
|
||
transition: width .1s linear;
|
||
|
||
.text {
|
||
display: block;
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
padding-top: 10px;
|
||
}
|
||
}
|
||
|
||
.b4 {
|
||
background: url('http://jyx.gxwebsoft.com/public/index/images/god4hover.jpg');
|
||
background-position: center;
|
||
background-size: 150%;
|
||
}
|
||
|
||
.b4:hover {
|
||
width: 380px;
|
||
/* 添加过渡属性效果 */
|
||
transition: width .1s linear;
|
||
|
||
.text {
|
||
display: block;
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
padding-top: 10px;
|
||
}
|
||
}
|
||
|
||
.b5 {
|
||
background: url('http://jyx.gxwebsoft.com/public/index/images/god5hover.jpg');
|
||
background-position: center;
|
||
background-size: 150%;
|
||
}
|
||
|
||
.b5:hover {
|
||
width: 380px;
|
||
/* 添加过渡属性效果 */
|
||
transition: width .1s linear;
|
||
|
||
.text {
|
||
display: block;
|
||
color: #ffffff;
|
||
font-size: 24px;
|
||
padding-top: 10px;
|
||
}
|
||
}
|
||
}
|
||
</style> |