477 lines
14 KiB
Vue
477 lines
14 KiB
Vue
<template> <!-- 找加工 -->
|
||
<view class="wrap">
|
||
<!-- 吸顶 -->
|
||
<u-sticky offset-top="0" customNavHeight="0">
|
||
<!-- 顶部 -->
|
||
<uiheader title="找供应"></uiheader>
|
||
<!-- 搜索栏 -->
|
||
<cmsearch :k="keyword" @search="afterSearch"></cmsearch>
|
||
<!-- 轮播图-传值:list="数组" -->
|
||
<cmswiper page="enquiry" height="320rpx"></cmswiper>
|
||
<!-- 选择器 -->
|
||
<view class="bg-white p-20 flex justify-center items-center">
|
||
<view class="flex-1 mx-20">
|
||
<u-button type="primary" shape="circle" size="mini" @click="toRelease">发布询价单</u-button>
|
||
</view>
|
||
<view class="flex-1 mx-20">
|
||
<u-button type="primary" shape="circle" size="mini" plain @click="toMyEnquiry">我发布的询价单</u-button>
|
||
</view>
|
||
<view class="flex-1 mx-20">
|
||
<u-button type="primary" shape="circle" size="mini" plain @click="toMyQuote">我的报价</u-button>
|
||
</view>
|
||
</view>
|
||
<view class="layout-pick flex flex-col justify-start items-start bg-white">
|
||
<view class="flex justify-start items-center">
|
||
<view class="ip down" @click="isPick = true">产品分类筛选：{{ pickValue }}</view>
|
||
</view>
|
||
<view class="flex justify-between items-center w-100p mt-15">
|
||
<view class="ip down" style="" @click="isPickStatus = true">询价状态：{{ status }}</view>
|
||
<view class="ip down" style="" @click="showAddress">城市：{{ locationValue }}</view>
|
||
</view>
|
||
</view>
|
||
</u-sticky>
|
||
<!-- 数据列表 -->
|
||
<view class="layout layout-work">
|
||
<uiswiper :ad="11" :category-name="cateId ? (pickValue === '其他' ? '' : pickValue) : ''"
|
||
:category-names="cateId && pickValue !== '其他' ? [pickValue] : []" :region="region"
|
||
padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="112" :category-name="cateId ? (pickValue === '其他' ? '' : pickValue) : ''"
|
||
:category-names="cateId && pickValue !== '其他' ? [pickValue] : []" :region="region"
|
||
padding="10rpx 0"></uiswiper>
|
||
<view class="table-box">
|
||
<view class="thead" style="height: 50rpx">
|
||
<view class="tr">
|
||
<view style="height: 50rpx" class="w-25p flex justify-center items-center">品名、材质</view>
|
||
<view style="height: 50rpx" class="w-20p flex justify-center items-center">采购量</view>
|
||
<!-- <view class="th">收货地</view>-->
|
||
<view style="height: 50rpx" class="w-25p flex justify-center items-center">采购企业</view>
|
||
<view style="height: 50rpx" class="w-15p flex justify-center items-center">报价情况</view>
|
||
<view style="height: 50rpx" class="w-15p flex justify-center items-center">操作</view>
|
||
</view>
|
||
</view>
|
||
<view class="tbody">
|
||
<view class="tr" v-for="(item, index) in list.rows" :key="index">
|
||
<view class="w-25p td-n" @click="detailLink(item._id)">
|
||
<text class="u-line-2">
|
||
{{
|
||
item.productList.map(p => `${p.goodsName}${p.materialQuality ?
|
||
`(${p.materialQuality})` : ''}`).join("/")
|
||
}}
|
||
</text>
|
||
</view>
|
||
<view class="w-20p td-n">
|
||
<text>{{
|
||
item.productList.map(p => (p.procureNumber ? p.procureNumber : '') + (p.procureUnit ? p.procureUnit : '')).join("/")
|
||
}}
|
||
</text>
|
||
</view>
|
||
<!-- <view class="td">{{ item.fullAddress }}</view>-->
|
||
<view class="w-25p td-n">
|
||
<text v-if="item.user">
|
||
{{
|
||
item.user.accountType === 1 ? item.user.person.personName.replace(/^(.).*(.)$/, "$1*$2") : item.user.company.companyName.replace(/^(.)(.).*(.)(.)(.)(.)$/, "$1$2***$3$4$5$6")
|
||
}}
|
||
</text>
|
||
</view>
|
||
<view class="w-15p td-n">{{ item.quoteNum }}家</view>
|
||
<view class="w-15p td-n">
|
||
<u-button
|
||
class="minibtn"
|
||
size="mini"
|
||
type="error"
|
||
plain
|
||
text="详情"
|
||
@click="detailLink(item._id)"
|
||
></u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 暂无数据 -->
|
||
<u-empty mode="list" text="暂无更多内容~" v-if="list.rows.length === 0"></u-empty>
|
||
<!-- <cmempty></cmempty> -->
|
||
<!-- <view v-if="showMore" class="more-btns">-->
|
||
<!-- <view class="item" @click="toMyQuote">-->
|
||
<!-- <u-icon name="order" color="#A92924" size="24"></u-icon>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="item" @click="toMyEnquiry">-->
|
||
<!-- <u-icon name="account" color="#A92924" size="24"></u-icon>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="item" @click="toRelease">-->
|
||
<!-- <u-icon name="plus" color="#A92924" size="24"></u-icon>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="issue" @click="showMore = !showMore">-->
|
||
<!-- <u-icon :name="showMore ? 'close' : 'plus'" color="#fff" size="24"></u-icon>-->
|
||
<!-- </view>-->
|
||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||
<u-picker v-if="isPick" :show="isPick" :columns="[allProductList]"
|
||
key-name="name" @confirm="handConfirmPick" @cancel="isPick = false">
|
||
<template #more>
|
||
<text @click="otherCateFilter" class="mr-15">其他分类</text>
|
||
<text @click="resetCate">重置</text>
|
||
</template>
|
||
</u-picker>
|
||
<u-picker v-if="isPickStatus" :show="isPickStatus"
|
||
:columns="[[{name: '正在询价', value: 'notPick'}, {name: '合作成交', value: 'picked'}, ]]"
|
||
key-name="name" @confirm="handConfirmStatusPick" @cancel="isPickStatus = 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 cmswiper from '@/components/common/swiper'
|
||
import {FactoryBuilding} from "@icon-park/vue";
|
||
import AddressSelect from "@/components/AddressSelect.vue";
|
||
import Collapse from "@/components/index/collapse.vue";
|
||
import uiswiper from "@/components/index/swiper.vue";
|
||
|
||
export default {
|
||
components: {
|
||
uiswiper,
|
||
Collapse,
|
||
AddressSelect,
|
||
FactoryBuilding,
|
||
uiheader,
|
||
cmsearch,
|
||
cmempty,
|
||
cmswiper,
|
||
},
|
||
data() {
|
||
return {
|
||
allChildCate: [],
|
||
categoryTreeData: [],
|
||
checkCategoryList: [],
|
||
allProductList: [],
|
||
list: {
|
||
rows: [],
|
||
total: 0
|
||
},
|
||
pageSize: 500,
|
||
keyword: '',
|
||
area: null,
|
||
showMore: false,
|
||
locationValue: '全国',
|
||
region: {
|
||
province: {
|
||
code: null,
|
||
name: null,
|
||
},
|
||
city: {
|
||
code: null,
|
||
name: null,
|
||
},
|
||
area: {
|
||
code: null,
|
||
name: null,
|
||
}
|
||
},
|
||
pickValue: '全部',
|
||
isPick: false,
|
||
cateId: null,
|
||
cateIndex: [0, 0],
|
||
status: '正在询价',
|
||
statusVal: 'notPick',
|
||
isPickStatus: false,
|
||
};
|
||
},
|
||
methods: {
|
||
handleChangeCate({indexs}) {
|
||
this.cateIndex = indexs
|
||
},
|
||
handConfirmPick({value}) {
|
||
this.pickValue = value[0].name
|
||
this.cateId = value[0]._id
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
handConfirmStatusPick({value}) {
|
||
this.status = value[0].name
|
||
this.statusVal = value[0].value
|
||
this.isPickStatus = false
|
||
this.search(1)
|
||
},
|
||
resetCate() {
|
||
this.cateIndex = [0, 0]
|
||
this.pickValue = '全部'
|
||
this.cateId = null
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
showAddress() {
|
||
this.$refs.AddressSelect.open(this.region, 3, true);
|
||
},
|
||
regionConfirm({province, city, area}) {
|
||
this.region = {province, city, area}
|
||
this.locationValue = !province.code ? '全国' : `${province.name}${city.name}${area.name}`
|
||
this.search(1)
|
||
},
|
||
detailLink(id) {
|
||
vk.navigateTo(`/pages/price/detail?id=${id}`);
|
||
},
|
||
toMyEnquiry() {
|
||
vk.navigateTo({
|
||
url: '/pages/price/my'
|
||
})
|
||
},
|
||
toMyQuote() {
|
||
vk.navigateTo({
|
||
url: '/pages/price/myQuote'
|
||
})
|
||
},
|
||
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/price/publish'
|
||
})
|
||
}
|
||
},
|
||
selectArea(e) {
|
||
this.area = e[2]
|
||
this.search(1)
|
||
},
|
||
afterSearch(keyword) {
|
||
this.keyword = keyword
|
||
this.search()
|
||
},
|
||
otherCateFilter() {
|
||
this.pickValue = '其他'
|
||
this.cateId = -1
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
search(pageIndex = 1) {
|
||
// const cateList = []
|
||
// this.allChildCate.forEach(item => {
|
||
// if (this.checkCategoryList.includes(item._id)) cateList.push(item.name)
|
||
// })
|
||
vk.callFunction({
|
||
url: 'client/enquiry/sheet/pub/getList',
|
||
title: '请求中...',
|
||
data: {
|
||
pageIndex,
|
||
pageSize: this.pageSize,
|
||
keyword: this.keyword,
|
||
// companyList: this.checkCompanyList,
|
||
// categoryIds: this.checkCategoryList
|
||
cateList: this.cateId ? [this.pickValue === '其他' ? 0 : this.pickValue] : null,
|
||
// material: this.checkTextureList,
|
||
area: this.region.area ? this.region.area.code : null,
|
||
status: this.statusVal
|
||
},
|
||
success: (data) => {
|
||
this.list = data
|
||
this.list.rows.forEach((val, index) => {
|
||
this.list.rows[index].fullAddress = (val.addressRegion && val.addressRegion.province) ? `${val.addressRegion.province.name}${val.addressRegion.city.name}${val.addressRegion.area.name}` : ''
|
||
if (val.addressDetail) this.list.rows[index].fullAddress += val.addressDetail
|
||
})
|
||
}
|
||
});
|
||
|
||
},
|
||
async getCate() {
|
||
const {rows} = await vk.callFunction({
|
||
url: 'client/spot/category/pub/getTree',
|
||
title: '请求中...',
|
||
});
|
||
this.allProductList = []
|
||
rows.map(item => {
|
||
item.children.forEach(child => {
|
||
this.allProductList.push({
|
||
...child,
|
||
parentName: item.name
|
||
})
|
||
})
|
||
item.idList = []
|
||
return item
|
||
})
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
if (option.keyword) this.keyword = option.keyword
|
||
// vk.callFunction({
|
||
// url: 'client/enquiry/template/pub/getList',
|
||
// title: '请求中...',
|
||
// data: {},
|
||
// success: (data) => {
|
||
// this.categoryTreeData = data.rows
|
||
// this.allChildCate = []
|
||
// this.categoryTreeData.forEach(item => {
|
||
// item.children.forEach(child => {
|
||
// this.allChildCate.push(child)
|
||
// })
|
||
// })
|
||
// }
|
||
// });
|
||
this.getCate()
|
||
this.search()
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.minibtn {
|
||
width: 60rpx;
|
||
font-size: 20rpx;
|
||
color: #A92924 !important;
|
||
border-color: #A92924;
|
||
}
|
||
|
||
.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: 0rpx;
|
||
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-work {
|
||
margin: 20rpx 10rpx;
|
||
}
|
||
|
||
.tr {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.table-box {
|
||
font-size: 24rpx;
|
||
line-height: 28rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.th, .td {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 20%;
|
||
height: 76rpx;
|
||
color: #000;
|
||
overflow: hidden;
|
||
box-sizing: border-box;
|
||
|
||
&:nth-child(2) {
|
||
width: 15%;
|
||
}
|
||
|
||
&:nth-child(4) {
|
||
width: 15%;
|
||
}
|
||
|
||
&:nth-child(5) {
|
||
width: 30%;
|
||
}
|
||
}
|
||
|
||
.td-n {
|
||
border-right: 1px solid #f2f2f2;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
background: #ffffff;
|
||
height: 60rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
&:first-child {
|
||
color: #A92924;
|
||
}
|
||
|
||
&:last-child {
|
||
border-right: none;
|
||
}
|
||
}
|
||
|
||
.more-btns {
|
||
position: fixed;
|
||
right: 30rpx;
|
||
bottom: 220rpx;
|
||
z-index: 99;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 90rpx;
|
||
border-radius: 999rpx;
|
||
background: white;
|
||
border: 1px solid #A92924;
|
||
|
||
.item {
|
||
margin: 20rpx 0;
|
||
}
|
||
}
|
||
</style>
|