507 lines
16 KiB
Vue
507 lines
16 KiB
Vue
<template> <!-- 旧货详情 -->
|
||
<view class="wrap">
|
||
<!-- 吸顶 -->
|
||
<u-sticky offset-top="0" customNavHeight="0">
|
||
<!-- 顶部 -->
|
||
<uiheader></uiheader>
|
||
<!-- 搜索栏 -->
|
||
<cmsearch></cmsearch>
|
||
</u-sticky>
|
||
<!-- 四个入口 -->
|
||
<view class="bg-white">
|
||
<cmfourth :type="type"/>
|
||
</view>
|
||
<!-- 选择器 -->
|
||
<view class="layout-pick flex justify-between align-center bg-white">
|
||
<view class="flex justify-start">
|
||
<view class="ip down" @click="isPick = true">分类：{{ pickValue }}</view>
|
||
<view class="ip down ml-35" @click="showRentType = true" v-if="type === 2">{{ rentTypeStr }}</view>
|
||
</view>
|
||
<view class="ip down" @click="showAddress">省份：{{ locationValue }}</view>
|
||
</view>
|
||
<view class="layout layout-detail">
|
||
<template v-if="type === 0">
|
||
<uiswiper :ad="15" padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="16" padding="10rpx 0"></uiswiper>
|
||
</template>
|
||
<template v-if="type === 1">
|
||
<uiswiper :ad="17" padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="18" padding="10rpx 0"></uiswiper>
|
||
</template>
|
||
<template v-if="type === 2">
|
||
<uiswiper :ad="19" padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="20" padding="10rpx 0"></uiswiper>
|
||
</template>
|
||
<template v-if="type === 3">
|
||
<uiswiper :ad="21" padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="22" padding="10rpx 0"></uiswiper>
|
||
</template>
|
||
<view class="item flex flex-col " v-for="(item, index) in goodsData.rows" :key="index">
|
||
<!-- <view class="img">-->
|
||
<!-- <image class="full" src="/static/img/abc-1.png" mode=""></image>-->
|
||
<!-- </view>-->
|
||
<view class="info flex-1 p-left-30" @click="$jump(`/pages/junk/detail?id=${item._id}`)">
|
||
<view class="title text-single">
|
||
<text>{{ item.title }}</text>
|
||
<text class="text-main" v-if="item.isUrgent">[加急]</text>
|
||
</view>
|
||
<view class="flex justify-start items-start flex-col">
|
||
<view class="p half">
|
||
<text class="lb">企业</text>
|
||
<text v-if="![0, 2, 3].includes(item.type) ">
|
||
{{ item.buyer.companyName ? item.buyer.companyName : '无' }}
|
||
</text>
|
||
<text v-else>{{ item.supplier.companyName ? item.supplier.companyName : '无' }}</text>
|
||
</view>
|
||
<view class="p half">
|
||
<text class="lb">所属分类</text>
|
||
{{ item.category[1] }}
|
||
</view>
|
||
<view class="p">
|
||
<text class="lb">所在区域</text>
|
||
{{ item.addressStr }}
|
||
</view>
|
||
<view class="flex justify-between items-center">
|
||
<view class="p half">
|
||
<text class="lb">发布时间</text>
|
||
{{ item._add_time_str }}
|
||
</view>
|
||
<view class="p half">
|
||
<text class="lb">有效期至</text>
|
||
{{ item.expiredTime }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="buttons">
|
||
<button class="btn" plain @click="doShowContract(index)">查看电话
|
||
</button>
|
||
<button class="btn green" plain @click="doShowWechat(index)">添加微信
|
||
</button>
|
||
<button class="btn" plain @click="$jump(`/pages/junk/detail?id=${item._id}`)"
|
||
v-if="item.type !== 2">
|
||
{{ item.uid === userInfo._id ? '查看报价' : '我要报价' }}
|
||
</button>
|
||
<button class="btn" plain @click="$jump(`/pages/junk/detail?id=${item._id}`)"
|
||
v-else-if="item.type === 2 && item.rentType === 0">
|
||
{{ item.uid === userInfo._id ? '查看报价' : '我要报价' }}
|
||
</button>
|
||
<view class="wechat"
|
||
v-if="item.user && parseInt(item.user.accountType) === 2 && item.user.businessCard && item.user.businessCard.companyWechat && item.showWechat">
|
||
<el-image :src="item.user.businessCard.companyWechat" style="width: 100%; height: 100%"/>
|
||
</view>
|
||
<view class="wechat"
|
||
v-if="item.user && parseInt(item.user.accountType) === 1 && item.user.businessCard && item.user.businessCard.personalWechat && item.showWechat">
|
||
<el-image :src="item.user.businessCard.personalWechat" style="width: 100%; height: 100%"/>
|
||
</view>
|
||
<view class="mobile" v-if="item.user && item.showContract && item.user.businessCard">
|
||
<i class="el-icon-phone"></i>
|
||
<text class="ml-20" v-if="item.buyer && item.buyer.managerContract">{{ item.buyer.managerContract }}</text>
|
||
<text class="ml-20" v-else-if="item.supplier && item.supplier.managerContract">
|
||
{{ item.supplier.managerContract }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-empty mode="list" text="暂无更多内容~" v-if="goodsData.rows.length === 0"></u-empty>
|
||
<!-- 悬浮按钮 -->
|
||
<view class="issue" @click="toRelease">
|
||
<u-icon name="plus" color="#fff" size="24"></u-icon>
|
||
</view>
|
||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||
<u-picker v-if="isPick" :show="isPick" :columns="[categoryTreeData, categoryTreeData[cateIndex[0]].children]"
|
||
key-name="name" @confirm="handConfirmPick" @change="handleChangeCate" @cancel="isPick = false">
|
||
<template #more>
|
||
<text @click="resetCate">重置</text>
|
||
<text @click="otherCate" class="ml-20">其他</text>
|
||
</template>
|
||
</u-picker>
|
||
<u-picker v-if="showRentType" :show="showRentType"
|
||
:columns="[[{name: '承租信息', value: 0}, {name: '出租信息', value: 1}], ]"
|
||
key-name="name" @confirm="handConfirmRentType" @cancel="showRentType = false">
|
||
</u-picker>
|
||
<collapse></collapse>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import uiheader from '@/components/index/header'
|
||
import cmsearch from '@/components/common/search'
|
||
import cmempty from '@/components/common/empty'
|
||
import cmfourth from '@/components/common/fourth'
|
||
import dayjs from 'dayjs'
|
||
import Collapse from "@/components/index/collapse.vue";
|
||
import AddressSelect from "@/components/AddressSelect.vue";
|
||
import uiswiper from "@/components/index/swiper.vue";
|
||
|
||
export default {
|
||
components: {
|
||
uiswiper,
|
||
AddressSelect, Collapse,
|
||
uiheader,
|
||
cmsearch,
|
||
cmempty,
|
||
cmfourth,
|
||
},
|
||
data() {
|
||
return {
|
||
type: 1,
|
||
pageSize: 500,
|
||
keyword: '',
|
||
checkProvinceList: [],
|
||
checkCategoryList: [],
|
||
goodsData: {
|
||
total: 0,
|
||
rows: []
|
||
},
|
||
oldType: [
|
||
'拍卖信息',
|
||
'采购信息',
|
||
'承租信息',
|
||
'物资回收信息',
|
||
],
|
||
categoryTreeData: [],
|
||
allChildCate: [],
|
||
locationValue: '全国',
|
||
pickValue: '全部',
|
||
isPick: false,
|
||
cateId: null,
|
||
cateIndex: [0, 0],
|
||
region: {
|
||
province: {
|
||
code: null,
|
||
name: null,
|
||
}
|
||
},
|
||
userInfo: null,
|
||
rentType: 0,
|
||
rentTypeStr: '承租信息',
|
||
showRentType: false
|
||
};
|
||
},
|
||
methods: {
|
||
handleChangeCate({indexs}) {
|
||
this.cateIndex = indexs
|
||
},
|
||
handConfirmPick({value}) {
|
||
this.pickValue = value[1].name
|
||
this.cateId = value[1]._id
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
handConfirmRentType({value}) {
|
||
this.rentType = value[0].value
|
||
this.rentTypeStr = value[0].name
|
||
this.showRentType = false
|
||
this.search(1)
|
||
},
|
||
resetCate() {
|
||
this.cateIndex = [0, 0]
|
||
this.pickValue = '全部'
|
||
this.cateId = null
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
otherCate() {
|
||
this.cateIndex = [0]
|
||
this.pickValue = '其他'
|
||
this.cateId = 0
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
|
||
showAddress() {
|
||
this.$refs.AddressSelect.open(this.region, 1, true);
|
||
},
|
||
regionConfirm({province}) {
|
||
this.region = {province}
|
||
this.locationValue = `${province.name}`
|
||
this.search(1)
|
||
},
|
||
async toRelease() {
|
||
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 {
|
||
if (userInfo.businessCard.status !== 1) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '您的名片信息未审核,请耐心等待',
|
||
})
|
||
return
|
||
}
|
||
vk.navigateTo({
|
||
url: '/pages/junk/publish'
|
||
})
|
||
}
|
||
},
|
||
async toMy() {
|
||
const {
|
||
userInfo
|
||
} = 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 {
|
||
vk.navigateTo({
|
||
url: '/pages/junk/my'
|
||
})
|
||
}
|
||
},
|
||
search(pageIndex) {
|
||
// const categoryIds = []
|
||
// this.allChildCate.map(item => {
|
||
// if (this.checkCategoryList.indexOf(item._id) > -1) categoryIds.push(item.name)
|
||
// })
|
||
vk.callFunction({
|
||
url: 'client/old/pub/getList',
|
||
title: '加载中...',
|
||
data: {
|
||
pageIndex,
|
||
pageSize: this.pageSize,
|
||
keyword: this.keyword,
|
||
type: this.type,
|
||
categoryIds: this.cateId !== null ? [this.cateId] : null,
|
||
provinceCodes: this.region.province.code ? [this.region.province.code] : null,
|
||
rentType: this.rentType
|
||
},
|
||
success: (data) => {
|
||
data.rows.map(item => {
|
||
if (item.type === 1) item.addressStr = (item.deliverAddressRegion && item.deliverAddressRegion.city) ? (item.deliverAddressRegion.province.name + "-" + item.deliverAddressRegion.city.name) : ''
|
||
else {
|
||
if (item.type === 2) {
|
||
if (item.addressRegion && item.addressRegion.city) {
|
||
item.addressStr = (item.addressRegion && item.addressRegion.city) ? (item.addressRegion.province.name + "-" + item.addressRegion.city.name) : ''
|
||
} else {
|
||
if (item.deliverAddressRegion && item.deliverAddressRegion.city) {
|
||
item.addressStr = (item.deliverAddressRegion && item.deliverAddressRegion.city) ? (item.deliverAddressRegion.province.name + "-" + item.deliverAddressRegion.city.name) : ''
|
||
}
|
||
}
|
||
}else {
|
||
item.addressStr = (item.addressRegion && item.addressRegion.city) ? (item.addressRegion.province.name + "-" + item.addressRegion.city.name) : (item.deliverAddressRegion.province.name + "-" + item.deliverAddressRegion.city.name)
|
||
}
|
||
}
|
||
item.expiredTime = item.expiredTime ? dayjs(item.expiredTime).format('YYYY-MM-DD') : ''
|
||
item.showWechat = false
|
||
item.showContract = false
|
||
return item
|
||
})
|
||
this.goodsData = data
|
||
}
|
||
});
|
||
},
|
||
doShowWechat(index) {
|
||
if (parseInt(this.goodsData.rows[index].user.accountType) === 2 && !this.goodsData.rows[index].user.businessCard.companyWechat)
|
||
return vk.toast('用户暂未上传')
|
||
else if (parseInt(this.goodsData.rows[index].user.accountType) === 1 && !this.goodsData.rows[index].user.businessCard.personalWechat)
|
||
return vk.toast('用户暂未上传')
|
||
this.goodsData.rows[index].showContract = false
|
||
this.goodsData.rows[index].showWechat = !this.goodsData.rows[index].showWechat
|
||
},
|
||
doShowContract(index) {
|
||
this.goodsData.rows[index].showWechat = false
|
||
this.goodsData.rows[index].showContract = !this.goodsData.rows[index].showContract
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
this.userInfo = vk.getStorageSync('uni_id_user_info')
|
||
if (option.type) {
|
||
this.type = parseInt(option.type)
|
||
this.search(1)
|
||
vk.callFunction({
|
||
url: 'client/old/pub/getTree',
|
||
title: '请求中...',
|
||
data: {type: parseInt(this.type)},
|
||
success: (data) => {
|
||
this.categoryTreeData = data.rows
|
||
this.allChildCate = []
|
||
this.categoryTreeData.forEach(item => {
|
||
item.children.forEach(child => {
|
||
this.allChildCate.push(child)
|
||
})
|
||
})
|
||
}
|
||
});
|
||
} else uni.navigateBack()
|
||
},
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.layout-pick {
|
||
width: 690rpx;
|
||
height: 68rpx;
|
||
padding: 0 30rpx;
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #4F4F4F;
|
||
|
||
.ip {
|
||
position: relative;
|
||
//max-width: 33.333%;
|
||
height: 40rpx;
|
||
padding-right: 30rpx;
|
||
overflow: hidden;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.down::after {
|
||
position: absolute;
|
||
right: 10rpx;
|
||
top: 50%;
|
||
z-index: 9;
|
||
content: '';
|
||
margin-top: -6rpx;
|
||
width: 0;
|
||
height: 0;
|
||
border-left: 10rpx solid transparent;
|
||
border-right: 10rpx solid transparent;
|
||
border-top: 12rpx solid #999999;
|
||
}
|
||
}
|
||
|
||
.layout-detail {
|
||
padding: 30rpx 30rpx;
|
||
|
||
.item {
|
||
margin-top: 30rpx;
|
||
padding: 30rpx 30rpx;
|
||
background: #ffffff;
|
||
|
||
&:nth-child(1) {
|
||
margin-top: 0;
|
||
}
|
||
|
||
.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;
|
||
}
|
||
}
|
||
}
|
||
|
||
.buttons {
|
||
margin-top: 20rpx;
|
||
padding: 0 20rpx;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
position: relative;
|
||
|
||
.btn {
|
||
height: 60rpx;
|
||
font-size: 25rpx;
|
||
width: 220rpx;
|
||
margin: 0 10rpx;
|
||
}
|
||
|
||
.green {
|
||
background-color: #7ec050 !important;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.wechat {
|
||
position: absolute;
|
||
left: 240rpx;
|
||
top: -200rpx;
|
||
width: 150rpx;
|
||
height: 150rpx;
|
||
background-color: white;
|
||
border-radius: 10rpx;
|
||
padding: 5rpx;
|
||
box-shadow: 0 1px 10px 0 #eee
|
||
}
|
||
|
||
.mobile {
|
||
position: absolute;
|
||
left: -12rpx;
|
||
top: -60rpx;
|
||
background-color: white;
|
||
border-radius: 10rpx;
|
||
padding: 5rpx;
|
||
box-shadow: 0 1px 10rpx 0 #aaa;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
</style>
|