uniapp_ahbcqz/bundle/pages/user/organ_result.vue

<template >
	<view class="settled-result" >
		<view class="result-box">
			<!-- Header -->
			<view class="result-header bg-white flex-col col-center">
				<u-image width="165rpx" height="165rpx" class="m-t-42" :src="getStatus.img" />
				<view class="m-t-32 lg bold">{{getStatus.text}}</view>
				<view>
					<view class="m-t-20 muted sm text-center">{{getStatus.desc}}</view>
					<view class="flex" v-if="applyDetail.audit_status !=2">
						
						<router-link class="flex-1" :to="{path: '/bundle/pages/user/organ', query: {id: applyDetail.id}}" >
							<view class="br60 flex row-center back-btn m-t-60 md">重新编辑</view>
						</router-link>
					</view>
					
				</view>
			</view>
			
			<!-- Content -->
			<view class="result-content bg-white m-t-20 p-20">
			
				<!-- 主营行业 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>机构名称</view>
					<view>{{applyDetail.name}}</view>
				</view>
				
				<!-- 主营行业 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>公司名称</view>
					<view>{{applyDetail.company}}</view>
				</view>
				
				<!-- 主营行业 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>联系方式</view>
					<view>{{applyDetail.contact}}</view>
				</view>
				<!-- 主营行业 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>所在地区</view>
					<view>{{applyDetail.address}}</view>
				</view>

				<!-- 图片 -->
				<view class="apply-form-item">
					<view><text class="primary m-r-10"></text>封面图</view>
					<view class="license-list flex m-t-10 flex-wrap">
						<view v-for="(item,index) in license" class="m-r-14 m-t-20" @tap="previewImage(index)"
							:key="index">
							<u-image width="152rpx" height="152rpx" :src="item" />
						</view>
					</view>
				</view>
				
				<!-- 主营行业 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>机构简介</view>
					<view>{{applyDetail.intro}}</view>
				</view>
				
				
				<!-- 处理结果 -->
				<view class="apply-form-item flex row-between">
					<view><text class="primary m-r-10"></text>处理结果</view>
					<view>{{applyDetail.remark?applyDetail.audit_remark:'--'}}</view>
				</view>
				
			</view>

		</view>
	</view>
</template>
<script>
	import {
		organDetail
	} from '@/api/user'
	import {copy} from '@/utils/tools'
	export default {
		data() {
			return {
				applyDetail: {},
				license: []
			}
		},

		methods: {
			async organDetail() {
				const {
					data,
					code
				} = await organDetail(this.id)
				if (code == 1) {
					this.applyDetail = data
					this.license = [data.image]
				}
			},
			previewImage(current) {
				uni.previewImage({
					current,
					urls: this.license
				})
			},
			onCopy(text) {
				copy(text)
			}
		},

		onLoad(options) {
			this.id = this.$Route.query.id
			this.organDetail()
		},
		computed: {
			getStatus() {
				const {
					applyDetail: {
						audit_status
					}
				} = this
				switch (audit_status) {
					case 0:
						return {
							img: '/static/images/img_store_submit.png',
								text: '已提交等待处理！',
								desc: '工作人员将会电话联系您，请注意接听！'
						}
					case 1:
						return {
							img: '/static/images/img_store_success.png',
								text: '工作人员已处理！',
								desc: '请查看处理结果'
						}
					case 2:
						return {
							img: '/static/images/img_store_fail.png',
								text: '工作人员已拒绝！',
								desc: '请重新提交申请'
						}
					default:
						return {}
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		overflow: scroll !important;
	}
	.settled-result {
		padding: 20rpx;
		    height: 100vh;
		    overflow: auto;

		.result-box {
			.result-header {
				padding: 0 75rpx 50rpx;
				border-radius: 10rpx;

				.btn-copy {
					width: 96rpx;
					height: 42rpx;
					line-height: 42rpx;
					border: $-solid-border;
				}
			}

			.back-btn {
				height: 88rpx;
				border: 1px solid #CCC;
				&.primary {
					border-color: $-color-primary;
					color: $-color-primary;
				}
			}

			.result-content {
				border-radius: 10rpx;

				.apply-form-item {
					padding: 30rpx 0;

					&:not(:last-of-type) {
						border-bottom: $-solid-border;
					}
				}
			}
		}
	}
</style>