406 lines
12 KiB
Vue
406 lines
12 KiB
Vue
<template> <!-- 现货详情 -->
|
||
<view class="wrap">
|
||
<!-- 吸顶 -->
|
||
<u-sticky offset-top="0" customNavHeight="0">
|
||
<!-- 顶部 -->
|
||
<uiheader></uiheader>
|
||
</u-sticky>
|
||
<!-- 内容 -->
|
||
<view class="layout layout-detail" v-if="product">
|
||
<view class="company flex m-top-20" v-if="product.user">
|
||
<view class="logo">
|
||
<image class="full" v-if="product.user.businessCard && product.user.businessCard.logo"
|
||
:src="product.user.businessCard.logo" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="info flex-1 p-left-20">
|
||
<view class="name flex justify-start align-center">
|
||
<view class="name-text">
|
||
{{ product.user.accountType === 2 ? product.user.company.companyName : product.user.person.personName }}
|
||
</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="product.user.accountType === 2">
|
||
主营业务:{{
|
||
(product.user.company.mainSpotCategory && product.user.company.mainSpotCategory.length > 0) ? product.user.company.mainSpotCategory.join() : ''
|
||
}}
|
||
</view>
|
||
<view class="flex justify-between items-center">
|
||
<view class="zhu">
|
||
{{ product._add_time_str }} 发布
|
||
</view>
|
||
<view class="ml-20">
|
||
<u-button size="mini" plain type="primary" @click="$jump(`/pages/yellow/detail?id=${product.user._id}`)">
|
||
查看主页
|
||
</u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="card-title m-top-30">现货详情</view>
|
||
<view class="detail m-top-20">
|
||
<view class="detail-title">{{ product.name }}</view>
|
||
<view class="detail-text">库存 :{{ parseInt(product.stock) }}吨</view>
|
||
<view class="detail-text">供货地:{{
|
||
product.address.province.name + "-" + product.address.city.name + "-" + product.address.area.name
|
||
}}
|
||
</view>
|
||
</view>
|
||
<view class="card-body">
|
||
<view class="card-title m-top-30">报价有效期</view>
|
||
<view class="detail-text">截止: {{
|
||
dayjs(product.answerEndTime).format('YYYY-MM-DD HH:mm:ss')
|
||
}}
|
||
</view>
|
||
</view>
|
||
<view class="card-title m-top-30">产品规格单价</view>
|
||
<view class="m-top-20">
|
||
<file-type v-for="(item, index) in product.files" :key="index" :item="item"/>
|
||
</view>
|
||
<view class="card-title m-top-30">产品现场图片</view>
|
||
<view class="m-top-20">
|
||
<file-type v-for="(item, index) in product.images" :key="index" :item="item"/>
|
||
</view>
|
||
<view class="card-title m-top-30">已收到的合作申请</view>
|
||
<view class="table-box m-top-30">
|
||
<!-- <view class="thead">-->
|
||
<!-- <view class="tr">-->
|
||
<!-- <view class="th">企业</view>-->
|
||
<!-- <view class="th">申请人</view>-->
|
||
<!-- <view class="th">联系方式</view>-->
|
||
<!-- <view class="th">合作留言</view>-->
|
||
<!-- <view class="th">申请时间</view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="tbody">-->
|
||
<!-- <view class="flex" v-for="(item, index) in product.cooperateList" :key="index">-->
|
||
<!-- <view class="w-25p td-n">{{-->
|
||
<!-- item.user.accountType === 2 ? item.user.company.companyName.replace(/^(.)(.).*(.)(.)(.)(.)$/, "$1$2***$3$4$5$6") : item.user.person.personName.replace(/^(.)(.).*(.)(.)(.)(.)$/, "$1$2***$3$4$5$6")-->
|
||
<!-- }}-->
|
||
<!-- </view>-->
|
||
<!-- <view class="w-25p td-n">{{ item.name }}</view>-->
|
||
<!-- <view class="w-25p td-n">-->
|
||
<!-- <text class="u-line-2">{{ item.mobile }}</text>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="w-25p td-n u-line-2">{{ item.remark }}</view>-->
|
||
<!-- <view class="w-25p td-n">{{ item._add_time_str }}</view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<view class="flex justify-start items-start flex-col mb-25 border rounded p-20 "
|
||
style="border-style: dashed" v-for="(item, index) in product.cooperateList" :key="index">
|
||
<p class="mb-10" v-if="item.user.accountType === 2">企业: {{
|
||
item.user.accountType === 2 ? item.user.company.companyName.replace(/^(.)(.).*(.)(.)(.)(.)$/, "$1$2***$3$4$5$6") : item.user.person.personName.replace(/^(.)(.).*(.)(.)(.)(.)$/, "$1$2***$3$4$5$6")
|
||
}}</p>
|
||
<p class="mb-10">申请人: {{ item.name }}</p>
|
||
<!-- <p class="mb-10">联系方式: {{ item.mobile }}</p>-->
|
||
<p class="mb-10">联系方式: ********</p>
|
||
<p class="mb-10">合作留言: {{ item.remark }}</p>
|
||
<view class="mb-10 flex justify-start " v-if="product.isMine">
|
||
<text>附件:</text>
|
||
<file-type v-for="(file, fileIndex) in item.files" class="mx-15" :item="file" :key="fileIndex"/>
|
||
</view>
|
||
<p class="mb-10">申请时间: {{ item._add_time_str }}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 底部 -->
|
||
<view class="fiexd-bottom flex justify-between align-center bg-white">
|
||
<u-icon name="integral" color="#A92924" size="26"></u-icon>
|
||
<view class="text red flex-1 m-left-20">{{ product.cooperateList.length }}家已经申请合作</view>
|
||
<view class="apply-btn" @click="toCooperate" v-if="userInfo._id !== product.userId">申请合作</view>
|
||
</view>
|
||
<!-- 弹出窗 -->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import uiheader from '@/components/index/header'
|
||
import FileType from "@/components/file-type/file-type.vue";
|
||
import dayjs from "dayjs";
|
||
|
||
export default {
|
||
components: {
|
||
FileType,
|
||
uiheader,
|
||
},
|
||
data() {
|
||
return {
|
||
isPopup: false,
|
||
product: null,
|
||
allChildCate: [],
|
||
userInfo: null
|
||
};
|
||
},
|
||
methods: {
|
||
dayjs,
|
||
getCategoryTreeData(id) {
|
||
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(id)
|
||
}
|
||
});
|
||
},
|
||
applyLink() {
|
||
uni.$u.route('/pages/goods/apply', {
|
||
id: 0,
|
||
});
|
||
},
|
||
getInfo(_id) {
|
||
vk.callFunction({
|
||
url: 'client/spot/goods/pub/getDetail',
|
||
title: '请求中...',
|
||
data: {
|
||
_id,
|
||
},
|
||
success: (data) => {
|
||
this.product = data.data
|
||
this.product.user.company.mainSpotCategory = []
|
||
if (this.product.user.company && this.product.user.company.mainSpotCategoryIds) {
|
||
this.allChildCate.forEach(child => {
|
||
if (this.product.user.company.mainSpotCategoryIds.includes(child._id)) {
|
||
this.product.user.company.mainSpotCategory.push(child.name)
|
||
}
|
||
})
|
||
}
|
||
}
|
||
});
|
||
},
|
||
async toCooperate() {
|
||
const {userInfo, accountNum} = await vk.callFunction({
|
||
url: 'user/kh/getMyUserInfo'
|
||
})
|
||
if (!userInfo.fadadaConfirm || [-1, 2].includes(userInfo.authStatus)) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '您尚未认证, 是否前往认证?',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
uni.setStorageSync('user_tab', 0)
|
||
uni.switchTab({url: '/pages/user/user'})
|
||
}
|
||
}
|
||
})
|
||
} else if (vk.pubfn.isNull(userInfo.businessCard)) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '请完善名片信息',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
uni.setStorageSync('user_tab', 1)
|
||
uni.switchTab({url: '/pages/user/user'})
|
||
}
|
||
}
|
||
})
|
||
} else if (accountNum === 0) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '请先到个人中心添加收款账户',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
uni.setStorageSync('user_tab', 7)
|
||
uni.switchTab({url: '/pages/user/user'})
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
vk.navigateTo({url: `/pages/goods/apply?id=${this.product._id}&userId=${this.product.userId}`});
|
||
}
|
||
},
|
||
},
|
||
onLoad({id}) {
|
||
this.userInfo = vk.getStorageSync('uni_id_user_info')
|
||
this.getCategoryTreeData(id)
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
padding-bottom: 150rpx;
|
||
background: #ffffff;
|
||
}
|
||
|
||
.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-detail {
|
||
padding: 20rpx 30rpx;
|
||
}
|
||
|
||
.company {
|
||
padding-bottom: 40rpx;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
|
||
.logo {
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
}
|
||
|
||
.name-text {
|
||
//max-width: 380rpx;
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
line-height: 40rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
.name-icon {
|
||
width: 80rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.zhu {
|
||
margin-top: 10rpx;
|
||
font-size: 24rpx;
|
||
line-height: 32rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
.detail-title {
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
line-height: 40rpx;
|
||
color: #101010;
|
||
}
|
||
|
||
.detail-text {
|
||
margin-top: 10rpx;
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
.fiexd-bottom {
|
||
position: fixed;
|
||
left: 0;
|
||
bottom: 0;
|
||
z-index: 99;
|
||
width: 100%;
|
||
height: 130rpx;
|
||
padding: 0 30rpx;
|
||
box-sizing: border-box;
|
||
border-top: 1px solid #f2f2f2;
|
||
|
||
.text {
|
||
font-size: 26rpx;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.apply-btn {
|
||
width: 220rpx;
|
||
height: 70rpx;
|
||
font-size: 26rpx;
|
||
line-height: 70rpx;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
background: #A92924;
|
||
}
|
||
}
|
||
|
||
.table-box {
|
||
font-size: 24rpx;
|
||
line-height: 28rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.tr {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.th {
|
||
color: #666 !important;
|
||
background: #FFF8F2;
|
||
}
|
||
|
||
.th, .td {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 50%;
|
||
height: 76rpx;
|
||
color: #999;
|
||
overflow: hidden;
|
||
box-sizing: border-box;
|
||
border-left: 1px solid #f2f2f2;
|
||
border-right: 1px solid #f2f2f2;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
}
|
||
|
||
.td-n {
|
||
//height: 70rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-right: 1px solid #f2f2f2;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
background: #ffffff;
|
||
}
|
||
|
||
.td-3 {
|
||
width: 33.33%;
|
||
}
|
||
|
||
.popup-box {
|
||
padding: 20rpx 20rpx;
|
||
}
|
||
|
||
.popup-title {
|
||
padding: 18rpx 0;
|
||
border-bottom: 1px solid #A92924;
|
||
|
||
.title {
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #A92924;
|
||
}
|
||
|
||
.close {
|
||
width: 80rpx;
|
||
height: 40rpx;
|
||
font-size: 22rpx;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
background: #A92924;
|
||
}
|
||
}
|
||
</style>
|