<template>
	<div>
	<div id="sampleReport">
        <el-descriptions  title="农产品质量安全抽样单" :column="2" border style="margin-top:20px">
            <el-descriptions-item label="抽样单编号" prop="cyd_data.cyd_code" style="width:200px" class="labelItem" size="mini" required >
                {{cyd_data.cyd_code}}
            </el-descriptions-item>    
        </el-descriptions>
         <!-- 抽样人员情况 -->
            <el-descriptions :column="1" border style="" >
                <el-descriptions-item label="抽样人员信息" >
                    <el-descriptions  :column="1" border  size="mini" style="width:100%;font-size:20px;">
                        <el-descriptions-item label="抽样人员1" prop="cydProfile_unit.sample_person_one" size="mini" required>
                            {{cydProfile_unit.sample_person_one}}
                        </el-descriptions-item>
                         <el-descriptions-item label="抽样人员2" prop="cydProfile_unit.sample_person_two" size="mini" required>
                            {{cydProfile_unit.sample_person_two}}
                        </el-descriptions-item>
                        <el-descriptions-item label="抽样地区" prop="cydProfile_unit.sample_address" size="mini" required>
                            {{cydProfile_unit.sample_address}}
                        </el-descriptions-item>
                        <el-descriptions-item label="抽样日期" prop="cydProfile_unit.cyd_date" size="mini" required>
                            {{cydProfile_unit.cyd_date}}
                        </el-descriptions-item>
                        <el-descriptions-item label="附件链接" prop="cydProfile_unit.cyd_file_url" size="mini">
                            {{cydProfile_unit.cyd_file_url}}
                        </el-descriptions-item>
                         <el-descriptions-item label="抽样单备注" prop="cydProfile_unit.cyd_log" size="mini">
                            {{cydProfile_unit.cyd_log}}
                        </el-descriptions-item>
                    </el-descriptions>
                </el-descriptions-item>
            </el-descriptions>
            <!-- 抽样单位信息 -->
                <el-descriptions :column="1" border style="" >
                    <el-descriptions-item label="抽样单位信息" >
                        <el-descriptions  :column="1" border  size="mini" style="width:100%">
                                <el-descriptions-item label="抽样单状态" prop="cyd_data.cyd_status" style="width:200px" class="labelItem" size="mini" required >
                                    {{cyd_data.cyd_status}}
                                </el-descriptions-item>
                                <el-descriptions-item label="单位名称" prop="taskProfile_unit.sampleOrgId.name" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.name}}
                                </el-descriptions-item>
                                <el-descriptions-item label="单位别名" prop="taskProfile_unit.sampleOrgId.name_other" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.name_other}}
                                </el-descriptions-item>
                                <el-descriptions-item label="组别" prop="taskProfile_unit.sampleOrgId.groupname" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.groupname}}
                                </el-descriptions-item>
                                <el-descriptions-item label="机构性质" prop="taskProfile_unit.sampleOrgId.properties" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.properties}}
                                </el-descriptions-item>
                                <el-descriptions-item label="联系人" prop="taskProfile_unit.sampleOrgId.contact_name" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.contact_name}}
                                </el-descriptions-item>
                                <el-descriptions-item label="联系电话" prop="taskProfile_unit.sampleOrgId.contact_phone" style="width:200px" class="labelItem" size="mini" required >
                                    {{taskProfile_unit.sampleOrgId.contact_phone}}
                                </el-descriptions-item>
                        </el-descriptions>
                    </el-descriptions-item>
                </el-descriptions>
            <!-- 受检单位情况 -->
            <el-descriptions :column="1" border style="" >
                <el-descriptions-item label="受检单位信息" >
                    <el-descriptions  :column="1" border  size="mini" style="width:100%;font-size:20px;">
                        <el-descriptions-item label="受检地区" prop="inspected_unit.inspected_address" size="mini" required>
                            {{inspected_unit.inspected_address}}
                        </el-descriptions-item>
                         <el-descriptions-item label="受检单位名称" prop="inspected_unit.inspected_name" size="mini" required>
                            {{inspected_unit.inspected_name}}
                        </el-descriptions-item>
                        <el-descriptions-item label="联系人" prop="inspected_unit.contact_name" size="mini" required>
                            {{inspected_unit.contact_name}}
                        </el-descriptions-item>
                        <el-descriptions-item label="联系人电话" prop="inspected_unit.contact_phone" size="mini" required>
                            {{inspected_unit.contact_phone}}
                        </el-descriptions-item>
                        <el-descriptions-item label="联系人邮箱" prop="inspected_unit.contact_email" size="mini" required>
                            {{inspected_unit.contact_email}}
                        </el-descriptions-item>
                    </el-descriptions>
                </el-descriptions-item>
            </el-descriptions>
            <!-- 样品信息 -->
                <el-descriptions id="sampleInfo" :column="1" border style="">
                    <el-descriptions-item label="样品信息">
                        <el-descriptions  :column="1" border size="mini" style="width:100%;margin-bottom:5px">
                            <el-descriptions-item label="抽样地点" prop="cyd_data.cydProfile.sample_address" size="mini" required>
                                {{cyd_data.cydProfile.sample_address}}
                            </el-descriptions-item>
                        </el-descriptions>
                        <!-- 样品表格区域 -->
                        <div>
                            <el-table :data="sample_unit" border stripe highlight-current-row style="width: 100%;border:1px;"
                            :row-style="rowStyle" :cell-style="cellStyle">
                                <el-table-column :key="table.label" v-for="table in tableHeader" :label="table.label"
                            :prop="table.prop" align="center" :width="table.width" :fixed="table.fixed" />
                            </el-table>
                        </div>
                    </el-descriptions-item>
                </el-descriptions>
            <!-- 备注 -->
                <el-descriptions :column="1" border style="" >
                    <el-descriptions-item label="备注" > 
                        {{cyd_data.cydProfile.cyd_log}}
                    </el-descriptions-item>
                </el-descriptions>
            </div>
        <!-- 底部按钮 -->
                <el-form>
                        <el-form-item class="btn">
                            <el-button type="primary" @click="back()">返回任务详情</el-button>
                        </el-form-item>
                    </el-form>	
                </div>
</template>

<script>
	const token = window.sessionStorage.getItem('token')
	import {
		provinceAndCityData,
		regionData,
		provinceAndCityDataPlus,
		regionDataPlus,
		CodeToText,
		TextToCode
	} from 'element-china-area-data'
	export default {
		name: 'inputSample',
		data() {
			return {
				myHeaders: {Authorization: 'bearer' + token},
				fileList: [],
				form: {},
				cyd_data: {cydProfile: '',},//抽样单信息
                cydProfile_unit:{},//抽样人员信息
                taskProfile_unit:{},//抽样单位信息
				inspected_unit: {},//受检单位信息
				sample_unit: {},//样品信息
				units: [],
				production: [],
				task_id: '',
				undertake_id: '',
				cellStyle: {
					padding: 2 + 'px'
				},
				rowStyle: {
					height: 35 + 'px'
				},
				tableHeader: [{
						label: '样品名称',
						prop: 'sample_name',
						// fixed: 'left'
                        width: 80
					},
					{
						label: '样品来源',
						prop: 'sample_source',
						width: 70
					},
					{
						label: '样品商标',
						prop: 'sample_brand',
						width: 80
					},
					{
						label: '抽样基数',
						prop: 'sample_base',
						width: 70
					},
					{
						label: '抽样数量',
						prop: 'sample_count',
						width: 80
					},
					{
						label: '抽样日期',
						prop: 'sample_md_date',
						width: 120
					},
					{
						label: '质量等级',
						prop: 'sample_quality_grade',
						width: 80
					},
					{
						label: '规格型号',
						prop: 'sample_type',
						width: 80
					},
					{
						label: '生产日期',
						prop: 'sample_md_date',
						width: 120
					},
					{
						label: '生产厂家',
						prop: 'sample_product_name',
						width: 100
					},
					{
						label: '厂家联系电话',
						prop: 'sample_product_phone',
						width: 100
					},
					{
						label: '样品备注',
						prop: 'sample_log',
						width: 100
					}
				],
			}
		},
		created() {
			this.task_id = this.$route.params.task_id
			this.task_profile_id = this.$route.params.id
			console.log(this.task_id)
			console.log(this.task_profile_id)
			this.getCyd()
		},
		methods: {

			// 获取抽样单信息
			async getCyd() {
				const result = await this.$http.post('getCyd', {
					task_profile_id: this.task_profile_id
				})
				console.log(result.data.data)
				this.cyd_data = result.data.data//抽样单信息
                 if(this.cyd_data.cyd_status == '1'){
					this.cyd_data.cyd_status = '未上报'
				}else if(this.cyd_data.cyd_status == '2'){
                    this.cyd_data.cyd_status = '已上报'
                }else if(this.cyd_data.cyd_status == '3'){
                    this.cyd_data.cyd_status = '已上报给抽样单位'
                }else if(this.cyd_data.cyd_status == '21'){
                    this.cyd_data.cyd_status = '已上报给检测单位'
                }else if(this.cyd_data.cyd_status == '22'){
                    this.cyd_data.cyd_status = '已上报给报告上传单位'
                }else{
                    this.cyd_data.cyd_status = '已上报给监管单位'
                }
                this.cydProfile_unit = result.data.data.cydProfile//抽样人员信息
                this.taskProfile_unit = result.data.data.taskProfile//抽样单位信息
				this.inspected_unit = result.data.data.inspectedUnit//受检单位信息
				this.sample_unit = result.data.data.sample//样品信息
				if(this.sample.sample_source == ''){
					this.sample.sample_source = '自产'
				}
				// this.sampleOrgId = result.data.data.taskProfile.sampleOrgId
                this.taskProfile_unit = result.data.data.taskProfile
                if(this.taskProfile_unit.sampleOrgId.properties == '1'){
                    this.taskProfile_unit.sampleOrgId.properties == '政府部门'
                }else if(this.taskProfile_unit.sampleOrgId.properties == '2'){
                    this.taskProfile_unit.sampleOrgId.properties == '事业单位'
                }else{
                    this.taskProfile_unit.sampleOrgId.properties == '企业'
                }
				console.log(this.cyd_data)
				console.log(this.inspected_unit)
				console.log(this.sample)
				console.log(this.sampleOrgId)
			},
			// 返回
			back() {
				var that = this
				console.log(that.task_id)
				this.$router.push({
					name: 'readCheckList',
					params: {
						id: that.task_id
					}
				})
			}
		},
	}
</script>

<style lang="less" scoped>
	.form {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-content: flex-start;
	}

	.el-descriptions {
		width: 80%;
		margin: auto;
	}

	/deep/ .el-descriptions__title {
		margin: auto;
		font-size: 1.25rem;
		// font-weight: 31.25rem !important;
	}
	.btn{
		margin-top:20px ;
		// float: right;
		text-align: center;
	}
	/deep/ #sampleReport{
		.el-descriptions-item__label.is-bordered-label{
		width: 12%;
		font-size: .875rem;
		}
		.el-descriptions-item__content{
			font-size: .875rem;
		}
	}

</style>
