516 lines
14 KiB
Vue
516 lines
14 KiB
Vue
<template>
|
||
<view>
|
||
<u-sticky offset-top="0" customNavHeight="0">
|
||
<uititle title="加工厂列表"></uititle>
|
||
</u-sticky>
|
||
<!-- 商品列表 -->
|
||
<cmswiper page="factory" height="320rpx"></cmswiper>
|
||
<cmsearch :k="keyword" @search="afterSearch" :show-back="false"></cmsearch>
|
||
<view class="layout-pick flex justify-between align-center bg-white text-25" >
|
||
<view class="flex justify-start items-center">
|
||
<view class="flex-1 ip down" @click="isPick = true">分类: {{ pickValue ? pickValue : '全部分类' }}</view>
|
||
</view>
|
||
<view class="ip down" @click="showAddress" style="width: 300rpx">省份：{{ locationValue }}</view>
|
||
</view>
|
||
<view class="goods-list">
|
||
<uiswiper :ad="12" :category-name="cateId ? pickValue : ''"
|
||
:category-names="cateId ? [pickValue] : []" :region="region" padding="10rpx 0"></uiswiper>
|
||
<uiswiper :ad="122" :category-name="cateId ? pickValue : ''"
|
||
:category-names="cateId ? [pickValue] : []" :region="region" padding="10rpx 0"></uiswiper>
|
||
<view v-for="(item, index) in list.rows" :key="index" class="goods">
|
||
<view class="goods-info">
|
||
<!-- <el-image src="https://oss.wsdns.cn/20231204/d35332fa6a3b4596b522edf9527ac612.png"-->
|
||
<!-- class="goods-img"/>-->
|
||
<view class="info" @click="$jump(`/pages/work/factory?userId=${item.uid}`)">
|
||
<view class="field w-100p">
|
||
<view class="desc">
|
||
<view class="text">企 业</view>
|
||
<view v-if="item.user">
|
||
{{ item.user.accountType === 2 ? item.user.company.companyName : item.user.person.personName }}
|
||
</view>
|
||
</view>
|
||
<view class="desc"></view>
|
||
<view class="desc">
|
||
<view class="text">所在地区</view>
|
||
<view>{{ item.addressRegion.province.name }}{{ item.addressRegion.city.name }}</view>
|
||
</view>
|
||
<view class="flex justify-start items-center w-100p">
|
||
<view class="desc flex-1">
|
||
<view class="text">成立年限</view>
|
||
<view>{{ item.year }}年</view>
|
||
</view>
|
||
<view class="desc flex-1">
|
||
<view class="text">年产值</view>
|
||
<view>{{ item.yearsIncome }}万元</view>
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-center w-100p">
|
||
<view class="desc flex-1">
|
||
<view class="text">员工人数</view>
|
||
<view>{{ item.employeeNum }}人</view>
|
||
</view>
|
||
<view class="desc flex-1">
|
||
<view class="text">流水线数量</view>
|
||
<view>{{ item.flowNum }}条</view>
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-center w-100p">
|
||
<view class="desc flex-1">
|
||
<view class="text">厂房归属</view>
|
||
<view>{{ item.blongTo }}</view>
|
||
</view>
|
||
<view class="desc flex-1">
|
||
<view class="text">厂房面积</view>
|
||
<view>{{ item.size }}㎡</view>
|
||
</view>
|
||
</view>
|
||
<view class="desc">
|
||
<view class="text">服务信息</view>
|
||
<view>{{ item.serviceInfo }}</view>
|
||
</view>
|
||
<view class="desc">
|
||
<view class="text mr-15" style="width: 240rpx">主营工艺和业务范围</view>
|
||
<view class="flex-1">{{ item.mainProcess }}</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="buttons">
|
||
<button type="default" class="btn" plain @click="doShowContract(index)">查看电话
|
||
</button>
|
||
<button type="default" class="btn green" plain @click="doShowWechat(index)">添加微信
|
||
</button>
|
||
<button type="default" class="btn" plain @click="$jump(`/pages/work/factory?userId=${item.uid}`)">查看详情
|
||
</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">{{
|
||
(item.user.businessCard && item.user.businessCard.companyMobile) ? item.user.businessCard.companyMobile : '暂无电话'
|
||
}}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||
<u-picker v-if="isPick" :show="isPick" :columns="[categoryTreeData]"
|
||
key-name="name" @confirm="handConfirmPick" @cancel="isPick = false">
|
||
<template #more>
|
||
<text @click="resetCate">重置</text>
|
||
</template>
|
||
</u-picker>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import uititle from "@/components/common/title.vue";
|
||
import cmswiper from "@/components/common/swiper.vue";
|
||
import uiswiper from "@/components/index/swiper.vue";
|
||
import cmsearch from "@/components/common/search.vue";
|
||
import AddressSelect from "@/components/AddressSelect.vue";
|
||
|
||
export default {
|
||
components: {AddressSelect, cmsearch, uiswiper, cmswiper, uititle},
|
||
data() {
|
||
return {
|
||
checkCategoryList: [],
|
||
clickedCateIndex: -1,
|
||
checkProvinceList: [],
|
||
categoryTreeData: [],
|
||
allChildCate: [],
|
||
keyword: '',
|
||
list: {
|
||
total: 0,
|
||
rows: []
|
||
},
|
||
showAllProvince: false,
|
||
type: 0,
|
||
pageSize: 500,
|
||
pickValue: '全部',
|
||
isPick: false,
|
||
locationValue: '全国',
|
||
region: {
|
||
province: {
|
||
code: null,
|
||
name: null,
|
||
}
|
||
},
|
||
};
|
||
},
|
||
onLoad(option) {
|
||
if (option.type) this.type = option.type
|
||
vk.callFunction({
|
||
url: 'client/process/category/pub/getTree',
|
||
title: '请求中...',
|
||
success: (data) => {
|
||
this.categoryTreeData = data.rows
|
||
this.allChildCate = []
|
||
this.categoryTreeData.forEach(item => {
|
||
item.children.forEach(child => {
|
||
this.allChildCate.push(child)
|
||
})
|
||
})
|
||
}
|
||
});
|
||
},
|
||
onShow() {
|
||
this.search(1)
|
||
},
|
||
methods: {
|
||
showAddress() {
|
||
this.$refs.AddressSelect.open(this.region, 1, true);
|
||
},
|
||
navTo(url) {
|
||
vk.navigateTo({
|
||
url
|
||
})
|
||
},
|
||
afterSearch(keyword) {
|
||
this.keyword = keyword
|
||
this.search()
|
||
},
|
||
selectCate(id) {
|
||
const index = this.checkCategoryList.indexOf(id)
|
||
if (index === -1) this.checkCategoryList.push(id)
|
||
else this.checkCategoryList.splice(index, 1)
|
||
this.search(1)
|
||
},
|
||
selectProvince(code) {
|
||
if (code === -1) this.checkProvinceList = []
|
||
else {
|
||
const index = this.checkProvinceList.indexOf(code)
|
||
if (index === -1) this.checkProvinceList.push(code)
|
||
else this.checkProvinceList.splice(index, 1)
|
||
}
|
||
this.search(1)
|
||
},
|
||
toMyEnquiry() {
|
||
vk.navigateTo({
|
||
url: '/pages/process/my'
|
||
})
|
||
},
|
||
|
||
search(pageIndex) {
|
||
// const categoryIds = []
|
||
// this.allChildCate.map(item => {
|
||
// if (this.checkCategoryList.indexOf(item._id) > -1) categoryIds.push(item.name)
|
||
// })
|
||
console.log(this.region)
|
||
vk.callFunction({
|
||
url: 'client/factory/pub/getList',
|
||
title: '加载中...',
|
||
data: {
|
||
pageIndex,
|
||
pageSize: this.pageSize,
|
||
keyword: this.keyword,
|
||
mainSpotCategory: this.cateId ? this.pickValue : null,
|
||
province: this.region ? this.region.province.code : null
|
||
},
|
||
success: ({data}) => {
|
||
data.rows.map(item => {
|
||
item.showWechat = false
|
||
item.showContract = false
|
||
return item
|
||
})
|
||
this.list = data
|
||
console.log(this.list)
|
||
}
|
||
});
|
||
},
|
||
getCertUrl() {
|
||
vk.callFunction({
|
||
url: 'client/fadada.getVerifyUrl',
|
||
success: (res) => {
|
||
location.href = res.data.url
|
||
}
|
||
});
|
||
},
|
||
doShowWechat(index) {
|
||
if (parseInt(this.list.rows[index].user.accountType) === 2 && !this.list.rows[index].user.businessCard.companyWechat)
|
||
return vk.toast('用户暂未上传')
|
||
else if (parseInt(this.list.rows[index].user.accountType) === 1 && !this.list.rows[index].user.businessCard.personalWechat)
|
||
return vk.toast('用户暂未上传')
|
||
this.list.rows[index].showContract = false
|
||
this.list.rows[index].showWechat = !this.list.rows[index].showWechat
|
||
},
|
||
doShowContract(index) {
|
||
this.list.rows[index].showWechat = false
|
||
this.list.rows[index].showContract = !this.list.rows[index].showContract
|
||
},
|
||
handConfirmPick({value}) {
|
||
console.log(value)
|
||
this.pickValue = value[0].name
|
||
this.cateId = value[0]._id
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
resetCate() {
|
||
this.cateIndex = [0, 0]
|
||
this.pickValue = '全部'
|
||
this.cateId = null
|
||
this.region = null
|
||
this.isPick = false
|
||
this.search(1)
|
||
},
|
||
regionConfirm({province}) {
|
||
this.region = {province}
|
||
this.locationValue = `${province.name}`
|
||
this.search(1)
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.carousel {
|
||
//width: 1200px;
|
||
margin: 20rpx auto;
|
||
}
|
||
|
||
.page-nav {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.carousel-img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.goods-options {
|
||
background-color: #FFFFFF;
|
||
padding: 20rpx;
|
||
}
|
||
|
||
.filter-outer {
|
||
//width: 1200px;
|
||
margin: 20rpx auto;
|
||
background-color: #FFFFFF;
|
||
padding: 20rpx;
|
||
}
|
||
|
||
.tags {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.el-tag {
|
||
margin-right: 10px;
|
||
}
|
||
}
|
||
|
||
|
||
.goods-list {
|
||
//width: 1200px;
|
||
//margin: 20rpx auto;
|
||
//display: flex;
|
||
//flex-direction: column;
|
||
//justify-content: space-between;
|
||
//flex-wrap: wrap;
|
||
padding: 30rpx;
|
||
font-size: 25rpx;
|
||
}
|
||
|
||
.goods {
|
||
background-color: #FFFFFF;
|
||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.05);
|
||
text-align: center;
|
||
//width: 1200px;
|
||
margin: 10px auto;
|
||
padding: 20rpx;
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
flex-direction: column;
|
||
|
||
.goods-info {
|
||
display: flex;
|
||
|
||
.goods-img {
|
||
width: 200rpx;
|
||
height: 150px;
|
||
}
|
||
|
||
.info {
|
||
width: 700rpx;
|
||
text-align: left;
|
||
margin-left: 20rpx;
|
||
|
||
.goods-name {
|
||
font-size: 20rpx;
|
||
font-weight: 500;
|
||
line-height: 2.5em;
|
||
}
|
||
|
||
.field {
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
|
||
.desc {
|
||
display: flex;
|
||
//width: 700rpx;
|
||
line-height: 45rpx;
|
||
|
||
.text {
|
||
width: 140rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.buttons {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
position: relative;
|
||
|
||
.btn {
|
||
font-size: 25rpx;
|
||
width: 200rpx;
|
||
}
|
||
|
||
.green {
|
||
background-color: #7ec050 !important;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.wechat {
|
||
position: absolute;
|
||
left: 260rpx;
|
||
top: -200rpx;
|
||
width: 150rpx;
|
||
height: 150rpx;
|
||
background-color: white;
|
||
border-radius: 10px;
|
||
padding: 5px;
|
||
box-shadow: 0 1px 10px 0 #eee
|
||
}
|
||
|
||
.mobile {
|
||
position: absolute;
|
||
left: 10rpx;
|
||
top: -80rpx;
|
||
background-color: white;
|
||
border-radius: 10px;
|
||
padding: 5px;
|
||
box-shadow: 0 1px 10px 0 #999;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
|
||
&-title {
|
||
font-size: 15px;
|
||
color: #101010;
|
||
height: 62px;
|
||
padding-top: 20rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
&-stock {
|
||
font-size: 12px;
|
||
color: #BD3124;
|
||
}
|
||
|
||
&-address {
|
||
font-size: 12px;
|
||
margin: 10px 0;
|
||
}
|
||
|
||
&-image {
|
||
width: 200rpx;
|
||
height: 70px;
|
||
margin: 0 auto;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
&-company {
|
||
color: #4F4F4F;
|
||
font-size: 14px;
|
||
margin: 10px 0;
|
||
}
|
||
|
||
&-buy {
|
||
width: 108rpx;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
background-color: rgba(255, 255, 255, 1);
|
||
color: rgba(169, 41, 36, 1);
|
||
font-size: 13px;
|
||
text-align: center;
|
||
font-family: Roboto;
|
||
border: 1px solid rgba(169, 41, 36, 1);
|
||
margin: 0 auto;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.goods-image {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
.selected-cate {
|
||
border-bottom: 2px solid #BD3124;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.child-cate {
|
||
background-color: #DB8382;
|
||
color: white;
|
||
margin-top: 10rpx;
|
||
border-radius: 15rpx;
|
||
padding: 0 20rpx;
|
||
}
|
||
|
||
.layout-pick {
|
||
// width: 690rpx;
|
||
height: 68rpx;
|
||
padding: 0 30rpx;
|
||
font-size: 24rpx;
|
||
line-height: 40rpx;
|
||
color: #4F4F4F;
|
||
|
||
.ip {
|
||
position: relative;
|
||
//width: ;
|
||
//max-width: 33.333%;
|
||
width: 300rpx;
|
||
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;
|
||
}
|
||
}
|
||
</style>
|