feat: 实现目标通知功能及相关组件

- 新增目标通知功能，支持根据用户创建目标时选择的频率和开始时间自动创建本地定时推送通知
- 实现每日、每周和每月的重复类型，用户可自定义选择提醒时间和重复规则
- 集成目标通知测试组件，方便开发者测试不同类型的通知
- 更新相关文档，详细描述目标通知功能的实现和使用方法
- 优化目标页面，确保用户体验和界面一致性

components/TaskCard.tsx

@@ -156,7 +156,7 @@ export const TaskCard: React.FC<TaskCardProps> = ({
           onPress={handleCompleteTask}
         >
           <Image
-            source={require('@/assets/images/task/iconTaskHeader.png')}
+            source={require('@/assets/images/task/icon-complete-gradient.png')}
             style={styles.taskIcon}
             resizeMode="contain"
           />
@@ -168,7 +168,11 @@ export const TaskCard: React.FC<TaskCardProps> = ({
             style={styles.skipIconContainer}
             onPress={handleSkipTask}
           >
-            <MaterialIcons name="skip-next" size={20} color="#6B7280" />
+            <Image
+              source={require('@/assets/images/task/icon-skip.png')}
+              style={styles.taskIcon}
+              resizeMode="contain"
+            />
           </TouchableOpacity>
         )}
       </View>
@@ -197,10 +201,6 @@ export const TaskCard: React.FC<TaskCardProps> = ({
           <MaterialIcons name="schedule" size={12} color="#6B7280" />
           <Text style={styles.statusTagText}>{getStatusText(task.status)}</Text>
         </View>
-        <View style={[styles.priorityTag, { backgroundColor: getPriorityColor(task.status) }]}>
-          <MaterialIcons name="flag" size={12} color="#FFFFFF" />
-          <Text style={styles.priorityTagText}>{getPriorityText(task.status)}</Text>
-        </View>
       </View>
 
       {/* 进度条 */}
@@ -225,33 +225,6 @@ export const TaskCard: React.FC<TaskCardProps> = ({
           <Text style={styles.progressText}>{task.currentCount}/{task.targetCount}</Text>
         </View>
       </View>
-
-      {/* 底部信息 */}
-      <View style={styles.footer}>
-        <View style={styles.teamSection}>
-          {/* 团队成员头像 */}
-          <View style={styles.avatars}>
-            <View style={styles.avatar}>
-              <Image
-                source={require('@/assets/images/Sealife.jpeg')}
-                style={styles.avatarImage}
-                resizeMode="cover"
-              />
-            </View>
-          </View>
-        </View>
-
-        <View style={styles.infoSection}>
-          <View style={styles.infoTag}>
-            <MaterialIcons name="event" size={12} color="#6B7280" />
-            <Text style={styles.infoTagText}>{formatDate(task.startDate)}</Text>
-          </View>
-          <View style={styles.infoTag}>
-            <MaterialIcons name="chat-bubble-outline" size={12} color="#6B7280" />
-            <Text style={styles.infoTagText}>2</Text>
-          </View>
-        </View>
-      </View>
     </TouchableOpacity>
   );
 };
@@ -291,19 +264,17 @@ const styles = StyleSheet.create({
     width: 32,
     height: 32,
     borderRadius: 16,
-    backgroundColor: '#7A5AF8',
     alignItems: 'center',
     justifyContent: 'center',
+    backgroundColor: '#F3F4F6',
   },
   skipIconContainer: {
     width: 32,
     height: 32,
-    borderRadius: 16,
+    borderRadius: 16, 
     backgroundColor: '#F3F4F6',
     alignItems: 'center',
     justifyContent: 'center',
-    borderWidth: 1,
-    borderColor: '#E5E7EB',
   },
   taskIcon: {
     width: 20,
@@ -431,7 +402,6 @@ const styles = StyleSheet.create({
     paddingHorizontal: 8,
     paddingVertical: 4,
     borderRadius: 12,
-    backgroundColor: '#F3F4F6',
   },
   infoTagText: {
     fontSize: 12,