完成删除项目功能；添加icon-triangle-circle; 添加互链相关改动基础代码

src/components/icon-triangle-circle/index.vue

@@ -0,0 +1,52 @@
+<template>
+  <div class="icon-triangle-circle" :style="{ fontSize: `${size}px` }">
+    <div class="circle" :style="{ borderColor: color }" />
+    <i :style="{ backgroundColor: color }" />
+    <i :style="{ backgroundColor: color }" />
+    <i :style="{ backgroundColor: color }" />
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    color: String,
+    size: Number,
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.icon-triangle-circle {
+  position: relative;
+  display: inline-block;
+  vertical-align: top;
+  width: 1em;
+  height: 1em;
+  box-sizing: border-box;
+  .circle {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    margin: auto;
+    box-sizing: border-box;
+    top: 12%;
+    width: 80%;
+    height: 80%;
+    border-radius: 50%;
+    border: 2px solid transparent;
+  }
+  > i {
+    position: absolute;
+    width: 32%;
+    height: 32%;
+    border-radius: 50%;
+    box-sizing: border-box;
+    &:nth-child(2) { top: 0; left: 0; right: 0; margin: 0 auto; }
+    &:nth-child(3) { bottom: 0; left: 0; }
+    &:nth-child(4) { bottom: 0; right: 0; }
+  }
+}
+</style>

src/services/project.js

@@ -1,4 +1,5 @@
 import { fetchApi , wrapErrorHint} from '@/utils/request';
+import { firstCharToLowerCase } from '@/utils/tool';
 /**
  * 用户拥有的项目
  * @param {string} id 
@@ -8,6 +9,14 @@ export async function queryProjectsByUserId(userId){
     return wrapErrorHint(res);
 }
 
+export async function queryProjectLinkInviteList (accountId, companyId) {
+  const res = await fetchApi('projectLinkInvite/queryProjectLinkInviteListByUserId', { userId: accountId, companyId });
+  if(res.Data) {
+    res.Data = (res.Data || []).map(firstCharToLowerCase);
+  }
+  return wrapErrorHint(res);
+}
+
 /** 
  * 项目详情
 */

src/utils/request.js

@@ -99,7 +99,7 @@ export default axios;
 
 function mapApiPathToFullPath(path) {
   const [service] = path.split('/');
-  const prefix = ['template', 'project', 'folder', 'file', 'templateCompany'].indexOf(service) !== -1 ? 'pms' : 'cms';
+  const prefix = ['template', 'project', 'folder', 'file', 'templateCompany', 'projectLinkInvite'].indexOf(service) !== -1 ? 'pms' : 'cms';
   const fullpath = `api/${prefix}/${service === 'authentication' ? '' : 'v1/'}${path}`;
   let method = 'GET';
 

src/views/main_web/index/index.vue

@@ -16,13 +16,20 @@
 }
 </style>
 <template>
-  <div id="app" v-cloak>
-    <app-header 
-      :showUserCenter="true" id="proj-list-page"
+  <div
+    id="app"
+    v-cloak
+  >
+    <app-header
+      :showUserCenter="true"
+      id="proj-list-page"
       showRecycleBin
     >
       <template #left>
-        <el-button class="org-button no-drag" @click.stop="navBack">
+        <el-button
+          class="org-button no-drag"
+          @click.stop="navBack"
+        >
           {{currentPlatform.orgName}}
           <i class="el-icon-sort org-button-icon" />
         </el-button>
@@ -31,8 +38,8 @@
         <div class="main-title">{{showCenterTitle}}</div>
       </template>
       <template #right>
-        <search-bar  
-          class="proj-search-bar" 
+        <search-bar
+          class="proj-search-bar"
           placeholder="搜索项目名称"
           :maxLength="35"
           v-model="searchContent"
@@ -53,10 +60,16 @@
     <!-- 首页 项目列表页内容 -->
     <div class="layout_content">
       <section class="yiyun_warpContent">
-        <div class="yiyun-rows mt-20" id="new">
+        <div
+          class="yiyun-rows mt-20"
+          id="new"
+        >
           <div class="yiyun-col-4 timer-part">
-            <div class="yiyun_row" style="width: 95%;">
-              <timer :cnName="cnName"/>
+            <div
+              class="yiyun_row"
+              style="width: 95%;"
+            >
+              <timer :cnName="cnName" />
             </div>
           </div>
           <!-- <div class="yiyun-col-4 adjust-position">
@@ -82,25 +95,85 @@
             </div>
           </div>
         </div>
-        <div style="margin-left: 50%;margin-top: 25%;" v-if="noProjTip">
+        <div
+          style="margin-left: 50%;margin-top: 25%;"
+          v-if="noProjTip"
+        >
           <h1>空空如也</h1>
         </div>
       </section>
-      <button class="yiyun_btn_new new-btn-margin"
+      <button
+        class="yiyun_btn_new new-btn-margin"
         id="buttonbtn"
         @click.stop="createNewProjectClick"
         v-if="isUserPerm"
       >新建项目</button>
+      <template v-if="linkApplyList && linkApplyList.length">
+        <div class="group-title">待互链的项目</div>
+        <div class="linkItem-list">
+          <el-row :gutter="64">
+            <el-col
+              :xs="24"
+              :sm="12"
+              :md="12"
+              :lg="8"
+              :xl="6"
+              v-for="linkObj in linkApplyList"
+              :key="linkObj.id"
+            >
+              <div class="linkItem" @click="linkDialogContextData = linkObj, linkDialogVisible = true">
+                <div>
+                  <icon-triangle-circle
+                    class="icon-models"
+                    :size="30"
+                    color="#3C7DFF"
+                  />
+                  <span>项目互链邀请</span>
+                </div>
+                <div>
+                  项目名称
+                </div>
+                <div>
+                  由“企业简称”的“负责人”邀请
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+      
+      <!-- <el-button @click.stop="linkDialogVisible = true">弹窗测试</el-button> -->
+      <div class="group-title">最近的项目</div>
       <!-- 项目列表 -->
-      <proj-list id="proj-list"
+      <proj-list
+        id="proj-list"
         :projList="showProjList"
-        :openPrjInfo="openPrjInfo"
-        :addNewFolders="addNewFolders"
         @watchAllBtnClick="watchAllBtnClick"
         @lookProjDetailClick="lookProjDetailClick"
+        @on-remove="onRemoveProject"
+        :isUserPerm="isUserPerm"
       >
       </proj-list>
-
+      <el-dialog
+        class="linkDialog"
+        width="460px"
+        :visible.sync="linkDialogVisible"
+        :close-on-click-modal="false"
+      >
+        <icon-triangle-circle
+          class="icon-models"
+          :size="24"
+          color="#3C7DFF"
+        />
+        <i class="el-icon-close"  @click="linkDialogVisible = false" />
+        <span class="main-text">"企业简称"建立的“项目名称”，邀请您互链节点“节点名称”</span>
+        <el-button
+          class="block-button"
+          type="primary"
+        >通过新建项目互链</el-button>
+        <el-button class="block-button">选择已有项目建立互链</el-button>
+        <el-button class="block-button">拒绝互链邀请</el-button>
+      </el-dialog>
     </div>
   </div>
 </template>
@@ -111,14 +184,13 @@ import SearchBar from "@/components/search-bar/search-bar";
 // import DistWork from "@/views/components_web/distWork/distWork";
 // import NewProj from "@/views/components_web/newProj/newProj";
 // import ProjSetting from "@/views/components_web/projSetting/projSetting";
-import { haveAccess, AccessCode } from '@/utils/access';
-import * as prjService from '@/services/project'
-import Timer from '@/views/main_web/time'
-import ProjList from '@/views/main_web/proj-list'
+import { haveAccess, AccessCode } from "@/utils/access";
+import * as prjService from "@/services/project";
+import Timer from "@/views/main_web/time";
+import ProjList from "@/views/main_web/proj-list";
+import IconTriangleCircle from "@/components/icon-triangle-circle";
 
-import {  debounce } from 'lodash';
-const BMap = window.BMap;
-const Velocity = window.Velocity;
+import { debounce } from "lodash";
 export default {
   elNew: "#new", //样式ID,用于动画
   components: {
@@ -129,157 +201,119 @@ export default {
     Timer,
     AppHeader,
     ProjList,
+    IconTriangleCircle,
   },
   data() {
     const { currentPlatform } = this.$store.state;
     return {
+      companyId: currentPlatform.orgId,
       currentPlatform,
-      isUserPerm: haveAccess(currentPlatform.accessList, AccessCode.ProjectManager),
-      nowDate: "",
-      nowTime: "",
+      isUserPerm: haveAccess(
+        currentPlatform.accessList,
+        AccessCode.ProjectManager
+      ), // 企业管理员标识
       cnName: "",
-      currProjId: "",
-      feedbackdesc: "",
       projList: [], // 项目列表
-      nowProj:"",
+      linkApplyList: [], // 互链申请列表
       // projPageList: [], // 分页项目数据 目前没有设置分页的项目数据
-      isEmpty: false,
-      createUserId:'',
-      isProjectManager: false,
-      newProjData: {
-        projectData: {
-          projID: "",
-          projName: "",
-          projCode: "",
-          folderID: "",
-          scale: "",
-          address: "",
-          showImgUrl: "",
-          templateID: "",
-          createUserID: "",
-          modifyUserID: "",
-          deleted: 0,
-        },
-        listFolder: [],
-        listProjProp: [],
-        userId: "",
-      }, // 新建项目
-      listTempProp: [],
-      listProjProp: [],
-      checked: false,
-      // 定义start
-      newfolder: {
-        folderName: "自定义",
-      },
-      isNewProj: false, //新建项目弹框
-      isBottomNewProj: false, //底部弹框
-      isDistProj: true, //分配工作按钮
-      isShowAllProject: true, //显示所有项目
-      isHideAllProject: false, //隐藏所有项目
-      isPointGroup: true, //分页
-      pageIndex: 1,
-      isAloneDistProj: false, //单独分配工作窗体控制
-      createDate: new Date(),
       noProjTip: false,
-      roles: [
-        {
-          value: 1,
-          label: "编辑",
-          description: "查看和编辑",
-        },
-        {
-          value: 0,
-          label: "查看",
-          description: "查看",
-        },
-      ],
-      folderPerm: "1",
-      scrollIndex: 12, //默认值滚动数
-      welcome: "", //时间旁的欢迎语
       isShowProjSetting: false,
-     
-      isEditProjFolder: false,
+
       fetchTickIns: null,
 
-      searchContent: '',
-      searchProjList: [],//搜索出来的项目列表
-      isShowSearchBar: false,//控制搜索栏显隐
-      isSearching: false,//是否搜寻结果
+      searchContent: "",
+      searchProjList: [], //搜索出来的项目列表
+      isShowSearchBar: false, //控制搜索栏显隐
+      isSearching: false, //是否搜寻结果
 
       homeScrollTop: 0,
-      contentBodyEl: null,//bigbody dom元素
+      contentBodyEl: null, //bigbody dom元素
+      linkDialogVisible: false,
+      linkDialogContextData: null,
     };
   },
   computed: {
     showProjList() {
-      return this.isShowSearchBar &&  this.searchContent && this.isSearching ? this.searchProjList : this.projList;
+      return this.isShowSearchBar && this.searchContent && this.isSearching
+        ? this.searchProjList
+        : this.projList;
     },
     showCenterTitle() {
-      return this.isShowSearchBar && this.searchContent ? `“${this.searchContent}”搜索结果` : '我的项目';
+      return this.isShowSearchBar && this.searchContent
+        ? `“${this.searchContent}”搜索结果`
+        : "我的项目";
     },
   },
   watch: {
     searchContent() {
       this.searchForProj();
-    }
+    },
   },
   mounted: function () {
     this.cnName = JSON.parse(sessionStorage.user).userName;
-    sessionStorage.setItem('pageTitle','我的项目')
+    sessionStorage.setItem("pageTitle", "我的项目");
     //this.setDateTime();
     //setInterval(this.setDateTime, 1000);
     this.listProjects(true);
     // setInterval(this.listProjects, 1000 * 60);
-    this.contentBodyEl = document.getElementById('bigbody');
-    this.contentBodyEl && this.contentBodyEl.addEventListener('scroll', this.recordContentScrollTop);
+    this.contentBodyEl = document.getElementById("bigbody");
+    this.contentBodyEl &&
+      this.contentBodyEl.addEventListener(
+        "scroll",
+        this.recordContentScrollTop
+      );
   },
   beforeDestroy() {
     sessionStorage.dotIndex = this.ind;
-    if(this.fetchTickIns) {
+    if (this.fetchTickIns) {
       clearTimeout(this.fetchTickIns);
       this.fetchTickIns = null;
     }
 
-    this.contentBodyEl && this.contentBodyEl.removeEventListener('scroll', this.recordContentScrollTop);
+    this.contentBodyEl &&
+      this.contentBodyEl.removeEventListener(
+        "scroll",
+        this.recordContentScrollTop
+      );
   },
   methods: {
     navBack() {
-      this.$router.go(-1);
+      this.$router.push({ name: "platform" });
     },
     // 记录页面的滚动位置
     recordContentScrollTop() {
       this.homeScrollTop = this.contentBodyEl.scrollTop;
-      sessionStorage.setItem('homeScrollTop', this.homeScrollTop);
+      sessionStorage.setItem("homeScrollTop", this.homeScrollTop);
     },
     // 点击叉号按钮隐藏搜索栏
     hideSearchBar() {
       this.isShowSearchBar = false;
-      this.searchContent = '';
+      this.searchContent = "";
     },
     showSearchBar() {
       this.isShowSearchBar = true;
     },
-     searchForProj: debounce(async function searchForProj() {
+    searchForProj: debounce(async function searchForProj() {
       //  判断输入内容是否有效
-        const rg = /^\s*$/;
-        if(rg.test(this.searchContent)) {
-          return;
+      const rg = /^\s*$/;
+      if (rg.test(this.searchContent)) {
+        return;
+      } else {
+        this.isSearching = true; //正在搜索
+        const res = await prjService.searchProject(this.searchContent);
+        if (res.Code == 0) {
+          this.searchProjList = res.Data;
         } else {
-          this.isSearching = true;//正在搜索
-          const res = await prjService.searchProject(this.searchContent);
-          if(res.Code == 0) {
-            this.searchProjList = res.Data;
-          } else {
-            this.$notify({
-              type: ['error'],
-              message:'查询数据失败, 请稍后重试。'
-            })
-          }
+          this.$notify({
+            type: ["error"],
+            message: "查询数据失败, 请稍后重试。",
+          });
         }
-      },500),
+      }
+    }, 500),
     // 新版创建项目入口
     createNewProjectClick() {
-      this.$router.push('/newproject').catch(err => console.log(err));
+      this.$router.push("/newproject").catch((err) => console.log(err));
     },
     // 新版项目管理入口
     lookProjDetailClick(projData) {
@@ -287,43 +321,45 @@ export default {
       sessionStorage.createUserID = projData.CreateUserId;
       sessionStorage.templateID = projData.TemplateId;
       sessionStorage.allocated = projData.Allocated;
-      
-      this.$router.push({
-                name: 'projdetail'
-            }).catch(err => {
-                console.log(err);
-            })
+
+      this.$router
+        .push({
+          name: "projdetail",
+        })
+        .catch((err) => {
+          console.log(err);
+        });
     },
     // 接收到proj-item发来的点击
     watchAllBtnClick(projItem, i) {
-      const temp = ['341999987607363584','341984912360235008','342002217261621248'];
-      console.log(projItem);
-      if(i % 2 == 0 || temp.includes(projItem.Id)) {
-        this.toWatchPageClick(projItem);
-      } else {
-        this.toLinkPageClick(projItem);
-      }
+      // const temp = ['341999987607363584','341984912360235008','342002217261621248'];
+      // console.log(projItem);
+      // if(i % 2 == 0 || temp.includes(projItem.Id)) {
+      //   this.toWatchPageClick(projItem);
+      // } else {
+      //   this.toLinkPageClick(projItem);
+      // }
+      this.toWatchPageClick(projItem);
     },
     // 跳转到观全局
     toWatchPageClick(projItem) {
       this.$router.push({
-        path: "watch"
+        path: "watch",
       });
-      sessionStorage.removeItem('projName');
-      sessionStorage.removeItem('projId');
-      sessionStorage.setItem('projName', projItem.ProjName);
-      sessionStorage.setItem('projId', projItem.Id);
+      sessionStorage.removeItem("projName");
+      sessionStorage.removeItem("projId");
+      sessionStorage.setItem("projName", projItem.ProjName);
+      sessionStorage.setItem("projId", projItem.Id);
     },
     // 跳转到联动模型展示
     toLinkPageClick(projItem) {
       this.$router.push({
-        path: "watchlink"
+        path: "watchlink",
       });
-      sessionStorage.removeItem('projName');
-      sessionStorage.removeItem('projId');
-      sessionStorage.setItem('projName', projItem.ProjName);
-      sessionStorage.setItem('projId', projItem.Id);
-      
+      sessionStorage.removeItem("projName");
+      sessionStorage.removeItem("projId");
+      sessionStorage.setItem("projName", projItem.ProjName);
+      sessionStorage.setItem("projId", projItem.Id);
     },
     /**
      * 进入回收站
@@ -336,345 +372,42 @@ export default {
         },
       });
     },
-    /**
-     * 新建项目成功后 关闭新建项目的弹窗
-     */
-    createProjSuccess: function() {
-      this.refreshListProj();
-    },
-    /*
-     * 关闭新建项目弹框
-     */
-    closeNewProj: function () {
-      this.isNewProj = false;
-      this.isBottomNewProj = false;
+    onRemoveProject() {
+      this.listProjects();
     },
-    /**
-     * 滚动加载更多数据
-     */
-    // scrollLoad: function () {
-    //   if (this.projList && (this.scrollIndex < this.projList.length)) {
-    //     this.scrollIndex += 4;
-    //     this.projectsWithPage();
-    //   }
-    // },
-    /**
-     * 设置地图定位搜索位置
-     */
-    // setSearchAddress: function () {
-    //   var ac = new BMap.Autocomplete({
-    //     //建立一个自动完成的对象
-    //     input: "suggestId",
-    //   });
-    //   var myValue;
-    //   var thisApp = this;
-    //   ac.addEventListener("onconfirm", function (e) {
-    //     //鼠标点击下拉列表后的事件
-    //     var _value = e.item.value;
-    //     myValue =
-    //       _value.province +
-    //       _value.city +
-    //       _value.district +
-    //       _value.street +
-    //       _value.business;
-    //     thisApp.newProjData.projectData.address = myValue;
-    //   });
-    // },
-    /**
-     * 设置日期、时间
-     */
-    // setDateTime: function () {
-    //   this.nowDate = commonJs.getDate();
-    //   this.createDate = this.nowDate;
-    //   this.nowTime = commonJs.getTime();
-    //   var time = this.nowTime.substring(0, 2);
-    //   if (time < 12 && time > 0) {
-    //     this.welcome = "上午好！ " + this.cnName;
-    //   } else if (time == 12) {
-    //     this.welcome = "中午好！ " + this.cnName;
-    //   } else if (time > 12 && time > 20) {
-    //     this.welcome = "晚上好,注意休息! " + this.cnName;
-    //   } else if (time > 12 && time < 20) {
-    //     this.welcome = "下午好！" + this.cnName;
-    //   }
-    // },
-    /**
-     * 获取项目数据
-     */
-    // listProjects: function () {
-    //   var thisApp = this;
-    //   this.$axios({
-    //     method: "get",
-    //     url: encodeURI(
-    //       process.env.API_HOST + "projects/" + sessionStorage.userId
-    //     ),
-    //   })
-    //     .then(function (response) {
-    //       thisApp.projList = response.data;
-    //       if (sessionStorage.login === "login") {
-    //         thisApp.projectsWithPage();
-    //       } else {
-    //         thisApp.projectsWithPage();
-    //       }
-    //     })
-    //     .catch(function (error) {
-    //       console.log(error);
-    //     });
-    // },
-    async listProjects(runTick){     
-      const projectListRes = await prjService.queryProjectsByUserId(this.$store.state.accountId);
+    async listProjects(runTick) {
+      const accountId = this.$store.state.accountId;
+      const companyId = this.companyId;
+      const [projectListRes, linkApplyListRes] = await Promise.all([
+        prjService.queryProjectsByUserId(this.$store.state.accountId),
+        prjService.queryProjectLinkInviteList(accountId, companyId),
+      ]);
       this.projList = projectListRes.Data;
-      this.$nextTick(()=> {
-        const bigbody = document.getElementById('bigbody');
-        this.homeScrollTop = parseInt(sessionStorage.getItem('homeScrollTop') || 0);
+      // todo
+      // this.linkApplyList = [{ id: 1 }]; //  linkApplyListRes.Data;
+      this.$nextTick(() => {
+        const bigbody = document.getElementById("bigbody");
+        this.homeScrollTop = parseInt(
+          sessionStorage.getItem("homeScrollTop") || 0
+        );
         bigbody && bigbody.scrollTo(0, this.homeScrollTop);
-      })
-
-      if(runTick) {
-        this.fetchTickIns = setTimeout(() => this.listProjects(true), 1000 * 60);
-      }
-    },
-    /**
-     * 设置分页项目数据
-     *
-     */
-    // projectsWithPage: function () {
-    //   this.projPageList = commonJs.pageData(
-    //     this.scrollIndex,
-    //     this.pageIndex,
-    //     this.projList
-    //   );
-    //   if (this.projPageList && this.projPageList.length > 0) {
-    //     this.isEmpty = false;
-    //   } else {
-    //     this.isEmpty = true;
-    //   }
-    // },
-    /**
-     * 转到workspace工作空间
-     */
-    goFilePage: function (proj) {
-      sessionStorage.createUserID = proj.CreateUserId;
-      sessionStorage.templateID = proj.TemplateId;
-      sessionStorage.projId = proj.Id;
-      sessionStorage.nowFolderIndex = "";
-      sessionStorage.comFolderId = proj.ComFolderId;
-      sessionStorage.newProjStatus = proj.NewProjStatus;
-      if (sessionStorage.projName != proj.ProjName) {
-        sessionStorage.projName = proj.ProjName;
-      }
-      this.$router.push({
-        name: "workspace",
-      }).catch(err => {
-        console.log(err);
-      })
-      sessionStorage.pageName = "workspace";
-    },
-    /**
-     * 进入云盘
-     */
-    toCloudIndex: function (projItem) {
-      sessionStorage.projId = projItem.projID;
-      sessionStorage.firstFolderId = projItem.folderID;
-      if (sessionStorage.projName != projItem.projName) {
-        sessionStorage.projName = projItem.projName;
-      }
-      sessionStorage.login = "cloud";
-      this.$router.push({
-        name: "cloud",
-      });
-    },
-    /**
-     * 查看项目消息
-     */
-    toProjNotice(projItem) {
-      sessionStorage.createUserID = projItem.createUserID;
-      sessionStorage.templateID = projItem.templateID;
-      sessionStorage.projId = projItem.projID;
-      sessionStorage.nowFolderIndex = "";
-      sessionStorage.comFolderId = projItem.comFolderID;
-      if (sessionStorage.projName != projItem.projName) {
-        sessionStorage.projName = projItem.projName;
-      }
-      this.$router.push({
-        name: "projnotice",
-        params: {
-          title: "我的项目",
-          allproj: false,
-        },
       });
-    },
-    /**
-     * 显示所有项目
-     */
-    showAllProject: function () {
-      this.isHideAllProject = true;
-      this.isDistProj = false;
-      this.isPointGroup = false;
-      this.isShowAllProject = false;
-      // this.projPageList = this.projList;
-    },
-    /**
-     * 隐藏全部项目
-     */
-    hideAllProject: function () {
-      this.isHideAllProject = false;
-      this.isDistProj = true;
-      this.isPointGroup = true;
-      this.isShowAllProject = true;
-      this.projectsWithPage();
-    },
-    /*
-     *新建项目弹框
-     */
-    // showNewProj: function () {
-    //   this.isNewProj = true;
-    //   // todo
-    //   // this.$router.push({
-    //   //   name: "project",
-    //   // });
-    // },
-    /*
-     * 新建项目进入前动画
-     */
-    beforeEnter: function (elNew) {
-      elNew.style.opacity = 0;
-    },
-    /*
-     *  进入后动画
-     */
-    enter: function (elNew, done) {
-      Velocity(
-        elNew,
-        {
-          opacity: 1,
-          bottom: "0px",
-        },
-        {
-          duration: 500,
-          complete: done,
-        }
-      );
-    },
-    /*
-     *  离开时动画
-     */
-    leave: function (elNew, done) {
-      Velocity(
-        elNew,
-        {
-          bottom: "-740px",
-          opacity: "0",
-        },
-        {
-          duration: 500,
-          complete: done,
-        }
-      );
-    },
-    /**
-     * 打开意见反馈
-     */
-    // showOption: function () {
-    //   this.$emit("showOption", true);
-    // },
-    /**
-     * 打开帮助
-     */
-    // showHelp: function () {
-    //   this.$emit("showHelp", true);
-    // },
-    /**
-     * 新建项目窗口展现
-     */
-    // showContinueNewProj: function () {
-    //   this.isNewProj = true;
-    //   this.isBottomNewProj = false;
-    // },
-    /**
-     * 新建项目窗口隐藏
-     */
-    showzhankai: function () {
-      this.isBottomNewProj = true;
-      this.isNewProj = false;
-    },
-    /*
-     *分配工作单独弹框(传输数据)
-     */
-    addNewFolders: function (projData) {
-      sessionStorage.projId = projData.Id;
-      sessionStorage.createUserID = projData.CreateUserId;
-      sessionStorage.templateID = projData.TemplateId;
-      sessionStorage.allocated = projData.Allocated;
-      this.isAloneDistProj = true;
-    },
-    /**
-     * 关闭分配工作窗体
-     */
-    closeDistWork: function (data) {
-      if (data == "index") {
-        this.listProjects();
+
+      if (runTick) {
+        this.fetchTickIns = setTimeout(
+          () => this.listProjects(true),
+          1000 * 60
+        );
       }
-      this.isAloneDistProj = false;
-    },
-    /**
-     * 刷新当前项目
-     */
-    refreshListProj: function (data) {
-      this.listProjects();
-      this.isNewProj = false;
-    },
-    /**
-     * 关闭项目设置窗体
-     */
-    closeProjSet: function () {
-      this.isShowProjSetting = false;
-      this.listProjects();
-    },
-    /**
-     * 打开项目设置窗体
-     */
-    // projectEdit: function (proj) {
-    //   this.currProjId = proj.projID;
-    //   var thisApp = this;
-    //   this.$axios({
-    //     method: "get",
-    //     url: encodeURI(
-    //       process.env.API_HOST +
-    //         "projects/manager/" +
-    //         this.currProjId +
-    //         "/" +
-    //         sessionStorage.userId
-    //     ),
-    //   })
-    //     .then((response) => {
-    //       if (response.data != null && response.data != "") {
-    //         thisApp.isProjectManager = response.data.isProjManager;
-    //         thisApp.isShowProjSetting = true;
-    //         thisApp.isEditProjFolder = false;
-    //       }
-    //     })
-    //     .catch((error) => {
-    //       console.log(error);
-    //     });
-    // },
-    /**
-     * 打开项目概况
-     */
-    openPrjInfo(proj){
-      this.currProjId = proj.Id;
-      this.isProjectManager=proj.Status;
-      this.isShowProjSetting = true;
-      this.isEditProjFolder = false;    
     },
-    /**
-     * @description: 编辑项目概况回调
-     * @param {type}
-     * @return:
-     */
-    projEditSuccess: function () {
-      this.isShowProjSetting = false;
-      this.listProjects();
+
+    /* 互链邀请相关API */
+    // 拒绝互链邀请
+    async refuseLinkApply() {
+      const linkData = this.linkDialogContextData;
+      debugger;
+      // const res = await this.$fetchApi('projectLinkInvite/refuseProjectLinkInvite', {  });
+
     },
   },
 };
@@ -684,36 +417,121 @@ export default {
 .icon-icon_huishouzhan {
   line-height: inherit;
 }
-
-
 </style>
 
 <style lang="scss">
-  @media(max-width:600px) {
-    .timer-part {
-      display: none;
-    }
-    .adjust-position {
-      width: 100% !important;
-      margin: 0 auto;
-    }
+@media (max-width: 600px) {
+  .timer-part {
+    display: none;
   }
-
-  #proj-list-page .app-header-content-right {
-    display: flex;
+  .adjust-position {
+    width: 100% !important;
+    margin: 0 auto;
   }
+}
 
-  .new-btn-margin {
-    margin: 24px 0 0 64px;
-  }
+#proj-list-page .app-header-content-right {
+  display: flex;
+}
 
+.new-btn-margin {
+  margin: 24px 0 0 64px;
+}
 </style>
 
 <style lang="scss" scoped>
 .org-button {
-
   &-icon {
-    transform: rotate(90deg)
+    transform: rotate(90deg);
+  }
+}
+.group-title {
+  margin-top: 16px;
+  padding-left: 64px;
+  font-size: 24px;
+  line-height: 28px + 10px;
+}
+.linkDialog {
+  ::v-deep .el-dialog__body {
+    text-align: center;
+  }
+  .icon-models {
+    position: absolute;
+    left: 18px;
+    top: 18px;
+  }
+  .el-icon-close {
+    position: absolute;
+    right: 14px;
+    top: 14px;
+    font-size: 32px;
+    color: rgba(#000, 0.18);
+    &:before {
+      content: "\e79d";
+    }
+  }
+  .main-text {
+    color: rgba(50, 50, 60, 100);
+    font-size: 18px;
+  }
+  .block-button {
+    display: block;
+    width: 100%;
+    margin-left: 0;
+    margin-bottom: 8px;
+    &:nth-of-type(1) {
+      margin-top: 40px;
+    }
+    &:nth-of-type(2) {
+      margin-bottom: 16px;
+    }
+    &:last-of-type {
+      color: rgba(#111, 0.25);
+    }
+  }
+}
+.linkItem {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  margin-top: 10px;
+  width: 100%;
+  height: 193px;
+  border-radius: 16px;
+  box-sizing: border-box;
+  background-color: rgba(255, 255, 255, 1);
+  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.1),
+    0px 2px 4px 0px rgba(0, 0, 0, 0.05);
+  cursor: pointer;
+  margin-top: 10px;
+  padding: 22px;
+  &:hover {
+    transform: scale(1.02);
+  }
+  &-list {
+    padding: 0 32px + 30px;
+  }
+  >div {
+    &:first-child {
+      flex: none;
+      height: 30px;
+      color: #2896E6;
+      line-height: 30px;
+      > span {
+        margin-left: 10px;
+      }
+    }
+    &:nth-child(2) {
+      flex: 1;
+      font-size: 22px;
+      display: flex;
+      align-items: center;
+    }
+    &:last-child {
+      flex: none;
+      height: 26px;
+      line-height: 26px;
+    }
   }
 }
 </style>

src/views/main_web/proj-item.vue

@@ -11,6 +11,23 @@
       <!-- <img class="prjitem_img"  ref="projimg" :class="{'height-full': isHeightFull && !isWidthFull, 'width-full': isWidthFull && !isHeightFull}"
                 :src="projItem.ShowImgUrl | resolveImg" alt="" 
             /> -->
+      <el-dropdown
+        class="prjitem_settings_wrapper"
+        placement="bottom"
+        v-if="isUserPerm"
+      >
+        <span
+          class="prjitem_settings"
+          @click.stop=""
+        >
+          <i class="el-icon-s-tools" />
+        </span>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item class="danger_button">
+            <span @click.stop="removeProject()">删除</span>
+          </el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
       <div
         class="newprj_icon"
         v-if="projItem.newProjStatus == 1"
@@ -38,7 +55,8 @@
 </template>
 
 <script>
-import { fetchApi } from "@/utils/request";
+import { fetchApi, wrapErrorHint } from "@/utils/request";
+import { notify } from '@/utils/tool';
 export default {
   data() {
     return {
@@ -54,6 +72,7 @@ export default {
         return {};
       },
     },
+    isUserPerm: Boolean,
   },
 
   methods: {
@@ -73,6 +92,23 @@ export default {
     manageProj() {
       this.$router.push("/newproject");
     },
+    removeProject() {
+      const projectName = this.projItem.ProjName;
+      // 删除项目后所有文件将被置入回收站中，但您可在回收站操作拷贝转移，确定删除项目？
+      // 删除项目将与“项目名称”切断互链关系，同时所有文件将被置入回收站中，但您可在回收站操作拷贝转移，确定删除项目？
+      this.$confirm(`删除项目后所有文件将被置入回收站中，但您可在回收站操作拷贝转移，确定删除项目？`, '', {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        showClose: false,
+        type: "error",
+      }).then(async () => {
+        const res = await this.$fetchApi('project/deleteProject', { id: this.projItem.Id });
+        wrapErrorHint(res);
+        if(res.Code) { return; }
+        notify.success(`${this.projItem.ProjName}已删除`);
+        this.$emit('on-remove', this.projItem);
+      })
+    },
     //ProjName处理
     subProjName(name) {
       let len = name.length;
@@ -130,32 +166,57 @@ export default {
 
 <style lang="scss" scoped>
 .prjitem {
+  position: relative;
   display: inline-block;
   width: 100%;
   border-radius: 16px;
-  margin: 30px 0px;
+  margin: 15px 0px;
   transition: width 0.3s linear;
   overflow: hidden;
-}
-.prjitem:hover {
-  box-shadow: -8px 0px 10px #e0e0e0, /*左边阴影*/ 8px 0px 10px #e0e0e0,
-    /*右边阴影*/ 0px 10px 10px #e0e0e0; /*下边阴影*/
-  transform: scale(1.02);
-}
-.prjitem:last-child:nth-child(3n) {
-  margin-right: calc(28% + 4%);
-}
-.prjitem_content {
-  position: relative;
-  width: 100%;
-  height: 245px;
-  background-color: #fff;
-  overflow: hidden;
-  border-top-left-radius: 16px;
-  border-top-right-radius: 16px;
-  cursor: pointer;
-  // height:0;
-  // padding-bottom:61%;
+
+  &:hover {
+    box-shadow: -8px 0px 10px #e0e0e0, /*左边阴影*/ 8px 0px 10px #e0e0e0,
+      /*右边阴影*/ 0px 10px 10px #e0e0e0; /*下边阴影*/
+    transform: scale(1.02);
+    .prjitem_settings {
+      display: block;
+    }
+  }
+  &:last-child:nth-child(3n) {
+    margin-right: calc(28% + 4%);
+  }
+
+  &_settings {
+    &_wrapper {
+      position: absolute;
+      right: 20px;
+      top: 20px;
+    }
+    display: none;
+    // display: block;
+    cursor: pointer;
+    width: 40px;
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    font-size: 28px;
+    border-radius: 50%;
+    background-color: #fff;
+    color: #000;
+  }
+
+  &_content {
+    position: relative;
+    width: 100%;
+    height: 245px;
+    background-color: #fff;
+    overflow: hidden;
+    border-top-left-radius: 16px;
+    border-top-right-radius: 16px;
+    cursor: pointer;
+    // height:0;
+    // padding-bottom:61%;
+  }
 }
 .prjitem_img {
   position: absolute;

src/views/main_web/proj-list.vue

@@ -30,6 +30,8 @@
                 :projItem="projItem"
                 @lookProjDetailClick="lookProjDetailClick(projItem)"
                 @watchAllBtnClick="watchAllBtnClick(projItem, index)"
+                @on-remove="onRemoveProject"
+                :isUserPerm="isUserPerm"
               />
             </el-col>
           </el-row>
@@ -60,8 +62,7 @@ export default {
         return [];
       },
     },
-    openPrjInfo: Function,
-    addNewFolders: Function,
+    isUserPerm: Boolean,
   },
   watch: {
     projListLength: {
@@ -81,6 +82,9 @@ export default {
     },
   },
   methods: {
+    onRemoveProject(projItem) {
+      this.$emit('on-remove', projItem);
+    },
     // 点击了项目管理按钮
     lookProjDetailClick(projItem) {
       this.$emit("lookProjDetailClick", projItem);