diff --git a/src/api/caseManagement/caseManagement.js b/src/api/caseManagement/caseManagement.js
index 7a630e6..71d00cb 100644
--- a/src/api/caseManagement/caseManagement.js
+++ b/src/api/caseManagement/caseManagement.js
@@ -2,99 +2,99 @@ import request from '@/utils/request'
 
 // 查询案件列表
 export function caseApplicationList(data) {
-    return request({
-        url: 'caseApplication/list',
-        method: 'get',
-        params: data
-    })
+  return request({
+    url: 'caseApplication/list',
+    method: 'get',
+    params: data
+  })
 }
 /** 新增案件 */
 export function caseApplicationInsert(data) {
-    return request({
-        url: 'caseApplication/insert',
-        method: 'post',
-        data: data
-    })
+  return request({
+    url: 'caseApplication/insert',
+    method: 'post',
+    data: data
+  })
 }
 /** 根据id查询案件信息 */
 export function caseApplicationSelectById(data) {
-    return request({
-        url: '/caseApplication/selectById',
-        method: 'get',
-        params: data
-    })
+  return request({
+    url: '/caseApplication/selectById',
+    method: 'get',
+    params: data
+  })
 }
 /** 案件证据查询 */
 export function getFileList(data) {
-    return request({
-        url: "/common/fileList",
-        method: "get",
-        params: data,
-    });
+  return request({
+    url: "/common/fileList",
+    method: "get",
+    params: data,
+  });
 }
 /** 批量上传证据 */
 export function batchUpload(data) {
-    return request({
-        url: "/caseApplication/batchUpload",
-        method: "post",
-        data: data,
-    });
+  return request({
+    url: "/caseApplication/batchUpload",
+    method: "post",
+    data: data,
+  });
 }
 // 提交 
 export function submitCaseApply(data) {
-    return request({
-      url: '/caseApplication/submit',
-      method: 'post',
-      data: data
-    })
-  }
+  return request({
+    url: '/caseApplication/submit',
+    method: 'post',
+    data: data
+  })
+}
 //   缴费确认
 export function confirmPaid(data) {
-    return request({
-      url: "/pay/confirmPaid",
-      method: "post",
-      data: data,
-    });
-  }
+  return request({
+    url: "/pay/confirmPaid",
+    method: "post",
+    data: data,
+  });
+}
 //   案件id查询缴费清单
 export function selectPaymentDetail(data) {
-    return request({
-      url: "/pay/selectPaymentDetail",
-      method: "get",
-      params: data,
-    });
-  }
-  //案件受理
-  export function accept(data) {
-    return request({
-      url: "/caseApplication/accept",
-      method: "post",
-      data: data,
-    });
-  }
-  export function listMediator(data) {
-    return request({
-      url: "caseApplication/listMediator",
-      method: "get",
-      params: data,
-    });
-  }
+  return request({
+    url: "/pay/selectPaymentDetail",
+    method: "get",
+    params: data,
+  });
+}
+//案件受理
+export function accept(data) {
+  return request({
+    url: "/caseApplication/accept",
+    method: "post",
+    data: data,
+  });
+}
+export function listMediator(data) {
+  return request({
+    url: "caseApplication/listMediator",
+    method: "get",
+    params: data,
+  });
+}
 //   确认仲裁员以及时间
 export function updateBooking(data) {
-    return request({
-      url: "/caseApplication/updateBooking",
-      method: "post",
-      data: data,
-    });
-  }
-  //用印申请
-  export function sealApply(data) {
-    return request({
-      url: "/mssignSeal/sealApply",
-      method: "post",
-      data: data,
-    });
-  }
+  return request({
+    url: "/caseApplication/updateBooking",
+    method: "post",
+    data: data,
+  });
+}
+//用印申请
+export function sealApply(data) {
+  return request({
+    url: "/mssignSeal/sealApply",
+    method: "post",
+    data: data,
+  });
+}
 // 用印确认
 export function selectSealUrl(data) {
   return request({
@@ -105,13 +105,13 @@ export function selectSealUrl(data) {
 }
 //查询预约信息
 export function selectReservation(data) {
-    return request({
-      url: "/caseApplication/selectReservation",
-      method: "get",
-      params: data,
-    });
-  }
-  //核实调解员
+  return request({
+    url: "/caseApplication/selectReservation",
+    method: "get",
+    params: data,
+  });
+}
+//核实调解员
 export function verifyMediator(data) {
   return request({
     url: "/caseApplication/verifyMediator",
@@ -123,7 +123,13 @@ export function verifyMediator(data) {
 export function confirmDate(data) {
   return request({
     url: "/caseApplication/confirmDate",
+  })
+}
+// 查看案件流程
+export function selectCaseProgress(data) {
+  return request({
+    url: "/mssignSeal/selectCaseProgress",
     method: "post",
     data: data,
-  });
+  })
 }
diff --git a/src/views/caseManagement/caseList.vue b/src/views/caseManagement/caseList.vue
index 6ff72ba..ff0f95c 100644
--- a/src/views/caseManagement/caseList.vue
+++ b/src/views/caseManagement/caseList.vue
@@ -92,7 +92,7 @@
             @cancelCompreess="cancelCompreess" :getList="getList">
         </caseCompressionPackage>
         <!-- 案件详情 -->
-        <mediationCaseDetails :processVisable="processVisable" @cancelViewProcess="cancelViewProcess">
+        <mediationCaseDetails :processVisable="processVisable" @cancelViewProcess="cancelViewProcess" :caseFlowNumber="caseFlowNumber">
         </mediationCaseDetails>
         <!-- 案件日志 -->
         <mediationCaseLog :showcaseLog="showcaseLog" @cancelcaseLog="cancelcaseLog"></mediationCaseLog>
@@ -118,7 +118,7 @@
 </template>
 
 <script>
-import { caseApplicationList, caseApplicationSelectById,submitCaseApply,selectPaymentDetail,sealApply,selectSealUrl } from '@/api/caseManagement/caseManagement.js'
+import { caseApplicationList, caseApplicationSelectById,submitCaseApply,selectPaymentDetail,sealApply,selectSealUrl} from '@/api/caseManagement/caseManagement.js'
 import { listDept } from '@/api/system/dept.js'
 import moment from "moment";
 import addCase from './components/addCase.vue'
@@ -183,6 +183,7 @@ export default {
             mediatorVisable:false,//选择调解员弹窗
             timeVisable:false,//预约时间弹窗
             confirmVisable:false,//确认时间/调解员
+            caseFlowNumber:{},//案件流程数据
             mediatorData:{},
             flag: null,
             caseData: {},
@@ -434,6 +435,7 @@ export default {
         },
         //案件流程
         caseFlow(row) {
+            this.caseFlowNumber = row
             this.processVisable = true
         },
         cancelViewProcess() {
diff --git a/src/views/caseManagement/components/mediationCaseDetails.vue b/src/views/caseManagement/components/mediationCaseDetails.vue
index 3fff488..a067244 100644
--- a/src/views/caseManagement/components/mediationCaseDetails.vue
+++ b/src/views/caseManagement/components/mediationCaseDetails.vue
@@ -6,6 +6,11 @@
                     <el-step :title="item.caseNodeName || item.content" v-for="(item,index) in pageData.allCasenode" :key="index" :description="(item.createNickName || '') + (item.caseNodeTime || '')+(item.nextRoleName || '')"></el-step>
                    
                 </el-steps> -->
+                <el-steps :active="finishCasenode.length">
+                    <el-step :title="item.content"  v-for="(item,index) in finishCasenode" :key="index"></el-step>
+                    <el-step :title="item.content" v-for="(item,index) in inCasenode" :key="index"></el-step>
+                    <el-step :title="item.content"  v-for="(item,index) in nextCasenode" :key="index"></el-step>
+                </el-steps>
             </div>
             <div slot="footer" class="dialog-footer">
                 <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
@@ -15,38 +20,40 @@
 </template>
   
 <script>
-import {selectCaseProgress} from '@/api/caseManagement/caseManagement'
+import {selectCaseProgress} from '@/api/caseManagement/caseManagement.js'
 export default {
-    props: ["processVisable","processData"],
+    props: ["processVisable","processData","caseFlowNumber"],
     data() {
         return {
             processId:null,
             pageData:{},
-            caseStatus:0
+            caseStatus:0,
+            finishCasenode:[],
+            inCasenode:[],
+            nextCasenode:[]
+            
         };
     },
     watch: {
         processVisable(val){
             if(val){
-                // this.processId = this.processData.id;
-                // this.selectCaseProgressFn({id:this.processId});
+                this.processId = this.caseFlowNumber.id;
+                this.selectCaseProgressFn({caseId:this.processId});
+                
             }
         }
     },
+    
     methods: {
         cancel() {
             this.$emit("cancelViewProcess");
         },
         selectCaseProgressFn(data){
             selectCaseProgress(data).then(res=>{
-                 this.pageData = res.data.data; 
-                let allCasenode = res.data.data.allCasenode;
-                console.log(allCasenode)
-                allCasenode.forEach((item,index) => {
-                    if(item.caseNode==res.data.data.caseStatus){
-                        this.caseStatus = index
-                    }
-                });
+                this.finishCasenode = res.data.data.finishCasenode
+                this.inCasenode = res.data.data.inCasenode
+                this.nextCasenode = res.data.data.nextCasenode
+                
             })
         }
     },
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 178cd10..e92760c 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -674,4 +674,16 @@ export default {
     }
   }
 };
-</script>
\ No newline at end of file
+</script>
+<style lang="scss" scoped>
+ .head-container{
+      width:220px;
+      ::v-deep .el-tree-node {
+      white-space: normal;
+      .el-tree-node__content {
+      height: 100%;
+      align-items: start;
+      }
+    }
+ }
+</style>
\ No newline at end of file