shuju_ui/qs_zhaoshang/components/clue/tputinto.vue

<template>
	<view>
		<!-- 投产信息 -->
		<uni-collapse  ref="collapse" v-model="value" @change="changeone" >
			<!--  -->
			<uni-collapse-item title="投产信息" :show-arrow='false' class='cldelista'   :border="false" title-border="none">
				<template v-slot:title>
					<view class="flexc contentt">
						<view class="flex0 f16 fw cofe">投产信息</view>
						<view  class="flex1 cldelistz" :class="value[0]==0?'act':''">
							<view class="cofe f15">{{value[0]==0?'信息折叠':'信息展开'}}</view>
							<image :src="upimg" ></image>
						</view>
					</view>
					<!-- 展示的内容 项目名称、投产日期-->
					<view class="content pdt10" v-if="!value[0]||value[0]!=0">
						<view class="contenta">
							<view class="tit">项目名称</view>
							<view class="txt">{{datainfo.xmmc}}</view>
						</view>
						<view class="contenta">
							<view class="tit">投产日期</view>
							<view class="txt">{{datainfo.tcrq}}</view>
						</view>
					</view>
				</template>
				<view class="content">
					<view class="contenta">
						<view class="tit">项目名称</view>
						<view class="txt">{{datainfo.xmmc}}</view>
					</view>
					<view class="contenta">
						<view class="tit">投产日期</view>
						<view class="txt">{{datainfo.tcrq}}</view>
					</view>
					<view class="contenta">
						<view class="tit">入规日期</view>
						<view class="txt">{{datainfo.rgsj}}</view>
					</view>
					<view class="contenta">
						<view class="tit">拟入规日期</view>
						<view class="txt">{{datainfo.nrgsj}}</view>
					</view>
					<view class="contenta">
						<view class="tit">实际到资额(万元)</view>
						<view class="txt">{{datainfo.sjdze}}</view>
					</view>
					
					
				</view>
			</uni-collapse-item>
			<uni-collapse-item title="到资明细" :show-arrow='false' class='cldelista'   :border="false" title-border="none">
				<template v-slot:title>
					<view class="flexc contentt">
						<view class="flex0 f16 fw cofe">到资明细</view>
						<view  class="flex1 cldelistz" :class="value[0]==1||value[1]==1?'act':''">
							<view class="cofe f15">{{value[0]==1||value[1]==1?'信息折叠':'信息展开'}}</view>
							<image :src="upimg" ></image>
						</view>
					</view>
				</template>
				<view class="content">
					<view class="contenta flexcj mb10">
						<view class="tit" style="margin-bottom: 0;">用地面积(亩)</view>
						<view class="txt">{{datainfo.ydmj}}</view>
					</view>
					<view class="contenta flexcj mb10">
						<view class="tit" style="margin-bottom: 0;">土地出让(万元)</view>
						<view class="txt">{{datainfo.tdcr}}</view>
					</view>
					<view class="contenta flexcj mb10">
						<view class="tit" style="margin-bottom: 0;">新建厂房(平方米)</view>
						<view class="txt">{{datainfo.xjcf}}</view>
					</view>
					<view class="contenta flexcj mb10">
						<view class="tit" style="margin-bottom: 0;">厂房投入(万元)</view>
						<view class="txt">{{datainfo.cftr}}</view>
					</view>
					<view class="contenta flexcj">
						<view class="tit" style="margin-bottom: 0;">设备清单(万元)</view>
						<view class="txt">{{datainfo.sbqd}}</view>
					</view>
					<view class="contenta flexcj">
						<view class="tit" style="margin-bottom: 0;">设备发票(万元)</view>
						<view class="txt">{{datainfo.sbfp}}</view>
					</view>
					<view class="contenta flexcj">
						<view class="tit" style="margin-bottom: 0;">设备合同(万元)</view>
						<view class="txt">{{datainfo.sbht}}</view>
					</view>
					<view class="contenta flexcj">
						<view class="tit" style="margin-bottom: 0;">付款凭证(万元)</view>
						<view class="txt">{{datainfo.fkpz}}</view>
					</view>
				</view>
			</uni-collapse-item>
		</uni-collapse>
		<!--  租赁厂房 -->
		<view class="contentt cldelista">
			<view class="contenta flexcj mb10">
				<view class="tit" style="margin-bottom: 0;">租赁厂房(平方米)</view>
				<view class="txt">{{datainfo.zlcf}}</view>
			</view>
			<view class="contenta flexcj mb10">
				<view class="tit" style="margin-bottom: 0;">厂房投入(万元)</view>
				<view class="txt">{{datainfo.zlcftr}}</view>
			</view>
			<view class="contenta flexcj mb10">
				<view class="tit" style="margin-bottom: 0;">设备清单(万元)</view>
				<view class="txt">{{datainfo.zlsbqd}}</view>
			</view>
			<view class="contenta flexcj mb10">
				<view class="tit" style="margin-bottom: 0;">设备发票(万元)</view>
				<view class="txt">{{datainfo.zlsbfp}}</view>
			</view>
			<view class="contenta flexcj">
				<view class="tit" style="margin-bottom: 0;">设备合同(万元)</view>
				<view class="txt">{{datainfo.zlsbht}}</view>
			</view>
			<view class="contenta flexcj">
				<view class="tit" style="margin-bottom: 0;">付款凭证(万元)</view>
				<view class="txt">{{datainfo.zlfkpz}}</view>
			</view>
		</view>
		<!-- 税收 -->
		<view class="contentt cldelista">
			<view class="contenta flexcj mb10" style="padding: 0;">
				<view class="tit" style="margin-bottom: 0;">实缴税收(万元)</view>
				<view class="txt">{{datainfo.sjss}}</view>
			</view>
			<view class="contenta flexcj">
				<view class="tit" style="margin-bottom: 0;">连续<text class="f16 f500 c6 mlr8">{{datainfo.lxy}}</text>个月 缴纳社保<text  class="f16 f500 c6 mlr8">{{datainfo.jnsb}}</text>人</view>
			</view>
		</view>
		<!-- 装备投入 -->
		<view class="contentt cldelista">
			<view class="contenta flexcj" style="padding: 0;">
				<view class="tit" style="margin-bottom: 0;">装备投入(万元)</view>
				<view class="txt">{{datainfo.zbtr}}</view>
			</view>
		</view>
		<!-- 会计年度 -->
		<view class="contentt cldelista">
			<view class="contenta flexcj " style="padding: 0;">
				<view class="tit" style="margin-bottom: 0;">会计年度实缴税收(万元)</view>
				<view class="txt">{{datainfo.ndsjss}}</view>
			</view>
		</view>
		<!-- 其他 -->
		<view class="contentt cldelista">
			<view class="contenta flexcj" style="padding: 0;">
				<view class="tit" style="margin-bottom: 0;">其他</view>
				<view class="txt">{{datainfo.qt}}</view>
			</view>
		</view>
		<view class="contentt cldelista">
			<view class="contenta flexcj" style="padding: 0;">
				<view class="tit" style="margin-bottom: 0;">存在问题</view>
				<view class="txt">{{datainfo.czwt}}</view>
			</view>
		</view>
		<!-- 备注 -->
		<block v-if="datainfo.zsyzFjList">
			<view class='cldelista cldelistb' >
				<!-- <view class="contenta" v-if="datainfo.remark">
					<view class="tit">备注</view>
					<view class="txt">{{datainfo.remark}}</view>
				</view> -->
				<view class="contenta " v-if="datainfo.zsyzFjList">
					<view class="tit">附件</view>
					<view class="txt flexcj cldelistbf mb10" v-for="ite,idx in datainfo.zsyzFjList" :key='idx'>
						<view class="flext f16 c6">
							<view class="imgl">
								<image :src="wimg" ></image>
							</view>
							
							<view>{{ite.fjName}}</view>
							</view>
						<view class="flexc f16 co28 flex0" @click="getDown(ite.path)">
							<image :src="downimg" class="imgr"></image>
							预览</view>
					</view>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	export default{
		props:{
			datainfo:{
				type: Object,
				default () {
					return {}
				}
			},
			xmxsmc:""
		},
		data(){
			return{
				upimg:require('@/static/images/index/up.png'),
				wimg:require('@/static/images/index/wicon.png'),
				downimg:require('@/static/images/index/down.png'),
				value:[],
				valuetwo:[],
				content: '折叠内容主体，可自定义内容及样式，点击按钮修改内容使高度发生变化。',
			}
		},
		methods:{
			getDown(url){
				this.$emit('getDown',url)
			},
			changeone(e){
				// console.log(e,9)
			},
			changetwo(e){
				// console.log(e,9)
			}
		}
	}
</script>

<style lang="scss" scoped>
.cldelista{
	border-bottom: 2rpx solid #E5E5E5;
	&.cldelistb{padding: 48rpx 28rpx;}
	
}
.contentt{padding:48rpx 28rpx;
		.cldelistz{display: flex;align-items: center;justify-content: flex-end;
			image{width: 26rpx;height: 20rpx;margin-left: 20rpx;transition: all .5s; }
			&.act{
				image{transform: rotate(-180deg);}
			}
		}
	}
	.content{padding: 0rpx 28rpx 40rpx 28rpx;}
	.contenta{padding: 22rpx 0;
		.tit{font-size: 32rpx;font-weight: bold;color: #343434;margin-bottom: 20rpx;}
		.txt{font-size: 32rpx;color: #666666;}
	}
	
	.cldelistbf {
		image{margin-right: 18rpx;flex: 0 0 auto;}
		.imgl{width: 40rpx;height: 44rpx;display: flex;align-items: center;justify-content: center;margin-right: 16rpx;
			image{width: 38rpx;height: 30rpx;}
			}
		.imgr{width: 36rpx;height: 32rpx;}
	}
</style>