部门修改

.env.base

@@ -4,11 +4,13 @@ VITE_NODE_ENV=development
 VITE_DEV=true
 
 # 请求路径
-VITE_BASE_URL='http://118.31.23.45: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://118.31.23.45:48080/admin-api/system/file/upload'
+VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
 # VITE_UPLOAD_URL='http://114.55.169.15:48080/admin-api/system/file/upload'
 
 # 接口前缀

.env.dev

@@ -7,7 +7,7 @@ VITE_DEV=false
 VITE_BASE_URL='http://localhost:48080'
 
 # 上传路径
-VITE_UPLOAD_URL='http://118.31.23.45:48080/admin-api/system/file/upload'
+VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
 
 # 接口前缀
 VITE_API_BASEPATH=/oa-api

.env.front

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

.env.stage

@@ -7,7 +7,7 @@ VITE_DEV=false
 VITE_BASE_URL='http://api-dashboard.yudao.iocoder.cn'
 
 # 上传路径
-VITE_UPLOAD_URL='http://118.31.23.45:48080/admin-api/system/file/upload'
+VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
 
 # 接口前缀
 VITE_API_BASEPATH=/oa-api

.env.static

@@ -7,7 +7,7 @@ VITE_DEV=false
 VITE_BASE_URL='http://localhost:48080'
 
 # 上传路径
-VITE_UPLOAD_URL='http://118.31.23.45:48080/admin-api/system/file/upload'
+VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
 
 # 接口前缀
 VITE_API_BASEPATH=/oa-api

.env.test

@@ -7,7 +7,7 @@ VITE_DEV=false
 VITE_BASE_URL='http://localhost:48080'
 
 # 上传路径
-VITE_UPLOAD_URL='http://118.31.23.45:48080/admin-api/system/file/upload'
+VITE_UPLOAD_URL='http://47.98.161.246:48080/admin-api/system/file/upload'
 
 # 接口前缀
 VITE_API_BASEPATH=/oa-api

.vscode/settings.json

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

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ss-oa-manage",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "莳松oa管理系统",
   "author": "ss",
   "private": false,
@@ -51,7 +51,7 @@
     "diagram-js": "^11.6.0",
     "echarts": "^5.4.2",
     "echarts-wordcloud": "^2.1.0",
-    "element-plus": "2.3.4",
+    "element-plus": "2.9.4",
     "fast-xml-parser": "^4.2.2",
     "highlight.js": "^11.8.0",
     "intro.js": "^7.0.1",
@@ -72,6 +72,7 @@
     "vue-i18n": "9.2.2",
     "vue-router": "^4.2.1",
     "vue-types": "^5.0.3",
+    "vue3-tree-org": "^4.2.2",
     "vuedraggable": "^4.1.0",
     "web-storage-cache": "^1.1.1",
     "xe-utils": "^3.5.7",

src/App.vue

@@ -2,19 +2,19 @@
 import { isDark } from '@/utils/is'
 import { useAppStore } from '@/store/modules/app'
 import { useDesign } from '@/hooks/web/useDesign'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import routerSearch from '@/components/RouterSearch/index.vue'
+import cache from '@/plugins/cache'
 
 const { getPrefixCls } = useDesign()
 const prefixCls = getPrefixCls('app')
 const appStore = useAppStore()
 const currentSize = computed(() => appStore.getCurrentSize)
 const greyMode = computed(() => appStore.getGreyMode)
-const { wsCache } = useCache()
 
 // 根据浏览器当前主题设置系统主题色
 const setDefaultTheme = () => {
-  let isDarkTheme = wsCache.get(CACHE_KEY.IS_DARK)
+  let isDarkTheme = cache.local.get(CACHE_KEY.IS_DARK)
   if (isDarkTheme === null) {
     isDarkTheme = isDark()
   }

src/api/finance/plan.js

@@ -0,0 +1,41 @@
+import request from '@/config/axios'
+
+// 获取提成结算参数
+export const getCommissionParams = async () => {
+  return await request.get({ url: '/admin-api/oa/percentage/get-percentage-param' })
+}
+
+// 创建
+export const createPlan = (data) => {
+  return request.post({ url: '/admin-api/oa/percentage/create', data, isSubmitForm: true })
+}
+
+// 修改
+export const updatePlan = (data) => {
+  return request.put({ url: '/admin-api/oa/percentage/update', data })
+}
+
+//  修改状态
+export const updatePlanStatus = (data) => {
+  return request.put({ url: '/admin-api/oa/percentage/status/update', data })
+}
+
+// 分页
+export const getPlanPage = (params) => {
+  return request.get({ url: '/admin-api/oa/percentage/page', params })
+}
+
+// 列表
+export const getPlanSimpleList = (params) => {
+  return request.get({ url: '/admin-api/oa/percentage/simple-list', params })
+}
+
+// 详情
+export const getPlanDetail = (id) => {
+  return request.get({ url: '/admin-api/oa/percentage/get', params: { id } })
+}
+
+// 删除
+export const deletePlan = (id) => {
+  return request.delete({ url: '/admin-api/oa/percentage/delete', params: { id } })
+}

src/api/finance/salary.js

@@ -0,0 +1,39 @@
+import request from '@/config/axios'
+
+// 创建
+export const createSalary = (data) => {
+  return request.post({ url: '/admin-api/oa/user-salary/create', data, isSubmitForm: true })
+}
+
+// 修改
+export const updateSalary = (data) => {
+  return request.put({ url: '/admin-api/oa/user-salary/update', data })
+}
+
+//  修改状态
+export const updateSalaryStatus = (data) => {
+  return request.put({ url: '/admin-api/oa/user-salary/status/update', data })
+}
+
+// 分页
+export const getSalaryPage = (params) => {
+  return request.get({ url: '/admin-api/oa/user-salary/page', params })
+}
+
+// 列表
+export const getSalarySimpleList = (params) => {
+  return request.get({ url: '/admin-api/oa/user-salary/simple-list', params })
+}
+
+// 详情
+export const getSalaryDetail = (id) => {
+  return request.get({
+    url: '/admin-api/oa/user-salary/getByEmployeeId',
+    params: { employeeId: id }
+  })
+}
+
+// 删除
+export const deleteSalary = (id) => {
+  return request.delete({ url: '/admin-api/oa/user-salary/delete', params: { id } })
+}

src/api/home/falseDiligence.js

@@ -0,0 +1,21 @@
+import request from '@/config/axios'
+
+// 查询列表
+export const getPage = async (data) => {
+  return await request.post({ url: '/admin-api/oa/dingtalk/attendance/periodPage', data })
+}
+
+// 同步假勤数据
+export const syncFalseDiligence = async (params) => {
+  return await request.get({ url: '/admin-api/oa/dingtalk/attendance/sync', params })
+}
+
+// 修改考勤数据
+export const updateFalseDiligence = async (data) => {
+  return await request.put({ url: '/admin-api/oa/dingtalk/attendance/batchUpdate', data })
+}
+
+// 封存考勤数据
+export const saveFalseDiligence = async (params) => {
+  return await request.get({ url: '/admin-api/oa/dingtalk/attendance/confirm', params })
+}

src/api/home/index.js

@@ -1,20 +0,0 @@
-import request from '@/config/axios'
-// 线索情况
-export const getUserClueCount = async (params) => {
-  return await request.get({ url: '/admin-api/crm/home/get-user-count', params })
-}
-
-// 成交率
-export const getClueSignSignRate = async (params) => {
-  return await request.get({ url: '/admin-api/crm/home/get-sign-rate', params })
-}
-
-// 成交率
-export const getClueSignSignRank = async (params) => {
-  return await request.get({ url: '/admin-api/crm/home/get-sign-top10', params })
-}
-
-// 成交率
-export const getClueFollowRank = async (params) => {
-  return await request.get({ url: '/admin-api/crm/home/get-follow-top10', params })
-}

src/api/home/salary.js

@@ -0,0 +1,56 @@
+import request from '@/config/axios'
+
+// 查询工资条
+export const getSalaryPage = async (params) => {
+  return await request.get({ url: '/admin-api/oa/user-salary-grant/periodPage', params })
+}
+
+// 生成工资条
+export const createSalarySlip = async (data) => {
+  return await request.upload({
+    url: '/admin-api/oa/user-salary-grant/import',
+    data,
+    isSubmitForm: true
+  })
+}
+
+// 导入工资条
+export const importSalarySlip = async (data) => {
+  return await request.upload({ url: '/admin-api/oa/user-salary-grant/import/history', data })
+}
+
+// 修改工资条
+export const updateSalarySlip = async (data) => {
+  return await request.put({ url: '/admin-api/oa/user-salary-grant/batchUpdate', data })
+}
+
+// 封存
+export const sealupSalarySlip = async (data) => {
+  return await request.post({ url: '/admin-api/oa/user-salary-grant/confirm', data })
+}
+
+// 获取考勤模板链接
+export const getLinkAttendance = async () => {
+  return await request.download({
+    url: '/admin-api/oa/user-attendance/get-import-template'
+  })
+}
+
+// 获取奖金模板
+export const getLinkReward = async () => {
+  return await request.download({
+    url: '/admin-api/oa/user-salary-grant/get-import-template'
+  })
+}
+
+// 获取历史工资条模板
+export const getLinkHistorySalary = async () => {
+  return await request.download({
+    url: '/admin-api/oa/user-salary-grant/get-import-template/history'
+  })
+}
+
+// 查询提成明细
+export const getCommissionDetail = async (params) => {
+  return await request.get({ url: '/admin-api/oa/user-salary-grant/detail', params })
+}

src/api/kpi/index.js

@@ -0,0 +1,42 @@
+import request from '@/config/axios'
+
+// 创建
+export const createKpi = (data) => {
+  return request.post({
+    url: '/admin-api/oa/examine-configuration/create',
+    data,
+    isSubmitForm: true
+  })
+}
+
+// 修改
+export const updateKpi = (data) => {
+  return request.put({ url: '/admin-api/oa/examine-configuration/update', data })
+}
+
+//  修改状态
+export const updateKpiStatus = (data) => {
+  return request.put({ url: '/admin-api/oa/examine-configuration/status/update', data })
+}
+
+// 分页
+export const getKpiPage = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-configuration/page', params })
+}
+
+// 详情
+export const getKpiDetail = (id) => {
+  return request.get({ url: '/admin-api/oa/examine-configuration/get', params: { id } })
+}
+
+// 删除
+export const deleteKpi = (id) => {
+  return request.delete({ url: '/admin-api/oa/examine-configuration/delete', params: { id } })
+}
+
+//
+export const getKpiEmployees = () => {
+  return request.get({
+    url: '/admin-api/oa/employee/examinedEmployees'
+  })
+}

src/api/kpi/score.js

@@ -0,0 +1,41 @@
+import request from '@/config/axios'
+
+// 打分数据
+export const getKpiEmployees = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-score/getExamineUserExamineScore', params })
+}
+
+// 保存考勤打分数据
+export const saveKpiScore = (data) => {
+  return request.put({ url: '/admin-api/oa/examine-score/update', data })
+}
+
+// 删除考核项
+export const deleteKpiItem = (params) => {
+  return request.delete({ url: '/admin-api/oa/examine-score/delete', params })
+}
+
+// 考评分页数据
+export const getScorePage = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-period/page', params })
+}
+
+// 封存
+export const saveScoreRecord = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-period/confirm', params })
+}
+
+// 查询周期是否已封存
+export const getKpiPeriodStatus = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-period/getExaminePeriodByPeriod', params })
+}
+
+// 查询考核记录
+export const getScoreRecord = (data) => {
+  return request.post({ url: '/admin-api/oa/examine-result/periodPage', data })
+}
+
+// 查详情
+export const getScoreDetail = (params) => {
+  return request.get({ url: '/admin-api/oa/examine-result/detail', params })
+}

src/api/okr/comment.js

@@ -0,0 +1,38 @@
+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 }
+  })
+}

src/api/okr/okr.js

@@ -0,0 +1,110 @@
+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 }
+  })
+}

src/api/okr/wait.js

@@ -0,0 +1,83 @@
+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 }
+  })
+}

src/api/pers/attendancePlan.js

@@ -0,0 +1,36 @@
+import request from '@/config/axios'
+
+// 创建
+export const createPlan = (data) => {
+  return request.post({ url: '/admin-api/oa/attendance-setting/create', data, isSubmitForm: true })
+}
+
+// 修改
+export const updatePlan = (data) => {
+  return request.put({ url: '/admin-api/oa/attendance-setting/update', data })
+}
+
+//  修改状态
+export const updatePlanStatus = (data) => {
+  return request.put({ url: '/admin-api/oa/attendance-setting/status/update', data })
+}
+
+// 分页
+export const getPlanPage = (params) => {
+  return request.get({ url: '/admin-api/oa/attendance-setting/page', params })
+}
+
+// 列表
+export const getPlanSimpleList = (params) => {
+  return request.get({ url: '/admin-api/oa/attendance-setting/simple-list', params })
+}
+
+// 详情
+export const getPlanDetail = (id) => {
+  return request.get({ url: '/admin-api/oa/attendance-setting/get', params: { id } })
+}
+
+// 删除
+export const deletePlan = (id) => {
+  return request.delete({ url: '/admin-api/oa/attendance-setting/delete', params: { id } })
+}

src/api/pers/employee.js

@@ -0,0 +1,41 @@
+import request from '@/config/axios'
+
+// 创建
+export const createEmployee = (data) => {
+  return request.post({ url: '/admin-api/oa/employee/create', data, isSubmitForm: true })
+}
+
+// 分页
+export const getEmployeeSimpleList = (params) => {
+  return request.get({ url: '/admin-api/oa/employee/list-all-simple', params })
+}
+
+// 修改
+export const updateEmployee = (data) => {
+  return request.put({ url: '/admin-api/oa/employee/update', data })
+}
+
+//  修改状态
+export const updateEmployeeStatus = (data) => {
+  return request.put({ url: '/admin-api/oa/employee/status/update', data })
+}
+
+// 分页
+export const getEmployeePage = (params) => {
+  return request.get({ url: '/admin-api/oa/employee/page', params })
+}
+
+// 详情
+export const getEmployeeDetail = (id) => {
+  return request.get({ url: '/admin-api/oa/employee/get', params: { id } })
+}
+
+// 删除
+export const deleteEmployee = (id) => {
+  return request.delete({ url: '/admin-api/oa/employee/delete', params: { id } })
+}
+
+// 获取钉钉id
+export const getDingUserId = (params) => {
+  return request.get({ url: '/admin-api/oa/employee/getDingTalkUserIdByMobile', params })
+}

src/api/system/app/index.js

@@ -0,0 +1,5 @@
+import request from '@/config/axios'
+
+export const getSimpleAppList = async () => {
+  return await request.get({ url: '/admin-api/system/serviceInstance/simple-list' })
+}

src/api/system/dict/dict.data.ts

@@ -47,3 +47,8 @@ export const deleteDictData = (id: number) => {
 export const exportDictData = (params) => {
   return request.get({ url: '/admin-api/oa/dict-data/export', params })
 }
+
+// 获取通用字典数据
+export const getGeneralSysDictData = (dictType: string) => {
+  return request.get({ url: '/admin-api/system/dict-data/get-by-type', params: { dictType } })
+}

src/api/system/library/index.js

@@ -1,26 +0,0 @@
-import request from '@/config/axios'
-
-// 查询知识库列表
-export const getLibraryPage = (params) => {
-  return request.get({ url: '/admin-api/crm/knowledge-lib/page', params })
-}
-
-// 查询知识库详情
-export const getLibrary = (id) => {
-  return request.get({ url: '/admin-api/crm/knowledge-lib/get?id=' + id })
-}
-
-// 新增知识库
-export const createLibrary = (data) => {
-  return request.post({ url: '/admin-api/crm/knowledge-lib/create', data })
-}
-
-// 修改知识库
-export const updateLibrary = (data) => {
-  return request.put({ url: '/admin-api/crm/knowledge-lib/update', data })
-}
-
-// 删除知识库
-export const deleteLibrary = (id) => {
-  return request.delete({ url: '/admin-api/crm/knowledge-lib/delete?id=' + id })
-}

src/api/system/library/resource.js

@@ -1,26 +0,0 @@
-import request from '@/config/axios'
-
-// 查询资源列表
-export const getResourcePage = (params) => {
-  return request.get({ url: '/admin-api/crm/knowledge-lib-info/page', params })
-}
-
-// 查询资源详情
-export const getResource = (id) => {
-  return request.get({ url: '/admin-api/crm/knowledge-lib-info/get?id=' + id })
-}
-
-// 新增资源
-export const createResource = (data) => {
-  return request.post({ url: '/admin-api/crm/knowledge-lib-info/create', data })
-}
-
-// 修改资源
-export const updateResource = (data) => {
-  return request.put({ url: '/admin-api/crm/knowledge-lib-info/update', data })
-}
-
-// 删除资源
-export const deleteResource = (id) => {
-  return request.delete({ url: '/admin-api/crm/knowledge-lib-info/delete?id=' + id })
-}

src/api/system/notify/message/index.ts

@@ -1,5 +1,4 @@
 import request from '@/config/axios'
-import qs from 'qs'
 
 export interface NotifyMessageVO {
   id: number
@@ -16,35 +15,39 @@ export interface NotifyMessageVO {
 }
 
 // 查询站内信消息列表
-export const getNotifyMessagePage = async (params: PageParam) => {
+export const getNotifyMessagePage = async (params: any) => {
   return await request.get({ url: '/admin-api/system/notify-message/page', params })
 }
 
 // 获得我的站内信分页
-export const getMyNotifyMessagePage = async (params: PageParam) => {
+export const getMyNotifyMessagePage = async (params: any) => {
   return await request.get({ url: '/admin-api/system/notify-message/my-page', params })
 }
 
 // 批量标记已读
-export const updateNotifyMessageRead = async (ids) => {
+export const updateNotifyMessageRead = async (data: any) => {
   return await request.put({
-    url:
-      '/admin-api/system/notify-message/update-read?' +
-      qs.stringify({ ids: ids }, { indices: false })
+    url: '/admin-api/system/notify-message/update-read?',
+    data
   })
 }
 
 // 标记所有站内信为已读
-export const updateAllNotifyMessageRead = async () => {
-  return await request.put({ url: '/admin-api/system/notify-message/update-all-read' })
+export const updateAllNotifyMessageRead = async (data: any) => {
+  return await request.put({ url: '/admin-api/system/notify-message/update-all-read', data })
 }
 
 // 获取当前用户的最新站内信列表
-export const getUnreadNotifyMessageList = async () => {
-  return await request.get({ url: '/admin-api/system/notify-message/get-unread-list' })
+export const getUnreadNotifyMessageList = async (params: any) => {
+  return await request.get({ url: '/admin-api/system/notify-message/get-unread-list', params })
 }
 
 // 获得当前用户的未读站内信数量
-export const getUnreadNotifyMessageCount = async () => {
-  return await request.get({ url: '/admin-api/system/notify-message/get-unread-count' })
+export const getUnreadNotifyMessageCount = async (params: any) => {
+  return await request.get({ url: '/admin-api/system/notify-message/get-unread-count', params })
+}
+
+// 获取详情
+export const getNotifyMessageDetail = async (id: number) => {
+  return await request.get({ url: '/admin-api/system/notify-message/get', params: { id } })
 }

src/components/Crontab/src/Crontab.vue

@@ -542,10 +542,10 @@ const submit = () => {
           <el-form>
             <el-form-item label="类型">
               <el-radio-group v-model="cronValue.second.type">
-                <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 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-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 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 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-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 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 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-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 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-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-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 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 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-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 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-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-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 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-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-group>
             </el-form-item>
             <el-form-item v-if="cronValue.year.type == '1'" label="范围">

src/components/Editor/src/Editor.vue

@@ -24,7 +24,27 @@ const props = defineProps({
     default: () => undefined
   },
   readonly: propTypes.bool.def(false),
-  modelValue: propTypes.string.def('')
+  modelValue: propTypes.string.def(''),
+  toolbarConfig: {
+    type: Object,
+    default: () => ({
+      excludeKeys: [
+        'insertVideo', // 网络视频
+        'insertImage', // 网络图片
+        'insertLink', // 链接
+        'codeBlock', // 代码块
+        'headerSelect', // 标题
+        'blockquote', // 引用
+        'fontFamily', // 字体
+        'todo', // 代办
+        'group-indent', // 缩进
+        'emotion', // 表情
+        'undo', // 撤销
+        'redo', // 重做
+        'fullScreen'
+      ]
+    })
+  }
 })
 
 const emit = defineEmits(['change', 'update:modelValue'])
@@ -212,24 +232,6 @@ const editorStyle = computed(() => {
   }
 })
 
-const toolbarConfig = ref({
-  excludeKeys: [
-    'insertVideo', // 网络视频
-    'insertImage', // 网络图片
-    'insertLink', // 链接
-    'codeBlock', // 代码块
-    'headerSelect', // 标题
-    'blockquote', // 引用
-    'fontFamily', // 字体
-    'todo', // 代办
-    'group-indent', // 缩进
-    'emotion', // 表情
-    'undo', // 撤销
-    'redo', // 重做
-    'fullScreen'
-  ]
-})
-
 // 回调函数
 const handleChange = (editor: IDomEditor) => {
   emit('change', editor)

src/components/Pagination/index.vue

@@ -4,9 +4,8 @@
     v-show="total > 0"
     v-model:current-page="currentPage"
     v-model:page-size="pageSize"
-    :small="small"
     :background="true"
-    :page-sizes="[10, 20, 30, 50, 100]"
+    :page-sizes="[10, 20, 50, 100, 200]"
     :pager-count="pagerCount"
     :total="total"
     class="float-right mt-15px mb-15px"
@@ -43,10 +42,6 @@ const props = defineProps({
   layout: {
     type: String,
     default: 'total, sizes, prev, pager, next, jumper'
-  },
-  small: {
-    type: Boolean,
-    default: false
   }
 })
 

src/components/UploadFile/src/UploadFile.vue

@@ -22,13 +22,16 @@
       class="upload-file-uploader"
     >
       <el-button type="primary"><Icon icon="ep:upload-filled" />选取文件</el-button>
-      <template v-if="isShowTip" #tip>
-        <div style="font-size: 12px">
-          大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
-        </div>
-        <div style="font-size: 12px">
-          格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 的文件
-        </div>
+      <template #tip>
+        <template v-if="isShowTip">
+          <div style="font-size: 12px">
+            大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
+          </div>
+          <div style="font-size: 12px">
+            格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 的文件
+          </div>
+        </template>
+        <slot name="tip"></slot>
       </template>
     </el-upload>
   </div>
@@ -47,7 +50,7 @@ const props = defineProps({
   // fileType: propTypes.array.def(['doc', 'xls', 'ppt', 'txt', 'pdf']), // 文件类型, 例如['png', 'jpg', 'jpeg']
   fileType: propTypes.array.def([]),
   accept: propTypes.string.def('*'),
-  fileSize: propTypes.number.def(5), // 大小限制(MB)
+  fileSize: propTypes.number.def(10), // 大小限制(MB)
   limit: propTypes.number.def(5), // 数量限制
   autoUpload: propTypes.bool.def(true), // 自动上传
   drag: propTypes.bool.def(false), // 拖拽上传

src/config/axios/index.ts

@@ -5,7 +5,7 @@ import { config } from './config'
 const { default_headers } = config
 
 const request = (option: any) => {
-  const { url, method, params, data, headersType, responseType, isSubmitForm } = option
+  const { url, method, params, data, headersType, responseType, isSubmitForm, headers } = option
   return service({
     url: url,
     method,
@@ -14,7 +14,8 @@ const request = (option: any) => {
     data,
     responseType: responseType,
     headers: {
-      'Content-Type': headersType || default_headers
+      'Content-Type': headersType || default_headers,
+      ...headers
     }
   })
 }

src/config/axios/service.ts

@@ -20,7 +20,6 @@ import {
 import errorCode from './errorCode'
 
 import { resetRouter } from '@/router'
-import { useCache } from '@/hooks/web/useCache'
 import cache from '@/plugins/cache'
 
 const { result_code, base_url, request_timeout } = config
@@ -67,7 +66,8 @@ service.interceptors.request.use(
 
     // 设置实例
     const appId = getAppId()
-    if (appId) (config as Recordable).headers['instance-id'] = appId
+    if (appId && !(config as Recordable).headers['instance-id'])
+      (config as Recordable).headers['instance-id'] = appId
 
     const params = config.params || {}
     const data = config.data || false
@@ -79,7 +79,7 @@ service.interceptors.request.use(
       config.data = qs.stringify(data)
     }
     // get参数编码
-    if (config.method?.toUpperCase() === 'GET' && params) {
+    if (config.method?.toUpperCase() === 'GET' && Object.keys(params).length > 0) {
       config.params = {}
       const paramsStr = qs.stringify(params, { allowDots: true })
       if (paramsStr) {
@@ -137,8 +137,8 @@ service.interceptors.response.use(
     const code = data.code || result_code
     // 二进制数据则直接返回
     if (
-      response.request.responseType === 'blob' ||
-      response.request.responseType === 'arraybuffer'
+      response?.request?.responseType === 'blob' ||
+      response?.request?.responseType === 'arraybuffer'
     ) {
       return response.data
     }
@@ -213,11 +213,10 @@ service.interceptors.response.use(
             type: 'warning'
           }).then(() => {
             // 无访问权限，退出登录
-            const { wsCache } = useCache()
-            const tenantId = wsCache.get('TENANT_ID')
-            const appId = wsCache.get('App_ID')
+            const tenantId = cache.local.get('TENANT_ID')
+            const appId = cache.local.get('App_ID')
             resetRouter() // 重置静态路由表
-            wsCache.clear()
+            cache.local.clear()
             removeToken()
             window.location.href = `/oa/login?tenantId=${tenantId}&appId=${appId}`
           })
@@ -259,11 +258,10 @@ const handleAuthorized = () => {
       confirmButtonText: t('login.relogin'),
       type: 'warning'
     }).then(() => {
-      const { wsCache } = useCache()
-      const tenantId = wsCache.get('TENANT_ID')
-      const appId = wsCache.get('App_ID')
+      const tenantId = cache.local.get('TENANT_ID')
+      const appId = cache.local.get('App_ID')
       resetRouter() // 重置静态路由表
-      wsCache.clear()
+      cache.local.clear()
       removeToken()
       isRelogin.show = false
       // 干掉token后再走一次路由让它过router.beforeEach的校验

src/directives/permission/hasPermi.ts

@@ -1,14 +1,14 @@
 import type { App } from 'vue'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
+import cache from '@/plugins/cache'
 
 const { t } = useI18n() // 国际化
 
 export function hasPermi(app: App<Element>) {
   app.directive('hasPermi', (el, binding) => {
-    const { wsCache } = useCache()
     const { value } = binding
     const all_permission = '*:*:*'
-    const permissions = wsCache.get(CACHE_KEY.USER).permissions
+    const permissions = cache.local.get(CACHE_KEY.USER)?.permissions || []
 
     if (value && value instanceof Array && value.length > 0) {
       const permissionFlag = value

src/directives/permission/hasRole.ts

@@ -1,14 +1,14 @@
 import type { App } from 'vue'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
+import cache from '@/plugins/cache'
 
 const { t } = useI18n() // 国际化
 
 export function hasRole(app: App<Element>) {
   app.directive('hasRole', (el, binding) => {
-    const { wsCache } = useCache()
     const { value } = binding
     const super_admin = 'admin'
-    const roles = wsCache.get(CACHE_KEY.USER).roles
+    const roles = cache.local.get(CACHE_KEY.USER).roles
 
     if (value && value instanceof Array && value.length > 0) {
       const roleFlag = value

src/layout/components/Message/src/Message.vue

@@ -1,7 +1,9 @@
 <script lang="ts" name="Message" setup>
 import { formatDate } from '@/utils/formatTime'
-import * as NotifyMessageApi from '@/api/system/notify/message'
+// import * as NotifyMessageApi from '@/api/system/notify/message'
+// import { useUserStore } from '@/store/modules/user'
 
+// const userStore = useUserStore()
 const { push } = useRouter()
 const activeName = ref('notice')
 const unreadCount = ref(0) // 未读消息数量
@@ -9,17 +11,21 @@ const list = ref<any[]>([]) // 消息列表
 
 // 获得消息列表
 const getList = async () => {
-  list.value = await NotifyMessageApi.getUnreadNotifyMessageList()
+  // list.value = await NotifyMessageApi.getUnreadNotifyMessageList({
+  //   roleId: userStore.getUser?.currentRole
+  // })
   // 强制设置 unreadCount 为 0，避免小红点因为轮询太慢，不消除
   unreadCount.value = 0
 }
 
 // 获得未读消息数
-const getUnreadCount = async () => {
-  NotifyMessageApi.getUnreadNotifyMessageCount().then((data) => {
-    unreadCount.value = data
-  })
-}
+// const getUnreadCount = async () => {
+// NotifyMessageApi.getUnreadNotifyMessageCount({ roleId: userStore.getUser?.currentRole }).then(
+//   (data) => {
+//     unreadCount.value = data
+//   }
+// )
+// }
 
 // 跳转我的站内信
 const goMyList = () => {
@@ -32,7 +38,7 @@ const goMyList = () => {
 const msgInterval = ref<any>(null)
 onMounted(() => {
   // 首次加载小红点
-  getUnreadCount()
+  // getUnreadCount()
   // 轮询刷新小红点
   // msgInterval.value = setInterval(() => {
   //   getUnreadCount()

src/layout/components/Setting/src/Setting.vue

@@ -2,7 +2,7 @@
 // import { ElMessage } from 'element-plus'
 // import { useClipboard, useCssVar } from '@vueuse/core'
 import { useCssVar } from '@vueuse/core'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { useDesign } from '@/hooks/web/useDesign'
 
 import { setCssVar, trim } from '@/utils'
@@ -13,6 +13,7 @@ import ColorRadioPicker from './components/ColorRadioPicker.vue'
 // import InterfaceDisplay from './components/InterfaceDisplay.vue'
 // import LayoutRadioPicker from './components/LayoutRadioPicker.vue'
 import { useWatermark } from '@/hooks/web/useWatermark'
+import cache from '@/plugins/cache'
 
 const { setWatermark } = useWatermark()
 
@@ -195,10 +196,9 @@ watch(
 
 // 清空缓存
 const clear = () => {
-  const { wsCache } = useCache()
-  wsCache.delete(CACHE_KEY.LAYOUT)
-  wsCache.delete(CACHE_KEY.THEME)
-  wsCache.delete(CACHE_KEY.IS_DARK)
+  cache.local.delete(CACHE_KEY.LAYOUT)
+  cache.local.delete(CACHE_KEY.THEME)
+  cache.local.delete(CACHE_KEY.IS_DARK)
   window.location.reload()
 }
 </script>

src/layout/components/UserInfo/src/UserInfo.vue

@@ -1,7 +1,7 @@
 <script lang="ts" name="UserInfo" setup>
 import { ElMessageBox } from 'element-plus'
 
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { useDesign } from '@/hooks/web/useDesign'
 import avatarImg from '@/assets/imgs/avatar.gif'
 import { useUserStore } from '@/store/modules/user'
@@ -9,11 +9,10 @@ import { useTagsViewStore } from '@/store/modules/tagsView'
 import { getTenantId, getAppId } from '@/utils/auth'
 
 import { Setting } from '@/layout/components/Setting'
+import cache from '@/plugins/cache'
 
 const { t } = useI18n()
 
-const { wsCache } = useCache()
-
 const { push, replace } = useRouter()
 
 const userStore = useUserStore()
@@ -24,7 +23,7 @@ const { getPrefixCls } = useDesign()
 
 const prefixCls = getPrefixCls('user-info')
 
-const user = wsCache.get(CACHE_KEY.USER)
+const user = cache.local.get(CACHE_KEY.USER)
 
 const avatar = user.user.avatar ? user.user.avatar : avatarImg
 

src/permission.js

@@ -1,6 +1,6 @@
 import router from './router'
 import { isRelogin } from '@/config/axios/service'
-import { getAccessToken } from '@/utils/auth'
+import { getAccessToken, removeToken } from '@/utils/auth'
 import { useTitle } from '@/hooks/web/useTitle'
 import { useNProgress } from '@/hooks/web/useNProgress'
 import { usePageLoading } from '@/hooks/web/usePageLoading'
@@ -8,6 +8,7 @@ import { useDictStoreWithOut } from '@/store/modules/dict'
 import { useUserStoreWithOut } from '@/store/modules/user'
 import { usePermissionStoreWithOut } from '@/store/modules/permission'
 import { getTenantId, getAppId } from '@/utils/auth'
+import cache from '@/plugins/cache'
 
 const { start, done } = useNProgress()
 
@@ -19,44 +20,53 @@ const whiteList = ['/login', '/social-login', '/auth-redirect', '/bind', '/regis
 router.beforeEach(async (to, from, next) => {
   start()
   loadStart()
-  if (getAccessToken()) {
-    if (to.path === '/login') {
-      next({ path: '/' })
-    } else {
-      // 获取所有字典
-      const dictStore = useDictStoreWithOut()
-      const userStore = useUserStoreWithOut()
-      const permissionStore = usePermissionStoreWithOut()
-      if (!dictStore.getIsSetDict) {
-        await dictStore.setDictMap()
-      }
-      if (!userStore.getIsSetUser) {
-        isRelogin.show = true
-        await userStore.setUserInfoAction()
-        isRelogin.show = false
-        // 后端过滤菜单
-        await permissionStore.generateRoutes()
-        permissionStore.getAddRouters.forEach((route) => {
-          router.addRoute(route) // 动态添加可访问路由表
-        })
-        const redirectPath = from.query.redirect || to.path
-        const redirect = decodeURIComponent(redirectPath)
-        const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
-        next(nextData)
-      } else {
-        next()
-      }
-    }
+  if (getAppId() && to.query?.appId && getAppId() != to.query?.appId) {
+    removeToken()
+    cache?.local?.delete('appInfo')
+    cache?.local?.delete('roleRouters')
+    cache?.local?.delete('user')
+    cache?.local?.delete('App_ID')
+    next(`/login?tenantId=${to.query?.tenantId}&appId=${to.query?.appId}`)
   } else {
-    if (whiteList.indexOf(to.path) !== -1) {
-      next()
-    } else {
-      const tenantId = getTenantId()
-      const appId = getAppId()
-      if (tenantId && appId) {
-        next(`/oa/login?tenantId=${tenantId}&appId=${appId}&redirect=${to.fullPath}`) // 否则全部重定向到登录页
+    if (getAccessToken()) {
+      if (to.path === '/login') {
+        next({ path: '/' })
       } else {
-        next(`/oa/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
+        // 获取所有字典
+        const dictStore = useDictStoreWithOut()
+        const userStore = useUserStoreWithOut()
+        const permissionStore = usePermissionStoreWithOut()
+        if (!dictStore.getIsSetDict) {
+          await dictStore.setDictMap()
+        }
+        if (!userStore.getIsSetUser) {
+          isRelogin.show = true
+          await userStore.setUserInfoAction()
+          isRelogin.show = false
+          // 后端过滤菜单
+          await permissionStore.generateRoutes()
+          permissionStore.getAddRouters.forEach((route) => {
+            router.addRoute(route) // 动态添加可访问路由表
+          })
+          const redirectPath = from.query.redirect || to.path
+          const redirect = decodeURIComponent(redirectPath)
+          const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
+          next(nextData)
+        } else {
+          next()
+        }
+      }
+    } else {
+      if (whiteList.indexOf(to.path) !== -1) {
+        next()
+      } else {
+        const tenantId = getTenantId()
+        const appId = getAppId()
+        if (tenantId && appId) {
+          next(`/oa/login?tenantId=${tenantId}&appId=${appId}&redirect=${to.fullPath}`) // 否则全部重定向到登录页
+        } else {
+          next(`/oa/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
+        }
       }
     }
   }

src/plugins/cache/index.js

@@ -26,7 +26,7 @@ const sessionCache = {
     let storage = storageStr ? JSON.parse(storageStr) : {}
     return storage[key]
   },
-  remove(key) {
+  delete(key) {
     if (!sessionStorage) {
       return null
     }
@@ -62,7 +62,7 @@ const localCache = {
     let storage = storageStr ? JSON.parse(storageStr) : {}
     return storage[key]
   },
-  remove(key) {
+  delete(key) {
     if (!localStorage) {
       return null
     }
@@ -73,6 +73,10 @@ const localCache = {
     let storage = storageStr ? JSON.parse(storageStr) : {}
     delete storage[key]
     localStorage.setItem(name, JSON.stringify(storage))
+  },
+  clear() {
+    let storage = {}
+    localStorage.setItem(name, JSON.stringify(storage))
   }
 }
 

src/router/modules/remaining.ts

@@ -110,7 +110,9 @@ const remainingRouter: AppRouteRecordRaw[] = [
     path: '/Basic',
     component: Layout,
     name: 'Basic',
-    meta: {},
+    meta: {
+      title: '菜单管理'
+    },
     redirect: '/Basic/menu',
     children: [
       {
@@ -119,11 +121,23 @@ const remainingRouter: AppRouteRecordRaw[] = [
         name: 'Menu',
         meta: {
           canTo: true,
-          hidden: true,
+          // hidden: true,
           noTagsView: false,
           icon: 'ep:user',
           title: '菜单管理'
         }
+      },
+      {
+        path: 'okr',
+        component: () => import('@/views/OKR/Management/index.vue'),
+        name: 'OkrManagement',
+        meta: {
+          canTo: true,
+          // hidden: true,
+          noTagsView: false,
+          icon: 'ep:user',
+          title: 'Okr管理'
+        }
       }
     ]
   },

src/store/modules/app.ts

@@ -2,14 +2,13 @@ import { defineStore } from 'pinia'
 import { store } from '../index'
 import { setCssVar, humpToUnderline } from '@/utils'
 import { ElMessage } from 'element-plus'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { ElementPlusSize } from '@/types/elementPlus'
 import { LayoutType } from '@/types/layout'
 import { ThemeTypes } from '@/types/theme'
 import { getAppInfo } from '@/api/login'
 
-const { wsCache } = useCache()
-
+import cache from '@/plugins/cache'
 interface AppState {
   breadcrumb: boolean
   breadcrumbIcon: boolean
@@ -46,7 +45,7 @@ export const useAppStore = defineStore('app', {
       sizeMap: ['default', 'large', 'small'],
       mobile: false, // 是否是移动端
       title: import.meta.env.VITE_APP_TITLE, // 标题
-      appInfo: wsCache.get('appInfo'),
+      appInfo: cache.local.get('appInfo'),
       pageLoading: false, // 路由跳转loading
 
       breadcrumb: true, // 面包屑
@@ -57,19 +56,19 @@ export const useAppStore = defineStore('app', {
       screenfull: true, // 全屏图标
       size: false, // 尺寸图标
       locale: false, // 多语言图标
-      message: true, // 消息图标
+      message: false, // 消息图标
       tagsView: true, // 标签页
       tagsViewIcon: false, // 是否显示标签图标
       logo: true, // logo
       fixedHeader: true, // 固定toolheader
       footer: false, // 显示页脚
       greyMode: false, // 是否开始灰色模式，用于特殊悼念日
-      fixedMenu: wsCache.get('fixedMenu') || false, // 是否固定菜单
+      fixedMenu: cache.local.get('fixedMenu') || false, // 是否固定菜单
 
-      layout: wsCache.get(CACHE_KEY.LAYOUT) || 'classic', // layout布局
-      isDark: wsCache.get(CACHE_KEY.IS_DARK) || false, // 是否是暗黑模式
-      currentSize: wsCache.get('default') || 'default', // 组件尺寸
-      theme: wsCache.get(CACHE_KEY.THEME) || {
+      layout: cache.local.get(CACHE_KEY.LAYOUT) || 'classic', // layout布局
+      isDark: cache.local.get(CACHE_KEY.IS_DARK) || false, // 是否是暗黑模式
+      currentSize: cache.local.get('default') || 'default', // 组件尺寸
+      theme: cache.local.get(CACHE_KEY.THEME) || {
         // 主题色
         elColorPrimary: '#409eff',
         // 左侧菜单边框颜色
@@ -225,7 +224,7 @@ export const useAppStore = defineStore('app', {
       this.greyMode = greyMode
     },
     setFixedMenu(fixedMenu: boolean) {
-      wsCache.set('fixedMenu', fixedMenu)
+      cache.local.set('fixedMenu', fixedMenu)
       this.fixedMenu = fixedMenu
     },
     setPageLoading(pageLoading: boolean) {
@@ -237,7 +236,7 @@ export const useAppStore = defineStore('app', {
         return
       }
       this.layout = layout
-      wsCache.set(CACHE_KEY.LAYOUT, this.layout)
+      cache.local.set(CACHE_KEY.LAYOUT, this.layout)
     },
     setTitle(title: string) {
       this.title = title
@@ -251,18 +250,18 @@ export const useAppStore = defineStore('app', {
         document.documentElement.classList.add('light')
         document.documentElement.classList.remove('dark')
       }
-      wsCache.set(CACHE_KEY.IS_DARK, this.isDark)
+      cache.local.set(CACHE_KEY.IS_DARK, this.isDark)
     },
     setCurrentSize(currentSize: ElementPlusSize) {
       this.currentSize = currentSize
-      wsCache.set('currentSize', this.currentSize)
+      cache.local.set('currentSize', this.currentSize)
     },
     setMobile(mobile: boolean) {
       this.mobile = mobile
     },
     setTheme(theme: ThemeTypes) {
       this.theme = Object.assign(this.theme, theme)
-      wsCache.set(CACHE_KEY.THEME, this.theme)
+      cache.local.set(CACHE_KEY.THEME, this.theme)
     },
     setCssVarTheme() {
       for (const key in this.theme) {
@@ -274,7 +273,7 @@ export const useAppStore = defineStore('app', {
     },
     async setAppInfo(appId: number) {
       const appInfo = await getAppInfo(appId)
-      wsCache.set('appInfo', appInfo)
+      cache.local.set('appInfo', appInfo)
       this.appInfo = appInfo
       return appInfo
     }

src/store/modules/dict.ts

@@ -2,9 +2,9 @@ import { defineStore } from 'pinia'
 import { store } from '../index'
 // @ts-ignore
 import { DictDataVO } from '@/api/system/dict/types'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
-const { wsCache } = useCache('sessionStorage')
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { listSimpleDictData } from '@/api/system/dict/dict.data'
+import cache from '@/plugins/cache'
 
 export interface DictValueType {
   value: any
@@ -28,7 +28,7 @@ export const useDictStore = defineStore('dict', {
   }),
   getters: {
     getDictMap(): Recordable {
-      const dictMap = wsCache.get(CACHE_KEY.DICT_CACHE)
+      const dictMap = cache.session.get(CACHE_KEY.DICT_CACHE)
       if (dictMap) {
         this.dictMap = dictMap
       }
@@ -40,7 +40,7 @@ export const useDictStore = defineStore('dict', {
   },
   actions: {
     async setDictMap() {
-      const dictMap = wsCache.get(CACHE_KEY.DICT_CACHE)
+      const dictMap = cache.session.get(CACHE_KEY.DICT_CACHE)
       if (dictMap) {
         this.dictMap = dictMap
         this.isSetDict = true
@@ -64,7 +64,7 @@ export const useDictStore = defineStore('dict', {
         })
         this.dictMap = dictDataMap
         this.isSetDict = true
-        wsCache.set(CACHE_KEY.DICT_CACHE, dictDataMap, { exp: 60 }) // 60 秒 过期
+        cache.session.set(CACHE_KEY.DICT_CACHE, dictDataMap) // 60 秒 过期
       }
     },
     getDictByType(type: string) {
@@ -74,7 +74,7 @@ export const useDictStore = defineStore('dict', {
       return this.dictMap[type]
     },
     async resetDict() {
-      wsCache.delete(CACHE_KEY.DICT_CACHE)
+      cache.session.delete(CACHE_KEY.DICT_CACHE)
       const res = await listSimpleDictData()
       // 设置数据
       const dictDataMap = new Map<string, any>()
@@ -94,7 +94,7 @@ export const useDictStore = defineStore('dict', {
       })
       this.dictMap = dictDataMap
       this.isSetDict = true
-      wsCache.set(CACHE_KEY.DICT_CACHE, dictDataMap, { exp: 60 }) // 60 秒 过期
+      cache.session.set(CACHE_KEY.DICT_CACHE, dictDataMap) // 60 秒 过期
     }
   }
 })

src/store/modules/permission.ts

@@ -3,9 +3,9 @@ import { store } from '../index'
 import { cloneDeep } from 'lodash-es'
 import remainingRouter from '@/router/modules/remaining'
 import { generateRoute, flatMultiLevelRoutes } from '@/utils/routerHelper'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 
-const { wsCache } = useCache()
+import cache from '@/plugins/cache'
 
 export interface PermissionState {
   routers: AppRouteRecordRaw[]
@@ -34,8 +34,8 @@ export const usePermissionStore = defineStore('permission', {
     async generateRoutes(): Promise<unknown> {
       return new Promise<void>(async (resolve) => {
         let res: AppCustomRouteRecordRaw[] = []
-        if (wsCache.get(CACHE_KEY.ROLE_ROUTERS)) {
-          res = wsCache.get(CACHE_KEY.ROLE_ROUTERS) as AppCustomRouteRecordRaw[]
+        if (cache.local.get(CACHE_KEY.ROLE_ROUTERS)) {
+          res = cache.local.get(CACHE_KEY.ROLE_ROUTERS) as AppCustomRouteRecordRaw[]
         }
         const routerMap: AppRouteRecordRaw[] = generateRoute(res)
         // 动态路由，404一定要放到最后面

src/store/modules/user.ts

@@ -1,10 +1,10 @@
 import { store } from '../index'
 import { defineStore } from 'pinia'
 import { getAccessToken, removeToken } from '@/utils/auth'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { getInfo, loginOut } from '@/api/login'
 
-const { wsCache } = useCache()
+import cache from '@/plugins/cache'
 
 interface UserVO {
   id: number
@@ -49,21 +49,21 @@ export const useUserStore = defineStore('admin-user', {
         this.resetState()
         return null
       }
-      let userInfo = wsCache.get(CACHE_KEY.USER)
-      if (!userInfo) {
+      let userInfo = cache.local.get(CACHE_KEY.USER)
+      if (!userInfo || !userInfo?.menus || userInfo.menus.length == 0) {
         userInfo = await getInfo({})
       }
       this.permissions = userInfo.permissions
       this.roles = userInfo.roles
       this.user = userInfo.user
       this.isSetUser = true
-      wsCache.set(CACHE_KEY.USER, userInfo)
-      wsCache.set(CACHE_KEY.ROLE_ROUTERS, userInfo.menus)
+      cache.local.set(CACHE_KEY.USER, userInfo)
+      cache.local.set(CACHE_KEY.ROLE_ROUTERS, userInfo.menus)
     },
     async loginOut() {
       await loginOut()
       removeToken()
-      wsCache.clear()
+      cache.local.clear()
       this.resetState()
     },
     resetState() {
@@ -77,7 +77,7 @@ export const useUserStore = defineStore('admin-user', {
       }
     },
     refresh() {
-      wsCache.delete(CACHE_KEY.USER)
+      cache.local.delete(CACHE_KEY.USER)
       this.resetState()
       window.location.href = ''
     }

src/styles/index.scss

@@ -69,3 +69,32 @@
     width: 100%;
   }
 }
+
+
+.dialog-okr {
+  width: 94vw;
+  height: 94vh;
+  max-width: 1800px;
+  max-height: 1000px;
+  margin: 0;
+}
+.dialog-okr .el-dialog__header {
+  padding: 0 !important;
+}
+.okr-info-dialog {
+  .el-dialog__body {
+    padding-top: 0;
+  }
+}
+
+/* 去除 Chrome、Safari、Edge、Opera 中的指示器 */
+.el-input__inner::-webkit-outer-spin-button,
+.el-input__inner::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* 去除 Firefox 中的指示器 */
+.el-input__inner[type='number'] {
+  -moz-appearance: textfield;
+}

src/utils/auth.ts

@@ -1,8 +1,7 @@
-import { useCache } from '@/hooks/web/useCache'
 import { TokenType } from '@/api/login/types'
 import { decrypt, encrypt } from '@/utils/jsencrypt'
 
-const { wsCache } = useCache()
+import cache from '@/plugins/cache'
 
 const AccessTokenKey = 'ACCESS_TOKEN'
 const RefreshTokenKey = 'REFRESH_TOKEN'
@@ -10,24 +9,26 @@ const RefreshTokenKey = 'REFRESH_TOKEN'
 // 获取token
 export const getAccessToken = () => {
   // 此处与TokenKey相同，此写法解决初始化时Cookies中不存在TokenKey报错
-  return wsCache.get(AccessTokenKey) ? wsCache.get(AccessTokenKey) : wsCache.get('ACCESS_TOKEN')
+  return cache.local.get(AccessTokenKey)
+    ? cache.local.get(AccessTokenKey)
+    : cache.local.get('ACCESS_TOKEN')
 }
 
 // 刷新token
 export const getRefreshToken = () => {
-  return wsCache.get(RefreshTokenKey)
+  return cache.local.get(RefreshTokenKey)
 }
 
 // 设置token
 export const setToken = (token: TokenType) => {
-  wsCache.set(RefreshTokenKey, token.refreshToken, { exp: token.expiresTime })
-  wsCache.set(AccessTokenKey, token.accessToken)
+  cache.local.set(RefreshTokenKey, token.refreshToken)
+  cache.local.set(AccessTokenKey, token.accessToken)
 }
 
 // 删除token
 export const removeToken = () => {
-  wsCache.delete(AccessTokenKey)
-  wsCache.delete(RefreshTokenKey)
+  cache.local.delete(AccessTokenKey)
+  cache.local.delete(RefreshTokenKey)
 }
 
 /** 格式化token（jwt格式） */
@@ -47,7 +48,7 @@ export type LoginFormType = {
 }
 
 export const getLoginForm = () => {
-  const loginForm: LoginFormType = wsCache.get(LoginFormKey)
+  const loginForm: LoginFormType = cache.local.get(LoginFormKey)
   if (loginForm) {
     loginForm.password = decrypt(loginForm.password) as string
   }
@@ -56,11 +57,11 @@ export const getLoginForm = () => {
 
 export const setLoginForm = (loginForm: LoginFormType) => {
   loginForm.password = encrypt(loginForm.password) as string
-  wsCache.set(LoginFormKey, loginForm, { exp: 30 * 24 * 60 * 60 })
+  cache.local.set(LoginFormKey, loginForm)
 }
 
 export const removeLoginForm = () => {
-  wsCache.delete(LoginFormKey)
+  cache.local.delete(LoginFormKey)
 }
 
 // ========== 租户相关 ==========
@@ -69,52 +70,52 @@ const TenantIdKey = 'TENANT_ID'
 const TenantNameKey = 'TENANT_NAME'
 
 export const getTenantName = () => {
-  return wsCache.get(TenantNameKey)
+  return cache.local.get(TenantNameKey)
 }
 
 export const setTenantName = (username: string) => {
-  wsCache.set(TenantNameKey, username, { exp: 30 * 24 * 60 * 60 })
+  cache.local.set(TenantNameKey, username)
 }
 
 export const removeTenantName = () => {
-  wsCache.delete(TenantNameKey)
+  cache.local.delete(TenantNameKey)
 }
 
 export const getTenantId = () => {
-  return wsCache.get(TenantIdKey)
+  return cache.local.get(TenantIdKey)
 }
 
 export const setTenantId = (username: string) => {
-  wsCache.set(TenantIdKey, username)
+  cache.local.set(TenantIdKey, username)
 }
 
 export const removeTenantId = () => {
-  wsCache.delete(TenantIdKey)
+  cache.local.delete(TenantIdKey)
 }
 
 const AppIdKey = 'App_ID'
 const AppNameKey = 'App_NAME'
 
 export const getAPPName = () => {
-  return wsCache.get(AppNameKey)
+  return cache.local.get(AppNameKey)
 }
 
 export const setAppName = (name: string) => {
-  wsCache.set(AppNameKey, name, { exp: 30 * 24 * 60 * 60 })
+  cache.local.set(AppNameKey, name)
 }
 
 export const removeAppName = () => {
-  wsCache.delete(AppNameKey)
+  cache.local.delete(AppNameKey)
 }
 
 export const getAppId = () => {
-  return wsCache.get(AppIdKey)
+  return cache.local.get(AppIdKey)
 }
 
 export const setAppId = (id: number) => {
-  wsCache.set(AppIdKey, id)
+  cache.local.set(AppIdKey, id)
 }
 
 export const removeAppId = () => {
-  wsCache.delete(AppIdKey)
+  cache.local.delete(AppIdKey)
 }

src/utils/download.ts

@@ -1,6 +1,7 @@
 const download0 = (data: Blob, fileName: string, mineType: string) => {
   // 创建 blob
   const blob = new Blob([data], { type: mineType })
+
   // 创建 href 超链接，点击进行下载
   window.URL = window.URL || window.webkitURL
   const href = URL.createObjectURL(blob)
@@ -15,7 +16,11 @@ const download0 = (data: Blob, fileName: string, mineType: string) => {
 const download = {
   // 下载 Excel 方法
   excel: (data: Blob, fileName: string) => {
-    download0(data, fileName, 'application/vnd.ms-excel')
+    download0(
+      data,
+      fileName,
+      'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8'
+    )
   },
   // 下载 Word 方法
   word: (data: Blob, fileName: string) => {

src/utils/index.ts

@@ -213,7 +213,7 @@ export const fenToYuan = (amount: string | number): number => {
 export const removeNullField = (obj: Object) => {
   for (const key in obj) {
     if (Object.prototype.hasOwnProperty.call(obj, key)) {
-      if (obj[key] == '') {
+      if (obj[key] === '' || obj[key] === null || obj[key] === undefined) {
         delete obj[key]
       }
     }

src/utils/permission.ts

@@ -1,4 +1,5 @@
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
+import cache from '@/plugins/cache'
 
 const { t } = useI18n() // 国际化
 
@@ -9,10 +10,9 @@ const { t } = useI18n() // 国际化
  */
 export function checkPermi(value: string[]) {
   if (value && value instanceof Array && value.length > 0) {
-    const { wsCache } = useCache()
     const permissionDatas = value
     const all_permission = '*:*:*'
-    const permissions = wsCache.get(CACHE_KEY.USER).permissions
+    const permissions = cache.local.get(CACHE_KEY.USER).permissions
     const hasPermission = permissions.some((permission) => {
       return all_permission === permission || permissionDatas.includes(permission)
     })
@@ -30,10 +30,9 @@ export function checkPermi(value: string[]) {
  */
 export function checkRole(value: string[]) {
   if (value && value instanceof Array && value.length > 0) {
-    const { wsCache } = useCache()
     const permissionRoles = value
     const super_admin = 'admin'
-    const roles = wsCache.get(CACHE_KEY.USER).roles
+    const roles = cache.local.get(CACHE_KEY.USER).roles
     const hasRole = roles.some((role) => {
       return super_admin === role || permissionRoles.includes(role)
     })

src/views/Basic/Dept/DeptForm.vue

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

src/views/Basic/Dept/index.vue

@@ -21,9 +21,16 @@
   <!-- 列表 -->
   <el-table v-loading="loading" :data="list" row-key="id" default-expand-all border>
     <el-table-column prop="name" label="部门名称" />
-    <el-table-column prop="leader" label="负责人" width="120" />
-    <el-table-column prop="sort" label="排序" width="200" />
-    <el-table-column prop="status" label="状态" width="100" />
+    <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 label="创建时间" prop="createTime" width="180" :formatter="dateFormatter" />
     <el-table-column label="操作" class-name="fixed-width" width="160">
       <template #default="scope">

src/views/Basic/Menu/MenuForm.vue

@@ -32,9 +32,9 @@
       </el-form-item>
       <el-form-item label="菜单类型" prop="type">
         <el-radio-group v-model="formData.type">
-          <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 :value="1"> 目录 </el-radio-button>
+          <el-radio-button :value="2"> 菜单 </el-radio-button>
+          <el-radio-button :value="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 :label="0"> 启用 </el-radio>
-          <el-radio :label="1"> 禁用 </el-radio>
+          <el-radio :value="0"> 启用 </el-radio>
+          <el-radio :value="1"> 禁用 </el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item v-if="formData.type !== 3" label="显示状态" prop="visible">
@@ -116,11 +116,11 @@
 <script lang="ts" name="SystemMenuForm" setup>
 // import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import * as MenuApi from '@/api/system/menu'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+import { CACHE_KEY } from '@/hooks/web/useCache'
 import { CommonStatusEnum, SystemMenuTypeEnum } from '@/utils/constants'
 import { defaultProps, handleTree } from '@/utils/tree'
+import cache from '@/plugins/cache'
 
-const { wsCache } = useCache()
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -218,7 +218,7 @@ const submitForm = async () => {
   } finally {
     formLoading.value = false
     // 清空，从而触发刷新
-    wsCache.delete(CACHE_KEY.ROLE_ROUTERS)
+    cache.local.delete(CACHE_KEY.ROLE_ROUTERS)
   }
 }
 

src/views/Basic/Menu/index.vue

@@ -88,8 +88,8 @@
 import { handleTree } from '@/utils/tree'
 import * as MenuApi from '@/api/system/menu'
 import MenuForm from './MenuForm.vue'
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
-const { wsCache } = useCache()
+import { CACHE_KEY } from '@/hooks/web/useCache'
+import cache from '@/plugins/cache'
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -145,7 +145,7 @@ const refreshMenu = async () => {
   try {
     await message.confirm('即将更新缓存刷新浏览器！', '刷新菜单缓存')
     // 清空，从而触发刷新
-    wsCache.delete(CACHE_KEY.ROLE_ROUTERS)
+    cache.local.delete(CACHE_KEY.ROLE_ROUTERS)
     // 刷新浏览器
     location.reload()
   } catch {}

src/views/Basic/Role/Comp/RoleEmployee.vue

@@ -9,6 +9,18 @@
         :label="col.label"
         :width="col.width"
       />
+      <el-table-column label="状态" key="status">
+        <template #default="scope">
+          <el-switch
+            v-model="scope.row.status"
+            :active-value="0"
+            active-text="在职"
+            inactive-text="离职"
+            :inactive-value="1"
+            disabled
+          />
+        </template>
+      </el-table-column>
     </el-table>
     <Pagination
       v-model:limit="pageSize"

src/views/Basic/User/UserForm.vue

@@ -16,8 +16,8 @@
         <el-col :span="12">
           <el-form-item label="用户性别">
             <el-radio-group v-model="formData.sex">
-              <el-radio :label="1"> 男 </el-radio>
-              <el-radio :label="2"> 女 </el-radio>
+              <el-radio :value="1"> 男 </el-radio>
+              <el-radio :value="2"> 女 </el-radio>
             </el-radio-group>
           </el-form-item>
         </el-col>

src/views/Basic/User/index.vue

@@ -7,10 +7,10 @@
     <el-col :span="20" :xs="24">
       <!-- 搜索 -->
       <el-form :model="queryParams" ref="queryFormRef" inline label-width="68px">
-        <el-form-item label="登录账号" prop="username">
+        <el-form-item label="姓名" prop="nickname">
           <el-input
-            v-model="queryParams.username"
-            placeholder="请输入登录账号"
+            v-model="queryParams.nickname"
+            placeholder="请输入姓名"
             clearable
             @keyup.enter="handleQuery"
             class="!w-240px"
@@ -50,6 +50,8 @@
               v-model="scope.row.status"
               :active-value="0"
               :inactive-value="1"
+              active-text="在职"
+              inactive-text="离职"
               v-hasPermi="['basic:employee:update']"
               @change="handleStatusChange(scope.row)"
             />
@@ -118,6 +120,7 @@ const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
   username: undefined,
+  nickname: undefined,
   mobile: undefined,
   deptId: undefined
 })

src/views/Finance/Commission/Comp/DialogPlan.vue

@@ -10,26 +10,40 @@
     >
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="方案名称" prop="name">
-            <el-input v-model="formData.name" placeholder="请输入方案名称" clearable />
+          <el-form-item label="方案名称" prop="percentageName">
+            <el-input v-model="formData.percentageName" placeholder="请输入方案名称" clearable />
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
           <el-form-item label="结算方式">
             <el-radio-group v-model="formData.percentageType">
-              <el-radio :label="1">
+              <el-radio :value="1">
                 <Tooltip message="可配置多级，命中某档位后，按照档位分级结算" />阶梯结算
               </el-radio>
-              <el-radio :label="2">
+              <el-radio :value="2">
                 <Tooltip message="可配置多级，命中某档位后所有金额全部按照该档位结算" />常规结算
               </el-radio>
             </el-radio-group>
           </el-form-item>
         </el-col>
       </el-row>
-      <el-button type="primary" class="mb-10px" plain @click="handleAddRules"
-        >添加提成档位</el-button
-      >
+
+      <el-card class="mb-18px" shadow="never" :body-style="{ padding: '10px' }">
+        <div v-if="formData.percentageType == 1">
+          <p class="text-red-500">阶梯结算说明：</p>
+          <p>若设置 0档、1000档、2000档</p>
+          <p>金额为1500，则未满1000的部分按照0档结算提成，1000-1500的部分按照1000档结算</p>
+        </div>
+        <div v-else-if="formData.percentageType == 2">
+          <p class="text-red-500">阶梯结算说明：</p>
+          <p>若设置 0档、1000档、2000档</p>
+          <p>金额为1500，则全部按照1000档结算</p>
+        </div>
+      </el-card>
+
+      <el-button type="primary" class="mb-10px" plain @click="handleAddRules">
+        添加提成档位
+      </el-button>
       <el-row :gutter="20" class="mb-10px">
         <el-col
           :span="24"
@@ -38,20 +52,31 @@
           v-for="(item, index) in formData.rules"
           :key="index"
         >
-          <el-select v-model="item.ruleParam1" style="width: 100px">
+          <el-select
+            v-model="item.ruleParam1"
+            style="width: 100px"
+            :disabled="index > 0"
+            @change="planChanged('ruleParam1', false)"
+          >
             <el-option
               v-for="it in opts.percentage_param1"
-              :key="Number(it.value)"
+              :key="it.value"
               :label="it.label"
-              :value="Number(it.value)"
+              :value="it.value"
             />
           </el-select>
-          <el-select class="ml-5px" v-model="item.ruleParam2" style="width: 100px">
+          <el-select
+            class="ml-5px"
+            v-model="item.ruleParam2"
+            style="width: 100px"
+            :disabled="index > 0"
+            @change="planChanged('ruleParam2', false)"
+          >
             <el-option
               v-for="it in opts.percentage_param2"
-              :key="Number(it.value)"
+              :key="it.value"
               :label="it.label"
-              :value="Number(it.value)"
+              :value="it.value"
             />
           </el-select>
           <span class="ml-5px">满</span>
@@ -67,9 +92,9 @@
           <el-select class="ml-5px" v-model="item.ruleParam4" style="width: 120px">
             <el-option
               v-for="it in opts.percentage_param4"
-              :key="Number(it.value)"
+              :key="it.value"
               :label="it.label"
-              :value="Number(it.value)"
+              :value="it.value"
             />
           </el-select>
           <div v-if="item.ruleParam4 == 2" class="inline-flex items-center">
@@ -85,12 +110,18 @@
           </div>
           <div v-else class="inline-flex items-center">
             <span class="ml-5px">取</span>
-            <el-select class="ml-5px" v-model="item.ruleParam5" style="width: 100px">
+            <el-select
+              class="ml-5px"
+              v-model="item.ruleParam5"
+              style="width: 100px"
+              :disabled="formData.percentageType == 1"
+              @change="planChanged('ruleParam5')"
+            >
               <el-option
                 v-for="it in opts.percentage_param5"
-                :key="Number(it.value)"
+                :key="it.value"
                 :label="it.label"
-                :value="Number(it.value)"
+                :value="it.value"
               />
             </el-select>
             <span class="ml-5px">结算</span>
@@ -105,63 +136,80 @@
               <template #suffix> % </template>
             </el-input>
           </div>
+          <Icon
+            v-if="index > 0"
+            icon="ep:remove-filled"
+            class="text-red-500 ml-20px"
+            @click="handleRemove(index)"
+          />
         </el-col>
       </el-row>
 
       <el-divider direction="horizontal" />
-
       <el-row :gutter="20">
-        <el-col :span="12" :offset="0">
-          <el-form-item label="是否扣除其他支出" labelWidth="150px">
-            <el-radio-group v-model="formData.qitazhichu">
-              <el-radio :label="0"> 是 </el-radio>
-              <el-radio :label="1"> 否 </el-radio>
-            </el-radio-group>
+        <el-col :span="8" :offset="0">
+          <el-form-item label="转化提成比例" labelWidth="150px">
+            <el-input v-model="formData.convertPercentageRate" placeholder="比例" clearable>
+              <template #suffix> % </template>
+            </el-input>
           </el-form-item>
         </el-col>
-        <el-col :span="12" :offset="0">
-          <el-form-item label="是否扣除售后" labelWidth="150px">
-            <el-radio-group v-model="formData.shouhou">
-              <el-radio :label="0"> 是 </el-radio>
-              <el-radio :label="1"> 否 </el-radio>
+        <el-col :span="8" :offset="0">
+          <el-form-item label="接待提成比例" labelWidth="150px">
+            <el-input v-model="formData.receptionPercentageRate" placeholder="比例" clearable>
+              <template #suffix> % </template>
+            </el-input>
+          </el-form-item>
+        </el-col>
+        <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-group>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
-        <el-col :span="12" :offset="0">
+        <el-col :span="8" :offset="0">
           <el-form-item label="是否关联成交率" labelWidth="150px">
-            <el-radio-group v-model="formData.saleCommissionRelateDealConfig">
-              <el-radio label="true"> 是 </el-radio>
-              <el-radio label="false"> 否 </el-radio>
+            <el-radio-group v-model="formData.isRelateSignRate">
+              <el-radio :value="true"> 是 </el-radio>
+              <el-radio :value="false"> 否 </el-radio>
             </el-radio-group>
           </el-form-item>
         </el-col>
-        <el-col :span="12" :offset="0">
-          <el-form-item label="提成计算时间" labelWidth="150px">
-            <el-radio-group v-model="formData.jisuanshijian">
-              <el-radio :label="1">成交后</el-radio>
-              <el-radio :label="2">回款后</el-radio>
+        <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-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-group>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
-        <el-col :span="12" :offset="0">
-          <el-form-item label="关联规则" v-if="formData.saleCommissionRelateDealConfig == 'true'">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="关联规则" label-width="150px" v-if="formData.isRelateSignRate">
             <div>
-              <el-button @click="formData.saleCommissionRelateRulesConfig.push({})">
-                新增规则
-              </el-button>
+              <el-button @click="formData.rateRules.push({})"> 新增规则 </el-button>
               <div
-                v-for="(item, index) in formData.saleCommissionRelateRulesConfig"
+                v-for="(item, index) in formData.rateRules"
                 :key="index"
                 class="mt-10px flex justify-center items-center"
               >
                 <span>成交率达</span>
                 <el-input
                   class="ml-10px"
-                  v-model="item.successRate"
+                  v-model="item.signRate"
                   placeholder="成交率"
                   style="width: 100px"
                   type="number"
@@ -172,7 +220,7 @@
                 <span>，可结算</span>
                 <el-input
                   class="ml-10px"
-                  v-model="item.comissionRate"
+                  v-model="item.percentageRate"
                   placeholder="提成率"
                   style="width: 100px"
                   type="number"
@@ -198,15 +246,17 @@
 </template>
 
 <script setup name="DialogCommissionPlan">
+import * as PlanApi from '@/api/finance/plan'
 const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
 const dialogVisible = ref(false) // 弹窗的是否展示
-const dialogTitle = ref('工资条设置')
+const dialogTitle = ref('提成方案')
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 
 const formData = ref({})
 const rules = {
-  name: { required: true, message: '方案名称不可为空', trigger: 'blur' }
+  percentageName: { required: true, message: '方案名称不可为空', trigger: 'blur' }
 }
 const opts = ref({
   percentage_param1: [],
@@ -224,16 +274,16 @@ const open = async (type, row) => {
   resetForm()
 
   if (!opts.value.length) {
-    // const arr = await ClassApi.getCommissionParams()
-    // arr.map((item) => {
-    //   opts.value[item.dictType].push(item)
-    // })
+    const arr = await PlanApi.getCommissionParams()
+    arr.map((item) => {
+      opts.value[item.dictType].push(item)
+    })
   }
 
-  if (row?.id) {
+  if (row?.percentageId) {
     formLoading.value = true
     try {
-      // formData.value = await UserApi.getUser(id)
+      formData.value = await PlanApi.getPlanDetail(row.percentageId)
     } finally {
       formLoading.value = false
     }
@@ -243,34 +293,38 @@ defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 重置表单 */
 const resetForm = () => {
+  opts.value = {
+    percentage_param1: [],
+    percentage_param2: [],
+    percentage_param4: [],
+    percentage_param5: []
+  }
   formData.value = {
-    name: undefined,
-    percentageType: 1,
+    percentageName: undefined,
+    percentageType: 2,
     rules: [
       {
-        ruleParam1: 1,
-        ruleParam2: 1,
+        ruleParam1: '2',
+        ruleParam2: '1',
         ruleParam3: 0,
-        ruleParam4: 1,
-        ruleParam5: 1,
+        ruleParam4: '1',
+        ruleParam5: '1',
         ruleParam6: 10
       }
     ],
-    saleCommissionRelateDealConfig: 'false',
-    saleCommissionRelateRulesConfig: []
+    isRelateSignRate: false,
+    rateRules: [],
+    isDeductExtraPay: true,
+    isDeductAfterSale: true,
+    receptionPercentageRate: undefined,
+    isAreaPercentage: false,
+    convertPercentageRate: undefined
   }
   formRef.value?.resetFields()
 }
 
 function handleAddRules() {
-  formData.value.rules.push({
-    ruleParam1: 1,
-    ruleParam2: 1,
-    ruleParam3: 0,
-    ruleParam4: 1,
-    ruleParam5: 1,
-    ruleParam6: 1
-  })
+  formData.value.rules.push({ ...formData.value.rules[0] })
 }
 
 const emit = defineEmits(['success'])
@@ -283,11 +337,12 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
+    const data = { ...formData.value }
     if (formType.value === 'create') {
-      // await ClassApi.createClassType(data)
+      await PlanApi.createPlan(data)
       message.success(t('common.createSuccess'))
     } else {
-      // await ClassApi.updateClassType(data)
+      await PlanApi.updatePlan(data)
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
@@ -297,6 +352,28 @@ const submitForm = async () => {
     formLoading.value = false
   }
 }
+
+function handleRemove(index) {
+  formData.value.rules.splice(index, 1)
+}
+
+function planChanged(paramName, editble = true) {
+  const defaultRule = formData.value.rules[0]
+  formData.value.rules.forEach((it, index) => {
+    if (formData.value.percentageType == 2) {
+      if (!editble) {
+        it[paramName] = defaultRule[paramName]
+      }
+    } else {
+      if (index > 0) {
+        it[paramName] = defaultRule[paramName]
+      }
+      if (paramName == 'ruleParam2') {
+        it['ruleParam5'] = defaultRule[paramName]
+      }
+    }
+  })
+}
 </script>
 
 <style lang="scss" scoped></style>

src/views/Finance/Commission/index.vue

@@ -1,23 +1,40 @@
 <template>
   <div>
-    <el-form :model="searchForm" inline>
+    <el-form :model="searchForm" inline @submit.prevent>
       <el-form-item>
-        <el-input v-model="searchForm.name" placeholder="方案名称" />
+        <el-input
+          v-model="searchForm.percentageName"
+          placeholder="方案名称"
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
       <el-form-item>
-        <el-select v-model="searchForm.status" placeholder="启用状态" clearable filterable>
+        <el-select
+          v-model="searchForm.status"
+          placeholder="启用状态"
+          clearable
+          filterable
+          @change="handleQuery"
+        >
           <el-option label="启用" :value="0" />
           <el-option label="停用" :value="1" />
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleQuery">搜索</el-button>
-        <el-button type="primary" plain @click="openForm('create')"> 新增 </el-button>
+        <el-button @click="handleQuery" v-hasPermi="['finance:commission:search']">搜索</el-button>
+        <el-button
+          type="primary"
+          plain
+          @click="openForm('create')"
+          v-hasPermi="['finance:commission:add']"
+        >
+          新增
+        </el-button>
       </el-form-item>
     </el-form>
     <el-table v-loading="loading" :data="tableList" border stripe>
       <el-table-column type="index" width="50" />
-      <el-table-column label="方案名称" prop="name" width="240" />
+      <el-table-column label="方案名称" prop="percentageName" width="240" />
       <el-table-column label="结算方式" prop="percentageType" width="150" />
       <el-table-column label="结算规则">
         <template #default="{ row }">
@@ -30,14 +47,29 @@
             v-model="scope.row.status"
             :active-value="0"
             :inactive-value="1"
+            v-hasPermi="['finance:commission:update']"
             @change="handleStatusChange(scope.row)"
           />
         </template>
       </el-table-column>
       <el-table-column label="操作" width="200">
         <template #default="scope">
-          <el-button type="primary" link @click="openForm('update', scope.row)"> 修改 </el-button>
-          <el-button type="primary" link @click="handleDelete(scope.row.id)"> 删除 </el-button>
+          <el-button
+            type="primary"
+            link
+            @click="openForm('update', scope.row)"
+            v-hasPermi="['finance:commission:update']"
+          >
+            修改
+          </el-button>
+          <el-button
+            type="primary"
+            link
+            @click="handleDelete(scope.row.percentageId)"
+            v-hasPermi="['finance:commission:delete']"
+          >
+            删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -54,8 +86,14 @@
 
 <script name="CommissionPlan" setup>
 import DialogPlan from './Comp/DialogPlan.vue'
+import * as PlanApi from '@/api/finance/plan'
+import { removeNullField } from '@/utils'
+
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
+
 const searchForm = ref({
-  name: undefined,
+  percentageName: undefined,
   status: undefined,
   pageNo: 1,
   pageSize: 20
@@ -78,10 +116,9 @@ const total = ref(0)
 const getList = async () => {
   loading.value = true
   try {
-    tableList.value = [{ status: 0 }]
-    // const data = await UserApi.getUserPage(queryParams)
-    // tableList.value = data.list
-    // total.value = data.total
+    const data = await PlanApi.getPlanPage(removeNullField(searchForm.value))
+    tableList.value = data.list
+    total.value = data.total
   } finally {
     loading.value = false
   }
@@ -96,9 +133,9 @@ const handleStatusChange = async (row) => {
   try {
     // 修改状态的二次确认
     const text = row.status === 0 ? '启用' : '停用'
-    await message.confirm('确认要"' + text + '""' + row.name + '"方案吗?')
+    await message.confirm('确认要"' + text + '""' + row.percentageName + '"方案吗?')
     // 发起修改状态
-    // await UserApi.updateUserStatus(row.id, row.status)
+    await PlanApi.updatePlanStatus({ percentageId: row.percentageId, status: row.status })
     // 刷新列表
     await getList()
   } catch {
@@ -106,6 +143,19 @@ const handleStatusChange = async (row) => {
     row.status = row.status === 0 ? 1 : 0
   }
 }
+
+/** 删除按钮操作 */
+const handleDelete = async (id) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await PlanApi.deletePlan(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
 </script>
 
 <style lang="scss" scoped></style>

src/views/Finance/Salary/Comp/DialogSalary.vue

@@ -1,9 +1,9 @@
 <template>
   <Dialog v-model="dialogVisible" :title="dialogTitle" style="width: 600px">
     <el-form :model="formData" ref="formRef" :rules="rules" label-width="80px">
-      <el-form-item label="生效日期" prop="validTime">
+      <el-form-item label="生效日期" prop="startDate">
         <el-date-picker
-          v-model="formData.validTime"
+          v-model="formData.startDate"
           type="date"
           format="YYYY-MM-DD"
           value-format="YYYY-MM-DD"
@@ -13,81 +13,87 @@
       <el-divider direction="horizontal" content-position="left">应发</el-divider>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="基本工资" prop="dixin">
-            <el-input-number v-model="formData.dixin" :min="0" :controls="false" />
+          <el-form-item label="基本工资" prop="baseSalary">
+            <el-input-number v-model="formData.baseSalary" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="奖金" prop="jiangjin">
-            <el-input-number v-model="formData.jiangjin" :min="0" :controls="false" />
+          <el-form-item label="绩效(%)">
+            <el-input-number v-model="formData.meritsRate" :min="0" :max="100" :controls="false" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="提成方案" prop="tichengfangan">
-            <el-select v-model="formData.tichengfangan" placeholder="请选择" filterable>
+          <el-form-item label="提成方案" prop="planId">
+            <el-select v-model="formData.planId" placeholder="请选择" filterable clearable>
               <el-option
-                v-for="item in tichengfanganOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
+                v-for="item in planOptions"
+                :key="item.percentageId"
+                :label="item.percentageName"
+                :disabled="item.status == 1"
+                :value="item.percentageId"
               />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="补贴" prop="butie">
-            <el-input-number v-model="formData.butie" :min="0" :controls="false" />
+          <el-form-item label="补贴" prop="allowanceSalary">
+            <el-input-number v-model="formData.allowanceSalary" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="满勤" prop="manqin">
-            <el-input-number v-model="formData.manqin" :min="0" :controls="false" />
+          <el-form-item label="满勤" prop="fullWorkSalary">
+            <el-input-number v-model="formData.fullWorkSalary" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="其他应发" prop="qitayingfa">
-            <el-input-number v-model="formData.qitayingfa" :min="0" :controls="false" />
+          <el-form-item label="奖金" prop="rewardSalary">
+            <el-input-number v-model="formData.rewardSalary" :min="0" :controls="false" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="其他应发" prop="extraSalary">
+            <el-input-number v-model="formData.extraSalary" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-divider direction="horizontal" content-position="left">应扣</el-divider>
       <el-row :gutter="20">
-        <el-col :span="12" :offset="0">
-          <el-form-item label="绩效" prop="jixiao">
+        <!-- <el-col :span="12" :offset="0">
+          <el-form-item label="绩效">
             <el-input placeholder="生成后录入" disabled />
           </el-form-item>
+        </el-col> -->
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="0">
+          <el-form-item label="社保" prop="socialDeduct">
+            <el-input-number v-model="formData.socialDeduct" :min="0" :controls="false" />
+          </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="考勤" prop="kaoqin">
-            <el-input placeholder="自动计算" disabled />
+          <el-form-item label="公积金" prop="accumulationFundDeduct">
+            <el-input-number v-model="formData.accumulationFundDeduct" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="社保" prop="shebao">
-            <el-input-number v-model="formData.shebao" :min="0" :controls="false" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12" :offset="0">
-          <el-form-item label="公积金" prop="gongjijin">
-            <el-input-number v-model="formData.gongjijin" :min="0" :controls="false" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row :gutter="20">
-        <el-col :span="12" :offset="0">
-          <el-form-item label="税额" prop="shuie">
+          <el-form-item label="税额">
             <el-input placeholder="自动计算" disabled />
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="其他应扣" prop="qitayingkou">
-            <el-input-number v-model="formData.qitayingkou" :min="0" :controls="false" />
+          <el-form-item label="考勤">
+            <el-input placeholder="自动计算" disabled />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="其他应扣" prop="extraDeduct">
+            <el-input-number v-model="formData.extraDeduct" :min="0" :controls="false" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -103,7 +109,10 @@
 </template>
 
 <script setup name="DialogSalarySetting">
-// const message = useMessage() // 消息弹窗
+import * as SalaryApi from '@/api/finance/salary'
+import { getPlanSimpleList } from '@/api/finance/plan'
+
+const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('工资条设置')
@@ -112,42 +121,51 @@ const formLoading = ref(false) // 表单的加载中：1）修改时的数据加
 const formData = ref({})
 
 const rules = {
-  dixin: { required: true, message: '基本工资不可为空', trigger: 'blur' }
+  startDate: { required: true, message: '生效日期不可为空', trigger: 'blur, change' },
+  baseSalary: { required: true, message: '基本工资不可为空', trigger: 'blur' }
 }
 
 /** 打开弹窗 */
 const open = async (row) => {
   dialogVisible.value = true
-  dialogTitle.value = `工资条设置-【${row.nickname}】`
-  resetForm()
+  dialogTitle.value = `工资条设置-【${row.name}】`
   getOptions()
   formLoading.value = true
   try {
-    // formData.value = await UserApi.getUser(id)
+    const data = await SalaryApi.getSalaryDetail(row.id)
+    if (!data) {
+      resetForm(row.id)
+    } else {
+      formData.value = { ...data }
+    }
   } finally {
     formLoading.value = false
   }
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
-const tichengfanganOptions = ref([])
+const planOptions = ref([])
 function getOptions() {
-  tichengfanganOptions.value = []
+  getPlanSimpleList().then((data) => {
+    planOptions.value = data
+  })
 }
 
 /** 重置表单 */
-const resetForm = () => {
+const resetForm = (id) => {
   formData.value = {
-    dixin: 0,
-    tichengfangan: undefined,
-    jiangjin: 0,
-    qitayingfa: 0,
-    jixiao: 0,
-    kaoqin: 0,
-    shebao: 0,
-    gongjijin: 0,
-    shuie: 0,
-    qitayingkou: 0
+    employeeId: id,
+    baseSalary: 0,
+    planId: undefined,
+    rewardSalary: 0,
+    allowanceSalary: 0,
+    fullWorkSalary: 0,
+    extraSalary: 0,
+    socialDeduct: 0,
+    accumulationFundDeduct: 0,
+    meritsSalary: 0,
+    extraDeduct: 0,
+    meritsRate: 0
   }
   formRef.value?.resetFields()
 }
@@ -162,13 +180,8 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    // const data = formData.value as unknown as UserApi.UserVO
-    // if (formType.value === 'create') {
-    //   await UserApi.createUser(data)
-    //   message.success(t('common.createSuccess'))
-    // } else {
-    //   await UserApi.updateUser(data)
-    // }
+    const data = { ...formData.value }
+    await SalaryApi.updateSalary(data)
     message.success('配置成功')
     dialogVisible.value = false
     // 发送操作成功的事件

src/views/Finance/Salary/index.vue

@@ -1,29 +1,45 @@
 <template>
   <div>
-    <el-form :model="searchForm" inline>
+    <el-form :model="searchForm" inline @submit.prevent>
       <el-form-item>
-        <el-input v-model="searchForm.name" placeholder="请输入员工姓名" />
+        <el-input
+          v-model="searchForm.name"
+          placeholder="请输入员工姓名"
+          clearable
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
       <el-form-item>
-        <el-radio-group v-model="searchForm.status">
-          <el-radio :label="0"> 在职 </el-radio>
-          <el-radio :label="1"> 离职 </el-radio>
+        <el-radio-group v-model="searchForm.status" @change="handleQuery">
+          <el-radio :value="0"> 在职 </el-radio>
+          <el-radio :value="1"> 离职 </el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleQuery">搜索</el-button>
+        <el-button @click="handleQuery" v-hasPermi="['finance:salary:search']">搜索</el-button>
       </el-form-item>
     </el-form>
 
     <el-table v-loading="loading" :data="tableList" border stripe>
       <el-table-column type="index" width="50" />
-      <el-table-column label="用户姓名" prop="nickname" />
-      <el-table-column label="部门" key="deptName" prop="deptName" />
-      <el-table-column label="手机号码" prop="mobile" width="120" />
-      <el-table-column label="在职状态" prop="status" />
+      <el-table-column label="员工姓名" prop="name" />
+      <el-table-column label="职位" prop="post" />
+      <el-table-column label="手机号码" prop="mobile" />
+      <el-table-column label="在职状态">
+        <template #default="{ row }">
+          {{ ['在职', '离职'][row.status] }}
+        </template>
+      </el-table-column>
       <el-table-column label="操作">
         <template #default="scope">
-          <el-button type="primary" link @click="openForm(scope.row)"> 工资条设置 </el-button>
+          <el-button
+            type="primary"
+            link
+            @click="openForm(scope.row)"
+            v-hasPermi="['finance:salary:set']"
+          >
+            工资条设置
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -39,6 +55,10 @@
 
 <script name="EmployeeList" setup>
 import DialogSalary from './Comp/DialogSalary.vue'
+// import * as SalaryApi from '@/api/finance/salary'
+import { getEmployeePage } from '@/api/pers/employee'
+import { removeNullField } from '@/utils'
+
 const searchForm = ref({
   name: undefined,
   status: 0,
@@ -63,10 +83,9 @@ const total = ref(0)
 const getList = async () => {
   loading.value = true
   try {
-    tableList.value = [1, 2]
-    // const data = await UserApi.getUserPage(queryParams)
-    // tableList.value = data.list
-    // total.value = data.total
+    const data = await getEmployeePage(removeNullField(searchForm.value))
+    tableList.value = data.list
+    total.value = data.total
   } finally {
     loading.value = false
   }

src/views/Home/FalseDiligenceReport/index.vue

@@ -0,0 +1,367 @@
+<template>
+  <div>
+    <el-form :model="searchForm" ref="searchFormRef" inline @submit.prevent>
+      <el-form-item>
+        <el-date-picker
+          v-model="searchForm.period"
+          type="month"
+          format="YYYY-MM"
+          value-format="YYYY-MM"
+          placeholder="年月"
+          style="width: 100%"
+          @change="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-input
+          v-model.trim="searchForm.dept"
+          placeholder="组织名称"
+          clearable
+          @keyup.enter="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-input
+          v-model.trim="searchForm.name"
+          placeholder="员工姓名"
+          clearable
+          @keyup.enter="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleSearch" v-hasPermi="['home:false-dilegence:search']">
+          查询
+        </el-button>
+        <el-button @click="handleSync" v-hasPermi="['home:false-dilegence:sync']">
+          同步钉钉假勤
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table
+      v-loading="loading"
+      :data="tableList"
+      border
+      stripe
+      :default-expand-all="false"
+      row-key="id"
+      :tree-props="{ children: 'userDingAttendanceRespVOList', hasChildren: 'hasChildren' }"
+      :span-method="spanMethod"
+    >
+      <el-table-column label="姓名" min-width="90px" fixed="left">
+        <template #default="{ row }">
+          <span v-if="row.userDingAttendanceRespVOList && row.userDingAttendanceRespVOList.length">
+            <span>{{ row.period }}</span>
+            <span class="ml-20px">考勤人数：{{ row.attendanceUserCount }}人</span>
+            <span class="ml-20px">不考勤人数：{{ row.notAttendanceUserCount }}人</span>
+          </span>
+          <span v-else>
+            {{ row.employeeName }}
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="period" label="年月" min-width="90px" />
+      <el-table-column prop="dept" label="组织" min-width="90px" />
+      <el-table-column label="是否考勤" min-width="90px">
+        <template #default="{ row }">
+          {{ row.needAttendance ? '考勤' : '不考勤' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="shouldWorkDay" label="应出勤天数" min-width="90px" />
+      <el-table-column prop="paidLeaveDay" label="带薪假天数" min-width="90px" />
+      <el-table-column label="出勤天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.reallyWorkDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.reallyWorkDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="调休天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.compensatoryLeaveDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.compensatoryLeaveDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="缺勤天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.absenceDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.absenceDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="事假时长" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.absenceLeaveDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.absenceLeaveDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="婚假天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.marryLeaveDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.marryLeaveDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="产假天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.maternityLeaveDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.maternityLeaveDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="丧假天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.funeralLeaveDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.funeralLeaveDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="旷工天数" align="center">
+        <template #default="{ row }">
+          <el-input-number
+            v-if="row.edit"
+            v-model="row.skipWorkDay"
+            :min="0"
+            :controls="false"
+            size="small"
+            style="width: 65px"
+          />
+          <span v-else> {{ row.skipWorkDay }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" fixed="right" width="200">
+        <template #default="{ row }">
+          <el-button
+            type="primary"
+            style="padding: 0"
+            v-if="row.edit === '0'"
+            text
+            v-hasPermi="['home:false-dilegence:update']"
+            @click="handleEdit(row)"
+          >
+            修改
+          </el-button>
+          <el-button
+            type="primary"
+            v-else-if="row.edit === '1'"
+            text
+            style="padding: 0"
+            v-hasPermi="['home:false-dilegence:update']"
+            @click="handleSave(row)"
+          >
+            保存
+          </el-button>
+          <el-button
+            type="danger"
+            v-if="row.id"
+            :disabled="row.status == 1"
+            style="padding: 0"
+            text
+            v-hasPermi="['home:false-dilegence:sealup']"
+            @click="handleSealup(row)"
+          >
+            <span v-if="row.status == 0">封存</span>
+            <span v-else-if="row.status == 1">已封存</span>
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <Pagination
+      :total="total"
+      v-model:page="searchForm.pageNo"
+      v-model:limit="searchForm.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script setup name="FalseDilegenceReport">
+import { ElLoading } from 'element-plus'
+import { removeNullField } from '@/utils'
+import { formatDate } from '@/utils/formatTime'
+import * as FalseDiligenceApi from '@/api/home/falseDiligence.js'
+
+const message = useMessage() // 消息弹窗
+
+const searchForm = ref({
+  name: undefined,
+  period: undefined,
+  dept: undefined,
+  pageNo: 1,
+  pageSize: 20
+})
+
+onMounted(() => {
+  handleSearch()
+})
+
+function handleSearch() {
+  searchForm.value.pageNo = 1
+  getList()
+}
+
+const loading = ref(false)
+const tableList = ref([])
+const total = ref(0)
+async function getList() {
+  loading.value = true
+  try {
+    let params = {
+      ...searchForm.value
+    }
+    if (params.period) {
+      params = {
+        ...params,
+        year: new Date(params.period).getFullYear(),
+        month: new Date(params.period).getMonth() + 1
+      }
+    }
+    const data = await FalseDiligenceApi.getPage(removeNullField(params))
+    if (searchForm.value.name) {
+      tableList.value = data.list.reduce((pre, cur) => {
+        return pre.concat(cur.userDingAttendanceRespVOList)
+      }, [])
+    } else {
+      tableList.value = data.list.map((it, index) => ({
+        ...it,
+        userDingAttendanceRespVOList: it.userDingAttendanceRespVOList.sort((pre, cur) =>
+          pre.employeeName.localeCompare(cur.employeeName)
+        ),
+        id: index + 1,
+        edit: it.status == 1 ? '2' : '0'
+      }))
+    }
+    total.value = data.total
+  } catch (err) {
+    console.log(err)
+  } finally {
+    loading.value = false
+  }
+}
+
+function spanMethod({ row, columnIndex }) {
+  if (row.userDingAttendanceRespVOList && row.userDingAttendanceRespVOList.length > 0) {
+    if (columnIndex === 0) {
+      return [1, 14]
+    } else if (columnIndex == 14 && row.id) {
+      return [1, 1]
+    } else {
+      return [0, 0]
+    }
+  }
+}
+
+let globalLoading = ref({})
+
+async function handleSync() {
+  try {
+    const result = await message.prompt('请输入年月，如2024-01')
+    const period = formatDate(new Date(result.value), 'YYYY-MM')
+    globalLoading.value = ElLoading.service({
+      lock: true,
+      text: `正在同步${period}假勤数据，请稍后...`,
+      background: 'rgba(0, 0, 0, 0.7)'
+    })
+    await FalseDiligenceApi.syncFalseDiligence({ period })
+    globalLoading.value.close()
+    message.success(`同步成功！`)
+    getList()
+  } catch {
+    globalLoading.value.close()
+  }
+}
+
+function handleEdit(row) {
+  row.edit = '1'
+  row.userDingAttendanceRespVOList.forEach((it) => (it.edit = true))
+}
+
+async function handleSave(row) {
+  try {
+    row.edit = '0'
+    row.userDingAttendanceRespVOList.forEach((it) => (it.edit = false))
+    globalLoading.value = ElLoading.service({
+      lock: true,
+      text: `假勤数据保存中，请稍后...`,
+      background: 'rgba(0, 0, 0, 0.7)'
+    })
+    await FalseDiligenceApi.updateFalseDiligence(row.userDingAttendanceRespVOList)
+    globalLoading.value.close()
+    message.success('保存成功！')
+    getList()
+  } catch {
+    globalLoading.value.close()
+  }
+}
+
+async function handleSealup(row) {
+  try {
+    // 二次确认
+    await message.confirm('确认要封存"' + row.period + '"假勤吗?')
+    // 发起修改状态
+    await FalseDiligenceApi.saveFalseDiligence({
+      period: row.period
+    })
+    message.success('封存成功！')
+    // 刷新列表
+    await getList()
+  } catch (err) {
+    console.log(err)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-table__indent) {
+  display: none;
+}
+
+:deep(.el-table__placeholder) {
+  display: none;
+}
+</style>

src/views/Home/Salary/Comp/DialogCreateSalary.vue

@@ -3,20 +3,58 @@
     <el-form :model="formData" ref="formRef" :rules="rules" label-width="80px">
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="年月" prop="yearmonth">
-            <el-date-picker v-model="formData.yearmonth" type="month" placeholder="选择年月" />
+          <el-form-item label="年月" prop="period">
+            <el-date-picker
+              v-model="formData.period"
+              type="month"
+              placeholder="选择年月"
+              format="YYYY-MM"
+              value-format="YYYY-MM"
+            />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="导入奖金" size="normal">
-            <UploadFile v-model="formData.files1" :limit="1" :isShowTip="false" />
+          <el-form-item label="导入奖金">
+            <div>
+              <el-upload
+                ref="rewardFile"
+                action="#"
+                :limit="1"
+                accept=".xls,.xlsx"
+                :before-upload="fileBeforeUpload"
+                :http-request="rewardUpload"
+              >
+                <el-button type="primary">
+                  <Icon icon="ep:upload" class="mr-5px" /> 点击上传
+                </el-button>
+              </el-upload>
+              <el-link type="primary" :underline="false" @click="downloadTemplateFile(1)">
+                点击下载模板文件
+              </el-link>
+            </div>
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="导入考勤" size="normal">
-            <UploadFile v-model="formData.files2" :limit="1" :isShowTip="false" />
+          <el-form-item label="导入考勤" prop="attendanceFile">
+            <div>
+              <el-upload
+                ref="attendanceFile"
+                action="#"
+                :limit="1"
+                accept=".xls,.xlsx"
+                :before-upload="fileBeforeUpload"
+                :http-request="attendanceUpload"
+              >
+                <el-button type="primary">
+                  <Icon icon="ep:upload" class="mr-5px" /> 点击上传
+                </el-button>
+              </el-upload>
+              <el-link type="primary" :underline="false" @click="downloadTemplateFile(2)">
+                点击下载模板文件
+              </el-link>
+            </div>
           </el-form-item>
         </el-col>
       </el-row>
@@ -24,30 +62,97 @@
     <template #footer>
       <span>
         <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" :disabled="formLoading" @click="handleSave">
-          确 认 生 成
-        </el-button>
+        <el-button type="primary" :disabled="formLoading" @click="handleSave"> 确认生成 </el-button>
       </span>
     </template>
   </Dialog>
 </template>
 
 <script setup name="DialogCreateSalary">
+import * as SalaryApi from '@/api/home/salary.js'
+import download from '@/utils/download'
+
+const message = useMessage() // 消息弹窗
 const dialogVisible = ref(false)
 
 const formData = ref({})
 
 const formLoading = ref(false)
 
-const rules = {}
+const rules = {
+  period: { required: true, message: '年月不可为空', trigger: 'blur,change' }
+}
 
 function open() {
   dialogVisible.value = true
+  resetForm()
+}
+
+function resetForm() {
+  const month = `${new Date().getMonth() + 1}`
+  formData.value = {
+    period: `${new Date().getFullYear()}-${month.padStart(2, '0')}`
+  }
 }
 
 defineExpose({ open })
 
-function handleSave() {}
+const emit = defineEmits(['success'])
+const formRef = ref()
+async function handleSave() {
+  // 校验表单
+  if (!formRef.value) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    fd.value.delete('period')
+    fd.value.append('period', formData.value.period)
+    await SalaryApi.createSalarySlip(fd.value)
+    message.success('生成成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+async function downloadTemplateFile(type) {
+  let data
+  if (type == 1) {
+    data = await SalaryApi.getLinkReward()
+    console.log(data)
+    download.excel(data, '奖金模板.xls')
+  } else if (type == 2) {
+    data = await SalaryApi.getLinkAttendance()
+    download.excel(data, '考勤模板.xls')
+  }
+}
+
+const fileBeforeUpload = (file) => {
+  let format = '.' + file.name.split('.')[1]
+  if (!['.xls', '.xlsx'].includes(format)) {
+    message.error(`请上传指定格式".xls,.xlsx"文件`)
+    return false
+  }
+  let isRightSize = file.size / 1024 / 1024 < 20
+  if (!isRightSize) {
+    message.error('文件大小超过 20MB')
+  }
+  return isRightSize
+}
+
+const fd = ref(new FormData())
+
+function rewardUpload(data) {
+  fd.value.append('rewardSalaryFile', data.file)
+}
+
+function attendanceUpload(data) {
+  fd.value.append('attendanceFile', data.file)
+}
 </script>
 
 <style lang="scss" scoped></style>

src/views/Home/Salary/Comp/DialogSalaryImport.vue

@@ -0,0 +1,135 @@
+<template>
+  <Dialog v-model="dialogVisible" title="导入历史工资条" style="width: 500px">
+    <el-form :model="formData" ref="formRef" :rules="rules" label-width="auto">
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="年月" prop="period">
+            <el-date-picker
+              v-model="formData.period"
+              type="month"
+              placeholder="选择年月"
+              format="YYYY-MM"
+              value-format="YYYY-MM"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="工资文件">
+            <div>
+              <el-upload
+                ref="salaryFile"
+                action="#"
+                :limit="1"
+                accept=".xls,.xlsx"
+                :before-upload="fileBeforeUpload"
+                :http-request="salaryUpload"
+              >
+                <el-button type="primary">
+                  <Icon icon="ep:upload" class="mr-5px" /> 点击上传
+                </el-button>
+              </el-upload>
+              <el-link type="primary" :underline="false" @click="downloadTemplateFile(3)">
+                点击下载模板文件
+              </el-link>
+            </div>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span>
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" :disabled="formLoading" @click="handleSave">确 认</el-button>
+      </span>
+    </template>
+  </Dialog>
+</template>
+
+<script setup name="DialogSalaryImport">
+import * as SalaryApi from '@/api/home/salary.js'
+import download from '@/utils/download'
+
+const message = useMessage() // 消息弹窗
+const dialogVisible = ref(false)
+
+const formData = ref({})
+
+const formLoading = ref(false)
+
+const rules = {
+  period: { required: true, message: '年月不可为空', trigger: 'blur,change' }
+}
+
+function open() {
+  dialogVisible.value = true
+  resetForm()
+}
+
+function resetForm() {
+  const month = `${new Date().getMonth() + 1}`
+  formData.value = {
+    period: `${new Date().getFullYear()}-${month.padStart(2, '0')}`
+  }
+}
+
+defineExpose({ open })
+
+const emit = defineEmits(['success'])
+const formRef = ref()
+async function handleSave() {
+  // 校验表单
+  if (!formRef.value) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  if (!fd.value.get('file')) {
+    message.info('请上传工资文件！')
+    return
+  }
+
+  // 提交请求
+  formLoading.value = true
+  try {
+    fd.value.delete('period')
+    fd.value.append('period', formData.value.period)
+    await SalaryApi.importSalarySlip(fd.value)
+    message.success('导入成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+async function downloadTemplateFile(type) {
+  let data
+  if (type == 3) {
+    data = await SalaryApi.getLinkHistorySalary()
+    download.excel(data, '工资条模板.xls')
+  }
+}
+
+const fileBeforeUpload = (file) => {
+  let format = '.' + file.name.split('.')[1]
+  if (!['.xls', '.xlsx'].includes(format)) {
+    message.error(`请上传指定格式".xls,.xlsx"文件`)
+    return false
+  }
+  let isRightSize = file.size / 1024 / 1024 < 20
+  if (!isRightSize) {
+    message.error('文件大小超过 20MB')
+  }
+  return isRightSize
+}
+
+const fd = ref()
+
+function salaryUpload(data) {
+  fd.value = new FormData()
+  fd.value.append('file', data.file)
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/Home/Salary/index.vue

@@ -1,23 +1,33 @@
 <template>
   <div>
-    <el-form :model="searchForm" ref="searchFormRef" inline>
+    <el-form :model="searchForm" ref="searchFormRef" inline @submit.prevent>
       <el-form-item>
-        <el-input v-model="searchForm.employeeName" placeholder="员工姓名" />
-      </el-form-item>
-      <el-form-item>
-        <el-date-picker
-          v-model="searchForm.month"
-          type="month"
-          placeholder="年月"
-          format="YYYY-MM"
-          value-format="YYYY-MM"
-          style="width: 100%"
+        <el-input
+          v-model="searchForm.name"
+          placeholder="员工姓名"
+          clearable
+          @keyup.enter="handleSearch"
         />
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleSearch">查询</el-button>
-        <el-button type="primary" plain @click="craeteSalary">生成工资条</el-button>
-        <el-button type="primary" @click="importHistorySalary">导入历史工资条</el-button>
+        <el-date-picker
+          v-model="searchForm.period"
+          type="month"
+          format="YYYY-MM"
+          value-format="YYYY-MM"
+          placeholder="年月"
+          style="width: 100%"
+          @change="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleSearch" v-hasPermi="['home:salary:search']">查询</el-button>
+        <el-button type="primary" plain @click="craeteSalary" v-hasPermi="['home:salary:create']"
+          >生成工资条</el-button
+        >
+        <el-button type="primary" @click="importHistorySalary" v-hasPermi="['home:salary:history']"
+          >导入历史工资条</el-button
+        >
       </el-form-item>
     </el-form>
 
@@ -28,115 +38,143 @@
       stripe
       :default-expand-all="false"
       row-key="id"
-      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      :tree-props="{ children: 'userSalaryGrantRespVOList', hasChildren: 'hasChildren' }"
       :span-method="spanMethod"
     >
-      <el-table-column label="姓名" min-width="90px">
+      <el-table-column label="姓名" min-width="90px" fixed="left">
         <template #default="{ row }">
-          <span v-if="row.children && row.children.length">
-            <span>{{ row.yearmonth }}</span>
-            <span class="ml-20px">应发工资人数：30人</span>
+          <span v-if="row.userSalaryGrantRespVOList && row.userSalaryGrantRespVOList.length">
+            <span>{{ row.period }}</span>
+            <span class="ml-20px">应发工资人数：{{ row.grantNum }}人</span>
+            <span class="ml-20px">应发工资：¥{{ row.allGrantSalaryTotal }}</span>
           </span>
           <span v-else>
             {{ row.name }}
           </span>
         </template>
       </el-table-column>
+      <el-table-column prop="period" label="年月" min-width="90px" />
       <el-table-column prop="dept" label="部门" min-width="90px" />
-      <el-table-column prop="job" label="职位" min-width="90px" />
+      <el-table-column prop="post" label="职位" min-width="90px" />
       <el-table-column label="应发工资" align="center">
-        <el-table-column label="基本工资" min-width="90px">
+        <el-table-column label="无责底薪" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.baseSalary"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.baseSalary }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="标准绩效" min-width="90px">
+          <template #default="{ row }">
+            <el-input-number
+              v-if="row.edit"
+              v-model="row.meritsSalary"
+              :min="0"
+              :controls="false"
+              size="small"
+              style="width: 65px"
+            />
+            <span v-else> {{ row.meritsSalary }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="绩效实发" min-width="90px">
+          <template #default="{ row }">
+            <el-input-number
+              v-if="row.edit"
+              v-model="row.reallyMeritsSalary"
+              :min="0"
+              :controls="false"
+              size="small"
+              style="width: 65px"
+            />
+            <span v-else> {{ row.reallyMeritsSalary }}</span>
           </template>
         </el-table-column>
         <el-table-column label="补贴" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.allowanceSalary"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.allowanceSalary }}</span>
           </template>
         </el-table-column>
         <el-table-column label="提成" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.percentageSalary"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.percentageSalary }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="奖金" min-width="90px">
+          <template #default="{ row }">
+            <el-input-number
+              v-if="row.edit"
+              v-model="row.rewardSalary"
+              :min="0"
+              :controls="false"
+              size="small"
+              style="width: 65px"
+            />
+            <span v-else> {{ row.rewardSalary }}</span>
           </template>
         </el-table-column>
         <el-table-column label="满勤" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.fullWorkSalary"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.fullWorkSalary }}</span>
           </template>
         </el-table-column>
         <el-table-column label="其他" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.extraSalary"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.extraSalary }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="小计" min-width="90px" />
+        <el-table-column label="小计" prop="salaryTotal" min-width="90px" />
       </el-table-column>
       <el-table-column label="应扣工资" align="center">
-        <el-table-column label="绩效" min-width="90px">
-          <template #default="{ row }">
-            <el-input-number
-              v-if="row.edit"
-              v-model="row.jbgz"
-              :min="0"
-              :controls="false"
-              size="small"
-              style="width: 65px"
-            />
-            <span v-else> {{ row.jbgz }}</span>
-          </template>
-        </el-table-column>
         <el-table-column label="请假" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.leaveDayDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.leaveDayDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column min-width="90px">
@@ -146,161 +184,212 @@
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.absenceDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.absenceDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="旷工" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.skipWorkDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.skipWorkDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="违纪" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.breachDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.breachDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="公积金" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.accumulationFundDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.accumulationFundDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="社保" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.socialDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.socialDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="所得税" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.taxDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.taxDeduct }}</span>
           </template>
         </el-table-column>
         <el-table-column label="其他" min-width="90px">
           <template #default="{ row }">
             <el-input-number
               v-if="row.edit"
-              v-model="row.jbgz"
+              v-model="row.extraDeduct"
               :min="0"
               :controls="false"
               size="small"
               style="width: 65px"
             />
-            <span v-else> {{ row.jbgz }}</span>
+            <span v-else> {{ row.extraDeduct }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="小计" min-width="90px" />
+        <el-table-column label="小计" prop="deductTotal" min-width="90px" />
       </el-table-column>
-      <el-table-column label="实发工资" fixed="right" />
+      <el-table-column label="实发工资" prop="gantSalary" fixed="right" width="90" />
       <el-table-column label="操作" fixed="right" width="200">
         <template #default="{ row }">
           <el-button
             type="primary"
             style="padding: 0"
-            v-if="!row.edit && row.yearmonth"
+            v-if="row.edit === '0'"
             text
+            v-hasPermi="['home:salary:update']"
             @click="handleEdit(row)"
           >
             修改
           </el-button>
           <el-button
             type="primary"
-            v-else-if="row.edit && row.yearmonth"
+            v-else-if="row.edit === '1'"
             text
             style="padding: 0"
+            v-hasPermi="['home:salary:update']"
             @click="handleSave(row)"
           >
             保存
           </el-button>
           <el-button
             type="danger"
-            v-if="row.yearmonth"
+            v-if="row.id"
+            :disabled="row.status == 1"
             style="padding: 0"
             text
-            @click="handleSave(row)"
+            v-hasPermi="['home:salary:sealup']"
+            @click="handleSealup(row)"
           >
-            封存
+            <span v-if="row.status == 0">封存</span>
+            <span v-else-if="row.status == 1">已封存</span>
+          </el-button>
+          <el-button type="primary" v-if="row.grantId" text @click="handleDetail(row)">
+            提成明细
           </el-button>
         </template>
       </el-table-column>
     </el-table>
+
+    <Pagination
+      :total="total"
+      v-model:page="searchForm.pageNo"
+      v-model:limit="searchForm.pageSize"
+      @pagination="getList"
+    />
+
     <DialogCreateSalary ref="createSalaryRef" @success="getList" />
-    <DialogImportSalary ref="importSalaryRef" @success="getList" />
+    <DialogSalaryImport ref="importSalaryRef" @success="getList" />
   </div>
 </template>
 
 <script setup name="SalarySlip">
 import DialogCreateSalary from './Comp/DialogCreateSalary.vue'
-const searchForm = ref({})
+import DialogSalaryImport from './Comp/DialogSalaryImport.vue'
+
+import { removeNullField } from '@/utils'
+import * as SalaryApi from '@/api/home/salary.js'
+import { ElLoading } from 'element-plus'
+
+const message = useMessage() // 消息弹窗
+
+const searchForm = ref({
+  name: undefined,
+  period: undefined,
+  pageNo: 1,
+  pageSize: 20
+})
 
 onMounted(() => {
   handleSearch()
 })
 
 function handleSearch() {
-  searchForm.value.pageNO = 1
+  searchForm.value.pageNo = 1
   getList()
 }
 
 const loading = ref(false)
 const tableList = ref([])
 const total = ref(0)
-function getList() {
-  tableList.value = [
-    {
-      yearmonth: '2024-06',
-      id: 1,
-      children: [
-        { id: 11, name: '张三' },
-        { id: 12, name: '李四' }
-      ]
+async function getList() {
+  loading.value = true
+  try {
+    let params = {
+      ...searchForm.value
     }
-  ]
-  total.value = 0
+    if (params.period) {
+      params = {
+        ...params,
+        year: new Date(params.period).getFullYear(),
+        month: new Date(params.period).getMonth() + 1
+      }
+    }
+    const data = await SalaryApi.getSalaryPage(removeNullField(params))
+    if (searchForm.value.name) {
+      tableList.value = data.list.reduce((pre, cur) => {
+        return pre.concat(cur.userSalaryGrantRespVOList)
+      }, [])
+    } else {
+      tableList.value = data.list.map((it, index) => ({
+        ...it,
+        userSalaryGrantRespVOList: it.userSalaryGrantRespVOList.sort((pre, cur) =>
+          pre.name.localeCompare(cur.name)
+        ),
+        id: index + 1,
+        edit: it.status == 1 ? '2' : '0'
+      }))
+    }
+    total.value = data.total
+  } catch (err) {
+    console.log(err)
+  } finally {
+    loading.value = false
+  }
 }
 
 const createSalaryRef = ref()
@@ -308,13 +397,16 @@ function craeteSalary() {
   createSalaryRef.value.open()
 }
 
-function importHistorySalary() {}
+const importSalaryRef = ref()
+function importHistorySalary() {
+  importSalaryRef.value.open()
+}
 
 function spanMethod({ row, columnIndex }) {
-  if (row.children && row.children.length > 0) {
+  if (row.userSalaryGrantRespVOList && row.userSalaryGrantRespVOList.length > 0) {
     if (columnIndex === 0) {
-      return [1, 21]
-    } else if (columnIndex == 21) {
+      return [1, 23]
+    } else if (columnIndex == 23 && row.id) {
       return [1, 1]
     } else {
       return [0, 0]
@@ -323,13 +415,58 @@ function spanMethod({ row, columnIndex }) {
 }
 
 function handleEdit(row) {
-  row.edit = true
-  row.children.forEach((it) => (it.edit = true))
+  row.edit = '1'
+  row.userSalaryGrantRespVOList.forEach((it) => (it.edit = true))
 }
 
-function handleSave(row) {
-  row.edit = false
-  row.children.forEach((it) => (it.edit = false))
+const globalLoading = ref({})
+async function handleSave(row) {
+  try {
+    row.edit = '0'
+    row.userSalaryGrantRespVOList.forEach((it) => (it.edit = false))
+    globalLoading.value = ElLoading.service({
+      lock: true,
+      text: `工资条数据保存中，请稍后...`,
+      background: 'rgba(0, 0, 0, 0.7)'
+    })
+    await SalaryApi.updateSalarySlip(row.userSalaryGrantRespVOList)
+    globalLoading.value.close()
+    message.success('保存成功！')
+    getList()
+  } catch {
+    globalLoading.value.close()
+  }
+}
+
+async function handleSealup(row) {
+  try {
+    // 二次确认
+    await message.confirm('确认要封存"' + row.period + '"工资条吗?')
+    // 发起修改状态
+    await SalaryApi.sealupSalarySlip({
+      grantIdList: row.userSalaryGrantRespVOList.map((it) => it.grantId),
+      period: row.period
+    })
+    message.success('封存成功！')
+    // 刷新列表
+    await getList()
+  } catch (err) {
+    console.log(err)
+  }
+}
+
+async function handleDetail(row) {
+  try {
+    const data = await SalaryApi.getCommissionDetail({ id: row.grantId })
+    if (data) {
+      message.alert(data)
+    } else {
+      message.info('该员工未配置提成方案！')
+    }
+  } catch (error) {
+    message.error(error)
+    console.log(error)
+  }
 }
 </script>
 

src/views/Kpi/Appraise/Components/DialogAppraise.vue

@@ -0,0 +1,225 @@
+<template>
+  <Dialog :title="title" v-model="show" width="800px">
+    <el-form v-loading="formLoading" :model="form" ref="formRef" :rules="rules" label-width="80px">
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="0">
+          <el-form-item label="考核指标" prop="examineTarget">
+            <el-input v-model="form.examineTarget" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="生效日期" prop="effectiveDate">
+            <el-date-picker
+              v-model="form.effectiveDate"
+              type="date"
+              :disabled="form.id"
+              format="YYYY-MM-DD"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期时间"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="模式" prop="type">
+            <el-radio-group v-model="form.type">
+              <el-radio
+                v-for="(item, index) in prop.kpiModeOoptions"
+                :key="index"
+                :label="item.value"
+              >
+                {{ item.label }}
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="0">
+          <el-form-item label="权重" prop="weight">
+            <el-input-number v-model="form.weight" :min="0" :step="1" :controls="false" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="评分上限" prop="examineScore">
+            <el-input-number v-model="form.examineScore" :min="0" :step="1" :controls="false" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="考核内容" prop="examineContent">
+            <Editor
+              v-model:modelValue="form.examineContent"
+              height="150px"
+              :toolbarConfig="{
+                toolbarKeys: []
+              }"
+              style="width: 100%"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="考核规则" prop="examineRule">
+            <Editor
+              v-model:modelValue="form.examineRule"
+              height="150px"
+              :toolbarConfig="{ toolbarKeys: [] }"
+              style="width: 100%"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="24" :offset="0">
+          <el-form-item label="考核员工" prop="examinedUserIdList">
+            <div>
+              <el-checkbox
+                v-model="checkAll"
+                :indeterminate="isIndeterminate"
+                @change="handleCheckAllChange"
+              >
+                全选
+              </el-checkbox>
+              <el-checkbox-group v-model="form.examinedUserIdList" @change="handleCheckedChange">
+                <el-checkbox
+                  v-for="item in employeeOptions"
+                  :key="item.id"
+                  :disabled="item.status == 1"
+                  :label="item.id"
+                  :value="item.id"
+                >
+                  {{ item.name }}
+                </el-checkbox>
+              </el-checkbox-group>
+            </div>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span>
+        <el-button @click="show = false">取 消</el-button>
+        <el-button type="primary" :disabled="formLoading" @click="handleSave">保 存</el-button>
+      </span>
+    </template>
+  </Dialog>
+</template>
+
+<script setup name="DialogAppraise">
+import * as KpiApi from '@/api/kpi/index.js'
+
+const prop = defineProps({
+  kpiModeOoptions: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const show = ref(false)
+const title = ref('')
+const formType = ref('create')
+
+const form = ref({})
+const formLoading = ref(false)
+const rules = ref({
+  examineTarget: { required: true, message: '标题不可为空', trigger: 'blur' },
+  effectiveDate: { required: true, message: '生效日期不可为空', trigger: 'blur,change' },
+  examineContent: { required: true, message: '标题不可为空', trigger: 'blur' },
+  examineRule: { required: true, message: '标题不可为空', trigger: 'blur' }
+})
+
+async function open(type, val) {
+  show.value = true
+  title.value = type == 'update' ? '修改考核项' : '新增考核项'
+  formType.value = type
+  resetForm()
+  if (val) {
+    formLoading.value = true
+    try {
+      form.value = await KpiApi.getKpiDetail(val)
+    } finally {
+      formLoading.value = false
+    }
+  }
+  getOptions()
+}
+
+function getOptions() {
+  KpiApi.getKpiEmployees().then((data) => {
+    employeeOptions.value = data
+    if (formType.value == 'update') {
+      handleCheckedChange(form.value.examinedUserIdList)
+    } else {
+      handleCheckAllChange(true)
+      checkAll.value = true
+    }
+  })
+}
+
+function resetForm() {
+  form.value = {
+    examineTarget: '',
+    type: '3',
+    weight: 0,
+    examineContent: ``,
+    examineRule: ``,
+    examineScore: 5,
+    examinedUserIdList: []
+  }
+}
+
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+const formRef = ref()
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+async function handleSave() {
+  // 校验表单
+  if (!formRef.value) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    if (formType.value === 'create') {
+      await KpiApi.createKpi(form.value)
+      message.success(t('common.createSuccess'))
+    } else {
+      await KpiApi.updateKpi(form.value)
+      message.success(t('common.updateSuccess'))
+    }
+    show.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+const checkAll = ref(false)
+const isIndeterminate = ref(false)
+const employeeOptions = ref([])
+
+function handleCheckAllChange(val) {
+  form.value.examinedUserIdList = val ? employeeOptions.value.map((it) => it.id) : []
+  isIndeterminate.value = false
+}
+
+function handleCheckedChange(value) {
+  const checkedCount = value.length
+  checkAll.value = checkedCount === employeeOptions.value.length
+  isIndeterminate.value = checkedCount > 0 && checkedCount < employeeOptions.value.length
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/Kpi/Appraise/index.vue

@@ -0,0 +1,156 @@
+<template>
+  <div>
+    <!-- 搜索工作栏 -->
+    <el-form :model="searchForm" ref="queryFormRef" inline label-width="0">
+      <el-form-item>
+        <el-input v-model="searchForm.examineTarget" placeholder="请输入考核指标" clearable />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery" v-hasPermi="['kpi:appraise:search']"> 搜索</el-button>
+        <el-button @click="resetQuery" v-hasPermi="['kpi:appraise:reset']"> 重置</el-button>
+        <el-button
+          type="primary"
+          plain
+          @click="openForm('create')"
+          v-hasPermi="['kpi:appraise:add']"
+        >
+          新增
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- 列表 -->
+    <el-table v-loading="loading" :data="list" border>
+      <el-table-column prop="examineTarget" label="考核指标" width="180" />
+      <el-table-column prop="typeName" label="分值模式" width="90" :formatter="getKpiModeLabel" />
+      <el-table-column prop="weight" label="权重%" width="90" />
+      <el-table-column label="考核内容">
+        <template #default="{ row }">
+          <div v-dompurify-html="row.examineContent"></div>
+        </template>
+      </el-table-column>
+      <el-table-column label="考核规则" prop="examineRule">
+        <template #default="{ row }">
+          <div v-dompurify-html="row.examineRule"></div>
+        </template>
+      </el-table-column>
+      <el-table-column label="评分上限" prop="examineScore" width="90" />
+      <el-table-column label="考核人数" width="90">
+        <template #default="{ row }">
+          {{ row.examinedUserIdList?.length || 0 }}
+        </template>
+      </el-table-column>
+      <el-table-column label="生效日期" prop="effectiveDate" width="120" />
+      <el-table-column label="操作" class-name="fixed-width" width="120">
+        <template #default="{ row }">
+          <el-button
+            link
+            type="primary"
+            @click="openForm('update', row.id)"
+            v-hasPermi="['kpi:appraise:update']"
+          >
+            修改
+          </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(row.id)"
+            v-hasPermi="['kpi:appraise:remove']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <Pagination
+      v-model:limit="searchForm.pageSize"
+      v-model:page="searchForm.pageNo"
+      :total="total"
+      @pagination="getList"
+    />
+
+    <DialogAppraise ref="formRef" :kpiModeOoptions="kpiModeOoptions" @success="handleQuery" />
+  </div>
+</template>
+
+<script setup name="KpiContent">
+import { removeNullField } from '@/utils'
+import DialogAppraise from './Components/DialogAppraise.vue'
+import * as KpiApi from '@/api/kpi/index.js'
+import { getGeneralSysDictData } from '@/api/system/dict/dict.data'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+const loading = ref(false) // 列表的加载中
+const list = ref([]) // 列表的数据
+const searchForm = ref({
+  examineTarget: undefined,
+  pageNo: 1,
+  pageSize: 20
+})
+const total = ref(0)
+
+/** 初始化 **/
+onMounted(() => {
+  getOptions()
+  handleQuery()
+})
+
+const kpiModeOoptions = ref([])
+function getOptions() {
+  getGeneralSysDictData('examine_type').then((data) => {
+    kpiModeOoptions.value = data
+  })
+}
+
+function getKpiModeLabel(row) {
+  return kpiModeOoptions.value.find((it) => it.value == row.type)?.label
+}
+
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await KpiApi.getKpiPage(removeNullField(searchForm.value))
+    list.value = data.list
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  searchForm.value.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  searchForm.value = {
+    examineTarget: undefined,
+    pageNo: 1,
+    pageSize: 20
+  }
+  handleQuery()
+}
+
+/** 添加/修改操作 */
+const formRef = ref()
+const openForm = (type, id) => {
+  formRef.value.open(type, id)
+}
+
+/** 删除按钮操作 */
+const handleDelete = async (id) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await KpiApi.deleteKpi(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/Kpi/Record/DialogScoreDetail.vue

@@ -0,0 +1,48 @@
+<template>
+  <Dialog title="绩效考核详情" v-model="show" width="1200px">
+    <el-table :data="list" border stripe>
+      <el-table-column prop="examineTarget" label="考核指标" width="100" />
+      <el-table-column prop="typeName" label="分值模式" width="90" />
+      <el-table-column prop="weight" label="权重%" width="90" />
+      <el-table-column label="考核内容">
+        <template #default="{ row }">
+          <div v-dompurify-html="row.examineContent"></div>
+        </template>
+      </el-table-column>
+      <el-table-column label="考核规则" prop="examineRule">
+        <template #default="{ row }">
+          <div v-dompurify-html="row.examineRule"></div>
+        </template>
+      </el-table-column>
+      <el-table-column label="评分上限" prop="examineScore" width="90" />
+      <el-table-column label="考核评分" width="90" prop="score" />
+      <el-table-column label="评分备注" width="90" prop="remark" />
+      <el-table-column label="加权得分" prop="weightSocre" width="90" />
+    </el-table>
+
+    <template #footer>
+      <span>
+        <el-button @click="show = false">关 闭</el-button>
+      </span>
+    </template>
+  </Dialog>
+</template>
+
+<script setup name="DialogScoreDetail">
+import * as KpiApi from '@/api/kpi/score.js'
+
+const show = ref(false)
+const list = ref([])
+
+async function open(id) {
+  show.value = true
+  try {
+    const data = await KpiApi.getScoreDetail({ id })
+    list.value = data.list
+  } finally {
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+</script>
+
+<style lang="scss" scoped></style>

src/views/Kpi/Record/index.vue

@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <!-- 搜索工作栏 -->
+    <el-form :model="searchForm" inline label-width="0">
+      <el-form-item>
+        <el-date-picker
+          v-model="searchForm.period"
+          type="month"
+          format="YYYY-MM"
+          value-format="YYYY-MM"
+          placeholder="年月"
+          style="width: 100%"
+          @change="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-input
+          v-model.trim="searchForm.dept"
+          placeholder="组织名称"
+          clearable
+          @keyup.enter="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-input
+          v-model.trim="searchForm.examinedUserName"
+          placeholder="员工姓名"
+          clearable
+          @keyup.enter="handleSearch"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList" v-hasPermi="['kpi:score:search']"> 搜索</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      v-loading="loading"
+      :data="tableList"
+      border
+      stripe
+      :default-expand-all="false"
+      row-key="id"
+      :tree-props="{ children: 'examineResultRespVOList', hasChildren: 'hasChildren' }"
+      :span-method="spanMethod"
+    >
+      <el-table-column label="姓名" min-width="90px">
+        <template #default="{ row }">
+          <span v-if="row.examineResultRespVOList && row.examineResultRespVOList.length">
+            <span>{{ row.period }}</span>
+            <span class="ml-20px">考核人数：{{ row.examineNum }}人</span>
+          </span>
+          <span v-else>
+            {{ row.examinedUserName }}
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="period" label="年月" min-width="90px" />
+      <el-table-column prop="dept" label="组织" min-width="90px" />
+      <el-table-column label="考核总分" prop="score" align="center" />
+      <el-table-column label="操作" fixed="right" width="200">
+        <template #default="{ row }">
+          <el-button
+            type="danger"
+            v-if="!row.examinedUser"
+            :disabled="row.status == 1"
+            style="padding: 0"
+            text
+            v-hasPermi="['home:false-dilegence:sealup']"
+            @click="handleSealup(row)"
+          >
+            <span v-if="row.status == 0">封存</span>
+            <span v-else-if="row.status == 1">已封存</span>
+          </el-button>
+          <el-button
+            type="primary"
+            text
+            v-if="row.examinedUser"
+            style="padding: 0"
+            v-hasPermi="['kpi:record:detail']"
+            @click="handleDetail(row)"
+          >
+            详情
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <Pagination
+      :total="total"
+      v-model:page="searchForm.pageNo"
+      v-model:limit="searchForm.pageSize"
+      @pagination="getList"
+    />
+
+    <DialogScoreDetail ref="detailDialogRef" />
+  </div>
+</template>
+
+<script setup name="KpiRecord">
+import { removeNullField } from '@/utils'
+import * as KpiApi from '@/api/kpi/score.js'
+import DialogScoreDetail from './DialogScoreDetail.vue'
+
+const message = useMessage() // 消息弹窗
+
+const searchForm = ref({
+  examinedUserName: undefined,
+  period: undefined,
+  dept: undefined,
+  pageNo: 1,
+  pageSize: 20
+})
+
+onMounted(() => {
+  handleSearch()
+})
+
+function handleSearch() {
+  searchForm.value.pageNo = 1
+  getList()
+}
+
+const loading = ref(false)
+const tableList = ref([])
+const total = ref(0)
+async function getList() {
+  loading.value = true
+  try {
+    let params = {
+      ...searchForm.value
+    }
+    if (params.period) {
+      params = {
+        ...params,
+        year: new Date(params.period).getFullYear(),
+        month: new Date(params.period).getMonth() + 1
+      }
+    }
+    const data = await KpiApi.getScoreRecord(removeNullField(params))
+    if (searchForm.value.examinedUserName) {
+      tableList.value = data.list.reduce((pre, cur) => {
+        return pre.concat(cur.examineResultRespVOList)
+      }, [])
+    } else {
+      tableList.value = data.list.map((it, index) => ({
+        ...it,
+        examineResultRespVOList: it.examineResultRespVOList,
+        id: index + 1
+      }))
+    }
+    total.value = data.total
+  } catch (err) {
+    console.log(err)
+  } finally {
+    loading.value = false
+  }
+}
+
+function spanMethod({ row, columnIndex }) {
+  if (row.examineResultRespVOList && row.examineResultRespVOList.length > 0) {
+    if (columnIndex === 0) {
+      return [1, 4]
+    } else if (columnIndex == 4 && row.id) {
+      return [1, 1]
+    } else {
+      return [0, 0]
+    }
+  }
+}
+
+const detailDialogRef = ref()
+function handleDetail(row) {
+  detailDialogRef.value.open(row.id)
+}
+
+async function handleSealup(row) {
+  try {
+    // 二次确认
+    await message.confirm('确认要封存"' + row.period + '"考核记录吗?')
+    // 发起修改状态
+    await KpiApi.saveScoreRecord({
+      period: row.period
+    })
+    message.success('封存成功！')
+    // 刷新列表
+    await getList()
+  } catch (err) {
+    console.log(err)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-table__indent) {
+  display: none;
+}
+
+:deep(.el-table__placeholder) {
+  display: none;
+}
+</style>

src/views/Kpi/Score/index.vue

@@ -0,0 +1,213 @@
+<template>
+  <div>
+    <!-- 搜索工作栏 -->
+    <el-form :model="searchForm" inline label-width="0">
+      <el-form-item>
+        <el-date-picker
+          v-model="searchForm.period"
+          type="month"
+          format="YYYY-MM"
+          value-format="YYYY-MM"
+          :clearable="false"
+          style="width: 100%"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList" v-hasPermi="['kpi:score:search']"> 搜索</el-button>
+      </el-form-item>
+    </el-form>
+    <el-tabs v-model="employeeId" @tab-click="getList">
+      <el-tab-pane
+        v-for="item in employeeOptions"
+        :key="item.examinedUser"
+        :name="item.examinedUser"
+      >
+        <template #label>
+          <span>{{ item.examinedUserName }}</span>
+          <el-badge :is-dot="item.notExaminedCount > 0" type="danger" />
+        </template>
+        <div class="mb-10px">
+          <el-tag v-if="periodSaved == 1" type="danger">
+            当前周期已封存，不可修改当月绩效考核
+          </el-tag>
+          <el-tag v-else type="warning">
+            当前周期未封存，可选择修改当月绩效考核，两秒内不操作将自动保存考核结果
+          </el-tag>
+        </div>
+
+        <el-table
+          v-loading="loading"
+          :data="list"
+          border
+          show-summary
+          :summary-method="getSummaries"
+        >
+          <el-table-column prop="examineTarget" label="考核指标" width="180" />
+          <el-table-column prop="typeName" label="分值模式" width="90" />
+          <el-table-column prop="weight" label="权重%" width="90" />
+          <el-table-column label="考核内容">
+            <template #default="{ row }">
+              <div v-dompurify-html="row.examineContent"></div>
+            </template>
+          </el-table-column>
+          <el-table-column label="考核规则" prop="examineRule">
+            <template #default="{ row }">
+              <div v-dompurify-html="row.examineRule"></div>
+            </template>
+          </el-table-column>
+          <el-table-column label="评分上限" prop="examineScore" width="90" />
+          <el-table-column label="考核评分" width="120">
+            <template #default="{ row }">
+              <div v-if="periodSaved == 1">{{ row.score }}</div>
+              <el-input-number
+                v-else
+                v-model="row.score"
+                :min="0"
+                :max="row.examineScore"
+                :step="1"
+                :controls="false"
+                size="small"
+                style="width: 100%"
+                @input="handleSave(row)"
+              />
+            </template>
+          </el-table-column>
+          <el-table-column label="评分备注" width="200">
+            <template #default="{ row }">
+              <div v-if="periodSaved == 1">{{ row.remark }}</div>
+              <el-input
+                v-else
+                v-model="row.remark"
+                type="textarea"
+                :rows="3"
+                size="small"
+                style="width: 100%"
+                @input="handleSave(row)"
+              />
+            </template>
+          </el-table-column>
+          <el-table-column label="加权得分" prop="weightSocre" width="90" />
+          <el-table-column label="操作" fixed="right" width="100">
+            <template #default="{ row }">
+              <el-button style="padding: 0" type="danger" text @click="handleDelete(row)">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script setup name="KpiScore">
+import { formatDate } from '@/utils/formatTime'
+import * as KpiApi from '@/api/kpi/score.js'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+const loading = ref(false) // 列表的加载中
+const list = ref([]) // 列表的数据
+const searchForm = ref({
+  period: undefined
+})
+
+const periodSaved = ref(0)
+
+const employeeOptions = ref([])
+const employeeId = ref('')
+
+onMounted(() => {
+  // 默认取上个月
+  const today = new Date()
+  searchForm.value.period = formatDate(
+    new Date(today.getFullYear(), today.getMonth() - 1),
+    'YYYY-MM'
+  )
+
+  getList()
+})
+
+async function getList() {
+  try {
+    KpiApi.getKpiPeriodStatus({ period: searchForm.value.period }).then((data) => {
+      periodSaved.value = data.status
+    })
+    // 获取当前要考核的人员
+    const arr = await KpiApi.getKpiEmployees(searchForm.value)
+    employeeOptions.value = arr || []
+    if (employeeOptions.value.length > 0) {
+      if (!employeeId.value) {
+        employeeId.value = employeeOptions.value[0].examinedUser
+      }
+    } else {
+      message.error('当月无待考核员工！！！')
+      return
+    }
+    list.value =
+      employeeOptions.value.find((it) => it.examinedUser == employeeId.value)
+        ?.examineScoreRespVOList || []
+  } finally {
+    loading.value = false
+  }
+}
+
+let timer = ref(null)
+const lastId = ref('')
+function handleSave(row) {
+  try {
+    lastId.value == row.id && clearTimeout(timer.value)
+    timer.value = setTimeout(async () => {
+      lastId.value = row.id
+      // message.success('正在保存数据，请稍后')
+      await KpiApi.saveKpiScore({
+        id: row.id,
+        score: row.score,
+        remark: row.remark
+      })
+      message.success('修改成功！')
+      getList()
+    }, 2000)
+  } catch (err) {
+    console.log(err)
+  }
+}
+
+async function handleDelete(row) {
+  try {
+    // 删除的二次确认
+    await message.delConfirm(
+      `删除后，该员工于${searchForm.value.period}将不再考核此项，是否确认删除？`
+    )
+    // 发起删除
+    await KpiApi.deleteKpiItem({ id: row.id })
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
+function getSummaries({ columns, data }) {
+  let sums = []
+  columns.forEach((column, index) => {
+    if (index == 0) {
+      sums[index] = '考核总分'
+      return
+    }
+    const values = data.map((item) => Number(item[column.property]))
+    if (!values.every((value) => Number.isNaN(value))) {
+      if (column.property == 'weightSocre') {
+        const employee = employeeOptions.value.find((it) => it.examinedUser == employeeId.value)
+        sums[index] = employee.scoreTotal + '分'
+      } else {
+        sums[index] = ''
+      }
+    } else {
+      sums[index] = ''
+    }
+  })
+  return sums
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/Login/Login.vue

@@ -1,54 +1,25 @@
 <template>
   <div
     :class="prefixCls"
-    class="h-[100%] relative <xl:bg-v-dark <sm:px-10px <xl:px-10px <md:px-10px"
+    class="h-[100%] relative dark:bg-v-dark <sm:px-10px <xl:px-10px <md:px-10px"
   >
     <div class="relative h-full flex mx-auto">
-      <div
-        :class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px <xl:hidden`"
-      >
+      <div :class="`${prefixCls}__left w-[30%] <lg:w-[100%] left-box relative p-30px <xl:p-20px`">
         <!-- 左上角的 logo + 系统标题 -->
-        <div class="flex items-center relative text-white">
-          <img alt="" class="w-48px h-48px mr-10px" :src="appInfo.instanceIcon" />
-          <span class="text-20px font-bold">{{ underlineToHump(appInfo.instanceName) }}</span>
-        </div>
-        <!-- 左边的背景图 + 欢迎语 -->
-        <div class="flex justify-center">
-          <TransitionGroup
-            appear
-            enter-active-class="animate__animated animate__bounceInLeft"
-            tag="div"
-          >
-            <img key="1" alt="" class="w-350px" src="@/assets/svgs/login-box-bg.svg" />
-            <!-- <div key="2" class="text-3xl text-white">{{ t('login.welcome') }}</div> -->
-          </TransitionGroup>
-        </div>
-
-        <div class="landIn">
-          <transition-group name="text-animation">
-            <span v-for="(char, index) in chars" :key="index">{{ char }}</span>
-          </transition-group>
-        </div>
-      </div>
-      <div class="flex-1 p-30px <sm:p-10px dark:bg-v-dark relative">
-        <!-- 右上角的主题、语言选择 -->
-        <div class="flex justify-between items-center text-white @2xl:justify-end @xl:justify-end">
-          <div class="flex items-center @2xl:hidden @xl:hidden">
-            <img alt="" class="w-48px h-48px mr-10px" :src="appInfo.instanceIcon" />
-            <span class="text-20px font-bold">{{ underlineToHump(appInfo.instanceName) }}</span>
-          </div>
-          <div class="flex justify-end items-center space-x-10px">
-            <ThemeSwitch />
-            <!-- <LocaleDropdown class="<xl:text-white dark:text-white" /> -->
-          </div>
+        <div class="flex items-center relative">
+          <h2 class="mb-3 text-2xl font-bold">
+            欢迎使用 {{ underlineToHump(appInfo.instanceName) }}
+          </h2>
+          <!-- <img alt="" class="w-48px h-48px mr-10px" :src="appInfo.instanceIcon" /> -->
+          <!-- <span class="text-20px font-bold">{{ underlineToHump(appInfo.instanceName) }}</span> -->
         </div>
         <!-- 右边的登录界面 -->
         <Transition appear enter-active-class="animate__animated animate__bounceInRight">
           <div
-            class="h-full flex items-center m-auto w-[100%] @2xl:max-w-500px @xl:max-w-500px @md:max-w-500px @lg:max-w-500px"
+            class="flex items-center m-auto w-[100%] @2xl:max-w-500px @xl:max-w-500px @md:max-w-500px @lg:max-w-500px <xl:mt-20px"
           >
             <!-- 账号登录 -->
-            <LoginForm class="p-20px h-auto m-auto <xl:(rounded-3xl light:bg-white)" />
+            <LoginForm class="p-40px <xl:p-10px h-auto m-auto" />
             <!-- 手机登录 -->
             <!-- <MobileForm class="p-20px h-auto m-auto <xl:(rounded-3xl light:bg-white)" /> -->
             <!-- 二维码登录 -->
@@ -59,6 +30,39 @@
             <!-- <SSOLoginVue class="p-20px h-auto m-auto <xl:(rounded-3xl light:bg-white)" /> -->
           </div>
         </Transition>
+        <!-- 左边的背景图 + 欢迎语 -->
+        <div class="flex justify-center">
+          <TransitionGroup
+            appear
+            enter-active-class="animate__animated animate__bounceInLeft"
+            tag="div"
+          >
+            <!-- <img key="1" alt="" class="w-350px" src="@/assets/svgs/login-box-bg.svg" /> -->
+            <img key="1" alt="" class="w-[50%] m-auto" src="@/assets/imgs/login2.gif" />
+          </TransitionGroup>
+        </div>
+
+        <div class="landIn">
+          <transition-group name="text-animation">
+            <span v-for="(char, index) in chars" :key="index">{{ char }}</span>
+          </transition-group>
+        </div>
+      </div>
+      <div class="login-box flex-1 p-30px <sm:p-10px dark:bg-v-dark <lg:hidden relative">
+        <!-- 右上角的主题、语言选择 -->
+        <div class="flex justify-between items-center text-white @2xl:justify-end @xl:justify-end">
+          <div class="flex items-center @2xl:hidden @xl:hidden">
+            <!-- <img alt="" class="w-48px h-48px mr-10px" :src="appInfo.instanceIcon" /> -->
+            <!-- <span class="text-20px font-bold text-black">
+              欢迎使用 {{ underlineToHump(appInfo.instanceName) }}
+            </span> -->
+          </div>
+          <div class="flex justify-end items-center space-x-10px">
+            <ThemeSwitch />
+            <!-- <LocaleDropdown class="<xl:text-white dark:text-white" /> -->
+          </div>
+        </div>
+        <img src="@/assets/imgs/shisong.jpg" width="80%" alt="" srcset="" />
       </div>
     </div>
   </div>
@@ -137,7 +141,7 @@ $prefix-cls: #{$namespace}-login;
       z-index: -1;
       width: 100%;
       height: 100%;
-      background-image: url('@/assets/svgs/login-bg.svg');
+      // background-image: url('@/assets/svgs/login-bg.svg');
       background-position: center;
       background-repeat: no-repeat;
       content: '';
@@ -145,6 +149,20 @@ $prefix-cls: #{$namespace}-login;
   }
 }
 
+// .left-box {
+//   background: #f3f4fb;
+//   background-image: url('@/assets/imgs/login-left-bg.png');
+//   background-repeat: no-repeat;
+//   background-size: 100% 100%;
+// }
+
+.login-box {
+  background-image: url('@/assets/imgs/shisong.jpg');
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: 80% 80%;
+}
+
 .text-animation-enter-active,
 .text-animation-leave-active {
   transition: opacity 0.5s;
@@ -160,12 +178,11 @@ $prefix-cls: #{$namespace}-login;
   width: 80%;
   display: flex;
   flex-wrap: wrap;
-  font-size: 18px;
-  line-height: 1.8;
+  font-size: 1rem;
+  line-height: 1.3;
   font-family: Lora, serif;
   white-space: pre;
   font-weight: 600;
-  color: #6ee1f5;
 
   span {
     animation: landIn 0.8s ease-out both;

src/views/Login/components/LoginForm.vue

@@ -11,10 +11,13 @@
   >
     <el-row style="margin-left: -10px; margin-right: -10px">
       <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
+        <slot name="title"></slot>
+      </el-col>
+      <!-- <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
         <el-form-item>
           <LoginFormTitle style="width: 100%" />
         </el-form-item>
-      </el-col>
+      </el-col> -->
       <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
         <el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantId">
           <el-input
@@ -107,7 +110,7 @@
 </template>
 <script name="LoginForm" setup>
 import { ElLoading } from 'element-plus'
-import LoginFormTitle from './LoginFormTitle.vue'
+// import LoginFormTitle from './LoginFormTitle.vue'
 
 import { useIcon } from '@/hooks/web/useIcon'
 

src/views/OKR/Management/Components/AllTarget.vue

@@ -0,0 +1,138 @@
+<template>
+  <div>
+    <div class="flex items-center justify-between">
+      <el-row>
+        <el-tree-select
+          v-model="searchForm.nodeId"
+          :data="peroidList"
+          :props="defaultProps"
+          :render-after-expand="false"
+          :default-expand-all="false"
+          check-strictly
+          style="width: 400px"
+          @change="nodeChange"
+        />
+        <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>
+        <el-button
+          type="success"
+          v-if="searchForm.executor?.includes(currentUserId)"
+          @click="handleUpdateProcess"
+          >更新进度</el-button
+        >
+      </el-row>
+    </div>
+
+    <OkrTable ref="okrTableRef" :canEdit="isCurrentLeafNode" />
+    <DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
+    <DialogOkrInfo ref="dialogOkrInfo" @success="handleSearchPeroid" />
+  </div>
+</template>
+
+<script setup name="AllTarget">
+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
+})
+
+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
+  }
+}
+
+function getOkrList() {
+  getAllOkrPage(searchForm.value).then((resp) => {
+    const list = resp
+    nextTick(() => {
+      okrTableRef.value.prepareData(list)
+    })
+  })
+}
+
+const dialogOkrInfo = ref(null)
+function handleAddNode() {
+  dialogOkrInfo.value.open('create', null)
+}
+
+function handleEditOkr() {
+  dialogOkr.value.close()
+  dialogOkrInfo.value.open('update', searchForm.value.nodeId)
+}
+
+function handleUpdateProcess() {
+  okrTableRef.value.updateProcess(searchForm.value.nodeId).then(() => {
+    message.success('更新成功')
+    getOkrList()
+  })
+}
+
+const dialogOkr = ref(null)
+function handleShowOkr(id) {
+  dialogOkr.value.open({
+    nodeId: id,
+    canEdit: isCurrentLeafNode.value
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-overlay-dialog) {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

src/views/OKR/Management/Components/DialogOkr.vue

@@ -0,0 +1,648 @@
+<template>
+  <el-dialog
+    v-if="show"
+    v-model="show"
+    width="94vw"
+    class="dialog-okr"
+    :show-close="false"
+    :close-on-click-modal="false"
+  >
+    <template #header>
+      <div class="dialog-okr-header">
+        <div class="flex-1 flex items-center" style="line-height: 50px">
+          <div class="dialog-okr-title">
+            <Icon icon="ep:circle-check-filled" color="#30d1fc" :size="14" />
+            <span>目标</span>
+          </div>
+          <el-divider direction="vertical" />
+          <span class="text-14px ml-0.25">ork落地</span>
+          <div class="ml-20px text-14px">
+            <span>【节点】</span>
+            <span>{{ nodeInfo.allNodeName }}</span>
+          </div>
+        </div>
+        <div class="flex items-center">
+          <el-button v-if="nodeInfo.creatorId == currentUserId" link @click="emit('edit')">
+            <el-tooltip content="编辑" placement="top" effect="dark">
+              <Icon icon="ep:edit" :size="16" />
+            </el-tooltip>
+          </el-button>
+
+          <el-button link @click="show = false">
+            <el-tooltip content="关闭" placement="top" effect="dark">
+              <Icon icon="ep:close" :size="16" />
+            </el-tooltip>
+          </el-button>
+        </div>
+      </div>
+    </template>
+    <template #default>
+      <div class="dialog-okr-body">
+        <div class="dialog-okr-content pr-10px">
+          <div class="dialog-okr-content-detail">
+            <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>
+              <div class="basic-title-item">
+                <div class="basic-title-label">执行人</div>
+                <div class="basic-title-value">{{ nodeInfo.executorName || '无' }}</div>
+              </div>
+              <div class="basic-title-item">
+                <div class="basic-title-label">目标数</div>
+                <div class="basic-title-value">{{ okrList.length }}</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" />
+              </div>
+            </div>
+            <div class="flex detail-basic-info">
+              <span>开始日期：{{ nodeInfo.startTime }}</span>
+              <span>截止日期：{{ nodeInfo.endTime }}</span>
+              <span>最新更新时间：{{ nodeInfo.updateTime }}</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" />
+                </div>
+              </el-tab-pane>
+            </el-tabs>
+            <el-button v-if="canEdit" class="sav-btn" type="primary" @click="handleSaveProcess">
+              保存并更新
+            </el-button>
+          </div>
+        </div>
+        <div class="dialog-okr-side pl-10px">
+          <el-tabs v-model="sideIndex" style="flex: 1; height: 100%">
+            <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"
+                  class="border-b-1 child-item"
+                  style="padding: 10px 5px; cursor: pointer"
+                  @click="handleChildItem(item)"
+                >
+                  <div
+                    class="flex justify-between items-center overflow-hidden text-16px"
+                    style="line-height: 30px"
+                  >
+                    <div class="child-label">【节点】{{ item.nodeName }}</div>
+                    <el-progress
+                      type="line"
+                      :percentage="parseInt(item.progress) || 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>
+                    <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>
+                    </div>
+                  </div>
+                  <div
+                    class="ml-10px flex items-center text-12px"
+                    style="line-height: 20px; color: #aaa"
+                  >
+                    <span>开始日期：{{ item.startTime }}</span>
+                    <el-divider direction="vertical" style="margin: 0 20px" />
+                    <span>截止日期：{{ item.endTime }}</span>
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane label="评论" name="conclusion">
+              <div class="relative overflow-y-auto" style="height: calc(100% - 50px)">
+                <div class="flex justify-between items-center">
+                  <el-select
+                    v-if="addNewComment"
+                    v-model="form.commentType"
+                    filterable
+                    size="small"
+                    style="width: 120px"
+                    @change="getCommentTemplate"
+                  >
+                    <el-option
+                      v-for="it in commentTypeOptions"
+                      :label="it.label"
+                      :value="it.id"
+                      :key="it.id"
+                    />
+                  </el-select>
+
+                  <div v-if="addNewComment">
+                    <el-button size="small" @click="addNewComment = false"> 取消 </el-button>
+                    <el-button type="primary" size="small" @click="handleSaveComment">
+                      发布
+                    </el-button>
+                  </div>
+                  <el-button v-else type="primary" size="small" @click="handleInsertComment">
+                    新增评论
+                  </el-button>
+                </div>
+                <div class="mt-10px" v-if="addNewComment">
+                  <Editor
+                    v-model:modelValue="form.commentValue"
+                    height="300px"
+                    :toolbarConfig="toolbarConfig"
+                  />
+                </div>
+                <div
+                  v-for="(it, index) in commentList"
+                  :key="it.commentId"
+                  class="border-b-1"
+                  style="padding: 10px 5px"
+                >
+                  <div
+                    class="flex items-center justify-between overflow-hidden text-16px"
+                    style="line-height: 30px"
+                  >
+                    <div class="flex items-center">
+                      <el-avatar
+                        shape="circle"
+                        style="
+                          background-color: var(--el-color-primary-light-3);
+                          width: 30px;
+                          height: 30px;
+                        "
+                        fit="fill"
+                      >
+                        <span class="text-12px">{{ it.creatorName.slice(-2) }}</span>
+                      </el-avatar>
+                      <div class="ml-10px text-16px">{{ it.creatorName }}</div>
+                    </div>
+                  </div>
+                  <div class="ml-10px" v-dompurify-html="it.content"></div>
+                  <div
+                    class="ml-10px mt-10px flex items-center justify-between text-12px"
+                    style="line-height: 20px; color: #aaa"
+                  >
+                    <div class="flex items-center">
+                      <div class="flex items-center mr-50px">
+                        <el-button link @click="good(it)">
+                          <Icon
+                            icon="fa:thumbs-o-up"
+                            :size="16"
+                            :color="it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'"
+                          />
+                        </el-button>
+                        <span
+                          class="ml-5px"
+                          :style="{
+                            color: it.currentUserIsLike ? 'var(--el-color-primary)' : '#333'
+                          }"
+                          >{{ it.likeCount }}</span
+                        >
+                      </div>
+                      <div class="flex items-center mr-50px">
+                        <el-button link @click="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>
+                    <div class="ml-10px text-13px text-gray-400">
+                      {{ formatDate(it.createTime, 'YYYY-MM-DD HH:mm') }}
+                    </div>
+                  </div>
+                  <!-- 评论 -->
+                  <div
+                    v-if="showCommentIndex == index"
+                    class="bg-gray-100 pl-10px pr-10px pt-5px pb-5px"
+                    style="margin: 10px 10px 0 10px; border-radius: 4px"
+                    label="评论"
+                  >
+                    <div
+                      v-for="subComment in it.children.sort((a, b) => a.createTime - b.createTime)"
+                      :key="subComment.commentId"
+                      class="text-14px"
+                      style="line-height: 24px"
+                    >
+                      <span class="font-bold">{{ subComment.creatorName }}：</span>
+                      <span>
+                        {{ subComment.content }}
+                      </span>
+                    </div>
+                    <div class="mt-10px relative">
+                      <!-- <el-input
+                        v-model="form.commentValue"
+                        placeholder="请输入评论"
+                        type="textarea"
+                        :autosize="{ minRows: 4 }"
+                        clearable
+                        size="small"
+                        style="width: 100%"
+                      /> -->
+                      <el-mention
+                        v-model="form.commentValue"
+                        type="textarea"
+                        :autosize="{ minRows: 4 }"
+                        :options="employeeOptions"
+                        style="width: 100%"
+                        size="small"
+                        whole
+                        placeholder="请输入评论"
+                        @select="handleMention"
+                      >
+                        <template #label="{ 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)"
+                      >
+                        发布
+                      </el-button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+            <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>
+                    <div class="mt-10px text-14px" style="line-height: 24px; color: #666">
+                      {{ item.content }}
+                    </div>
+                  </el-timeline-item>
+                </el-timeline>
+              </div>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+      </div>
+    </template>
+  </el-dialog>
+</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: [
+    'bold', // 加粗
+    'underline', // 下划线
+    'italic', // 斜体
+    'color', // 文字颜色
+    'bgColor', // 背景色
+    'fontSize', // 字号
+    'bulletedList', // 无序列表
+    'numberedList', // 有序列表
+    'insertTable', // 插入表格
+    'insertLink', // 插入链接
+    'undo' // 撤销
+  ]
+}
+
+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)
+  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 {
+  }
+}
+
+function close() {
+  show.value = false
+}
+
+defineExpose({ open, close })
+
+function handleMention(item) {
+  form.value.mentionedUserIdList.push(item.id)
+}
+
+function handleSaveProcess() {
+  okrTableRef.value.updateProcess(nodeInfo.value.nodeId).then(() => {
+    message.success('更新成功')
+    searchInfo()
+  })
+}
+
+function handleChildItem(item) {
+  const arr = item.executor || []
+  const isExecutor = arr.includes(currentUserId)
+  canEdit.value = isExecutor && (!item.children || item.children.length == 0)
+  searchInfo(item)
+}
+
+const addNewComment = ref(false)
+const form = ref({
+  commentValue: '',
+  commentType: undefined,
+  mentionedUserIdList: []
+})
+function handleInsertComment() {
+  addNewComment.value = true
+  const defaultComment = commentTypeOptions.value[0]
+  if (defaultComment) {
+    form.value = {
+      commentType: defaultComment.id,
+      mentionedUserIdList: []
+    }
+  }
+  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> &nbsp; &nbsp;</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 showCommentIndex = ref(-1)
+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('评论失败')
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.dialog-okr {
+  .dialog-okr-header {
+    display: flex;
+    height: 51px;
+    min-height: 51px;
+    vertical-align: middle;
+    justify-content: space-between;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    padding: 0 1.25rem;
+    .dialog-okr-title {
+      display: flex;
+      margin-right: 5px;
+      align-items: center;
+      background: rgba(48, 209, 252, 0.1);
+      border-radius: 3px;
+      padding: 0 10px;
+      line-height: 24px;
+      span {
+        color: #2a344b;
+        font-size: 12px;
+        margin-left: 6px;
+      }
+    }
+  }
+  .dialog-okr-body {
+    display: flex;
+    background: #f0f3fa;
+    overflow: hidden;
+    min-width: 1064px;
+    height: calc(94vh - 85px);
+    .dialog-okr-content {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      width: 70%;
+      flex: auto;
+      min-width: 700px;
+      background: #fff;
+      margin: 0 1px 0 0;
+      justify-content: space-between;
+      overflow-y: hidden !important;
+      .dialog-okr-content-detail {
+        position: relative;
+        margin-bottom: 30px;
+        overflow-y: auto;
+        display: -webkit-box;
+        display: -ms-flexbox;
+        display: flex;
+        -webkit-box-orient: vertical;
+        -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+        flex-direction: column;
+        .detail-basic-title {
+          display: flex;
+          font-size: 14px;
+          margin-bottom: 16px;
+          .basic-title-item {
+            margin-right: 50px;
+            .basic-title-label {
+              color: #aaa;
+              margin-bottom: 6px;
+            }
+            .basic-title-value {
+              color: #2a344b;
+              font-size: 14px;
+            }
+          }
+        }
+        .detail-basic-info {
+          font-size: 14px;
+          color: #aaa;
+          span {
+            margin-right: 40px;
+          }
+        }
+      }
+      .content-wrap {
+        overflow-y: auto;
+        max-height: calc(100% - 70px);
+      }
+    }
+    .dialog-okr-side {
+      padding-left: 10px;
+      display: flex;
+      flex-direction: column;
+      width: 30%;
+      overflow: hidden;
+      min-width: 364px;
+      max-width: 500px;
+      background: #fff;
+      margin: 0;
+      .child-item:hover {
+        background: #f0f3fa;
+      }
+    }
+  }
+}
+
+.sav-btn {
+  position: absolute;
+  right: 10px;
+  top: 0;
+  width: auto;
+}
+</style>

src/views/OKR/Management/Components/DialogOkrInfo.vue

@@ -0,0 +1,587 @@
+<template>
+  <el-dialog
+    v-model="show"
+    width="900px"
+    class="dialog-okr"
+    :show-close="false"
+    :close-on-click-modal="false"
+  >
+    <template #header>
+      <div class="dialog-okr-header">
+        <div class="flex-1 flex items-center" style="line-height: 50px"> {{ title }} </div>
+        <div class="flex items-center">
+          <el-button type="primary" link :disabled="formLoading" @click="handleSave">
+            保存
+          </el-button>
+          <el-button link @click="show = false"> 关闭 </el-button>
+        </div>
+      </div>
+    </template>
+    <template #default>
+      <div class="dialog-okr-body" v-loading="formLoading">
+        <el-form :model="form" ref="formRef" :rules="rules" label-width="0">
+          <el-row :gutter="10">
+            <el-col :span="4" :offset="0">
+              <el-form-item prop="parentId">
+                <el-tree-select
+                  v-model="form.parentId"
+                  :data="parentNodeList"
+                  check-strictly
+                  :props="{ value: 'nodeId', label: 'nodeName', 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>
+            </el-col>
+            <el-col :span="4" :offset="0">
+              <el-form-item prop="startTime">
+                <el-date-picker
+                  v-model="form.startTime"
+                  type="date"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
+                  placeholder="开始日期"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="4" :offset="0">
+              <el-form-item prop="endTime">
+                <el-date-picker
+                  v-model="form.endTime"
+                  type="date"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
+                  placeholder="截止日期"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="4" :offset="0">
+              <el-form-item prop="executor">
+                <el-select
+                  v-model="form.executor"
+                  placeholder="选择执行人，可多选"
+                  multiple
+                  collapse-tags
+                  collapse-tags-tooltip
+                  clearable
+                  filterable
+                >
+                  <el-option
+                    v-for="item in userOptions"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id + ''"
+                    :disabled="item.status == 1"
+                  />
+                </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-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+        <div class="relative">
+          <el-button
+            v-if="okrKey == 'okr'"
+            style="position: absolute; right: 10px; top: 10px; z-index: 9"
+            type="primary"
+            size="small"
+            @click="addObjective"
+          >
+            添加目标
+          </el-button>
+          <el-button
+            v-else-if="okrKey == 'childNode'"
+            style="position: absolute; right: 10px; top: 10px; z-index: 9"
+            type="primary"
+            size="small"
+            @click="addChildNode"
+          >
+            添加子节点
+          </el-button>
+          <el-tabs v-model="okrKey">
+            <el-tab-pane label="目标/关键成果" name="okr">
+              <div>
+                <div
+                  class="flex items-center w-full"
+                  v-for="(item, i) in objectList"
+                  :key="item.objectiveId"
+                >
+                  <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-select
+                        v-model="item.executor"
+                        placeholder="选择执行人，可多选"
+                        multiple
+                        clearable
+                        filterable
+                        style="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"
+                        />
+                      </el-select>
+                      <el-select
+                        v-model="item.dataScope"
+                        placeholder="选择权限"
+                        clearable
+                        filterable
+                        style="width: 120px; margin-left: 10px"
+                      >
+                        <el-option label="公开" :value="1" />
+                        <el-option label="仅上级可见" :value="2" />
+                      </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>
+                      </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="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="选择或输入关键成果"
+                            filterable
+                            :props="{ value: 'keyResultId', label: 'keyResultName' }"
+                            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"
+                            />
+                          </el-select>
+                          <el-button type="danger" text @click="removeKR(i, index)">
+                            删除关键成果
+                          </el-button>
+                        </div>
+                        <div class="mt-5px flex items-center">
+                          <el-tree-select
+                            v-model="kr.sourceId"
+                            :data="sourceOptions"
+                            :props="defaultProps"
+                            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>
+
+                          <el-input
+                            v-if="kr.resultType == 1"
+                            v-model="kr.targetValue"
+                            type="number"
+                            placeholder="目标值"
+                            class="ml-10px"
+                            style="width: 120px"
+                          />
+
+                          <el-select
+                            v-model="kr.executor"
+                            placeholder="选择执行人，可多选"
+                            multiple
+                            clearable
+                            filterable
+                            collapse-tags
+                            collapse-tags-tooltip
+                            style="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"
+                            />
+                          </el-select>
+                          <el-select
+                            v-model="kr.dataScope"
+                            placeholder="选择权限"
+                            clearable
+                            filterable
+                            style="width: 120px; margin-left: 10px"
+                          >
+                            <el-option label="公开" :value="1" />
+                            <el-option label="仅上级可见" :value="2" />
+                          </el-select>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <!-- <div class="w-100px"></div> -->
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane label="子节点" name="childNode">
+              <el-table :data="childNodeList">
+                <el-table-column label="名称">
+                  <template #default="{ row }">
+                    <el-input v-model="row.nodeName" placeholder="子节点名称" />
+                  </template>
+                </el-table-column>
+                <el-table-column label="开始日期" width="160px">
+                  <template #default="{ row }">
+                    <el-date-picker
+                      v-model="row.startTime"
+                      type="date"
+                      format="YYYY-MM-DD"
+                      value-format="YYYY-MM-DD"
+                      placeholder="选择日期时间"
+                      style="width: 130px"
+                    />
+                  </template>
+                </el-table-column>
+                <el-table-column label="截止日期" width="160px">
+                  <template #default="{ row }">
+                    <el-date-picker
+                      v-model="row.endTime"
+                      type="date"
+                      format="YYYY-MM-DD"
+                      value-format="YYYY-MM-DD"
+                      placeholder="选择日期时间"
+                      style="width: 130px"
+                    />
+                  </template>
+                </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>
+                  </template>
+                </el-table-column>
+                <el-table-column label="执行人" width="300px">
+                  <template #default="{ row }">
+                    <el-select
+                      v-model="row.executor"
+                      placeholder="选择执行人，可多选"
+                      multiple
+                      clearable
+                      filterable
+                      style="width: 100%"
+                    >
+                      <el-option
+                        v-for="item in userOptions"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id + ''"
+                        :disabled="item.status == 1"
+                      />
+                    </el-select>
+                  </template>
+                </el-table-column>
+                <el-table-column fixed="right" label="删除" :width="100">
+                  <template #default="{ $index }">
+                    <el-button type="danger" text @click="removeChildNode($index)">删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+      </div>
+    </template>
+  </el-dialog>
+</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() // 消息弹窗
+
+const show = ref(false)
+
+watch(
+  () => show.value,
+  (newValue, oldValue) => {
+    if (oldValue && !newValue) {
+      emit('close')
+    }
+  }
+)
+
+const title = ref('')
+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 okrKey = ref('okr')
+
+const parentNodeList = ref([])
+
+const childNodeList = ref([])
+
+const userOptions = ref([])
+const krOptions = ref([])
+const defaultProps = {
+  children: 'children',
+  label: 'sourceName',
+  value: 'sourceId',
+  isLeaf: 'leaf'
+}
+const sourceOptions = ref([])
+const objectList = ref([])
+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]
+      })
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+function resetForm() {
+  form.value = {
+    parentId: undefined,
+    nodeName: undefined,
+    startTime: undefined,
+    endTime: undefined,
+    executor: [],
+    dataScope: 1
+  }
+}
+
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+const formRef = ref()
+/** 提交表单 */
+const emit = defineEmits(['success', 'close']) // 定义 success 事件，用于操作成功后的回调
+
+function addObjective() {
+  objectList.value.push({
+    objectiveName: '',
+    executor: [],
+    keyResults: [],
+    dataScope: 1
+  })
+}
+
+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 removeObj(idx) {
+  objectList.value.splice(idx, 1)
+}
+
+function removeKR(oIdx, krIdx) {
+  objectList.value[oIdx].keyResults.splice(krIdx, 1)
+}
+
+function addChildNode() {
+  childNodeList.value.push({})
+}
+
+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
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  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)
+      message.success(t('common.createSuccess'))
+    } else {
+      await updateOkrNode(form.value)
+      message.success(t('common.updateSuccess'))
+    }
+    show.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.dialog-okr {
+  .dialog-okr-header {
+    display: flex;
+    height: 51px;
+    min-height: 51px;
+    vertical-align: middle;
+    justify-content: space-between;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    padding: 0 1.25rem;
+  }
+  .dialog-okr-body {
+    overflow-x: hidden;
+    overflow-y: auto;
+    min-width: 1064px;
+    height: calc(94vh - 85px);
+  }
+}
+</style>

src/views/OKR/Management/Components/DialogWait.vue

@@ -0,0 +1,347 @@
+<template>
+  <Dialog :title="title" v-model="show" :width="formType == 'create' ? '750px' : '1100px'">
+    <div class="flex items-baseline">
+      <el-form
+        :model="form"
+        ref="formRef"
+        :disabled="formType == 'do'"
+        :rules="rules"
+        label-width="80px"
+        class="flex-1"
+      >
+        <el-row :gutter="20">
+          <el-col :span="24" :offset="0">
+            <el-form-item label="标题" prop="title">
+              <el-input v-model="form.title" placeholder="请输入待办标题" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="内容" prop="content">
+              <Editor
+                v-model:modelValue="form.content"
+                height="400px"
+                :disabled="formType == 'do'"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12" :offset="0">
+            <el-form-item label="优先级" prop="priority">
+              <el-select v-model="form.priority" placeholder="选择优先级" filterable>
+                <el-option
+                  v-for="item in props.priorityOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </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-option
+                  v-for="item in props.statusOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12" :offset="0">
+            <el-form-item label="截止日期" prop="endDate">
+              <el-date-picker
+                v-model="form.endDate"
+                type="date"
+                format="YYYY-MM-DD"
+                value-format="YYYY-MM-DD"
+                placeholder="选择日期时间"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12" :offset="0">
+            <el-form-item label="执行人" prop="userList">
+              <el-select
+                v-model="form.userList"
+                placeholder="选择执行人，可多选"
+                multiple
+                clearable
+                filterable
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in employeeOptions"
+                  :key="item.id"
+                  :disabled="item.status == 1"
+                  :label="item.name"
+                  :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="0">
+          <el-col :span="8" :offset="0">
+            <el-form-item prop="notifyType">
+              <template #label>
+                <el-tooltip
+                  content="新增待办时会立刻发送消息通知执行人，若后续无需再次提醒，频率可选择“不提醒”"
+                  placement="top"
+                  effect="dark"
+                >
+                  <Icon icon="ep:info-filled" :size="12" />
+                </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>
+            </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"
+              >
+                <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>
+                </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-time-picker
+                v-model="form.firstNotifyTime"
+                format="HH:mm"
+                value-format="HH:mm"
+                style="width: 100%"
+                :picker-options="enableTimeRange"
+                placeholder="选择时间点"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="formType != 'create'" class="w-350px ml-10px h-full">
+        <div class="mb-10px" v-if="formType == 'do'">
+          <Editor
+            v-model:modelValue="form.followUpContent"
+            height="150px"
+            :toolbarConfig="toolbarConfig"
+          />
+          <el-button class="absolute" style="right: 20px; top: 195px" type="primary" @click="addDo">
+            更新进度
+          </el-button>
+        </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>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+
+    <template #footer v-if="formType != 'do'">
+      <span>
+        <el-button @click="show = false">取 消</el-button>
+        <el-button type="primary" :disabled="formLoading" @click="handleSave">保 存</el-button>
+      </span>
+    </template>
+  </Dialog>
+</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' }
+    ]
+  },
+  statusOptions: {
+    type: Array,
+    default: () => [
+      { label: '未完成', value: '1', tagType: 'warning' },
+      { label: '已关闭', value: '2', tagType: 'success' }
+    ]
+  }
+})
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const toolbarConfig = {
+  toolbarKeys: []
+}
+
+const enableTimeRange = {
+  selectableRange: '07:00 - 22:00'
+}
+
+const show = ref(false)
+const title = ref('')
+const formType = ref('create')
+
+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' }]
+})
+
+const followList = ref([])
+
+function open(type, id) {
+  show.value = true
+  title.value = { create: '新增待办', update: '修改待办', do: '更新待办进度' }[type]
+  formType.value = type
+  resetForm()
+  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)
+    } finally {
+      formLoading.value = false
+    }
+  }
+  getOptions()
+}
+
+function getFollowList(id) {
+  // 跟进数据
+  getFollowWaitPage({
+    workId: id
+  }).then((data) => {
+    followList.value = data
+  })
+}
+
+function getOptions() {
+  getEmployeeSimpleList().then((data) => {
+    employeeOptions.value = data
+  })
+}
+
+function resetForm() {
+  form.value = {
+    title: undefined,
+    content: undefined,
+    priority: '1',
+    completeStatus: '1',
+    endDate: undefined,
+    userList: [],
+    notifyType: '3',
+    remindTime: 12,
+    firstNotifyTime: '09:00'
+  }
+}
+
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+const formRef = ref()
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+async function handleSave() {
+  // 校验表单
+  if (!formRef.value) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    if (formType.value === 'create') {
+      await createWait(form.value)
+      message.success(t('common.createSuccess'))
+    } else {
+      await updateWait(form.value)
+      message.success(t('common.updateSuccess'))
+    }
+    show.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+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>
+.wait-form {
+  :deep(.el-input-group__prepend) {
+    padding: 0 10px;
+  }
+  :deep(.el-input-group__append) {
+    padding: 0 10px;
+  }
+  :deep(.el-input__inner) {
+    text-align: center;
+  }
+}
+</style>

src/views/OKR/Management/Components/MyDuty.vue

@@ -0,0 +1,107 @@
+<template>
+  <div>
+    <div class="flex items-center justify-between">
+      <el-row>
+        <el-tree-select
+          v-model="searchForm.nodeId"
+          :data="peroidList"
+          :props="defaultProps"
+          :render-after-expand="false"
+          :default-expand-all="false"
+          style="width: 400px"
+          @change="getOkrList"
+        />
+      </el-row>
+      <el-row>
+        <el-button type="info" @click="handleShowOkr(searchForm.nodeId)"> 节点详情 </el-button>
+        <el-button type="success" @click="handleUpdateProcess">更新进度</el-button>
+      </el-row>
+    </div>
+
+    <OkrTable ref="okrTableRef" canEdit />
+    <DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
+    <DialogOkrInfo ref="dialogOkrInfo" />
+  </div>
+</template>
+
+<script setup name="MyDuty">
+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
+})
+
+const peroidList = ref([])
+
+// onMounted(() => {
+handleSearchPeroid()
+// })
+
+function handleSearchPeroid() {
+  getMyNodeTree().then((resp) => {
+    peroidList.value = listToTree(resp.tree, {
+      id: 'nodeId',
+      pid: 'parentId',
+      children: 'children'
+    })
+    searchForm.value.nodeId = resp.nodeId
+    getOkrList()
+  })
+}
+
+function getOkrList() {
+  getMyOkrPage(searchForm.value).then((resp) => {
+    const list = resp
+    nextTick(() => {
+      okrTableRef.value.prepareData(list)
+    })
+  })
+}
+
+const dialogOkrInfo = ref(null)
+// function handleAddNode() {
+//   dialogOkrInfo.value.open('create', null)
+// }
+
+function handleEditOkr() {
+  dialogOkr.value.close()
+  dialogOkrInfo.value.open('update', 1)
+}
+
+function handleUpdateProcess() {
+  okrTableRef.value.updateProcess(searchForm.value.nodeId).then(() => {
+    message.success('更新成功')
+    getOkrList()
+  })
+}
+
+const dialogOkr = ref(null)
+function handleShowOkr(id) {
+  dialogOkr.value.open({
+    nodeId: id,
+    canEdit: true
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-overlay-dialog) {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

src/views/OKR/Management/Components/ObjectList.vue

@@ -0,0 +1,228 @@
+<template>
+  <div style="height: 100vh">
+    <div class="flex items-center">
+      <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.nodeName ? searchForm.nodeName : '选择周期' }}
+            </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.nodeId" :label="row.nodeId">{{
+                    row.nodeName
+                  }}</el-radio>
+                </template>
+              </el-table-column>
+              <el-table-column label="开始日期" prop="startTime" width="120" />
+              <el-table-column label="截止日期" prop="endTime" width="120" />
+            </el-table>
+          </div>
+        </div>
+      </el-popover>
+      <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"
+    >
+      <template #default="{ node }">
+        <div style="cursor: pointer">
+          <div class="tree-org-node__text node-label">
+            <el-popover placement="right" title="目标" width="270px" trigger="hover">
+              <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>
+              </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>
+                    <span style="margin-left: 0.5rem">
+                      {{ i.objectiveName }}
+                    </span>
+                  </div>
+                </div>
+              </template>
+            </el-popover>
+          </div>
+          <div class="p-5px">
+            <el-progress
+              type="line"
+              :percentage="parseInt(getNodePropData(node.id, 'progress')) || 0"
+              text-inside
+              :stroke-width="12"
+            />
+          </div>
+        </div>
+      </template>
+    </vue3-tree-org>
+    <DialogOkr ref="dialogOkr" @edit="handleEditOkr" />
+    <DialogOkrInfo ref="dialogOkrInfo" @close="openOkr" />
+  </div>
+</template>
+
+<script setup name="ObjectList">
+import { Vue3TreeOrg } from 'vue3-tree-org'
+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 searchForm = ref({
+  nodeName: '',
+  nodeId: null
+})
+
+const peroidList = ref([])
+
+handleSearchPeroid()
+
+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()
+    }
+  })
+}
+
+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()
+}
+
+function getNodePropData(nodeId, prop) {
+  const nodeData = helpDataList.value.find((it) => it.nodeId == nodeId)
+  if (nodeData) {
+    return nodeData[prop]
+  } else {
+    return ''
+  }
+}
+
+function toggleExpand(data, val) {
+  if (Array.isArray(data)) {
+    data.forEach((item) => {
+      item.expand = val
+      if (item.children) {
+        toggleExpand(item.children, val)
+      }
+    })
+  } else {
+    data.expand = val
+    if (data.children) {
+      toggleExpand(data.children, val)
+    }
+  }
+}
+
+toggleExpand(dataList.value, true)
+
+const dialogOkr = ref(null)
+const clickNode = ref(null)
+function handleClickNode(node, data) {
+  clickNode.value = data
+  openOkr()
+}
+
+function openOkr() {
+  clickNode.value &&
+    dialogOkr.value.open({
+      nodeId: clickNode.value.nodeId,
+      canEdit: !clickNode.value.children || clickNode.value.children.length == 0
+    })
+}
+
+const dialogOkrInfo = ref(null)
+function handleAddNode() {
+  clickNode.value = null
+  dialogOkrInfo.value.open('create', null)
+}
+
+function handleEditOkr() {
+  dialogOkr.value.close()
+  dialogOkrInfo.value.open('update', 1)
+}
+</script>
+
+<style lang="scss" scoped>
+.peroid-select {
+  border-radius: 4px;
+  cursor: pointer;
+  &:hover {
+    border-color: var(--el-color-primary-light-5);
+  }
+}
+
+.tree-org-node__text {
+  min-width: 200px;
+  min-height: 80px;
+  text-align: left;
+  font-size: 14px;
+  border-bottom: 1px solid #ccc;
+  padding: 5px;
+}
+.tip {
+  position: relative;
+  color: #aaa;
+  font-size: 0.875rem;
+}
+:deep(.el-progress-bar__innerText) {
+  display: block;
+  font-size: 0.75rem !important;
+}
+:deep(.el-overlay-dialog) {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

src/views/OKR/Management/Components/OkrTable.vue

@@ -0,0 +1,181 @@
+<template>
+  <div>
+    <el-table
+      ref="tableRef"
+      :data="okrList"
+      default-expand-all
+      row-key="id"
+      size="large"
+      @row-click="handleRowClick"
+      @expand-change="handleExpand"
+    >
+      <el-table-column label="目标/关键成果">
+        <template #default="{ row, $index }">
+          <span
+            v-if="!expandedRows[row.id]"
+            class="line1"
+            :style="{
+              top: row.type == '目标' ? '30px' : 0,
+              height: getHeight(row, $index)
+            }"
+          ></span>
+          <span v-if="row.type == '目标'">【目标】{{ row.name }}</span>
+          <template v-else>
+            <span class="line2"></span>
+            <span>
+              【关键成果】{{ row.channelName }} {{ row.name }}
+              <span v-if="row.resultType == 1">达 {{ row.targetValue }}</span>
+            </span>
+            <div class="flex items-center mt-10px ml-50px">
+              <span>当前进度：</span>
+              <span v-if="row.isSys || !props.canEdit">{{ row.currentValue }}</span>
+              <el-input
+                v-else-if="row.resultType == 1"
+                v-model="row.currentValue"
+                clearable
+                size="small"
+                style="width: 200px"
+              />
+              <el-radio-group
+                v-else-if="row.resultType == 2"
+                v-model="row.currentValue"
+                size="small"
+              >
+                <el-radio :value="1">是</el-radio>
+                <el-radio :value="0">否</el-radio>
+              </el-radio-group>
+            </div>
+          </template>
+        </template>
+      </el-table-column>
+      <el-table-column prop="progress" label="进度" width="200px">
+        <template #default="{ row }">
+          <el-progress :percentage="parseInt(row.progress) || 0" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="executorName" 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) {
+  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
+  })
+}
+
+defineExpose({
+  prepareData,
+  updateProcess
+})
+function getHeight(row, index) {
+  if (helpList.value.length - 1 == index || helpList.value[index + 1].type == '目标') {
+    return '22px'
+  } else {
+    return '100%'
+  }
+}
+
+const expandedRows = ref({})
+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)
+}
+</script>
+
+<style lang="scss" scoped>
+.line1 {
+  position: absolute;
+  width: 1px;
+  left: 21px;
+  border-left: 1px dashed #ccc;
+}
+.line2 {
+  position: absolute;
+  width: 26px;
+  height: 1px;
+  left: 21px;
+  top: 22px;
+  border-bottom: 1px dashed #ccc;
+  &::after {
+    position: absolute;
+    left: 25px;
+    top: -3px;
+    display: block;
+    width: 6px;
+    height: 6px;
+    border-radius: 6px;
+    margin: 0 auto;
+    border: 1px solid #ddd;
+    content: '';
+  }
+}
+</style>

src/views/OKR/Management/Components/WaitTarget.vue

@@ -0,0 +1,293 @@
+<template>
+  <div>
+    <el-form :model="searchForm" inline label-width="0" @submit.prevent="searchList">
+      <el-form-item>
+        <el-input v-model="searchForm.title" placeholder="输入标题" />
+      </el-form-item>
+      <el-form-item>
+        <el-select v-model="searchForm.priority" placeholder="选择优先级" clearable filterable>
+          <el-option
+            v-for="item in priorityOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <!-- <el-form-item>
+        <el-select
+          v-model="searchForm.completeStatus"
+          placeholder="选择完成状态"
+          clearable
+          filterable
+        >
+          <el-option
+            v-for="item in statusOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </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">
+      <el-tab-pane :name="1">
+        <template #label>
+          <el-badge :value="tabCount.dayEndAgentWorkNum" :max="99" :show-zero="false">
+            <el-tooltip content="截止日在今日及之前的未关闭事项" placement="top" effect="dark">
+              <Icon icon="ep:question-filled" />
+            </el-tooltip>
+            <span>今日截止</span>
+          </el-badge>
+        </template>
+      </el-tab-pane>
+      <el-tab-pane :name="2">
+        <template #label>
+          <el-tooltip content="需要我执行的全部事项" placement="top" effect="dark">
+            <Icon icon="ep:question-filled" />
+          </el-tooltip>
+          <span>我的待办</span>
+        </template>
+      </el-tab-pane>
+      <el-tab-pane :name="3">
+        <template #label>
+          <el-badge :value="tabCount.urgeAgentWorkNum" :max="99" :show-zero="false">
+            <el-tooltip content="指派他人去办的事项" placement="top" effect="dark">
+              <Icon icon="ep:question-filled" />
+            </el-tooltip>
+            <span>催办事项</span>
+          </el-badge>
+        </template>
+      </el-tab-pane>
+      <el-tab-pane :name="4">
+        <template #label>
+          <el-badge :value="tabCount.notifyNum" :max="99" :show-zero="false">
+            <el-tooltip content="特指OKR中@我的消息" placement="top" effect="dark">
+              <Icon icon="ep:question-filled" />
+            </el-tooltip>
+            <span>通知我的</span>
+          </el-badge>
+        </template>
+        <el-table :data="mentionedList">
+          <el-table-column type="index" width="50" />
+          <el-table-column prop="content" label="okr标题" />
+          <el-table-column prop="createUserName" label="创建人" />
+          <el-table-column prop="createDate" label="创建日期" />
+          <el-table-column fixed="right" label="操作" width="140">
+            <template #default="{ row }">
+              <el-button style="padding: 0" type="primary" text @click="handleShow(row)">
+                查看
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+    </el-tabs>
+
+    <el-table v-if="tabIndex != 4" :data="tableList">
+      <el-table-column type="index" width="50" />
+      <el-table-column prop="title" label="标题" />
+      <el-table-column prop="priority" label="优先级">
+        <template #default="{ row }">
+          <el-tag :type="priorityFilter(row.priority)">
+            {{ priorityNameFilter(row.priority) }}
+          </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 label="状态">
+        <template #default="{ row }">
+          <el-tag :type="statusFilter(row.completeStatus)">{{
+            statusNameFilter(row.completeStatus)
+          }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="completedDate" label="关闭日期" :formatter="dateFormatter" />
+      <el-table-column fixed="right" label="操作" width="140">
+        <template #default="{ row }">
+          <el-button
+            v-if="row.userIdList.includes(currentUserId) && row.completeStatus == 1"
+            style="padding: 0; margin-right: 10px"
+            type="primary"
+            text
+            @click="handleDo(row)"
+          >
+            跟进
+          </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"
+            style="padding: 0; margin-right: 10px; margin-left: 0"
+            type="primary"
+            text
+            @click="handleEdit(row)"
+          >
+            修改
+          </el-button>
+          <el-button
+            v-if="row.creator == currentUserId && row.completeStatus == 1"
+            style="padding: 0; margin-right: 10px; margin-left: 0"
+            type="danger"
+            text
+            @click="handleDelete(row)"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <Pagination
+      v-model:limit="searchForm.pageSize"
+      v-model:page="searchForm.pageNo"
+      :total="total"
+      @pagination="getList"
+    />
+
+    <DialogWait ref="waitDialogRef" @success="getList" />
+  </div>
+</template>
+
+<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
+
+const message = useMessage()
+
+const searchForm = ref({
+  title: undefined,
+  completeStatus: undefined,
+  priority: undefined,
+  pageNo: 1,
+  pageSize: 50
+})
+
+const statusOptions = [
+  { label: '未完成', value: 1, tagType: 'warning' },
+  { label: '已关闭', value: 2, tagType: 'success' }
+]
+
+const statusFilter = (status) => {
+  return statusOptions.find((item) => item.value == status)?.tagType
+}
+
+const statusNameFilter = (status) => {
+  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' }
+]
+
+const priorityFilter = (priority) => {
+  return priorityOptions.find((item) => item.value == priority)?.tagType
+}
+
+const priorityNameFilter = (priority) => {
+  return priorityOptions.find((item) => item.value == priority)?.label
+}
+
+const tabIndex = ref(1)
+
+onMounted(() => {
+  searchList()
+})
+
+function searchList() {
+  searchForm.value.pageNo = 1
+  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([])
+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
+      loading.value = false
+    })
+    getTabCount()
+  } catch (error) {}
+}
+
+function handleDo(row) {
+  waitDialogRef.value.open('do', row.workId)
+}
+
+const waitDialogRef = ref()
+function handleAdd() {
+  waitDialogRef.value.open('create')
+}
+
+function handleEdit(row) {
+  waitDialogRef.value.open('update', row.workId)
+}
+
+function handleDelete(row) {
+  message.confirm('确定删除待办事项吗？').then(() => {
+    deleteWait(row.workId).then(() => {
+      message.success('删除成功')
+      getList()
+    })
+  })
+}
+
+function handleNotice(row) {
+  console.log(row)
+
+  message.confirm('即将发送微信通知提醒执行人，是否继续？').then(() => {
+    urgeWait({ workId: row.workId }).then(() => {
+      message.success('发送成功')
+    })
+  })
+}
+
+function handleShow(row) {
+  console.log(row)
+  message.success('打开okr详情页')
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/OKR/Management/index.vue

@@ -0,0 +1,62 @@
+<template>
+  <div :style="{ height: `${height}px` }">
+    <el-tabs tab-position="left" v-model="tabIndex" style="height: 100%">
+      <el-tab-pane disabled name="-1">
+        <template #label>
+          <div class="w-full">
+            <div style="text-align: left; transform: translateX(-10px)">目标</div>
+          </div>
+        </template>
+      </el-tab-pane>
+      <el-tab-pane label="我负责的" name="0">
+        <MyDuty v-if="tabIndex == 0" />
+      </el-tab-pane>
+      <el-tab-pane label="待办事项" name="1">
+        <WaitTarget v-if="tabIndex == 1" />
+      </el-tab-pane>
+      <el-tab-pane label="全部目标" name="2">
+        <AllTarget v-if="tabIndex == 2" />
+      </el-tab-pane>
+      <el-tab-pane label="目标关系树" name="3">
+        <ObjectList v-if="tabIndex == 3" />
+      </el-tab-pane>
+      <el-tab-pane disabled>
+        <template #label>
+          <div class="w-full">
+            <el-divider
+              direction="horizontal"
+              style="width: calc(100% + 10px) !important; transform: translateX(-10px)"
+            />
+            <div style="text-align: left; transform: translateX(-10px)">成员</div>
+          </div>
+        </template>
+      </el-tab-pane>
+      <el-tab-pane label="张三">张三</el-tab-pane>
+      <el-tab-pane label="李四">李四</el-tab-pane>
+      <el-tab-pane label="王二">王二</el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script setup name="OkrManagement">
+import AllTarget from './Components/AllTarget.vue'
+import MyDuty from './Components/MyDuty.vue'
+import ObjectList from './Components/ObjectList.vue'
+import WaitTarget from './Components/WaitTarget.vue'
+
+const tabIndex = ref('0')
+const height = ref(innerHeight - 115)
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-tabs__content) {
+  height: 100%;
+}
+:deep(.el-tab-pane) {
+  height: 100%;
+}
+:deep(.el-popover__title) {
+  font-size: 0.875rem;
+  color: #aaa !important;
+}
+</style>

src/views/Pers/Employee/Comp/DialogEmployee.vue

@@ -5,38 +5,32 @@
       v-loading="formLoading"
       :model="formData"
       :rules="formRules"
-      label-width="80px"
+      label-width="100px"
     >
       <el-row :gutter="20">
         <el-col :span="12">
-          <el-form-item label="员工姓名" prop="nickname">
-            <el-input v-model="formData.nickname" placeholder="请输入员工姓名" />
+          <el-form-item label="员工姓名" prop="name">
+            <el-input v-model="formData.name" placeholder="请输入员工姓名" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用户性别">
             <el-radio-group v-model="formData.sex">
-              <el-radio :label="1"> 男 </el-radio>
-              <el-radio :label="2"> 女 </el-radio>
+              <el-radio :value="1"> 男 </el-radio>
+              <el-radio :value="2"> 女 </el-radio>
             </el-radio-group>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12">
-          <el-form-item label="入职日期" prop="hireDate">
-            <el-date-picker
-              v-model="formData.hireDate"
-              type="date"
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期时间"
-            />
+          <el-form-item label="组织部门" prop="dept">
+            <el-input v-model="formData.dept" placeholder="请输入部门" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="职位" prop="job">
-            <el-input v-model="formData.job" placeholder="请输入职位" />
+          <el-form-item label="职位" prop="post">
+            <el-input v-model="formData.post" placeholder="请输入职位" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -54,36 +48,39 @@
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12" :offset="0">
-          <el-form-item label="考勤方案" prop="kaoqinfangan">
+          <el-form-item label="考勤方案" prop="attendanceSettingId">
             <el-select
-              v-model="formData.kaoqinfangan"
+              v-model="formData.attendanceSettingId"
               placeholder="选择考勤方案"
               clearable
               filterable
             >
               <el-option
-                v-for="item in kaoqinfanganOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
+                v-for="item in attendanceSettingIdOptions"
+                :key="item.attendanceSettingId"
+                :label="item.name"
+                :disabled="item.status == 1"
+                :value="item.attendanceSettingId"
               />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12" :offset="0">
-          <el-form-item label="开通系统" prop="kaitongxitong">
+          <el-form-item label="开通系统" prop="instanceIds">
             <el-select
-              v-model="formData.kaitongxitong"
-              placeholder="选择考勤方案"
+              v-model="formData.instanceIds"
+              placeholder="选择开通系统"
               multiple
+              collapse-tags
               clearable
               filterable
             >
               <el-option
-                v-for="item in kaitongxitongOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
+                v-for="item in instanceIdsOptions"
+                :key="item.instanceId"
+                :label="item.instanceName"
+                :disabled="item.status == 1"
+                :value="item.instanceId"
               />
             </el-select>
           </el-form-item>
@@ -106,6 +103,75 @@
           </el-form-item>
         </el-col>
       </el-row>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="入职日期" prop="hireDate">
+            <el-date-picker
+              v-model="formData.hireDate"
+              type="date"
+              format="YYYY-MM-DD"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期时间"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="离职日期" prop="retireDate">
+            <el-date-picker
+              v-model="formData.retireDate"
+              type="date"
+              format="YYYY-MM-DD"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期时间"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="0">
+          <el-form-item label="钉钉手机号">
+            <el-input
+              v-model="formData.ddPhone"
+              placeholder="请输入钉钉手机号"
+              clearable
+              @blur="getDingdingUserId"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12" :offset="0">
+          <el-form-item label="钉钉Id" prop="dingUserId">
+            <el-input v-model="formData.dingUserId" disabled />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="微信号" prop="wxAlias">
+            <el-input v-model="formData.wxAlias" placeholder="请输入微信号" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="绩效考核人" prop="meritsExamineUserList">
+            <el-select
+              v-model="formData.meritsExamineUserList"
+              placeholder="选择绩效考核人"
+              clearable
+              filterable
+              multiple
+              collapse-tags
+            >
+              <el-option
+                v-for="item in employeeOptions"
+                :key="item.id"
+                :disabled="item.status == 1"
+                :label="item.name"
+                :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+
       <el-row :gutter="20">
         <el-col :span="24">
           <el-form-item label="备注">
@@ -123,8 +189,10 @@
 <script name="DialogEmployee" setup>
 import { CommonStatusEnum } from '@/utils/constants'
 import { formatDate } from '@/utils/formatTime'
+import { getPlanSimpleList } from '@/api/pers/attendancePlan'
+import { getSimpleAppList } from '@/api/system/app'
 
-import * as UserApi from '@/api/system/user'
+import * as EmployeeApi from '@/api/pers/employee'
 
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
@@ -133,24 +201,10 @@ const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
-const formData = ref({
-  nickname: '',
-  deptId: '',
-  mobile: '',
-  email: '',
-  id: undefined,
-  username: '',
-  password: '',
-  sex: 1,
-  remark: '',
-  status: CommonStatusEnum.ENABLE,
-  hireDate: '',
-  kaoqinfangan: undefined,
-  kaitongxitong: []
-})
+const formData = ref({})
 const formRules = ref({
-  nickname: [{ required: true, message: '员工姓名不能为空', trigger: 'blur' }],
-  job: { required: true, message: '职位不能为空', trigger: 'blur' },
+  name: [{ required: true, message: '员工姓名不能为空', trigger: 'blur' }],
+  post: { required: true, message: '职位不能为空', trigger: 'blur' },
   email: [
     {
       type: 'email',
@@ -161,8 +215,9 @@ const formRules = ref({
   mobile: [{ required: true, message: '手机号不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
-const kaoqinfanganOptions = ref([])
-const kaitongxitongOptions = ref([])
+const attendanceSettingIdOptions = ref([])
+const instanceIdsOptions = ref([])
+const employeeOptions = ref([])
 
 /** 打开弹窗 */
 const open = async (type, id) => {
@@ -174,7 +229,7 @@ const open = async (type, id) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await UserApi.getUser(id)
+      formData.value = await EmployeeApi.getEmployeeDetail(id)
     } finally {
       formLoading.value = false
     }
@@ -184,8 +239,15 @@ const open = async (type, id) => {
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 function getOptions() {
-  kaoqinfanganOptions.value = []
-  kaitongxitongOptions.value = []
+  getSimpleAppList().then((data) => {
+    instanceIdsOptions.value = data
+  })
+  getPlanSimpleList().then((data) => {
+    attendanceSettingIdOptions.value = data
+  })
+  EmployeeApi.getEmployeeSimpleList().then((data) => {
+    employeeOptions.value = data
+  })
 }
 
 /** 提交表单 */
@@ -200,10 +262,10 @@ const submitForm = async () => {
   try {
     const data = formData.value
     if (formType.value === 'create') {
-      await UserApi.createUser(data)
+      await EmployeeApi.createEmployee(data)
       message.success(t('common.createSuccess'))
     } else {
-      await UserApi.updateUser(data)
+      await EmployeeApi.updateEmployee(data)
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
@@ -217,20 +279,36 @@ const submitForm = async () => {
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
-    nickname: '',
-    deptId: '',
+    name: '',
     mobile: '',
     email: '',
     id: undefined,
     username: '',
     password: '',
+    post: undefined,
+    dept: undefined,
     sex: 1,
     remark: '',
     status: CommonStatusEnum.ENABLE,
     hireDate: formatDate(new Date(), 'YYYY-MM-DD'),
-    kaoqinfangan: undefined,
-    kaitongxitong: []
+    retireDate: undefined,
+    attendanceSettingId: undefined,
+    instanceIds: [],
+    wxAlias: '',
+    meritsExamineUserList: []
   }
   formRef.value?.resetFields()
 }
+
+async function getDingdingUserId() {
+  try {
+    if (!formData.value.ddPhone) {
+      formData.value.dingUserId = undefined
+      return
+    }
+    const data = await EmployeeApi.getDingUserId({ mobile: formData.value.ddPhone })
+    formData.value.dingUserId = data
+  } finally {
+  }
+}
 </script>

src/views/Pers/Employee/index.vue

@@ -1,13 +1,18 @@
 <template>
   <div>
-    <el-form :model="searchForm" inline>
+    <el-form :model="searchForm" inline @submit.prevent>
       <el-form-item>
-        <el-input v-model="searchForm.name" placeholder="请输入员工姓名" />
+        <el-input
+          v-model="searchForm.name"
+          placeholder="请输入员工姓名"
+          clearable
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
       <el-form-item>
-        <el-radio-group v-model="searchForm.status">
-          <el-radio :label="0"> 在职 </el-radio>
-          <el-radio :label="1"> 离职 </el-radio>
+        <el-radio-group v-model="searchForm.status" @change="handleQuery">
+          <el-radio :value="0"> 在职 </el-radio>
+          <el-radio :value="1"> 离职 </el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item>
@@ -25,23 +30,28 @@
 
     <el-table v-loading="loading" :data="tableList" border stripe>
       <el-table-column type="index" width="50" />
-      <el-table-column label="用户姓名" prop="nickname" />
-      <el-table-column label="职位" prop="job" />
+      <el-table-column label="姓名" prop="name" />
+      <el-table-column label="职位" prop="post" />
       <el-table-column label="手机号码" prop="mobile" width="120" />
-      <el-table-column label="考勤方案" />
-      <el-table-column label="已开通系统" />
+      <el-table-column label="微信号" prop="wxAlias" min-width="120" />
+      <el-table-column label="钉钉号" prop="dingUserId" min-width="120" />
+      <el-table-column label="考勤方案" prop="attendanceSettingName" width="100" />
+      <el-table-column label="绩效考核人" prop="meritsExamineUserNames" width="120" />
+      <el-table-column label="已开通系统" prop="instanceName" min-width="120" />
       <el-table-column label="在职状态" key="status" width="150">
         <template #default="scope">
           <el-switch
             v-model="scope.row.status"
             :active-value="0"
             :inactive-value="1"
+            active-text="在职"
+            inactive-text="离职"
             v-hasPermi="['pers:employee:update']"
             @change="handleStatusChange(scope.row)"
           />
         </template>
       </el-table-column>
-      <el-table-column label="操作" width="260">
+      <el-table-column label="操作" width="260" fixed="right">
         <template #default="scope">
           <el-button
             type="primary"
@@ -74,6 +84,12 @@
 
 <script name="OAEmployee" setup>
 import DialogEmployee from './Comp/DialogEmployee.vue'
+import { removeNullField } from '@/utils'
+import * as EmployeeApi from '@/api/pers/employee'
+
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
+
 const searchForm = ref({
   name: undefined,
   status: 0,
@@ -98,10 +114,9 @@ const total = ref(0)
 const getList = async () => {
   loading.value = true
   try {
-    tableList.value = [{ status: 0 }]
-    // const data = await UserApi.getUserPage(queryParams)
-    // tableList.value = data.list
-    // total.value = data.total
+    const data = await EmployeeApi.getEmployeePage(removeNullField(searchForm.value))
+    tableList.value = data.list
+    total.value = data.total
   } finally {
     loading.value = false
   }
@@ -118,12 +133,13 @@ const handleStatusChange = async (row) => {
   try {
     // 修改状态的二次确认
     const text = row.status === 0 ? '启用' : '停用'
-    await message.confirm('确认要"' + text + '""' + row.nickname + '"用户吗?')
+    await message.confirm('确认要"' + text + '""' + row.name + '"用户吗?')
     // 发起修改状态
-    await UserApi.updateUserStatus(row.id, row.status)
+    await EmployeeApi.updateEmployeeStatus({ id: row.id, status: row.status })
     // 刷新列表
     await getList()
-  } catch {
+  } catch (err) {
+    console.log(err)
     // 取消后，进行恢复按钮
     row.status = row.status === 0 ? 1 : 0
   }
@@ -135,7 +151,7 @@ const handleDelete = async (id) => {
     // 删除的二次确认
     await message.delConfirm()
     // 发起删除
-    await UserApi.deleteUser(id)
+    await EmployeeApi.deleteEmployee(id)
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()

src/views/Pers/Setting/Comp/AttendancePlan.vue

@@ -1,8 +1,13 @@
 <template>
   <div>
-    <el-form :model="searchForm" inline>
+    <el-form :model="searchForm" inline @submit.prevent>
       <el-form-item>
-        <el-input v-model="searchForm.name" placeholder="方案名称" />
+        <el-input
+          v-model="searchForm.name"
+          placeholder="方案名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
       <el-form-item>
         <el-select v-model="searchForm.status" placeholder="启用状态" clearable filterable>
@@ -31,7 +36,9 @@
       <el-table-column label="操作" width="200">
         <template #default="scope">
           <el-button type="primary" link @click="openForm('update', scope.row)"> 修改 </el-button>
-          <el-button type="primary" link @click="handleDelete(scope.row.id)"> 删除 </el-button>
+          <el-button type="primary" link @click="handleDelete(scope.row.attendanceSettingId)">
+            删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -48,6 +55,11 @@
 
 <script name="PersSetting" setup>
 import DialogPlan from './DialogPlan.vue'
+import * as PlanApi from '@/api/pers/attendancePlan'
+import { removeNullField } from '@/utils'
+
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 const searchForm = ref({
   name: undefined,
   status: undefined,
@@ -72,10 +84,9 @@ const total = ref(0)
 const getList = async () => {
   loading.value = true
   try {
-    tableList.value = [{ status: 0 }]
-    // const data = await UserApi.getUserPage(queryParams)
-    // tableList.value = data.list
-    // total.value = data.total
+    const data = await PlanApi.getPlanPage(removeNullField(searchForm.value))
+    tableList.value = data.list
+    total.value = data.total
   } finally {
     loading.value = false
   }
@@ -92,14 +103,31 @@ const handleStatusChange = async (row) => {
     const text = row.status === 0 ? '启用' : '停用'
     await message.confirm('确认要"' + text + '""' + row.name + '"方案吗?')
     // 发起修改状态
-    // await UserApi.updateUserStatus(row.id, row.status)
+    await PlanApi.updatePlanStatus({
+      attendanceSettingId: row.attendanceSettingId,
+      status: row.status
+    })
     // 刷新列表
     await getList()
-  } catch {
+  } catch (err) {
+    console.log(err)
     // 取消后，进行恢复按钮
     row.status = row.status === 0 ? 1 : 0
   }
 }
+
+/** 删除按钮操作 */
+const handleDelete = async (id) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await PlanApi.deletePlan(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
 </script>
 
 <style lang="scss" scoped></style>

src/views/Pers/Setting/Comp/DialogPlan.vue

@@ -12,19 +12,18 @@
     <el-table :data="form.planList" border stripe>
       <el-table-column label="年份" width="150px">
         <template #default="{ row }">
-          <el-date-picker
+          <el-input-number
             v-model="row.year"
-            type="year"
-            placeholder="选择年份"
-            format="YYYY"
-            value-format="YYYY"
-            style="width: 120px"
+            size="small"
+            :min="0"
+            :controls="false"
+            style="width: 100px"
           />
         </template>
       </el-table-column>
       <el-table-column
         v-for="item in 12"
-        :prop="item"
+        :prop="item + ''"
         :key="item"
         :label="item + '月'"
         width="140px"
@@ -32,9 +31,9 @@
         <el-table-column label="应出勤">
           <template #default="{ row }">
             <el-input-number
-              v-model="row[item].yingchuqin"
+              v-model="row[item + ''].shouldWorkDay"
               size="small"
-              :min="1"
+              :min="0"
               :max="31"
               :controls="false"
               style="width: 50px"
@@ -44,7 +43,7 @@
         <el-table-column label="带薪假">
           <template #default="{ row }">
             <el-input-number
-              v-model="row[item].daixinjia"
+              v-model="row[item].paidLeaveDay"
               size="small"
               :min="0"
               :max="31"
@@ -71,7 +70,10 @@
 </template>
 
 <script setup name="DialogAttendancePlan">
+import * as PlanApi from '@/api/pers/attendancePlan'
+
 const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('考勤方案设置')
@@ -84,11 +86,27 @@ const open = async (type, row) => {
   dialogTitle.value = type == 'create' ? `新增方案` : '修改方案'
   formType.value = type
   resetForm()
-
-  if (row?.id) {
+  if (row?.attendanceSettingId) {
     formLoading.value = true
     try {
-      // comissionForm.value = await UserApi.getUser(id)
+      const data = await PlanApi.getPlanDetail(row.attendanceSettingId)
+      const list = data.attendancePeriodS.map((item) => {
+        item.monthSettings.map((it) => {
+          item[it.month + ''] = {
+            shouldWorkDay: it.shouldWorkDay,
+            paidLeaveDay: it.paidLeaveDay
+          }
+        })
+        item.year = item.year
+        delete item.monthSettings
+        return item
+      })
+      form.value = {
+        attendanceSettingId: data.attendanceSettingId,
+        name: data.name,
+        status: data.status,
+        planList: list
+      }
     } finally {
       formLoading.value = false
     }
@@ -110,18 +128,18 @@ function resetForm() {
 function handleAddYearPlan() {
   form.value.planList.push({
     year: new Date().getFullYear(),
-    1: { yingchuqin: undefined, daixinjia: undefined },
-    2: { yingchuqin: undefined, daixinjia: undefined },
-    3: { yingchuqin: undefined, daixinjia: undefined },
-    4: { yingchuqin: undefined, daixinjia: undefined },
-    5: { yingchuqin: undefined, daixinjia: undefined },
-    6: { yingchuqin: undefined, daixinjia: undefined },
-    7: { yingchuqin: undefined, daixinjia: undefined },
-    8: { yingchuqin: undefined, daixinjia: undefined },
-    9: { yingchuqin: undefined, daixinjia: undefined },
-    10: { yingchuqin: undefined, daixinjia: undefined },
-    11: { yingchuqin: undefined, daixinjia: undefined },
-    12: { yingchuqin: undefined, daixinjia: undefined }
+    1: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    2: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    3: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    4: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    5: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    6: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    7: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    8: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    9: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    10: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    11: { shouldWorkDay: 0, paidLeaveDay: 0 },
+    12: { shouldWorkDay: 0, paidLeaveDay: 0 }
   })
 }
 
@@ -135,16 +153,37 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
+    const arr = form.value.planList.map((item) => {
+      const list = []
+      for (let i = 1; i <= 12; i++) {
+        list.push({
+          month: i,
+          ...item[i + '']
+        })
+      }
+      return {
+        year: item.year,
+        monthSettings: list
+      }
+    })
+    const data = {
+      name: form.value.name,
+      attendancePeriodS: arr
+    }
     if (formType.value === 'create') {
-      // await ClassApi.createClassType(data)
+      await PlanApi.createPlan(data)
       message.success(t('common.createSuccess'))
     } else {
-      // await ClassApi.updateClassType(data)
+      data.attendanceSettingId = form.value.attendanceSettingId
+      data.status = form.value.status
+      await PlanApi.updatePlan(data)
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
     // 发送操作成功的事件
     emit('success')
+  } catch (err) {
+    console.log(err)
   } finally {
     formLoading.value = false
   }

src/views/Pers/Setting/index.vue

@@ -1,13 +1,14 @@
 <template>
   <el-tabs v-model="tabName">
-    <el-tab-pane label="考勤方案" name="kqfa">
-      <AttendancePlan />
+    <el-tab-pane label="考勤方案" name="kqfa" v-if="checkPermi(['per:setting:attendance-plan'])">
+      <AttendancePlan v-if="tabName == 'kqfa'" />
     </el-tab-pane>
   </el-tabs>
 </template>
 
 <script setup name="PersSetting">
 import AttendancePlan from './Comp/AttendancePlan.vue'
+import { checkPermi } from '@/utils/permission'
 
 const tabName = ref('kqfa')
 </script>

src/views/Profile/Index.vue

@@ -22,16 +22,16 @@
           <el-tab-pane :label="t('profile.info.resetPwd')" name="resetPwd">
             <ResetPwd />
           </el-tab-pane>
-          <el-tab-pane :label="t('profile.info.userSocial')" name="userSocial">
+          <!-- <el-tab-pane :label="t('profile.info.userSocial')" name="userSocial">
             <UserSocial />
-          </el-tab-pane>
+          </el-tab-pane> -->
         </el-tabs>
       </div>
     </el-card>
   </div>
 </template>
 <script setup lang="ts" name="Profile">
-import { BasicInfo, ProfileUser, ResetPwd, UserSocial } from './components/'
+import { BasicInfo, ProfileUser, ResetPwd } from './components/'
 const { t } = useI18n()
 
 const activeName = ref('basicInfo')