<template>
|
<div>
|
<a-drawer
|
:title="title"
|
:visible="visible"
|
width="650"
|
@ok="handleOk"
|
@close="handleCancel"
|
>
|
|
<!--<!– 查询区域 –>-->
|
<!--<div class="table-page-search-wrapper">-->
|
<!--<a-form layout="inline" @keyup.enter.native="searchQuery">-->
|
<!--<a-row :gutter="24">-->
|
|
<!--<a-col :span="10">-->
|
<!--<a-form-item label="设备名称">-->
|
<!--<a-input placeholder="请输入设备名称" v-model="queryParam.equipmentName"></a-input>-->
|
<!--</a-form-item>-->
|
<!--</a-col>-->
|
<!--<a-col :span="8">-->
|
<!--<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">-->
|
<!--<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>-->
|
<!--<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>-->
|
<!--</span>-->
|
<!--</a-col>-->
|
|
<!--</a-row>-->
|
<!--</a-form>-->
|
<!--</div>-->
|
<!--<!– table区域-begin –>-->
|
<!--<div>-->
|
<!--<a-table-->
|
<!--size="small"-->
|
<!--bordered-->
|
<!--rowKey="equipmentId"-->
|
<!--:columns="columns1"-->
|
<!--:dataSource="dataSource1"-->
|
<!--:pagination="ipagination"-->
|
<!--:loading="loading"-->
|
<!--:scroll="{ y: 240 }"-->
|
<!--:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"-->
|
<!--@change="handleTableChange">-->
|
<!--</a-table>-->
|
<!--</div>-->
|
<!--<!– table区域-end –>-->
|
|
<a-spin :spinning="loading">
|
<!-- showLine -->
|
<a-form>
|
<a-form-item label="车间层级：">
|
<a-tree showLine ref="tree" :expandedKeys.sync="expandedKeys"
|
:treeData="treeDataSource" checkable @check="onCheck" v-model="checkedKeys"
|
@expand="onExpand">
|
</a-tree>
|
</a-form-item>
|
</a-form>
|
|
</a-spin>
|
|
|
<div class="drawer-bottom-button">
|
<a-dropdown
|
style="float: left"
|
:trigger="['click']"
|
placement="topCenter"
|
>
|
<a-menu slot="overlay">
|
<a-menu-item key="1" @click="expandAll">展开所有</a-menu-item>
|
<a-menu-item key="2" @click="closeAll">合并所有</a-menu-item>
|
<a-menu-item key="3" @click="refreshTree">刷新</a-menu-item>
|
</a-menu>
|
<a-button>
|
树操作
|
<a-icon type="up"/>
|
</a-button>
|
</a-dropdown>
|
<a-popconfirm title="确定放弃编辑？" @confirm="handleCancel" okText="确定" cancelText="取消">
|
<a-button style="margin-right: .8rem">关闭</a-button>
|
</a-popconfirm>
|
<a-button
|
@click="handleOk"
|
type="primary"
|
>确定
|
</a-button>
|
</div>
|
|
</a-drawer>
|
</div>
|
</template>
|
|
<script>
|
// import { filterObj } from '@/utils/util'
|
// import { getAction } from '@/api/manage'
|
import {
|
getAction,
|
postAction,
|
deleteAction
|
} from '@/api/manage'
|
import BaseTree from '@/views/mdc/common/BaseTree'
|
import DepartTree from '@/views/mdc/base/modules/DepartList/DepartListTree/DepartTree'
|
import { mapActions } from 'vuex'
|
|
export default {
|
name: 'SelectDeviceModal',
|
components: {
|
BaseTree, DepartTree
|
},
|
props: {
|
editDisable: {
|
type: Boolean,
|
default() {
|
return true
|
}
|
},
|
title: {
|
type: String
|
}
|
},
|
data() {
|
return {
|
cardLoading: false,
|
loading: false,
|
treeDataSource: [],
|
expandedKeys: [],
|
checkedKeys: [],
|
url: {
|
getBaseTree: '/mdc/mdcEquipment/queryTreeListByProduction'
|
},
|
dataList: [],
|
allTreeKeys: [],
|
visible: false,
|
dataSource: []
|
|
// names: [],
|
// placement: 'right',
|
// description: '',
|
// // 查询条件
|
// queryParam: {},
|
// // 表头
|
// columns1: [
|
// {
|
// title: '#',
|
// dataIndex: '',
|
// key: 'rowIndex',
|
// width: 50,
|
// align: 'center',
|
// customRender: function(t, r, index) {
|
// return parseInt(index) + 1
|
// }
|
// },
|
// {
|
// title: '设备编号',
|
// align: 'center',
|
// width: 100,
|
// dataIndex: 'equipmentId'
|
// },
|
// {
|
// title: '设备名称',
|
// align: 'center',
|
// width: 100,
|
// dataIndex: 'equipmentName'
|
// },
|
// {
|
// title: '设备类型',
|
// align: 'center',
|
// width: 100,
|
// dataIndex: 'equipmentType'
|
// },
|
// {
|
// title: '驱动类型',
|
// align: 'center',
|
// width: 100,
|
// dataIndex: 'driveType'
|
// }
|
// ],
|
// //数据集
|
// dataSource1: [],
|
// dataSource2: [],
|
// // 分页参数
|
// ipagination: {
|
// current: 1,
|
// pageSize: 10,
|
// pageSizeOptions: ['10', '20', '30'],
|
// showTotal: (total, range) => {
|
// return range[0] + '-' + range[1] + ' 共' + total + '条'
|
// },
|
// showQuickJumper: true,
|
// showSizeChanger: true,
|
// total: 0
|
// },
|
// loading: false,
|
// selectedRowKeys: [],
|
// selectedRows: [],
|
// url: {
|
// list: '/mdc/mdcEquipment/list'
|
// },
|
// activeKey: '1',
|
// isDepartType: ''
|
}
|
},
|
created() {
|
// this.loadData()
|
this.queryTreeData()
|
this.closeAll()
|
},
|
methods: {
|
...mapActions(['QueryProduction']),
|
|
onExpand(expandedKeys) {
|
this.expandedKeys = expandedKeys
|
this.autoExpandParent = false
|
},
|
|
queryTreeData() {
|
this.loading = true
|
this.cardLoading = true
|
this.QueryProduction().then(res => {
|
if (res.success) {
|
this.dataList = []
|
this.allTreeKeys = []
|
this.getTreeDataSouce(res.result)
|
this.treeDataSource = res.result
|
this.generateList(this.treeDataSource)
|
console.log('treeDataSource', this.treeDataSource)
|
this.expandedKeys = this.allTreeKeys
|
} else {
|
this.$message.warn(res.message)
|
}
|
}).finally(() => {
|
this.loading = false
|
this.cardLoading = false
|
})
|
},
|
|
generateList(data) {
|
for (let i = 0; i < data.length; i++) {
|
const node = data[i]
|
const key = node.key
|
const title = node.title
|
this.dataList.push({
|
key,
|
title: title
|
})
|
this.allTreeKeys.push(key)
|
if (node.children) {
|
this.generateList(node.children)
|
}
|
}
|
},
|
|
getTreeDataSouce(data) {
|
data.forEach(item => {
|
if (item.children && item.children.length > 0) {
|
this.getTreeDataSouce(item.children)
|
}
|
item.key = item.equipmentId ? item.equipmentId : item.key
|
item.value = item.equipmentId ? item.equipmentId : item.value
|
})
|
},
|
expandAll() {
|
this.expandedKeys = this.allTreeKeys
|
},
|
closeAll() {
|
this.expandedKeys = ['-1']
|
},
|
refreshTree() {
|
this.queryTreeData()
|
},
|
onCheck(value, obj) {
|
this.checkedKeys = value
|
console.log('obj,', obj)
|
this.deviceNodes = obj.checkedNodes.filter(item => item.data.props.equipmentId).map(item => item.data.props.equipmentId)
|
console.log(this.deviceNodes)
|
},
|
handleCancel() {
|
this.visible = false
|
},
|
handleOk() {
|
this.$emit('selectFinished', this.deviceNodes)
|
this.visible = false
|
}
|
|
// add() {
|
// this.visible = true
|
// },
|
// loadData(arg) {
|
// //加载数据 若传入参数1则加载第一页的内容
|
// if (arg === 1) {
|
// this.ipagination.current = 1
|
// }
|
// var params = this.getQueryParams()//查询条件
|
// getAction(this.url.list, params).then((res) => {
|
// if (res.success) {
|
// this.dataSource1 = res.result.records
|
// this.ipagination.total = res.result.total
|
// }
|
// })
|
// },
|
// getQueryParams() {
|
// var param = Object.assign({}, this.queryParam, this.isorter)
|
// param.field = this.getQueryField()
|
// param.pageNo = this.ipagination.current
|
// param.pageSize = this.ipagination.pageSize
|
// return filterObj(param)
|
// },
|
// getQueryField() {
|
// //TODO 字段权限控制
|
// },
|
// onSelectAll(selected, selectedRows, changeRows) {
|
// if (selected === true) {
|
// for (var a = 0; a < changeRows.length; a++) {
|
// this.dataSource2.push(changeRows[a])
|
// }
|
// } else {
|
// for (var b = 0; b < changeRows.length; b++) {
|
// this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1)
|
// }
|
// }
|
// // console.log(selected, selectedRows, changeRows);
|
// },
|
// onSelect(record, selected) {
|
// console.log(this.selectedRowKeys)
|
// if (selected === true) {
|
// this.dataSource2.push(record)
|
// } else {
|
// var index = this.dataSource2.indexOf(record)
|
// //console.log();
|
// if (index >= 0) {
|
// this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
// }
|
// }
|
// },
|
// onSelectChange(selectedRowKeys, selectedRows) {
|
// console.log('selectedRowKeys', selectedRowKeys)
|
// this.selectedRowKeys = selectedRowKeys
|
// this.selectionRows = selectedRows
|
// },
|
// onClearSelected() {
|
// this.selectedRowKeys = []
|
// this.selectionRows = []
|
// },
|
// handleDelete: function(record) {
|
// this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
// },
|
// handleTableChange(pagination, filters, sorter) {
|
// //分页、排序、筛选变化时触发
|
// console.log(sorter)
|
// //TODO 筛选
|
// if (Object.keys(sorter).length > 0) {
|
// this.isorter.column = sorter.field
|
// this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
|
// }
|
// this.ipagination = pagination
|
// this.loadData()
|
// },
|
|
|
}
|
}
|
</script>
|
<style lang="less" scoped>
|
/deep/ .ant-modal {
|
/*transform-origin: 337px 50px;*/
|
}
|
|
.ant-card-body .table-operator {
|
margin-bottom: 18px;
|
}
|
|
.ant-table-tbody .ant-table-row td {
|
padding-top: 15px;
|
padding-bottom: 15px;
|
}
|
|
.anty-row-operator button {
|
margin: 0 5px
|
}
|
|
.ant-btn-danger {
|
background-color: #ffffff
|
}
|
|
.ant-modal-cust-warp {
|
height: 100%
|
}
|
|
.ant-modal-cust-warp .ant-modal-body {
|
height: calc(100% - 110px) !important;
|
overflow-y: auto
|
}
|
|
.ant-modal-cust-warp .ant-modal-content {
|
height: 90% !important;
|
overflow-y: hidden
|
}
|
|
.drawer-bottom-button {
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
border-top: 1px solid #e8e8e8;
|
padding: 10px 16px;
|
text-align: right;
|
left: 0;
|
background: #fff;
|
border-radius: 0 0 2px 2px;
|
}
|
</style>
|
