绩效管理

app/src/views/EmployeeManageView.vue

@@ -92,7 +92,6 @@ const openDialog = () => {
   employeeFormComRef.value.openDialog()
 }
 const updateTableData = async (pageSize, pageIndex) => {
-  console.log('pp')
   await getTableData({ pageSize, pageIndex })
 }
 const returnData = (row, newTiltle) => {

app/src/views/RewardManageView.vue

@@ -1,17 +1,120 @@
+<!--
+ * @Author: BINGWU
+ * @Date: 2024-04-11 17:21:16
+ * @LastEditors: BINGWU HuJiaCheng2003@163.com
+ * @LastEditTime: 2024-05-22 22:20:20
+ * @FilePath: \employee-information-management-system\app\src\views\RewardManageView.vue
+ * @Describe: 
+ * @Mark: ૮(˶ᵔ ᵕ ᵔ˶)ა
+-->
 <template>
   <div class="reward-manage">
-    <el-button type="primary">添加绩效</el-button>
+    <el-button type="primary" @click="openDialog">添加绩效</el-button>
     <div clase="table">
-      <BaseTableCom></BaseTableCom>
+      <BaseTableCom
+        :column-data="columnData"
+        :dropdown-data="dropdownData"
+        :table-data="tableData"
+        :total="total"
+        :show-pagination="true"
+        :page-sizes="[5, 8]"
+        @update-table-data="updateTableData"
+        ref="baseTableComRef"
+      ></BaseTableCom>
     </div>
-    <RewardFormCom></RewardFormCom>
+    <RewardFormCom
+      ref="rewardFormComRef"
+      :title="title"
+      @update-table-data="getTableData"
+    ></RewardFormCom>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, onMounted } from 'vue'
 import BaseTableCom from '@/components/table/BaseTableCom.vue'
+import { deleteReward, getAllReward } from '@/api/reward'
 import RewardFormCom from './components/form/RewardFormCom.vue'
+const rewardFormComRef = ref(null)
+
+const columnData = [
+  {
+    prop: 'employeeId',
+    label: '职工ID'
+  },
+  {
+    prop: 'employeeName',
+    label: '职工名'
+  },
+  {
+    prop: 'rewardType',
+    label: '类型'
+  },
+  {
+    prop: 'contentType',
+    label: '绩效类型'
+  }
+]
+const total = ref(0)
+const title = ref('')
+const tableData = ref([])
+const baseTableComRef = ref(null)
+const dropdownData = [
+  {
+    command: 'command1',
+    handleAction: (row) => {
+      returnData(row, '查看')
+    },
+    icon: 'View',
+    actionName: '查看'
+  },
+  {
+    command: 'command2',
+    handleAction: (row) => {
+      returnData(row, '修改')
+    },
+    icon: 'Edit',
+    actionName: '修改'
+  },
+  {
+    command: 'command3',
+    handleAction: async (row) => {
+      const { _id } = row
+      const res = await deleteReward({ _ids: [_id] })
+      const { msg } = res.data
+      await getTableData()
+      ElMessage({
+        message: msg,
+        type: 'success'
+      })
+    },
+    icon: 'Delete',
+    actionName: '删除'
+  }
+]
+const getTableData = async (params = null) => {
+  if (!params) {
+    const { currentPage, pageSize } = baseTableComRef.value.getPaginationData()
+    params = { pageIndex: currentPage, pageSize }
+  }
+  const res = await getAllReward(params)
+  tableData.value = res.data.data
+  total.value = res.data.total
+}
+const returnData = (row, newTiltle) => {
+  title.value = newTiltle
+  rewardFormComRef.value.openDialog(row)
+}
+const updateTableData = async (pageSize, pageIndex) => {
+  await getTableData({ pageSize, pageIndex })
+}
+const openDialog = () => {
+  title.value = '添加'
+  rewardFormComRef.value.openDialog()
+}
+onMounted(async () => {
+  await getTableData({ pageSize: 5, pageIndex: 1 })
+})
 </script>
 
 <style lang="scss" scoped></style>

app/src/views/components/form/EmployeeFormCom.vue

@@ -41,6 +41,13 @@
             <el-radio label="employee">普通员工</el-radio>
           </el-radio-group>
         </el-form-item>
+        <el-form-item label="职工Id">
+          <el-input type="text" v-model="newId" disabled>
+            <template #append>
+              <el-button icon="DocumentCopy" @click="copyText" />
+            </template>
+          </el-input>
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer" v-show="title !== '查看'">
@@ -65,6 +72,7 @@ const formData = reactive({
   asideData: ['default']
 })
 const dialogVisible = ref(false)
+
 const props = defineProps({
   title: {
     type: String,
@@ -77,6 +85,7 @@ let newId = ''
 const getAsideData = () => {
   return employeeAsideData
 }
+
 const rules = ref({
   employeeName: [
     { required: true, message: '请输入职工名', trigger: 'blur' },
@@ -88,6 +97,13 @@ const rules = ref({
   ]
 })
 const emits = defineEmits(['updateTableData'])
+const copyText = () => {
+  navigator.clipboard.writeText(newId)
+  ElMessage({
+    message: '复制成功',
+    type: 'success'
+  })
+}
 const handleConfirm = () => {
   formRef.value
     .validate()

app/src/views/components/form/RewardFormCom.vue

@@ -2,7 +2,7 @@
  * @Author: BINGWU
  * @Date: 2024-05-14 23:46:48
  * @LastEditors: BINGWU HuJiaCheng2003@163.com
- * @LastEditTime: 2024-05-21 23:03:00
+ * @LastEditTime: 2024-05-22 22:24:54
  * @FilePath: \employee-information-management-system\app\src\views\components\form\RewardFormCom.vue
  * @Describe: 
  * @Mark: ૮(˶ᵔ ᵕ ᵔ˶)ა
@@ -24,24 +24,24 @@
       >
         <el-form-item label="类型" prop="rewardType" required>
           <el-radio-group
-            v-model="formData.userType"
+            v-model="formData.rewardType"
             @change="handleRadioChange"
             :disabled="title === '查看'"
           >
-            <el-radio label="award">奖</el-radio>
+            <el-radio label="奖">奖</el-radio>
-            <el-radio label="punish">惩</el-radio>
+            <el-radio label="惩">惩</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="绩效类型" prop="contentType" required>
           <el-radio-group
-            v-model="formData.userType"
+            v-model="formData.contentType"
             @change="handleRadioChange"
             :disabled="title === '查看'"
           >
-            <el-radio label="selfReward">个人绩效</el-radio>
+            <el-radio label="个人绩效">个人绩效</el-radio>
-            <el-radio label="companyReward">公司绩效</el-radio>
+            <el-radio label="公司绩效">公司绩效</el-radio>
-            <el-radio label="departmentReward">部门绩效</el-radio>
+            <el-radio label="部门绩效">部门绩效</el-radio>
-            <el-radio label="otherReward">其他</el-radio>
+            <el-radio label="其他">其他</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="职工名" prop="employeeName">
@@ -51,9 +51,16 @@
             :disabled="title === '查看'"
           />
         </el-form-item>
-        <el-form-item label="备注" prop="remark">
+        <el-form-item label="职工Id" prop="employeeId">
           <el-input
             type="text"
+            v-model="formData.employeeId"
+            :disabled="title === '查看'"
+          />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            type="textarea"
             v-model="formData.remark"
             :disabled="title === '查看'"
           />
@@ -74,19 +81,18 @@ import { ref, reactive, nextTick } from 'vue'
 import { createReward, updateReward } from '@/api/reward'
 const formData = reactive({
   employeeName: '',
-  rewardType: 'award',
+  rewardType: '奖',
-  contentType: 'selfReward',
+  contentType: '个人绩效',
   remark: '',
-  emloyeeId: ''
+  employeeId: ''
 })
-const dialogVisible = ref(true)
+const dialogVisible = ref(false)
 const props = defineProps({
   title: {
     type: String,
     default: '添加'
   }
 })
-const elTreeRef = ref(null)
 const formRef = ref(null)
 let newId = ''
 
@@ -94,6 +100,14 @@ const rules = ref({
   employeeName: [
     { required: true, message: '请输入职工名', trigger: 'blur' },
     { min: 5, max: 10, message: '长度为5~10个字符', trigger: 'blur' }
+  ],
+  rewardType: [{ required: true, message: '请选择类型', trigger: 'change' }],
+  contentType: [
+    { required: true, message: '请选择绩效类型', trigger: 'change' }
+  ],
+  employeeId: [
+    { required: true, message: '请输入职工Id', trigger: 'blur' },
+    { min: 10, max: 30, message: '长度为10~30个字符', trigger: 'blur' }
   ]
 })
 const emits = defineEmits(['updateTableData'])
@@ -104,7 +118,7 @@ const handleConfirm = () => {
       let message = ''
       if (props.title === '添加') {
         const params = {
-          ...formData.value
+          ...formData
         }
         const {
           data: { msg }
@@ -112,7 +126,7 @@ const handleConfirm = () => {
         message = msg
       } else if (props.title === '修改') {
         const params = {
-          ...formData.value
+          ...formData
         }
         const {
           data: { msg }
@@ -131,27 +145,20 @@ const handleConfirm = () => {
     })
     .catch(() => {})
 }
-const setCheckedKeys = (keys = []) => {
-  nextTick(() => {
-    elTreeRef.value.setCheckedKeys(keys)
-  })
-}
 
-const openDialog = (keys, username, password, userType, _id) => {
+const openDialog = (row) => {
   dialogVisible.value = true
   nextTick(() => {
     formRef.value.clearValidate()
   })
-  if (keys) {
+  const { _id, contentType, employeeName, remark, rewardType } = row
-    setCheckedKeys(keys)
-  }
   newId = _id
-  formData.userType = userType
+  formData.contentType = contentType
-  formData.password = password
+  formData.employeeName = employeeName
-  formData.username = username
+  formData.remark = remark
+  formData.rewardType = rewardType
 }
 const handleClose = () => {
-  setCheckedKeys()
   offDialog()
 }
 const offDialog = () => (dialogVisible.value = false)