静态页面

src/components/ActivityListItem/index.jsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react'
 import Taro from '@tarojs/taro'
+import toolclass from '@/utils/toolclass.js'
 import '@/assets/css/reset.less'
 import '@/assets/css/iconfont.less'
 import './index.less'
@@ -8,6 +9,26 @@ export default function ActivityListItem (props) {
 
   const { Data } = props
 
+  const BtnStatus = () => { // 按钮状态
+    let StartTime = new Date(Data.enlistStart).getTime()
+    let EndTime = new Date(Data.enlistEnd).getTime()
+    let StopTime = new Date(Data.endDate).getTime()
+    let Now = Date.now()
+    if (StartTime > Now) {
+      return `未开始`
+    }
+    if (StartTime <= Now && EndTime > Now) {
+      return !!Data.isSign ? `已报名` : `去报名`
+    }
+    if (EndTime <= Now && StopTime > Now) {
+      return `进行中`
+    }
+    if (StopTime <= Now) {
+      return `已结束`
+    }
+    return ``
+  }
+
   return (
     <view className='ActivityListItem' onClick={() => { Taro.navigateTo({ url: `/pages/HuoDong/HuoDongDetail/index?id=${Data.dynamicId}` }) }}>
       <view className='Img'>
@@ -16,9 +37,9 @@ export default function ActivityListItem (props) {
       <view className='Info flex-h'>
         <view className='flex-item'>
           <text>{Data.title}</text>
-          <text>参与截止时间：{Data.enlistEnd}</text>
+          <text>参与截止时间：{toolclass.FormatDate(Data.enlistEnd)}</text>
         </view>
-        <text className='active'>未开始</text>
+        <text className={BtnStatus() === '未开始' || BtnStatus() === '去报名' ? 'active' : ''}>{BtnStatus()}</text>
       </view>
     </view >
   )

src/pages/HuoDong/HuoDongDetail/index.css

@@ -81,6 +81,7 @@
   font-size: 28px;
   color: #F35844;
   line-height: 40px;
+  margin-left: 10px;
 }
 .HuoDongDetail > .Info > .Desc {
   position: relative;

src/pages/HuoDong/HuoDongDetail/index.jsx

@@ -4,6 +4,7 @@ import { RichText, Button } from '@tarojs/components'
 import request, { apis } from '@/utils/request'
 import { useModel } from '@/store'
 import GetUserPhone from '@/components/GetUserPhone/index'
+import toolclass from '@/utils/toolclass.js'
 import '@/assets/css/reset.less'
 import '@/assets/css/iconfont.less'
 import './index.less'
@@ -85,7 +86,7 @@ export default function HuoDongDetail (props) {
             <text className='Tips'>{ActivityDetail.enlisted}人已报名</text>
             <view className='flex-h'>
               <text>活动时间：</text>
-              <view className='flex-item'>{ActivityDetail.startDate}<text>限{ActivityDetail.enlistNum}人</text></view>
+              <view className='flex-item'>{toolclass.FormatDate(ActivityDetail.startDate)}<text>限{ActivityDetail.enlistNum}人</text></view>
             </view>
             <view className='flex-h'>
               <text>活动地址：</text>
@@ -93,7 +94,7 @@ export default function HuoDongDetail (props) {
             </view>
             <view className='flex-h'>
               <text>报名截止：</text>
-              <view className='flex-item'>{ActivityDetail.enlistEnd}</view>
+              <view className='flex-item'>{toolclass.FormatDate(ActivityDetail.enlistEnd)}</view>
             </view>
           </view>
 

src/pages/HuoDong/HuoDongDetail/index.less

@@ -87,6 +87,7 @@
             font-size: 28px;
             color: #F35844;
             line-height: 40px;
+            margin-left: 10px;
           }
         }
       }

src/pages/ShouYe/HuoDong/index.jsx

@@ -6,7 +6,7 @@ import '@/assets/css/reset.less'
 import '@/assets/css/iconfont.less'
 import './index.less'
 
-export default function ShouYeHuoDong (props) {
+export default function ShouYeHuoDong () {
 
   const [IsPullUp, setIsPullUp] = useState(false)
   const [IsPullDown, setIsPullDown] = useState(false)

src/utils/toolclass.js

@@ -0,0 +1,17 @@
+const toolclass = {
+  FormatDate: (date = null) => { // 格式化时间
+    if (date !== null) {
+      date = new Date(date)
+      let YY = date.getFullYear()
+      let MM = date.getMonth() + 1
+      let DD = date.getDate()
+      let hh = date.getHours()
+      let mm = date.getMinutes()
+      let ss = date.getSeconds()
+      return `${YY}-${MM > 9 ? MM : `0${MM}`}-${DD > 9 ? DD : `0${DD}`} ${hh > 9 ? hh : `0${hh}`}:${mm > 9 ? mm : `0${mm}`}:${ss > 9 ? ss : `0${ss}`}`
+    } else {
+      return ''
+    }
+  }
+}
+export default toolclass