|
|
@@ -50,64 +50,67 @@
|
|
|
|
|
|
<el-card class="project-card" v-for="item in projectPageList"
|
|
|
:key="item.id">
|
|
|
- <div class="project-top">
|
|
|
- <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" @click="toggleLike(item)" v-loading="item.load">
|
|
|
-
|
|
|
- <i class="ri-heart-fill" v-if="item.isCollect" style="color: red;" ></i>
|
|
|
- <i class="ri-heart-line" v-else></i>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="project-title" >
|
|
|
- <el-tooltip
|
|
|
- v-if="item.projectAlias.length > 20"
|
|
|
- :content="item.projectAlias"
|
|
|
- placement="top"
|
|
|
- >
|
|
|
- <span>{{ item.projectAlias }}</span>
|
|
|
- </el-tooltip>
|
|
|
- <span v-else>{{ item.projectAlias }}</span>
|
|
|
- </div>
|
|
|
- <div class="project-info">
|
|
|
- <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)">
|
|
|
-
|
|
|
- 查看详情 <i class="el-icon-right"></i>
|
|
|
- </el-link>
|
|
|
-
|
|
|
-
|
|
|
- <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 class="card-content" @click="projectClick(item)">
|
|
|
+ <div class="project-top">
|
|
|
+ <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" @click="toggleLike(item)" v-loading="item.load">
|
|
|
+
|
|
|
+ <i class="ri-heart-fill" v-if="item.isCollect" style="color: red;" ></i>
|
|
|
+ <i class="ri-heart-line" v-else></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="project-title" >
|
|
|
+ <el-tooltip
|
|
|
+ v-if="item.projectAlias.length > 20"
|
|
|
+ :content="item.projectAlias"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <span>{{ item.projectAlias }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ <span v-else>{{ item.projectAlias }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="project-info">
|
|
|
+ <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)">
|
|
|
+
|
|
|
+ 查看详情 <i class="el-icon-right"></i>
|
|
|
+ </el-link>
|
|
|
+
|
|
|
+
|
|
|
+ <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>
|
|
|
</div>
|
|
|
+
|
|
|
</el-card>
|
|
|
|
|
|
|
|
|
@@ -304,7 +307,7 @@ export default {
|
|
|
name: '',
|
|
|
status: '',
|
|
|
sort:0.,
|
|
|
- isCollect: 0,
|
|
|
+ isCollect: 1,
|
|
|
},
|
|
|
|
|
|
sortOptions:[
|
|
|
@@ -718,9 +721,9 @@ export default {
|
|
|
},
|
|
|
// 处理排序确认
|
|
|
handleSortConfirm(sortedList) {
|
|
|
- // 这里处理排序后的数据
|
|
|
- console.log('排序后的列表:', sortedList);
|
|
|
- // TODO: 调用接口保存排序结果
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
this.contractList = [...sortedList];
|
|
|
const ids = this.contractList.map(item => item.id);
|
|
|
this. saveSort(ids);
|
|
|
@@ -728,7 +731,7 @@ export default {
|
|
|
},
|
|
|
sortPro(){
|
|
|
this.sortContractList = JSON.parse(JSON.stringify(this.projectList));
|
|
|
- if(this.searchForm.isCollect===0){
|
|
|
+ if(this.searchForm.isCollect===1){
|
|
|
this.sortTitle = '收藏项目排序';
|
|
|
}else{
|
|
|
|
|
|
@@ -756,7 +759,8 @@ export default {
|
|
|
this.$message.error(res.data.msg)
|
|
|
}
|
|
|
})
|
|
|
- }else{
|
|
|
+ }
|
|
|
+ }else if(this.sortTitle==='收藏项目排序'){
|
|
|
sortProjectCollect(ids).then((res) => {
|
|
|
this.sortProLoad= false;
|
|
|
if(res.data.code==200){
|
|
|
@@ -768,8 +772,8 @@ export default {
|
|
|
this.$message.error(res.data.msg)
|
|
|
}
|
|
|
})
|
|
|
- }
|
|
|
- }else {
|
|
|
+ }
|
|
|
+ else {
|
|
|
|
|
|
sortContract(ids).then((res) => {
|
|
|
this.sortProLoad= false;
|
|
|
@@ -846,7 +850,20 @@ export default {
|
|
|
transition: all 0.3s ease;
|
|
|
border-radius: 8px;
|
|
|
}
|
|
|
+.project-card {
|
|
|
+ cursor: pointer;
|
|
|
+ border-radius: 8px;
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden; /* 确保内部容器不超出卡片 */
|
|
|
+
|
|
|
+ .card-content {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ padding: 15px; /* 保持原卡片内边距 */
|
|
|
+ }
|
|
|
|
|
|
+ // 其他原有样式保持不变
|
|
|
+}
|
|
|
.project-card:hover {
|
|
|
transform: translateY(-5px);
|
|
|
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
|
