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.
420 lines
9.5 KiB
420 lines
9.5 KiB
<template> |
|
<!--pages/demandHall/applyDetail/index.wxml--> |
|
<view class="applyDetail-page"> |
|
<view class="top-box"> |
|
<view class="company-card-box acea-row-nowrap"> |
|
<image :src="detail.resourceInfo.logo" class="company-logo" mode="aspectFill"></image> |
|
<view class="info"> |
|
<view class="company-name line1">{{detail.resourceInfo.name}}</view> |
|
<view class="tags-box"> |
|
<view class="tag-item">网站建设</view> |
|
</view> |
|
<view class="slogan">{{detail.resourceInfo.content}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="content-box acea-row"> |
|
<view class="content-l"> |
|
<scroll-view style="height:100%;" scroll-y="true" :scroll-into-view="toView"> |
|
<view v-for="(item, index) in userList" :key="index" :class="'l-item ' + (active == index ? 'l-item-a' : '')" @tap="itemClick" :data-i="index" :data-id="item.communicateId"> |
|
<view class="headerImg-box"> |
|
<image :src="item.headImg"></image> |
|
</view> |
|
</view> |
|
</scroll-view> |
|
</view> |
|
<view class="content-r"> |
|
<view class="copany-info-box"> |
|
<view class="c-name"> |
|
<text>{{content.name}}</text> |
|
</view> |
|
<view class="apply-word">{{content.demandInfo.content}}</view> |
|
<view class="need-item" v-if="content.demandInfo" @tap="toNeedDetail" :data-id="content.demandInfo.resourceId"> |
|
<view class="n-title-box acea-row row-between row-middle"> |
|
<view class="word line1">{{content.demandInfo.name}}</view> |
|
<view class="colO">详情</view> |
|
</view> |
|
<view class="n-tags acea-row"> |
|
<view class="n-tag-item">场地租赁</view> |
|
</view> |
|
<view class="price-box acea-row row-between row-middle"> |
|
<view>需求预算 <text class="colO">{{content.demandInfo.budget}}</text></view> |
|
<view>{{content.createTime}}</view> |
|
</view> |
|
</view> |
|
<view class="need-item" v-if="content.projectListDto != null" @tap="toCreateProject"> |
|
<view class="n-title-box acea-row row-between row-middle"> |
|
<view class="word line1">{{content.projectListDto.projectName}}</view> |
|
<view class="colO">详情</view> |
|
</view> |
|
<view class="n-tags acea-row"> |
|
<view class="n-tag-item">场地租赁</view> |
|
</view> |
|
<view class="price-box acea-row row-between row-middle"> |
|
<view class="desc line1">{{content.projectListDto.partner}}</view> |
|
<view>{{content.createTime}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="btn-box acea-row row-right"> |
|
<view class="btn-item bgO" @tap="createProject" v-if="content.haveRight">发起项目</view> |
|
<view class="btn-item bgO" @tap="call" v-if="content.comminuteState == 2">立即沟通</view> |
|
<view class="btn-item" @tap="cancelClick" v-if="content.comminuteState == 1">忽略</view> |
|
<view class="btn-item" v-if="content.comminuteState == 4">项目已取消</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
// pages/demandHall/applyDetail/index.js |
|
const app = getApp(); |
|
|
|
export default { |
|
data() { |
|
return { |
|
active: 0, |
|
detail: [], |
|
userList: [], |
|
communicateId: '', |
|
content: null, |
|
toView: "" |
|
}; |
|
}, |
|
|
|
components: {}, |
|
props: {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面加载 |
|
*/ |
|
onLoad: function (options) { |
|
let data = JSON.parse(decodeURIComponent(options.data)); |
|
this.setData({ |
|
detail: data |
|
}); |
|
this.getUserList(); |
|
}, |
|
|
|
/** |
|
* 生命周期函数--监听页面初次渲染完成 |
|
*/ |
|
onReady: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面显示 |
|
*/ |
|
onShow: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面隐藏 |
|
*/ |
|
onHide: function () {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面卸载 |
|
*/ |
|
onUnload: function () {}, |
|
|
|
/** |
|
* 页面相关事件处理函数--监听用户下拉动作 |
|
*/ |
|
onPullDownRefresh: function () { |
|
this.getApplyDetail(); |
|
}, |
|
|
|
/** |
|
* 页面上拉触底事件的处理函数 |
|
*/ |
|
onReachBottom: function () {}, |
|
|
|
/** |
|
* 用户点击右上角分享 |
|
*/ |
|
onShareAppMessage: function () {}, |
|
methods: { |
|
itemClick(e) { |
|
let i = e.currentTarget.dataset.i; |
|
let id = e.currentTarget.dataset.id; |
|
this.setData({ |
|
active: i, |
|
communicateId: id |
|
}); |
|
this.getApplyDetail(); |
|
}, |
|
|
|
getApplyDetail() { |
|
app.http('get', 'Communicate/getCommunicateInfo', { |
|
communicateId: this.communicateId |
|
}).then(res => { |
|
if (res.data.success) { |
|
this.setData({ |
|
content: res.data.data |
|
}); |
|
uni.stopPullDownRefresh(); |
|
} |
|
}); |
|
}, |
|
|
|
getUserList() { |
|
// console.log(this.data.detail) |
|
app.http('get', 'Communicate/communicateHeadList', { |
|
resourceId: this.detail.resourceInfo.resourceId |
|
}).then(res => { |
|
if (res.data.success) { |
|
this.setData({ |
|
userList: res.data.data, |
|
communicateId: res.data.data[0].communicateId |
|
}); |
|
this.getApplyDetail(); |
|
} |
|
}); |
|
}, |
|
|
|
toNeedDetail(e) { |
|
let id = e.currentTarget.dataset.id; |
|
uni.navigateTo({ |
|
url: '/pages/demandHall/needsDetail/index?id=' + id |
|
}); |
|
}, |
|
|
|
//查看立项书 |
|
toCreateProject() { |
|
let content = this.content; |
|
uni.navigateTo({ |
|
url: '/pages/demandHall/createProject/index?state=' + content.comminuteState + '&id=' + content.communicateId |
|
}); |
|
}, |
|
|
|
// 立项 |
|
createProject() { |
|
let id = this.communicateId; |
|
uni.showModal({ |
|
title: "提示！", |
|
content: '是否确认发起项目？', |
|
|
|
success(res) { |
|
if (res.confirm) { |
|
uni.navigateTo({ |
|
url: '/pages/demandHall/createProject/index?id=' + id |
|
}); |
|
} |
|
} |
|
|
|
}); |
|
}, |
|
|
|
call() { |
|
console.log(); |
|
uni.makePhoneCall({ |
|
phoneNumber: this.content.phone |
|
}); |
|
}, |
|
|
|
//忽略 |
|
cancelClick() { |
|
let content = this.content; |
|
uni.showModal({ |
|
title: "提示", |
|
content: '是否确认忽略该申请', |
|
success: res => { |
|
if (res.confirm) { |
|
app.http('GET', 'Communicate/cancelCommunicates', { |
|
communicateId: content.communicateId |
|
}).then(result => { |
|
if (result.data.success) { |
|
uni.showToast({ |
|
title: '操作成功', |
|
duration: 1500 |
|
}); |
|
setTimeout(() => { |
|
this.getUserList(); |
|
}, 1500); |
|
} |
|
}); |
|
} |
|
} |
|
}); |
|
} |
|
|
|
} |
|
}; |
|
</script> |
|
<style> |
|
/* pages/demandHall/applyDetail/index.wxss */ |
|
page{ |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.applyDetail-page{ |
|
height: 100%; |
|
} |
|
.top-box{ |
|
width: 100%; |
|
padding: 40rpx 40rpx 62rpx; |
|
background: linear-gradient(180deg, #FF5100 0%, #FFA782 100%); |
|
} |
|
.company-card-box { |
|
width: 100%; |
|
padding: 30rpx 12rpx; |
|
background: #FFFFFF; |
|
box-shadow: 0rpx 6rpx 12rpx rgba(0, 0, 0, 0.16); |
|
border-radius: 12rpx; |
|
} |
|
.info{ |
|
width: 70%; |
|
} |
|
.company-logo{ |
|
width: 154rpx; |
|
height: 154rpx; |
|
margin-right: 20rpx; |
|
} |
|
.company-name{ |
|
font-size: 28rpx; |
|
line-height: 56rpx; |
|
font-weight: 500; |
|
color: #1D1D1D; |
|
} |
|
.slogan{ |
|
font-size: 24rpx; |
|
line-height: 34rpx; |
|
color: #666; |
|
margin: 4rpx 0 12rpx; |
|
} |
|
.tags-box{ |
|
margin: 6rpx 0 10rpx; |
|
} |
|
.tag-item{ |
|
width: 112rpx; |
|
height: 36rpx; |
|
line-height: 34rpx; |
|
text-align: center; |
|
border: 1rpx solid #FFAA00; |
|
color: #FFAA00; |
|
border-radius: 4rpx; |
|
margin-right: 8rpx; |
|
font-size: 24rpx; |
|
} |
|
.content-box{ |
|
width: 100%; |
|
height: calc(100% - 490rpx); |
|
overflow: hidden; |
|
} |
|
.content-l{ |
|
width: 152rpx; |
|
height: 100%; |
|
padding-left: 22rpx; |
|
background: #EEEEEE; |
|
overflow: hidden; |
|
} |
|
.l-item{ |
|
width: 100%; |
|
height: 136rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
.headerImg-box{ |
|
width: 92rpx; |
|
height: 92rpx; |
|
border-radius: 8rpx; |
|
overflow: hidden; |
|
position: absolute; |
|
} |
|
.headerImg-box image{ |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.l-item-a{ |
|
background: #fff; |
|
border-top-left-radius: 50px; |
|
border-bottom-left-radius: 50px; |
|
} |
|
.content-r{ |
|
width: calc(100% - 152rpx); |
|
padding: 46rpx 30rpx; |
|
font-size: 28rpx; |
|
} |
|
.apply-word{ |
|
color: #666; |
|
line-height: 44rpx; |
|
margin-top: 24rpx; |
|
} |
|
.btn-box{ |
|
width: 100%; |
|
height: 160rpx; |
|
padding-top: 24rpx; |
|
position: absolute; |
|
bottom: 0; |
|
} |
|
.btn-item{ |
|
width: 190rpx; |
|
height: 76rpx; |
|
line-height: 76rpx; |
|
text-align: center; |
|
font-size: 32rpx; |
|
color: #fff; |
|
font-weight: 400; |
|
background: #BFBFBF; |
|
border-radius: 12rpx; |
|
margin-right: 16rpx; |
|
} |
|
.bgO{ |
|
background: linear-gradient(144deg, #FFA782 0%, #FF5100 100%); |
|
} |
|
.need-item{ |
|
width: 100%; |
|
padding: 10rpx 0; |
|
background: #FFFFFF; |
|
box-shadow: 0rpx 6rpx 12rpx rgba(0, 0, 0, 0.16); |
|
border-radius: 12rpx; |
|
margin: 32rpx 0; |
|
} |
|
|
|
.n-title-box{ |
|
padding: 0 26rpx 10rpx; |
|
font-size: 28rpx; |
|
color: #1D1D1D; |
|
margin: 16rpx 0 12rpx; |
|
border-bottom: 2px solid #E2E2E2; |
|
} |
|
.word{ |
|
width: 340rpx; |
|
font-size: 28rpx; |
|
} |
|
.colO{ |
|
color: #FF5100; |
|
font-size: 500; |
|
} |
|
.n-tags{ |
|
padding: 0 26rpx; |
|
margin-bottom: 10rpx; |
|
} |
|
.n-tag-item{ |
|
width: 112rpx; |
|
height: 36rpx; |
|
line-height: 34rpx; |
|
text-align: center; |
|
border: 1rpx solid #FFAA00; |
|
color: #FFAA00; |
|
border-radius: 4rpx; |
|
margin-right: 8rpx; |
|
font-size: 24rpx; |
|
} |
|
.bgG{ |
|
border: 1rpx solid #3A9EFA; |
|
color: #3A9EFA; |
|
} |
|
.bgR{ |
|
border: 1rpx solid #FC9367; |
|
color: #FC9367; |
|
} |
|
.price-box{ |
|
color: #707070; |
|
padding: 0 20rpx; |
|
} |
|
.desc{ |
|
width: 370rpx; |
|
} |
|
</style> |