<template>
	<div class="hui-flex hui-dialog">
		<div class="hui-flex-box hui-dialog-content">
			<div class="flow-form-box">
				<div class="flow-form-list">
					<property-flow-form ref="flowData" :flowForm="flowForm"></property-flow-form>
					<el-form :model="flowForm" label-position="top">
						<el-form-item label="流程附件" class="hui-textarea">
							<upload ref="upload" :list="responsibility" type="insert"></upload>
						</el-form-item>
						<el-form-item label="抄送人" class="hui-textarea">
							<cc ref="cc" type="insert" :ccList="ccList"></cc>
						</el-form-item>
					</el-form>
				</div>
				<div class="flow-approve-list">
					<flow ref="flow" type="insert" :flowlist="flowlist"></flow>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import flow from '@/components/flow/flow'
	import cc from '@/components/common/cc'
	import upload from '@/components/common/upload'
	import propertyFlowForm from '@/components/work/property/propertyFlowForm'
	export default {
		props: ['flowForm'],
		data() {
			return {
				responsibility: [],
				flowlist: [],
				ccList: []
			}
		},
		mounted() {},
		methods: {},
		components: {
			flow,
			upload,
			cc,
			propertyFlowForm
		},
	}
</script>

<style lang="scss">
	.flow-form-box {
		display: flex;
		width: 100%;
		height: 100%;

		.el-cascader {
			width: 100%;
		}

		.flow-form-list {
			flex: 1;
			height: 100%;
			overflow-x: hidden;
			overflow-y: auto;
			padding-right: 10px;
		}

		.flow-approve-list {
			width: 300px;
			border-left: 1px solid $--color-border;
		}
	}
</style>