diff --git a/src/pages/SeedList/Recommend/Recommend.jsx b/src/pages/SeedList/Recommend/Recommend.jsx
index f58c73d..2229bb1 100644
--- a/src/pages/SeedList/Recommend/Recommend.jsx
+++ b/src/pages/SeedList/Recommend/Recommend.jsx
@@ -7,6 +7,7 @@
 import CreatePlaylistModal from './CreatePlaylistModal';
 import { confirmAlert } from 'react-confirm-alert';
 import 'react-confirm-alert/src/react-confirm-alert.css';
+import AuthButton from '../../../components/AuthButton';
 
 const Recommend = () => {
   const { user } = useUser();
@@ -160,15 +161,18 @@
             />
             <div className="paid-title">{list.title}</div>
 
-            {user && user.role === 'admin' ? (
-              <div className="admin-actions">
-                <button onClick={() => handleDelete(list.id)}>删除</button>
-              </div>
-            ) : list.isPaid ? (
-              <button onClick={() => navigate(`/playlist/${list.id}`)}>详情</button>
-            ) : (
-              <button onClick={() => handlePurchase(list.id)}>购买</button>
-            )}
+          {user && user.role === 'admin' ? (
+            <div className="admin-actions">
+              <button onClick={() => handleDelete(list.id)}>删除</button>
+            </div>
+          ) : list.isPaid ? (
+            <button onClick={() => navigate(`/playlist/${list.id}`)}>详情</button>
+          ) : (
+            <AuthButton roles={['chocolate', 'ice-cream']} onClick={() => handlePurchase(list.id)}>
+              购买
+            </AuthButton>
+          )}
+
           </div>
         ))}
       </div>