<template>
	<div>
		<el-dialog :title="this.title" :visible.sync="dialogVisible"  :width="isType?'75%':'20%'" :before-close="handleClose">
			<div v-if="this.title=='设备供应商'">
				<el-descriptions v-if="isType"  class="margin-top" :column="3" border>
					<el-descriptions-item>
						<template slot="label">
							单位唯一编码
						</template>
						{{suppliers.companyCode|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位名称
						</template>
						{{suppliers.companyName || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位简称
						</template>
						{{suppliers.companyShortName|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位类型
						</template>
						<el-tag size="small" v-for="item in suppliers.companyType" style="margin-right: 5px;">{{item}}
						</el-tag>
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位地址
						</template>
						{{suppliers.companyAddress|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							联系人
						</template>
						{{suppliers.companyMan|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							联系电话
						</template>
						{{suppliers.companyTel|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位船真
						</template>
						{{suppliers.companyFax|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位邮箱
						</template>
						{{suppliers.companyMail|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							备注
						</template>
						{{suppliers.memo|| ''}}
					</el-descriptions-item>
				</el-descriptions>
				<span v-else><i class="el-icon-warning-outline" style="color:#E6A23C"></i> {{this.title}}已被删除</span>
			</div>
			<div v-if="this.title=='设备管理人员'||this.title=='设备维护人员'">
				<el-descriptions  v-if="isType" class="margin-top" :column="3" border>
					<el-descriptions-item>
						<template slot="label">
							所属单位
						</template>
						{{managers.companyId|| ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							人员编码
						</template>
						{{managers.code || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							人员名称
						</template>
						{{managers.name || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							人员类型
						</template>
						<el-tag size="small" v-for="mtem in managers.type" style="margin-right: 5px;">{{mtem}}
						</el-tag>
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							联系人
						</template>
						{{managers.mobile || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							联系电话
						</template>
						{{managers.tel || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							单位地址
						</template>
						{{managers.address || ''}}
					</el-descriptions-item>
					<el-descriptions-item>
						<template slot="label">
							备注
						</template>
						{{managers.memo || ''}}
					</el-descriptions-item>

				</el-descriptions>
				<span v-else><i class="el-icon-warning-outline" style="color:#E6A23C"></i> {{this.title}}已被删除</span>
			</div>


		</el-dialog>
	</div>
</template>

<script>
	import equipmentManage from '@/api/device/equipmentManage.js'
	export default {
		// props: {
		// 	cId: {
		// 		type: String,
		// 		default: ''
		// 	},
		// 	title: {
		// 		type: String,
		// 		default: ''
		// 	}
		// },
		data() {
			return {
				dialogVisible: false,
				cId:null,
				title:null,
				isType:true,
				suppliers: {},
				managers: {},
				companyTypes: [{
						name: "管理单位",
						value: 1
					},
					{
						name: "建设单位",
						value: 2
					},
					{
						name: "运维单位",
						value: 3
					},
					{
						name: "供应商",
						value: 4
					},
				],
				types: [{
						name: "管理人员",
						value: 1
					},
					{
						name: "建设人员",
						value: 2
					},
					{
						name: "运维人员",
						value: 3
					}
				]
			};
		},
		methods: {
			add(id,title){
				this.cId=id
				this.title=title
				this.dialogVisible = true
				if (this.title == "设备供应商") {
					this.getSupplier()
				} else if (this.title == '设备管理人员'||this.title=='设备维护人员') {
					this.getManager()
				}
			},
			handleClose() {
				this.dialogVisible = false
			},
			getSupplier() {
				equipmentManage.supplierId(this.cId, res => {
					if (res!=null) {
						this.isType=true
						this.suppliers = res
						console.log(this.suppliers.companyType.split(','));
						let companyType = this.suppliers.companyType.split(',')
						let companyTypeName = []
						this.companyTypes.forEach(c => {
							companyType.forEach(e => {
								if (e == c.value) {
									companyTypeName.push(c.name)
								}
							})
						})
						this.suppliers.companyType = companyTypeName
					}else{
						this.isType=false
					}
				})
			},
			getManager() {
				equipmentManage.managerId(this.cId, res => {
					if (res!=null) {
						this.isType=true
						this.managers = res
						let aType=this.managers.type.split(',')
						let aTypeName=[]
						this.types.forEach(t=>{
							aType.forEach(a=>{
								if(a==t.value){
									aTypeName.push(t.name)
								}
							})
						})
						this.managers.type=aTypeName
						equipmentManage.supplierId(this.managers.companyId, res => {
							if(res){
								this.$set(this.managers,'companyId',res.companyName)
							}
						})
					}else{
						this.isType=false
					}
				})
				
				console.log(this.managers);
			}
		}
	};
</script>

<style>
</style>
