jp-charge/pages/job/newsIndex/newsEntry/newsEntry.vue

<template>
	<view>
		<CompanyInfo  ref="refCompanyInfo" v-show="showcompany"   :vshow="showcompany" :companyId="companyId" :companyInfo="info.company"   @back="showcompany=false" ></CompanyInfo>
		
		<view v-show="!showcompany">
			<u-navbar title="详情"   >
				<view slot="right">
					<u-button  size="mini" :type="info.isAgree?'success':'error'"  v-if="info.isNeedAgree&&info.isAgree!=null" > {{info.isAgree?'已同意':'已拒绝'}}</u-button>
					
				</view>
				
				
			</u-navbar>
			 <view class="company-logo" v-if="info.company"  style="
    border-bottom: 1px inset;
"   @click="showcompany=true">
				<u-avatar :src="info.company.logo" size="100" mode="square"></u-avatar>
				<h3>{{info.company.name}}</h3>
			</view> 
			<view class="servicesInfo" v-if="info.messageDetail" style="padding-bottom: 80px;">
				<view class="title">
					<h2>{{info.messageDetail.title}}</h2>
				</view>
				<view class="main"  v-html="info.messageDetail.content">
					 
				</view>
			</view>
			<view class="servicesInfo-foot" v-if="info.isNeedAgree&&info.isAgree==null">
				<u-modal v-model="show"  style="padding: 10px;" show-cancel-button="true" title="拒绝理由(选填)" @confirm="changeAgree(0)">
						<view class="slot-content">
								<u-input v-model="context"  />
						</view>
					

				</u-modal>
				<u-button class="servicesInfo-btn" shape="circle" @click="show=true">拒绝</u-button>
				<u-button class="servicesInfo-btn" type="success"  @click="changeAgree(1)" shape="circle">同意</u-button>
			</view>
		</view>
		
	 
	</view>
</template>

<script>
	import api from './index.js'
	export default api;
</script>

<style scoped lang="scss">
	.company-logo{
		display: flex;
		align-items: center;
		padding: 30rpx;
		h3{
			font-size: 36rpx;
			margin-left: 20rpx;
			font-weight: normal;
		}
	}
	.servicesInfo{
		padding: 30rpx;
		.title{
			text-align: center;
		}
		.main{
			line-height:48rpx;
			margin-top:40rpx;
		}
	}
	.servicesInfo-foot{
		height: 120rpx;
		background-color: #fff;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: fixed;
		padding: 0 10rpx;
		bottom: 0;
		left: 0;
		right: 0;
		.servicesInfo-btn{
			flex: 0.5;
			margin: 0 10rpx;
		}
	}
	.newsList-time{
		display: flex;
		justify-content: center;
		margin-top: 40rpx;
		span{
			background-color: #c8c8c8;	
			padding: 6rpx 16rpx;
			color:#fff;
			border-radius:10rpx;
		}
	}
	.newsList-item{
		padding: 20rpx;
		margin: 20rpx;
		background-color: #fff;
		border-radius: 20rpx;
		.newsList-head{
			display: flex;
			justify-content: space-between;
			padding-bottom: 20rpx;
			span{
				color:#FF6D58;
				min-width: 80rpx;
				text-align: right;
			}
		}
		.newsList-main{
			padding-bottom: 20rpx ;
			color:#999;
		}
		.newsList-foot{
			padding-top: 20rpx;
			border-top: 1px solid #f7f7f7;
			display: flex;
			justify-content: space-between;
		}
	}
</style>
<style lang="scss" scoped>
	.slot-content {
		font-size: 28rpx;
		color: $u-content-color;
		padding-left: 60rpx;
	}
</style>