<template>
	<view class="client-detail detail" v-if="detail.id">
		<view class="detail-box">
			<view class="title-box">
				<view class="title">{{detail.name}}</view>
				<view class="date">{{detail.date}}</view>
				<view class="title-icon">
					<uni-icons type="wallet-filled" color="#fff" size="20"></uni-icons>
				</view>
			</view>
			<view class="other">
				<div class="item" v-if="detail.type !== 3">
					<div class="label">关联租客</div>
					<div class="value"> {{detail.tenantType === 1 ? detail.merchantName: detail.clientName}}</div>
				</div>
				<view class="item" v-if="detail.type === 3">
					<view class="label">合同编码</view>
					<view class="value">{{detail.contractCode}}</view>
				</view>
				<div class="item">
					<div class="label">跟进人</div>
					<div class="value">{{detail.followUpPersonName}}</div>
				</div>
				<div class="item">
					<div class="label">联系电话</div>
					<div class="value">{{detail.followUpPersonPhone}}</div>
				</div>
				<div class="item" v-if="detail.type !== 3">
					<div class="label">服务方式</div>
					<div class="value">
						{{detail.type === 1?$field.findTypeName('serviceWorkWay',detail.workWay):$field.findTypeName('clearWorkWay',detail.workWay)}}
					</div>
				</div>
				<div class="item">
					<div class="label">摘要</div>
					<div class="value">{{detail.compendious}}</div>
				</div>
			</view>
			<view class="state">
				<view class="create">
					<uni-icons class="inherit-icons" type="staff-filled" color="#08979c" size="18"></uni-icons>
					<text class="name hui-ellipsis">{{detail.followUpPersonName || '-'}}</text>
				</view>
				<view class="tag">
					<div class="status-tag info" v-if="!detail.status">待提交</div>
					<div class="status-tag primary" v-else-if="detail.status === 1">待处理</div>
					<div class="status-tag warning" v-else-if="detail.status === 2">处理中</div>
					<div class="status-tag success" v-else>已处理</div>
				</view>
			</view>
		</view>
		<view class="detail-box file-box">
			<view class="sub-title">
				<uni-icons type="images-filled" class="inherit-icons" size="26" color="#08979c"></uni-icons>
				<text class="sub-label">工单附件</text>
			</view>
			<view class="other">
				<upload ref="upload" :list="detail.attachment ? JSON.parse(detail.attachment) : []" type="preview">
				</upload>
			</view>
		</view>
		<view class="detail-box" v-if="detail.data && detail.data != '[]'">
			<view class="sub-title">
				<uni-icons type="calendar-filled" class="inherit-icons" size="26" color="#08979c"></uni-icons>
				<text class="sub-label">自定义信息</text>
			</view>
			<view class="other">
				<div class="item" v-for="(item,index) in JSON.parse(detail.data)" :key="index">
					<div class="label">{{item.keyName}}</div>
					<div class="value">{{item.value}}</div>
				</div>
			</view>
		</view>
		<view class="detail-box" v-if="detail.workOrderProcessList.length > 0">
			<view class="sub-title">
				<uni-icons type="map-filled" class="inherit-icons" size="24" color="#08979c"></uni-icons>
				<text class="sub-label">工单过程</text>
			</view>
			<process :process="detail.workOrderProcessList" v-if="detail.workOrderProcessList.length > 0">
			</process>
		</view>
	</view>
</template>

<script>
	import {
		getOrderDetailById
	} from '@/request/api/order.js'
	import upload from '@/components/common/upload.vue';
	import process from '@/components/common/process.vue';
	export default {
		data() {
			return {
				orderId: 3,
				detail: {},
				user: {}
			}
		},
		onLoad(body) {
			if (body.orderId) this.orderId = body.orderId;
			this.init();
			this.user = this.$store.getters.user;
		},
		methods: {
			init() {
				if (!this.orderId) return;
				getOrderDetailById(this.orderId).then(res => {
					if (res.code === 200) {
						this.detail = res.data;
					}
				})
			}
		},
		components: {
			upload,
			process
		},
	}
</script>

<style lang="scss">

</style>