supervise/supervise-uniapp/pages/index/ProjectDetail.vue

<template>

	<view class="pages">

		<view class="layout">

			<view class="layout-item">
				<text class="text1">项目名称</text>
				<text class="text2">{{info.entryName}}</text>
			</view>

			<view class="layout-item">
				<text class="text1">所属行业</text>
				<text class="text2">{{info.industryName}}</text>
			</view>

			<view class="layout-item" style="border-bottom: none;">
				<text class="text1">企业名称</text>
				<text class="text2">{{info.enterpriseName}}</text>
			</view>

		</view>

		<view class="layout" style="margin-top: 10px;">

			<view class="layout-item">
				<text class="text1">授信额度</text>
				<text class="text2">{{info.creditLimit}}</text>
			</view>

			<view class="layout-item">
				<text class="text1">项目类型</text>
				<text class="text2">{{info.typeName}}</text>
			</view>

			<view class="layout-item" style="border-bottom: none;">
				<text class="text1">贷款银行</text>
				<text class="text2">{{info.bankName}}</text>
			</view>

		</view>

		<view class="layout" style="margin-top: 10px;">

			<text style="margin-top: 15px;margin-left: 13px;">项目仓库</text>

			<view class="list">

				<view class="list-item" v-for="item in imageArr">

					<view class="list-item-lay">
						<image class="item-img" :src="item.src" mode="aspectFill" @tap="previewImage(item.src)"></image>
						<text class="item-text">{{item.title}}</text>
					</view>


				</view>

			</view>


		</view>



		<view class="layout" style="margin-top: 10px;">

			<view class="layout-item">
				<text class="text1">项目联系人</text>
				<text class="text2">{{info.eContacts}}</text>
			</view>

			<view class="layout-item">
				<text class="text1">监管负责人</text>
				<text class="text2">{{info.regulatoryLeader}}</text>
			</view>

			<view class="layout-item" style="border-bottom: none;">
				<text class="text1">客户经理</text>
				<text class="text2">{{info.bManagerName}}</text>
			</view>

		</view>

		<view class="layout" style="margin-top: 10px;">

			<view class="layout-item">
				<text class="text1">签约日期</text>
				<text class="text2">{{info.signingDate}}</text>
			</view>

			<view class="layout-item">
				<text class="text1">结束日期</text>
				<text class="text2">{{info.endDate}}</text>
			</view>

			<view class="layout-item" style="border-bottom: none;">
				<text class="text1">填表日期</text>
				<text class="text2">{{info.fillInDate}}</text>
			</view>

		</view>

		<view class="layout" style="margin-top: 10px;">

			<view class="layout-item" style="border-bottom: none;">
				<text class="text1">事业部经理</text>
				<text class="text2">{{info.generalManager}}</text>
			</view>

		</view>

		<view class="layout" style="margin-top: 10px;padding: 20px; padding-bottom: 50px;">

			<text
				style="font-size: 14px;color: #919191;line-height: 25px;">项目说明：{{info.remarks}}</text>

		</view>

	</view>

</template>

<script>
	export default {
		data() {
			return {
				info: {},
				imageArr: [
					// {
					// 	src: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
					// 	title: "芙蓉"
					// },
					// {
					// 	src: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
					// 	title: "芙蓉"
					// },
					// {
					// 	src: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
					// 	title: "芙蓉"
					// }, {
					// 	src: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
					// 	title: "芙蓉"
					// },
					// {
					// 	src: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
					// 	title: "芙蓉"
					// }
				],
			}
		},
		onLoad(option) {
			this.loadData1(option.sid);
			this.loadData2(option.sid);
		},
		methods: {
			loadData1(sid) {
				this.$api.getProjectBySid(sid).then((resp) => {
					// if (resp.success) {
					console.log('1111', resp)
					this.info = resp

				}).catch(e => {
					console.log('eeeee', e)
				})
			},

			loadData2(sid) {
				this.$api.getStorehouseBySid(sid).then((resp) => {
					// if (resp.success) {
					console.log('222', resp)
					// this.dataList = resp
						this.imageArr =[]
					for (var i = 0; i < resp.length; i++) {
						let  item = resp[i]
							this.imageArr.push(
							{
								src:item.picUrl,
								title:item.simpleName
							})
					}

				}).catch(e => {
					console.log('eeeee', e)
				})
			},


		}
	}
</script>

<style lang="scss">
	.pages {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;

		.layout {

			display: flex;
			flex-direction: column;
			background: #fff;
			padding-left: 20px;
			padding-right: 20px;

			.layout-item {
				padding: 10px 12px;
				border-bottom: 1px solid #eee;

				display: flex;
				flex-direction: row;
				align-items: center;

				.text1 {
					flex: 0.8;
					font-size: 16px;
					color: #494949;
				}

				.text2 {

					flex: 1;
					font-size: 15px;
					color: #bcbcbc;
				}
			}


			.list {
				margin-top: 10px;
				column-count: 2;

				.list-item {
					width: 100%;

					.list-item-lay {
						
						.item-img {
							width: 100%;
							height: 105px;
							border: 1px solid #4D72FF;
						}
						.item-text {
							z-index: 1000;
							position: relative;
							top: -28px;
							padding: 3px 15px 3px 15px;
							color: #fff;
							background: #4D72FF;
							 opacity:0.7;  
							 font-size: 13px;
							border-top-right-radius: 15px;
						}
					}

					

				}

			}
		}
	}
</style>