qsh 4 weeks ago
parent 126853ad45
commit cd3a39fa47
  1. 9
      src/api/okr/okr.js
  2. 9
      src/styles/index.scss
  3. 9
      src/views/Home/Index.vue
  4. 381
      src/views/OKR/Analysis/index.vue
  5. 19
      src/views/OKR/Management/Components/DialogOkr.vue
  6. 9
      src/views/OKR/Management/Components/DialogOkrInfo.vue
  7. 14
      src/views/OKR/Wait/index.vue

@ -143,3 +143,12 @@ export const getChannelOptions = () => {
// headers: { 'instance-id': 1016 } // headers: { 'instance-id': 1016 }
}) })
} }
// 获取统计表中的合计信息
export const getOkrStatisticsTotal = (params) => {
return request.get({
url: '/admin-api/okr/node/data/count',
params
// headers: { 'instance-id': 1016 }
})
}

@ -108,3 +108,12 @@
.el-input__inner[type='number'] { .el-input__inner[type='number'] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }
.el-drawer__header {
padding: 16px 16px 8px 16px !important;
margin: 0 !important;
line-height: 24px !important;
font-size: 18px !important;
color: #303133 !important;
box-sizing: border-box !important;
// border-bottom: 1px solid #e8e8e8 !important;
}

@ -111,8 +111,8 @@
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span>跟进榜Top10</span> <span>跟进榜Top10</span>
<el-radio-group v-model="followDate" size="small" @change="getFollowList"> <el-radio-group v-model="followDate" size="small" @change="getFollowList">
<el-radio :label="1">本日</el-radio> <el-radio :label="1" :value="1">本日</el-radio>
<el-radio :label="2">本月</el-radio> <el-radio :label="2" :value="2">本月</el-radio>
</el-radio-group> </el-radio-group>
</div> </div>
</template> </template>
@ -272,10 +272,7 @@ function getSignList() {
} }
function getWaitTargetCount() { function getWaitTargetCount() {
getWaitCount({ getWaitCount({}).then((res) => {
title: searchForm.value.title,
priority: searchForm.value.priority
}).then((res) => {
waitCount.value = res waitCount.value = res
}) })
} }

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<el-row class="mb-10px"> <el-row class="mb-10px flex justify-between items-start">
<el-tree-select <el-tree-select
v-model="searchForm.nodeId" v-model="searchForm.nodeId"
:data="peroidList" :data="peroidList"
@ -8,12 +8,45 @@
:render-after-expand="false" :render-after-expand="false"
:default-expand-all="false" :default-expand-all="false"
check-strictly check-strictly
style="width: 400px" style="width: 300px"
@change="nodeChange" @change="nodeChange"
/> />
<div class="flex justify-end flex-1">
<el-popover
ref="countRef"
placement="left"
:title="`${currentNode?.nodeName} 数据汇总`"
trigger="click"
width="500px"
v-model:visible="showCountPop"
>
<template #reference><el-button>数据汇总</el-button></template>
<el-table :data="countInfo" stripe>
<el-table-column prop="keyResultShowName" label="项目名称" />
<el-table-column prop="currentValue" label="当前值" width="90" />
<el-table-column prop="targetValue" label="预期值" width="90" />
<el-table-column label="完成度" width="150">
<template #default="{ row }">
<el-progress
:percentage="parseInt((row.currentValue / row.targetValue) * 100) || 0"
:color="customColors"
/>
</template>
</el-table-column>
</el-table>
</el-popover>
<el-button type="primary" @click="openDrawer(1, currentNode.nodeId, currentNode.nodeName)">
节点笔谈
</el-button>
</div>
</el-row> </el-row>
<el-table :data="originList" border :span-method="objectSpanMethod"> <el-table
:data="originList"
border
:span-method="objectSpanMethod"
@cell-click="handleClickCell"
>
<el-table-column prop="objectInfo.objectiveName" label="目标"> <el-table-column prop="objectInfo.objectiveName" label="目标">
<template #default="{ row }"> <template #default="{ row }">
{{ row.objectInfo.objectiveName }} {{ row.objectInfo.objectiveName }}
@ -69,13 +102,178 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-drawer
v-if="showDrawer"
v-model="showDrawer"
:title="drawerTitle"
size="60vw"
direction="rtl"
append-to-body
destroy-on-close
>
<el-tabs v-model="currentType" @tab-click="searchCommentList()">
<el-tab-pane
v-for="item in commentTypeOptions"
:key="item.id"
:label="item.label"
:name="item.id"
>
<div v-if="item.id == currentType">
<div v-if="addNewComment">
<div class="flex justify-between items-center">
<div>
<el-button size="small" @click="addNewComment = false"> 取消 </el-button>
<el-button type="primary" size="small" @click="handleSaveComment">
发布
</el-button>
</div>
</div>
<div class="mt-10px" v-if="addNewComment">
<Editor
v-model:modelValue="form.commentValue"
height="300px"
:toolbarConfig="toolbarConfig"
/>
</div>
</div>
<el-button v-else type="primary" size="small" @click="handleInsertComment">
新增
</el-button>
<div
v-for="(it, index) in commentList"
:key="it.commentId"
class="border-b-1"
style="padding: 10px 5px"
>
<div
class="flex items-center justify-between overflow-hidden text-16px"
style="line-height: 30px"
>
<div class="flex items-center">
<el-avatar
shape="circle"
style="
background-color: var(--el-color-primary-light-3);
width: 30px;
height: 30px;
"
fit="fill"
>
<span class="text-12px">{{ it.creatorName.slice(-2) }}</span>
</el-avatar>
<div class="ml-10px text-16px">{{ it.creatorName }}</div>
</div>
</div>
<div class="ml-10px" v-dompurify-html="it.content"></div>
<div
class="ml-10px mt-10px flex items-center justify-between text-12px"
style="line-height: 20px; color: #aaa"
>
<div class="flex items-center">
<div class="flex items-center mr-50px">
<el-button link @click="good(it)">
<Icon
icon="fa:thumbs-o-up"
:size="16"
:color="it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'"
/>
</el-button>
<span
class="ml-5px"
:style="{
color: it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'
}"
>{{ it.likeCount }}</span
>
</div>
<div class="flex items-center mr-50px">
<el-button link @click="showChildComment(index)">
<Icon icon="ep:chat-dot-square" :size="16" color="#333" />
</el-button>
<span class="ml-5px" style="color: #333">{{ 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
v-if="showCommentIndex == index"
class="bg-gray-100 pl-10px pr-10px pt-5px pb-5px"
style="margin: 10px 10px 0 10px; border-radius: 4px"
label="笔谈"
>
<div
v-for="subComment in it.children.sort((a, b) => a.createTime - b.createTime)"
:key="subComment.commentId"
class="text-14px"
style="line-height: 24px"
>
<span class="font-bold">{{ subComment.creatorName }}</span>
<span>
{{ subComment.content }}
</span>
</div>
<div class="mt-10px relative">
<!-- <el-input
v-model="form.commentValue"
placeholder="请输入评论"
type="textarea"
:autosize="{ minRows: 4 }"
clearable
size="small"
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="scope">
<div class="flex items-center justify-between h-full">
<span class="text-14px text-dark-700">{{ scope.item.name }}</span>
<span class="text-12px text-gray-400">{{ scope.item.dept }}</span>
</div>
</template>
</el-mention>
<el-button
type="primary"
size="small"
style="position: absolute; right: 2px; bottom: 2px"
@click="handleSendCommnet(index)"
>
发布
</el-button>
</div>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
</el-drawer>
</div> </div>
</template> </template>
<script setup name="Analysis"> <script setup name="Analysis">
import { listToTree, findNode } from '@/utils/tree' import { listToTree, findNode } from '@/utils/tree'
import { getAllNodeTree, getAllOkrPage } from '@/api/okr/okr' import { formatDate } from '@/utils/formatTime'
import { getAllNodeTree, getAllOkrPage, getOkrStatisticsTotal } from '@/api/okr/okr'
import { getEmployeeSimpleList } from '@/api/pers/employee'
import { cloneDeep } from 'lodash-es' import { cloneDeep } from 'lodash-es'
import {
getCommentTypeOptions,
createComment,
getCommentPage,
likeComment
} from '@/api/okr/comment'
const message = useMessage() const message = useMessage()
const defaultProps = { const defaultProps = {
@ -88,6 +286,8 @@ const searchForm = ref({
}) })
const currentNode = ref(undefined) const currentNode = ref(undefined)
const showDrawer = ref(false)
const drawerTitle = ref('详情')
const customColors = [ const customColors = [
{ color: 'rgb(196, 86.4, 86.4)', percentage: 20 }, { color: 'rgb(196, 86.4, 86.4)', percentage: 20 },
@ -100,6 +300,7 @@ const customColors = [
const peroidList = ref([]) const peroidList = ref([])
handleSearchPeroid() handleSearchPeroid()
getOptions()
// //
// //
@ -120,11 +321,12 @@ function handleSearchPeroid() {
} }
}) })
} }
const showCountPop = ref(false)
function nodeChange(nodeId) { function nodeChange(nodeId) {
if (nodeId) { if (nodeId) {
searchForm.value.nodeId = nodeId searchForm.value.nodeId = nodeId
getOkrList() getOkrList()
getCountInfo()
currentNode.value = findNode(peroidList.value, (node) => { currentNode.value = findNode(peroidList.value, (node) => {
return node.nodeId == nodeId return node.nodeId == nodeId
}) })
@ -162,6 +364,15 @@ function getOkrList() {
}) })
} }
const countInfo = ref([])
function getCountInfo() {
getOkrStatisticsTotal({ nodeId: searchForm.value.nodeId }).then(async (resp) => {
countInfo.value = resp || []
// await nextTick(() =)
showCountPop.value = true
})
}
function objectSpanMethod({ column, rowIndex }) { function objectSpanMethod({ column, rowIndex }) {
if (['目标', '目标完成度'].includes(column.label)) { if (['目标', '目标完成度'].includes(column.label)) {
let _row = spanObj.value[rowIndex] let _row = spanObj.value[rowIndex]
@ -172,6 +383,164 @@ function objectSpanMethod({ column, rowIndex }) {
} }
} }
} }
function handleClickCell(row, column) {
if (column.property === 'keyResultShowName') {
openDrawer(2, row.keyResultId, `${row.sourceName} ${row.keyResultShowName}`)
} else if (column.property === 'objectInfo.objectiveName') {
openDrawer(3, row.objectInfo.objectiveId, row.objectInfo.objectiveName)
}
}
const commentTypeOptions = ref([])
const currentType = ref(1) // 1
function getOptions() {
getCommentTypeOptions().then((resp) => {
commentTypeOptions.value = (resp || []).sort((pre, cur) => pre.sort - cur.sort)
currentType.value = resp[0].id
})
getEmployeeSimpleList({ status: 0 }).then((resp) => {
employeeOptions.value = resp.map((item) => ({
...item,
label: item.name,
value: item.name
}))
})
}
const commentList = ref([])
const commentInfo = ref({
businessType: undefined,
businessId: undefined,
commentType: undefined,
pageSize: -1
})
function openDrawer(type, id, name) {
showDrawer.value = true
drawerTitle.value = `${name}】笔谈`
commentInfo.value = {
businessType: type,
businessId: id,
commentType: currentType.value,
pageSize: -1
}
searchCommentList()
}
function searchCommentList() {
commentInfo.value.commentType = currentType.value
getCommentPage(commentInfo.value).then((resp) => {
// commentList.value = resp.list
commentList.value = listToTree(resp.list, {
id: 'commentId',
pid: 'parentId',
children: 'children'
})
})
}
const showCommentIndex = ref(-1)
function showChildComment(index) {
showCommentIndex.value = showCommentIndex.value == index ? -1 : index
}
function good(item) {
likeComment(item.commentId).then(() => {
message.success('点赞成功')
searchCommentList()
})
}
const form = ref({
commentValue: '',
mentionedUserIdList: []
})
const employeeOptions = ref([])
function handleMention(item) {
form.value.mentionedUserIdList.push(item.id)
}
function handleSendCommnet(idx) {
try {
// 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: commentInfo.value.businessType,
businessId: commentInfo.value.businessId,
commentType: currentType.value,
content: form.value.commentValue,
mentionedUserIdList: arr,
parentId: commentList.value[idx].commentId
}
createComment(data)
.then(() => {
message.success('创建成功')
searchCommentList()
})
.finally(() => {
form.value.commentValue = ''
})
} catch (error) {
console.log(error)
message.error('创建失败')
}
}
const addNewComment = ref(false)
function handleInsertComment() {
addNewComment.value = true
form.value.commentValue = commentTypeOptions.value.find(
(item) => item.id == currentType.value
).remark
}
const toolbarConfig = {
toolbarKeys: [
'bold', //
'underline', // 线
'italic', //
'color', //
'bgColor', //
'fontSize', //
'bulletedList', //
'numberedList', //
'insertTable', //
'insertLink', //
'undo' //
]
}
function handleSaveComment() {
addNewComment.value = false
try {
const data = {
businessType: commentInfo.value.businessType,
businessId: commentInfo.value.businessId,
commentType: currentType.value,
content: form.value.commentValue,
mentionedUserIdList: form.value.mentionedUserIdList
}
createComment(data)
.then(() => {
message.success('创建成功')
searchCommentList()
})
.finally(() => {
form.value.commentValue = ''
})
} catch (error) {
message.error('创建失败')
}
}
</script> </script>
<style scoped></style> <style lang="scss" scoped></style>

@ -143,7 +143,7 @@
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="评论" name="conclusion" key="conclusion"> <el-tab-pane label="笔谈" name="conclusion" key="conclusion">
<div class="relative overflow-y-auto" style="height: calc(100% - 50px)"> <div class="relative overflow-y-auto" style="height: calc(100% - 50px)">
<div v-if="addNewComment"> <div v-if="addNewComment">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
@ -178,7 +178,7 @@
</div> </div>
</div> </div>
<el-button v-else type="primary" size="small" @click="handleInsertComment"> <el-button v-else type="primary" size="small" @click="handleInsertComment">
新增评论 新增笔谈
</el-button> </el-button>
<div <div
v-for="(it, index) in commentList" v-for="(it, index) in commentList"
@ -243,7 +243,7 @@
v-if="showCommentIndex == index" v-if="showCommentIndex == index"
class="bg-gray-100 pl-10px pr-10px pt-5px pb-5px" class="bg-gray-100 pl-10px pr-10px pt-5px pb-5px"
style="margin: 10px 10px 0 10px; border-radius: 4px" style="margin: 10px 10px 0 10px; border-radius: 4px"
label="评论" label="笔谈"
> >
<div <div
v-for="subComment in it.children.sort((a, b) => a.createTime - b.createTime)" v-for="subComment in it.children.sort((a, b) => a.createTime - b.createTime)"
@ -274,7 +274,7 @@
style="width: 100%" style="width: 100%"
size="small" size="small"
whole whole
placeholder="请输入评论" placeholder="请输入内容"
@select="handleMention" @select="handleMention"
> >
<template #label="{ item }"> <template #label="{ item }">
@ -491,20 +491,20 @@ function handleSaveComment() {
const data = { const data = {
businessType: 1, businessType: 1,
businessId: nodeInfo.value.nodeId, businessId: nodeInfo.value.nodeId,
contentType: 1, commentType: form.value.commentType,
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(() => { .finally(() => {
form.value.commentValue = '' form.value.commentValue = ''
}) })
} catch (error) { } catch (error) {
message.error('评论失败') message.error('创建失败')
} }
} }
const commentList = ref([]) const commentList = ref([])
@ -552,20 +552,21 @@ function handleSendCommnet(idx) {
businessType: 1, businessType: 1,
businessId: nodeInfo.value.nodeId, businessId: nodeInfo.value.nodeId,
contentType: 1, contentType: 1,
commentType: form.value.commentType,
content: form.value.commentValue, content: form.value.commentValue,
mentionedUserIdList: arr, mentionedUserIdList: arr,
parentId: commentList.value[idx].commentId parentId: commentList.value[idx].commentId
} }
createComment(data) createComment(data)
.then(() => { .then(() => {
message.success('评论成功') message.success('创建成功')
searchCommentList() searchCommentList()
}) })
.finally(() => { .finally(() => {
form.value.commentValue = '' form.value.commentValue = ''
}) })
} catch (error) { } catch (error) {
message.error('评论失败') message.error('创建失败')
} }
} }
</script> </script>

@ -1,7 +1,7 @@
<template> <template>
<el-dialog <el-dialog
v-model="show" v-model="show"
width="900px" width="88vw"
class="dialog-okr" class="dialog-okr"
:show-close="false" :show-close="false"
:close-on-click-modal="false" :close-on-click-modal="false"
@ -255,6 +255,10 @@
<el-option label="公开" :value="1" /> <el-option label="公开" :value="1" />
<el-option label="仅上级可见" :value="2" /> <el-option label="仅上级可见" :value="2" />
</el-select> </el-select>
<el-radio-group v-model="kr.isCount" class="ml-10px">
<el-radio :label="true" :value="true">参与统计</el-radio>
<el-radio :label="false" :value="false">不参与统计</el-radio>
</el-radio-group>
</div> </div>
</div> </div>
</div> </div>
@ -477,7 +481,8 @@ function AddKR(idx) {
process: undefined, process: undefined,
currentValue: undefined, currentValue: undefined,
executor: obj.executor, executor: obj.executor,
dataScope: obj.dataScope dataScope: obj.dataScope,
isCount: false
}) })
} }

@ -63,7 +63,7 @@
</el-badge> </el-badge>
</template> </template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane :name="4"> <!-- <el-tab-pane :name="4">
<template #label> <template #label>
<el-badge :value="tabCount.notifyNum" :max="99" :show-zero="false"> <el-badge :value="tabCount.notifyNum" :max="99" :show-zero="false">
<el-tooltip content="特指OKR中@我的消息" placement="top" effect="dark"> <el-tooltip content="特指OKR中@我的消息" placement="top" effect="dark">
@ -85,7 +85,7 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-tab-pane> </el-tab-pane> -->
</el-tabs> </el-tabs>
<el-table v-if="tabIndex != 4" :data="tableList"> <el-table v-if="tabIndex != 4" :data="tableList">
@ -243,7 +243,7 @@ function getTabCount() {
const loading = ref(false) const loading = ref(false)
const tableList = ref([]) const tableList = ref([])
const mentionedList = ref([]) // const mentionedList = ref([])
const total = ref(0) const total = ref(0)
function getList() { function getList() {
loading.value = true loading.value = true
@ -288,10 +288,10 @@ function handleNotice(row) {
}) })
} }
function handleShow(row) { // function handleShow(row) {
console.log(row) // console.log(row)
message.success('打开okr详情页') // message.success('okr')
} // }
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped></style>

Loading…
Cancel
Save