fix(*): add moment and countdown

package.json

@@ -57,6 +57,7 @@
     "@vue/shared": "^3.0.0-rc.4",
     "core-js": "^3.6.5",
     "flyio": "^0.6.2",
+    "moment": "^2.28.0",
     "moment-timezone": "^0.5.31",
     "node-sass": "^4.14.1",
     "pug": "^3.0.0",

src/pages/detail/detail.vue

@@ -11,12 +11,15 @@
     <title></title>
     <!-- 统计票数 -->
     <stats :content="getStats" :isDetail="true">
-      <view
-        class="text-2xl text-gray-100 font-bold w-full text-center mt-4"
-        @click="handleVote(arg, $event)"
+      <button
+          class="text-2xl text-gray-100 font-bold w-full text-center mt-4"
+          open-type="getUserInfo"
+          @getuserinfo="getuserinfo"
+          withCredentials="true"
+          hover-class="none"
       >
         投票
-      </view>
+      </button>
     </stats>
     <!-- 选手详情 -->
     <sub-title :content="title1"></sub-title>
@@ -34,8 +37,8 @@
     <!-- 帮我拉票 -->
     <view class="text-center">
       <view
-        class="inline-block text-gray-100 text-xl my-2 p-2 border-r-0 border-l-0 border-t-0 border-b-2 border-solid border-orange-500"
-        @click="share"
+          class="inline-block text-gray-100 text-xl my-2 p-2 border-r-0 border-l-0 border-t-0 border-b-2 border-solid border-orange-500"
+          @click="share"
       >
         帮我拉票
       </view>
@@ -43,13 +46,13 @@
 
     <!-- 返回 -->
     <navigator
-      url="/pages/index/index"
-      open-type="switchTab"
-      hover-class="other-navigator-hover"
+        :url="'/pages/index/index?id='+actId"
+        open-type="reLaunch"
+        hover-class="other-navigator-hover"
     >
       <view class="text-center">
         <view
-          class="inline-block text-gray-100 text-xl my-2 p-2 border-r-0 border-l-0 border-t-0 border-b-2 border-solid border-orange-500"
+            class="inline-block text-gray-100 text-xl my-2 p-2 border-r-0 border-l-0 border-t-0 border-b-2 border-solid border-orange-500"
         >
           返回
         </view>
@@ -68,13 +71,15 @@ import voteItem from "@/components/vote-item/vote-item.vue"
 import voteFooter from "@/components/footer/footer.vue"
 import subTitle from "@/components/sub-title/sub-title.vue"
 import detailVideo from "@/components/detail-video/detail-video.vue"
-import { items } from "@/mock/store"
-import { Iitem, Iinfo } from "@/common/interface"
+import {items} from "@/mock/store"
+import {Iinfo, Iitem} from "@/common/interface"
+
 export default Vue.extend({
   data() {
     return {
       items,
       id: 0,
+      actId: 0,
       item: <Iitem>{},
       title1: "选手详情",
       title2: "选手风采",
@@ -83,10 +88,14 @@ export default Vue.extend({
   },
   onLoad(query) {
     console.log(query)
-
+    // 保存活动id
+    const {currentActId}: any = getApp().globalData
+    this.actId = currentActId
+    // 筛选item
     this.id = +query?.id || 1
     let [item] = this.items.filter((el) => el.id === this.id)
     this.item = <Iitem>item
+    // 设置标题
     uni.setNavigationBarTitle({
       title: `我是${this.id}号，${this.item?.name}, 正在参加伊婉你最美`,
     })
@@ -109,12 +118,29 @@ export default Vue.extend({
   },
   methods: {
     // TODO：生成分享海报
-    share() {},
+    share() {
+      console.log("帮我拉票")
+    },
     // TODO：处理投票
     handleVote() {
       console.log("投票")
     },
-  },
+    getuserinfo: () => {
+      uni.login({
+        provider: "weixin",
+        success: loginRes => {
+          console.log(loginRes)
+          // 获取用户信息
+          uni.getUserInfo({
+            provider: "weixin",
+            success: infoRes => {
+              console.log("用户信息为：",infoRes)
+            }
+          })
+        }
+      })
+    },
+  }
 })
 </script>
 

src/pages/index/index.vue

@@ -13,8 +13,10 @@
     <title :content="activity.name"></title>
     <!-- 统计区域 -->
     <stats :content="activity.stats">
-      <view class="mt-2 p-2 text-gray-100 text-center diff-time-box">
-        活动结束时间还有{{ lastdate }}
+      <view class="mt-2 p-2 text-gray-100 text-center diff-time-box flex justify-center">
+        活动结束时间还有
+        <uni-countdown color="#fff" background-color="" splitorColor="#fff" :day="day" :hour="hour" :minute="min"
+                       :second="sec"></uni-countdown>
       </view>
     </stats>
     <!-- 规则区域 -->
@@ -55,16 +57,21 @@ import voteRule from "@/components/vote-rule/vote-rule.vue"
 import searchBar from "@/components/search-bar/search-bar.vue"
 import voteList from "@/components/vote-list/vote-list.vue"
 import voteFooter from "@/components/footer/footer.vue"
-import request from "@/utils/request"
-import { getActivity } from "@/servise/activates"
-import { getItems } from "@/servise/items"
-import { items, activities } from "@/mock/store"
+import uniCountdown from "@/components/uni-countdown/uni-countdown.vue"
+import {getActivity} from "@/servise/activates"
+import {getItems} from "@/servise/items"
+import {activities, items} from "@/mock/store"
+import moment from "moment"
+moment().locale("cn")
 export default Vue.extend({
   data() {
     return {
       items,
       activity: {},
-      lastdate: "2天",
+      day: 0,
+      hour: 0,
+      min: 1,
+      sec: 30,
       itemType: "vote",
       display: false,
     }
@@ -73,7 +80,7 @@ export default Vue.extend({
     /**
      * 1. 下载活动信息 通过活动列表页传入的id筛选
      * 2. 下载选手信息
-     * TODO: 思考做成一个接口
+     * TODO: 处理倒记时
      */
     // 1. 下载活动信息
     this._getActivity(query)
@@ -82,6 +89,16 @@ export default Vue.extend({
     // 3. 存入当前活动id
     let globalData: any = getApp().globalData
     globalData.currentActId = +query?.id
+    // 4. 计算时间
+    // 获取活动时间
+    let {startTime, endTime}: any = this.activity
+    //  获取当前时间
+
+    let now = moment()
+    startTime = moment(startTime,"YYYY-MM-DD HH:mm")
+    endTime = moment(endTime,"YYYY-MM-DD HH:mm")
+    console.log(`now:${now}, startTime:${startTime}, endTime:${endTime}`)
+
   },
   methods: {
     // FIXME 获取活动信息
@@ -110,6 +127,7 @@ export default Vue.extend({
     searchBar,
     voteList,
     voteFooter,
+    uniCountdown,
   },
 })
 </script>
@@ -123,6 +141,7 @@ export default Vue.extend({
   border: none;
   border-radius: 0;
 }
+
 .bg-color {
   background-image: $rule-bg-base64-code;
   background-size: 100%;

yarn.lock

@@ -7649,6 +7649,11 @@ moment-timezone@^0.5.31:
   resolved "https://registry.npm.taobao.org/moment/download/moment-2.27.0.tgz?cache=0&sync_timestamp=1592843342961&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmoment%2Fdownload%2Fmoment-2.27.0.tgz#8bff4e3e26a236220dfe3e36de756b6ebaa0105d"
   integrity sha1-i/9OPiaiNiIN/j423nVrbrqgEF0=
 
+moment@^2.28.0:
+  version "2.28.0"
+  resolved "https://registry.npm.taobao.org/moment/download/moment-2.28.0.tgz#cdfe73ce01327cee6537b0fafac2e0f21a237d75"
+  integrity sha1-zf5zzgEyfO5lN7D6+sLg8hojfXU=
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npm.taobao.org/move-concurrently/download/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"