优化了表格及路由功能,提升了用户体验,提高了操作效率。

This commit is contained in:
zmj 2024-06-06 18:37:58 +08:00
parent 62918cd6e0
commit 24f56c44bd
5 changed files with 385 additions and 12 deletions

View File

@ -0,0 +1,190 @@
<template>
<div class="detail-popup">
<popup ref="popupRef" :showFootBtn="false" title="考核下属记录详情" :async="true" width="60vw">
<el-card>
<el-descriptions :column="3" border>
<el-descriptions-item label="被考核人" label-align="left" align="left">
{{ formData.bkh_user_name }}
</el-descriptions-item>
<el-descriptions-item label="考核类别" label-align="left" align="left">
{{ formData.examine_type_text }}
</el-descriptions-item>
<el-descriptions-item label="考核月份" label-align="left" align="left">
{{ formData.examine_month }}
</el-descriptions-item>
<el-descriptions-item label="考核总分" label-align="left" align="left">
{{ formData.examine_month }}
</el-descriptions-item>
<el-descriptions-item label="考核评语" label-align="left" align="left">
{{ formData.content }}
</el-descriptions-item>
<el-descriptions-item label="考核总分" label-align="left" align="left">
{{ formData.total_score }}
</el-descriptions-item>
<el-descriptions-item label="自评得分" label-align="left" align="left">
{{ formData.total_self_score }}
</el-descriptions-item>
<el-descriptions-item label="上评得分" label-align="left" align="left">
{{ formData.total_superior_score }}
</el-descriptions-item>
<el-descriptions-item label="最终得分" label-align="left" align="left">
{{ formData.final_score }}
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card>
<el-table :data="formData.detail">
<el-table-column label="考核项" prop="examine_item" show-overflow-tooltip>
</el-table-column>
<el-table-column label="分数" prop="score" show-overflow-tooltip>
</el-table-column>
<el-table-column label="考核说明" prop="examine_desc" show-overflow-tooltip>
</el-table-column>
<el-table-column label="自评得分" prop="self_score" show-overflow-tooltip>
</el-table-column>
<el-table-column label="上评得分" prop="superior_score" show-overflow-tooltip>
</el-table-column>
</el-table>
</el-card>
</popup>
</div>
</template>
<script lang="ts" setup name="customdetail">
import annexLink from './../../components/annexLink/index.vue'
import Popup from '@/components/popup/index.vue'
import useUserStore from "@/stores/modules/user";
import { Clock } from '@element-plus/icons-vue'
import { apiInvliceCheck } from '@/api/oa_financial'
import feedback from '@/utils/feedback'
const emit = defineEmits(['close'])
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const showPerDialog = ref(false);
const personnel = ref(null);
const userStore = useUserStore().userInfo;
//
const formData = reactive({
id: 0,
extends: {}
})
//
const setFormData = async (data: Record<any, any>) => {
for (const key in data) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key]
}
}
console.log(formData)
}
const form = reactive({
"id": '',
"bkh_user_id": '',
"bkh_user_name": "",
"examine_type": '',
"self_examine_id": '',
examine_month: "",
total_superior_score: 0,
final_score: 0,
total_score: 0,
total_self_score: 0,
"content": "",
"detail": [
{
"examine_item": "",
"score": '',
"examine_desc": "",
"self_score": 0,
"superior_score": 0,
},
]
})
const userclick = async () => {
showPerDialog.value = true;
await nextTick();
personnel.value.open();
};
const submituser = (e) => {
form.check_admin_names = e.name;
form.check_admin_ids = e.id;
showPerDialog.value = false;
};
//
const open = () => {
popupRef.value?.open()
}
const flowTypeToText = (type, item) => {
if (type == 0) return item.user_id_info[0].name;
if (type == 1) return "部门负责人";
if (type == 2) return "或签";
if (type == 3) return "会签";
if (type == 4) return item.user_id_info[0].name;
}
const findActive = () => {
let index = formData.steps.findIndex(item => { return item.sort == formData.check_step_sort })
return index
}
//
const handleClose = () => {
emit('close')
}
//
const handCheck = async () => {
if (form.check == 2 && !form.content) return feedback.msgError("请填写审批意见")
if (formData.check_admin_ids && formData.record[formData.record.length - 1].check_user_id == form.check_admin_ids) {
return feedback.msgError("下一级审批人不能是发起审批人")
}
if (formData.flow_info.check_type != 2) delete form.check_node;
form.id = formData.id
const res = await apiInvliceCheck({ ...form })
handleClose()
}
//
const showActionList = reactive([4, 3, 2, 10])
const showTextarea = () => {
if (showActionList.includes(formData.check_status)) return false;
if (formData.admin_id == userStore.id) return true;
if (formData?.check_admin_ids.length > 1) {
if (formData.steps[findActive()].check_list.map(item => item.check_user_id).includes(userStore.id)) return false;
else return (formData?.check_admin_ids.split(',').map(Number).includes(userStore.id)); //
} else {
return (formData?.check_admin_ids == userStore.id)
}
}
defineExpose({
open,
setFormData,
})
</script>
<style lang="scss" scoped>
:deep(.el-step__icon) {
margin-top: 10px !important;
}
</style>

View File

@ -53,6 +53,9 @@
<el-button type="danger" link @click="handleDelete(row.id)">
删除
</el-button>
<el-button type="primary" link @click="handDetail(row.id)">
详情
</el-button>
</template>
</el-table-column>
</el-table>
@ -62,6 +65,8 @@
</div>
</el-card>
<edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
<detailPopup v-if="showDetail" ref="detailRef" @success="showDetail = false" @close="showDetail = false" />
</div>
</template>
@ -72,11 +77,14 @@ import { usePaging } from '@/hooks/usePaging'
import { apiExpenseList, apiExpenseDelete, apiExpenseDetail } from '@/api/oa_examine'
import { useDictData } from '@/hooks/useDictOptions'
import EditPopup from './edit.vue'
import detailPopup from './detail.vue'
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
//
const showEdit = ref(false)
const detailRef = ref(null)
//
const showDetail = ref(false)
const { dictData } = useDictData('jxgl_check_type')
//
@ -115,5 +123,12 @@ const handleDelete = async (id: number | any[]) => {
getLists()
}
const handDetail = async (id: any) => {
let res = await apiExpenseDetail({ id })
showDetail.value = true
await nextTick()
detailRef.value?.open()
detailRef.value?.setFormData(res)
}
getLists()
</script>

View File

@ -0,0 +1,160 @@
<template>
<div class="detail-popup">
<popup ref="popupRef" :showFootBtn="false" title="自评记录详情" :async="true" width="60vw">
<el-card>
<el-descriptions :column="3" border>
<el-descriptions-item label="考核类别" label-align="left" align="left">
{{ formData.examine_type_text }}
</el-descriptions-item>
<el-descriptions-item label="模版名称" label-align="left" align="left">
{{ formData.temp_name }}
</el-descriptions-item>
<el-descriptions-item label="考核月份" label-align="left" align="left">
{{ formData.examine_month }}
</el-descriptions-item>
<el-descriptions-item label="考核总分" label-align="left" align="left">
{{ formData.total_score }}
</el-descriptions-item>
<el-descriptions-item label="自评得分" label-align="left" align="left">
{{ formData.total_self_score }}
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card>
<el-table :data="formData.detail">
<el-table-column label="考核项" prop="examine_item" show-overflow-tooltip>
</el-table-column>
<el-table-column label="分数" prop="score" show-overflow-tooltip>
</el-table-column>
<el-table-column label="考核说明" prop="examine_desc" show-overflow-tooltip>
</el-table-column>
<el-table-column label="自评得分" prop="self_score" show-overflow-tooltip>
</el-table-column>
</el-table>
</el-card>
</popup>
</div>
</template>
<script lang="ts" setup name="customdetail">
import annexLink from './../../components/annexLink/index.vue'
import Popup from '@/components/popup/index.vue'
import useUserStore from "@/stores/modules/user";
import { Clock } from '@element-plus/icons-vue'
import { apiInvliceCheck } from '@/api/oa_financial'
import feedback from '@/utils/feedback'
const emit = defineEmits(['close'])
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const showPerDialog = ref(false);
const personnel = ref(null);
const userStore = useUserStore().userInfo;
//
const formData = reactive({
id: 0,
extends: {}
})
//
const setFormData = async (data: Record<any, any>) => {
for (const key in data) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key]
}
}
console.log(formData)
}
const form = reactive({
"id": formData.id,
"examine_temp_id": '',
temp_name: "",
"examine_type": '',
examine_type_text: "",
"examine_month": "",
total_score: 0,
total_self_score: 0,
total_superior_score: 0,
"detail": []
})
const userclick = async () => {
showPerDialog.value = true;
await nextTick();
personnel.value.open();
};
const submituser = (e) => {
form.check_admin_names = e.name;
form.check_admin_ids = e.id;
showPerDialog.value = false;
};
//
const open = () => {
popupRef.value?.open()
}
const flowTypeToText = (type, item) => {
if (type == 0) return item.user_id_info[0].name;
if (type == 1) return "部门负责人";
if (type == 2) return "或签";
if (type == 3) return "会签";
if (type == 4) return item.user_id_info[0].name;
}
const findActive = () => {
let index = formData.steps.findIndex(item => { return item.sort == formData.check_step_sort })
return index
}
//
const handleClose = () => {
emit('close')
}
//
const handCheck = async () => {
if (form.check == 2 && !form.content) return feedback.msgError("请填写审批意见")
if (formData.check_admin_ids && formData.record[formData.record.length - 1].check_user_id == form.check_admin_ids) {
return feedback.msgError("下一级审批人不能是发起审批人")
}
if (formData.flow_info.check_type != 2) delete form.check_node;
form.id = formData.id
const res = await apiInvliceCheck({ ...form })
handleClose()
}
//
const showActionList = reactive([4, 3, 2, 10])
const showTextarea = () => {
if (showActionList.includes(formData.check_status)) return false;
if (formData.admin_id == userStore.id) return true;
if (formData?.check_admin_ids.length > 1) {
if (formData.steps[findActive()].check_list.map(item => item.check_user_id).includes(userStore.id)) return false;
else return (formData?.check_admin_ids.split(',').map(Number).includes(userStore.id)); //
} else {
return (formData?.check_admin_ids == userStore.id)
}
}
defineExpose({
open,
setFormData,
})
</script>
<style lang="scss" scoped>
:deep(.el-step__icon) {
margin-top: 10px !important;
}
</style>

View File

@ -72,12 +72,7 @@
<el-descriptions-item label="自评得分" label-align="left" align="left">
{{ formData.total_self_score }}
</el-descriptions-item>
<el-descriptions-item label="上评得分" label-align="left" align="left">
{{ formData.total_superior_score }}
</el-descriptions-item>
<el-descriptions-item label="最终得分" label-align="left" align="left">
{{ formData.final_score }}
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-dialog v-model="showDialog" title="选择考核模版" width="60%">

View File

@ -42,9 +42,6 @@
<el-table-column label="考核月份" prop="examine_month" show-overflow-tooltip width="120" />
<el-table-column label="考核总分" prop="total_score" show-overflow-tooltip />
<el-table-column label="自评得分" prop="total_self_score" show-overflow-tooltip />
<!-- <el-table-column label="上评得分" prop="engineering_status_text" show-overflow-tooltip /> -->
<!-- <el-table-column label="最终得分" prop="engineering_status_text" show-overflow-tooltip /> -->
<!-- <el-table-column label="考核评语" prop="engineering_status_text" show-overflow-tooltip /> -->
<el-table-column label="自评时间" prop="create_time" show-overflow-tooltip />
<el-table-column label="操作" width="170" fixed="right">
<template #default="{ row }">
@ -56,6 +53,9 @@
@click="handleDelete(row.id)">
删除
</el-button>
<el-button type="primary" link @click="handDetail(row.id)">
详情
</el-button>
</template>
</el-table-column>
</el-table>
@ -65,7 +65,7 @@
</div>
</el-card>
<edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
<detailPopup v-if="showDetail" ref="detailRef" @success="showDetail = false" @close="showDetail = false" />
</div>
</template>
@ -75,12 +75,15 @@ import { useDictData } from '@/hooks/useDictOptions'
import feedback from '@/utils/feedback'
import EditPopup from './edit.vue'
import { apiOaSelfExamineLists, apiOaSelfExamineDelete, apiOaSelfExamineDetail } from '@/api/oaSelfExamine'
import detailPopup from './detail.vue'
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
//
const showEdit = ref(false)
const detailRef = ref(null)
//
const showDetail = ref(false)
//
const queryParams = reactive({
@ -121,5 +124,15 @@ const handleDelete = async (id: number | any[]) => {
getLists()
}
const handDetail = async (id: any) => {
let res = await apiOaSelfExamineDetail({ id })
showDetail.value = true
await nextTick()
detailRef.value?.open()
detailRef.value?.setFormData(res)
}
getLists()
</script>