shuju_ui/qs_zhaoshang/components/clue/clue.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.xmbh||""}}</view>
						</view>
						<view class="contenta">
							<view class="tit">项目线索名称</view>
							<view class="txt">{{datainfo.xmxsmc||""}}</view>
						</view>
						<view class="contenta">
							<view class="tit">拟投资额 (亿元)</view>
							<view class="txt">{{datainfo.ntze||""}}</view>
						</view>
					</view>
				</template>
				<view class="content">
					<view class="contenta">
						<view class="tit">项目编号</view>
						<view class="txt">{{datainfo.xmbh||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">项目线索名称</view>
						<view class="txt">{{datainfo.xmxsmc||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">是否为领航信息项目</view>
						<view class="txt">{{(datainfo.sfwlhxxxm=='Y'||datainfo.sfwlhxxxm=='S') ? '是':'否'}}</view>
					</view>
					<!-- <view class="contenta">
						<view class="tit">引资地区</view>
						<view class="txt">{{getYzAdr(datainfo.yzdqId)||""}}</view>
					</view> -->
					<view class="contenta">
						<view class="tit">引资省市</view>
						<view class="txt">{{datainfo.yzssName||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">拟投资额 (亿元)</view>
						<view class="txt">{{datainfo.ntze||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">产业类型</view>
						<view class="txt">{{datainfo.cylxName||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">项目类别</view>
						<view class="txt">{{datainfo.xmlb||""}}</view>
					</view>
					<!-- <view class="contenta">
						<view class="tit">投资类别</view>
						<view class="txt">{{datainfo.tzlb||""}}</view>
					</view> -->
					<view class="contenta">
						<view class="tit">拟落户地</view>
						<view class="txt">{{datainfo.nlhd||""}}</view>
					</view>
					<!-- <view class="contenta">
						<view class="tit">投资主体</view>
						<view class="txt">{{datainfo.tzzt||""}}</view>
					</view> -->
					<view class="contenta">
						<view class="tit">个体投资人身份证号码</view>
						<view class="txt">{{datainfo.gtzzrsfzhm||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">企业投资人信用证代码</view>
						<view class="txt">{{datainfo.qytzrxyzdm||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">企业背景</view>
						<view class="txt">{{datainfo.qybj||""}}</view>
					</view>
					<!-- <view class="contenta">
						<view class="tit">投资方简介</view>
						<view class="txt">{{datainfo.tzfjj||""}}</view>
					</view> -->
					<!-- <view class="contenta">
						<view class="tit">上年度销售额(万元)</view>
						<view class="txt">{{datainfo.sndxse||""}}</view>
					</view> -->
					<!-- <view class="contenta">
						<view class="tit">上年度纳税额(万元)</view>
						<view class="txt">{{datainfo.sndnse||""}}</view>
					</view> -->
					<view class="contenta">
						<view class="tit">投资人姓名、职务、联系方式</view>
						<view class="txt">{{datainfo.tzrxm||""}}<block v-if="datainfo.tzrzw">、</block>{{datainfo.tzrzw||""}}<block v-if="datainfo.tzrdh">、</block>{{datainfo.tzrdh||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">项目简介</view>
						<view class="txt">{{datainfo.xmjj||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">项目进展</view>
						<view class="txt">{{datainfo.xmjzqk||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">存在问题</view>
						<view class="txt">{{datainfo.czwt||""}}</view>
					</view>
				</view>
			</uni-collapse-item>
			<!-- 企业，自然人信息 -->
			<!-- 首谈信息 -->
			<uni-collapse-item title="企业/自然人" class='cldelista' :show-arrow='false' :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="f16 c64 fw mb10" v-if="qiaddlist.length">企业</view>
					
					<view v-for="(ite,idx) in qiaddlist" :key="'info-'+idx">
						
						<view class="contenta flexcj">
							<view class="tit flex0 flexcj mb10 mr10">企业名称</view>
							<view class="txt">{{ite.companyName}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">企业所在地</view>
							<view class="txt">{{ite.companyAddress}}</view>
						</view>
						<view class="contenta flexcj ">
							<view class="tit flex0 mr10">法人代表姓名</view>
							<view class="txt">{{ite.companyLegal}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">统一社会信用代码</view>
							<view class="txt">{{ite.companyCode}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">联系方式</view>
							<view class="txt">{{ite.phone}}</view>
						</view>
					</view>
					<!-- 自然人 -->
					<view class="border" v-if="qiaddlist.length&&ziaddlist.length"></view>
					<view class="f16 c64 fw mb10 pdt10" v-if="ziaddlist.length">自然人</view>
					<view v-for="(ite,idx) in ziaddlist" :key="idx">
						
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">姓名</view>
							<view class="txt">{{ite.name}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">所在地</view>
							<view class="txt">{{ite.address}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">身份证号码</view>
							<view class="txt">{{ite.idcode}}</view>
						</view>
						<view class="contenta flexcj">
							<view class="tit flex0 mr10">联系方式</view>
							<view class="txt">{{ite.phone}}</view>
						</view>
					</view>
				</view>
			</uni-collapse-item>
			
			<uni-collapse-item title="首谈信息" class='cldelista' :show-arrow='false' :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]==2||value[1]==2||value[2]==2?'act':''">
							<view class="cofe f15">{{value[0]==2||value[1]==2||value[2]==2?'信息折叠':'信息展开'}}</view>
							<image :src="upimg" ></image>
						</view>
					</view>
				</template>
				<view class="content">
					<view class="contenta">
						<view class="tit">首谈人姓名、职务、联系方式</view>
						<view class="txt">{{datainfo.name||""}}<block v-if="datainfo.zw">、</block>{{datainfo.zw||""}}<block v-if="datainfo.phone">、</block>{{datainfo.phone||""}}</view>
					</view>
					<view class="contenta">
						<view class="tit">首谈日期</view>
						<view class="txt">{{datainfo.strq||""}}</view>
					</view>
				</view>
			</uni-collapse-item>
		</uni-collapse>
		<!-- 备注 -->
		<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>
	import { selectDictLabel } from '@/utils/common.js';
	
	export default{
		props:{
			qiaddlist:{
				type: Array,
				default () {
					return []
				}
			},
			ziaddlist:{
				type: Array,
				default () {
					return []
				}
			},
			datainfo:{
				type: Object,
				default () {
					return {}
				}
			},
			yzadr:{
				type: Array,
				default () {
					return []
				}
			},
			cytype:{
				type: Array,
				default () {
					return []
				}
			},
			projectlist:{
				type: Array,
				default () {
					return []
				}
			},
			backgroundlist:{
				type: Array,
				default () {
					return []
				}
			}
		},
		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: '折叠内容主体，可自定义内容及样式，点击按钮修改内容使高度发生变化。',
			}
		},
		filters: {
			kaType(data, list) {
				return selectDictLabel(list, data);
			}
		},
		methods:{
			getDown(url){
				this.$emit('getDown',url)
			},
			changeone(e){
			},
			changetwo(e){
			},
			getYzAdr(data){
				return selectDictLabel(this.yzadr, data);
			},
			getCytype(data){
				return selectDictLabel(this.cytype, data);
			},
			getProject(data){
				return selectDictLabel(this.projectlist, data);
			},
			getBackground(data){
				return selectDictLabel(this.backgroundlist, data);
			}
			
		}
	}
</script>

<style lang="scss" scoped>
.cldelista{
	border-bottom: 2rpx solid #E5E5E5;
	.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;}
	}
	&.cldelistb{padding: 48rpx 28rpx;}
	.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>