main
parent
74efe8409f
commit
f93e1f7187
@ -0,0 +1,94 @@ |
||||
<template> |
||||
<div> |
||||
<div class="flex items-center justify-between"> |
||||
<el-row> |
||||
<el-tree-select |
||||
v-model="searchForm.nodeId" |
||||
:data="peroidList" |
||||
:props="defaultProps" |
||||
:render-after-expand="false" |
||||
:default-expand-all="false" |
||||
style="width: 400px" |
||||
@change="getOkrList" |
||||
/> |
||||
</el-row> |
||||
<el-row> |
||||
<el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button> |
||||
</el-row> |
||||
</div> |
||||
|
||||
<OkrTable ref="okrTableRef" canEdit /> |
||||
<DialogOkr ref="dialogOkr" @edit="handleEditOkr" /> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup name="MyDuty"> |
||||
import OkrTable from './OkrTable.vue' |
||||
import DialogOkr from './DialogOkr.vue' |
||||
import { listToTree } from '@/utils/tree' |
||||
|
||||
import { getMySonNodeTree, getMySonOkrPage } from '@/api/okr/okr' |
||||
|
||||
const props = defineProps({ |
||||
userId: { |
||||
type: Number, |
||||
default: undefined |
||||
} |
||||
}) |
||||
|
||||
const defaultProps = { |
||||
value: 'nodeId', |
||||
label: 'nodeName', |
||||
children: 'children' |
||||
} |
||||
|
||||
const okrTableRef = ref(null) |
||||
const searchForm = ref({ |
||||
nodeId: undefined |
||||
}) |
||||
|
||||
const peroidList = ref([]) |
||||
|
||||
handleSearchPeroid() |
||||
|
||||
function handleSearchPeroid() { |
||||
getMySonNodeTree({ userId: props.userId }).then((resp) => { |
||||
peroidList.value = listToTree(resp.tree, { |
||||
id: 'nodeId', |
||||
pid: 'parentId', |
||||
children: 'children' |
||||
}) |
||||
searchForm.value.nodeId = resp.nodeId |
||||
getOkrList() |
||||
}) |
||||
} |
||||
|
||||
function getOkrList() { |
||||
getMySonOkrPage({ |
||||
...searchForm.value, |
||||
userId: props.userId |
||||
}).then((resp) => { |
||||
const list = resp |
||||
nextTick(() => { |
||||
okrTableRef.value.prepareData(list) |
||||
}) |
||||
}) |
||||
} |
||||
|
||||
const dialogOkr = ref(null) |
||||
function handleShowOkr(id) { |
||||
dialogOkr.value.open({ |
||||
nodeId: id, |
||||
canEdit: true, |
||||
queryType: 1 |
||||
}) |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
:deep(.el-overlay-dialog) { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
</style> |
Loading…
Reference in new issue