Skip to content

P
psa-web
Commit 3efb142c authored by qiyaxin's avatar qiyaxin
Browse files
Options

差旅报销审批列表

parent ac9e5882
Hide whitespace changes
Inline Side-by-side
Showing with 211 additions and 132 deletions
src/views/costManage/examineAndApprove/components/tripReimburseApprove.vue
View file @ 3efb142c
<template> <template>
<!-- 搜索表单 --> <!-- 搜索表单-->
<div class="formSearch"> <div class="formSearch" >
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="120px"> <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="120px">
<!-- 默认显示的查询条件 --> <!-- 默认显示的查询条件 -->
<el-form-item label="项目名称" prop="projectName"> <el-form-item label="项目名称" prop="projectName">
<el-select <el-select
v-model="queryParams.projectName" v-model="queryParams.projectName"
placeholder="请选择项目名称" placeholder="请选择项目名称"
clearable style="width: 220px"
filterable clearable
style="width: 220px" >
> <el-option
<el-option v-for="item in projectNameList"
v-for="dict in projectOption" :key="item"
:key="dict.label" :label="item"
:label="dict.label" :value="item"/>
:value="dict.label" </el-select>
</el-form-item>
<el-form-item label="项目经理" prop="projectManagerId">
<el-select
v-model="queryParams.projectUserName"
placeholder="请选择项目经理"
style="width: 220px"
clearable
>
<el-option
v-for="item in projectManagerNameList"
:key="item.projectManagerName"
:label="item.projectManagerName"
:value="item.projectManagerName"/>
</el-select>
</el-form-item>
<el-form-item label="审批状态" prop="projectStatus">
<el-select
v-model="queryParams.projectStatus"
placeholder="请选择项目状态"
style="width: 220px"
clearable
>
<el-option
v-for="dict in project_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<!-- 操作按钮 -->
<el-form-item style="padding-left: 5.4%">
<el-button icon="Refresh" @click="resetQuery" class="el-button-defalut">重置</el-button>
<el-button type="primary" icon="Search" @click="handleQuery" class="el-button-primary">查询</el-button>
<el-button size="large" type="text" @click="toggleSearch">
{{ isExpanded ? ' 收起' : ' 展开' }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</el-button>
</el-form-item>
<!-- 可折叠的查询条件 -->
<transition>
<div v-if="isExpanded">
<el-form-item label="项目类型" prop="projectType">
<el-select
v-model="queryParams.projectType"
placeholder="请选择项目类型"
style="width: 220px" style="width: 220px"
/> clearable
</el-select> >
</el-form-item> <el-option
<el-form-item label="项目经理" prop="userName"> v-for="dict in project_type"
<el-select :key="dict.value"
v-model="queryParams.userName" :label="dict.label"
filterable :value="dict.value"
placeholder="请选择项目经理" />
style="width: 220px" </el-select>
clearable </el-form-item>
> </div>
<el-option </transition>
v-for="dict in managerOptions" </el-form>
:key="dict.label" </div>
:label="dict.label"
:value="dict.label"
/>
</el-select>
</el-form-item>
<el-form-item label="审批状态" prop="projectStatus">
<el-select
v-model="queryParams.projectStatus"
placeholder="请选择项目状态"
style="width: 220px"
clearable
>
<el-option
v-for="dict in cost_daily_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<!-- 操作按钮 -->
<el-form-item style="padding-left: 5.4%">
<el-button icon="Refresh" @click="resetQuery" class="el-button-defalut">重置</el-button>
<el-button type="primary" icon="Search" @click="handleQuery" class="el-button-primary">查询</el-button>
<el-button size="large" type="text" @click="toggleSearch">
{{ isExpanded ? ' 收起' : ' 展开' }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</el-button>
</el-form-item>
<!-- 可折叠的查询条件 -->
<transition>
<div v-if="isExpanded">
<el-form-item label="项目类型" prop="projectType">
<el-select
v-model="queryParams.projectType"
placeholder="请选择项目类型"
style="width: 220px"
clearable
>
<el-option
v-for="dict in project_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</div>
</transition>
</el-form>
</div>
<div class="contentTable_1"> <div class="contentTable_1">
<!-- 标题、按钮--> <!-- 标题、按钮-->
...@@ -108,24 +103,30 @@ ...@@ -108,24 +103,30 @@
</div> </div>
</div> </div>
<!-- 表格数据 --> <!-- 表格数据 -->
<el-table v-loading="loading" :data="projectList" border style="width: 100%"> <el-table v-loading="loading" :data="tripReimburseList" border style="width: 100%">
<el-table-column type="selection" width="40" align="right"/> <el-table-column type="selection" width="40" align="right"/>
<el-table-column label="申请人" align="center" prop="shenqingren"/> <el-table-column label="申请人" align="center" prop="updateBy" fixed min-width="120"/>
<el-table-column label="项目编号" align="center" prop="projectNumber" min-width="100px"/> <el-table-column label="项目编号" align="center" prop="projectNumber" min-width="160"/>
<el-table-column label="项目名称" align="center" prop="projectName" show-overflow-tooltip/> <el-table-column label="项目名称" align="center" prop="projectName" min-width="120" show-overflow-tooltip/>
<el-table-column label="项目类型" align="center" prop="projectType" > <el-table-column label="项目类型" align="center" prop="projectType" min-width="120">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <dict-tag :options="project_type" :value="scope.row.projectType"/>--> <dict-tag :options="project_type" :value="scope.row.projectType"/>
<!-- </template>--> </template>
</el-table-column> </el-table-column>
<el-table-column label="出差地点" align="center" prop="tripAddress" /> <el-table-column label="出差地点" align="center" prop="travelAddress" min-width="120" :show-overflow-tooltip="true"/>
<el-table-column label="出差事由" align="center" prop="tripReason" /> <el-table-column label="出差事由" align="center" prop="travelCause" min-width="150" :show-overflow-tooltip="true"/>
<el-table-column label="申请报销金额" align="center" prop="tripMoney" ></el-table-column> <el-table-column label="申请报销金额" align="center" prop="amount" min-width="150"></el-table-column>
<el-table-column label="项目经理" align="center" prop="projectManagerName" /> <el-table-column label="项目经理" align="center" prop="projectUserName" min-width="120"/>
<el-table-column label="审批状态" align="center" prop="projectStatus" > <el-table-column prop="approvalStatus" label="整体审批状态" align="center" min-width="150">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <dict-tag :options="project_status" :value="scope.row.projectStatus"/>--> <dict-tag :options="cost_daily_status" :value="scope.row.status"/>
<!-- </template>--> </template>
</el-table-column>
<el-table-column prop="approvalStatus" label="当前审批状态" align="center" min-width="150">
<template #default="scope">
<!-- {{getCurrentApprovalStatus(scope.row)}}-->
<el-tag size="large" :type="scope.row.currentStatus=== 0?'primary':scope.row.currentStatus> 0?'success':scope.row.currentStatus === -999?'info':'info'">{{scope.row.currentStatus=== 0?'待审批':scope.row.currentStatus > 0?'已通过':scope.row.currentStatus === -999?'未通过':'待前审'}}</el-tag>
</template>
</el-table-column> </el-table-column>
<el-table-column prop="detail" label="详情" align="center" width="100px"> <el-table-column prop="detail" label="详情" align="center" width="100px">
<el-tooltip content="详情" placement="top"> <el-tooltip content="详情" placement="top">
...@@ -135,7 +136,7 @@ ...@@ -135,7 +136,7 @@
</el-tooltip> </el-tooltip>
</el-table-column> </el-table-column>
<!-- 操作按钮--> <!-- 操作按钮-->
<el-table-column label="操作" align="center"> <el-table-column label="操作" align="center" fixed="right" min-width="120">
<template #default="scope" > <template #default="scope" >
<el-button link type="primary" size="small" style="font-size: 16px">通过</el-button> <el-button link type="primary" size="small" style="font-size: 16px">通过</el-button>
<el-button link @click="dialogFormVisible = true" type="danger" size="small" style="font-size: 16px">驳回</el-button> <el-button link @click="dialogFormVisible = true" type="danger" size="small" style="font-size: 16px">驳回</el-button>
...@@ -174,52 +175,122 @@ ...@@ -174,52 +175,122 @@
</template> </template>
<script setup> <script setup>
import {reactive, ref} from "vue"; import {getCurrentInstance, onMounted, reactive, ref} from "vue";
import {ArrowDown} from "@element-plus/icons-vue"; import {ArrowDown} from "@element-plus/icons-vue";
import FlowChart from '@/components/FlowChart/index.vue' import FlowChart from '@/components/FlowChart/index.vue'
const list = ref(['个人','项目经理','事业部负责人','财务','总经理']) // 流程图内容,只有值 import {useRouter} from "vue-router";
import {
getApproveNodeList,
getProjectManagerName,
getProjectName, getRoleId
} from "../../../../api/examineAndApprove/examineAndApprove.js";
import {listTripApplication, listTripReimburse} from "../../../../api/costManage/cost.js";
const router = useRouter();
const { proxy } = getCurrentInstance();
const {cost_daily_status, project_status, project_type } = proxy.useDict('cost_daily_status','project_status', 'project_type');
const list = ref([]) // 流程图内容,只有值
const allList = ref([]) // 流程图内容,值和角色id const allList = ref([]) // 流程图内容,值和角色id
const dialogFormVisible = ref(false)
const projectList = ref([
{
shenqingren:'张三',
projectNumber:'20250306RL001',
projectName:'餐饮项目',
projectType:'RL-人力',
tripAddress:'天津市',
tripReason:'',
projectManagerName:'ry',
projectStatus:'进行中',
tripMoney:'2000 '
}
]);
const tripReimburseList = reactive([]);
const total = ref(0); const total = ref(0);
const loading = ref(true);
const projectNameList = ref([]);
const projectManagerNameList = ref([]);
//当前登录用户角色组
const currentUserRoleInfoList = ref([])
//多选通过的参数list，用于一键通过/驳回
const passObjList = []
//驳回对象
let rejectObj = reactive({
projectCostId :null,
groundsForRejection:null
})
//是否一键驳回标识 false 不是
let oneClickFlag = false
// 弹出框
const dialogFormVisible = ref(false)
// 更多搜索框 // 更多搜索框
const isExpanded = ref(false); const isExpanded = ref(false);
const data = reactive({ const queryParams = reactive({
form: {}, pageNum: 1,
queryParams: { pageSize: 10,
pageNum: 1, projectNumber: null,
pageSize: 10, projectName: null,
projectNumber: null, projectType: null,
projectName: null, projectUserName: null,
projectType: null, status: null,
departmentLeaderId: null, })
projectManagerId: null,
projectStatus: null,
},
});
const { queryParams, form} = toRefs(data);
// 切换展开/折叠状态 // 切换展开/折叠状态
const toggleSearch = () => { const toggleSearch = () => {
isExpanded.value = !isExpanded.value; isExpanded.value = !isExpanded.value;
} }
// 搜索表单——获取所有项目名称
const getAllProjectName=()=> {
getProjectName(queryParams).then(response => {
console.log("出差-所有项目名称",response.data)
projectNameList.value = response.data;
});
}
getAllProjectName()
// 搜索表单——获取所有项目名经理
const getAllProjectManagerName=()=> {
getProjectManagerName(queryParams).then(response => {
console.log("出差-所有项目经理",response.data)
projectManagerNameList.value = response.data;
});
}
getAllProjectManagerName()
//获取所有流程列表,根据审批id（差旅报销的流程配置id是24）
const getNodeList = ()=>{
getApproveNodeList(24).then(res=>{
console.log("差旅报销审批-所有流程",res)
allList.value = res.data.nodeList
list.value = res.data.nodeList.map(item=>{
return item.roleName
})
})
}
//获取当前用户角色信息
const getRoleInfo = ()=>{
getRoleId().then(res=>{
console.log("角色信息",res)
currentUserRoleInfoList.value = res.data
})
}
// 出差申请 列表
const getList=()=> {
loading.value = true;
listTripReimburse(queryParams).then(res => {
total.value = res.total;
Object.assign(tripReimburseList, res.rows);
loading.value = false;
// for(let i in tripReimburseList){
// tripReimburseList[i].currentStatus = approvalStatusChange(tripReimburseList[i].status,tripReimburseList[i].currentAuditRoleId)
// }
console.log("差旅报销审批-列表",tripReimburseList)
// getTopApproveInfo()
});
}
/** 搜索按钮操作 */ /** 搜索按钮操作 */
function handleQuery() { function handleQuery() {
...@@ -230,6 +301,14 @@ function resetQuery() { ...@@ -230,6 +301,14 @@ function resetQuery() {
} }
onMounted(async ()=>{
//获取所有审批列表
await getNodeList()
//获取当前用户角色信息
await getRoleInfo()
//获取列表
await getList()
})
</script> </script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment