<template>
	<div class="hui-flex-box hui-flex hui-table">
		<div class="hui-content-insert">
			<el-button type="primary" size="medium" @click="insertDepartment({})">新建资产</el-button>
		</div>
		<div class="hui-flex-box">
			<el-table :data="treeData" row-key="id" border height="100%">
				<el-table-column label="资产名称" prop="name"></el-table-column>
				<el-table-column label="操作" width="240">
					<template slot-scope="scope">
						<div class="hui-table-operation">
							<span class="table-operation" @click="insertDepartment(scope.row)">
								添加子资产
							</span>
							<span class="table-operation" v-if="scope.row.children.length === 0"
								@click="model(scope.row)">
								3D模型
							</span>
							<span class="table-operation" v-if="!scope.row.isp" @click="updateDepartment(scope.row)">
								编辑
							</span>
							<span class="table-operation" v-if="!scope.row.isp" @click="deleteDepartment(scope.row)">
								删除
							</span>
						</div>
					</template>
				</el-table-column>
				<template slot="empty">
					<empty description="暂无数据"></empty>
				</template>
			</el-table>
		</div>
		<el-dialog :close-on-click-modal="false" :title="isUpdate?'编辑':'新增'" :visible.sync="visible" width="900px"
			:append-to-body="true">
			<depart-form v-if="visible" @callback="callback" :isUpdate="isUpdate" :part="part">
			</depart-form>
		</el-dialog>
		<el-dialog :close-on-click-modal="false" title="模型列表" :visible.sync="modelVisible" width="1100px"
			:append-to-body="true">
			<model-down v-if="modelVisible" :modelLevelId="nowLevel.modelLevelId" :levelId="nowLevel.id"></model-down>
		</el-dialog>
	</div>
</template>

<script>
	import {
		initDevicePartList,
		getDevicePartList,
		deleteDeviceDepartment
	} from '@/httpApi/property'
	import departForm from '@/components/work/property/departForm'
	import modelDown from '@/components/work/common/modelDown'
	export default {
		data() {
			return {
				treeData: [],
				visible: false,
				isUpdate: false,
				part: {},
				drawer: false,
				modelVisible: false,
				nowLevel: {}
			}
		},
		created() {
			this.init();
		},
		methods: {
			init() {
				getDevicePartList(this.$store.getters.organization.id, this.$store.getters.project.id).then(res => {
					if (res.state) {
						if (res.data.length === 0) {
							initDevicePartList(this.$store.getters.organization.id, this.$store.getters.project.id)
								.then(res => {
									if (res.state) {
										getDevicePartList(this.$store.getters.organization.id, this.$store
											.getters.project.id).then(res => {
											if (res.state) {
												this.treeData = res.data;
											}
										})
									}
								})
						} else {
							this.treeData = res.data;
						}
					}
				})
			},
			model(item) {
				this.nowLevel = item;
				this.modelVisible = true;
			},
			currentChange(currPage) {
				this.currPage = currPage;
				this.init();
			},
			insertDepartment(val) {
				this.part = val;
				this.visible = true;
				this.isUpdate = false;
			},
			lookFlow(val) {
				this.detailId = val.id;
				this.drawer = true;
			},
			updateDepartment(val) {
				this.part = val;
				this.isUpdate = true;
				this.visible = true;
			},
			deleteDepartment(val) {
				this.$confirm('确定要删除该资产层级?', () => {
					deleteDeviceDepartment(val.id).then(res => {
						if (res.state) {
							this.$message.success('操作成功');
							this.init();
						}
					})
				});
			},
			callback(type) {
				this.visible = false;
				if (type === 'init') this.init();
			}
		},
		components: {
			departForm,
			modelDown
		},
	}
</script>

<style lang="scss">
</style>