1，动态步骤条组件。2，查询等接口页面优化

src/api/documentProduction.js

@@ -1,8 +1,16 @@
 import request from '@/utils/request'
 
-export function page(params) {
-    return request.get(`/production`,params)
+
+const docmentProduction = {
+
+    page(params) {
+        return request.get(`/production`,{params : params})
+    }
+    
+
 }
 
+export default docmentProduction;
+
 
 

src/api/fileUpload.js

@@ -6,4 +6,8 @@ export function uploadAssetsCalculateTmpl(params) {
 
 export function updateHouseGuarntyTargetTable(params) {
     return request.post('/file/house/guaranty/target',params)
+}
+
+export function downloadCollect1(){
+    return request.get(`/file/download/house/guaranty/collect1`)
 }

src/api/houseGuaranty.js

@@ -1,14 +1,23 @@
 import request from '@/utils/request'
 
-export function genConsignorLetter(params) {
-    return request.get(`/house/guaranty/consignor/${params}`)
-}
+const houseGuaranty = {
+    genConsignorLetter(params) {
+        return request.get(`/house/guaranty/consignor/${params}`)
+    },
 
-export function analysisCollect1(params) {
-    return request.get(`/house/guaranty/collect1/${params}`)
-}
+    analysisCollect1(params) {
+        return request.get(`/house/guaranty/collect1/${params}`)
+    },
+
+    genTargetsTableWord(params) {
+        return request.post(`/house/guaranty/targetTable`,params)
+    },
+    getProcessByDocId(params){
+        return request.get(`/house/guaranty/${params}`)
+    }
 
-export function genTargetsTableWord(params) {
-    return request.post("/house/guaranty/targetTable",params)
 }
 
+export default houseGuaranty
+
+

src/assets/base.css

@@ -176,6 +176,7 @@ body {
     color: #040000 !important;
     font-size: 16px;
   }
+
 }
 
 

src/components/Breadcrumb/index.vue

@@ -22,7 +22,6 @@
   const breadcrumbData = ref([]);
   const getBreadcrumbData = () => {
     breadcrumbData.value = route.matched.filter((item) => {
-      console.log(item)
       return item.meta && item.meta.title;
     });
   };

src/components/SheetView/index.vue

@@ -21,17 +21,36 @@
   export default {
     data() {
       return {
-        excelData: null,
-        fullScreenDialog:false
+        fullScreenDialog:false,
+        excelData:null
       };
     },
 
+    watch:{
+      targetsHtml:{
+        handler(nv){
+          this.excelData = nv;
+        },
+        immediate: true
+      }
+    },
+
     props:{
       uploadUrl:{
         type: String,
         Required:true
+      },
+      targetsHtml:{
+        type: String,
+        Required:false
       }
     },
+
+    created(){
+      setTimeout(()=>{
+        this.removeActAddress();
+      },500)
+    },
     methods: {
       readExcel(event) {
         this.excelData = null;
@@ -56,7 +75,7 @@
         updateHouseGuarntyTargetTable(fileData).then(res=>{
           if (res.code === 200){
             this.$emit('getUploadReture', res.data);
-            ElMessage.success({message:"表单上传成功.",plain:true})
+          //  ElMessage.success({message:"表单上传成功.",plain:true})
           }else{
             document.getElementById("upload").value= '';
           }
@@ -66,9 +85,12 @@
 
       removeActAddress(){
         const trs = document.getElementsByTagName("tr");
-        for (var i = 0 ; i<trs.length;i++){
-          const tds = trs[i].childNodes;
-          tds[tds.length-1].remove();
+        const td0 = trs[0].childNodes
+        if (td0[td0.length-1].textContent==='实勘地址'){
+          for (var i = 0 ; i<trs.length;i++){
+           const tds = trs[i].childNodes;
+           tds[tds.length-1].remove();
+          }
         }
       },
 

src/components/Steps/index.vue

@@ -0,0 +1,51 @@
+<template>
+    <el-dialog v-model="dialog"  width="700" align-center :show-close="false" >
+        <el-steps style="max-width: 700px;" :active="active" finish-status="success" align-center>
+            <el-step :title="s.name" v-for="(s ,index) in stepArray"/>
+        </el-steps>
+    </el-dialog>
+
+</template>
+
+<script>
+
+export default {
+
+    props:{
+        stepsDialogVisible:{
+            type: Boolean,
+            Required : true,
+        },
+
+        stepArray:{
+            type: Array,
+            required : true
+        }
+    },
+
+    watch:{
+        stepsDialogVisible:{
+            handler(nv){
+                this.dialog = nv;
+            },
+            immediate: true
+        }
+    },
+
+    data() {
+        return {
+            active: 0,
+            dialog:true
+        };
+    },
+
+    methods: {
+        next() {
+            if (this.active++ > this.stepArray.length-1) {
+                this.active = 0
+            }
+        }
+    }
+
+}
+</script>

src/components/SwichButton/index.vue

@@ -54,7 +54,7 @@ export default {
         },
         parentDo() {
             this.nextDo();
-            this.$router.push(this.nextPath);
+            //this.$router.push(this.nextPath);
         }
     }
 

src/layout/components/AppMain.vue

@@ -2,9 +2,7 @@
     <section class="app-main">
       <router-view v-slot="{ Component }">
         <transition>
-          <keep-alive>
             <component :is="Component" />
-          </keep-alive>
         </transition>
       </router-view>
     </section>

src/utils/file.js

@@ -0,0 +1,32 @@
+const fileUtil = {
+    EncodeGetUrl(url) {
+        let urlArr = url.split('?');
+        let encodeUrl = urlArr[0];
+    
+        if (urlArr.length > 1) {
+          encodeUrl += '?';
+          let paramArr = urlArr[1].split('&');
+          let encodeparamArr = [];
+          paramArr.forEach((item, index) => {
+            let key = item.split('=')[0];
+            let value = item.split('=')[1];
+            encodeparamArr.push(key + '=' + encodeURIComponent(value));
+          });
+    
+          encodeUrl += encodeparamArr.join('&');
+        }
+    
+        return encodeUrl;
+      },
+     
+      download(url) {
+        let downUrl = import.meta.env.VITE_BASE_URL + url;
+        downUrl = this.EncodeGetUrl(downUrl);
+        var a = document.createElement('a');
+        a.href = downUrl;
+        a.target = '_blank';
+        a.click();
+      },
+}
+
+export default fileUtil

src/views/home/index.vue

@@ -64,13 +64,13 @@
                 </button>
               </div>
               <div class="example-list">
-              <el-card class="report-item no-border" shadow="never" v-for="(doc,id) in page.records">
+              <el-card class="report-item no-border" shadow="never" v-for="(doc,id) in page">
                 <div class="report-icon">
                   <img :src="docLog(doc.docType)" style="width: 52px; height: 52px;"/>
                 </div>
                 <div class="report-text">
                   <div>
-                    <span class="report-text-type">{{doc.docNo}}</span>
+                    <span class="report-text-type">{{doc.businessType+doc.businessCate+'【'+doc.docNo+'】'}}</span>
                     <span> 一 </span>
                     <span class="report-text-name">{{ doc.docName }}</span>
                   </div>
@@ -101,6 +101,10 @@
               </el-card>
             </div>
           </div>
+          <div class="pagination">
+              <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154"
+              :page-count="listQuery.pages" v-model:current-page="listQuery.current" @current-change="getDocuments" />
+            </div>
       </div>
   </div>
 </template>
@@ -110,7 +114,7 @@ import { loginByOAInfo } from '@/api/user';
 import { setToken, getToken } from '@/utils/auth';
 import { mapStores } from 'pinia'
 import { useUserStore } from '@/stores/useUserStore';
-import { page } from '@/api/documentProduction';
+import documentProduction from '@/api/documentProduction';
 import wordLog from '../../assets/icons/word.png'
 import excelLog from '../../assets/icons/excel.png'
 import folderLog from '../../assets/icons/folder.png'
@@ -118,8 +122,12 @@ import folderLog from '../../assets/icons/folder.png'
 export default {
   data() {
     return {
-      page: {
-        records:[]
+      page:[],
+      listQuery:{
+          current: 1,
+          size: 10,
+          pages:null,
+          total:null
       }
     }
   },
@@ -147,9 +155,10 @@ export default {
     },
 
     getDocuments(){
-      page().then(res=>{
+      documentProduction.page(this.listQuery).then(res=>{
         if (res.code === 200){
-            this.page = res.data;
+            this.page = res.data.records;
+            this.listQuery.pages = res.data.pages;
         }
       })
     },
@@ -203,7 +212,6 @@ p {
   width: 58.5%;
   margin-top: 10px;
   margin-left: 160px;
-  height: 1000px;
   border-right: 1.5px #dae1eb solid;
   padding: 0px 20px 20px 20px;
 }
@@ -273,6 +281,13 @@ p {
   border: none;
   border-radius: 0.6em;
 }
+.pagination{
+  margin-top: 10px;
+  margin-left: 160px;
+  width: 58.5%;
+  justify-content: center;
+  display: flex;
+}
 </style>
 
 

src/views/house/folder/index.vue

@@ -7,9 +7,7 @@
         <section class="bench-main">
           <router-view v-slot="{ Component }">
             <transition>
-              <keep-alive>
                 <component :is="Component" />
-              </keep-alive>
             </transition>
           </router-view>
         </section>

src/views/house/folder/parent.vue

@@ -1,169 +1,268 @@
 <template>
-      <div class="contrl">
-        <div style="width: 95%;">
-          <div class="title-div">
-            <span>房地产工作台</span>
-          </div>
-        </div>
-        <!-- <div class="createNew-div" @click="createFolder" >
+  <div class="contrl">
+    <div style="width: 95%;">
+      <div class="title-div">
+        <span>房地产工作台</span>
+      </div>
+    </div>
+    <!-- <div class="createNew-div" @click="createFolder" >
             <img src="../../../assets/icons/folder.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
             <span style="margin-left: 10px;">新的项目</span>
             <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
           </div> -->
-        <div class="createNew-div" @click="createWord()">
-            <img src="../../../assets/icons/word.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
-            <span style="margin-left: 10px;">抵押类报告</span>
-            <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
-          </div>
-          <!-- <div class="createNew-div">
+    <div class="createNew-div" @click="createWord()">
+      <img src="../../../assets/icons/word.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
+      <span style="margin-left: 10px;">抵押类报告</span>
+      <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
+    </div>
+    <!-- <div class="createNew-div">
             <img src="../../../assets/icons/excel.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
             <span style="margin-left: 10px;">新的测算表</span>
             <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
           </div> -->
-        <el-tabs v-model="activeName" class="condtion-tabs" @tab-click="handleClick">
-          <el-tab-pane label="全部项目" name="all">
-            <div class="example-list">
-              <el-card class="report-item no-border" shadow="never" @click="nextFolder('自贡鑫景城实业有限公司开发建设的位于自贡市自流井区汇东路西段与汇兴路交叉口南侧中心城区D2-44-3地块(原汇西片区C1-03地块)4号楼在建工程（建筑物）抵押价值评估')">
-                <div class="report-icon">
-                  <img src="../../../assets/icons/folder.png" style="width: 52px; height: 52px;"/>
-                </div>
-                <div class="report-text">
-                  <div>
-                    <span class="report-text-type">房地产抵押类报告</span>
-                  </div>
-                  <div style="padding-top: 5px;">
-                    <span>
-                      <el-icon>
-                        <Avatar />
-                      </el-icon>
-                      成都中铁华府置业有限公司</span>
-                    <span>
-                      <el-tag style="margin-left: 5px;">
-                        房地产
-                      </el-tag>
-                      <el-tag style="margin-left: 5px;" type="success">
-                        抵押
-                      </el-tag>
-                    </span>
-                    <span style="float: right; color:darkgrey">
-                      2024-10-16 12:10:09
-                    </span>
-                  </div>
-                </div>
-              </el-card>
-              <el-card class="report-item no-border" shadow="never">
-                <div class="report-icon">
-                  <img src="../../../assets/icons/word.png" style="width: 52px; height: 52px;"/>
-                </div>
-                <div class="report-text">
-                  <span class="report-text-type">房地产咨询类报告</span>
-                  <span> 一 </span>
-                  <span
-                    class="report-text-name">自贡鑫景城实业有限公司开发建设的位于自贡市自流井区汇东路西段与汇兴路交叉口南侧中心城区D2-44-3地块(原汇西片区C1-03地块)4号楼在建工程（建筑物）抵押价值评估
-                  </span>
-                  <div style="margin-top: 5px;">
-                    <span>
-                      <el-icon>
-                        <Avatar />
-                      </el-icon>
-                      四川银行股份有限公司自贡分行</span>
-                    <span>
-                      <el-tag style="margin-left: 5px;">
-                        房地产
-                      </el-tag>
-                      <el-tag style="margin-left: 5px;" type="danger">
-                        咨询
-                      </el-tag>
-                    </span>
-                    <span style="float: right; color:darkgrey">
-                      2024-10-16 12:10:09
-                    </span>
-                  </div>
-                </div>
-                <div class="report-button">
+    <el-tabs v-model="activeName" class="condtion-tabs" @tab-click="handleClick">
+      <el-tab-pane label="全部项目" name="all">
+        <div class="example-list">
+          <el-card class="report-item no-border" shadow="never" v-for="(doc, id) in allPage">
+            <div class="report-icon">
+              <img :src="docLog(doc.docType)" style="width: 52px; height: 52px;" />
+            </div>
+            <div class="report-text">
+              <div>
+                <span class="report-text-type">{{ doc.businessType + doc.businessCate + '【' + doc.docNo + '】' }}</span>
+                <span> 一 </span>
+                <span class="report-text-name" @click="docDetail(doc.id)">{{ doc.docName }}</span>
+              </div>
+              <div style="padding-top: 5px;">
+                <span>
                   <el-icon>
-                    <Download />
+                    <Avatar />
                   </el-icon>
-                </div>
-              </el-card>
-              <el-card class="report-item no-border" shadow="never">
-                <div class="report-icon">
-                  <img src="../../../assets/icons/excel.png" style="width: 52px; height: 52px;"/>
-                </div>
-                <div class="report-text">
-                  <span class="report-text-type">房地产咨询类报告</span>
-                  <span> 一 </span>
-                  <span
-                    class="report-text-name">自贡鑫景城实业有限公司开发建设的位于自贡市自流井区汇东路西段与汇兴路交叉口南侧中心城区D2-44-3地块(原汇西片区C1-03地块)4号楼在建工程（建筑物）抵押价值评估
-                  </span>
-                  <div style="margin-top: 5px;">
-                    <span>
-                      <el-icon>
-                        <Avatar />
-                      </el-icon>
-                      四川银行股份有限公司自贡分行</span>
-                    <span>
-                      <el-tag style="margin-left: 5px;">
-                        房地产
-                      </el-tag>
-                      <el-tag style="margin-left: 5px;" type="danger">
-                        咨询
-                      </el-tag>
-                    </span>
-                    <span style="float: right; color:darkgrey">
-                      2024-10-16 12:10:09
-                    </span>
-                  </div>
-                </div>
-                <div class="report-button">
+                  {{ doc.consignor }}</span>
+                <span>
+                  <el-tag style="margin-left: 5px;">
+                    {{ doc.businessType }}
+                  </el-tag>
+                  <el-tag style="margin-left: 5px;" type="success">
+                    {{ doc.businessCate }}
+                  </el-tag>
+                </span>
+                <span style="float: right; color:darkgrey">
+                  {{ doc.updateTime }}
+                </span>
+              </div>
+            </div>
+            <div class="report-button">
+              <el-icon>
+                <Download />
+              </el-icon>
+            </div>
+          </el-card>
+        </div>
+        <div class="pagination">
+          <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154"
+            :page-count="listQuery1.pages" v-model:current-page="listQuery1.current" @current-change="getAllDocuments" />
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="进行中的项目" name="pending">
+        <div class="example-list">
+          <el-card class="report-item no-border" shadow="never" v-for="(doc, id) in allPage">
+            <div class="report-icon">
+              <img :src="docLog(doc.docType)" style="width: 52px; height: 52px;" />
+            </div>
+            <div class="report-text">
+              <div>
+                <span class="report-text-type">{{ doc.businessType + doc.businessCate + '【' + doc.docNo + '】' }}</span>
+                <span> 一 </span>
+                <span class="report-text-name">{{ doc.docName }}</span>
+              </div>
+              <div style="padding-top: 5px;">
+                <span>
                   <el-icon>
-                    <Download />
+                    <Avatar />
                   </el-icon>
-                </div>
-              </el-card>
+                  {{ doc.consignor }}</span>
+                <span>
+                  <el-tag style="margin-left: 5px;">
+                    {{ doc.businessType }}
+                  </el-tag>
+                  <el-tag style="margin-left: 5px;" type="success">
+                    {{ doc.businessCate }}
+                  </el-tag>
+                </span>
+                <span style="float: right; color:darkgrey">
+                  {{ doc.updateTime }}
+                </span>
+              </div>
+            </div>
+            <div class="report-button">
+              <el-icon>
+                <Download />
+              </el-icon>
             </div>
-          </el-tab-pane>
-          <el-tab-pane label="进行中的项目" name="pending">
-            <div class="null-div">
-              <img src="../../../assets/icons/null.png" style="width: 128px; height: 128px;" />
+          </el-card>
+        </div>
+        <div class="pagination">
+          <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154"
+            :page-count="listQuery1.pages" v-model:current-page="listQuery1.current" @current-change="getPendingDocuments" />
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="已完成的项目" name="finished">
+        <div class="example-list">
+          <el-card class="report-item no-border" shadow="never" v-for="(doc, id) in allPage">
+            <div class="report-icon">
+              <img :src="docLog(doc.docType)" style="width: 52px; height: 52px;" />
+            </div>
+            <div class="report-text">
               <div>
-                <span>还没有项目</span>
+                <span class="report-text-type">{{ doc.businessType + doc.businessCate + '【' + doc.docNo + '】' }}</span>
+                <span> 一 </span>
+                <span class="report-text-name">{{ doc.docName }}</span>
+              </div>
+              <div style="padding-top: 5px;">
+                <span>
+                  <el-icon>
+                    <Avatar />
+                  </el-icon>
+                  {{ doc.consignor }}</span>
+                <span>
+                  <el-tag style="margin-left: 5px;">
+                    {{ doc.businessType }}
+                  </el-tag>
+                  <el-tag style="margin-left: 5px;" type="success">
+                    {{ doc.businessCate }}
+                  </el-tag>
+                </span>
+                <span style="float: right; color:darkgrey">
+                  {{ doc.updateTime }}
+                </span>
               </div>
             </div>
-          </el-tab-pane>
-          <el-tab-pane label="已完成的项目" name="finished">Role</el-tab-pane>
-        </el-tabs>
-      </div>
+            <div class="report-button">
+              <el-icon>
+                <Download />
+              </el-icon>
+            </div>
+          </el-card>
+        </div>
+        <div class="pagination">
+          <el-pagination background layout="prev, pager, next" style="--el-color-primary: #ff6154"
+            :page-count="listQuery1.pages" v-model:current-page="listQuery1.current" @current-change="getFinishedDocuments" />
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>
 
 <script>
+import documentProduction from '@/api/documentProduction';
+import wordLog from '../../../assets/icons/word.png'
+import excelLog from '../../../assets/icons/excel.png'
+import folderLog from '../../../assets/icons/folder.png'
 export default {
   name: 'houseParent',
   data() {
     return {
       msg: 0,
-      activeName: 'all'
+      activeName: 'all',
+      allPage: [],
+      listQuery1: {
+        current: 1,
+        size: 10,
+        pages: null,
+        total: null,
+        state:null,
+      },
+      pendingPage: [],
+      listQuery2: {
+        current: 1,
+        size: 10,
+        pages: null,
+        total: null,
+        state:0
+      },
+      finshedPage: [],
+      listQuery3: {
+        current: 1,
+        size: 10,
+        pages: null,
+        total: null,
+        state:1
+      }
     }
   },
 
+  created() {
+    this.getAllDocuments();
+  },
+
   methods: {
     createWord() {
       this.$router.push('/home/houseWorkbench/consignor')
     },
-    nextFolder(folderName){
-      this.$router.push({path:'/home/house/folder',query:{'folderName':folderName}})
+    nextFolder(folderName) {
+      this.$router.push({ path: '/home/house/folder', query: { 'folderName': folderName } })
     },
-    createFolder(){
+    createFolder() {
       ElMessageBox.prompt('请输入项目文件夹名称', '', {
-      confirmButtonText: '创建',
-      cancelButtonText: '取消',
-    })
-      .then(({ value }) => {
-        ElMessage({
-          type: 'success',
-          message: `Your email is:${value}`,
+        confirmButtonText: '创建',
+        cancelButtonText: '取消',
+      })
+        .then(({ value }) => {
+          ElMessage({
+            type: 'success',
+            message: `Your email is:${value}`,
+          })
         })
+    },
+
+    handleClick(tab){
+      if(tab.props.name==='pending'){
+        this.getPendingDocuments();
+      }
+      if (tab.props.name==='finished'){
+        this.getFinishedDocuments();
+      }
+      if (tab.props.name === 'all'){
+        this.getAllDocuments();
+      }
+    },
+    getAllDocuments() {
+      documentProduction.page(this.listQuery1).then(res => {
+        if (res.code === 200) {
+          this.allPage = res.data.records;
+          this.listQuery1.pages = res.data.pages;
+        }
       })
+    },
+    getPendingDocuments() {
+      documentProduction.page(this.listQuery2).then(res => {
+        if (res.code === 200) {
+          this.pendingPage = res.data.records;
+          this.listQuery2.pages = res.data.pages;
+        }
+      })
+    },
+    getFinishedDocuments() {
+      documentProduction.page(this.listQuery3).then(res => {
+        if (res.code === 200) {
+          this.finshedPage = res.data.records;
+          this.listQuery3.pages = res.data.pages;
+        }
+      })
+    },
+    docLog(docType) {
+      switch (docType) {
+        case 'CALCULATE_TABLE':
+          return excelLog;
+        case 'FOLDER':
+          return folderLog;
+        default:
+          return wordLog;
+      }
+    },
+    docDetail(id){
+      this.$router.push({path:"/home/houseWorkbench/consignor",query:{'id':id}})
     }
   }
 }
@@ -247,10 +346,20 @@ export default {
   margin-top: 20%;
   color: var(--vt-c-text-light-2);
 }
+
 .no-border {
   border: none;
 }
+
 .no-border:hover {
   cursor: pointer;
 }
+
+.pagination {
+  margin-top: 10px;
+  margin-left: 160px;
+  width: 58.5%;
+  justify-content: center;
+  display: flex;
+}
 </style>

src/views/house/workbench/components/bench.vue

@@ -2,9 +2,7 @@
     <section class="bench-main">
       <router-view v-slot="{ Component }">
         <transition>
-          <keep-alive>
             <component :is="Component" />
-          </keep-alive>
         </transition>
       </router-view>
     </section>

src/views/house/workbench/consignor.vue

@@ -1,115 +1,164 @@
 <template>
     <div class="contrl">
         <div style="width: 95%;">
-          <div class="title-div">
-            <span>上传估价结果一览表-表单</span>
-          </div>
+            <div class="title-div">
+                <span>上传估价结果一览表-表单</span>
+            </div>
         </div>
         <div class="download-btn">
-            <img src="../../../assets/icons/form.png" style="width: 26px; height: 26px; float: left; margin-top: 27px;" />
-            <span class="form-name">估价结果一览表-表单.xlsx</span>
+            <img src="../../../assets/icons/form.png"
+                style="width: 26px; height: 26px; float: left; margin-top: 27px;" />
+                <el-tooltip content="点击下载" effect="light" placement="top">
+                    <span class="form-name" @click="downloadCollect1">估价结果一览表-表单.xlsx</span>
+                </el-tooltip>
         </div>
-        
+
         <div class="target-windows">
-            <SheetView :uploadUrl="'/api/file/house/guaranty/target'" @getExcelDate="excelDate" @getUploadReture="uploadReture"></SheetView>
+            <SheetView :uploadUrl="'/api/file/house/guaranty/target'" @getExcelDate="excelDate"
+                @getUploadReture="uploadReture" v-model:targetsHtml="process.targetsHtml"></SheetView>
         </div>
-         <SwitchButton :nextPath="nextPath" :nextDo="genarate"></SwitchButton>
-        
+        <SwitchButton :nextPath="nextPath" :nextDo="genarate"></SwitchButton>
+        <Steps :stepArray="stepArray" ref="steps" :stepsDialogVisible="stepDialog"></Steps>
     </div>
 </template>
 
 <script>
-import  SwitchButton from '../../../components/SwichButton/index.vue'
-import  SheetView from '../../../components/SheetView/index.vue'
-import { genConsignorLetter,genTargetsTableWord,analysisCollect1 } from '@/api/houseGuaranty.js';
-
- export default {
-    components:{
+import SwitchButton from '../../../components/SwichButton/index.vue'
+import SheetView from '../../../components/SheetView/index.vue'
+import houseGuarantyfrom from '@/api/houseGuaranty';
+import { downloadCollect1 } from '@/api/fileUpload'
+import fileUtil from '@/utils/file'
+ import Steps from '../../../components/Steps/index.vue'
+
+export default {
+    components: {
         SwitchButton,
-        SheetView
+        SheetView,
+        Steps
     },
+
     data() {
         return {
-            nextPath:'/home/houseWorkbench/certificate',
-            excelHtml:null,
-            upload:null,
-            processId:null
+            nextPath: '/home/houseWorkbench/certificate',
+            excelHtml: null,
+            upload: null,
+            processId: null,
+            docId: null,
+            process:{
+                id:null,
+                home:null,
+                targetsHtml:null,
+                createdTime:null,
+                updateTime:null
+            },
+            stepDialog:false,
+            stepArray:[
+                {name:'上传表单'},
+                {name:'解析估价对象一览表'},
+                {name:'生成致委托人函'},
+                {name:'完成'}
+          ]
         }
     },
 
-    methods:{
-        genConsignorLetter(id){
-            genConsignorLetter(id).then(res=>{
+    created() {
+        this.docId = this.$route.query.id;
+        this.getProcess();
+    },
+
+    methods: {
+        genConsignorLetter(id) {
+            houseGuarantyfrom.genConsignorLetter(id).then(res => {
                 ElMessage({
-                    message:'致委托人函已生成',
+                    message: '致委托人函已生成',
                     type: 'success',
                     plain: true
                 })
             })
-       },
+        },
 
-       excelDate(data){
+        excelDate(data) {
             this.excelHtml = data;
-       },
+        },
 
-       uploadReture(data){
+        uploadReture(data) {
             this.upload = data;
             //this.genTargetTableWord(this.excelHtml,data.filePath);
-       },
+        },
 
-       genTargetTableWord(excelData,homePath){
-            if (excelData && homePath){
+        genTargetTableWord(excelData, homePath) {
+            if (excelData && homePath) {
                 const param = new Object();
                 param.html = excelData;
                 param.homePath = homePath;
-                genTargetsTableWord(param).then(res =>{
-                    if (res.code === 200){
-                        this.processId= res.data;
+                houseGuarantyfrom.genTargetsTableWord(param).then(res => {
+                    if (res.code === 200) {
+                        this.processId = res.data;
                     }
                 })
-                
+
             }
-       },
+        },
 
-        analysisExcel(id){
-            analysisCollect1(id).then(res=>{
-                if (res.code === 200){
+        analysisExcel(id) {
+            houseGuarantyfrom.analysisCollect1(id).then(res => {
+                if (res.code === 200) {
                     this.genConsignorLetter(id);
                 }
             })
         },
 
-        async genarate(){
-            if (this.excelHtml && this.upload){
-                    const param = new Object();
-                    param.html = this.excelHtml;
-                    param.homePath = this.upload.filePath;
-                    await genTargetsTableWord(param).then(res =>{
-                        if (res.code === 200){
-                            this.processId= res.data;
-                        }
-                    })
-                    await analysisCollect1(this.processId).then(res=>{
-                        if (res.code === 200){
-                            
-                        }
-                    })
-                    genConsignorLetter(this.processId).then(res=>{
-                        if (res.code === 200){
-                            ElMessage({
-                                message:'致委托人函已生成',
-                                type: 'success',
-                                plain: true
-                            })
-                        }
-                       
-                    })
-                }
-        }
+        async genarate() {
+            this.stepDialog = true;
+            if (this.excelHtml && this.upload) {
+                const param = new Object();
+                param.html = this.excelHtml;
+                param.homePath = this.upload.filePath;
+                await houseGuarantyfrom.genTargetsTableWord(param).then(res => {
+                    if (res.code === 200) {
+                        this.processId = res.data;
+                        this.$refs.steps.next()
+                    }
+                    
+                })
+                await houseGuarantyfrom.analysisCollect1(this.processId).then(res => {
+                    if (res.code === 200) {
+                        this.$refs.steps.next()
+                    }
+                })
+                await houseGuarantyfrom.genConsignorLetter(this.processId).then(res => {
+                    if (res.code === 200) {
+                        ElMessage({
+                            message: '致委托人函已生成',
+                            type: 'success',
+                            plain: true
+                        })
+                        this.$refs.steps.next()
+                    }
 
+                })
+            }
+            setTimeout(()=>{
+                this.$refs.steps.next();
+            },500)
+            
+        },
 
+        getProcess(){
+            if (this.docId){
+                houseGuarantyfrom.getProcessByDocId(this.docId).then(res=>{
+                    if (res.code === 200){
+                        this.process = res.data;
+                    }
+                })
+            }
+        },
+
+        downloadCollect1(){
+            fileUtil.download("/file/download/house/guaranty/collect1");
+        }
     }
- }
+}
 
 
 </script>
@@ -125,27 +174,28 @@ import { genConsignorLetter,genTargetsTableWord,analysisCollect1 } from '@/api/h
 }
 
 :deep(.el-input__wrapper.is-focus) {
-  --el-input-focus-border: #ff6154;
-  --el-input-focus-border-color:#ff6154;
+    --el-input-focus-border: #ff6154;
+    --el-input-focus-border-color: #ff6154;
 }
 
-.target-windows{
+.target-windows {
     margin-top: 80px;
-    overflow-y: scroll; 
+    overflow-y: scroll;
     padding: 5px;
     border: 1.5px #dae1eb solid;
     border-radius: 0.3em;
 }
 
-.download-btn{
+.download-btn {
     height: 80px;
     line-height: 80px;
     float: right;
     margin-left: 20px;
 }
-.form-name{
-    margin-left: 5px; 
-    font-size: 16px; 
+
+.form-name {
+    margin-left: 5px;
+    font-size: 16px;
     text-decoration: underline;
 }
 
@@ -155,11 +205,11 @@ import { genConsignorLetter,genTargetsTableWord,analysisCollect1 } from '@/api/h
 }
 
 .title-div {
-  height: 80px;
-  line-height: 80px;
-  width: 300px;
-  float: left;
-  font-size: 20px;
-  font-weight: 900;
+    height: 80px;
+    line-height: 80px;
+    width: 300px;
+    float: left;
+    font-size: 20px;
+    font-weight: 900;
 }
 </style>

src/views/house/workbench/index.vue

@@ -13,12 +13,13 @@
   <script>
    import Breadcrumb from '../../../components/Breadcrumb/index.vue'
    import { Timeline, Bench } from "./components";
+
     export default {
       name:'houseWorkBench',
       components:{
         Breadcrumb,
         Bench,
-        Timeline
+        Timeline,
       },
       data() {
         return {
@@ -29,7 +30,7 @@
               legalPerson:null,
               legalCode:null
           },
-          activeName:'consignor'
+          activeName:'consignor',
         }
       }
     }