feat: 再次报名

This commit is contained in:
eric
2022-11-26 21:44:58 +08:00
parent 2bc6a7ba56
commit 971c2d1d69
7 changed files with 178 additions and 75 deletions

View File

@@ -17,6 +17,11 @@ import moment from "moment";
const details = () => {
const [dataSource, setdataSource] = useState<any>([]);
const [status, setstatus] = useState<any>("0");
const [detailStatus, setdetailStatus] = useState<any>();
const [disable, setdisable] = useState<any>(false); //按钮禁用状态
const [statusName, setstatusName] = useState("");
const [bottomheight, setbottomheight] = useState(0);
let $instance: any = getCurrentInstance();
const { id } = $instance?.router?.params ?? {}; //活动id
@@ -26,6 +31,14 @@ const details = () => {
const [show, setShow] = react.useState(false);
const [value, setValue] = react.useState("");
useEffect(() => {
if (status === "1" || detailStatus !== "1") {
setdisable(true);
} else {
setdisable(false);
}
}, [status, detailStatus]);
useEffect(() => {
// 设置标题
definePageConfig({
@@ -62,26 +75,23 @@ const details = () => {
console.log("callFunction test result: ", res);
let newopenId: any = res?.result?.event?.userInfo?.openId;
setopenId(newopenId);
console.log("dataSource ", dataSource);
// 检查是否已报名
if ((dataSource?.useridArr ?? []).includes(newopenId)) {
setisCheckin(true);
} else {
setisCheckin(false);
}
},
});
}, [dataSource]);
}, []);
useEffect(() => {
const { screenHeight, safeArea = {} } = Taro.getSystemInfoSync();
// @ts-ignore
let newBottom = screenHeight - safeArea?.bottom ?? 0;
setbottomheight(newBottom);
getDetail();
}, []);
useEffect(() => {
if (openId) {
getDetail();
}
}, [openId]);
// 获取详情
const getDetail = () => {
let objParams = {
@@ -89,7 +99,27 @@ const details = () => {
id: id,
okFun: (res) => {
console.log("res", res);
setdataSource(res?.data ?? []);
setdataSource(res?.data ?? {});
console.log("dataSource ", dataSource);
setdetailStatus(res?.data?.Status ?? "");
let newpeopleArr = res?.data?.peopleArr ?? [];
if (newpeopleArr?.length > 0) {
newpeopleArr.forEach((item: any) => {
if (item?.openid === openId) {
setstatus(item?.status ?? "0");
}
});
} else {
setstatus("0");
}
// 检查是否已报名
if ((res?.data?.useridArr ?? []).includes(openId)) {
setisCheckin(true);
} else {
setisCheckin(false);
}
},
};
getTableid(objParams); //指定活动详情id
@@ -103,10 +133,10 @@ const details = () => {
label: "活动待开放",
value: "0",
},
{
label: "立即报名", //开放中
value: "1",
},
// {
// label: "立即报名", //开放中
// value: "1",
// },
{
label: "活动已取消",
value: "2",
@@ -125,17 +155,34 @@ const details = () => {
},
];
// 按钮文本
const btnContent = () => {
if (isCheckin) {
return "取消报名";
console.log("detailStatus,status,openid", detailStatus, status, openId);
let newstatusName = "立即报名";
// 开放中
if (detailStatus === "1") {
if (status === "0" ) {
newstatusName = "立即报名";
}
if (status === "4") {
newstatusName = "再次报名";
}
if (status === "2") {
newstatusName = "取消报名";
}
if (status === "1") {
newstatusName = "待审核";
}
} else {
return btnStatus.map((item: any) => {
btnStatus.forEach((item: any) => {
let status: any = dataSource?.Status;
if (item?.value === status) {
return item?.label;
newstatusName = item?.label;
}
});
}
// setstatusName(newstatusName);
return newstatusName;
};
return (
@@ -189,7 +236,11 @@ const details = () => {
<Cell
icon="friends"
title={`已报名人数 ${dataSource?.useridArr?.length ?? 0}`}
// title={`已报名人数 ${dataSource?.useridArr?.length ?? 0}`}
title={`已报名人数 ${(dataSource?.peopleArr??[]).filter((item:any)=>{
return item?.status ==='2'
})?.length>>0}`}
// isLink
// linkType="navigateTo"
// url="/pages/dashboard/index"
@@ -228,54 +279,88 @@ const details = () => {
show={show}
onClose={() => setShow(false)}
>
<View
className="wechatCode"
>
<View className="wechatCode">
<Image
showMenuByLongpress={true}
showMenuByLongpress={true}
width={300}
height={300}
src={dataSource?.qrCode}
// src='cloud://citynew-0givkbre03955d8c.6369-citynew-0givkbre03955d8c-1253655588/images/touxiang/download-1.jpg'
></Image>
<Button style={{width:'130px',marginTop:'20px'}} type="primary" round size="small" onClick={()=>{
setShow(false)
}}></Button>
<Button
style={{ width: "130px", marginTop: "20px" }}
type="primary"
round
size="small"
onClick={() => {
setShow(false);
}}
>
</Button>
</View>
</Dialog>
<Cell title="组件调用" onClick={() => setShow(true)} />
</View>
{/* 调试按钮 */}
{/* <Cell title="组件调用" onClick={() => setShow(true)} /> */}
<View
className={`detailBtn`}
style={{ bottom: `${bottomheight ?? 0}px` }}
>
{/* style={{width:'375px'}} */}
<Button
type="primary"
type={disable ? "warning" : "primary"}
block
disabled={!["1"].includes(dataSource?.Status)}
// disabled={disable}
onClick={() => {
if (isCheckin) {
if (disable) {
setShow(true);
return false;
}
// if (isCheckin) {
if (status === "2") {
// 取消报名
let peopleArrItem = (dataSource?.peopleArr ?? []).map(
(item, index, arr) => {
if (item?.openid === openId) {
return {
...item,
status: "4", //报名后取消
};
} else {
return {
...item,
};
}
}
);
updateTableid({
tableName: "details",
id: id,
objData: {
// ..._.cloneDeep(dataSource),
useridArr: [
...(dataSource?.useridArr ?? []).filter(
(value, index, arr) => {
return value !== openId;
}
),
// 删除用户报名记录
// useridArr: [
// ...(dataSource?.useridArr ?? []).filter(
// (value, index, arr) => {
// return value !== openId;
// }
// ),
// ],
// peopleArr: [
// ...(dataSource?.peopleArr ?? []).filter(
// (item, index, arr) => {
// return item?.openid !== openId;
// }
// ),
// ],
peopleArr: [
...peopleArrItem
],
},
okFun: (res: any) => {
// console.log("res333", res);
// 报名成功
Toast.success({
message: "取消成功",
selector: "#vanToast-demo2",
@@ -293,6 +378,22 @@ const details = () => {
});
return false;
}
// 放鸽子
if (status === "4") {
Toast.fail({
message: "再次报名需审核!",
selector: "#vanToast-demo2",
duration: 2000,
onClose: () => {
// 跳转到目的页面,打开新页面
setShow(true)
},
});
return false
}
let isin: any = phoneLogin();
if (!isin) {
//重新登录- 跳转到我的页面
@@ -320,14 +421,22 @@ const details = () => {
..._.cloneDeep(dataSource?.useridArr ?? []),
openId,
],
peopleArr: [
..._.cloneDeep(dataSource?.peopleArr ?? []),
{
openid: openId,
status: "1", //待审核
},
],
},
okFun: (res: any) => {
console.log("res333", res);
// 报名成功
Toast.success({
message: "报名成功",
message: "报名成功,审核中",
selector: "#vanToast-demo2",
onClose: () => {
setShow(true);
// 刷新数据
getDetail();
@@ -348,6 +457,7 @@ const details = () => {
>
{/* 立即参加 */}
{btnContent()}
{/* {`立即报名`} */}
</Button>
<Toast id="vanToast-demo2" />

View File

@@ -15,6 +15,7 @@
padding-left:5px;
}
}
.middle {
display: flex;
flex-direction: column;

View File

@@ -1,27 +1,27 @@
.homeContent{
padding: 20px;
padding-bottom: 150px;
.tagStyle{
font-size: 18px;
}
.homeContent {
padding: 20px;
padding-bottom: 150px;
.tagStyle {
font-size: 18px;
}
.tagArr{
// display: flex;
// flex-direction: row;
// align-items: center;
// justify-content: center;
padding: 50px;
height: 150px;
}
.tagArr {
// display: flex;
// flex-direction: row;
// align-items: center;
// justify-content: center;
padding: 50px;
height: 150px;
}
}
.iconStyle{
color: #95de64;
.iconStyle {
color: #95de64;
}
.topHome{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.topHome {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}

View File

@@ -340,7 +340,7 @@ const Home = () => {
</View>
{/* 轮播图 */}
<View className="demo-box">
<View className="Swiper-box">
<Swiper
height={180}
paginationColor="#426543"