792 lines
25 KiB
Vue
792 lines
25 KiB
Vue
<template> <!-- 黄页详情 -->
|
||
<view class="wrap">
|
||
<!-- 吸顶 -->
|
||
<u-sticky offset-top="0" customNavHeight="0" zIndex="9999">
|
||
<!-- 顶部 -->
|
||
<uititle :title="info.company.companyName ? info.company.companyName : ''"></uititle>
|
||
</u-sticky>
|
||
<!-- 基础信息 -->
|
||
<view class="layout layout-base">
|
||
<view class="company flex m-top-20">
|
||
<view class="logo">
|
||
<image v-if="info && info.businessCard" class="full" :src="info.businessCard.logo"
|
||
mode="aspectFit"></image>
|
||
<image v-else class="full" src="/static/no-logo.jpg" mode=""></image>
|
||
</view>
|
||
<view class="info flex-1 p-left-20">
|
||
<view class="name flex justify-start align-center">
|
||
<view class="name-text">{{ info.company.companyName }}</view>
|
||
<!-- 认证图标 -->
|
||
<!-- <view class="name-icon m-left-20">-->
|
||
<!-- <image class="full" src="/static/img/idente.png" mode=""></image>-->
|
||
<!-- </view>-->
|
||
</view>
|
||
<view class="zhu" v-if="info.company.mainSpotCategory && info.company.mainSpotCategory.length">
|
||
主营业务：{{ info.company.mainSpotCategory.join() }}
|
||
</view>
|
||
<view class="zhu" v-else>
|
||
主营业务：{{ info.company.mainSpotCategorySelf }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-between align-center m-top-20">
|
||
<u-icon name="rmb-circle" color="#A92924" size="18"></u-icon>
|
||
<view class="half-text">平台累计交易
|
||
<text class="red">{{ info.transactionAmount.toFixed(2) }}</text>
|
||
元
|
||
</view>
|
||
<view class="flex-1"></view>
|
||
<template v-if="info.paidEnsure && info.paidEnsure > 0">
|
||
<u-icon name="checkmark-circle" color="#A92924" size="18"></u-icon>
|
||
<view class="half-text">已缴纳交易保证金
|
||
<text class="red">{{ info.paidEnsure }}</text>
|
||
元
|
||
</view>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
<el-carousel height="210rpx`" :style="{width: '100%', height: '210rpx'}" class="m-a"
|
||
v-if="info.businessCard && info.businessCard.album">
|
||
<template v-if="Array.isArray(info.businessCard.album)">
|
||
<el-carousel-item v-for="(item, index) in info.businessCard.album" :key="index" :style="{width: '100%'}">
|
||
<u-image :src="item" mode="aspectFit" width="100%" height="210rpx"/>
|
||
</el-carousel-item>
|
||
</template>
|
||
<template v-else>
|
||
<el-carousel-item :style="{width: '100%'}">
|
||
<u-image :src="info.businessCard.album" mode="aspectFit" width="100%" height="210rpx"/>
|
||
</el-carousel-item>
|
||
</template>
|
||
</el-carousel>
|
||
<!-- 企业简介 -->
|
||
<view class="layout layout-company">
|
||
<view class="card-title m-top-30">企业简介</view>
|
||
<view class="company-text" v-if="info.businessCard.companyIntroduction"
|
||
v-html="info.businessCard.companyIntroduction"/>
|
||
<text v-else>商家暂未填写</text>
|
||
</view>
|
||
<view class="flex flex-col justify-start items-start mb-20 layout-company"
|
||
v-if="info.businessCard && info.businessCard.video">
|
||
<view class="card-title m-top-30">企业视频</view>
|
||
<video :src="info.businessCard.video" controls style="width: 100%" autoplay/>
|
||
</view>
|
||
<view class="flex flex-col justify-start items-start mb-20 layout-company"
|
||
v-if="info.businessCard && info.businessCard.productImageList">
|
||
<view class="card-title m-top-30">产品展示</view>
|
||
<view class="flex justify-start items-start flex-wrap">
|
||
<el-image :src="item" v-for="(item, index) in info.businessCard.productImageList"
|
||
:key="index" fit="cover" :preview-src-list="info.businessCard.productImageList"
|
||
style="width: 5rem; height: 5rem; margin: 0 1rem 1rem 0"/>
|
||
</view>
|
||
</view>
|
||
<view class="flex flex-col justify-start items-start mb-20 layout-company "
|
||
v-if="info.businessCard && info.businessCard.exampleImageList">
|
||
<view class="card-title m-top-30">案例展示</view>
|
||
<view class="flex justify-start items-start flex-wrap">
|
||
<el-image :src="item" v-for="(item, index) in info.businessCard.exampleImageList"
|
||
:key="index" fit="cover"
|
||
:preview-src-list="info.businessCard.exampleImageList"
|
||
style="width: 5rem; height: 5rem; margin: 0 1rem 1rem 0"/>
|
||
</view>
|
||
</view>
|
||
<view class="flex flex-col justify-start items-start mb-20 layout-company"
|
||
v-if="canShowMapLocation">
|
||
<view class="card-title m-top-30">地图定位</view>
|
||
<view class="mapDiv">
|
||
<tdt-map :center="[info.businessCard.longitude, info.businessCard.latitude]" :zoom="12">
|
||
<tdt-marker :position="[info.businessCard.longitude, info.businessCard.latitude]"
|
||
:draggable="false"/>
|
||
</tdt-map>
|
||
</view>
|
||
</view>
|
||
<view class="flex flex-col justify-start items-start mb-20 layout-company"
|
||
v-if="userArticle.length > 0">
|
||
<view class="card-title m-top-30">新闻动态</view>
|
||
<view class="flex justify-start items-start flex-col w-100p">
|
||
<view class="flex flex-col items-start pointer w-100p mb-25"
|
||
@click="showArticle(index)"
|
||
v-for="(item, index) in userArticle" :key="index">
|
||
<text>{{ item.title }}</text>
|
||
<text class="text-gray">{{ item._add_time_str }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="layout layout-card">
|
||
<!-- <view class="card-title m-top-10">我的名片</view> -->
|
||
<view class="card-body">
|
||
<!-- 联系信息 -->
|
||
<view class="card-title m-top-30">联系我们</view>
|
||
<view class="detail m-top-10">
|
||
<view class="p clear">
|
||
<view class="lb fl flex justify-start align-center">
|
||
<u-icon name="map" size="18"></u-icon>
|
||
<view class="text">地址：</view>
|
||
</view>
|
||
<view class="vl">
|
||
{{ info.manager.address }}
|
||
</view>
|
||
</view>
|
||
<view class="p clear">
|
||
<view class="lb fl flex justify-start align-center">
|
||
<u-icon name="phone" size="18"></u-icon>
|
||
<view class="text">电话：</view>
|
||
</view>
|
||
<view class="vl">{{
|
||
info.businessCard.companyMobile ? info.businessCard.companyMobile : '商家暂未填写'
|
||
}}
|
||
</view>
|
||
</view>
|
||
<view class="p clear">
|
||
<view class="lb fl flex justify-start align-center">
|
||
<u-icon name="email" size="18"></u-icon>
|
||
<view class="text">邮箱：</view>
|
||
</view>
|
||
<view class="vl">{{ info.businessCard.email ? info.businessCard.email : '商家暂未填写' }}</view>
|
||
</view>
|
||
<view class="p clear">
|
||
<view class="lb fl flex justify-start align-center">
|
||
<u-icon name="kefu-ermai" size="18"></u-icon>
|
||
<view class="text">手机：</view>
|
||
</view>
|
||
<view class="vl">{{ info.manager.mobile ? info.manager.mobile : '商家暂未填写' }}</view>
|
||
</view>
|
||
<view class="p clear" v-if="info.userLevel > 1">
|
||
<view class="lb fl flex justify-start align-center">
|
||
<u-icon name="ie" size="18"></u-icon>
|
||
<view class="text">网址：</view>
|
||
</view>
|
||
<view class="vl">
|
||
<u--text mode="link" :text="info.businessCard.website"
|
||
:href="info.businessCard.website"></u--text>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="p clear">-->
|
||
<!-- <view class="lb fl flex justify-start align-center">-->
|
||
<!-- <u-icon name="account" size="18"></u-icon>-->
|
||
<!-- <view class="text">总经理：</view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="vl">王星星</view>-->
|
||
<!-- </view>-->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 发布的现货 -->
|
||
<template v-if="parseInt(info.userLevel) > 0">
|
||
<view class="layout-goods" v-if="info.spotList">
|
||
<view class="card-title m-top-20 flex justify-between">
|
||
<view class="text">发布的现货</view>
|
||
<!-- <view class="more">查看更多</view>-->
|
||
</view>
|
||
<view class="goods-box m-top-20">
|
||
<view class="item bg-white">
|
||
<view class="title text-single">{{ info.spotList.name }}</view>
|
||
<view class="text m-top-10">
|
||
<text class="red">库存:{{ info.spotList.stock }}吨</text>
|
||
<text
|
||
v-if="info.spotList.address && info.spotList.address.province && info.spotList.address.area && info.spotList.address.area ">
|
||
供货地:{{ info.spotList.address.province.name }}-{{
|
||
info.spotList.address.city.name
|
||
}}-{{ info.spotList.address.area.name }}
|
||
</text>
|
||
</view>
|
||
<view class="flex flex-col justify-start m-top-10">
|
||
<view class="company flex justify-center align-center flex-nowrap">
|
||
<view class="text flex-1">{{ info.company.companyName }}</view>
|
||
</view>
|
||
<view class="date">{{ info.spotList._add_time_str }}发布</view>
|
||
</view>
|
||
<view class="askfor" @click.native="$jump('/pages/goods/detail?id=' + info.spotList._id)">
|
||
+申请合作
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 发布的询价单 -->
|
||
<view class="layout layout-table">
|
||
<view class="card-title m-top-20 flex justify-between">
|
||
<view class="text">发布的询价单</view>
|
||
<view class="more" @click.native="$jump('/pages/price/price?');">查看更多</view>
|
||
</view>
|
||
<view class="table-box m-top-20">
|
||
<view class="thead">
|
||
<view class="tr">
|
||
<view class="th" style="width: 60%;">品名、材质</view>
|
||
<view class="th" style="width: 20%;">采购量</view>
|
||
<view class="th" style="width: 20%;">操作</view>
|
||
</view>
|
||
</view>
|
||
<view class="tbody" v-for="(item, index) in info.enquiryList" :key="index">
|
||
<view class="tr">
|
||
<view class="td" style="width: 60%;">{{ item.productList[0].goodsName }}</view>
|
||
<view class="td" style="width: 20%;">{{ item.productList[0].procureNumber }}{{
|
||
item.productList[0].procureUnit
|
||
}}
|
||
</view>
|
||
<view class="td" style="width: 20%;">
|
||
<u-button
|
||
@click.native="$jump('/pages/price/detail?id=' + item._id);"
|
||
class="minibtn"
|
||
size="mini"
|
||
type="error"
|
||
plain
|
||
text="查看详情"
|
||
></u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 发布的加工单 -->
|
||
<view class="layout layout-table">
|
||
<view class="card-title m-top-20 flex justify-between">
|
||
<view class="text">发布的加工单</view>
|
||
<view class="more" @click="$jump('/pages/work/work')">查看更多</view>
|
||
</view>
|
||
<view class="table-box m-top-20">
|
||
<view class="thead">
|
||
<view class="tr">
|
||
<view class="th" style="width: 60%;">品名、材质</view>
|
||
<view class="th" style="width: 20%;">加工量</view>
|
||
<view class="th" style="width: 20%;">操作</view>
|
||
</view>
|
||
</view>
|
||
<view class="tbody">
|
||
<view class="tr" v-for="(item, index) in info.processList" :key="index">
|
||
<view class="td" style="width: 60%;">{{ item.title }}</view>
|
||
<view class="td" style="width: 20%;">{{ item.num }}</view>
|
||
<view class="td" style="width: 20%;">
|
||
<u-button
|
||
@click.native="$jump(`/pages/work/detail?id=${item._id}`)"
|
||
class="minibtn"
|
||
size="mini"
|
||
type="error"
|
||
plain
|
||
text="查看详情"
|
||
></u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 发布的旧货信息 -->
|
||
<!-- <view class="layout layout-junk">-->
|
||
<!-- <view class="card-title m-top-20 flex justify-between">-->
|
||
<!-- <view class="text">发布的旧货信息</view>-->
|
||
<!-- <view class="more">查看更多</view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="junk-box">-->
|
||
<!-- <view class="item flex">-->
|
||
<!-- <view class="img">-->
|
||
<!-- <image class="full" src="/static/img/abc-1.png" mode=""></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="info flex-1 p-left-30">-->
|
||
<!-- <view class="title text-single">直缝钢管20吨</view>-->
|
||
<!-- <view class="flex justify-between flex-wrap">-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">所属分类</text>-->
|
||
<!-- 成品钢材-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">发布时间</text>-->
|
||
<!-- 2022.12.23-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">所在区域</text>-->
|
||
<!-- 广西-南宁-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">有效期至</text>-->
|
||
<!-- 2022.12.23-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="item flex">-->
|
||
<!-- <view class="img">-->
|
||
<!-- <image class="full" src="/static/img/abc-1.png" mode=""></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="info flex-1 p-left-30">-->
|
||
<!-- <view class="title text-single">直缝钢管20吨</view>-->
|
||
<!-- <view class="flex justify-between flex-wrap">-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">所属分类</text>-->
|
||
<!-- 成品钢材-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">发布时间</text>-->
|
||
<!-- 2022.12.23-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">所在区域</text>-->
|
||
<!-- 广西-南宁-->
|
||
<!-- </view>-->
|
||
<!-- <view class="p half">-->
|
||
<!-- <text class="lb">有效期至</text>-->
|
||
<!-- 2022.12.23-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<el-dialog v-if="articleIndex > -1 && dialogVisible"
|
||
title="新闻动态"
|
||
:visible.sync="dialogVisible"
|
||
width="100%">
|
||
<p class="text-35 font-bold pb-20">{{ userArticle[articleIndex].title }}</p>
|
||
<p class="text-gray text-28 pb-20 border-bottom">{{ userArticle[articleIndex]._add_time_str }}</p>
|
||
<div v-html="userArticle[articleIndex].content" class="pt-20"></div>
|
||
<div slot="footer">
|
||
<u-button @click="dialogVisible = false">关 闭</u-button>
|
||
</div>
|
||
</el-dialog>
|
||
</template>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import uititle from '@/components/common/title'
|
||
import cmsearch from '@/components/common/search'
|
||
import cmempty from '@/components/common/empty'
|
||
import usnotice from '@/components/user/notice'
|
||
import usaccount from '@/components/user/account'
|
||
import uscard from '@/components/user/card'
|
||
|
||
export default {
|
||
components: {
|
||
uititle,
|
||
cmsearch,
|
||
cmempty,
|
||
usnotice,
|
||
usaccount,
|
||
uscard,
|
||
},
|
||
data() {
|
||
return {
|
||
id: null,
|
||
info: {
|
||
transactionAmount: 0,
|
||
paidEnsure: 0,
|
||
spotList: [],
|
||
enquiryList: [],
|
||
processList: [],
|
||
company: {
|
||
companyName: ''
|
||
}
|
||
},
|
||
allChildCate: [],
|
||
userArticle: [],
|
||
articleIndex: -1,
|
||
dialogVisible: false
|
||
};
|
||
},
|
||
computed: {
|
||
canShowMapLocation() {
|
||
return this.info.businessCard
|
||
&& this.info.businessCard.longitude
|
||
&& parseInt(this.info.accountType) === 2
|
||
&& parseInt(this.info.userLevel) > 1
|
||
}
|
||
},
|
||
methods: {
|
||
getCategoryTreeData() {
|
||
vk.callFunction({
|
||
url: 'client/spot/category/pub/getTree',
|
||
title: '请求中...',
|
||
data: {},
|
||
success: (data) => {
|
||
this.allChildCate = []
|
||
data.rows.forEach(item => {
|
||
item.children.forEach(child => {
|
||
this.allChildCate.push(child)
|
||
})
|
||
})
|
||
this.getInfo()
|
||
}
|
||
});
|
||
},
|
||
getInfo() {
|
||
vk.callFunction({
|
||
url: "client/user/pub/getDetail",
|
||
data: {
|
||
_id: this.id
|
||
},
|
||
success: (res) => {
|
||
this.info = res.data
|
||
this.info.company.mainSpotCategory = []
|
||
if (this.info.company && this.info.company.mainSpotCategoryIds) {
|
||
this.allChildCate.forEach(child => {
|
||
if (this.info.company.mainSpotCategoryIds.includes(child._id)) {
|
||
this.info.company.mainSpotCategory.push(child.name)
|
||
}
|
||
})
|
||
}
|
||
this.info.enquiryList.map(val => {
|
||
let str = ''
|
||
if (val.addressRegion && val.addressRegion.area) {
|
||
str = val.addressRegion.province.name + val.addressRegion.city.name + val.addressRegion.area.name
|
||
}
|
||
if (val.addressDetail) str += val.addressDetail
|
||
val.address = str
|
||
return val
|
||
})
|
||
this.$nextTick(() => {
|
||
// 获取所有的img元素
|
||
var imgElements = document.getElementsByTagName('img');
|
||
|
||
// 遍历img元素数组
|
||
for (var i = 0; i < imgElements.length; i++) {
|
||
// 添加style属性，并设置width为100%
|
||
imgElements[i].style.width = '100%';
|
||
}
|
||
})
|
||
}
|
||
});
|
||
},
|
||
getUserArticle() {
|
||
vk.callFunction({
|
||
url: 'client/userArticle/pub/getList',
|
||
title: '请求中...',
|
||
data: {
|
||
userId: this.id
|
||
},
|
||
success: (data) => {
|
||
this.userArticle = data.rows
|
||
console.log(this.userArticle)
|
||
}
|
||
});
|
||
},
|
||
showArticle(index) {
|
||
this.articleIndex = index
|
||
this.dialogVisible = true
|
||
this.$nextTick(() => {
|
||
// 获取所有的img元素
|
||
var imgElements = document.getElementsByTagName('img');
|
||
|
||
// 遍历img元素数组
|
||
for (var i = 0; i < imgElements.length; i++) {
|
||
// 添加style属性，并设置width为100%
|
||
imgElements[i].style.width = '100%';
|
||
}
|
||
})
|
||
}
|
||
},
|
||
onLoad({id}) {
|
||
this.id = id
|
||
this.getCategoryTreeData()
|
||
this.getUserArticle()
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
img {
|
||
width: 100% !important;
|
||
}
|
||
|
||
page {
|
||
background: #ffffff;
|
||
}
|
||
|
||
.minibtn {
|
||
width: 60rpx;
|
||
font-size: 20rpx;
|
||
color: #A92924 !important;
|
||
border-color: #A92924;
|
||
}
|
||
|
||
.card-title {
|
||
position: relative;
|
||
padding-left: 20rpx;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
line-height: 48rpx;
|
||
color: #A92924;
|
||
|
||
&:before {
|
||
position: absolute;
|
||
left: 0;
|
||
top: 50%;
|
||
z-index: 9;
|
||
margin-top: -14rpx;
|
||
content: '';
|
||
width: 6rpx;
|
||
height: 28rpx;
|
||
background: #A92924;
|
||
}
|
||
|
||
.more {
|
||
font-size: 24rpx;
|
||
font-weight: normal;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
.layout-base {
|
||
padding: 10rpx 30rpx;
|
||
|
||
.logo {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
|
||
.info {
|
||
.name-text {
|
||
//max-width: 380rpx;
|
||
font-size: 30rpx;
|
||
line-height: 40rpx;
|
||
color: #666666;
|
||
}
|
||
|
||
.name-icon {
|
||
width: 80rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.zhu {
|
||
margin-top: 8rpx;
|
||
font-size: 24rpx;
|
||
line-height: 32rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
.half-text {
|
||
margin-left: 6rpx;
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.layout-company {
|
||
padding: 10rpx 30rpx;
|
||
|
||
.company-text {
|
||
padding: 20rpx 0;
|
||
font-size: 28rpx;
|
||
line-height: 44rpx;
|
||
color: #A7A7A7;
|
||
}
|
||
|
||
.company-img {
|
||
image {
|
||
width: 100%;
|
||
height: auto;
|
||
}
|
||
}
|
||
}
|
||
|
||
.layout-card {
|
||
padding: 10rpx 30rpx;
|
||
|
||
.card-tip {
|
||
font-size: 26rpx;
|
||
line-height: 48rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
.detail {
|
||
padding: 10rpx 0;
|
||
|
||
.p {
|
||
position: relative;
|
||
padding: 14rpx 0;
|
||
|
||
.lb {
|
||
position: absolute;
|
||
left: 0;
|
||
top: 10rpx;
|
||
z-index: 9;
|
||
width: 180rpx;
|
||
height: auto;
|
||
|
||
.text {
|
||
padding-left: 6rpx;
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
|
||
.vl {
|
||
padding-left: 150rpx;
|
||
min-height: 40rpx;
|
||
font-size: 28rpx;
|
||
line-height: 40rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.layout-junk {
|
||
padding: 30rpx 30rpx;
|
||
|
||
.item {
|
||
margin-top: 30rpx;
|
||
padding: 30rpx 30rpx;
|
||
background: #f8f8f8;
|
||
|
||
.img {
|
||
width: 160rpx;
|
||
height: 130rpx;
|
||
}
|
||
|
||
.title {
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
line-height: 40rpx;
|
||
color: #4b4b4b;
|
||
}
|
||
|
||
.p {
|
||
padding: 5rpx 0;
|
||
height: 40rpx;
|
||
overflow: hidden;
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #4b4b4b;
|
||
}
|
||
|
||
.lb {
|
||
padding-right: 6rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.layout-table {
|
||
padding: 20rpx 30rpx;
|
||
}
|
||
|
||
.tr {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.table-box {
|
||
font-size: 24rpx;
|
||
line-height: 28rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.thead {
|
||
background: #f8f8f8;
|
||
}
|
||
|
||
.th, .td {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 20%;
|
||
height: 76rpx;
|
||
color: #000;
|
||
overflow: hidden;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.td {
|
||
border-right: 1px solid #f2f2f2;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
background: #ffffff;
|
||
// &:first-child {
|
||
// color: #f56c6c;
|
||
// }
|
||
&:last-child {
|
||
border-right: none;
|
||
}
|
||
}
|
||
|
||
.layout-goods {
|
||
width: 690rpx;
|
||
padding: 10rpx 30rpx;
|
||
|
||
.item {
|
||
position: relative;
|
||
margin-top: 30rpx;
|
||
padding: 10rpx 20rpx 20rpx;
|
||
background: #f8f8f8;
|
||
border-radius: 12rpx;
|
||
|
||
.title {
|
||
width: 90%;
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
line-height: 48rpx;
|
||
color: #101010;
|
||
}
|
||
|
||
.link {
|
||
position: absolute;
|
||
right: 20rpx;
|
||
top: 16rpx;
|
||
z-index: 9;
|
||
font-size: 24rpx;
|
||
line-height: 36rpx;
|
||
color: #A92924;
|
||
padding: 4rpx 8rpx;
|
||
}
|
||
|
||
.link {
|
||
border: 1px solid #A92924;
|
||
}
|
||
|
||
.askfor {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
margin-top: 20rpx;
|
||
font-size: 24rpx;
|
||
line-height: 36rpx;
|
||
color: #A92924;
|
||
padding: 4rpx 8rpx;
|
||
}
|
||
|
||
.text {
|
||
font-size: 28rpx;
|
||
line-height: 36rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
.red {
|
||
margin-right: 20rpx;
|
||
color: #A92924;
|
||
}
|
||
|
||
.date {
|
||
font-size: 26rpx;
|
||
line-height: 36rpx;
|
||
color: #9a9a9a;
|
||
}
|
||
|
||
.company {
|
||
height: 40rpx;
|
||
|
||
.icon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
|
||
.text {
|
||
//width: 300rpx;
|
||
height: 40rpx;
|
||
font-size: 32rpx;
|
||
line-height: 40rpx;
|
||
color: #4f4f4f;
|
||
}
|
||
}
|
||
}
|
||
|
||
.item:nth-child(1) {
|
||
margin-top: 0 !important;
|
||
}
|
||
}
|
||
|
||
|
||
.mapDiv {
|
||
width: 100%;
|
||
height: 300px;
|
||
}
|
||
</style>
|