From 0b95a0e4f045a2ce9412a073c4127eb4354a0166 Mon Sep 17 00:00:00 2001
From: lucky <srf428110@163.com>
Date: Fri, 23 Jul 2021 10:30:19 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=B8=8B=E6=8B=89=E5=8A=A0=E8=BD=BD?=
 =?UTF-8?q?=E5=AE=9A=E6=9C=9F=E4=BB=BB=E5=8A=A1=E4=BC=A0=E5=8F=82=EF=BC=8C?=
 =?UTF-8?q?=E6=97=B6=E9=97=B4=E6=A0=BC=E5=BC=8F=E5=8C=96=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                                  |  3 ++-
 src/components/TimeLine/TimeLine.vue          | 11 ++++----
 src/components/TimeLine/component/TimeBox.vue | 25 +++++++++++++------
 src/config/time.js                            | 17 +++++++++++++
 src/main.js                                   |  4 ++-
 src/pages/project/project.vue                 |  4 +--
 src/store/home/state.js                       | 15 -----------
 src/utils/time.js                             | 12 +++++++++
 8 files changed, 60 insertions(+), 31 deletions(-)
 create mode 100644 src/config/time.js

diff --git a/CHANGELOG.md b/CHANGELOG.md
index fff647f..7f73ad1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,4 @@
-# 0.1.0 (2021-07-22)
+# 0.1.0 (2021-07-23)
 
 ### 🌟 新功能
 范围|描述|commitId
@@ -15,6 +15,7 @@
  - | 时间轴修改状态时提示框增加 | [e841392](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/e841392)
  - | 提交到本地 | [9cbe411](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/9cbe411)
  - | 添加时间轴上下滚动 | [2b81bbc](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/2b81bbc)
+ - | 引入dayjs | [29b8b93](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/29b8b93)
  - | db store | [6414c4f](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/6414c4f)
  - | indexedDB | [687394e](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/687394e)
  - | post 封装 | [da52e94](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/da52e94)
diff --git a/src/components/TimeLine/TimeLine.vue b/src/components/TimeLine/TimeLine.vue
index 62b0abb..c4c137f 100644
--- a/src/components/TimeLine/TimeLine.vue
+++ b/src/components/TimeLine/TimeLine.vue
@@ -20,9 +20,9 @@
     id="scroll"
   >
     <!-- 时间轴 -->
-    <u-divider bg-color="#f3f4f6" v-if="topEnd">到顶啦</u-divider>
+    <u-divider bg-color="#f3f4f6" class="pt-5" v-if="topEnd">到顶啦</u-divider>
     <TimeBox />
-    <u-divider bg-color="#f3f4f6" v-if="bottomEnd">到底啦</u-divider>
+    <u-divider bg-color="#f3f4f6" class="pb-5" v-if="bottomEnd">到底啦</u-divider>
   </scroll-view>
 </template>
 
@@ -67,13 +67,14 @@ export default {
     // 滚动到底部
     async handleScrollBottom() {
       if (this.bottomEnd) return;
-      // TODO: 时间基准点=最后一个任务的开始时间+当前时间颗粒度
+      // 时间基准点=最后一个任务的开始时间+当前时间颗粒度
+      const cycle = this.$t.time.computeCycle('天');
+      const timeNode = this.$t.time.add(+this.tasks[this.tasks.length - 1].planStart, 1, cycle).valueOf();
       const downQuery = {
-        timeNode: +this.tasks[this.tasks.length - 1].planStart,
+        timeNode,
         queryType: 1,
         queryNum: 6,
       };
-      console.log('downQuery: ', downQuery);
       await this.$emit('getTasks', downQuery);
     },
 
diff --git a/src/components/TimeLine/component/TimeBox.vue b/src/components/TimeLine/component/TimeBox.vue
index 1a2f3b6..814e20a 100644
--- a/src/components/TimeLine/component/TimeBox.vue
+++ b/src/components/TimeLine/component/TimeBox.vue
@@ -1,11 +1,10 @@
 <template>
-  <view class="px-3 pb-10">
+  <view class="px-3 py-5">
     <view :key="index" v-for="(item, index) in tasks">
-      <view class="flex items-center">
+      <view class="flex">
         <TimeStatus :content="JSON.stringify(item.process)" :status="item.process" />
-        <view class="flex justify-between flex-1 ml-2">
-          <view>{{ +item.planStart | date('mm-dd hh:MM') }}</view>
-          <!-- {{ item.planDuration }} -->
+        <view class="flex justify-between items-center flex-1 ml-2">
+          <view>{{ $moment(+item.planStart).format('MM-DD HH:mm') }} {{ $t.time.formatDuration(item.planDuration) }}</view>
           <view>
             <view class="flex justify-between" style="min-width: 180rpx">
               <u-icon custom-prefix="custom-icon" name="C-bxl-redux" size="34"></u-icon>
@@ -17,7 +16,14 @@
       </view>
       <view class="border-l-2 border-gray-300 ml-3.5 my-2">
         <view class="ml-4 overflow-hidden shadow-lg task-box">
-          <u-card :show-foot="false" :show-head="false" :style="{ height: setHeight(item.panel) }" class="h-16" margin="0">
+          <u-card
+            :show-foot="false"
+            :show-head="false"
+            :style="{ height: setHeight(item.panel) }"
+            @click="changeTimeNode(item.planStart)"
+            class="h-16"
+            margin="0"
+          >
             <!-- 任务面板插件 -->
             <view slot="body">
               <view :key="pluginIndex" class="p-0 u-col-between u-skeleton" v-for="(plugin, pluginIndex) in item.plugins">
@@ -57,7 +63,7 @@ export default {
   created() {},
 
   methods: {
-    ...mapMutations('home', ['setTipsContent', 'setTipsContent']),
+    ...mapMutations('home', ['setTipsContent', 'setTipsContent', 'setTimeNode']),
 
     // 设置任务面板高度
     setHeight(panel) {
@@ -67,6 +73,11 @@ export default {
         return 'auto';
       }
     },
+
+    // 点击任务面板 修改store时间基准点
+    changeTimeNode(time) {
+      this.setTimeNode(time);
+    },
   },
 };
 </script>
diff --git a/src/config/time.js b/src/config/time.js
new file mode 100644
index 0000000..7c8ecd4
--- /dev/null
+++ b/src/config/time.js
@@ -0,0 +1,17 @@
+export default {
+  timeUnits: [
+    // 时间颗粒度
+    { id: 0, value: '毫秒' },
+    { id: 1, value: '秒' },
+    { id: 2, value: '分' },
+    { id: 3, value: '时' },
+    { id: 4, value: '天' },
+    { id: 5, value: '周' },
+    { id: 6, value: '月' },
+    { id: 7, value: '季度' },
+    { id: 8, value: '年' },
+    { id: 9, value: '年代' },
+    { id: 10, value: '世纪' },
+    { id: 11, value: '千年' },
+  ],
+};
diff --git a/src/main.js b/src/main.js
index 045017f..0d2bfa6 100644
--- a/src/main.js
+++ b/src/main.js
@@ -17,9 +17,11 @@ Vue.use(indexedDB);
 //#endif
 
 Vue.config.productionTip = false;
+Vue.prototype.$moment = dayjs;
 Vue.use(uView);
 Vue.use(Tall);
-Vue.use(dayjs);
+
+dayjs.locale('zh-cn');
 
 App.mpType = 'app';
 
diff --git a/src/pages/project/project.vue b/src/pages/project/project.vue
index ac2b4a4..ea6c5ad 100644
--- a/src/pages/project/project.vue
+++ b/src/pages/project/project.vue
@@ -23,6 +23,7 @@ export default {
 
   async onLoad(options) {
     console.log('options: ', options);
+
     // this.openPage();
     const TOKEN = uni.getStorageSync('anyringToken');
     if (!TOKEN || !this.token) {
@@ -109,8 +110,7 @@ export default {
      */
     async getPermanent() {
       try {
-        const res = await this.$u.api.getPermanent({ roleId: this.roleId });
-        console.log('res', res);
+        await this.$u.api.getPermanent({ roleId: this.roleId });
       } catch (error) {
         console.log('error: ', error);
       }
diff --git a/src/store/home/state.js b/src/store/home/state.js
index 7389c48..9b2d85d 100644
--- a/src/store/home/state.js
+++ b/src/store/home/state.js
@@ -14,21 +14,6 @@ const state = {
   roleId: '', // 当前展示查看的角色id
   timeNode: new Date().getTime(), // 时间基准点
   timeUnit: 4, // // 时间颗粒度
-  timeUnits: [
-    // 时间颗粒度
-    { id: 0, value: '毫秒' },
-    { id: 1, value: '秒' },
-    { id: 2, value: '分' },
-    { id: 3, value: '时' },
-    { id: 4, value: '天' },
-    { id: 5, value: '周' },
-    { id: 6, value: '月' },
-    { id: 7, value: '季度' },
-    { id: 8, value: '年' },
-    { id: 9, value: '年代' },
-    { id: 10, value: '世纪' },
-    { id: 11, value: '千年' },
-  ],
   tasks: [], // 定期任务
   topEnd: false, // 时间轴向上查任务到顶了
   bottomEnd: false, // 时间轴向下查任务到底了
diff --git a/src/utils/time.js b/src/utils/time.js
index 5035e34..011f7d2 100644
--- a/src/utils/time.js
+++ b/src/utils/time.js
@@ -29,6 +29,17 @@ const formatTime = beginTime => {
   return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`;
 };
 
+/**
+ * 添加一定时间的时长
+ * @param {number | date} time
+ * @param {number} num
+ * @param {string} cycle
+ */
+const add = (time, num, cycle) => {
+  const str = dayjs(time).add(num, cycle);
+  return str;
+};
+
 /**
  * 时间转换 08:00 转换成8小时0分钟
  * @param {string} time
@@ -285,6 +296,7 @@ const formatStartTimeToCycleTime = (cycle, time) => {
 export default {
   formatNumber,
   formatTime,
+  add,
   convertTime,
   secondToMinute,
   setTimestampToStr,