批量上传,批量操作

2023-10-20 17:25:58 +08:00
parent 035a1d6b10
commit 39bb0a47d9
14 changed files with 718 additions and 245 deletions
@@ -41,9 +41,17 @@
          v-hasPermi="['caseManagement:list:add']">案件录入</el-button>
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="batchApplication"
          v-hasPermi="['caseManagement:list:import']">案件批量导入</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="operateClick(0)"
+          v-hasPermi="['caseManagement:list:submit']">案件批量提交</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="operateClick(1)"
+          v-hasPermi="['caseManagement:list:delete']">案件批量删除</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="operateClick(2)"
+          v-hasPermi="['caseManagement:list:check']">案件批量立案审查</el-button>
      </el-col>
    </el-row>
    <el-table v-loading="loading" :data="dataList" style="width: 100%">
+      <el-table-column type="selection">
+      </el-table-column>
      <el-table-column label="序号" type="index" align="center">
        <template slot-scope="scope">
          <span>{{
@@ -67,6 +75,7 @@
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-zoom-in" @click="detailRow(scope.row)">详情</el-button>
+          <el-button size="mini" type="text" icon="el-icon-zoom-in" @click="viewProcess(scope.row)">查看流程</el-button>
          <!-- 案件日志 -->
          <el-button size="mini" type="text" icon="el-icon-notebook-2" @click="caselogRow(scope.row)">案件日志</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="editRow(scope.row)" v-if="scope.row.caseStatus == 0 &&
@@ -113,6 +122,14 @@
            scope.row.arbitratMethod == 1 &&
            checkPermi(['caseManagement:list:hear'])
            ">开庭审理</el-button>
+          <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus < 8 &&
+            checkPermi(['caseManagement:list:evidenceUpdate'])" @click="evidenceUpload(scope.row)">证据修改</el-button>
+          <el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.caseStatus == 31"
+            @click="timeUpdata(scope.row)">开庭时间</el-button>
+          <el-button size="mini" type="text" icon="el-icon-lock" v-if="checkPermi(['caseManagement:list:lock'])"
+            @click="lockClick(scope.row)">锁定</el-button>
+          <el-button size="mini" type="text" icon="el-icon-unlock" v-if="checkPermi(['caseManagement:list:lock'])"
+            @click="ulockClick(scope.row)">解锁</el-button>
          <!-- <el-button
            size="mini"
            type="text"
@@ -165,6 +182,18 @@
    <!-- 案件日志 -->
    <caselogDialog :showcaseLog="showcaseLog" @cancelcaseLog="cancelcaseLog" :flagLoading="flagLoading"
      :caselogDataArr="caselogDataArr"></caselogDialog>
+    <!-- 案件流程   -->
+    <viewprocessDialog :processVisable="processVisable" @cancelViewProcess="cancelViewProcess" :processData="processData">
+    </viewprocessDialog>
+    <!-- 证据修改 -->
+    <evidenceDialog :evidenceVisable="evidenceVisable" @cancelEvidence="cancelEvidence" :evidenceData="evidenceData">
+    </evidenceDialog>
+    <!-- 开庭时间修改 -->
+    <timeDialog :timeVisable="timeVisable" :getcaseApply="getcaseApply" @cancelTime="cancelTime" :timeData="timeData">
+    </timeDialog>
+    <!-- 批量操作弹窗 -->
+    <operateDialog :operateVisable="operateVisable" :getcaseApply="getcaseApply" :operateTitle="operateTitle" @cancelOperate="cancelOperate" :operateData="operateData">
+    </operateDialog>
  </div>
 </template>

@@ -179,7 +208,10 @@ import trialincourtDialog from "./components/trialincourtDialog.vue";
 import payDialog from "./components/payDialog.vue";
 import filingreviewDialog from "./components/filingreviewDialog.vue";
 import caselogDialog from "./components/caselogDialog.vue";
-
+import viewprocessDialog from "./components/viewprocessDialog.vue";
+import evidenceDialog from './components/evidenceDialog.vue'
+import timeDialog from './components/timeDialog.vue'
+import operateDialog from './components/operateDialog.vue'
 import { caseApplicationDetail } from "@/api/pay/pay";
 import {
  caseApply,
@@ -207,6 +239,10 @@ export default {
    payDialog,
    filingreviewDialog,
    caselogDialog,
+    viewprocessDialog,
+    evidenceDialog,
+    timeDialog,
+    operateDialog
  },
  data() {
    return {
@@ -221,7 +257,7 @@ export default {
      queryParams: {
        caseNum: undefined,
        // caseStatusList: [0, 1, 2, 5, 6, 7, 8, 9, 10, 16],
-        caseStatusList: [0, 1, 2, 5, 6, 7, 8, 9, 10],
+        caseStatusList: [0, 1, 2, 5, 6, 7, 8, 9, 10, 31],
        // hearDate: "",
        caseStatus: null,
        applicantName: "",
@@ -250,6 +286,9 @@ export default {
      adjudicatename: {}, //书面仲裁（被）申请人姓名
      showtrialincourt: false, //开庭审理
      openPay: false, //缴费弹框
+      processVisable: false,//案件流程弹窗
+      evidenceVisable: false,//修改证据弹窗
+      evidenceData: {},
      payTitle: "",
      payForm: {},
      caseAttachList: [], //案件质证资料
@@ -258,7 +297,13 @@ export default {
      caselogDataArr: [],
      options: [], //机构数据
      payId: null,
-      caseStatus: []
+      caseStatus: [],
+      processData: {},
+      timeVisable: false,
+      timeData: {},
+      operateVisable:false,
+      operateData:{},
+      operateTitle:""
    };
  },
  created() {
@@ -280,6 +325,68 @@ export default {
    cancelBatch() {
      this.openbatch = false;
    },
+    cancelTime() {
+      this.timeVisable = false;
+    },
+    cancelOperate(){
+      this.operateVisable = false;
+    },
+    // 批量操作弹窗
+    operateClick(type){
+      this.operateVisable = true;
+      if(type == 0){
+        this.operateTitle = '批量提交'
+      }else if(type == 1){
+        this.operateTitle = '批量删除'
+      }else if(type == 2){
+        this.operateTitle = '批量立案申请'
+      }
+    },
+    // 修改开庭时间
+    timeUpdata(row) {
+      this.timeData = row;
+      this.timeVisable = true;
+    },
+    // 锁定案件
+    lockClick(row) {
+      this.$modal
+        .confirm("是否锁定案件")
+        .then(function () {
+          // return removeCaseApply({ id: row.id });
+        })
+        .then((res) => {
+          // this.getcaseApply(this.queryParams);
+          this.$modal.msgSuccess("锁定成功");
+        })
+        .catch(() => { });
+    },
+    // 解锁案件
+    ulockClick(row) {
+      this.$modal
+        .confirm("是否解锁锁案件")
+        .then(function () {
+          // return removeCaseApply({ id: row.id });
+        })
+        .then((res) => {
+          // this.getcaseApply(this.queryParams);
+          this.$modal.msgSuccess("解锁成功");
+        })
+        .catch(() => { });
+    },
+    // 修改证据
+    evidenceUpload(row) {
+      this.evidenceData = row;
+      this.evidenceVisable = true;
+    },
+    // 取消弹窗（证据弹窗）
+    cancelEvidence() {
+      this.evidenceVisable = false;
+    },
+    // 查看流程
+    viewProcess(row) {
+      this.processVisable = true;
+      this.processData = row;
+    },
    // 机构发生变化
    changeDept(data) {
      this.queryParams.nameId = data[0];
@@ -388,6 +495,10 @@ export default {
    cancelcaseLog() {
      this.showcaseLog = false;
    },
+    //关闭案件流程
+    cancelViewProcess() {
+      this.processVisable = false;
+    },
    // 修改
    editRow(row) {
      this.flag = "1";
@@ -401,7 +512,8 @@ export default {
      this.$modal
        .confirm("是否提交立案申请？")
        .then(function () {
-          return submitCaseApply({ id: row.id });
+          // return submitCaseApply({ id: row.id });
+          return submitCaseApply({ids: [row.id] });
        })
        .then(() => {
          this.getcaseApply(this.queryParams);
@@ -549,7 +661,8 @@ export default {
      this.$modal
        .confirm("是否确认删除？")
        .then(function () {
-          return removeCaseApply({ id: row.id });
+          // return removeCaseApply({ id: row.id });
+          return removeCaseApply({ids:[row.id]});
        })
        .then((res) => {
          this.getcaseApply(this.queryParams);
@@ -56,11 +56,12 @@ export default {
    submitForm(val) {
      let paramsdata = {
        opinion: val,
+        ids: [this.choosetrialmethodata.id]
      };
-      let id = {
-        id: this.choosetrialmethodata.id,
-      };
-      arbitrateMethod(paramsdata, id)
+      // let id = {
+      //   id: this.choosetrialmethodata.id,
+      // };
+      arbitrateMethod(paramsdata)
        .then((res) => {
          this.$modal.msgSuccess("提交成功");
          this.cancel();
@@ -0,0 +1,130 @@
+<template>
+    <div>
+        <el-dialog title="修改证据" :visible="evidenceVisable" @close="cancel" center :distroy-on-close="true">
+            <el-descriptions title="案件内容" :column="2" border>
+                <el-descriptions-item label="案件编号">{{ evidenceData.caseNum }}</el-descriptions-item>
+                <el-descriptions-item label="申请人(机构)">{{ evidenceData.applicantName }}</el-descriptions-item>
+                <el-descriptions-item label="案件标的">{{ evidenceData.caseSubjectAmount }}</el-descriptions-item>
+                <el-descriptions-item label="案件状态">
+                    <el-tag size="small">{{ evidenceData.caseStatusName }}</el-tag>
+                </el-descriptions-item>
+                <el-descriptions-item label="仲裁方式">{{ evidenceData.arbitratMethodName }}</el-descriptions-item>
+                <el-descriptions-item label="申请人证据">
+                    <div style="color: #104fad;cursor:pointer" v-for="(item, index) in fileListData"
+                        @click="preview(item.annexPath)" :key="index">
+                        {{ item.annexName }}</div>
+                </el-descriptions-item>
+            </el-descriptions>
+            <div style="margin-top: 30px;">
+                <el-upload class="upload-demo" ref="upload" action="" accept=".png,.jpg,.doc,.docx,.txt,.pdf"
+                    :auto-upload="false" :http-request="uploadFile" :on-change="beforeAvatarUpload" multiple>
+                    <el-button type="primary"><span>修改证据</span></el-button>
+                </el-upload>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
+                <el-button @click="upload" class="endbutton1"><span>点击上传</span></el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+  
+<script>
+import { getFileList, batchUpload } from '@/api/caseManagement/caseManagement'
+import { getToken } from "@/utils/auth";
+export default {
+    props: ["evidenceVisable", "evidenceData"],
+    data() {
+        return {
+            fileListData: [],
+            // 上传文件的列表
+            uploadFiles: [],
+            // 上传文件的个数
+            filesLength: 0,
+            info: {
+                annexType: 2,
+            },
+            // headers: {
+            //     Authorization: "Bearer " + getToken(),
+            // },
+        };
+    },
+    watch: {
+        evidenceVisable(val) {
+            if (val) {
+                this.getEvidenceList({ caseAppliId: this.evidenceData.id, annexTypeList: "2" })
+            }
+        }
+    },
+    created() {
+        this.info.id = this.evidenceData.id;
+    },
+    methods: {
+        preview(data) {
+            window.open(
+                window.location.origin + "/API" + data,
+                "_blank"
+            );
+        },
+        UploadUrl() {
+            return window.location.origin + "/API/evidence/upload";
+        },
+        cancel() {
+            this.$emit("cancelEvidence");
+        },
+        // // 修改当前文件列表长度
+        // changeFileLength(file, fileList) {
+        //     this.filesLength = fileList.length
+        // },
+        // 文件上传之前处理
+        beforeAvatarUpload(file) {
+            this.uploadFiles.push(file)
+        },
+        // 用户点击上传调用
+        async upload() {
+            // 触发上传 调用配置 :http-request="uploadFile"
+            // 即触发 uploadFile函数
+            this.uploadFile()
+            // await this.$refs.upload.submit();
+            // 上传完成后执行的操作 ...
+        },
+        // 该函数还是会被调用多次
+        // 每次param参数传入一个文件
+        uploadFile() {
+            // 将文件加入需要上传的文件列表
+            // 当uploadFiles长度等于用户需要上传的文件数时进行上传
+            // 创建FormData上传
+            if (this.uploadFiles.length === 0) {
+                this.$message.warning('请选取文件')
+                return
+            }
+            let fd = new FormData()
+            // 将全部文件添加至FormData中
+            this.uploadFiles.forEach(file => {
+                fd.append('file', file.raw)
+            })
+            // // 将附加信息添加至FormData
+            fd.append("id", this.evidenceData.id)
+            fd.append("annexType", this.info.annexType)
+            // 上传文件
+            batchUpload(fd).then(res => {
+                this.$modal.msgSuccess("上传成功");
+                this.cancel()
+            })
+        },
+        // 获取案件申请人证据列表
+        getEvidenceList(data) {
+            getFileList(data).then(res => {
+                this.fileListData = res.data;
+            })
+        }
+    },
+};
+</script>
+  
+<style lang="scss" scoped>
+.steps {
+    display: flex;
+    flex-wrap: wrap;
+}
+</style>
@@ -43,7 +43,7 @@ export default {
    submitForm() {
      let paramsdata = {
        agreeOrNotCheck: this.radio,
-        id: this.filingreviewdata.id,
+        ids: [this.filingreviewdata.id],
      };
      submitCaseApplicationCheck(paramsdata)
        .then((res) => {
@@ -0,0 +1,87 @@
+<template>
+    <div>
+        <el-dialog :title="operateTitle" :visible="operateVisable" @close="cancel" center :distroy-on-close="true">
+            <el-table v-loading="loading" :data="dataList" style="width: 100%">
+                <el-table-column type="selection">
+                </el-table-column>
+                <el-table-column label="序号" type="index" align="center">
+                    <template slot-scope="scope">
+                        <span>{{
+                            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+                        }}</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="案件编号" align="center" prop="caseNum" :show-overflow-tooltip="true" />
+                <el-table-column label="申请人(机构)" align="center" prop="applicantName" :show-overflow-tooltip="true" />
+                <el-table-column label="案件标的" align="center" prop="caseSubjectAmount" />
+                <el-table-column label="仲裁方式" align="center" prop="arbitratMethodName" :show-overflow-tooltip="true" />
+                <!-- 仲裁员 -->
+                <el-table-column label="仲裁员" align="center" prop="arbitratorName" />
+                <!-- 开庭日期 -->
+                <el-table-column label="开庭日期" align="center" prop="hearDate" :show-overflow-tooltip="true" />
+                <el-table-column label="案件状态" align="center" prop="caseStatusName">
+                    <template slot-scope="scope">
+                        <el-tag type="success">{{ scope.row.caseStatusName }}</el-tag>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize" @pagination="getcaseApply(queryParams)" />
+        </el-dialog>
+    </div>
+</template>
+<script>
+import {
+  caseApply,
+} from "@/api/caseAccess/caseEntry";
+export default {
+    props: ["operateVisable", "operateData", "operateTitle"],
+    data() {
+        return {
+            // 遮罩层
+            loading: true,
+            // 总条数
+            total: 0,
+            // 查询参数
+            queryParams: {
+                caseStatus: null,
+                pageNum: 1,
+                pageSize: 10,
+            },
+            // 表格数据
+            dataList: [],
+        };
+    },
+    watch: {
+        operateVisable(val) {
+            if (val) {
+                this.getcaseApply()
+            }
+        }
+    },
+    created() {
+
+    },
+    methods: {
+        cancel() {
+            this.$emit("cancelOperate");
+        },
+        /** 查询列表 */
+        getcaseApply(val) {
+            this.loading = true;
+            caseApply(val).then((response) => {
+                this.dataList = response.rows;
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+    },
+};
+</script>
+  
+<style lang="scss" scoped>
+.steps {
+    display: flex;
+    flex-wrap: wrap;
+}
+</style>
@@ -0,0 +1,78 @@
+<template>
+    <div>
+        <el-dialog title="修改开庭时间" :visible="timeVisable" @close="cancel" center :distroy-on-close="true">
+            <el-descriptions title="案件内容" :column="2" border>
+                <el-descriptions-item label="案件编号">{{ timeData.caseNum }}</el-descriptions-item>
+                <el-descriptions-item label="申请人(机构)">{{ timeData.applicantName }}</el-descriptions-item>
+                <el-descriptions-item label="案件标的">{{ timeData.caseSubjectAmount }}</el-descriptions-item>
+                <el-descriptions-item label="案件状态">
+                    <el-tag size="small">{{ timeData.caseStatusName }}</el-tag>
+                </el-descriptions-item>
+                <el-descriptions-item label="仲裁方式">{{ timeData.arbitratMethodName }}</el-descriptions-item>
+                <el-descriptions-item label="开庭时间">
+                    <el-date-picker v-model="loanStartDate" type="datetime" placeholder="开庭时间">
+                    </el-date-picker>
+                </el-descriptions-item>
+
+            </el-descriptions>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
+                <el-button @click="submitTime" class="endbutton1"><span>提 交</span></el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+<!-- hearDate -->
+<script>
+import { updateHeardate } from '@/api/caseManagement/caseManagement'
+import { getToken } from "@/utils/auth";
+import moment from "moment";
+export default {
+    props: ["timeVisable", "timeData"],
+    data() {
+        return {
+            loanStartDate: ""
+        };
+    },
+    watch: {
+        timeVisable(val) {
+            if (val) {
+                // this.getEvidenceList({ caseAppliId: this.timeData.id, annexTypeList: "2" })
+                this.loanStartDate = this.timeData.hearDate
+            }
+        }
+    },
+    created() {
+
+    },
+    methods: {
+        cancel() {
+            this.$emit("cancelTime");
+        },
+        // 提交时间
+        updateHeardateFn(data) {
+            updateHeardate(data).then(res => {
+                this.$modal.msgSuccess("修改成功");
+                this.cancel();
+                this.$emit("getcaseApply");
+            })
+        },
+        submitTime() {
+            this.loanStartDate = moment(
+                this.loanStartDate
+            ).format("YYYY-MM-DD HH:mm:ss");
+            this.updateHeardateFn({
+                id: this.timeData.id,
+                hearDate: this.loanStartDate
+            })
+        }
+    },
+};
+</script>
+  
+<style lang="scss" scoped>
+.steps {
+    display: flex;
+    flex-wrap: wrap;
+}
+</style>
@@ -121,6 +121,65 @@
    </el-dialog>
    <el-dialog title="生成庭审笔录" :visible="showArbitrationresults" @close="closeArbitrationresults" center>
      <el-form ref="form2" :model="form2" label-width="150px">
+        <el-col :span="12">
+          <el-form-item label="申请人是否缺席：" prop="isAbsence" :rules="[
+            {
+              required: true,
+              message: '请输入',
+            },
+          ]">
+            <el-radio-group v-model="form2.isAbsence">
+              <el-radio :label="1">是</el-radio>
+              <el-radio :label="0">否</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="被申请人是否缺席：" prop="appliIsAbsen" :rules="[
+            {
+              required: true,
+              message: '请输入',
+            },
+          ]">
+            <el-radio-group v-model="form2.appliIsAbsen">
+              <el-radio :label="1">是</el-radio>
+              <el-radio :label="0">否</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="被申请人质证意见：" prop="responCrossOpin" :rules="[
+            {
+              required: true,
+              message: '请输入',
+              trigger: 'blur',
+            },
+          ]">
+            <el-input type="textarea" v-model="form2.responCrossOpin" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="申请人质证意见：" prop="applicaCrossOpin" :rules="[
+            {
+              required: true,
+              message: '请输入',
+              trigger: 'blur',
+            },
+          ]">
+            <el-input type="textarea" v-model="form2.applicaCrossOpin" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="被申请人的答辩意见：" prop="responDefenOpini" :rules="[
+            {
+              required: true,
+              message: '请输入',
+              trigger: 'blur',
+            },
+          ]">
+            <el-input type="textarea" v-model="form2.responDefenOpini" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
        <el-col :span="24">
          <el-form-item label="经庭审质证，对各方提供的证据认定如下：" prop="evidenDetermi" :rules="[
            {
@@ -181,65 +240,6 @@
            </el-input>
          </el-form-item>
        </el-col>
-        <el-col :span="12">
-          <el-form-item label="申请人是否缺席：" prop="isAbsence" :rules="[
-            {
-              required: true,
-              message: '请输入',
-            },
-          ]">
-            <el-radio-group v-model="form2.isAbsence">
-              <el-radio :label="1">是</el-radio>
-              <el-radio :label="0">否</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="被申请人是否缺席：" prop="appliIsAbsen" :rules="[
-            {
-              required: true,
-              message: '请输入',
-            },
-          ]">
-            <el-radio-group v-model="form2.appliIsAbsen">
-              <el-radio :label="1">是</el-radio>
-              <el-radio :label="0">否</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="被申请人质证意见：" prop="responCrossOpin" :rules="[
-            {
-              required: true,
-              message: '请输入',
-              trigger: 'blur',
-            },
-          ]">
-            <el-input type="textarea" v-model="form2.responCrossOpin" placeholder="请输入" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="申请人质证意见：" prop="applicaCrossOpin" :rules="[
-            {
-              required: true,
-              message: '请输入',
-              trigger: 'blur',
-            },
-          ]">
-            <el-input type="textarea" v-model="form2.applicaCrossOpin" placeholder="请输入" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="24">
-          <el-form-item label="被申请人的答辩意见：" prop="responDefenOpini" :rules="[
-            {
-              required: true,
-              message: '请输入',
-              trigger: 'blur',
-            },
-          ]">
-            <el-input type="textarea" v-model="form2.responDefenOpini" placeholder="请输入" />
-          </el-form-item>
-        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="submitForm" class="endbutton">
@@ -0,0 +1,60 @@
+<template>
+    <div>
+        <el-dialog title="案件流程" :visible="processVisable" @close="cancel" center :distroy-on-close="true">
+            <div>
+                <el-steps class="steps" :active="pageData.caseStatus">
+                    <el-step :title="item.caseNodeName || item.content" v-for="(item,index) in pageData.allCasenode" :description="(item.createNickName || '') + (item.caseNodeTime || '')"></el-step>
+                   
+                </el-steps>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+  
+<script>
+import {selectCaseProgress} from '@/api/caseManagement/caseManagement'
+export default {
+    props: ["processVisable","processData"],
+    data() {
+        return {
+            processId:null,
+            pageData:{}
+        };
+    },
+    watch: {
+        processVisable(val){
+            if(val){
+                this.processId = this.processData.id;
+                this.selectCaseProgressFn({id:this.processId});
+            }
+        }
+    },
+    methods: {
+        cancel() {
+            this.$emit("cancelViewProcess");
+        },
+        selectCaseProgressFn(data){
+            selectCaseProgress(data).then(res=>{
+                console.log(res,"请求成功");
+                this.pageData = res.data.data;
+            })
+        }
+    },
+};
+</script>
+  
+<style lang="scss" scoped>
+    .steps{
+        display: flex;
+        flex-wrap: wrap;
+    }
+    ::v-deep .el-step{
+        // width: 150px;
+        flex-basis:25% !important;
+        margin-right: 20px;
+        margin-bottom: 20px;
+    }
+</style>