Compare commits
1 Commits
dev-zcx
...
65dae80239
| Author | SHA1 | Date | |
|---|---|---|---|
| 65dae80239 |
@@ -4,10 +4,10 @@ VITE_NODE_ENV=development
|
||||
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://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'
|
||||
|
||||
2
.env.dev
2
.env.dev
@@ -4,8 +4,10 @@ VITE_NODE_ENV=production
|
||||
VITE_DEV=false
|
||||
|
||||
# 请求路径
|
||||
#VITE_BASE_URL='http://47.98.161.246:48080'
|
||||
VITE_BASE_URL='http://localhost:48080'
|
||||
|
||||
|
||||
# 上传路径
|
||||
VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
|
||||
|
||||
|
||||
5
.vscode/settings.json
vendored
5
.vscode/settings.json
vendored
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"i18n-ally.localesPaths": [
|
||||
"src/locales"
|
||||
]
|
||||
}
|
||||
@@ -51,7 +51,7 @@
|
||||
"diagram-js": "^11.6.0",
|
||||
"echarts": "^5.4.2",
|
||||
"echarts-wordcloud": "^2.1.0",
|
||||
"element-plus": "2.9.4",
|
||||
"element-plus": "2.3.4",
|
||||
"fast-xml-parser": "^4.2.2",
|
||||
"highlight.js": "^11.8.0",
|
||||
"intro.js": "^7.0.1",
|
||||
|
||||
@@ -1,38 +0,0 @@
|
||||
import request from '@/config/axios'
|
||||
|
||||
// 创建
|
||||
export const createComment = (data) => {
|
||||
return request.post({
|
||||
url: '/admin-api/okr/comments/create',
|
||||
data,
|
||||
isSubmitForm: true
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 分页
|
||||
export const getCommentPage = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/comments/page',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 获取评论类型
|
||||
export const getCommentTypeOptions = () => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/dict-data/get-by-type',
|
||||
params: { dictType: 'comment_type' }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 点赞评论
|
||||
export const likeComment = (commentId) => {
|
||||
return request.put({
|
||||
url: '/admin-api/okr/comments-likes/update',
|
||||
data: { commentId }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
@@ -1,110 +0,0 @@
|
||||
import request from '@/config/axios'
|
||||
|
||||
// 创建
|
||||
export const createOkrNode = (data) => {
|
||||
return request.post({
|
||||
url: '/admin-api/okr/node/add',
|
||||
data,
|
||||
isSubmitForm: true
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 修改
|
||||
export const updateOkrNode = (data) => {
|
||||
return request.put({
|
||||
url: '/admin-api/okr/node/update',
|
||||
data
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 查询详情
|
||||
export const getOkrNodeDetail = (nodeId) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/node/get',
|
||||
params: { nodeId }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 我负责的 - 节点树
|
||||
export const getMyNodeTree = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/node/my/list',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 我负责的 - okr列表
|
||||
export const getMyOkrPage = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/node/my/object/list',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 全部目标 - 节点树
|
||||
export const getAllNodeTree = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/node/all/list',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 全部目标 - okr列表
|
||||
export const getAllOkrPage = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/node/all/object/list',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 获取节点操作历史
|
||||
export const getOkrNodeHistory = (nodeId) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/record/list',
|
||||
params: { nodeId }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 获取系统默认的关键成果内容
|
||||
export const getDefaultOkrOptions = () => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/dict-data/get-by-type',
|
||||
params: { dictType: 'key_result_source' }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 更新OKR进度
|
||||
export const updateOkrProgress = (data) => {
|
||||
return request.put({
|
||||
url: '/admin-api/okr/node/progress/update',
|
||||
data
|
||||
// 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 }
|
||||
})
|
||||
}
|
||||
@@ -1,83 +0,0 @@
|
||||
import request from '@/config/axios'
|
||||
|
||||
// 创建
|
||||
export const createWait = (data) => {
|
||||
return request.post({
|
||||
url: '/admin-api/okr/agent-work/create',
|
||||
data,
|
||||
isSubmitForm: true
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 修改
|
||||
export const updateWait = (data) => {
|
||||
return request.put({
|
||||
url: '/admin-api/okr/agent-work/update',
|
||||
data
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 分页
|
||||
export const getWaitPage = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/agent-work/page',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 详情
|
||||
export const getWaitDetail = (id) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/agent-work/get',
|
||||
params: { id }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 删除
|
||||
export const deleteWait = (id) => {
|
||||
return request.delete({
|
||||
url: '/admin-api/okr/agent-work/delete',
|
||||
params: { id }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 催办
|
||||
export const urgeWait = (workId) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/agent-work/urge',
|
||||
params: { workId }
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 跟进待办
|
||||
export const followWait = (data) => {
|
||||
return request.post({
|
||||
url: '/admin-api/okr/agent-work-follow/create',
|
||||
data,
|
||||
isSubmitForm: true
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
// 查询跟进记录
|
||||
export const getFollowWaitPage = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/agent-work-follow/list',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
|
||||
export const getWaitCount = (params) => {
|
||||
return request.get({
|
||||
url: '/admin-api/okr/agent-work/getAgentWorkNum',
|
||||
params
|
||||
// headers: { 'instance-id': 1016 }
|
||||
})
|
||||
}
|
||||
@@ -542,10 +542,10 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.second.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.second.type == '1'" label="范围">
|
||||
@@ -601,10 +601,10 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.minute.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.minute.type == '1'" label="范围">
|
||||
@@ -660,10 +660,10 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.hour.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.hour.type == '1'" label="范围">
|
||||
@@ -719,12 +719,12 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.day.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button value="4">本月最后一天</el-radio-button>
|
||||
<el-radio-button value="5">不指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
<el-radio-button label="4">本月最后一天</el-radio-button>
|
||||
<el-radio-button label="5">不指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.day.type == '1'" label="范围">
|
||||
@@ -780,10 +780,10 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.month.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.month.type == '1'" label="范围">
|
||||
@@ -840,12 +840,12 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.week.type">
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button value="4">本月最后一周</el-radio-button>
|
||||
<el-radio-button value="5">不指定</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
<el-radio-button label="4">本月最后一周</el-radio-button>
|
||||
<el-radio-button label="5">不指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.week.type == '1'" label="范围">
|
||||
@@ -919,11 +919,11 @@ const submit = () => {
|
||||
<el-form>
|
||||
<el-form-item label="类型">
|
||||
<el-radio-group v-model="cronValue.year.type">
|
||||
<el-radio-button value="-1">忽略</el-radio-button>
|
||||
<el-radio-button value="0">任意值</el-radio-button>
|
||||
<el-radio-button value="1">范围</el-radio-button>
|
||||
<el-radio-button value="2">间隔</el-radio-button>
|
||||
<el-radio-button value="3">指定</el-radio-button>
|
||||
<el-radio-button label="-1">忽略</el-radio-button>
|
||||
<el-radio-button label="0">任意值</el-radio-button>
|
||||
<el-radio-button label="1">范围</el-radio-button>
|
||||
<el-radio-button label="2">间隔</el-radio-button>
|
||||
<el-radio-button label="3">指定</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="cronValue.year.type == '1'" label="范围">
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
v-show="total > 0"
|
||||
v-model:current-page="currentPage"
|
||||
v-model:page-size="pageSize"
|
||||
:small="small"
|
||||
:background="true"
|
||||
:page-sizes="[10, 20, 50, 100, 200]"
|
||||
:pager-count="pagerCount"
|
||||
@@ -42,6 +43,10 @@ const props = defineProps({
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'total, sizes, prev, pager, next, jumper'
|
||||
},
|
||||
small: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@ import { config } from './config'
|
||||
const { default_headers } = config
|
||||
|
||||
const request = (option: any) => {
|
||||
const { url, method, params, data, headersType, responseType, isSubmitForm, headers } = option
|
||||
const { url, method, params, data, headersType, responseType, isSubmitForm } = option
|
||||
return service({
|
||||
url: url,
|
||||
method,
|
||||
@@ -14,8 +14,7 @@ const request = (option: any) => {
|
||||
data,
|
||||
responseType: responseType,
|
||||
headers: {
|
||||
'Content-Type': headersType || default_headers,
|
||||
...headers
|
||||
'Content-Type': headersType || default_headers
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
@@ -66,8 +66,7 @@ service.interceptors.request.use(
|
||||
|
||||
// 设置实例
|
||||
const appId = getAppId()
|
||||
if (appId && !(config as Recordable).headers['instance-id'])
|
||||
(config as Recordable).headers['instance-id'] = appId
|
||||
if (appId) (config as Recordable).headers['instance-id'] = appId
|
||||
|
||||
const params = config.params || {}
|
||||
const data = config.data || false
|
||||
|
||||
@@ -32,10 +32,9 @@
|
||||
<el-form-item label="负责人" prop="leaderUserId">
|
||||
<el-select v-model="formData.leaderUserId" clearable placeholder="请输入负责人">
|
||||
<el-option
|
||||
v-for="item in employeeOptions"
|
||||
v-for="item in userList"
|
||||
:key="item.id"
|
||||
:disabled="item.status == 1"
|
||||
:label="item.name"
|
||||
:label="item.nickname"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
@@ -44,8 +43,8 @@
|
||||
<el-col :span="12" :offset="0">
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="formData.status">
|
||||
<el-radio :value="0"> 启用 </el-radio>
|
||||
<el-radio :value="1"> 禁用 </el-radio>
|
||||
<el-radio :label="0"> 启用 </el-radio>
|
||||
<el-radio :label="1"> 禁用 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@@ -56,26 +55,6 @@
|
||||
<el-input-number v-model="formData.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</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 :gutter="20">
|
||||
<el-col :span="24" :offset="0">
|
||||
@@ -94,9 +73,8 @@
|
||||
<script lang="ts" name="SystemDeptForm" setup>
|
||||
import { defaultProps, handleTree } from '@/utils/tree'
|
||||
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 { getSimpleAppList } from '@/api/system/app'
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
@@ -112,8 +90,7 @@ const formData = ref({
|
||||
sort: 1,
|
||||
leaderUserId: undefined,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
remark: undefined,
|
||||
instanceIds: undefined
|
||||
remark: undefined
|
||||
})
|
||||
const formRules = reactive<any>({
|
||||
parentId: [{ required: true, message: '上级部门不能为空', trigger: 'blur' }],
|
||||
@@ -127,8 +104,7 @@ const formRules = reactive<any>({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
const deptTree = ref() // 树形结构
|
||||
const employeeOptions = ref<any>([]) // 用户列表
|
||||
const instanceIdsOptions = ref<any>([]) // 实例ids
|
||||
const userList = ref<UserApi.UserVO[]>([]) // 用户列表
|
||||
|
||||
/** 打开弹窗 */
|
||||
const open = async (type: string, id?: number) => {
|
||||
@@ -146,13 +122,7 @@ const open = async (type: string, id?: number) => {
|
||||
}
|
||||
}
|
||||
// 获得用户列表
|
||||
getEmployeeSimpleList().then((data) => {
|
||||
employeeOptions.value = data
|
||||
})
|
||||
//实例
|
||||
getSimpleAppList().then((data) => {
|
||||
instanceIdsOptions.value = data
|
||||
})
|
||||
userList.value = await UserApi.getSimpleUserList()
|
||||
// 获得部门树
|
||||
await getTree()
|
||||
}
|
||||
@@ -193,8 +163,7 @@ const resetForm = () => {
|
||||
sort: 1,
|
||||
leaderUserId: undefined,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
remark: undefined,
|
||||
instanceIds: undefined
|
||||
remark: undefined
|
||||
}
|
||||
formRef.value?.resetFields()
|
||||
}
|
||||
|
||||
@@ -22,15 +22,8 @@
|
||||
<el-table v-loading="loading" :data="list" row-key="id" default-expand-all border>
|
||||
<el-table-column prop="name" label="部门名称" />
|
||||
<el-table-column prop="leaderUserName" label="负责人" width="120" />
|
||||
<el-table-column prop="instanceNames" label="业务系统" width="200" />
|
||||
<el-table-column prop="sort" label="排序" width="80" />
|
||||
<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 prop="sort" label="排序" width="200" />
|
||||
<el-table-column prop="status" label="状态" width="100" />
|
||||
<el-table-column label="创建时间" prop="createTime" width="180" :formatter="dateFormatter" />
|
||||
<el-table-column label="操作" class-name="fixed-width" width="160">
|
||||
<template #default="scope">
|
||||
|
||||
@@ -32,9 +32,9 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单类型" prop="type">
|
||||
<el-radio-group v-model="formData.type">
|
||||
<el-radio-button :value="1"> 目录 </el-radio-button>
|
||||
<el-radio-button :value="2"> 菜单 </el-radio-button>
|
||||
<el-radio-button :value="3"> 按钮 </el-radio-button>
|
||||
<el-radio-button :label="1"> 目录 </el-radio-button>
|
||||
<el-radio-button :label="2"> 菜单 </el-radio-button>
|
||||
<el-radio-button :label="3"> 按钮 </el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="formData.type !== 3" label="菜单图标">
|
||||
@@ -69,8 +69,8 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单状态" prop="status">
|
||||
<el-radio-group v-model="formData.status">
|
||||
<el-radio :value="0"> 启用 </el-radio>
|
||||
<el-radio :value="1"> 禁用 </el-radio>
|
||||
<el-radio :label="0"> 启用 </el-radio>
|
||||
<el-radio :label="1"> 禁用 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="formData.type !== 3" label="显示状态" prop="visible">
|
||||
|
||||
@@ -16,8 +16,8 @@
|
||||
<el-col :span="12">
|
||||
<el-form-item label="用户性别">
|
||||
<el-radio-group v-model="formData.sex">
|
||||
<el-radio :value="1"> 男 </el-radio>
|
||||
<el-radio :value="2"> 女 </el-radio>
|
||||
<el-radio :label="1"> 男 </el-radio>
|
||||
<el-radio :label="2"> 女 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
@@ -17,10 +17,10 @@
|
||||
<el-col :span="12" :offset="0">
|
||||
<el-form-item label="结算方式">
|
||||
<el-radio-group v-model="formData.percentageType">
|
||||
<el-radio :value="1">
|
||||
<el-radio :label="1">
|
||||
<Tooltip message="可配置多级，命中某档位后，按照档位分级结算" />阶梯结算
|
||||
</el-radio>
|
||||
<el-radio :value="2">
|
||||
<el-radio :label="2">
|
||||
<Tooltip message="可配置多级，命中某档位后所有金额全部按照该档位结算" />常规结算
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
@@ -164,8 +164,8 @@
|
||||
<el-col :span="8" :offset="0">
|
||||
<el-form-item label="包含区域提成" labelWidth="150px">
|
||||
<el-radio-group v-model="formData.isAreaPercentage">
|
||||
<el-radio :value="true"> 是 </el-radio>
|
||||
<el-radio :value="false"> 否 </el-radio>
|
||||
<el-radio :label="true"> 是 </el-radio>
|
||||
<el-radio :label="false"> 否 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@@ -174,24 +174,24 @@
|
||||
<el-col :span="8" :offset="0">
|
||||
<el-form-item label="是否关联成交率" labelWidth="150px">
|
||||
<el-radio-group v-model="formData.isRelateSignRate">
|
||||
<el-radio :value="true"> 是 </el-radio>
|
||||
<el-radio :value="false"> 否 </el-radio>
|
||||
<el-radio :label="true"> 是 </el-radio>
|
||||
<el-radio :label="false"> 否 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="0">
|
||||
<el-form-item label="是否扣除其他支出" labelWidth="150px">
|
||||
<el-radio-group v-model="formData.isDeductExtraPay">
|
||||
<el-radio :value="true"> 是 </el-radio>
|
||||
<el-radio :value="false"> 否 </el-radio>
|
||||
<el-radio :label="true"> 是 </el-radio>
|
||||
<el-radio :label="false"> 否 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="0">
|
||||
<el-form-item label="是否扣除售后" labelWidth="150px">
|
||||
<el-radio-group v-model="formData.isDeductAfterSale">
|
||||
<el-radio :value="true"> 是 </el-radio>
|
||||
<el-radio :value="false"> 否 </el-radio>
|
||||
<el-radio :label="true"> 是 </el-radio>
|
||||
<el-radio :label="false"> 否 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
@@ -11,8 +11,8 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-radio-group v-model="searchForm.status" @change="handleQuery">
|
||||
<el-radio :value="0"> 在职 </el-radio>
|
||||
<el-radio :value="1"> 离职 </el-radio>
|
||||
<el-radio :label="0"> 在职 </el-radio>
|
||||
<el-radio :label="1"> 离职 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
||||
@@ -2,39 +2,44 @@
|
||||
<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"
|
||||
check-strictly
|
||||
style="width: 400px"
|
||||
@change="nodeChange"
|
||||
/>
|
||||
<el-popover placement="bottom" width="500px" trigger="click" @show="handleSearchPeroid">
|
||||
<template #reference>
|
||||
<div class="flex items-center border-1px w-300px h-32px p-10px peroid-select">
|
||||
<Icon icon="ep:calendar" style="color: #aaa" />
|
||||
<span class="text-14px ml-10px" style="color: #aaa">
|
||||
{{ searchForm.peroidName ? searchForm.peroidName : '选择周期' }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<div class="mt-10px" style="height: 400px">
|
||||
<el-table :data="peroidList" @row-click="handleSelectPeroid">
|
||||
<el-table-column label="节点名称">
|
||||
<template #default="{ row }">
|
||||
<el-radio v-model="searchForm.peroidId" :label="row.id">{{
|
||||
row.name
|
||||
}}</el-radio>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开始日期" prop="startDate" width="120" />
|
||||
<el-table-column label="截止日期" prop="endDate" width="120" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-button class="ml-10px" type="primary" @click="handleAddNode">新建节点</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button>
|
||||
<el-button
|
||||
type="warning"
|
||||
v-if="currentUserId == searchForm.creatorId"
|
||||
@click="handleEditOkr(searchForm.nodeId)"
|
||||
>
|
||||
<el-button type="warning" @click="handleEditOkr(searchForm.peroidId)">
|
||||
修改当前节点
|
||||
</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
v-if="searchForm.executor?.includes(currentUserId)"
|
||||
@click="handleUpdateProcess"
|
||||
>更新进度</el-button
|
||||
>
|
||||
<el-button type="success" @click="handleUpdateProcess">更新进度</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<OkrTable ref="okrTableRef" :canEdit="isCurrentLeafNode" />
|
||||
<OkrTable ref="okrTableRef" @row-click="handleShowOkr" />
|
||||
<DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
|
||||
<DialogOkrInfo ref="dialogOkrInfo" @success="handleSearchPeroid" />
|
||||
<DialogOkrInfo ref="dialogOkrInfo" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -43,63 +48,161 @@ import OkrTable from './OkrTable.vue'
|
||||
import DialogOkrInfo from './DialogOkrInfo.vue'
|
||||
import DialogOkr from './DialogOkr.vue'
|
||||
|
||||
import { getAllNodeTree, getAllOkrPage } from '@/api/okr/okr'
|
||||
import { listToTree, findNode } from '@/utils/tree'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
|
||||
const message = useMessage()
|
||||
const userStore = useUserStore()
|
||||
const currentUserId = userStore.getUser.id
|
||||
|
||||
const defaultProps = {
|
||||
value: 'nodeId',
|
||||
label: 'nodeName',
|
||||
children: 'children'
|
||||
}
|
||||
|
||||
const okrTableRef = ref(null)
|
||||
const searchForm = ref({
|
||||
nodeId: undefined
|
||||
peroidName: '',
|
||||
peroidId: null
|
||||
})
|
||||
|
||||
const peroidList = ref([])
|
||||
|
||||
handleSearchPeroid()
|
||||
|
||||
// 当前是否是叶子节点
|
||||
// 如果不是叶子节点，则表格数据不可修改
|
||||
const isCurrentLeafNode = ref(false)
|
||||
|
||||
function handleSearchPeroid() {
|
||||
getAllNodeTree().then((resp) => {
|
||||
peroidList.value = listToTree(resp.tree, {
|
||||
id: 'nodeId',
|
||||
pid: 'parentId',
|
||||
children: 'children'
|
||||
})
|
||||
nodeChange(resp.nodeId)
|
||||
})
|
||||
}
|
||||
|
||||
function nodeChange(nodeId) {
|
||||
searchForm.value.nodeId = nodeId
|
||||
getOkrList()
|
||||
const currentNode = findNode(peroidList.value, (node) => {
|
||||
return node.nodeId == nodeId
|
||||
})
|
||||
if (!currentNode.children || currentNode.children.length == 0) {
|
||||
isCurrentLeafNode.value = true
|
||||
} else {
|
||||
isCurrentLeafNode.value = false
|
||||
onMounted(() => {
|
||||
handleSearchPeroid()
|
||||
if (!searchForm.value.peroidId && peroidList.value.length) {
|
||||
searchForm.value.peroidId = peroidList.value[0].id
|
||||
searchForm.value.peroidName = peroidList.value[0].name
|
||||
}
|
||||
getOkrList()
|
||||
})
|
||||
|
||||
async function handleSearchPeroid() {
|
||||
peroidList.value = [
|
||||
{
|
||||
id: 1,
|
||||
name: '2025年寻驾okr',
|
||||
startDate: '2022-01-01',
|
||||
endDate: '2022-01-31'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '2024年寻驾okr',
|
||||
startDate: '2022-02-01',
|
||||
endDate: '2022-02-28'
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
function getOkrList() {
|
||||
getAllOkrPage(searchForm.value).then((resp) => {
|
||||
const list = resp
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(list)
|
||||
})
|
||||
function handleSelectPeroid(row) {
|
||||
searchForm.value.peroidName = row.name
|
||||
searchForm.value.peroidId = row.id
|
||||
handleSearchOkr()
|
||||
}
|
||||
|
||||
function handleSearchOkr() {
|
||||
console.log(searchForm.value)
|
||||
}
|
||||
|
||||
async function getOkrList() {
|
||||
const list = [
|
||||
{
|
||||
id: 1,
|
||||
name: '销售成交额达到1000万，总体成交率15%',
|
||||
process: 60,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 11,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '线索目标',
|
||||
targetType: 'value',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
currentNum: 5000,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '成交数',
|
||||
isSystem: true,
|
||||
targetType: 'value',
|
||||
targetNum: 2500,
|
||||
targetValue: false,
|
||||
currentNum: 500,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '运营消耗预算控制在20万以内，获得10万条线索',
|
||||
process: 80,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 21,
|
||||
type: 'keyresult',
|
||||
target: '本月抖音运营投入相较上月少10%',
|
||||
targetType: 'radio',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: false,
|
||||
process: 0,
|
||||
users: ''
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '累计输出作品',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '目标3',
|
||||
process: 40,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 31,
|
||||
type: 'keyresult',
|
||||
target: '关键成果1',
|
||||
process: 100,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'radio',
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: true
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '关键成果2',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(list)
|
||||
})
|
||||
}
|
||||
|
||||
@@ -110,22 +213,17 @@ function handleAddNode() {
|
||||
|
||||
function handleEditOkr() {
|
||||
dialogOkr.value.close()
|
||||
dialogOkrInfo.value.open('update', searchForm.value.nodeId)
|
||||
dialogOkrInfo.value.open('update', 1)
|
||||
}
|
||||
|
||||
function handleUpdateProcess() {
|
||||
okrTableRef.value.updateProcess(searchForm.value.nodeId).then(() => {
|
||||
message.success('更新成功')
|
||||
getOkrList()
|
||||
})
|
||||
message.success('更新进度成功')
|
||||
getOkrList()
|
||||
}
|
||||
|
||||
const dialogOkr = ref(null)
|
||||
function handleShowOkr(id) {
|
||||
dialogOkr.value.open({
|
||||
nodeId: id,
|
||||
canEdit: isCurrentLeafNode.value
|
||||
})
|
||||
function handleShowOkr(row) {
|
||||
dialogOkr.value.open(row.id)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -18,11 +18,11 @@
|
||||
<span class="text-14px ml-0.25">ork落地</span>
|
||||
<div class="ml-20px text-14px">
|
||||
<span>【节点】</span>
|
||||
<span>{{ nodeInfo.allNodeName }}</span>
|
||||
<span>寻驾全年目标 -> 1月</span>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
<Icon icon="ep:edit" :size="16" />
|
||||
</el-tooltip>
|
||||
@@ -43,36 +43,36 @@
|
||||
<div class="detail-basic-title">
|
||||
<div class="basic-title-item">
|
||||
<div class="basic-title-label">创建人</div>
|
||||
<div class="basic-title-value">{{ nodeInfo.creator }}</div>
|
||||
<div class="basic-title-value">张三</div>
|
||||
</div>
|
||||
<div class="basic-title-item">
|
||||
<div class="basic-title-label">执行人</div>
|
||||
<div class="basic-title-value">{{ nodeInfo.executorName || '无' }}</div>
|
||||
<div class="basic-title-value">张三、李四</div>
|
||||
</div>
|
||||
<div class="basic-title-item">
|
||||
<div class="basic-title-label">目标数</div>
|
||||
<div class="basic-title-value">{{ okrList.length }}</div>
|
||||
<div class="basic-title-value">3</div>
|
||||
</div>
|
||||
<div class="basic-title-item" style="min-width: 200px">
|
||||
<div class="basic-title-label">总体进度</div>
|
||||
<el-progress :percentage="parseInt(nodeInfo.progress) || 0" :stroke-width="8" />
|
||||
<el-progress :percentage="60" :stroke-width="8" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex detail-basic-info">
|
||||
<span>开始日期：{{ nodeInfo.startTime }}</span>
|
||||
<span>截止日期：{{ nodeInfo.endTime }}</span>
|
||||
<span>最新更新时间：{{ nodeInfo.updateTime }}</span>
|
||||
<span>开始日期：2025-01-01</span>
|
||||
<span>截止日期：2025-01-31</span>
|
||||
<span>最新更新时间：2025-01-15</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex" style="position: relative; flex: 1; height: 100px">
|
||||
<el-tabs v-model="workIndex" style="flex: 1">
|
||||
<el-tab-pane label="目标/关键成果" name="okr">
|
||||
<div class="content-wrap">
|
||||
<OkrTable ref="okrTableRef" :canEdit="canEdit" />
|
||||
<OkrTable ref="okrTableRef" />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</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>
|
||||
</div>
|
||||
@@ -82,43 +82,43 @@
|
||||
<el-tab-pane label="子节点" name="subNode">
|
||||
<div class="overflow-y-auto" style="height: calc(100% - 50px)">
|
||||
<div
|
||||
v-for="item in childNodeList"
|
||||
:key="item.nodeId"
|
||||
v-for="index in 12"
|
||||
:key="index"
|
||||
class="border-b-1 child-item"
|
||||
style="padding: 10px 5px; cursor: pointer"
|
||||
@click="handleChildItem(item)"
|
||||
@click="handleChildItem"
|
||||
>
|
||||
<div
|
||||
class="flex justify-between items-center overflow-hidden text-16px"
|
||||
style="line-height: 30px"
|
||||
>
|
||||
<div class="child-label">【节点】{{ item.nodeName }}</div>
|
||||
<div class="child-label">【节点】子节点{{ index }}</div>
|
||||
<el-progress
|
||||
type="line"
|
||||
:percentage="parseInt(item.progress) || 0"
|
||||
:percentage="0"
|
||||
:stroke-width="6"
|
||||
style="width: 120px"
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-10px flex items-center text-13px" style="line-height: 30px">
|
||||
<span>目标数：</span>
|
||||
<span style="color: #aaa">{{ item.objectiveNum }}</span>
|
||||
<span style="color: #aaa">4</span>
|
||||
<el-divider direction="vertical" style="margin: 0 20px" />
|
||||
<div
|
||||
class="flex-1 overflow-hidden h-30px"
|
||||
style="text-overflow: ellipsis; white-space: nowrap"
|
||||
>
|
||||
<span>执行人：</span>
|
||||
<span style="color: #aaa">{{ item.executorName || '无' }}</span>
|
||||
<span style="color: #aaa">张三、李四、王二</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ml-10px flex items-center text-12px"
|
||||
style="line-height: 20px; color: #aaa"
|
||||
>
|
||||
<span>开始日期：{{ item.startTime }}</span>
|
||||
<span>开始日期：2025-01-01</span>
|
||||
<el-divider direction="vertical" style="margin: 0 20px" />
|
||||
<span>截止日期：{{ item.endTime }}</span>
|
||||
<span>截止日期：2025-01-31</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -134,12 +134,11 @@
|
||||
style="width: 120px"
|
||||
@change="getCommentTemplate"
|
||||
>
|
||||
<el-option
|
||||
v-for="it in commentTypeOptions"
|
||||
:label="it.label"
|
||||
:value="it.id"
|
||||
:key="it.id"
|
||||
/>
|
||||
<el-option label="总结" :value="1" />
|
||||
<el-option label="日报" :value="2" />
|
||||
<el-option label="周报" :value="3" />
|
||||
<el-option label="月报" :value="4" />
|
||||
<!-- <el-option label="评论" :value="5" disabled /> -->
|
||||
</el-select>
|
||||
|
||||
<div v-if="addNewComment">
|
||||
@@ -159,12 +158,7 @@
|
||||
:toolbarConfig="toolbarConfig"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
v-for="(it, index) in commentList"
|
||||
:key="it.commentId"
|
||||
class="border-b-1"
|
||||
style="padding: 10px 5px"
|
||||
>
|
||||
<div v-for="index in 12" :key="index" class="border-b-1" style="padding: 10px 5px">
|
||||
<div
|
||||
class="flex items-center justify-between overflow-hidden text-16px"
|
||||
style="line-height: 30px"
|
||||
@@ -179,42 +173,28 @@
|
||||
"
|
||||
fit="fill"
|
||||
>
|
||||
<span class="text-12px">{{ it.creatorName.slice(-2) }}</span>
|
||||
<span class="text-12px">门庆</span>
|
||||
</el-avatar>
|
||||
<div class="ml-10px text-16px">{{ it.creatorName }}</div>
|
||||
<div class="ml-10px text-16px">西门庆</div>
|
||||
</div>
|
||||
<div class="ml-10px text-13px text-gray-400">01-01 12:15</div>
|
||||
</div>
|
||||
<div class="ml-10px" v-dompurify-html="it.content"></div>
|
||||
<div class="ml-10px" v-dompurify-html="commentListVal"></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"
|
||||
>
|
||||
<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="showComment(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 class="flex items-center mr-50px">
|
||||
<el-button link @click="good(index)">
|
||||
<Icon icon="fa:thumbs-o-up" :size="16" />
|
||||
</el-button>
|
||||
<span class="ml-5px">6</span>
|
||||
</div>
|
||||
<div class="ml-10px text-13px text-gray-400">
|
||||
{{ formatDate(it.createTime, 'YYYY-MM-DD HH:mm') }}
|
||||
<div class="flex items-center mr-50px">
|
||||
<el-button link @click="showComment(index)">
|
||||
<Icon icon="ep:chat-dot-square" :size="16" />
|
||||
</el-button>
|
||||
<span class="ml-5px">1</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 评论 -->
|
||||
@@ -224,19 +204,22 @@
|
||||
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>
|
||||
<div class="text-14px" style="line-height: 24px">
|
||||
<span class="font-bold">武大郎：</span>
|
||||
<span>
|
||||
{{ subComment.content }}
|
||||
大官人，你要脆饼不要，卖完最后一个我要回家了，我家婆娘熬了鸡汤给我补身子
|
||||
</span>
|
||||
</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">
|
||||
<!-- <el-input
|
||||
<el-input
|
||||
v-model="form.commentValue"
|
||||
placeholder="请输入评论"
|
||||
type="textarea"
|
||||
@@ -244,30 +227,12 @@
|
||||
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="{ 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
|
||||
type="primary"
|
||||
size="small"
|
||||
style="position: absolute; right: 2px; bottom: 2px"
|
||||
@click="handleSendCommnet(index)"
|
||||
@click="handleSendCommnet"
|
||||
>
|
||||
发布
|
||||
</el-button>
|
||||
@@ -279,16 +244,23 @@
|
||||
<el-tab-pane label="进度历史" name="history">
|
||||
<div class="overflow-y-auto pl-15px" style="height: calc(100% - 50px)">
|
||||
<el-timeline class="ml-10px">
|
||||
<el-timeline-item
|
||||
v-for="item in nodeRecords"
|
||||
:key="item.recordId"
|
||||
placement="bottom"
|
||||
:timestamp="formatDate(item.createTime, 'YYYY-MM-DD HH:mm:ss')"
|
||||
color="#30d1fc"
|
||||
>
|
||||
<div>{{ item.creator }}</div>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-20" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
{{ item.content }}
|
||||
进度变化：40% -> 60%
|
||||
（节点进度是读取目标进度计算的，目标进度根据关键成果计算，关键成果在提交跟新时会有）
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-15" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
更新节点
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-01" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
创建节点
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
@@ -302,27 +274,11 @@
|
||||
</template>
|
||||
|
||||
<script setup name="DialogOkr">
|
||||
import { formatDate } from '@/utils/formatTime'
|
||||
import OkrTable from './OkrTable.vue'
|
||||
|
||||
import { getOkrNodeDetail, getOkrNodeHistory } from '@/api/okr/okr'
|
||||
import {
|
||||
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 show = ref(false)
|
||||
const canEdit = ref(false)
|
||||
|
||||
const toolbarConfig = {
|
||||
toolbarKeys: [
|
||||
@@ -342,63 +298,123 @@ const toolbarConfig = {
|
||||
|
||||
const workIndex = ref('okr')
|
||||
const okrList = ref([])
|
||||
const childNodeList = ref([])
|
||||
const sideIndex = ref('subNode')
|
||||
|
||||
const okrTableRef = ref(null)
|
||||
const nodeInfo = ref({})
|
||||
|
||||
const nodeRecords = ref([])
|
||||
const commentTypeOptions = ref([])
|
||||
|
||||
function open(curNode) {
|
||||
canEdit.value = curNode.canEdit
|
||||
nodeInfo.value.nodeId = curNode.nodeId
|
||||
// 获取数据详情
|
||||
searchInfo(curNode)
|
||||
async function open(id) {
|
||||
show.value = true
|
||||
}
|
||||
|
||||
const employeeOptions = ref([])
|
||||
|
||||
function searchInfo(curNode) {
|
||||
try {
|
||||
getOkrNodeDetail(curNode.nodeId).then((resp) => {
|
||||
nodeInfo.value = {
|
||||
...resp,
|
||||
executor: resp.executor || []
|
||||
}
|
||||
canEdit.value =
|
||||
canEdit.value && currentUserId == nodeInfo.value.executor.includes(currentUserId)
|
||||
if (resp.objectives) {
|
||||
okrList.value = resp.objectives.map((item) => ({
|
||||
...item,
|
||||
keyResults: item.keyResults || []
|
||||
}))
|
||||
} else {
|
||||
okrList.value = []
|
||||
}
|
||||
childNodeList.value = [...resp.children]
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(okrList.value)
|
||||
})
|
||||
})
|
||||
getOkrNodeHistory(curNode.nodeId).then((resp) => {
|
||||
nodeRecords.value = resp
|
||||
})
|
||||
getEmployeeSimpleList({ status: 0 }).then((resp) => {
|
||||
employeeOptions.value = resp.map((item) => ({
|
||||
...item,
|
||||
label: item.name,
|
||||
value: item.name
|
||||
}))
|
||||
})
|
||||
getCommentTypeOptions().then((resp) => {
|
||||
commentTypeOptions.value = resp
|
||||
})
|
||||
searchCommentList()
|
||||
} finally {
|
||||
}
|
||||
// 获取数据详情
|
||||
console.log(id)
|
||||
okrList.value = [
|
||||
{
|
||||
id: 1,
|
||||
name: '销售成交额达到1000万，总体成交率15%',
|
||||
process: 60,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 11,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '线索目标',
|
||||
targetType: 'value',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
currentNum: 5000,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '成交数',
|
||||
isSystem: true,
|
||||
targetType: 'value',
|
||||
targetNum: 2500,
|
||||
targetValue: false,
|
||||
currentNum: 500,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '运营消耗预算控制在20万以内，获得10万条线索',
|
||||
process: 80,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 21,
|
||||
type: 'keyresult',
|
||||
target: '本月抖音运营投入相较上月少10%',
|
||||
targetType: 'radio',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: false,
|
||||
process: 0,
|
||||
users: ''
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '累计输出作品',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '目标3',
|
||||
process: 40,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 31,
|
||||
type: 'keyresult',
|
||||
target: '关键成果1',
|
||||
process: 100,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'radio',
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: true
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '关键成果2',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(okrList.value)
|
||||
})
|
||||
}
|
||||
|
||||
function close() {
|
||||
@@ -407,96 +423,42 @@ function close() {
|
||||
|
||||
defineExpose({ open, close })
|
||||
|
||||
function handleMention(item) {
|
||||
form.value.mentionedUserIdList.push(item.id)
|
||||
}
|
||||
|
||||
function handleSaveProcess() {
|
||||
okrTableRef.value.updateProcess(nodeInfo.value.nodeId).then(() => {
|
||||
message.success('更新成功')
|
||||
searchInfo()
|
||||
})
|
||||
console.log(okrList.value)
|
||||
}
|
||||
|
||||
function handleChildItem(item) {
|
||||
const arr = item.executor || []
|
||||
const isExecutor = arr.includes(currentUserId)
|
||||
canEdit.value = isExecutor && (!item.children || item.children.length == 0)
|
||||
searchInfo(item)
|
||||
function handleChildItem() {
|
||||
console.log('handleChildItem')
|
||||
}
|
||||
|
||||
const addNewComment = ref(false)
|
||||
const form = ref({
|
||||
commentValue: '',
|
||||
commentType: undefined,
|
||||
mentionedUserIdList: []
|
||||
commentType: 1
|
||||
})
|
||||
function handleInsertComment() {
|
||||
addNewComment.value = true
|
||||
const defaultComment = commentTypeOptions.value[0]
|
||||
if (defaultComment) {
|
||||
form.value = {
|
||||
commentType: defaultComment.id,
|
||||
mentionedUserIdList: []
|
||||
}
|
||||
form.value = {
|
||||
commentValue: '',
|
||||
commentType: 1
|
||||
}
|
||||
getCommentTemplate()
|
||||
}
|
||||
|
||||
function getCommentTemplate() {
|
||||
if (form.value.commentType) {
|
||||
form.value.commentValue = commentTypeOptions.value.find(
|
||||
(item) => item.id == form.value.commentType
|
||||
).remark
|
||||
} else {
|
||||
form.value.commentValue = `<h2 style=\"text-align: start;\">一、工作概况</h2><p> </p><h2 style=\"text-align: start;\">二、数据统计</h2><ol><li>呼出电话数：</li><li>有效沟通数：</li><li>销售成果</li></ol><h2 style=\"text-align: start;\">三、问题与改进方案</h2><p><br></p>`
|
||||
}
|
||||
form.value.commentValue = `<h2 style=\"text-align: start;\">一、工作概况</h2><p> </p><h2 style=\"text-align: start;\">二、数据统计</h2><ol><li>呼出电话数：</li><li>有效沟通数：</li><li>销售成果</li></ol><h2 style=\"text-align: start;\">三、问题与改进方案</h2><p><br></p>`
|
||||
}
|
||||
|
||||
function handleSaveComment() {
|
||||
addNewComment.value = false
|
||||
try {
|
||||
const data = {
|
||||
businessType: 1,
|
||||
businessId: nodeInfo.value.nodeId,
|
||||
contentType: 1,
|
||||
content: form.value.commentValue,
|
||||
mentionedUserIdList: form.value.mentionedUserIdList
|
||||
}
|
||||
createComment(data)
|
||||
.then(() => {
|
||||
message.success('评论成功')
|
||||
searchCommentList()
|
||||
})
|
||||
.finally(() => {
|
||||
form.value.commentValue = ''
|
||||
})
|
||||
} catch (error) {
|
||||
message.error('评论失败')
|
||||
}
|
||||
}
|
||||
const commentList = ref([])
|
||||
|
||||
function searchCommentList() {
|
||||
getCommentPage({
|
||||
businessType: 1,
|
||||
businessId: nodeInfo.value.nodeId,
|
||||
pageNum: 1,
|
||||
pageSize: -1
|
||||
}).then((resp) => {
|
||||
commentList.value = listToTree(resp.list, {
|
||||
id: 'commentId',
|
||||
pid: 'parentId',
|
||||
children: 'children'
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
function good(item) {
|
||||
likeComment(item.commentId).then(() => {
|
||||
message.success('点赞成功')
|
||||
searchCommentList()
|
||||
})
|
||||
const commentListVal = ref(
|
||||
`<h2 style=\"text-align: start;\">一、工作概况</h2><p> 刷牙洗脸吃饭穿鞋出门开车上班捣台球 </p><h2 style=\"text-align: start;\">二、数据统计</h2><ol><li>呼出电话数：666</li><li>有效沟通数：123</li><li>销售成果：今日成交20，本月成交120，距离目标还差888</li></ol><h2 style=\"text-align: start;\">三、问题与改进方案</h2><p>无<br></p>`
|
||||
)
|
||||
|
||||
function good(index) {
|
||||
console.log(index)
|
||||
}
|
||||
|
||||
const showCommentIndex = ref(-1)
|
||||
@@ -504,37 +466,8 @@ function showComment(index) {
|
||||
showCommentIndex.value = showCommentIndex.value == index ? -1 : index
|
||||
}
|
||||
|
||||
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: 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('评论失败')
|
||||
}
|
||||
function handleSendCommnet() {
|
||||
console.log(form.value.commentValue)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-if="show"
|
||||
v-model="show"
|
||||
width="900px"
|
||||
class="dialog-okr"
|
||||
@@ -18,7 +19,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<div class="dialog-okr-body" v-loading="formLoading">
|
||||
<div class="dialog-okr-body">
|
||||
<el-form :model="form" ref="formRef" :rules="rules" label-width="0">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4" :offset="0">
|
||||
@@ -27,24 +28,21 @@
|
||||
v-model="form.parentId"
|
||||
:data="parentNodeList"
|
||||
check-strictly
|
||||
:props="{ value: 'nodeId', label: 'nodeName', children: 'children' }"
|
||||
:props="{ value: 'id', label: 'label', children: 'children' }"
|
||||
:render-after-expand="false"
|
||||
placeholder="父节点"
|
||||
clearable
|
||||
:disabled="!!form.nodeId"
|
||||
@change="handleChangeParent"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="0">
|
||||
<el-form-item prop="nodeName">
|
||||
<el-input v-model="form.nodeName" placeholder="请输入节点名称" />
|
||||
<el-form-item prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入节点名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="0">
|
||||
<el-form-item prop="startTime">
|
||||
<el-form-item prop="createTime">
|
||||
<el-date-picker
|
||||
v-model="form.startTime"
|
||||
v-model="form.createTime"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@@ -69,8 +67,6 @@
|
||||
v-model="form.executor"
|
||||
placeholder="选择执行人，可多选"
|
||||
multiple
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
@@ -78,17 +74,16 @@
|
||||
v-for="item in userOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id + ''"
|
||||
:disabled="item.status == 1"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="0">
|
||||
<el-form-item prop="dataScope">
|
||||
<el-select v-model="form.dataScope" placeholder="选择权限" clearable filterable>
|
||||
<el-option label="公开" :value="1" />
|
||||
<el-option label="仅上级可见" :value="2" />
|
||||
<el-form-item prop="persission">
|
||||
<el-select v-model="form.persission" placeholder="选择权限" clearable filterable>
|
||||
<el-option label="公开" :value="0" />
|
||||
<el-option label="仅上级可见" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@@ -96,8 +91,8 @@
|
||||
</el-form>
|
||||
<div class="relative">
|
||||
<el-button
|
||||
v-if="okrKey == 'okr'"
|
||||
style="position: absolute; right: 10px; top: 10px; z-index: 9"
|
||||
v-if="okrKey === 'okr'"
|
||||
style="position: absolute; right: 10px; top: 10px"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="addObjective"
|
||||
@@ -105,8 +100,8 @@
|
||||
添加目标
|
||||
</el-button>
|
||||
<el-button
|
||||
v-else-if="okrKey == 'childNode'"
|
||||
style="position: absolute; right: 10px; top: 10px; z-index: 9"
|
||||
v-else-if="okrKey === 'childNode'"
|
||||
style="position: absolute; right: 10px; top: 10px"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="addChildNode"
|
||||
@@ -119,76 +114,63 @@
|
||||
<div
|
||||
class="flex items-center w-full"
|
||||
v-for="(item, i) in objectList"
|
||||
:key="item.objectiveId"
|
||||
:key="item.id"
|
||||
>
|
||||
<div class="flex-1 w-100px">
|
||||
<div class="flex items-center">
|
||||
<el-tag type="success" class="mr-10px">O{{ i + 1 }}</el-tag>
|
||||
<el-input
|
||||
v-model="item.objectiveName"
|
||||
placeholder="目标名称"
|
||||
class="flex-1 w-150px"
|
||||
:disabled="!!item.objectiveId"
|
||||
/>
|
||||
<el-input v-model="item.name" placeholder="目标名称" class="flex-1 w-150px" />
|
||||
<el-select
|
||||
v-model="item.executor"
|
||||
v-model="item.objExecutor"
|
||||
placeholder="选择执行人，可多选"
|
||||
multiple
|
||||
clearable
|
||||
filterable
|
||||
style="width: 240px; margin-left: 10px"
|
||||
style="min-width: 240px; margin-left: 10px"
|
||||
>
|
||||
<el-option
|
||||
v-for="it in userOptions"
|
||||
:key="it.id"
|
||||
:label="it.name"
|
||||
:value="it.id + ''"
|
||||
:disabled="it.status == 1"
|
||||
:value="it.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="item.dataScope"
|
||||
v-model="item.persission"
|
||||
placeholder="选择权限"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 120px; margin-left: 10px"
|
||||
>
|
||||
<el-option label="公开" :value="1" />
|
||||
<el-option label="仅上级可见" :value="2" />
|
||||
<el-option label="公开" :value="0" />
|
||||
<el-option label="仅上级可见" :value="1" />
|
||||
</el-select>
|
||||
<div class="ml-10px">
|
||||
<el-button type="primary" text @click="AddKR(i)">新增关键成果</el-button>
|
||||
<el-button type="danger" text @click="removeObj(i)">删除目标</el-button>
|
||||
<el-button type="primary" text @click="AddKR">新增关键成果</el-button>
|
||||
<el-button type="danger" text @click="removeObj">删除目标</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div style="background: #f0f3fa; padding-bottom: 15px">
|
||||
<div
|
||||
class="ml-50px"
|
||||
v-for="(kr, index) in item.keyResults"
|
||||
:key="kr.keyResultId"
|
||||
>
|
||||
<div class="ml-50px" v-for="(kr, index) in item.children" :key="kr.id">
|
||||
<div class="flex flex-1 items-center pb-5px pt-5px">
|
||||
<el-tag class="mr-10px">KR{{ index + 1 }}</el-tag>
|
||||
<el-select
|
||||
v-model="kr.keyResultName"
|
||||
placeholder="选择或输入关键成果"
|
||||
v-model="kr.id"
|
||||
placeholder="选择或输入"
|
||||
filterable
|
||||
:props="{ value: 'keyResultId', label: 'keyResultName' }"
|
||||
:props="{ value: 'id', label: 'name' }"
|
||||
allow-create
|
||||
:reserve-keyword="false"
|
||||
class="flex-1 w-150px"
|
||||
@change="krChange(i, index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="it in krOptions"
|
||||
:key="it.value"
|
||||
:label="it.label"
|
||||
:value="it.value"
|
||||
v-for="it in item.children"
|
||||
:key="it.id"
|
||||
:label="it.name"
|
||||
:value="it.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button type="danger" text @click="removeKR(i, index)">
|
||||
删除关键成果
|
||||
</el-button>
|
||||
<el-button type="danger" text @click="removeKR">删除关键成果</el-button>
|
||||
</div>
|
||||
<div class="mt-5px flex items-center">
|
||||
<el-tree-select
|
||||
@@ -198,51 +180,47 @@
|
||||
check-strictly
|
||||
clearable
|
||||
filterable
|
||||
style="width: 200px"
|
||||
node-key="sourceId"
|
||||
placeholder="请选择渠道"
|
||||
/>
|
||||
<el-radio-group v-model="kr.resultType" class="ml-10px">
|
||||
<el-radio-button :value="1">目标值</el-radio-button>
|
||||
<el-radio-button :value="2">是/否</el-radio-button>
|
||||
<el-radio-group v-model="kr.targetType" class="ml-10px">
|
||||
<el-radio-button label="value">目标值</el-radio-button>
|
||||
<el-radio-button label="radio">是/否</el-radio-button>
|
||||
</el-radio-group>
|
||||
|
||||
<el-input
|
||||
v-if="kr.resultType == 1"
|
||||
v-model="kr.targetValue"
|
||||
v-if="kr.targetType === 'value'"
|
||||
v-model="kr.targetNum"
|
||||
type="number"
|
||||
placeholder="目标值"
|
||||
class="ml-10px"
|
||||
style="width: 120px"
|
||||
style="width: 100px"
|
||||
/>
|
||||
|
||||
<el-select
|
||||
v-model="kr.executor"
|
||||
v-model="kr.objExecutor"
|
||||
placeholder="选择执行人，可多选"
|
||||
multiple
|
||||
clearable
|
||||
filterable
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
style="width: 240px; margin-left: 10px"
|
||||
style="min-width: 240px; margin-left: 10px"
|
||||
>
|
||||
<el-option
|
||||
v-for="it in userOptions"
|
||||
:key="it.id"
|
||||
:label="it.name"
|
||||
:value="it.id + ''"
|
||||
:disabled="it.status == 1"
|
||||
:value="it.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="kr.dataScope"
|
||||
v-model="kr.persission"
|
||||
placeholder="选择权限"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 120px; margin-left: 10px"
|
||||
>
|
||||
<el-option label="公开" :value="1" />
|
||||
<el-option label="仅上级可见" :value="2" />
|
||||
<el-option label="公开" :value="0" />
|
||||
<el-option label="仅上级可见" :value="1" />
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
@@ -256,13 +234,13 @@
|
||||
<el-table :data="childNodeList">
|
||||
<el-table-column label="名称">
|
||||
<template #default="{ row }">
|
||||
<el-input v-model="row.nodeName" placeholder="子节点名称" />
|
||||
<el-input v-model="row.name" placeholder="子节点名称" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开始日期" width="160px">
|
||||
<template #default="{ row }">
|
||||
<el-date-picker
|
||||
v-model="row.startTime"
|
||||
v-model="row.createTime"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@@ -285,9 +263,9 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="权限" width="160px">
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.dataScope" placeholder="请选择" style="width: 130px">
|
||||
<el-option label="公开" :value="1" />
|
||||
<el-option label="仅上级可见" :value="2" />
|
||||
<el-select v-model="row.permission" placeholder="请选择" style="width: 130px">
|
||||
<el-option label="公开" :value="0" />
|
||||
<el-option label="仅上级可见" :value="1" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -305,8 +283,7 @@
|
||||
v-for="item in userOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id + ''"
|
||||
:disabled="item.status == 1"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
@@ -326,17 +303,6 @@
|
||||
</template>
|
||||
|
||||
<script setup name="DialogOkrInfo">
|
||||
import {
|
||||
getAllNodeTree,
|
||||
getOkrNodeDetail,
|
||||
createOkrNode,
|
||||
updateOkrNode,
|
||||
getAllOkrPage,
|
||||
getDefaultOkrOptions
|
||||
} from '@/api/okr/okr'
|
||||
import { listToTree } from '@/utils/tree'
|
||||
import { getEmployeeSimpleList } from '@/api/pers/employee'
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
||||
@@ -356,20 +322,39 @@ const formType = ref('create')
|
||||
|
||||
const form = ref({})
|
||||
const formLoading = ref(false)
|
||||
const rules = ref({
|
||||
nodeName: { required: true, message: '节点名称不可为空', trigger: 'blur' },
|
||||
startTime: { required: true, message: '开始日期不可为空', trigger: 'change' },
|
||||
endTime: { required: true, message: '截止日期不可为空', trigger: 'change' }
|
||||
})
|
||||
const rules = ref({})
|
||||
|
||||
const okrKey = ref('okr')
|
||||
|
||||
const parentNodeList = ref([])
|
||||
const parentNodeList = ref([
|
||||
{
|
||||
id: 1,
|
||||
label: '寻驾全年目标',
|
||||
children: [
|
||||
{ id: 2, label: '1月' },
|
||||
{ id: 3, label: '2月' },
|
||||
{ id: 4, label: '3月' },
|
||||
{ id: 5, label: '4月' },
|
||||
{ id: 6, label: '5月' },
|
||||
{ id: 7, label: '6月' },
|
||||
{ id: 8, label: '7月' },
|
||||
{ id: 9, label: '8月' },
|
||||
{ id: 10, label: '9月' },
|
||||
{ id: 11, label: '10月' },
|
||||
{ id: 12, label: '11月' },
|
||||
{ id: 13, label: '12月' }
|
||||
]
|
||||
}
|
||||
])
|
||||
|
||||
const childNodeList = ref([])
|
||||
const childNodeList = ref([{}])
|
||||
|
||||
const userOptions = ref([])
|
||||
const krOptions = ref([])
|
||||
const userOptions = ref([
|
||||
{ id: 1, name: '张三' },
|
||||
{ id: 2, name: '李四' },
|
||||
{ id: 3, name: '王五' },
|
||||
{ id: 4, name: '赵六' }
|
||||
])
|
||||
const defaultProps = {
|
||||
children: 'children',
|
||||
label: 'sourceName',
|
||||
@@ -377,53 +362,151 @@ const defaultProps = {
|
||||
isLeaf: 'leaf'
|
||||
}
|
||||
const sourceOptions = ref([])
|
||||
const objectList = ref([])
|
||||
function open(type, val) {
|
||||
const objectList = ref([
|
||||
{
|
||||
nodeId: 2,
|
||||
name: '1月销售任务概述，例：销售额100万，成交率15%',
|
||||
objExecutor: [1, 2],
|
||||
id: 'a1',
|
||||
children: [
|
||||
{
|
||||
id: 'a1-1',
|
||||
name: '销售额',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a1-2',
|
||||
name: '成交数',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a1-3',
|
||||
name: '成交率',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a1-4',
|
||||
name: '本月抖音运营投入相较上月少10%',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
targetType: 'radio'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
nodeId: 3,
|
||||
name: '1月运营目标',
|
||||
objExecutor: [1, 2],
|
||||
id: 'a2',
|
||||
children: [
|
||||
{
|
||||
id: 'a2-1',
|
||||
name: '销售额',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a2-2',
|
||||
name: '成交数',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a1-3',
|
||||
name: '成交率',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a1-4',
|
||||
name: '本月抖音运营投入相较上月少10%',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
targetType: 'radio'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
nodeId: 4,
|
||||
name: '1月主播任务',
|
||||
objExecutor: [1, 2],
|
||||
id: 'a3',
|
||||
children: [
|
||||
{
|
||||
id: 'a3-1',
|
||||
name: '销售额',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a3-2',
|
||||
name: '成交数',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a3-3',
|
||||
name: '成交率',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
targetType: 'value'
|
||||
},
|
||||
{
|
||||
id: 'a3-4',
|
||||
name: '本月抖音运营投入相较上月少10%',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
targetType: 'radio'
|
||||
}
|
||||
]
|
||||
}
|
||||
])
|
||||
|
||||
async function open(type, val) {
|
||||
show.value = true
|
||||
title.value = type == 'update' ? '修改Okr' : '新增Okr'
|
||||
formType.value = type
|
||||
resetForm()
|
||||
getEmployeeSimpleList().then((data) => {
|
||||
userOptions.value = data
|
||||
})
|
||||
getAllNodeTree().then((resp) => {
|
||||
parentNodeList.value = listToTree(resp.tree, {
|
||||
id: 'nodeId',
|
||||
pid: 'parentId',
|
||||
children: 'children'
|
||||
})
|
||||
})
|
||||
getDefaultOkrOptions().then((resp) => {
|
||||
krOptions.value = resp
|
||||
})
|
||||
if (val) {
|
||||
formLoading.value = true
|
||||
try {
|
||||
getOkrNodeDetail(val).then((resp) => {
|
||||
form.value = resp
|
||||
if (resp.objectives) {
|
||||
objectList.value = resp.objectives.map((item) => ({
|
||||
...item,
|
||||
keyResults: item.keyResults || []
|
||||
}))
|
||||
} else {
|
||||
objectList.value = []
|
||||
}
|
||||
childNodeList.value = [...resp.children]
|
||||
})
|
||||
// form.value = await KpiApi.getKpiDetail(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
}
|
||||
// getOptions()
|
||||
}
|
||||
function resetForm() {
|
||||
form.value = {
|
||||
parentId: undefined,
|
||||
nodeName: undefined,
|
||||
startTime: undefined,
|
||||
endTime: undefined,
|
||||
executor: [],
|
||||
dataScope: 1
|
||||
parentId: '',
|
||||
name: '',
|
||||
createTime: '',
|
||||
endTime: '',
|
||||
executor: []
|
||||
}
|
||||
}
|
||||
|
||||
@@ -435,36 +518,26 @@ const emit = defineEmits(['success', 'close']) // 定义 success 事件，用于
|
||||
|
||||
function addObjective() {
|
||||
objectList.value.push({
|
||||
objectiveName: '',
|
||||
executor: [],
|
||||
keyResults: [],
|
||||
dataScope: 1
|
||||
name: '',
|
||||
objExecutor: [],
|
||||
children: []
|
||||
})
|
||||
}
|
||||
|
||||
function AddKR(idx) {
|
||||
if (!objectList.value[idx].keyResults) {
|
||||
objectList.value[idx].keyResults = []
|
||||
}
|
||||
const obj = objectList.value[idx]
|
||||
objectList.value[idx].keyResults.push({
|
||||
keyResultName: undefined,
|
||||
resultType: 1,
|
||||
source: undefined,
|
||||
targetValue: undefined,
|
||||
process: undefined,
|
||||
currentValue: undefined,
|
||||
executor: obj.executor,
|
||||
dataScope: obj.dataScope
|
||||
function AddKR() {
|
||||
objectList.value.push({
|
||||
name: '',
|
||||
objExecutor: [],
|
||||
children: []
|
||||
})
|
||||
}
|
||||
|
||||
function removeObj(idx) {
|
||||
objectList.value.splice(idx, 1)
|
||||
function removeObj() {
|
||||
objectList.value.pop()
|
||||
}
|
||||
|
||||
function removeKR(oIdx, krIdx) {
|
||||
objectList.value[oIdx].keyResults.splice(krIdx, 1)
|
||||
function removeKR() {
|
||||
objectList.value.pop()
|
||||
}
|
||||
|
||||
function addChildNode() {
|
||||
@@ -475,35 +548,6 @@ function removeChildNode(idx) {
|
||||
childNodeList.value.splice(idx, 1)
|
||||
}
|
||||
|
||||
// 读取父节点的OKR，并展示出来
|
||||
function handleChangeParent() {
|
||||
// 通过父节点Id,查询父节点的okr，需要继承
|
||||
if (form.value.parentId) {
|
||||
getAllOkrPage({ nodeId: form.value.parentId }).then((resp) => {
|
||||
objectList.value = resp
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function getLastDayOfMonth(year, month) {
|
||||
// 创建一个日期对象，将月份设置为指定月份的下一个月，日期设置为 0
|
||||
const date = new Date(year, month + 1, 0)
|
||||
// 返回该日期对象的日期部分，即指定年月的最后一天
|
||||
return date.getDate()
|
||||
}
|
||||
|
||||
function krChange(idx, krIdx) {
|
||||
const kr = objectList.value[idx].keyResults[krIdx]
|
||||
if (kr.keyResultName) {
|
||||
const obj = krOptions.value.find((item) => item.value == kr.keyResultName)
|
||||
if (obj) {
|
||||
kr.isSys = true
|
||||
} else {
|
||||
kr.isSys = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function handleSave() {
|
||||
// 校验表单
|
||||
if (!formRef.value) return
|
||||
@@ -512,47 +556,11 @@ async function handleSave() {
|
||||
// 提交请求
|
||||
formLoading.value = true
|
||||
try {
|
||||
form.value.objectives = objectList.value
|
||||
form.value.children = childNodeList.value
|
||||
if (formType.value === 'create') {
|
||||
// 创建的是一级节点,且子节点为空时，自动新增12个月子节点，并且每月添加4周的周子节点
|
||||
if (!form.value.parentId) {
|
||||
if (form.value.children.length == 0) {
|
||||
const defaultTime = new Date(form.value.startTime)
|
||||
for (let month = 0; month < 12; month++) {
|
||||
form.value.children.push({
|
||||
nodeName: `${month + 1}月`,
|
||||
startTime: `${defaultTime.getFullYear()}-${String(month + 1).padStart(2, '0')}-01`,
|
||||
endTime: `${defaultTime.getFullYear()}-${String(month + 1).padStart(
|
||||
2,
|
||||
'0'
|
||||
)}-${getLastDayOfMonth(defaultTime.getFullYear(), month)}`,
|
||||
children: [
|
||||
{
|
||||
nodeName: `${month + 1}月第1周`,
|
||||
children: []
|
||||
},
|
||||
{
|
||||
nodeName: `${month + 1}月第2周`,
|
||||
children: []
|
||||
},
|
||||
{
|
||||
nodeName: `${month + 1}月第3周`,
|
||||
children: []
|
||||
},
|
||||
{
|
||||
nodeName: `${month + 1}月第4周`,
|
||||
children: []
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
await createOkrNode(form.value)
|
||||
// await KpiApi.createKpi(form.value)
|
||||
message.success(t('common.createSuccess'))
|
||||
} else {
|
||||
await updateOkrNode(form.value)
|
||||
// await KpiApi.updateKpi(form.value)
|
||||
message.success(t('common.updateSuccess'))
|
||||
}
|
||||
show.value = false
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
:disabled="formType == 'do'"
|
||||
:rules="rules"
|
||||
label-width="80px"
|
||||
class="flex-1"
|
||||
class="flex-1 wait-form"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24" :offset="0">
|
||||
@@ -39,8 +39,8 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" :offset="0">
|
||||
<el-form-item label="完成状态" prop="completeStatus">
|
||||
<el-select v-model="form.completeStatus" placeholder="选择完成状态" filterable>
|
||||
<el-form-item label="完成状态" prop="status">
|
||||
<el-select v-model="form.status" placeholder="选择完成状态" filterable>
|
||||
<el-option
|
||||
v-for="item in props.statusOptions"
|
||||
:key="item.value"
|
||||
@@ -53,9 +53,9 @@
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12" :offset="0">
|
||||
<el-form-item label="截止日期" prop="endDate">
|
||||
<el-form-item label="截止日期" prop="dueDate">
|
||||
<el-date-picker
|
||||
v-model="form.endDate"
|
||||
v-model="form.dueDate"
|
||||
type="date"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@@ -64,9 +64,9 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" :offset="0">
|
||||
<el-form-item label="执行人" prop="userList">
|
||||
<el-form-item label="执行人" prop="executorIds">
|
||||
<el-select
|
||||
v-model="form.userList"
|
||||
v-model="form.executorIds"
|
||||
placeholder="选择执行人，可多选"
|
||||
multiple
|
||||
clearable
|
||||
@@ -76,7 +76,6 @@
|
||||
<el-option
|
||||
v-for="item in employeeOptions"
|
||||
:key="item.id"
|
||||
:disabled="item.status == 1"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
@@ -86,7 +85,7 @@
|
||||
</el-row>
|
||||
<el-row :gutter="0">
|
||||
<el-col :span="8" :offset="0">
|
||||
<el-form-item prop="notifyType">
|
||||
<el-form-item prop="remindFrequency">
|
||||
<template #label>
|
||||
<el-tooltip
|
||||
content="新增待办时会立刻发送消息通知执行人，若后续无需再次提醒，频率可选择“不提醒”"
|
||||
@@ -97,49 +96,34 @@
|
||||
</el-tooltip>
|
||||
<span>提醒频率</span>
|
||||
</template>
|
||||
<el-select v-model="form.notifyType" placeholder="选择提醒频率">
|
||||
<el-option label="不提醒" value="1" />
|
||||
<el-option label="单次提醒" value="2" />
|
||||
<el-option label="循环提醒" value="3" />
|
||||
<el-select v-model="form.remindFrequency" placeholder="选择提醒频率">
|
||||
<el-option label="不提醒" :value="0" />
|
||||
<el-option label="单次提醒" :value="1" />
|
||||
<el-option label="循环提醒" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="0" v-if="form.notifyType != 1">
|
||||
<el-form-item label="提醒时间" prop="remindTime" class="wait-form">
|
||||
<el-input
|
||||
v-if="form.notifyType == 2"
|
||||
v-model="form.notifyBeforeTime"
|
||||
placeholder="输入小时数"
|
||||
min="0"
|
||||
type="number"
|
||||
>
|
||||
<el-col :span="8" :offset="0" v-if="form.remindFrequency != 0">
|
||||
<el-form-item label="提醒时间" prop="remindTime">
|
||||
<el-input v-model="form.remindTime" placeholder="输入小时数" min="0" type="number">
|
||||
<template #prepend>
|
||||
<span>提前</span>
|
||||
</template>
|
||||
<template #append> 小时 </template>
|
||||
</el-input>
|
||||
<el-input
|
||||
v-else-if="form.notifyType == 3"
|
||||
v-model="form.intervalTime"
|
||||
placeholder="输入小时数"
|
||||
min="0"
|
||||
type="number"
|
||||
>
|
||||
<template #prepend>
|
||||
<span>每</span>
|
||||
<span v-if="form.remindFrequency == 1">提前</span>
|
||||
<span v-else-if="form.remindFrequency == 2">每</span>
|
||||
</template>
|
||||
<template #append> 小时 </template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="0" v-if="form.notifyType == 3">
|
||||
<el-form-item label="首次提醒" prop="firstNotifyTime">
|
||||
<el-col :span="8" :offset="0" v-if="form.remindFrequency == 2">
|
||||
<el-form-item label="首次提醒" prop="firstTime">
|
||||
<el-time-picker
|
||||
v-model="form.firstNotifyTime"
|
||||
v-model="form.firstTime"
|
||||
format="HH:mm"
|
||||
value-format="HH:mm"
|
||||
style="width: 100%"
|
||||
:picker-options="enableTimeRange"
|
||||
:picker-options="{
|
||||
selectableRange: '07:00 - 22:00'
|
||||
}"
|
||||
placeholder="选择时间点"
|
||||
/>
|
||||
</el-form-item>
|
||||
@@ -159,15 +143,23 @@
|
||||
</div>
|
||||
<div class="overflow-y-auto pl-15px" style="height: calc(100% - 50px)">
|
||||
<el-timeline class="ml-10px">
|
||||
<el-timeline-item
|
||||
v-for="item in followList"
|
||||
:key="item.followId"
|
||||
placement="bottom"
|
||||
:timestamp="formatDate(item.createTime, 'YYYY-MM-DD HH:mm:ss')"
|
||||
color="#30d1fc"
|
||||
>
|
||||
<div class="font-bold" style="font-size: 16px">{{ item.followUserName }}</div>
|
||||
<div v-dompurify-html="item.content"></div>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-20" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
今天成交了15个
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-15" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
下午跟进了100条线索
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item placement="bottom" timestamp="2025-01-01" color="#30d1fc">
|
||||
<div>张三</div>
|
||||
<div class="mt-10px text-14px" style="line-height: 24px; color: #666">
|
||||
上午跟进了100条线索
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
@@ -184,30 +176,20 @@
|
||||
</template>
|
||||
|
||||
<script setup name="DialogWait">
|
||||
import {
|
||||
createWait,
|
||||
updateWait,
|
||||
getWaitDetail,
|
||||
getFollowWaitPage,
|
||||
followWait
|
||||
} from '@/api/okr/wait'
|
||||
import { getEmployeeSimpleList } from '@/api/pers/employee'
|
||||
import { formatDate } from '@/utils/formatTime'
|
||||
|
||||
const props = defineProps({
|
||||
priorityOptions: {
|
||||
type: Array,
|
||||
default: () => [
|
||||
{ label: '高', value: '1' },
|
||||
{ label: '中', value: '2' },
|
||||
{ label: '低', value: '3' }
|
||||
{ label: '高', value: 1 },
|
||||
{ label: '中', value: 2 },
|
||||
{ label: '低', value: 3 }
|
||||
]
|
||||
},
|
||||
statusOptions: {
|
||||
type: Array,
|
||||
default: () => [
|
||||
{ label: '未完成', value: '1', tagType: 'warning' },
|
||||
{ label: '已关闭', value: '2', tagType: 'success' }
|
||||
{ label: '未完成', value: 1, tagType: 'warning' },
|
||||
{ label: '已关闭', value: 2, tagType: 'success' }
|
||||
]
|
||||
}
|
||||
})
|
||||
@@ -219,10 +201,6 @@ const toolbarConfig = {
|
||||
toolbarKeys: []
|
||||
}
|
||||
|
||||
const enableTimeRange = {
|
||||
selectableRange: '07:00 - 22:00'
|
||||
}
|
||||
|
||||
const show = ref(false)
|
||||
const title = ref('')
|
||||
const formType = ref('create')
|
||||
@@ -231,13 +209,11 @@ const form = ref({})
|
||||
const formLoading = ref(false)
|
||||
const rules = ref({
|
||||
title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
|
||||
endDate: [{ required: true, message: '请选择截止日期', trigger: 'change' }],
|
||||
userList: [{ required: true, message: '请选择执行人', trigger: 'change' }]
|
||||
dueDate: [{ required: true, message: '请选择截止日期', trigger: 'change' }],
|
||||
executorIds: [{ required: true, message: '请选择执行人', trigger: 'change' }]
|
||||
})
|
||||
|
||||
const followList = ref([])
|
||||
|
||||
function open(type, id) {
|
||||
async function open(type, id) {
|
||||
show.value = true
|
||||
title.value = { create: '新增待办', update: '修改待办', do: '更新待办进度' }[type]
|
||||
formType.value = type
|
||||
@@ -245,15 +221,19 @@ function open(type, id) {
|
||||
if (id) {
|
||||
formLoading.value = true
|
||||
try {
|
||||
// 表单数据
|
||||
getWaitDetail(id).then((info) => {
|
||||
form.value = {
|
||||
...info,
|
||||
endDate: formatDate(info.endDate, 'YYYY-MM-DD'),
|
||||
userList: info.userIdList
|
||||
}
|
||||
})
|
||||
getFollowList(id)
|
||||
// 模拟表单数据
|
||||
form.value = {
|
||||
title: '2025年1月20日，张三成交了15个',
|
||||
content: '今天成交了15个',
|
||||
priority: 1,
|
||||
status: 1,
|
||||
dueDate: '2025-01-20',
|
||||
executorIds: [1, 2],
|
||||
remindFrequency: 2,
|
||||
remindTime: 12,
|
||||
firstTime: '09:00'
|
||||
}
|
||||
// form.value = await KpiApi.getKpiDetail(id)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
@@ -261,32 +241,25 @@ function open(type, id) {
|
||||
getOptions()
|
||||
}
|
||||
|
||||
function getFollowList(id) {
|
||||
// 跟进数据
|
||||
getFollowWaitPage({
|
||||
workId: id
|
||||
}).then((data) => {
|
||||
followList.value = data
|
||||
})
|
||||
}
|
||||
|
||||
function getOptions() {
|
||||
getEmployeeSimpleList().then((data) => {
|
||||
employeeOptions.value = data
|
||||
})
|
||||
employeeOptions.value = [
|
||||
{ id: 1, name: '张三' },
|
||||
{ id: 2, name: '李四' },
|
||||
{ id: 3, name: '王五' }
|
||||
]
|
||||
}
|
||||
|
||||
function resetForm() {
|
||||
form.value = {
|
||||
title: undefined,
|
||||
content: undefined,
|
||||
priority: '1',
|
||||
completeStatus: '1',
|
||||
endDate: undefined,
|
||||
userList: [],
|
||||
notifyType: '3',
|
||||
priority: 1,
|
||||
status: 1,
|
||||
dueDate: undefined,
|
||||
executorIds: [],
|
||||
remindFrequency: 2,
|
||||
remindTime: 12,
|
||||
firstNotifyTime: '09:00'
|
||||
firstTime: '09:00'
|
||||
}
|
||||
}
|
||||
|
||||
@@ -305,10 +278,10 @@ async function handleSave() {
|
||||
formLoading.value = true
|
||||
try {
|
||||
if (formType.value === 'create') {
|
||||
await createWait(form.value)
|
||||
await KpiApi.createKpi(form.value)
|
||||
message.success(t('common.createSuccess'))
|
||||
} else {
|
||||
await updateWait(form.value)
|
||||
await KpiApi.updateKpi(form.value)
|
||||
message.success(t('common.updateSuccess'))
|
||||
}
|
||||
show.value = false
|
||||
@@ -320,16 +293,6 @@ async function handleSave() {
|
||||
}
|
||||
|
||||
const employeeOptions = ref([])
|
||||
|
||||
function addDo() {
|
||||
followWait({
|
||||
workId: form.value.workId,
|
||||
content: form.value.followUpContent
|
||||
}).then(() => {
|
||||
message.success('跟进成功')
|
||||
getFollowList(form.value.workId)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@@ -2,23 +2,42 @@
|
||||
<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-popover placement="bottom" width="500px" trigger="click" @show="handleSearchPeroid">
|
||||
<template #reference>
|
||||
<div class="flex items-center border-1px w-300px h-32px p-10px peroid-select">
|
||||
<Icon icon="ep:calendar" style="color: #aaa" />
|
||||
<span class="text-14px ml-10px" style="color: #aaa">
|
||||
{{ searchForm.peroidName ? searchForm.peroidName : '选择周期' }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<div class="mt-10px" style="height: 400px">
|
||||
<el-table :data="peroidList" @row-click="handleSelectPeroid">
|
||||
<el-table-column label="节点名称">
|
||||
<template #default="{ row }">
|
||||
<el-radio v-model="searchForm.peroidId" :label="row.id">{{
|
||||
row.name
|
||||
}}</el-radio>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开始日期" prop="startDate" width="120" />
|
||||
<el-table-column label="截止日期" prop="endDate" width="120" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-button class="ml-10px" type="primary" @click="handleAddNode">新建节点</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button>
|
||||
<el-button type="warning" @click="handleEditOkr(searchForm.peroidId)">
|
||||
修改当前节点
|
||||
</el-button>
|
||||
<el-button type="success" @click="handleUpdateProcess">更新进度</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<OkrTable ref="okrTableRef" canEdit />
|
||||
<OkrTable ref="okrTableRef" @row-click="handleShowOkr" />
|
||||
<DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
|
||||
<DialogOkrInfo ref="dialogOkrInfo" />
|
||||
</div>
|
||||
@@ -28,54 +47,169 @@
|
||||
import OkrTable from './OkrTable.vue'
|
||||
import DialogOkrInfo from './DialogOkrInfo.vue'
|
||||
import DialogOkr from './DialogOkr.vue'
|
||||
import { listToTree } from '@/utils/tree'
|
||||
|
||||
import { getMyNodeTree, getMyOkrPage } from '@/api/okr/okr'
|
||||
|
||||
const message = useMessage()
|
||||
|
||||
const defaultProps = {
|
||||
value: 'nodeId',
|
||||
label: 'nodeName',
|
||||
children: 'children'
|
||||
}
|
||||
|
||||
const okrTableRef = ref(null)
|
||||
const searchForm = ref({
|
||||
nodeId: undefined
|
||||
peroidName: '',
|
||||
peroidId: null
|
||||
})
|
||||
|
||||
const peroidList = ref([])
|
||||
|
||||
// onMounted(() => {
|
||||
handleSearchPeroid()
|
||||
// })
|
||||
onMounted(() => {
|
||||
handleSearchPeroid()
|
||||
if (!searchForm.value.peroidId && peroidList.value.length) {
|
||||
searchForm.value.peroidId = peroidList.value[0].id
|
||||
searchForm.value.peroidName = peroidList.value[0].name
|
||||
}
|
||||
getOkrList()
|
||||
})
|
||||
|
||||
function handleSearchPeroid() {
|
||||
getMyNodeTree().then((resp) => {
|
||||
peroidList.value = listToTree(resp.tree, {
|
||||
id: 'nodeId',
|
||||
pid: 'parentId',
|
||||
children: 'children'
|
||||
})
|
||||
searchForm.value.nodeId = resp.nodeId
|
||||
getOkrList()
|
||||
})
|
||||
async function handleSearchPeroid() {
|
||||
peroidList.value = [
|
||||
{
|
||||
id: 1,
|
||||
name: '2025年寻驾okr',
|
||||
startDate: '2022-01-01',
|
||||
endDate: '2022-01-31'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '2024年寻驾okr',
|
||||
startDate: '2022-02-01',
|
||||
endDate: '2022-02-28'
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
function getOkrList() {
|
||||
getMyOkrPage(searchForm.value).then((resp) => {
|
||||
const list = resp
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(list)
|
||||
})
|
||||
function handleSelectPeroid(row) {
|
||||
searchForm.value.peroidName = row.name
|
||||
searchForm.value.peroidId = row.id
|
||||
handleSearchOkr()
|
||||
}
|
||||
|
||||
function handleSearchOkr() {
|
||||
console.log(searchForm.value)
|
||||
}
|
||||
|
||||
async function getOkrList() {
|
||||
const list = [
|
||||
{
|
||||
id: 1,
|
||||
name: '销售成交额达到1000万，总体成交率15%',
|
||||
process: 60,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 11,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '线索目标',
|
||||
targetType: 'value',
|
||||
isSystem: true,
|
||||
targetNum: 10000,
|
||||
targetValue: false,
|
||||
currentNum: 5000,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
type: 'keyresult',
|
||||
channelName: '抖音',
|
||||
target: '成交数',
|
||||
isSystem: true,
|
||||
targetType: 'value',
|
||||
targetNum: 2500,
|
||||
targetValue: false,
|
||||
currentNum: 500,
|
||||
currentValue: false,
|
||||
process: 60,
|
||||
users: '张三、李四'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '运营消耗预算控制在20万以内，获得10万条线索',
|
||||
process: 80,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 21,
|
||||
type: 'keyresult',
|
||||
target: '本月抖音运营投入相较上月少10%',
|
||||
targetType: 'radio',
|
||||
isSystem: false,
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: false,
|
||||
process: 0,
|
||||
users: ''
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '累计输出作品',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '目标3',
|
||||
process: 40,
|
||||
type: 'object',
|
||||
children: [
|
||||
{
|
||||
id: 31,
|
||||
type: 'keyresult',
|
||||
target: '关键成果1',
|
||||
process: 100,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'radio',
|
||||
targetNum: 0,
|
||||
targetValue: false,
|
||||
currentNum: 0,
|
||||
currentValue: true
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
type: 'keyresult',
|
||||
target: '关键成果2',
|
||||
process: 15,
|
||||
users: '',
|
||||
isSystem: false,
|
||||
targetType: 'value',
|
||||
targetNum: 200,
|
||||
targetValue: false,
|
||||
currentNum: 30,
|
||||
currentValue: false
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
nextTick(() => {
|
||||
okrTableRef.value.prepareData(list)
|
||||
})
|
||||
}
|
||||
|
||||
const dialogOkrInfo = ref(null)
|
||||
// function handleAddNode() {
|
||||
// dialogOkrInfo.value.open('create', null)
|
||||
// }
|
||||
function handleAddNode() {
|
||||
dialogOkrInfo.value.open('create', null)
|
||||
}
|
||||
|
||||
function handleEditOkr() {
|
||||
dialogOkr.value.close()
|
||||
@@ -83,18 +217,13 @@ function handleEditOkr() {
|
||||
}
|
||||
|
||||
function handleUpdateProcess() {
|
||||
okrTableRef.value.updateProcess(searchForm.value.nodeId).then(() => {
|
||||
message.success('更新成功')
|
||||
getOkrList()
|
||||
})
|
||||
message.success('更新进度成功')
|
||||
getOkrList()
|
||||
}
|
||||
|
||||
const dialogOkr = ref(null)
|
||||
function handleShowOkr(id) {
|
||||
dialogOkr.value.open({
|
||||
nodeId: id,
|
||||
canEdit: true
|
||||
})
|
||||
function handleShowOkr(row) {
|
||||
dialogOkr.value.open(row.id)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<div class="flex items-center border-1px w-300px h-32px p-10px peroid-select">
|
||||
<Icon icon="ep:calendar" style="color: #aaa" />
|
||||
<span class="text-14px ml-10px" style="color: #aaa">
|
||||
{{ searchForm.nodeName ? searchForm.nodeName : '选择周期' }}
|
||||
{{ searchForm.peroidName ? searchForm.peroidName : '选择周期' }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
@@ -15,13 +15,11 @@
|
||||
<el-table :data="peroidList" @row-click="handleSelectPeroid">
|
||||
<el-table-column label="节点名称">
|
||||
<template #default="{ row }">
|
||||
<el-radio v-model="searchForm.nodeId" :label="row.nodeId">{{
|
||||
row.nodeName
|
||||
}}</el-radio>
|
||||
<el-radio v-model="searchForm.peroidId" :label="row.id">{{ row.name }}</el-radio>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开始日期" prop="startTime" width="120" />
|
||||
<el-table-column label="截止日期" prop="endTime" width="120" />
|
||||
<el-table-column label="开始日期" prop="startDate" width="120" />
|
||||
<el-table-column label="截止日期" prop="endDate" width="120" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
@@ -29,13 +27,7 @@
|
||||
<el-button class="ml-10px" type="primary" @click="handleAddNode">新建节点</el-button>
|
||||
</div>
|
||||
|
||||
<vue3-tree-org
|
||||
:data="dataList"
|
||||
center
|
||||
collapsable
|
||||
:props="treeProps"
|
||||
@on-node-click="handleClickNode"
|
||||
>
|
||||
<vue3-tree-org :data="dataList" center collapsable @on-node-click="handleClickNode">
|
||||
<template #default="{ node }">
|
||||
<div style="cursor: pointer">
|
||||
<div class="tree-org-node__text node-label">
|
||||
@@ -43,19 +35,15 @@
|
||||
<template #reference>
|
||||
<div>
|
||||
<div style="max-height: 40px; overflow: hidden">{{ node.label }}</div>
|
||||
<div class="tip"> 目标数： {{ getNodePropData(node.id, 'objectiveNum') }}</div>
|
||||
<!-- 执行人 -->
|
||||
<div class="tip">
|
||||
执行人： {{ getNodePropData(node.id, 'executorName') || '无' }}
|
||||
</div>
|
||||
<div class="tip"> 目标数： 3</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<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">
|
||||
<span style="color: #aaa">{{ parseInt(i.progress) }}%</span>
|
||||
<div v-for="i in 3" :key="i" class="mt-5">
|
||||
<span style="color: #aaa">0%</span>
|
||||
<span style="margin-left: 0.5rem">
|
||||
{{ i.objectiveName }}
|
||||
成交数达到10个，且订单的利润不能低于成交价的30%
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -63,12 +51,7 @@
|
||||
</el-popover>
|
||||
</div>
|
||||
<div class="p-5px">
|
||||
<el-progress
|
||||
type="line"
|
||||
:percentage="parseInt(getNodePropData(node.id, 'progress')) || 0"
|
||||
text-inside
|
||||
:stroke-width="12"
|
||||
/>
|
||||
<el-progress type="line" :percentage="80" text-inside :stroke-width="12" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -84,69 +67,95 @@ import 'vue3-tree-org/lib/vue3-tree-org.css'
|
||||
import DialogOkr from './DialogOkr.vue'
|
||||
import DialogOkrInfo from './DialogOkrInfo.vue'
|
||||
|
||||
import { getOkrRelationTree, getOkrRelationTreeChildren } from '@/api/okr/okr'
|
||||
import { listToTree } from '@/utils/tree'
|
||||
|
||||
const dataList = ref({})
|
||||
const helpDataList = ref([])
|
||||
const treeProps = {
|
||||
children: 'children',
|
||||
label: 'nodeName',
|
||||
id: 'nodeId',
|
||||
pid: 'parentId'
|
||||
}
|
||||
const dataList = ref({
|
||||
id: 1,
|
||||
label: '寻驾全年目标',
|
||||
noDragging: true,
|
||||
disabled: true,
|
||||
children: [
|
||||
{
|
||||
id: 2,
|
||||
pid: 1,
|
||||
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({
|
||||
nodeName: '',
|
||||
nodeId: null
|
||||
peroidName: '',
|
||||
peroidId: null
|
||||
})
|
||||
|
||||
const peroidList = ref([])
|
||||
|
||||
handleSearchPeroid()
|
||||
onMounted(() => {
|
||||
handleSearchPeroid()
|
||||
if (!searchForm.value.peroidId && peroidList.value.length) {
|
||||
searchForm.value.peroidId = peroidList.value[0].id
|
||||
searchForm.value.peroidName = peroidList.value[0].name
|
||||
}
|
||||
handleSearchOkr()
|
||||
})
|
||||
|
||||
function handleSearchPeroid() {
|
||||
getOkrRelationTree().then((resp) => {
|
||||
peroidList.value = resp
|
||||
if (resp && resp.length && !searchForm.value.nodeId) {
|
||||
searchForm.value.nodeId = resp[0].nodeId
|
||||
searchForm.value.nodeName = resp[0].nodeName
|
||||
getOkrList()
|
||||
async function handleSearchPeroid() {
|
||||
peroidList.value = [
|
||||
{
|
||||
id: 1,
|
||||
name: '2025年寻驾okr',
|
||||
startDate: '2022-01-01',
|
||||
endDate: '2022-01-31'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '2024年寻驾okr',
|
||||
startDate: '2022-02-01',
|
||||
endDate: '2022-02-28'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getOkrList() {
|
||||
getOkrRelationTreeChildren({
|
||||
nodeId: searchForm.value.nodeId
|
||||
}).then((resp) => {
|
||||
const tree = listToTree(resp, {
|
||||
id: 'nodeId',
|
||||
pid: 'parentId',
|
||||
children: 'children'
|
||||
})
|
||||
helpDataList.value = resp
|
||||
if (tree && tree.length) {
|
||||
dataList.value = tree[0]
|
||||
} else {
|
||||
dataList.value = {}
|
||||
}
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
function handleSelectPeroid(row) {
|
||||
searchForm.value.nodeName = row.nodeName
|
||||
searchForm.value.nodeId = row.nodeId
|
||||
getOkrList()
|
||||
searchForm.value.peroidName = row.name
|
||||
searchForm.value.peroidId = row.id
|
||||
handleSearchOkr()
|
||||
}
|
||||
|
||||
function getNodePropData(nodeId, prop) {
|
||||
const nodeData = helpDataList.value.find((it) => it.nodeId == nodeId)
|
||||
if (nodeData) {
|
||||
return nodeData[prop]
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
function handleSearchOkr() {
|
||||
console.log(searchForm.value)
|
||||
}
|
||||
|
||||
function toggleExpand(data, val) {
|
||||
@@ -168,23 +177,19 @@ function toggleExpand(data, val) {
|
||||
toggleExpand(dataList.value, true)
|
||||
|
||||
const dialogOkr = ref(null)
|
||||
const clickNode = ref(null)
|
||||
const okrId = ref(null)
|
||||
function handleClickNode(node, data) {
|
||||
clickNode.value = data
|
||||
okrId.value = data.id
|
||||
openOkr()
|
||||
}
|
||||
|
||||
function openOkr() {
|
||||
clickNode.value &&
|
||||
dialogOkr.value.open({
|
||||
nodeId: clickNode.value.nodeId,
|
||||
canEdit: !clickNode.value.children || clickNode.value.children.length == 0
|
||||
})
|
||||
okrId.value && dialogOkr.value.open(okrId.value)
|
||||
}
|
||||
|
||||
const dialogOkrInfo = ref(null)
|
||||
function handleAddNode() {
|
||||
clickNode.value = null
|
||||
okrId.value = null
|
||||
dialogOkrInfo.value.open('create', null)
|
||||
}
|
||||
|
||||
|
||||
@@ -15,107 +15,72 @@
|
||||
v-if="!expandedRows[row.id]"
|
||||
class="line1"
|
||||
:style="{
|
||||
top: row.type == '目标' ? '30px' : 0,
|
||||
top: row.type == 'object' ? '30px' : 0,
|
||||
height: getHeight(row, $index)
|
||||
}"
|
||||
></span>
|
||||
<span v-if="row.type == '目标'">【目标】{{ row.name }}</span>
|
||||
<span v-if="row.type === 'object'">【目标】{{ row.name }}</span>
|
||||
<template v-else>
|
||||
<span class="line2"></span>
|
||||
<span>
|
||||
【关键成果】{{ row.channelName }} {{ row.name }}
|
||||
<span v-if="row.resultType == 1">达 {{ row.targetValue }}</span>
|
||||
【关键成果】{{ row.channelName }} {{ row.target }}
|
||||
<span v-if="row.targetType == 'value'">{{ row.targetNum }}</span>
|
||||
</span>
|
||||
<div class="flex items-center mt-10px ml-50px">
|
||||
<span>当前进度：</span>
|
||||
<span v-if="row.isSys || !props.canEdit">{{ row.currentValue }}</span>
|
||||
<span v-if="row.isSystem">{{ row.currentNum }}</span>
|
||||
<el-input
|
||||
v-else-if="row.resultType == 1"
|
||||
v-model="row.currentValue"
|
||||
v-else-if="row.targetType == 'value'"
|
||||
v-model="row.currentNum"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 200px"
|
||||
/>
|
||||
<el-radio-group
|
||||
v-else-if="row.resultType == 2"
|
||||
v-else-if="row.targetType == 'radio'"
|
||||
v-model="row.currentValue"
|
||||
size="small"
|
||||
>
|
||||
<el-radio :value="1">是</el-radio>
|
||||
<el-radio :value="0">否</el-radio>
|
||||
<el-radio :label="true">是</el-radio>
|
||||
<el-radio :label="false">否</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="progress" label="进度" width="200px">
|
||||
<el-table-column prop="process" label="进度" width="200px">
|
||||
<template #default="{ row }">
|
||||
<el-progress :percentage="parseInt(row.progress) || 0" />
|
||||
<el-progress :percentage="row.process" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="executorName" label="执行人" width="200px" />
|
||||
<el-table-column prop="users" label="执行人" width="200px" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="OkrTable">
|
||||
import { updateOkrProgress } from '@/api/okr/okr'
|
||||
|
||||
const emit = defineEmits(['rowClick'])
|
||||
|
||||
const props = defineProps({
|
||||
canEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
const okrList = ref([])
|
||||
const helpList = ref([])
|
||||
|
||||
function prepareData(list) {
|
||||
okrList.value = list
|
||||
helpList.value = []
|
||||
expandedRows.value = {}
|
||||
okrList.value = list.map((item) => {
|
||||
let obj = {
|
||||
id: item.objectiveId,
|
||||
name: item.objectiveName,
|
||||
progress: item.progress,
|
||||
executorName: item.executorName,
|
||||
type: '目标'
|
||||
}
|
||||
helpList.value.push(obj)
|
||||
if (item.keyResults) {
|
||||
obj.children = item.keyResults.map((child) => {
|
||||
let kr = {
|
||||
id: child.keyResultId,
|
||||
keyResultId: child.keyResultId,
|
||||
objectiveId: child.objectiveId,
|
||||
nodeId: child.nodeId,
|
||||
isSys: child.isSys,
|
||||
processId: child.id,
|
||||
name: child.keyResultName,
|
||||
progress: child.progress,
|
||||
executorName: child.executorName,
|
||||
type: '关键成果',
|
||||
resultType: child.resultType,
|
||||
targetValue: child.targetValue,
|
||||
currentValue: Number(child.currentValue)
|
||||
}
|
||||
helpList.value.push(kr)
|
||||
return kr
|
||||
})
|
||||
}
|
||||
return obj
|
||||
okrList.value.map((item) => {
|
||||
helpList.value.push(item)
|
||||
item.children.map((child) => {
|
||||
helpList.value.push(child)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
prepareData,
|
||||
updateProcess
|
||||
prepareData
|
||||
})
|
||||
|
||||
function getHeight(row, index) {
|
||||
if (helpList.value.length - 1 == index || helpList.value[index + 1].type == '目标') {
|
||||
if (helpList.value.length - 1 == index || helpList.value[index + 1].type == 'object') {
|
||||
return '22px'
|
||||
} else {
|
||||
return '100%'
|
||||
@@ -127,25 +92,6 @@ function handleExpand(row, expanded) {
|
||||
expandedRows.value[row.id] = !expanded
|
||||
}
|
||||
|
||||
function updateProcess(nodeId) {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
let arr = []
|
||||
okrList.value.map((item) => {
|
||||
arr = [...arr, ...(item.children || []).map((it) => ({ ...it, id: it.processId }))]
|
||||
})
|
||||
updateOkrProgress({
|
||||
nodeId,
|
||||
keyResultProgressList: arr
|
||||
}).then((resp) => {
|
||||
resolve(resp)
|
||||
})
|
||||
} catch (error) {
|
||||
reject(error)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function handleRowClick(row) {
|
||||
emit('rowClick', row)
|
||||
}
|
||||
|
||||
@@ -14,13 +14,8 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item>
|
||||
<el-select
|
||||
v-model="searchForm.completeStatus"
|
||||
placeholder="选择完成状态"
|
||||
clearable
|
||||
filterable
|
||||
>
|
||||
<el-form-item>
|
||||
<el-select v-model="searchForm.status" placeholder="选择完成状态" clearable filterable>
|
||||
<el-option
|
||||
v-for="item in statusOptions"
|
||||
:key="item.value"
|
||||
@@ -28,16 +23,24 @@
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="searchList"> 搜索</el-button>
|
||||
<el-button type="primary" @click="handleAdd"> 新增</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-tabs v-model="tabIndex" @tab-change="searchList">
|
||||
<div>
|
||||
<Icon icon="ep:info-filled" />
|
||||
<span>开发注意：</span>
|
||||
<div>列表排序 1 状态按照未完成在前、已关闭在后， 2优先级根据高中低排序 3截止日期正序</div>
|
||||
<div>
|
||||
表格全部操作按钮：创建人(修改、删除、催办->微信通知)、执行人(跟进);且与完成状态相关
|
||||
</div>
|
||||
</div>
|
||||
<el-tabs v-model="tabIndex" @tab-click="searchList">
|
||||
<el-tab-pane :name="1">
|
||||
<template #label>
|
||||
<el-badge :value="tabCount.dayEndAgentWorkNum" :max="99" :show-zero="false">
|
||||
<el-badge :value="9" :max="99">
|
||||
<el-tooltip content="截止日在今日及之前的未关闭事项" placement="top" effect="dark">
|
||||
<Icon icon="ep:question-filled" />
|
||||
</el-tooltip>
|
||||
@@ -55,7 +58,7 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :name="3">
|
||||
<template #label>
|
||||
<el-badge :value="tabCount.urgeAgentWorkNum" :max="99" :show-zero="false">
|
||||
<el-badge :value="3" :max="99">
|
||||
<el-tooltip content="指派他人去办的事项" placement="top" effect="dark">
|
||||
<Icon icon="ep:question-filled" />
|
||||
</el-tooltip>
|
||||
@@ -65,7 +68,7 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :name="4">
|
||||
<template #label>
|
||||
<el-badge :value="tabCount.notifyNum" :max="99" :show-zero="false">
|
||||
<el-badge :value="999" :max="99">
|
||||
<el-tooltip content="特指OKR中@我的消息" placement="top" effect="dark">
|
||||
<Icon icon="ep:question-filled" />
|
||||
</el-tooltip>
|
||||
@@ -98,22 +101,20 @@
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="creatorName" label="创建人" />
|
||||
<el-table-column prop="createTime" label="创建日期" :formatter="dateFormatter" />
|
||||
<el-table-column prop="userNameStr" label="执行人" />
|
||||
<el-table-column prop="endDate" label="截止日期" :formatter="dateFormatter" />
|
||||
<el-table-column prop="createUserName" label="创建人" />
|
||||
<el-table-column prop="createDate" label="创建日期" />
|
||||
<el-table-column prop="executorNames" label="执行人" />
|
||||
<el-table-column prop="dueDate" label="截止日期" />
|
||||
<el-table-column label="状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="statusFilter(row.completeStatus)">{{
|
||||
statusNameFilter(row.completeStatus)
|
||||
}}</el-tag>
|
||||
<el-tag :type="statusFilter(row.status)">{{ statusNameFilter(row.status) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="completedDate" label="关闭日期" :formatter="dateFormatter" />
|
||||
<el-table-column prop="completeDate" label="关闭日期" />
|
||||
<el-table-column fixed="right" label="操作" width="140">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-if="row.userIdList.includes(currentUserId) && row.completeStatus == 1"
|
||||
v-if="row.executorIds.includes(currentUserId) && row.status == 1"
|
||||
style="padding: 0; margin-right: 10px"
|
||||
type="primary"
|
||||
text
|
||||
@@ -122,16 +123,7 @@
|
||||
跟进
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="!row.userIdList.includes(currentUserId) && row.completeStatus == 1"
|
||||
style="padding: 0; margin-right: 10px; margin-left: 0"
|
||||
type="primary"
|
||||
text
|
||||
@click="handleNotice(row)"
|
||||
>
|
||||
催办
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.creator == currentUserId && row.completeStatus == 1"
|
||||
v-if="row.createUserId == currentUserId && row.status == 1"
|
||||
style="padding: 0; margin-right: 10px; margin-left: 0"
|
||||
type="primary"
|
||||
text
|
||||
@@ -140,7 +132,16 @@
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.creator == currentUserId && row.completeStatus == 1"
|
||||
v-if="!row.executorIds.includes(currentUserId) && row.status == 1"
|
||||
style="padding: 0; margin-right: 10px; margin-left: 0"
|
||||
type="primary"
|
||||
text
|
||||
@click="handleNotice(row)"
|
||||
>
|
||||
催办
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.createUserId == currentUserId && row.status == 1"
|
||||
style="padding: 0; margin-right: 10px; margin-left: 0"
|
||||
type="danger"
|
||||
text
|
||||
@@ -164,11 +165,8 @@
|
||||
|
||||
<script setup name="WaitTarget">
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
import { dateFormatter } from '@/utils/formatTime'
|
||||
import DialogWait from './DialogWait.vue'
|
||||
|
||||
import { getWaitPage, deleteWait, getWaitCount, urgeWait } from '@/api/okr/wait'
|
||||
|
||||
const userStore = useUserStore()
|
||||
const currentUserId = userStore.getUser.id
|
||||
|
||||
@@ -176,7 +174,7 @@ const message = useMessage()
|
||||
|
||||
const searchForm = ref({
|
||||
title: undefined,
|
||||
completeStatus: undefined,
|
||||
status: undefined,
|
||||
priority: undefined,
|
||||
pageNo: 1,
|
||||
pageSize: 50
|
||||
@@ -188,25 +186,25 @@ const statusOptions = [
|
||||
]
|
||||
|
||||
const statusFilter = (status) => {
|
||||
return statusOptions.find((item) => item.value == status)?.tagType
|
||||
return statusOptions.find((item) => item.value === status)?.tagType
|
||||
}
|
||||
|
||||
const statusNameFilter = (status) => {
|
||||
return statusOptions.find((item) => item.value == status)?.label
|
||||
return statusOptions.find((item) => item.value === status)?.label
|
||||
}
|
||||
|
||||
const priorityOptions = [
|
||||
{ label: '高', value: '1', tagType: 'danger' },
|
||||
{ label: '中', value: '2', tagType: 'warning' },
|
||||
{ label: '低', value: '3', tagType: 'info' }
|
||||
{ label: '高', value: 1, tagType: 'danger' },
|
||||
{ label: '中', value: 2, tagType: 'warning' },
|
||||
{ label: '低', value: 3, tagType: 'info' }
|
||||
]
|
||||
|
||||
const priorityFilter = (priority) => {
|
||||
return priorityOptions.find((item) => item.value == priority)?.tagType
|
||||
return priorityOptions.find((item) => item.value === priority)?.tagType
|
||||
}
|
||||
|
||||
const priorityNameFilter = (priority) => {
|
||||
return priorityOptions.find((item) => item.value == priority)?.label
|
||||
return priorityOptions.find((item) => item.value === priority)?.label
|
||||
}
|
||||
|
||||
const tabIndex = ref(1)
|
||||
@@ -220,21 +218,6 @@ function searchList() {
|
||||
getList()
|
||||
}
|
||||
|
||||
const tabCount = ref({
|
||||
dayEndAgentWorkNum: 0,
|
||||
myAgentWorkNum: 0,
|
||||
urgeAgentWorkNum: 0,
|
||||
notifyNum: 0
|
||||
})
|
||||
function getTabCount() {
|
||||
getWaitCount({
|
||||
title: searchForm.value.title,
|
||||
priority: searchForm.value.priority
|
||||
}).then((res) => {
|
||||
tabCount.value = res
|
||||
})
|
||||
}
|
||||
|
||||
const loading = ref(false)
|
||||
const tableList = ref([])
|
||||
const mentionedList = ref([])
|
||||
@@ -242,18 +225,97 @@ const total = ref(0)
|
||||
function getList() {
|
||||
loading.value = true
|
||||
try {
|
||||
searchForm.value.queryType = tabIndex.value
|
||||
getWaitPage(searchForm.value).then((res) => {
|
||||
tableList.value = res.list
|
||||
total.value = res.total
|
||||
// 用settimeout模拟网络请求
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
})
|
||||
getTabCount()
|
||||
if (tabIndex.value == 4) {
|
||||
mentionedList.value = [
|
||||
{
|
||||
id: 1,
|
||||
content: '我是老六@张三',
|
||||
createUserName: '王二',
|
||||
createDate: '2025-03-07'
|
||||
}
|
||||
]
|
||||
} else {
|
||||
const list = [
|
||||
{
|
||||
id: 1,
|
||||
title: '今日跟进数量达到100',
|
||||
description: '今日成交数量达到10',
|
||||
priority: 1,
|
||||
createUserId: 1,
|
||||
createUserName: '系统',
|
||||
createDate: '2025-03-07',
|
||||
executorIds: ['1818599239840960512'],
|
||||
executorNames: '张三',
|
||||
dueDate: '2025-03-07',
|
||||
status: 1,
|
||||
completeDate: ''
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '今日跟进数量达到100',
|
||||
description: '今日成交数量达到10',
|
||||
priority: 1,
|
||||
createUserId: '1818599239840960512',
|
||||
createUserName: '张三',
|
||||
createDate: '2025-03-07',
|
||||
executorIds: ['1818599239840960512', '123'],
|
||||
executorNames: '张三，李四',
|
||||
dueDate: '2025-02-07',
|
||||
status: 1,
|
||||
completeDate: ''
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: '今日跟进数量达到100',
|
||||
description: '今日成交数量达到10',
|
||||
priority: 1,
|
||||
createUserId: '1818599239840960512',
|
||||
createUserName: '张三',
|
||||
createDate: '2025-03-07',
|
||||
executorIds: ['1818599239840960512'],
|
||||
executorNames: '张三',
|
||||
dueDate: '2025-03-17',
|
||||
status: 2,
|
||||
completeDate: '2025-03-07'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '今日跟进数量达到100',
|
||||
description: '今日成交数量达到10',
|
||||
priority: 1,
|
||||
createUserId: '1818599239840960512',
|
||||
createUserName: '张三',
|
||||
createDate: '2025-03-07',
|
||||
executorIds: ['123'],
|
||||
executorNames: '李四',
|
||||
dueDate: '2025-02-07',
|
||||
status: 1,
|
||||
completeDate: ''
|
||||
}
|
||||
]
|
||||
tableList.value = list.filter((item) => {
|
||||
if (tabIndex.value == 1) {
|
||||
return item.status == 1
|
||||
} else {
|
||||
return item
|
||||
}
|
||||
})
|
||||
}
|
||||
total.value = 1
|
||||
}, 1000)
|
||||
// getWaitTargetList(searchForm.value).then((res) => {
|
||||
// tableList.value = res.data
|
||||
// total.value = res.total
|
||||
// loading.value = false
|
||||
// })
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
function handleDo(row) {
|
||||
waitDialogRef.value.open('do', row.workId)
|
||||
waitDialogRef.value.open('do', row.id)
|
||||
}
|
||||
|
||||
const waitDialogRef = ref()
|
||||
@@ -262,25 +324,18 @@ function handleAdd() {
|
||||
}
|
||||
|
||||
function handleEdit(row) {
|
||||
waitDialogRef.value.open('update', row.workId)
|
||||
waitDialogRef.value.open('update', row.id)
|
||||
}
|
||||
|
||||
function handleDelete(row) {
|
||||
message.confirm('确定删除待办事项吗？').then(() => {
|
||||
deleteWait(row.workId).then(() => {
|
||||
message.success('删除成功')
|
||||
getList()
|
||||
})
|
||||
})
|
||||
console.log(row)
|
||||
}
|
||||
|
||||
function handleNotice(row) {
|
||||
console.log(row)
|
||||
|
||||
message.confirm('即将发送微信通知提醒执行人，是否继续？').then(() => {
|
||||
urgeWait({ workId: row.workId }).then(() => {
|
||||
message.success('发送成功')
|
||||
})
|
||||
message.success('发送成功')
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@@ -16,8 +16,8 @@
|
||||
<el-col :span="12">
|
||||
<el-form-item label="用户性别">
|
||||
<el-radio-group v-model="formData.sex">
|
||||
<el-radio :value="1"> 男 </el-radio>
|
||||
<el-radio :value="2"> 女 </el-radio>
|
||||
<el-radio :label="1"> 男 </el-radio>
|
||||
<el-radio :label="2"> 女 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
@@ -11,8 +11,8 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-radio-group v-model="searchForm.status" @change="handleQuery">
|
||||
<el-radio :value="0"> 在职 </el-radio>
|
||||
<el-radio :value="1"> 离职 </el-radio>
|
||||
<el-radio :label="0"> 在职 </el-radio>
|
||||
<el-radio :label="1"> 离职 </el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<Form ref="formRef" :labelWidth="80" :rules="rules" :schema="schema">
|
||||
<template #sex="form">
|
||||
<el-radio-group v-model="form['sex']">
|
||||
<el-radio :value="1">{{ t('profile.user.man') }}</el-radio>
|
||||
<el-radio :value="2">{{ t('profile.user.woman') }}</el-radio>
|
||||
<el-radio :label="1">{{ t('profile.user.man') }}</el-radio>
|
||||
<el-radio :label="2">{{ t('profile.user.woman') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</Form>
|
||||
|
||||
Reference in New Issue
Block a user