b2894lxlx/jjx-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成特产商城页面制作

Browse Source
This commit is contained in:
gxwebsoft
2023-12-04 02:58:50 +08:00
parent fcd32fe59f
commit 2cc1345390
5 changed files with 390 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/index/self-support/self-support.vue
+24 -24
View File
@@ -31,7 +31,7 @@
<el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -39,7 +39,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -47,7 +47,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -55,7 +55,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -63,7 +63,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -71,7 +71,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -79,7 +79,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -87,7 +87,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -97,7 +97,7 @@
<u-gap height="5" bg-color="#f3f3f3" /><el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -105,7 +105,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -113,7 +113,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -121,7 +121,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -129,7 +129,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -137,7 +137,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -145,7 +145,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -153,7 +153,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -164,7 +164,7 @@
<el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -172,7 +172,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -180,7 +180,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -188,7 +188,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -196,7 +196,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -204,7 +204,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -212,7 +212,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
@@ -220,7 +220,7 @@
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<el-image class="image" src="https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
pages/index/shop/detail.vue
+259
View File
@@ -0,0 +1,259 @@
<template>
<view>
<top-bar></top-bar>
<common-header></common-header>
<category-bar></category-bar>
<view class="w-1200">
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
<view class="tool-bar">
<view class="search">
<text>地区：</text>
<el-cascader :options="options">
<template slot-scope="{ node, data }">
<span>{{ data.label }}</span>
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
</template>
</el-cascader>
</view>
<view class="buy-btn">
<image src="https://oss.wsdns.cn/20231204/bcc976f4396e437abf19deb11c1f06b4.png" mode="widthFix" />
</view>
</view>
<view class="tool-bar">
<view class="item">分类：</view>
<view class="item">全部</view>
<view class="item">果蔬农产品</view>
<view class="item">特产食品粮油肉蛋禽</view>
<view class="item">茶类</view>
<view class="item">酒类</view>
<view class="item">工艺类</view>
<view class="item">旅游户外商用</view>
<view class="item">日用美容洗涤</view>
<view class="item">电子产品</view>
</view>
</view>
<view class="goods-list">
<el-row class="wrap" type="flex" :gutter="10" justify="space-between">
<el-col :span="5">
<div class="grid-content bg-purple" @click="navTo('/pages/goods-detail/goods-detail?id=1')">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">
<el-tag
type="danger"
size="mini">
自营
</el-tag>
商品名称
</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="5">
<div class="grid-content bg-purple">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="5">
<div class="grid-content bg-purple">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="5">
<div class="grid-content bg-purple">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="4">
<div class="grid-content bg-purple">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="5">
<div class="grid-content bg-purple">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
</el-row>
<div class="pagination">
<el-pagination
background
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</view>
<!-- 现货市场 end -->
<gap height="50"/>
<common-footer></common-footer>
</view>
</template>
<script>
import UGap from "@/uni_modules/vk-uview-ui/components/u-gap/u-gap.vue";
export default {
components: {UGap},
data() {
return {
list: [{
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
title: '身无彩凤双飞翼，心有灵犀一点通'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
}
],
options: [{
value: 'zhinan',
label: '广西',
children: [{
value: 'shejiyuanze',
label: '南宁市',
children: [{
value: 'yizhi',
label: '良庆区'
}, {
value: 'fankui',
label: 'XXX'
}, {
value: 'xiaolv',
label: 'XXX'
}, {
value: 'kekong',
label: 'XXX'
}]
}, {
value: 'daohang',
label: '北海市',
children: [{
value: 'cexiangdaohang',
label: 'XXX'
}, {
value: 'dingbudaohang',
label: 'XXX'
}]
}]
}]
};
},
onLoad(options) {
console.log(options);
if (options && options.menu) {
this.currMenu = options.menu
}
},
methods: {
menuSelect(e) {
this.currMenu = e
},
navTo(url) {
vk.navigateTo(url);
}
}
}
</script>
<style lang="scss">
.w-1200 {
width: 1200px;
margin: 20px auto;
background-color: #fff;
.test{
height: 50px;
color: #ffffff;
font-size: 18px;
background-color: #bf2b28;
display: flex;
align-items: center;
justify-content: center;
text{
margin: 0 20px;
}
}
.tool-bar{
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px;
font-size: 16px;
.search{
display: flex;
align-items: center;
}
}
}
.wrap{
flex-wrap: wrap;
}
.goods-list{
width: 1200px;
margin: 20px auto;
.grid-content{
display: flex;
justify-content: center;
background-color: #fff;
width: 100%;
padding: 10px;
margin-bottom: 10px;
flex-direction: column;
.comments{
display: flex;
flex-direction: column;
justify-content: start;
line-height: 2em;
.goods-name{
font-size: 16px;
display: flex;
align-items: center;
}
.goods-price{
color: #bf2b28;
font-size: 20px;
font-weight: 600;
}
}
}
.bg-purple{
border-top: 1px solid #f3f3f3;
border-right: 1px solid #f3f3f3;
image{
width: 180px;
height: 180px;
}
}
}
.pagination{
width: 1200px;
margin: 20px auto;
display: flex;
justify-content: center;
}
</style>
pages/index/shop/shop.vue
+97 -204
View File
@@ -5,14 +5,9 @@
<category-bar></category-bar>
<view class="w-1200">
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
<view class="test">
<text @click="navTo('/pages/index/self-support/self-support')">自营钢城</text>
<text @click="navTo('/pages/index/server/server')">平台服务</text>
<text @click="navTo('/pages/index/shop/shop')">特产商城</text>
</view>
<view class="tool-bar">
<view class="search">
<text>交易区域：</text>
<text>地区：</text>
<el-cascader :options="options">
<template slot-scope="{ node, data }">
<span>{{ data.label }}</span>
@@ -21,214 +16,94 @@
</el-cascader>
</view>
<view class="buy-btn">
<u-button type="error" plain>下单询价</u-button>
<image src="https://oss.wsdns.cn/20231204/bcc976f4396e437abf19deb11c1f06b4.png" mode="widthFix" />
</view>
</view>
<!-- 合作单位/联营单位-->
<view class="cooperate">
<view class="title">合作单位/联营单位</view>
<u-gap height="5" bg-color="#f3f3f3" />
<el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
</el-row>
<u-gap height="5" bg-color="#f3f3f3" /><el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="tool-bar">
<view class="item">分类：</view>
<view class="item">全部</view>
<view class="item">果蔬农产品</view>
<view class="item">特产食品粮油肉蛋禽</view>
<view class="item">茶类</view>
<view class="item">酒类</view>
<view class="item">工艺类</view>
<view class="item">旅游户外商用</view>
<view class="item">日用美容洗涤</view>
<view class="item">电子产品</view>
</view>
</view>
<view class="goods-list">
<el-row class="wrap" type="flex" :gutter="10" justify="space-between">
<el-col :span="5">
<div class="grid-content bg-purple" @click="navTo('/pages/goods-detail/goods-detail?id=1')">
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">
<el-tag
type="danger"
size="mini">
自营
</el-tag>
商品名称
</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="6">
<el-col :span="5">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="6">
<el-col :span="5">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="6">
<el-col :span="5">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="6">
<el-col :span="4">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
<el-col :span="6">
<el-col :span="5">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<image src="http://jyx.gxwebsoft.com/uploads/20210828/0d9c23898f9c922fd96983f974d3fe84.jpg" mode="aspectFit" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
<view class="goods-name">商品名称</view>
<view class="goods-price">￥139.00</view>
</view>
</div>
</el-col>
</el-row>
<u-gap height="5" bg-color="#f3f3f3" />
<el-row class="wrap" type="flex" :gutter="0" justify="space-between">
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-image class="image" src="http://localhost:8080/static/img/logo.d1f4a2b6.png" />
<view class="comments">
主营：架子管 扣件 建筑材料租赁
</view>
</div>
</el-col>
</el-row>
<u-gap height="5" bg-color="#f3f3f3" />
</view>
<div class="pagination">
<el-pagination
background
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</view>
<!-- 现货市场 end -->
<gap height="50"/>
@@ -334,33 +209,51 @@ export default {
align-items: center;
}
}
.cooperate{
.title{
text-align: center;
color: #bf2b28;
font-size: 28px;
line-height: 3em;
}
.wrap{
flex-wrap: wrap;
}
.grid-content{
}
.wrap{
flex-wrap: wrap;
}
.goods-list{
width: 1200px;
margin: 20px auto;
.grid-content{
display: flex;
justify-content: center;
background-color: #fff;
width: 100%;
padding: 10px;
margin-bottom: 10px;
flex-direction: column;
.comments{
display: flex;
justify-content: center;
align-items: center;
padding: 10px;
flex-direction: column;
.comments{
line-height: 2em;
justify-content: start;
line-height: 2em;
.goods-name{
font-size: 16px;
display: flex;
align-items: center;
}
}
.bg-purple{
border-top: 1px solid #f3f3f3;
border-right: 1px solid #f3f3f3;
.image{
width: 140px;
.goods-price{
color: #bf2b28;
font-size: 20px;
font-weight: 600;
}
}
}
.bg-purple{
border-top: 1px solid #f3f3f3;
border-right: 1px solid #f3f3f3;
image{
width: 180px;
height: 180px;
}
}
}
.pagination{
width: 1200px;
margin: 20px auto;
display: flex;
justify-content: center;
}
</style>