You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
417 lines
9.4 KiB
417 lines
9.4 KiB
<template> |
|
<!--pages/demandHall/needsDetail/index.wxml--> |
|
<view class="needsDetail-box"> |
|
<view class="top-box"> |
|
<view class="count-down-box">{{detail.resourceEndTime}}停止报名</view> |
|
<view class="needs-info"> |
|
<view class="info-item"> |
|
<view class="item-l">需求标题:</view> |
|
<view class="item-r">{{detail.title}}</view> |
|
</view> |
|
<view class="info-item"> |
|
<view class="item-l">需求类型:</view> |
|
<view class="item-r">{{detail.cname}}</view> |
|
</view> |
|
<view class="info-item"> |
|
<view class="item-l">需求预算:</view> |
|
<view class="item-r">{{detail.capital}}</view> |
|
</view> |
|
<view class="info-item"> |
|
<view class="item-l">需求描述:</view> |
|
<view class="item-r">{{detail.detailedDescription}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="content-box"> |
|
<view class="company-info-box" v-if="detail.enterprise.enterpriseType == 1"> |
|
<view class="title-box acea-row row-middle"> |
|
<view class="col-line"></view> |
|
<text>发布公司</text> |
|
</view> |
|
<view class="company-card-box acea-row-nowrap row-middle" @click="toCompanyDetail()"> |
|
<image :src="detail.enterprise.enterpriseLogo" class="company-logo" mode="aspectFill"></image> |
|
<view class="info"> |
|
<view class="company-name">{{detail.enterprise.enterpriseName}}</view> |
|
<view class="tags-box"> |
|
<view class="tag-item">{{detail.cname}}</view> |
|
</view> |
|
<!-- <view class="slogan">让全世界全世界牛起全世界牛起全世界牛起牛起来。</view> --> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="company-info-box" v-if="detail.enterprise.enterpriseType == 2"> |
|
<view class="title-box acea-row row-middle"> |
|
<view class="col-line"></view> |
|
<text>发布人</text> |
|
</view> |
|
<view class="company-card-box acea-row-nowrap row-middle"> |
|
<image :src="detail.user.photo" class="header-img"></image> |
|
<view class="info"> |
|
<view class="user-name acea-row"> |
|
<view>{{detail.user.name}}</view> |
|
<image src="/static/images/home/cyrz.png" v-if="detail.user.isAuthentication"></image> |
|
<image class="tyg-tag" src="/static/images/home/tyg.png" v-if="detail.user.isVip"></image> |
|
</view> |
|
<view class="slogan">{{detail.user.address}}·{{detail.user.level}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="add-content-box"> |
|
<view class="title-box mt40 acea-row row-middle"> |
|
<view class="col-line"></view> |
|
<text>补充内容</text> |
|
</view> |
|
<view> |
|
<scroll-view scroll-x="true" class="scroll-view_H"> |
|
<view v-for="(item, index) in detail.resourceImgs" :key="index" @tap="previewImg"> |
|
<image mode="aspectFill" :src="item"></image> |
|
</view> |
|
</scroll-view> |
|
<!-- <swiper class='swiper-block' autoplay='true' circular='true' previous-margin='90rpx' next-margin='90rpx' current='0' bindchange='swiperChange'> |
|
<block wx:key='img' wx:for='{{detail.resourceImgs}}'> |
|
<swiper-item class='swiper-item'> |
|
<image mode='aspectFill' src='{{item}}' class='slide-image {{swiperIndex == index ? "active" : ""}}' /> |
|
</swiper-item> |
|
</block> |
|
</swiper> --> |
|
</view> |
|
</view> |
|
<!-- <view class="answer-box"> |
|
<view class="title-box mt40 acea-row row-middle"> |
|
<view class="col-line"></view> |
|
<text>有关问答</text> |
|
</view> |
|
</view> --> |
|
</view> |
|
<view class="btn-box"> |
|
<view class="contact-btn" @tap="toNeedsContact">立即报名</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
// pages/demandHall/needsDetail/index.js |
|
const app = getApp(); |
|
|
|
export default { |
|
data() { |
|
return { |
|
isCompany: true, |
|
id: '', |
|
detail: {} |
|
}; |
|
}, |
|
|
|
components: {}, |
|
props: {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面加载 |
|
*/ |
|
onLoad: function (options) { |
|
this.setData({ |
|
id: options.id |
|
}); |
|
this.getDetail(); |
|
}, |
|
|
|
/** |
|
* 生命周期函数--监听页面初次渲染完成 |
|
*/ |
|
onReady: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面显示 |
|
*/ |
|
onShow: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面隐藏 |
|
*/ |
|
onHide: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面卸载 |
|
*/ |
|
onUnload: function () {}, |
|
|
|
/** |
|
* 页面相关事件处理函数--监听用户下拉动作 |
|
*/ |
|
onPullDownRefresh: function () {}, |
|
|
|
/** |
|
* 页面上拉触底事件的处理函数 |
|
*/ |
|
onReachBottom: function () {}, |
|
|
|
/** |
|
* 用户点击右上角分享 |
|
*/ |
|
onShareAppMessage: function () {}, |
|
methods: { |
|
toCompanyDetail() { |
|
uni.navigateTo({ |
|
url: '/pages/demandHall/companyDetail/index?id=' + this.detail.enterprise.id |
|
}); |
|
}, |
|
|
|
getDetail() { |
|
app.http('get', 'Resources/resourceInfo', { |
|
id: this.id |
|
}).then(res => { |
|
if (res.data.success) { |
|
this.setData({ |
|
detail: res.data.data |
|
}); |
|
} |
|
}); |
|
}, |
|
|
|
toNeedsContact() { |
|
let str = encodeURIComponent(JSON.stringify(this.detail)); |
|
app.http('GET', 'Communicate/checkOwner', { |
|
resourceId: this.detail.id |
|
}).then(res => { |
|
if (res.data.success) { |
|
uni.navigateTo({ |
|
url: '/pages/demandHall/needsContact/index?detail=' + str |
|
}); |
|
} else { |
|
if (res.data.status == '5112') { |
|
uni.showModal({ |
|
title: '提示', |
|
content: res.data.msg, |
|
success: response => { |
|
if (response.confirm) { |
|
uni.navigateTo({ |
|
url: '/pages/release/index' |
|
}); |
|
} |
|
} |
|
}); |
|
} else { |
|
uni.showToast({ |
|
title: res.data.msg, |
|
icon: 'none', |
|
duration: 2000 |
|
}); |
|
} |
|
} |
|
}); |
|
}, |
|
|
|
previewImg() { |
|
uni.previewImage({ |
|
urls: this.detail.resourceImgs |
|
}); |
|
} |
|
|
|
} |
|
}; |
|
</script> |
|
<style> |
|
/* pages/demandHall/needsDetail/index.wxss */ |
|
.needsDetail-box{ |
|
padding-bottom: 190rpx; |
|
} |
|
.top-box{ |
|
width: 100%; |
|
padding: 0 40rpx 40rpx; |
|
background: linear-gradient(180deg, #FF5100 0%, #FFA782 100%); |
|
} |
|
.count-down-box{ |
|
text-align: right; |
|
color: #FFFFFF; |
|
font-size: 24rpx; |
|
padding: 20rpx 0; |
|
} |
|
.needs-info{ |
|
width: 100%; |
|
padding: 24rpx 20rpx; |
|
background: #fff; |
|
font-size: 28rpx; |
|
color: #1D1D1D; |
|
line-height: 34rpx; |
|
border-radius: 12rpx; |
|
} |
|
.info-item{ |
|
display: flex; |
|
align-items: top; |
|
margin-bottom: 20rpx; |
|
} |
|
.item-l{ |
|
color: #707070; |
|
} |
|
.item-r{ |
|
width: 484rpx; |
|
margin-left: 16rpx; |
|
} |
|
.content-box{ |
|
width: 100%; |
|
padding: 40rpx 0; |
|
} |
|
.company-info-box{ |
|
padding: 0 40rpx; |
|
} |
|
.add-content-box{ |
|
padding-left: 40rpx; |
|
} |
|
.tag{ |
|
width: 216rpx; |
|
height: 48rpx; |
|
line-height: 48rpx; |
|
text-align: center; |
|
font-size: 24rpx; |
|
color: #fff; |
|
background: linear-gradient(314deg, #FF5100 0%, #FF8800 100%); |
|
border-radius: 8rpx; |
|
margin: 16rpx 0; |
|
} |
|
.col-line{ |
|
width: 8rpx; |
|
height: 36rpx; |
|
background: #FF7942; |
|
border-radius: 4rpx; |
|
margin-right: 14rpx; |
|
} |
|
|
|
.colG{ |
|
font-size: 28rpx; |
|
line-height: 40rpx; |
|
color: #707070; |
|
margin-left: 20rpx; |
|
} |
|
.mt40{ |
|
margin-top: 40rpx; |
|
} |
|
.company-card-box { |
|
padding: 30rpx 12rpx; |
|
margin-top: 34rpx; |
|
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2); |
|
} |
|
.company-logo{ |
|
width: 150rpx; |
|
height: 150rpx; |
|
margin-right: 20rpx; |
|
border-radius: 8rpx; |
|
} |
|
.info{ |
|
width: 477rpx; |
|
height: auto; |
|
} |
|
.name{ |
|
font-size: 32rpx; |
|
line-height: 44rpx; |
|
} |
|
.slogan{ |
|
font-size: 24rpx; |
|
line-height: 34rpx; |
|
color: #666; |
|
margin: 4rpx 0 12rpx; |
|
} |
|
.tags-box{ |
|
margin: 6rpx 0 10rpx; |
|
} |
|
.tag-item{ |
|
width: auto; |
|
height: 36rpx; |
|
display: inline-block; |
|
line-height: 36rpx; |
|
text-align: center; |
|
font-size: 20rpx; |
|
background: linear-gradient(312deg, #FFB788 0%, #F9C8A7 100%); |
|
color: #fff; |
|
border-radius: 4rpx; |
|
margin-right: 8rpx; |
|
padding: 0 10rpx; |
|
} |
|
.bgG{ |
|
background: linear-gradient(134deg, #AEC8F6 0%, #76A6FA 100%); |
|
} |
|
.user-name{ |
|
|
|
} |
|
.header-img{ |
|
width: 120rpx; |
|
height: 120rpx; |
|
border-radius: 50%; |
|
margin-right: 20rpx; |
|
} |
|
.user-name image{ |
|
width: 134rpx; |
|
height: 38rpx; |
|
margin-left: 12rpx; |
|
} |
|
.user-name .tyg-tag{ |
|
width: 164rpx; |
|
} |
|
.btn-box{ |
|
width: 100%; |
|
height: 150rpx; |
|
line-height: 150rpx; |
|
align-self: center; |
|
background: #fff; |
|
border-top: 1rpx solid #ececec; |
|
text-align: right; |
|
padding-right: 52rpx; |
|
position: fixed; |
|
bottom: 0; |
|
} |
|
.contact-btn{ |
|
display: inline-block; |
|
width: 240rpx; |
|
height: 88rpx; |
|
text-align: center; |
|
line-height: 88rpx; |
|
background: linear-gradient(134deg, #FFA782 0%, #FF6D31 100%); |
|
border-radius: 12rpx; |
|
font-size: 32rpx; |
|
color: #fff; |
|
} |
|
|
|
.scroll-view_H{ |
|
white-space: nowrap; |
|
width: 100%; |
|
margin-top: 28rpx; |
|
} |
|
.scroll-view_H view{ |
|
display: inline-block; |
|
width: 216rpx; |
|
height: 216rpx; |
|
margin-right: 10rpx; |
|
} |
|
.scroll-view_H view image{ |
|
width: 100%; |
|
height: 100%; |
|
border-radius: 8rpx; |
|
} |
|
|
|
.swiper-block { |
|
height: 300rpx; |
|
width: 100%; |
|
} |
|
.swiper-item { |
|
display: flex; |
|
flex-direction: column; |
|
justify-content: center; |
|
align-items: flex-start; |
|
overflow: unset; |
|
} |
|
.slide-image { |
|
height: 250rpx; |
|
width: 520rpx; |
|
border-radius: 9rpx; |
|
margin: 0rpx 30rpx; |
|
z-index: 1; |
|
} |
|
.active { |
|
/* transform: scale(1.14); |
|
transition: all 0.2s ease-in 0s; |
|
z-index: 20; */ |
|
} |
|
|
|
.answer-box{ |
|
padding: 0 40rpx; |
|
} |
|
</style> |