forgeplus-react/src/forge/UsersList/focus_button.js

50 lines
1.5 KiB
JavaScript

import React , {useState} from "react";
import axios from "axios";
import { Button } from "antd";
import "./list.css";
function FocusButton({is_watch , fontClass, starText, is_block , id , successFunc,notReset}){
const [ isSpin , setIsSpin ] = useState(false);
const [ watchFlag , setWatchFlag ] = useState(is_watch);
// 关注和取消关注
function focusFunc(flag){
setIsSpin(true);
axios({
method: flag ? "delete" : "post",
url: `/watchers/${flag ? "unfollow" : "follow"}.json`,
params: {
target_type: "user",
id,
},
}).then((result) => {
if (result && result.data.status === 0) {
successFunc && successFunc();
console.log(notReset);
if(notReset){
setWatchFlag(!watchFlag);
}
}
setIsSpin(false);
})
.catch((error) => {setIsSpin(false);});
};
return (
<Button type={watchFlag ? "default" : "primary"} ghost={!watchFlag} block={is_block} loading={isSpin} onClick={() => focusFunc(watchFlag)}>
{watchFlag ? (
<span className="">
<i className="iconfont icon-shixing font-15 text-yellow mr-4"></i>
<span className={fontClass || "font-12"}>已关注</span>
</span>
) : (
<span className="">
<i className="iconfont icon-kongxing font-15"></i>
<span className={fontClass}>{starText || "关注"}</span>
</span>
)}
</Button>
);
}
export default FocusButton;