Compare commits

..

4 Commits

13 changed files with 176 additions and 357 deletions

View File

@@ -4,10 +4,10 @@ VITE_NODE_ENV=development
VITE_DEV=true VITE_DEV=true
# 请求路径 # 请求路径
#VITE_BASE_URL='http://118.31.23.45:48080'
# VITE_BASE_URL='http://114.55.169.15:48080'
VITE_BASE_URL='http://localhost:48080' VITE_BASE_URL='http://localhost:48080'
# VITE_BASE_URL='http://47.98.161.246:48080'
# VITE_BASE_URL='http://114.55.169.15:48080'
# 上传路径 # 上传路径
VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload' VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'

View File

@@ -4,8 +4,10 @@ VITE_NODE_ENV=production
VITE_DEV=false VITE_DEV=false
# 请求路径 # 请求路径
#VITE_BASE_URL='http://47.98.161.246:48080'
VITE_BASE_URL='http://localhost:48080' VITE_BASE_URL='http://localhost:48080'
# 上传路径 # 上传路径
VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload' VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'

View File

@@ -1,5 +0,0 @@
{
"i18n-ally.localesPaths": [
"src/locales"
]
}

View File

@@ -5,8 +5,8 @@ export const createComment = (data) => {
return request.post({ return request.post({
url: '/admin-api/okr/comments/create', url: '/admin-api/okr/comments/create',
data, data,
isSubmitForm: true isSubmitForm: true,
// headers: { 'instance-id': 1016 } headers: { 'instance-id': 1016 }
}) })
} }
@@ -14,8 +14,8 @@ export const createComment = (data) => {
export const getCommentPage = (params) => { export const getCommentPage = (params) => {
return request.get({ return request.get({
url: '/admin-api/okr/comments/page', url: '/admin-api/okr/comments/page',
params params,
// headers: { 'instance-id': 1016 } headers: { 'instance-id': 1016 }
}) })
} }
@@ -27,12 +27,3 @@ export const getCommentTypeOptions = () => {
// headers: { 'instance-id': 1016 } // headers: { 'instance-id': 1016 }
}) })
} }
// 点赞评论
export const likeComment = (commentId) => {
return request.put({
url: '/admin-api/okr/comments-likes/update',
data: { commentId }
// headers: { 'instance-id': 1016 }
})
}

View File

@@ -90,21 +90,3 @@ export const updateOkrProgress = (data) => {
// headers: { 'instance-id': 1016 } // headers: { 'instance-id': 1016 }
}) })
} }
// 获取目标关系树一级节点
export const getOkrRelationTree = (params) => {
return request.get({
url: '/admin-api/okr/node/first-node',
params
// headers: { 'instance-id': 1016 }
})
}
// 获取目标关系树下级节点数据
export const getOkrRelationTreeChildren = (params) => {
return request.get({
url: '/admin-api/okr/node/node-tree',
params
// headers: { 'instance-id': 1016 }
})
}

View File

@@ -32,10 +32,9 @@
<el-form-item label="负责人" prop="leaderUserId"> <el-form-item label="负责人" prop="leaderUserId">
<el-select v-model="formData.leaderUserId" clearable placeholder="请输入负责人"> <el-select v-model="formData.leaderUserId" clearable placeholder="请输入负责人">
<el-option <el-option
v-for="item in employeeOptions" v-for="item in userList"
:key="item.id" :key="item.id"
:disabled="item.status == 1" :label="item.nickname"
:label="item.name"
:value="item.id" :value="item.id"
/> />
</el-select> </el-select>
@@ -56,26 +55,6 @@
<el-input-number v-model="formData.sort" :min="0" /> <el-input-number v-model="formData.sort" :min="0" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" :offset="0">
<el-form-item label="开通系统" prop="instanceIds">
<el-select
v-model="formData.instanceIds"
placeholder="选择开通系统"
multiple
collapse-tags
clearable
filterable
>
<el-option
v-for="item in instanceIdsOptions"
:key="item.instanceId"
:label="item.instanceName"
:disabled="item.status == 1"
:value="item.instanceId"
/>
</el-select>
</el-form-item>
</el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24" :offset="0"> <el-col :span="24" :offset="0">
@@ -94,9 +73,8 @@
<script lang="ts" name="SystemDeptForm" setup> <script lang="ts" name="SystemDeptForm" setup>
import { defaultProps, handleTree } from '@/utils/tree' import { defaultProps, handleTree } from '@/utils/tree'
import * as DeptApi from '@/api/system/dept' import * as DeptApi from '@/api/system/dept'
import { getEmployeeSimpleList } from '@/api/pers/employee' import * as UserApi from '@/api/system/user'
import { CommonStatusEnum } from '@/utils/constants' import { CommonStatusEnum } from '@/utils/constants'
import { getSimpleAppList } from '@/api/system/app'
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
@@ -112,8 +90,7 @@ const formData = ref({
sort: 1, sort: 1,
leaderUserId: undefined, leaderUserId: undefined,
status: CommonStatusEnum.ENABLE, status: CommonStatusEnum.ENABLE,
remark: undefined, remark: undefined
instanceIds: undefined
}) })
const formRules = reactive<any>({ const formRules = reactive<any>({
parentId: [{ required: true, message: '上级部门不能为空', trigger: 'blur' }], parentId: [{ required: true, message: '上级部门不能为空', trigger: 'blur' }],
@@ -127,8 +104,7 @@ const formRules = reactive<any>({
}) })
const formRef = ref() // 表单 Ref const formRef = ref() // 表单 Ref
const deptTree = ref() // 树形结构 const deptTree = ref() // 树形结构
const employeeOptions = ref<any>([]) // 用户列表 const userList = ref<UserApi.UserVO[]>([]) // 用户列表
const instanceIdsOptions = ref<any>([]) // 实例ids
/** 打开弹窗 */ /** 打开弹窗 */
const open = async (type: string, id?: number) => { const open = async (type: string, id?: number) => {
@@ -146,13 +122,7 @@ const open = async (type: string, id?: number) => {
} }
} }
// 获得用户列表 // 获得用户列表
getEmployeeSimpleList().then((data) => { userList.value = await UserApi.getSimpleUserList()
employeeOptions.value = data
})
//实例
getSimpleAppList().then((data) => {
instanceIdsOptions.value = data
})
// 获得部门树 // 获得部门树
await getTree() await getTree()
} }
@@ -193,8 +163,7 @@ const resetForm = () => {
sort: 1, sort: 1,
leaderUserId: undefined, leaderUserId: undefined,
status: CommonStatusEnum.ENABLE, status: CommonStatusEnum.ENABLE,
remark: undefined, remark: undefined
instanceIds: undefined
} }
formRef.value?.resetFields() formRef.value?.resetFields()
} }

View File

@@ -22,15 +22,8 @@
<el-table v-loading="loading" :data="list" row-key="id" default-expand-all border> <el-table v-loading="loading" :data="list" row-key="id" default-expand-all border>
<el-table-column prop="name" label="部门名称" /> <el-table-column prop="name" label="部门名称" />
<el-table-column prop="leaderUserName" label="负责人" width="120" /> <el-table-column prop="leaderUserName" label="负责人" width="120" />
<el-table-column prop="instanceNames" label="业务系统" width="200" /> <el-table-column prop="sort" label="排序" width="200" />
<el-table-column prop="sort" label="排序" width="80" /> <el-table-column prop="status" label="状态" width="100" />
<el-table-column prop="status" label="状态" width="100">
<template #default="scope">
<el-tag :type="scope.row.status == 0 ? 'success' : 'danger'">
{{ scope.row.status == 0 ? '正常' : '停用' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="创建时间" prop="createTime" width="180" :formatter="dateFormatter" /> <el-table-column label="创建时间" prop="createTime" width="180" :formatter="dateFormatter" />
<el-table-column label="操作" class-name="fixed-width" width="160"> <el-table-column label="操作" class-name="fixed-width" width="160">
<template #default="scope"> <template #default="scope">

View File

@@ -16,19 +16,10 @@
</el-row> </el-row>
<el-row> <el-row>
<el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button> <el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button>
<el-button <el-button type="warning" @click="handleEditOkr(searchForm.nodeId)">
type="warning"
v-if="currentUserId == searchForm.creatorId"
@click="handleEditOkr(searchForm.nodeId)"
>
修改当前节点 修改当前节点
</el-button> </el-button>
<el-button <el-button type="success" @click="handleUpdateProcess">更新进度</el-button>
type="success"
v-if="searchForm.executor?.includes(currentUserId)"
@click="handleUpdateProcess"
>更新进度</el-button
>
</el-row> </el-row>
</div> </div>
@@ -45,11 +36,8 @@ import DialogOkr from './DialogOkr.vue'
import { getAllNodeTree, getAllOkrPage } from '@/api/okr/okr' import { getAllNodeTree, getAllOkrPage } from '@/api/okr/okr'
import { listToTree, findNode } from '@/utils/tree' import { listToTree, findNode } from '@/utils/tree'
import { useUserStore } from '@/store/modules/user'
const message = useMessage() const message = useMessage()
const userStore = useUserStore()
const currentUserId = userStore.getUser.id
const defaultProps = { const defaultProps = {
value: 'nodeId', value: 'nodeId',
@@ -64,7 +52,9 @@ const searchForm = ref({
const peroidList = ref([]) const peroidList = ref([])
handleSearchPeroid() onMounted(() => {
handleSearchPeroid()
})
// 当前是否是叶子节点 // 当前是否是叶子节点
// 如果不是叶子节点,则表格数据不可修改 // 如果不是叶子节点,则表格数据不可修改

View File

@@ -22,7 +22,7 @@
</div> </div>
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<el-button v-if="nodeInfo.creatorId == currentUserId" link @click="emit('edit')"> <el-button link @click="emit('edit')">
<el-tooltip content="编辑" placement="top" effect="dark"> <el-tooltip content="编辑" placement="top" effect="dark">
<Icon icon="ep:edit" :size="16" /> <Icon icon="ep:edit" :size="16" />
</el-tooltip> </el-tooltip>
@@ -47,7 +47,7 @@
</div> </div>
<div class="basic-title-item"> <div class="basic-title-item">
<div class="basic-title-label">执行人</div> <div class="basic-title-label">执行人</div>
<div class="basic-title-value">{{ nodeInfo.executorName || '无' }}</div> <div class="basic-title-value">{{ nodeInfo.executorName }}</div>
</div> </div>
<div class="basic-title-item"> <div class="basic-title-item">
<div class="basic-title-label">目标数</div> <div class="basic-title-label">目标数</div>
@@ -55,7 +55,7 @@
</div> </div>
<div class="basic-title-item" style="min-width: 200px"> <div class="basic-title-item" style="min-width: 200px">
<div class="basic-title-label">总体进度</div> <div class="basic-title-label">总体进度</div>
<el-progress :percentage="parseInt(nodeInfo.progress) || 0" :stroke-width="8" /> <el-progress :percentage="nodeInfo.progress || 0" :stroke-width="8" />
</div> </div>
</div> </div>
<div class="flex detail-basic-info"> <div class="flex detail-basic-info">
@@ -72,7 +72,7 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<el-button v-if="canEdit" class="sav-btn" type="primary" @click="handleSaveProcess"> <el-button class="sav-btn" type="primary" @click="handleSaveProcess">
保存并更新 保存并更新
</el-button> </el-button>
</div> </div>
@@ -86,7 +86,7 @@
:key="item.nodeId" :key="item.nodeId"
class="border-b-1 child-item" class="border-b-1 child-item"
style="padding: 10px 5px; cursor: pointer" style="padding: 10px 5px; cursor: pointer"
@click="handleChildItem(item)" @click="handleChildItem"
> >
<div <div
class="flex justify-between items-center overflow-hidden text-16px" class="flex justify-between items-center overflow-hidden text-16px"
@@ -95,21 +95,21 @@
<div class="child-label">节点{{ item.nodeName }}</div> <div class="child-label">节点{{ item.nodeName }}</div>
<el-progress <el-progress
type="line" type="line"
:percentage="parseInt(item.progress) || 0" :percentage="item.progress || 0"
:stroke-width="6" :stroke-width="6"
style="width: 120px" style="width: 120px"
/> />
</div> </div>
<div class="ml-10px flex items-center text-13px" style="line-height: 30px"> <div class="ml-10px flex items-center text-13px" style="line-height: 30px">
<span>目标数</span> <span>目标数</span>
<span style="color: #aaa">{{ item.objectiveNum }}</span> <span style="color: #aaa">{{ item.objectiveCount }}</span>
<el-divider direction="vertical" style="margin: 0 20px" /> <el-divider direction="vertical" style="margin: 0 20px" />
<div <div
class="flex-1 overflow-hidden h-30px" class="flex-1 overflow-hidden h-30px"
style="text-overflow: ellipsis; white-space: nowrap" style="text-overflow: ellipsis; white-space: nowrap"
> >
<span>执行人</span> <span>执行人</span>
<span style="color: #aaa">{{ item.executorName || '无' }}</span> <span style="color: #aaa">{{ item.executorName }}</span>
</div> </div>
</div> </div>
<div <div
@@ -160,7 +160,7 @@
/> />
</div> </div>
<div <div
v-for="(it, index) in commentList" v-for="it in commentList"
:key="it.commentId" :key="it.commentId"
class="border-b-1" class="border-b-1"
style="padding: 10px 5px" style="padding: 10px 5px"
@@ -179,42 +179,28 @@
" "
fit="fill" fit="fill"
> >
<span class="text-12px">{{ it.creatorName.slice(-2) }}</span> <span class="text-12px">{{ it.creatorName }}</span>
</el-avatar> </el-avatar>
<div class="ml-10px text-16px">{{ it.creatorName }}</div> <div class="ml-10px text-16px">{{ it.creatorName }}</div>
</div> </div>
<div class="ml-10px text-13px text-gray-400">{{ it.createTime }}</div>
</div> </div>
<div class="ml-10px" v-dompurify-html="it.content"></div> <div class="ml-10px" v-dompurify-html="it.content"></div>
<div <div
class="ml-10px mt-10px flex items-center justify-between text-12px" class="ml-10px mt-10px flex items-center text-12px"
style="line-height: 20px; color: #aaa" style="line-height: 20px; color: #aaa"
> >
<div class="flex items-center">
<div class="flex items-center mr-50px"> <div class="flex items-center mr-50px">
<el-button link @click="good(it)"> <el-button link @click="good(index)">
<Icon <Icon icon="fa:thumbs-o-up" :size="16" />
icon="fa:thumbs-o-up"
:size="16"
:color="it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'"
/>
</el-button> </el-button>
<span <span class="ml-5px">{{ it.likeCount }}</span>
class="ml-5px"
:style="{
color: it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'
}"
>{{ it.likeCount }}</span
>
</div> </div>
<div class="flex items-center mr-50px"> <div class="flex items-center mr-50px">
<el-button link @click="showComment(index)"> <el-button link @click="showComment(index)">
<Icon icon="ep:chat-dot-square" :size="16" color="#333" /> <Icon icon="ep:chat-dot-square" :size="16" />
</el-button> </el-button>
<span class="ml-5px" style="color: #333">{{ it.commentCount }}</span> <span class="ml-5px">{{ it.commentCount }}</span>
</div>
</div>
<div class="ml-10px text-13px text-gray-400">
{{ formatDate(it.createTime, 'YYYY-MM-DD HH:mm') }}
</div> </div>
</div> </div>
<!-- 评论 --> <!-- 评论 -->
@@ -224,19 +210,22 @@
style="margin: 10px 10px 0 10px; border-radius: 4px" style="margin: 10px 10px 0 10px; border-radius: 4px"
label="评论" label="评论"
> >
<div <div class="text-14px" style="line-height: 24px">
v-for="subComment in it.children.sort((a, b) => a.createTime - b.createTime)" <span class="font-bold">武大郎</span>
:key="subComment.commentId"
class="text-14px"
style="line-height: 24px"
>
<span class="font-bold">{{ subComment.creatorName }}</span>
<span> <span>
{{ subComment.content }} 大官人你要脆饼不要卖完最后一个我要回家了我家婆娘熬了鸡汤给我补身子
</span> </span>
</div> </div>
<div class="text-14px" style="line-height: 24px">
<span class="font-bold">潘金莲</span>
<span>西门大官人我要给你生猴子(^_-)</span>
</div>
<div class="text-14px" style="line-height: 24px">
<span class="font-bold">武二郎</span>
<span>如同天上降魔主真乃人间太岁</span>
</div>
<div class="mt-10px relative"> <div class="mt-10px relative">
<!-- <el-input <el-input
v-model="form.commentValue" v-model="form.commentValue"
placeholder="请输入评论" placeholder="请输入评论"
type="textarea" type="textarea"
@@ -244,30 +233,12 @@
clearable clearable
size="small" size="small"
style="width: 100%" style="width: 100%"
/> --> />
<el-mention
v-model="form.commentValue"
type="textarea"
:autosize="{ minRows: 4 }"
:options="employeeOptions"
style="width: 100%"
size="small"
whole
placeholder="请输入评论"
@select="handleMention"
>
<template #label="{ item }">
<div class="flex items-center justify-between h-full">
<span class="text-14px text-dark-700">{{ item.name }}</span>
<span class="text-12px text-gray-400">{{ item.dept }}</span>
</div>
</template>
</el-mention>
<el-button <el-button
type="primary" type="primary"
size="small" size="small"
style="position: absolute; right: 2px; bottom: 2px" style="position: absolute; right: 2px; bottom: 2px"
@click="handleSendCommnet(index)" @click="handleSendCommnet"
> >
发布 发布
</el-button> </el-button>
@@ -306,19 +277,8 @@ import { formatDate } from '@/utils/formatTime'
import OkrTable from './OkrTable.vue' import OkrTable from './OkrTable.vue'
import { getOkrNodeDetail, getOkrNodeHistory } from '@/api/okr/okr' import { getOkrNodeDetail, getOkrNodeHistory } from '@/api/okr/okr'
import { import { getCommentTypeOptions, createComment, getCommentPage } from '@/api/okr/comment'
getCommentTypeOptions,
createComment,
getCommentPage,
likeComment
} from '@/api/okr/comment'
import { listToTree } from '@/utils/tree'
import { getEmployeeSimpleList } from '@/api/pers/employee'
import { useUserStore } from '@/store/modules/user'
const message = useMessage()
const userStore = useUserStore()
const currentUserId = userStore.getUser.id
const emit = defineEmits(['edit']) const emit = defineEmits(['edit'])
const show = ref(false) const show = ref(false)
@@ -351,7 +311,7 @@ const nodeInfo = ref({})
const nodeRecords = ref([]) const nodeRecords = ref([])
const commentTypeOptions = ref([]) const commentTypeOptions = ref([])
function open(curNode) { async function open(curNode) {
canEdit.value = curNode.canEdit canEdit.value = curNode.canEdit
nodeInfo.value.nodeId = curNode.nodeId nodeInfo.value.nodeId = curNode.nodeId
// 获取数据详情 // 获取数据详情
@@ -359,17 +319,10 @@ function open(curNode) {
show.value = true show.value = true
} }
const employeeOptions = ref([])
function searchInfo(curNode) { function searchInfo(curNode) {
try { try {
getOkrNodeDetail(curNode.nodeId).then((resp) => { getOkrNodeDetail(curNode.nodeId).then((resp) => {
nodeInfo.value = { nodeInfo.value = resp
...resp,
executor: resp.executor || []
}
canEdit.value =
canEdit.value && currentUserId == nodeInfo.value.executor.includes(currentUserId)
if (resp.objectives) { if (resp.objectives) {
okrList.value = resp.objectives.map((item) => ({ okrList.value = resp.objectives.map((item) => ({
...item, ...item,
@@ -386,13 +339,6 @@ function searchInfo(curNode) {
getOkrNodeHistory(curNode.nodeId).then((resp) => { getOkrNodeHistory(curNode.nodeId).then((resp) => {
nodeRecords.value = resp nodeRecords.value = resp
}) })
getEmployeeSimpleList({ status: 0 }).then((resp) => {
employeeOptions.value = resp.map((item) => ({
...item,
label: item.name,
value: item.name
}))
})
getCommentTypeOptions().then((resp) => { getCommentTypeOptions().then((resp) => {
commentTypeOptions.value = resp commentTypeOptions.value = resp
}) })
@@ -407,10 +353,6 @@ function close() {
defineExpose({ open, close }) defineExpose({ open, close })
function handleMention(item) {
form.value.mentionedUserIdList.push(item.id)
}
function handleSaveProcess() { function handleSaveProcess() {
okrTableRef.value.updateProcess(nodeInfo.value.nodeId).then(() => { okrTableRef.value.updateProcess(nodeInfo.value.nodeId).then(() => {
message.success('更新成功') message.success('更新成功')
@@ -418,18 +360,14 @@ function handleSaveProcess() {
}) })
} }
function handleChildItem(item) { function handleChildItem() {
const arr = item.executor || [] console.log('handleChildItem')
const isExecutor = arr.includes(currentUserId)
canEdit.value = isExecutor && (!item.children || item.children.length == 0)
searchInfo(item)
} }
const addNewComment = ref(false) const addNewComment = ref(false)
const form = ref({ const form = ref({
commentValue: '', commentValue: '',
commentType: undefined, commentType: undefined
mentionedUserIdList: []
}) })
function handleInsertComment() { function handleInsertComment() {
addNewComment.value = true addNewComment.value = true
@@ -463,14 +401,10 @@ function handleSaveComment() {
content: form.value.commentValue, content: form.value.commentValue,
mentionedUserIdList: form.value.mentionedUserIdList mentionedUserIdList: form.value.mentionedUserIdList
} }
createComment(data) createComment(data).then(() => {
.then(() => {
message.success('评论成功') message.success('评论成功')
searchCommentList() searchCommentList()
}) })
.finally(() => {
form.value.commentValue = ''
})
} catch (error) { } catch (error) {
message.error('评论失败') message.error('评论失败')
} }
@@ -482,21 +416,14 @@ function searchCommentList() {
businessType: 1, businessType: 1,
businessId: nodeInfo.value.nodeId, businessId: nodeInfo.value.nodeId,
pageNum: 1, pageNum: 1,
pageSize: -1 pageSize: 100
}).then((resp) => { }).then((resp) => {
commentList.value = listToTree(resp.list, { commentList.value = resp.list
id: 'commentId',
pid: 'parentId',
children: 'children'
})
}) })
} }
function good(item) { function good(index) {
likeComment(item.commentId).then(() => { console.log(index)
message.success('点赞成功')
searchCommentList()
})
} }
const showCommentIndex = ref(-1) const showCommentIndex = ref(-1)
@@ -504,37 +431,8 @@ function showComment(index) {
showCommentIndex.value = showCommentIndex.value == index ? -1 : index showCommentIndex.value = showCommentIndex.value == index ? -1 : index
} }
function handleSendCommnet(idx) { function handleSendCommnet() {
try { console.log(form.value.commentValue)
// 过滤掉删除的用户方式为遍历mentionedUserIdList查找评论中是否有对应的用户名
const userList = [...form.value.mentionedUserIdList]
const arr = []
userList.map((item) => {
if (form.value.commentValue.indexOf(`@${item.name}`) != -1) {
arr.push(item.id)
// 然后移除对应的用户名,防止有多个
form.value.commentValue = form.value.commentValue.replace(`@${item.name}`, '')
}
})
const data = {
businessType: 1,
businessId: nodeInfo.value.nodeId,
contentType: 1,
content: form.value.commentValue,
mentionedUserIdList: arr,
parentId: commentList.value[idx].commentId
}
createComment(data)
.then(() => {
message.success('评论成功')
searchCommentList()
})
.finally(() => {
form.value.commentValue = ''
})
} catch (error) {
message.error('评论失败')
}
} }
</script> </script>

View File

@@ -237,7 +237,7 @@ const rules = ref({
const followList = ref([]) const followList = ref([])
function open(type, id) { async function open(type, id) {
show.value = true show.value = true
title.value = { create: '新增待办', update: '修改待办', do: '更新待办进度' }[type] title.value = { create: '新增待办', update: '修改待办', do: '更新待办进度' }[type]
formType.value = type formType.value = type

View File

@@ -13,12 +13,11 @@
/> />
</el-row> </el-row>
<el-row> <el-row>
<el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button>
<el-button type="success" @click="handleUpdateProcess">更新进度</el-button> <el-button type="success" @click="handleUpdateProcess">更新进度</el-button>
</el-row> </el-row>
</div> </div>
<OkrTable ref="okrTableRef" canEdit /> <OkrTable ref="okrTableRef" @row-click="handleShowOkr" />
<DialogOkr ref="dialogOkr" @edit="handleEditOkr" /> <DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
<DialogOkrInfo ref="dialogOkrInfo" /> <DialogOkrInfo ref="dialogOkrInfo" />
</div> </div>
@@ -47,11 +46,11 @@ const searchForm = ref({
const peroidList = ref([]) const peroidList = ref([])
// onMounted(() => { onMounted(() => {
handleSearchPeroid() handleSearchPeroid()
// }) })
function handleSearchPeroid() { async function handleSearchPeroid() {
getMyNodeTree().then((resp) => { getMyNodeTree().then((resp) => {
peroidList.value = listToTree(resp.tree, { peroidList.value = listToTree(resp.tree, {
id: 'nodeId', id: 'nodeId',
@@ -63,7 +62,7 @@ function handleSearchPeroid() {
}) })
} }
function getOkrList() { async function getOkrList() {
getMyOkrPage(searchForm.value).then((resp) => { getMyOkrPage(searchForm.value).then((resp) => {
const list = resp const list = resp
nextTick(() => { nextTick(() => {
@@ -83,18 +82,13 @@ function handleEditOkr() {
} }
function handleUpdateProcess() { function handleUpdateProcess() {
okrTableRef.value.updateProcess(searchForm.value.nodeId).then(() => { message.success('更新进度成功')
message.success('更新成功')
getOkrList() getOkrList()
})
} }
const dialogOkr = ref(null) const dialogOkr = ref(null)
function handleShowOkr(id) { function handleShowOkr(row) {
dialogOkr.value.open({ dialogOkr.value.open(row.id)
nodeId: id,
canEdit: true
})
} }
</script> </script>

View File

@@ -6,7 +6,7 @@
<div class="flex items-center border-1px w-300px h-32px p-10px peroid-select"> <div class="flex items-center border-1px w-300px h-32px p-10px peroid-select">
<Icon icon="ep:calendar" style="color: #aaa" /> <Icon icon="ep:calendar" style="color: #aaa" />
<span class="text-14px ml-10px" style="color: #aaa"> <span class="text-14px ml-10px" style="color: #aaa">
{{ searchForm.nodeName ? searchForm.nodeName : '选择周期' }} {{ searchForm.peroidName ? searchForm.peroidName : '选择周期' }}
</span> </span>
</div> </div>
</template> </template>
@@ -15,13 +15,11 @@
<el-table :data="peroidList" @row-click="handleSelectPeroid"> <el-table :data="peroidList" @row-click="handleSelectPeroid">
<el-table-column label="节点名称"> <el-table-column label="节点名称">
<template #default="{ row }"> <template #default="{ row }">
<el-radio v-model="searchForm.nodeId" :label="row.nodeId">{{ <el-radio v-model="searchForm.peroidId" :label="row.id">{{ row.name }}</el-radio>
row.nodeName
}}</el-radio>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="开始日期" prop="startTime" width="120" /> <el-table-column label="开始日期" prop="startDate" width="120" />
<el-table-column label="截止日期" prop="endTime" width="120" /> <el-table-column label="截止日期" prop="endDate" width="120" />
</el-table> </el-table>
</div> </div>
</div> </div>
@@ -29,13 +27,7 @@
<el-button class="ml-10px" type="primary" @click="handleAddNode">新建节点</el-button> <el-button class="ml-10px" type="primary" @click="handleAddNode">新建节点</el-button>
</div> </div>
<vue3-tree-org <vue3-tree-org :data="dataList" center collapsable @on-node-click="handleClickNode">
:data="dataList"
center
collapsable
:props="treeProps"
@on-node-click="handleClickNode"
>
<template #default="{ node }"> <template #default="{ node }">
<div style="cursor: pointer"> <div style="cursor: pointer">
<div class="tree-org-node__text node-label"> <div class="tree-org-node__text node-label">
@@ -43,19 +35,15 @@
<template #reference> <template #reference>
<div> <div>
<div style="max-height: 40px; overflow: hidden">{{ node.label }}</div> <div style="max-height: 40px; overflow: hidden">{{ node.label }}</div>
<div class="tip"> 目标数 {{ getNodePropData(node.id, 'objectiveNum') }}</div> <div class="tip"> 目标数 3</div>
<!-- 执行人 -->
<div class="tip">
执行人 {{ getNodePropData(node.id, 'executorName') || '无' }}
</div>
</div> </div>
</template> </template>
<template #default> <template #default>
<div style="font-size: 0.875rem; line-height: 1.5"> <div style="font-size: 0.875rem; line-height: 1.5">
<div v-for="i in getNodePropData(node.id, 'objectives')" :key="i.id" class="mt-5"> <div v-for="i in 3" :key="i" class="mt-5">
<span style="color: #aaa">{{ parseInt(i.progress) }}%</span> <span style="color: #aaa">0%</span>
<span style="margin-left: 0.5rem"> <span style="margin-left: 0.5rem">
{{ i.objectiveName }} 成交数达到10个且订单的利润不能低于成交价的30%
</span> </span>
</div> </div>
</div> </div>
@@ -63,12 +51,7 @@
</el-popover> </el-popover>
</div> </div>
<div class="p-5px"> <div class="p-5px">
<el-progress <el-progress type="line" :percentage="80" text-inside :stroke-width="12" />
type="line"
:percentage="parseInt(getNodePropData(node.id, 'progress')) || 0"
text-inside
:stroke-width="12"
/>
</div> </div>
</div> </div>
</template> </template>
@@ -84,69 +67,95 @@ import 'vue3-tree-org/lib/vue3-tree-org.css'
import DialogOkr from './DialogOkr.vue' import DialogOkr from './DialogOkr.vue'
import DialogOkrInfo from './DialogOkrInfo.vue' import DialogOkrInfo from './DialogOkrInfo.vue'
import { getOkrRelationTree, getOkrRelationTreeChildren } from '@/api/okr/okr' const dataList = ref({
import { listToTree } from '@/utils/tree' id: 1,
label: '寻驾全年目标',
const dataList = ref({}) noDragging: true,
const helpDataList = ref([]) disabled: true,
const treeProps = { children: [
children: 'children', {
label: 'nodeName', id: 2,
id: 'nodeId', pid: 1,
pid: 'parentId' label: '1月',
} noDragging: true,
disabled: true,
children: [
{ id: 6, pid: 2, label: '第一周', noDragging: true, disabled: true },
{ id: 8, pid: 2, label: '第二周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第三周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第四周', noDragging: true, disabled: true }
]
},
{
id: 3,
pid: 1,
label: '2月',
noDragging: true,
disabled: true,
children: [
{ id: 6, pid: 2, label: '第一周', noDragging: true, disabled: true },
{ id: 8, pid: 2, label: '第二周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第三周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第四周', noDragging: true, disabled: true }
]
},
{
id: 4,
pid: 1,
label: '3月',
noDragging: true,
disabled: true,
children: [
{ id: 6, pid: 2, label: '第一周', noDragging: true, disabled: true },
{ id: 8, pid: 2, label: '第二周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第三周', noDragging: true, disabled: true },
{ id: 10, pid: 2, label: '第四周', noDragging: true, disabled: true }
]
}
]
})
const searchForm = ref({ const searchForm = ref({
nodeName: '', peroidName: '',
nodeId: null peroidId: null
}) })
const peroidList = ref([]) const peroidList = ref([])
handleSearchPeroid() onMounted(() => {
handleSearchPeroid()
function handleSearchPeroid() { if (!searchForm.value.peroidId && peroidList.value.length) {
getOkrRelationTree().then((resp) => { searchForm.value.peroidId = peroidList.value[0].id
peroidList.value = resp searchForm.value.peroidName = peroidList.value[0].name
if (resp && resp.length && !searchForm.value.nodeId) {
searchForm.value.nodeId = resp[0].nodeId
searchForm.value.nodeName = resp[0].nodeName
getOkrList()
} }
}) handleSearchOkr()
} })
function getOkrList() { async function handleSearchPeroid() {
getOkrRelationTreeChildren({ peroidList.value = [
nodeId: searchForm.value.nodeId {
}).then((resp) => { id: 1,
const tree = listToTree(resp, { name: '2025年寻驾okr',
id: 'nodeId', startDate: '2022-01-01',
pid: 'parentId', endDate: '2022-01-31'
children: 'children' },
}) {
helpDataList.value = resp id: 2,
if (tree && tree.length) { name: '2024年寻驾okr',
dataList.value = tree[0] startDate: '2022-02-01',
} else { endDate: '2022-02-28'
dataList.value = {}
} }
}) ]
} }
function handleSelectPeroid(row) { function handleSelectPeroid(row) {
searchForm.value.nodeName = row.nodeName searchForm.value.peroidName = row.name
searchForm.value.nodeId = row.nodeId searchForm.value.peroidId = row.id
getOkrList() handleSearchOkr()
} }
function getNodePropData(nodeId, prop) { function handleSearchOkr() {
const nodeData = helpDataList.value.find((it) => it.nodeId == nodeId) console.log(searchForm.value)
if (nodeData) {
return nodeData[prop]
} else {
return ''
}
} }
function toggleExpand(data, val) { function toggleExpand(data, val) {
@@ -168,23 +177,19 @@ function toggleExpand(data, val) {
toggleExpand(dataList.value, true) toggleExpand(dataList.value, true)
const dialogOkr = ref(null) const dialogOkr = ref(null)
const clickNode = ref(null) const okrId = ref(null)
function handleClickNode(node, data) { function handleClickNode(node, data) {
clickNode.value = data okrId.value = data.id
openOkr() openOkr()
} }
function openOkr() { function openOkr() {
clickNode.value && okrId.value && dialogOkr.value.open(okrId.value)
dialogOkr.value.open({
nodeId: clickNode.value.nodeId,
canEdit: !clickNode.value.children || clickNode.value.children.length == 0
})
} }
const dialogOkrInfo = ref(null) const dialogOkrInfo = ref(null)
function handleAddNode() { function handleAddNode() {
clickNode.value = null okrId.value = null
dialogOkrInfo.value.open('create', null) dialogOkrInfo.value.open('create', null)
} }

View File

@@ -50,7 +50,7 @@
</el-table-column> </el-table-column>
<el-table-column prop="progress" label="进度" width="200px"> <el-table-column prop="progress" label="进度" width="200px">
<template #default="{ row }"> <template #default="{ row }">
<el-progress :percentage="parseInt(row.progress) || 0" /> <el-progress :percentage="row.progress || 0" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="executorName" label="执行人" width="200px" /> <el-table-column prop="executorName" label="执行人" width="200px" />