费用报销详情页完善

src/views/costManage/examineAndApprove/components/projectCostReimbursementApprove.vue

@@ -88,11 +88,13 @@
           </template>
         </el-table-column>
         <el-table-column prop="detail" label="详情" align="center" width="100px">
-          <el-tooltip content="详情" placement="top">
-            <el-button link type="text"  @click="handleView(scope.row)">
-              <img src="@/assets/icons/common/check.png" height="32" width="32"/>
-            </el-button>
-          </el-tooltip>
+          <template #default="scope">
+            <el-tooltip content="详情" placement="top">
+              <el-button link type="text" @click="handleView(scope.row)">
+                <img src="@/assets/icons/common/check.png" height="32" width="32"/>
+              </el-button>
+            </el-tooltip>
+          </template>
         </el-table-column>
         <!--   操作按钮-->
         <el-table-column label="操作" align="center">
@@ -431,6 +433,11 @@ onMounted(async ()=>{
   //获取列表
   await getList()
 })
+
+//查看详情
+const handleView=({id})=> {
+  proxy.$router.push({ path: '/costManage/projectCostReimbursement/detail', query: { id: id,type:"审批" } });
+}
 </script>
 
 

src/views/costManage/examineAndApprove/components/projectCostRequestApprove.vue

@@ -89,11 +89,13 @@
           </template>
         </el-table-column>
         <el-table-column prop="detail" label="详情" align="center" width="100px">
-          <el-tooltip content="详情" placement="top">
-            <el-button link type="text"  @click="handleView(scope.row)">
-              <img src="@/assets/icons/common/check.png" height="32" width="32"/>
-            </el-button>
-          </el-tooltip>
+          <template #default="scope">
+            <el-tooltip content="详情" placement="top">
+              <el-button link type="text" @click="handleView(scope.row)">
+                <img src="@/assets/icons/common/check.png" height="32" width="32"/>
+              </el-button>
+            </el-tooltip>
+          </template>
         </el-table-column>
 
         <!--   操作按钮-->
@@ -424,6 +426,11 @@ onMounted(async ()=>{
   //获取列表
   await getList()
 })
+
+//  查看详情
+const handleView=({id})=> {
+  proxy.$router.push({ path: '/costManage/projectCostRequest/detail', query: { id: id,type:"审批" } });
+}
 </script>
 
 

src/views/costManage/examineAndApprove/components/tripApplicationApprove.vue

@@ -139,11 +139,13 @@
         </template>
       </el-table-column>
       <el-table-column prop="detail" label="详情" align="center" min-width="120">
+        <template #default="scope">
         <el-tooltip content="详情" placement="top">
-          <el-button link type="text"  @click="handleView()">
+          <el-button link type="text" @click="handleView(scope.row)">
             <img src="@/assets/icons/common/check.png" height="32" width="32"/>
           </el-button>
         </el-tooltip>
+        </template>
       </el-table-column>
       <!--   操作按钮-->
       <el-table-column label="操作" align="center" fixed="right"  min-width="120">
@@ -198,6 +200,8 @@ import {
   tripApplicationApproval,
   tripApplicationPassNotPass
 } from "../../../../api/examineAndApprove/examineAndApprove.js";
+import {useRouter} from "vue-router";
+const router = useRouter();
 const { project_status,cost_daily_status,project_type} = proxy.useDict('project_status', 'cost_daily_status','project_type');
 
 const list = ref([]) // 流程图内容,只有值
@@ -481,6 +485,12 @@ onMounted(async ()=>{
   //获取列表
   await getList()
 })
+
+/** 出差申请详情页 */
+function handleView(row) {
+  router.push({ path: '/costManage/tripApplication/detail', query: { id: row.id , type: "审批" } });
+}
+
 </script>
 
 

src/views/costManage/examineAndApprove/components/tripReimburseApprove.vue

@@ -129,11 +129,13 @@
         </template>
       </el-table-column>
       <el-table-column prop="detail" label="详情" align="center" width="100px">
-        <el-tooltip content="详情" placement="top">
-          <el-button link type="text"  @click="handleView(scope.row)">
-            <img src="@/assets/icons/common/check.png" height="32" width="32"/>
-          </el-button>
-        </el-tooltip>
+        <template #default="scope">
+          <el-tooltip content="详情" placement="top">
+            <el-button link type="text" @click="handleView(scope.row)">
+              <img src="@/assets/icons/common/check.png" height="32" width="32"/>
+            </el-button>
+          </el-tooltip>
+        </template>
       </el-table-column>
       <!--   操作按钮-->
       <el-table-column label="操作" align="center" fixed="right"  min-width="120">
@@ -188,6 +190,8 @@ import {
 } from "../../../../api/examineAndApprove/examineAndApprove.js";
 const { project_status,cost_daily_status,project_type} = proxy.useDict('project_status', 'cost_daily_status','project_type');
 import {listTripApplication, listTripReimburse} from "../../../../api/costManage/cost.js";
+import {useRouter} from "vue-router";
+const router = useRouter();
 const list = ref([]) // 流程图内容,只有值
 const allList = ref([]) // 流程图内容,值和角色id
 const total = ref(0);
@@ -469,6 +473,11 @@ onMounted(async ()=>{
   //获取列表
   await getList()
 })
+
+/** 差旅报销详情页 */
+function handleView(row) {
+  router.push({path: '/costManage/tripReimburse/detail', query: {id: row.id , type: "审批"} });
+}
 </script>
 
 

src/views/costManage/projectCostReimbursement/detail.vue

@@ -94,6 +94,7 @@ const list = ['个人','PM','事业部负责人','财务','领导']
 //获取详情
 const reimbursementDetail = reactive({})
 let id = proxy.$route.query.id;
+let type = proxy.$route.query.type;
 const getDetail=()=> {
   getReimbursementDetail(id).then(response => {
     console.log("res",response.data)
@@ -154,7 +155,13 @@ onMounted(()=>{
 
 //  返回
 const goBackReimburseIndex = () => {
-  router.push({ path: '/costManage/projectCostReimbursement' })
+  if(type === "审批"){
+    // 返回审批页
+    router.push({ path: '/costManage/costManage/examineAndApprove' })
+  }else {
+    // 返回项目费用报销页
+    router.push({ path: '/costManage/projectCostReimbursement' })
+  }
 }
 </script>
 

src/views/costManage/projectCostRequest/detail.vue

@@ -9,7 +9,7 @@
         </div>
       </div>
         <!--    步骤条-->
-        <div  v-if="costRequestDetailList.value"  class="shadow_box_bottom_step">
+      <div  v-if="costRequestDetailList.value"  class="shadow_box_bottom_step">
           <text   class="text1">审批流程</text>
           <FlowChart  :dataList="list" :widthDontai="'70%'" :activeIndex="costRequestDetailList.value.approveStatus === 3 ? 5 :1"/>
         </div>
@@ -58,14 +58,12 @@
           <el-col :span="2"> <span>更新时间：</span></el-col>
           <el-col :span="22"><div style="color: royalblue">{{costRequestDetailList.value.updateTime}}</div></el-col>
         </el-row>
-
       </div>
 
         <!--  取消、提交按钮-->
-        <div v-if="costRequestDetailList.value" style="position: absolute;right: 52px;bottom: 42px;display: flex">
-          <div style="margin-right: 15px"><el-button @click="goBackIndex" :type="costRequestDetailList.value.approveStatus === 3 ? '' : 'primary' " :class="costRequestDetailList.value.approveStatus === 3 ? 'btn-B' : 'btn-A' ">返回</el-button></div>
-          <div><el-button @click="goToAddReimburse" v-if="costRequestDetailList.value.approveStatus === 3" class="btn-A" type="primary">申请报销</el-button></div>
-
+      <div v-if="costRequestDetailList.value" style="position: absolute;right: 52px;bottom: 42px;display: flex">
+          <div style="margin-right: 15px"><el-button @click="goBackIndex" :type="costRequestDetailList.value.approveStatus === 3 && type !== '审批' ? '' : 'primary' " :class="costRequestDetailList.value.approveStatus === 3 && type !== '审批' ? 'btn-B' : 'btn-A' ">返回</el-button></div>
+          <div><el-button @click="goToAddReimburse" v-if="costRequestDetailList.value.approveStatus === 3 && type !== '审批' " class="btn-A" type="primary">申请报销</el-button></div>
         </div>
 
     </div>
@@ -89,6 +87,7 @@ const list = ['个人','PM','事业部负责人','财务','领导']
 
 const costRequestDetailList = reactive({})
 let projectId = proxy.$route.query.id;
+let type = proxy.$route.query.type;
 const getDetail=()=> {
   getCostRequestDetail(projectId).then(response => {
     console.log("res",response.data)
@@ -142,14 +141,21 @@ onMounted(()=>{
 
 //  取消按钮
 const goBackIndex = () => {
-  router.push({ path: '/costManage/projectCostRequest/index' })
+  if (type === "审批"){
+    // 返回审批页
+    router.push({ path: '/costManage/costManage/examineAndApprove' })
+  }else {
+    // 返回项目费用申请页
+    router.push({ path: '/costManage/projectCostRequest/index' })
+  }
 }
 
 //  申请报销按钮
-const goToAddReimburse = () => {
-  console.log(projectId)
-  router.push({ path: '/costManage/projectCostReimbursement/add',query: { id: projectId,type:"新增" }})
-}
+  const goToAddReimburse = () => {
+    console.log(projectId)
+    router.push({ path: '/costManage/projectCostReimbursement/add',query: { id: projectId,type:"新增" }})
+  }
+
 
 
 </script>

src/views/costManage/tripApplication/detail.vue

@@ -109,6 +109,8 @@ const ruleForm = ref({
   status:'',
 })
 
+let type = proxy.$route.query.type;
+
 function getDetail() {
   let id = proxy.$route.query.id
   console.log("路由",id)
@@ -119,7 +121,13 @@ function getDetail() {
 }
 
 function back(){
-  router.push('/costManage/tripApplication')
+  if (type === "审批"){
+    // 返回审批页
+    router.push({ path: '/costManage/costManage/examineAndApprove' })
+  }else {
+    // 返回出差申请页
+    router.push('/costManage/tripApplication')
+  }
 }
 
 onMounted(() => {

src/views/costManage/tripReimburse/detail.vue

@@ -100,6 +100,8 @@ const ruleForm = ref({
   status: '',
 })
 
+let type = proxy.$route.query.type;
+
 function getDetail() {
   let id = proxy.$route.query.id
   console.log("路由",id)
@@ -112,7 +114,13 @@ function getDetail() {
 }
 
 function back(){
-  router.push('/costManage/tripReimburse')
+  if (type === "审批"){
+    // 返回审批页
+    router.push({ path: '/costManage/costManage/examineAndApprove' })
+  }else {
+    // 返回差旅报销页
+    router.push('/costManage/tripReimburse')
+  }
 }
 
 onMounted(() => {