链接签收跳转开发与接口联调

src/api/home.js

 import axios from "@/utils/request";
 let baseUrlZc = 'https://api.xayunmei.com/zhongcaiapi';
-let baseUrl = 'https://api.xayunmei.com/tiaojieapi';
-// let baseUrl = 'http://172.16.1.4:6001';
+// let baseUrl = 'https://api.xayunmei.com/tiaojieapi';
+let baseUrl = 'http://172.16.1.26:6001';
 // 获取usersig
 export function getUsersig(userId) {
     let appType = sessionStorage.getItem('type');
 //根据id查询密文信息
 export function getEncryptInfoByid(caseId) {
         return axios.get(`${baseUrl}/shortMessage/getMeetingInfo?authId=${caseId}`);
-}
+}
+// 案件列表
+export function caseApplicationList(param) {
+    return axios.get(`${baseUrl}/caseApplication/list?caseId=${param}`);
+  }
+// 签收案件
+export function msCaseSign(data) {
+        return axios.post(`${baseUrl}/mssignSeal/msCaseSign`, data);
+}
+//根据案件id获取附件
+export function fileList(caseAppliId,annexTypeList) {
+    return axios.get(`${baseUrl}/common/fileList?caseAppliId=${caseAppliId}&annexTypeList=${annexTypeList}`);
+  }

src/router/index.js

         name:"onlyOffice",
         component:()=>import("../views/onlyOffice.vue"),
         meta:{title:"在线文档"}
+      },
+      {
+        path:"/signFor",
+        name:"signFor",
+        component:()=>import("../views/signFor.vue"),
+        meta:{title:"在线签收"}
       }
 ]
 

src/utils/request.js

 server.interceptors.request.use(config => {
     // config包含了请求相关的所有信息
     // 可以同过config对象给请求配置或者修改信息
-    config.headers.Authorization = sessionStorage.getItem('token');
+    config.headers.Authorization = 'Bearer ' + sessionStorage.getItem('token');
     return config // 将配置完成的token返回 如果不返回 请求不会继续进行
 }, err => {
     // 请求发生错误时的回调函数

src/views/room.vue

 <template>
-    <div class="page">
-        <div class="roompage" @mouseover="mouseHover" v-if="modileFlag">
-            <div class="txtContent">
-                <el-tag type="danger" @click="txtContent">会议内容</el-tag>
-            </div>
-            <div :class="userClass" :style="{ height: userHeight }" id="localStream">
-                <div class="userName">{{ userId }}</div>
-            </div>
-            <div :class="userClass" :style="{ height: userHeight }" v-for="(item, index) in userList" :key="index"
-                :id="item">
-                <div class="userName">{{ item }}</div>
-            </div>
-            <div class="footer">
-                <roomFooter @exitRoom="exitRoom" :roomId="roomId"></roomFooter>
-            </div>
-        </div>
-        <div class="roomPhone" v-if="!modileFlag">
-            <div class="header">
-                <roomFooterPhone @exitRoom="exitRoom"></roomFooterPhone>
-            </div>
-            <div class="bodyVideo">
-                <div :class="userClassPhone" id="localStream">
-                    <div class="userNamePhone">{{ userId }}</div>
-                </div>
-                <div :class="userClassPhone" v-for="(item, index) in userList" :key="index" :id="item">
-                    <div class="userNamePhone">{{ item }}</div>
-                </div>
-            </div>
-        </div>
-        <!-- 语音转文字弹窗 -->
-        <el-drawer title="会议内容" :visible.sync="textVisible" :modal="false">
-            <quill-editor ref="myQuillEditor" v-model="contentValue" :options="editorOption" @blur="onEditorBlur($event)"
-                @focus="onEditorFocus($event)" @ready="onEditorReady($event)"></quill-editor>
-            <el-button class="updataBtn" @click="updataClick" type="primary" :disabled="!updataFlag">确认修改内容</el-button>
-        </el-drawer>
+  <div class="page">
+    <div class="roompage" @mouseover="mouseHover" v-if="modileFlag">
+      <div class="txtContent">
+        <el-tag type="danger" @click="txtContent">会议内容</el-tag>
+      </div>
+      <div :class="userClass" :style="{ height: userHeight }" id="localStream">
+        <div class="userName">{{ userId }}</div>
+      </div>
+      <div :class="userClass" :style="{ height: userHeight }" v-for="(item, index) in userList" :key="index" :id="item">
+        <div class="userName">{{ item }}</div>
+      </div>
+      <div class="footer">
+        <roomFooter @exitRoom="exitRoom" :roomId="roomId"></roomFooter>
+      </div>
     </div>
     <div class="roomPhone" v-if="!modileFlag">
       <div class="header">
         <div :class="userClassPhone" id="localStream">
           <div class="userNamePhone">{{ userId }}</div>
         </div>
-        <div
-          :class="userClassPhone"
-          v-for="(item, index) in userList"
-          :key="index"
-          :id="item"
-        >
+        <div :class="userClassPhone" v-for="(item, index) in userList" :key="index" :id="item">
           <div class="userNamePhone">{{ item }}</div>
         </div>
       </div>
     <!-- 语音转文字弹窗 -->
     <el-drawer title="会议内容" :visible.sync="textVisible" :modal="false">
       <div style="margin-left: 20px; margin-bottom: 10px">
-        <div
-          style="
+        <div style="
             width: 100%;
             display: flex;
             justify-content: space-around;
             margin-bottom: 10px;
-          "
-        >
-          <el-upload
-            ref="upload"
-            :limit="1"
-            action="https://api.xayunmei.com/tiaojieapi/video/upload"
-            :headers="headers"
-            :data="filedata"
-            :on-change="beforeUpload"
-            :on-success="handlSuccess"
-            :file-list="fileList"
-            v-if="appFlag"
-          >
-            <el-button slot="trigger" size="small" type="primary"
-              >申请人上传证据</el-button
-            >
+          ">
+          <el-upload ref="upload" :limit="1" action="https://api.xayunmei.com/tiaojieapi/video/upload"
+            :headers="headers" :data="filedata" :on-change="beforeUpload" :on-success="handlSuccess"
+            :file-list="fileList" v-if="appFlag">
+            <el-button slot="trigger" size="small" type="primary">申请人上传证据</el-button>
           </el-upload>
-          <el-upload
-            v-if="resFlag"
-            ref="upload1"
-            :limit="1"
-            action="https://api.xayunmei.com/tiaojieapi/video/upload"
-            :headers="headers1"
-            :data="filedata1"
-            :on-change="beforeUpload1"
-            :on-success="handlSuccess1"
-            :file-list="fileList1"
-          >
-            <el-button slot="trigger" size="small" type="primary"
-              >被申请人上传证据</el-button
-            >
+          <el-upload v-if="resFlag" ref="upload1" :limit="1" action="https://api.xayunmei.com/tiaojieapi/video/upload"
+            :headers="headers1" :data="filedata1" :on-change="beforeUpload1" :on-success="handlSuccess1"
+            :file-list="fileList1">
+            <el-button slot="trigger" size="small" type="primary">被申请人上传证据</el-button>
           </el-upload>
-          <el-upload
-            v-if="editFlag"
-            ref="upload3"
-            :limit="1"
-            action="https://api.xayunmei.com/tiaojieapi/video/upload"
-            :headers="headers3"
-            :data="filedata3"
-            :on-change="beforeUpload3"
-            :on-success="handlSuccess3"
-            :file-list="fileList3"
-            accept=".doc,.docx"
-          >
-            <el-button slot="trigger" size="small" type="primary"
-              >上传调解书</el-button
-            >
+          <el-upload v-if="editFlag" ref="upload3" :limit="1" action="https://api.xayunmei.com/tiaojieapi/video/upload"
+            :headers="headers3" :data="filedata3" :on-change="beforeUpload3" :on-success="handlSuccess3"
+            :file-list="fileList3" accept=".doc,.docx">
+            <el-button slot="trigger" size="small" type="primary">上传调解书</el-button>
           </el-upload>
         </div>
         <div class="list">
           <div class="applicant" v-if="applicantFile.length > 0">
             <div>申请人证据</div>
-            <div
-              style="color: #104fad; cursor: pointer"
-              v-for="(item, index) in applicantFile"
-              :key="index"
-              @click="preview(item,0)"
-            >
+            <div style="color: #104fad; cursor: pointer" v-for="(item, index) in applicantFile" :key="index"
+              @click="preview(item, 0)">
               {{ item.annexName }}
             </div>
           </div>
           <div class="res" v-if="resFile.length > 0">
             <div>被申请人证据</div>
-            <div
-              style="color: #104fad; cursor: pointer"
-              v-for="(item, index) in resFile"
-              :key="index"
-              @click="preview(item,0)"
-            >
+            <div style="color: #104fad; cursor: pointer" v-for="(item, index) in resFile" :key="index"
+              @click="preview(item, 0)">
               {{ item.annexName }}
             </div>
           </div>
           <div class="mediate" v-if="mediateFile.length > 0">
             <div>调解书</div>
-            <div
-              style="color: #104fad; cursor: pointer"
-              v-for="(item, index) in mediateFile"
-              :key="index"
-              @click="preview(item,1)"
-            >
+            <div style="color: #104fad; cursor: pointer" v-for="(item, index) in mediateFile" :key="index"
+              @click="preview(item, 1)">
               {{ item.annexName }}
             </div>
           </div>
         </div>
       </div>
-      <quill-editor
-        ref="myQuillEditor"
-        v-model="contentValue"
-        :options="editorOption"
-        @blur="onEditorBlur($event)"
-        @focus="onEditorFocus($event)"
-        @ready="onEditorReady($event)"
-      ></quill-editor>
-      <el-button
-        class="updataBtn"
-        @click="updataClick"
-        type="primary"
-        :disabled="!updataFlag"
-        >确认修改内容</el-button
-      >
+      <quill-editor ref="myQuillEditor" v-model="contentValue" :options="editorOption" @blur="onEditorBlur($event)"
+        @focus="onEditorFocus($event)" @ready="onEditorReady($event)"></quill-editor>
+      <el-button class="updataBtn" @click="updataClick" type="primary" :disabled="!updataFlag">确认修改内容</el-button>
     </el-drawer>
+  </div>
 </template>
-  
+
 <script>
 import { getUsersig, reserveConferenceList } from "@/api/home";
 import {
       token: "",
       applicantFile: [],
       resFile: [],
-      mediateFile:[],
+      mediateFile: [],
       headers: {
         // Authorization: "Bearer " + token,
         Authorization: "",
       this.$refs.upload3.clearFiles();
       this.selectByIdFn(this.caseId);
     },
-    preview(item,flag) {
+    preview(item, flag) {
       if (item.onlyOfficeFileId) {
         this.$router.push({
           path: "/onlyoffice",
-          query: { id: item.onlyOfficeFileId,flag:flag },
+          query: { id: item.onlyOfficeFileId, flag: flag },
         });
       } else {
         window.open(
             this.applicantFile.push(item);
           } else if (item.annexType == 12) {
             this.resFile.push(item);
-          }else if (item.annexType == 7){
+          } else if (item.annexType == 7) {
             this.mediateFile.push(item)
           }
         });
   },
 };
 </script>
-  
+
 <style scoped>
 .roompage {
   width: 100%;
   position: absolute;
   bottom: 8px;
 }
+
 .fileList {
   /* max-height: 300px; */
   /* overflow-y: scroll; */
 }
+
 .list {
   display: flex;
   flex-wrap: wrap;
 }
+
 .applicant,
 .res,
 .mediate {
   margin-bottom: 10px;
   color: #38393b;
 }
-</style>
-  
-  
-  
+</style>

src/views/signFor.vue

+<template>
+    <div class="signFor">
+        <div>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>案件编号</div></el-col>
+                <el-col :span="16"><div>{{ dataList.caseNum }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>申请人</div></el-col>
+                <el-col :span="16"><div>{{ dataList.applicationName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>被申请人</div></el-col>
+                <el-col :span="16"><div>{{ dataList.respondentName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>调解员</div></el-col>
+                <el-col :span="16"><div>{{ dataList.mediatorName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>调解方式</div></el-col>
+                <el-col :span="16"><div>{{ dataList.mediationMethodName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>调解时间</div></el-col>
+                <el-col :span="16"><div>{{ dataList.hearDate }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>案件状态</div></el-col>
+                <el-col :span="16"><div>{{ dataList.caseStatusName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="8"><div>创建时间</div></el-col>
+                <el-col :span="16"><div>{{ dataList.createTime }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row style="height: 40px;line-height: 40px;text-align: center;">
+                <el-col :span="7"><div>调解书</div></el-col>
+                <el-col :span="15"><div v-for="(item,index) in fileList" :key="index" style="color: blue; cursor: pointer"  @click="toPreview(item.annexPath)">{{ item.annexName }}</div></el-col>
+            </el-row>
+            <hr>
+            <el-row>
+                <el-col :span="24">
+                    <div style="width: 90px; margin: 30px auto;">
+                        <el-button type="primary" @click="getMsCaseSign(caseId)" v-if="showSign" icon="el-icon-edit">签收</el-button>
+                    </div>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+    
+</template>
+
+<script>
+import { getEncryptInfoByid,caseApplicationList,msCaseSign,fileList } from "@/api/home";
+export default {
+    name: "signFor",
+    components: {},
+    data() {
+        return {
+            dataList: [],
+            loading: false,
+            token:'',
+            caseId:'',
+            showSign:true,
+            fileURL: 'http://121.40.189.20:8002' + "/API",
+            fileList:[]
+
+        };
+    },
+    created() {
+        console.log(this.fileURL)
+    },
+    methods: {
+        /**获取链接参数 */
+        async getEncryptInfoByidFn(data) {
+            await getEncryptInfoByid(data).then((res) => {
+                this.caseId = res.caseId
+                sessionStorage.setItem('token',res.token)
+            });
+        },
+        // 获取案件列表
+        async getList(params){
+            await caseApplicationList(params).then(res =>{
+                res.rows.forEach(item => {
+                    this.dataList = item;
+                });
+            })
+        },
+        // 案件签收
+        async getMsCaseSign(params){
+            console.log(params)
+            let caseIds = {
+                caseId:params
+            }
+            await msCaseSign(caseIds).then(res =>{
+                console.log(res)
+                this.$message({
+                    message: '签收成功',
+                    type: 'success'
+                });
+                this.showSign = false
+            })
+        },
+        // 查看附件
+        async getFileList(caseAppliIds,annexTypeList){
+            fileList(caseAppliIds,annexTypeList).then(res=>{
+                this.fileList = res.data;
+                console.log(this.fileList)
+            })
+        },
+        toPreview(val){
+            console.log(val)
+            window.open(this.fileURL + val)
+        }
+    },
+    async mounted() {
+        let routeParams = this.$route.query;
+        await this.getEncryptInfoByidFn(routeParams.authId)
+        await this.getList(this.caseId)
+        // await this.getList("5461248676208928")
+        let caseAppliIds = this.caseId
+        let annexTypeList = 7
+        await this.getFileList(caseAppliIds,annexTypeList)
+    }
+};
+</script>
+
+<style scoped>
+    .signFor{
+        margin-top: 30px;
+        width: 100%;
+    }
+</style>