diff --git a/pages/workbench/task/components/TaskList.vue b/pages/workbench/task/components/TaskList.vue
index c38fc9d..f855262 100644
--- a/pages/workbench/task/components/TaskList.vue
+++ b/pages/workbench/task/components/TaskList.vue
@@ -51,7 +51,7 @@
-
+
@@ -130,7 +130,7 @@ export default {
options.push({
text: '置顶',
style: {
- backgroundColor: '#ff9500',
+ backgroundColor: '#007aff',
color: '#fff'
}
})
@@ -300,8 +300,8 @@ export default {
transition: all 0.2s ease;
&.checked {
- background-color: #ff9500;
- border-color: #ff9500;
+ background-color: $im-primary;
+ border-color: $im-primary;
}
&.disabled {
@@ -372,15 +372,15 @@ export default {
position: absolute;
top: 8rpx;
right: 8rpx;
- background-color: #fff8e6;
- border: 1rpx solid #ff9500;
+ background-color: rgba($im-primary, 0.1);
+ border: 1rpx solid $im-primary;
border-radius: 50%;
width: 28rpx;
height: 28rpx;
display: flex;
align-items: center;
justify-content: center;
- box-shadow: 0 2rpx 6rpx rgba(255, 149, 0, 0.2);
+ box-shadow: 0 2rpx 6rpx rgba($im-primary, 0.2);
}
.empty-state {
diff --git a/pages/workbench/task/task.vue b/pages/workbench/task/task.vue
index bf94202..ae8c8c4 100644
--- a/pages/workbench/task/task.vue
+++ b/pages/workbench/task/task.vue
@@ -3,8 +3,21 @@
-
-
+
+
+
+
+
+
+
+
+ 发布给我的任务
+
+
+
+ 我发布的任务
+
+
-
-
-
-
- 任务类型
-
-
-
- 发布给我的任务
-
-
-
- 我发布的任务
-
+
+
@@ -54,11 +47,6 @@
@loadMore="handleLoadMore"
/>
-
-
-
-
-
@@ -74,7 +62,7 @@ export default {
data() {
return {
searchKeyword: '',
- showFilterPanel: false, // 是否显示筛选面板
+ showTaskTypePanel: false, // 是否显示任务类型面板
taskType: 'received', // 任务类型：received-发布给我的任务, published-我发布的任务
taskList: [], // 任务列表数据
loading: false, // 加载状态
@@ -191,9 +179,9 @@ export default {
this.loadTaskList()
},
- // 切换筛选面板
- toggleFilterPanel() {
- this.showFilterPanel = !this.showFilterPanel
+ // 切换任务类型面板
+ toggleTaskTypePanel() {
+ this.showTaskTypePanel = !this.showTaskTypePanel
},
// 切换任务类型
@@ -201,7 +189,7 @@ export default {
if (this.taskType === type) return
this.taskType = type
- this.showFilterPanel = false // 选择后关闭面板
+ this.showTaskTypePanel = false // 选择后关闭面板
// 重置搜索和分页
this.searchKeyword = ''
@@ -359,6 +347,7 @@ export default {
position: sticky;
top: 0;
z-index: 100;
+ position: relative;
}
.search-container {
@@ -367,62 +356,23 @@ export default {
gap: 20rpx;
}
-.filter-button {
- width: 60rpx;
- height: 60rpx;
- background-color: #f8f9fa;
- border-radius: 12rpx;
- display: flex;
- align-items: center;
- justify-content: center;
- border: 1rpx solid #e9ecef;
+.task-type-button-container {
+ position: relative;
}
.search-input {
flex: 1;
}
-.filter-panel {
- margin-top: 20rpx;
- background-color: #fff;
- border-radius: 12rpx;
- padding: 24rpx;
- box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
- border: 1rpx solid #e9ecef;
-}
-
-.filter-title {
- font-size: 28rpx;
- font-weight: 600;
- color: #333;
- margin-bottom: 20rpx;
-}
-
-.filter-options {
- display: flex;
- flex-direction: column;
- gap: 16rpx;
-}
-
-.filter-option {
+.task-type-button,
+.add-button {
+ width: 60rpx;
+ height: 60rpx;
+ background-color: transparent;
+ border-radius: 50%;
display: flex;
align-items: center;
- gap: 16rpx;
- padding: 20rpx;
- border-radius: 8rpx;
- background-color: #f8f9fa;
- border: 1rpx solid #e9ecef;
- transition: all 0.2s ease;
-
- &.active {
- background-color: #fff8e6;
- border-color: #ff9500;
- }
-
- text {
- font-size: 28rpx;
- color: #333;
- }
+ justify-content: center;
}
.task-list {
@@ -464,8 +414,8 @@ export default {
transition: all 0.2s ease;
&.checked {
- background-color: #ff9500;
- border-color: #ff9500;
+ background-color: $im-primary;
+ border-color: $im-primary;
}
}
@@ -524,33 +474,58 @@ export default {
text-align: center;
}
-.fab-button {
- position: fixed;
- right: 40rpx;
- bottom: 40rpx;
- width: 100rpx;
- height: 100rpx;
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
- border-radius: 50%;
+
+
+.task-type-panel {
+ position: absolute;
+ left: 0;
+ top: 80rpx;
+ background-color: #fff;
+ border-radius: 12rpx;
+ padding: 16rpx;
+ box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.15);
+ border: 1rpx solid #e9ecef;
+ z-index: 998;
+ min-width: 300rpx;
+}
+
+.task-type-option {
display: flex;
align-items: center;
- justify-content: center;
- box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.4);
- z-index: 999;
+ gap: 16rpx;
+ padding: 20rpx;
+ border-radius: 8rpx;
+ background-color: #f8f9fa;
+ border: 1rpx solid #e9ecef;
+ transition: all 0.2s ease;
+ margin-bottom: 12rpx;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ &:hover {
+ background-color: rgba($im-primary, 0.05);
+ }
+
+ text {
+ font-size: 28rpx;
+ color: #333;
+ }
}
.top-badge {
position: absolute;
top: 8rpx;
right: 8rpx;
- background-color: #fff8e6;
- border: 1rpx solid #ff9500;
+ background-color: rgba($im-primary, 0.1);
+ border: 1rpx solid $im-primary;
border-radius: 50%;
width: 28rpx;
height: 28rpx;
display: flex;
align-items: center;
justify-content: center;
- box-shadow: 0 2rpx 6rpx rgba(255, 149, 0, 0.2);
+ box-shadow: 0 2rpx 6rpx rgba($im-primary, 0.2);
}
diff --git a/uni.scss b/uni.scss
index 54e31bd..8929913 100644
--- a/uni.scss
+++ b/uni.scss
@@ -80,3 +80,6 @@ $uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle: 26px;
$uni-color-paragraph: #3f536e; // 文章段落颜色
$uni-font-size-paragraph: 15px;
+
+/* im部分配色 */
+$im-primary: #007aff;