项目列表优化接口调用

src/api/manager/projectinfo.js

@@ -20,7 +20,14 @@ export const getProjectList = (current, size, params) => {
         }
     })
 }
-
+//项目列表分页接口
+export const getProjectListPage = (form) => {
+    return request({
+        url: '/api/blade-manager/projectInfo/pageList',
+        method: 'get',
+        params:form
+    })
+}
 
 //获取合同段信息
 export const getProjectDeatil2 = (id) => {
@@ -141,3 +148,36 @@ export const treeAllConstruction = (params) => {
         params
     })
 }
+//收藏项目接口
+export const collectProject = (obj) => {
+    return request({
+        url: '/api/blade-manager/projectInfo/collectProject',
+        method: 'post',
+        params: obj
+    })
+}
+
+//所有项目排序
+export const sortProject = (obj) => {
+    return request({
+        url: '/api/blade-manager/projectInfo/sortProject',
+        method: 'post',
+        data: obj
+    })
+}
+//收藏项目排序
+export const sortProjectCollect = (obj) => {
+    return request({
+        url: '/api/blade-manager/projectInfo/sortProjectCollect',
+        method: 'post',
+        data: obj
+    })
+}
+//合同段排序
+export const sortContract = (obj) => {
+    return request({
+        url: '/api/blade-manager/contractInfo/sort',
+        method: 'post',
+        data: obj
+    })
+}

src/views/manager/projectinfo/ContractSort.vue

@@ -87,6 +87,10 @@ export default {
       type: String,
       default: '排序'
     },
+    sortProLoad: { // 接收父组件传递的 sortProLoad 状态
+      type: Boolean,
+      default: false,
+    },
    
   },
   data() {

src/views/manager/projectinfo/list.vue

@@ -9,9 +9,9 @@
       <el-button type="primary" @click="searchChange" class="custom-primary-btn" size="small">查询</el-button>
     </div>
     <div class="ml-10">
-      <el-select v-model="searchForm.type" placeholder="项目状态" style="width: 120px;" size="small">
+      <el-select v-model="searchForm.status" placeholder="项目状态" style="width: 120px;" size="small" clearable>
         <el-option
-          v-for="item in typeOptions"
+          v-for="item in proStatusItems"
           :key="item.value"
           :label="item.label"
           :value="item.value">
@@ -19,7 +19,7 @@
       </el-select>
     </div>
     <div class="ml-10">
-      <el-select v-model="searchForm.type" placeholder="默认排序" style="width: 120px;" size="small">
+      <el-select v-model="searchForm.sort" placeholder="默认排序" style="width: 120px;" size="small" clearable>
         <el-option
           v-for="item in sortOptions"
           :key="item.value"
@@ -31,33 +31,37 @@
     <div class="ml-10">
       <el-button type="warning" icon="el-icon-sort" size="small" @click="sortPro">排序</el-button>
     </div>
-    <div class="ml-10">
-      <el-button type="warning" icon="el-icon-star-off" size="small" class="custom-primary-btn">收藏夹</el-button>
+    <div class="ml-10" @click="searchByCollect">
+      <el-button type="warning" icon="el-icon-star-off" size="small" class="custom-primary-btn" v-if="!searchForm.isCollect">收藏夹</el-button>
+       <el-button type="success" icon="el-icon-arrow-left" size="small" v-else>所有项目</el-button>
     </div>
   </el-header>
   
   <el-main class="main-box">
-    <div class="project-list-container">
+    <div class="project-list-container" v-if="projectPageList.length>0" v-loading="getPageLoading">
     
-      <el-card class="project-card" shadow="hover"  v-for="item in projectPageList"
+      <el-card class="project-card"   v-for="item in projectPageList"
             :key="item.id">
         <div class="project-top">
-          <div class="project-tag">
-             <el-tag
-              size="small"
-              v-for="item in tagItems"
-              :key="item.label"
-              :type="item.type"
-              effect="dark"
-              class="mr-3 custom-ellipse-tag"
-               :class="`custom-tag-type-${item.type}`"
-              >
-              <i class=" el-icon-success"></i>
-              {{ item.label }}
-            </el-tag>
+          <div class="project-tag" >
+             <template v-if="item.wbsTypes.length>0 " >
+              <el-tag
+                  size="small"
+                  v-for="item in generateTagItems(item.wbsTypes)"
+                  :key="item.label"
+                  :type="item.type"
+                  effect="dark"
+                  class="mr-3 custom-ellipse-tag"
+                  :class="`custom-tag-type-${item.type}`"
+                  >
+                  <i class=" el-icon-success"></i>
+                  {{ item.label }}
+                </el-tag>
+             </template>
+              <el-tag type="info"effect="dark" v-else class="custom-ellipse-tag">未关联WBS</el-tag>
           </div>
-          <div class="project-like">
-            <i class="el-icon-star-on"  v-if="item.isLiked"     @click="toggleLike(item)"></i>
+          <div class="project-like" @click="toggleLike(item)" v-loading="item.load">
+            <i class="el-icon-star-on"  v-if="item.isCollect"    style="color: red;" ></i>
             <i class="el-icon-star-off" v-else></i>
           </div>
         </div>
@@ -72,9 +76,9 @@
             <span v-else>{{ item.projectAlias }}</span>
           </div>
         <div class="project-info">
-          <div><span class="info-label"><i class="el-icon-user"></i>负责人：</span>李田</div>
-          <div><span class="info-label"><i class="el-icon-edit-outline"></i>电签类别：</span>安心签</div>
-          <div><span class="info-label"><i class="el-icon-coordinate"></i>电签方式：</span>流程审批</div>
+          <div><span class="info-label"><i class="el-icon-user"></i>负责人：</span>{{ item.projectLeaderName }}</div>
+          <div><span class="info-label"><i class="el-icon-edit-outline"></i>电签类别：</span>{{ item.remarkType===1?'安心签':'东方中讯' }}</div>
+          <div><span class="info-label"><i class="el-icon-coordinate"></i>电签方式：</span>{{ item.approvalType===1?'垂直审批':'平行审批' }}</div>
         </div>
         <div class="project-actions">
           <el-link type="primary" size="small" @click="projectClick(item)">
@@ -82,8 +86,17 @@
             查看详情 <i class="el-icon-right"></i>
           </el-link>
          
-         <el-tag  size="small" type="danger"   class="custom-ellipse-tag1"   >进行中</el-tag>
-
+    
+        <el-tag
+                v-for="status in proStatusItems"
+                :key="status.value"
+                :type="status.type"
+                size="small"
+                class="custom-ellipse-tag1"
+                v-if="status.value === item.projectStatus"
+              >
+                {{ status.label }}
+         </el-tag>
         </div>
       </el-card>
       
@@ -91,6 +104,7 @@
       
       <!-- 其他项目卡片... -->
     </div>
+    <el-empty description="暂无数据" v-else ></el-empty>
   </el-main>
   
   <el-footer class="footer-box">
@@ -117,7 +131,17 @@
             <i class="el-icon-s-cooperation" style="color: #2550A2;"></i>项目信息
           </span>
           <div class="mg-b-15">
-          <el-tag  size="small" type="danger"   class="custom-ellipse-tag1"   >进行中</el-tag>
+          <!-- <el-tag  size="small" type="danger"   class="custom-ellipse-tag1"   >进行中</el-tag> -->
+             <el-tag
+                v-for="status in proStatusItems"
+                :key="status.value"
+                :type="status.type"
+                size="small"
+                class="custom-ellipse-tag1"
+                v-if="status.value === curProjiect.projectStatus"
+              >
+                {{ status.label }}
+         </el-tag>
             <span>{{curProjiect.projectName}}</span>
         </div>
            <div class="mg-b-15">
@@ -189,13 +213,31 @@
                 
                 >
                   <template slot-scope="scope">
-                     <el-tag  size="small" type="danger"   class="custom-ellipse-tag1"   >{{ scope.row.contractType===1?'施工':scope.row.contractType===2?'监理':'指挥' }}</el-tag>
+                     <el-tag  size="small" :type=" scope.row.contractType===1?'warning':scope.row.contractType===2?'primary':'success'"   class="custom-ellipse-tag1"   >{{ scope.row.contractType===1?'施工':scope.row.contractType===2?'监理':'指挥' }}</el-tag>
                   </template>
                 
               </el-table-column>
                <el-table-column
                 prop=""
                 label="合同段权限">
+                <template slot-scope="scope">
+                  <el-tooltip 
+                    v-for="item in scope.row.relationContractInfo" 
+                    :key="item.id"
+                    :content="item.contractName"
+                    placement="top"
+                    :disabled="item.contractName.length <= 10"
+                  >
+                    <el-tag  
+                      size="small" 
+                      :type="item.contractType===1?'warning':item.contractType===2?'primary':'success'"   
+                      class="custom-ellipse-tag1 ellipsis-tag"
+                    >
+                      {{item.contractName}}
+                    </el-tag>
+                  </el-tooltip>
+                </template>
+
               </el-table-column>
                <el-table-column
                width="180px"
@@ -227,7 +269,7 @@
         <ContractSort 
          ref="contractSortRef"
          :title="sortTitle"
-
+         :sortProLoad="sortProLoad"
         @confirm="handleSortConfirm"
       />
 </el-container>
@@ -237,7 +279,7 @@
 </template>
 
 <script>
-import { getProjectList, removeProject } from "@/api/manager/projectinfo";
+import { collectProject, removeProject,getProjectListPage,sortProject,sortProjectCollect,sortContract } from "@/api/manager/projectinfo";
 import { findContractByProjectId, removeContractInfo } from "@/api/manager/contractinfo";
 // import {getDictionary} from "@/api/system/dict";
 import { mapGetters } from "vuex";
@@ -248,31 +290,31 @@ export default {
     return {
       showTooltip: false, // 控制 tooltip 显示
       searchForm: {
-        name: ''
+        name: '',
+        status: '',
+        sort:0.,
+        isCollect: 0,
       },
-      typeOptions:[
-        { value: '1', label: '未开始' },
-        { value: '2', label: '配置中' },
-        { value: '3', label: '进行中' },  
-        { value: '4', label: '已完成' },
-      ],
+   
       sortOptions:[
-        { value: '1', label: '收藏优先' },
-        { value: '2', label: '创建时间' },
-        { value: '3', label: '我负责的' },  
+        { value: 0, label: '默认排序' },
+        { value: 1, label: '收藏优先' },
+        { value: 2, label: '创建时间' },
+        { value: 3, label: '我负责的' },  
         
       ],
-       tagItems: [
-          { type: '1', label: '质检' },
-          { type: '2', label: '试验' },
-          { type: '3', label: '日志' },
-          { type: '4', label: '计量' },
-          { type: '5', label: '征拆' }
+       proStatusItems: [
+          { type:'info', label: '未开始',value: 0 },
+          { type: 'primary', label: '配置中' ,value: 1 },
+          { type: 'warning', label: '进行中' ,value: 2 },
+          { type: 'success', label: '已完成' ,value: 3 },
+         
        ],
       projectId: '',
       curProjiect: {},
       projectList: [],
       projectPageList: [],
+      getPageLoading: false,
 
       projectVisible: false,
       contractList: [],
@@ -337,6 +379,7 @@ export default {
       sortContractVisible: false, // 合同段排序弹窗
       sortContractList: [],
       sortTitle: '合同段排序',
+      sortProLoad: false,
 
     }
   },
@@ -360,6 +403,27 @@ export default {
       this.page.currentPage = 1;
       this.getProjectPageList();
     },
+  generateTagItems(wbsTypes){
+       const typeToLabelMap = {
+        1: '质检',
+        2: '试验',
+        3: '日志',
+        4: '计量',
+        5: '征拆',
+    };
+      let tagItems = [];
+      wbsTypes.forEach(type => {
+        // 检查type是否在映射关系中存在
+        if (typeToLabelMap.hasOwnProperty(type)) {
+            // 如果存在，则创建一个新的对象并添加到tagItems数组中
+            tagItems.push({
+                type: type,
+                label: typeToLabelMap[type]
+            });
+        }
+    });
+     return tagItems;
+  },
   handleWbsClick(type) {
     switch (type) {
       case 'quality':
@@ -380,18 +444,36 @@ export default {
     }
   },
     getProjectList () {
-      getProjectList(1, 999).then((res) => {
+      getProjectListPage({
+        current:1,
+        size:999,
+        ...this.searchForm
+
+      }).then((res) => {
         this.projectList = res.data.data.records;
       })
     },
     getProjectPageList () {
-      getProjectList(this.page.currentPage, this.page.pageSize).then((res) => {
+      this.getPageLoading = true;
+      getProjectListPage(
+      {
+        ...this.searchForm,
+        current: this.page.currentPage,
+        size: this.page.pageSize,
+      
+      
+      }
+
+      ).then((res) => {
+        this.getPageLoading = false;
         this.projectPageList = res.data.data.records;
         this.page.total = res.data.data.total;
       })
     },
 
     projectClick (item) {
+   
+      
       this.curProjiect = item;
       findContractByProjectId(this.curProjiect.id).then((res) => {
         this.contractList = res.data.data;
@@ -404,18 +486,7 @@ export default {
       this.page.currentPage = val;
     },
 
-    projectChange (id) {
-      for (let i = 0; i < this.projectList.length; i++) {
-        if (id == this.projectList[i].id) {
-          this.curProjiect = this.projectList[i];
-          findContractByProjectId(this.curProjiect.id).then((res) => {
-            this.contractList = res.data.data;
-          })
-          this.projectVisible = true;
-          return;
-        }
-      }
-    },
+
 
     addContract () {
       this.$router.push({
@@ -591,7 +662,30 @@ export default {
       this.$router.push('/manager/projectinfo/ledger' )
     },
     toggleLike(item){
-      item.isLiked = !item.isLiked;
+      collectProject({projectId:item.id}).then((res) => {
+         console.log(res,'res');
+           item.load=false
+             if(res.data.code==200){
+                this.$message.success(res.data.msg)
+              
+                
+                this.getProjectPageList();
+            }else{
+                this.$message.error(res.data.msg)
+            }
+        })
+    },
+    searchByCollect(){
+      if(this.searchForm.isCollect){
+        this.searchForm.isCollect = 0
+
+      }else{
+        this.searchForm.isCollect = 1
+
+      }
+      this.getProjectPageList();
+      this.getProjectList();
+
     },
     //合同段排序
     sortContract(){
@@ -609,15 +703,72 @@ export default {
       console.log('排序后的列表:', sortedList);
       // TODO: 调用接口保存排序结果
       this.contractList = [...sortedList];
-      this.$message.success('排序成功');
+        const ids = this.contractList.map(item => item.id);
+     this. saveSort(ids);
+
     },
     sortPro(){
-        this.sortContractList = JSON.parse(JSON.stringify(this.projectList));
-        this.sortTitle = '项目排序';
+       this.sortContractList = JSON.parse(JSON.stringify(this.projectList));
+      if(this.searchForm.isCollect===0){
+        this.sortTitle = '收藏项目排序';
+      }else{
+        
+          this.sortTitle = '项目排序';
+      }
+
+       
 
       this.$nextTick(() => {
         this.$refs.contractSortRef.show(this.sortContractList);
       });
+    },
+    saveSort(ids){
+      if(this.sortTitle==='项目排序'){
+         this.sortProLoad= true;
+          if(this.searchForm.isCollect===0){
+                  sortProject(ids).then((res) => {
+                    this.sortProLoad= false;
+                    if(res.data.code==200){
+                        this.$message.success(res.data.msg)
+                      
+                        
+                        this.getProjectPageList();
+                    }else{
+                        this.$message.error(res.data.msg)
+                    }
+                })
+          }else{
+              sortProjectCollect(ids).then((res) => {
+                    this.sortProLoad= false;
+                    if(res.data.code==200){
+                        this.$message.success(res.data.msg)
+                      
+                        
+                        this.getProjectPageList();
+                    }else{
+                        this.$message.error(res.data.msg)
+                    }
+                })
+          }
+      }else {
+        
+        sortContract(ids).then((res) => {
+                    this.sortProLoad= false;
+                    if(res.data.code==200){
+                        this.$message.success(res.data.msg)
+                      
+                        
+                        // this.getProjectPageList();
+                            findContractByProjectId(this.curProjiect.id).then((res) => {
+                              this.contractList = res.data.data;
+                            })
+                    }else{
+                        this.$message.error(res.data.msg)
+                    }
+                })
+      }
+
+
     }
   }
 };
@@ -745,6 +896,24 @@ export default {
 
 </style>
 <style lang="scss">
+
+.ellipsis-tag {
+  max-width:80px; /* 设置最大宽度 */
+  
+  .el-tag__content {
+    display: inline-block;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+}
+
+/* 确保 tooltip 的最大宽度 */
+.el-tooltip__popper {
+  max-width: 300px;
+  word-break: break-all;
+}
 /* 完全透明分页样式 */
 .footer-box {
   display: flex;