fix: api 存storage

CHANGELOG.md

@@ -1,8 +1,9 @@
-# 0.1.0 (2021-08-20)
+# 0.1.0 (2021-08-23)
 
 ### 🌟 新功能
 范围|描述|commitId
 --|--|--
+ - | api封装 | [7d4edfc](https://dd.tall.wiki/gitea/ccsens_fe/TALL-MUI-3/commits/7d4edfc)
  - | cache indexedDB处理 | [3388967](https://dd.tall.wiki/gitea/ccsens_fe/TALL-MUI-3/commits/3388967)
  calendar, tall.js | 上下滑动切换日历的模式,tall.js中domain根据环境变量切换 | [364e25d](https://dd.tall.wiki/gitea/ccsens_fe/TALL-MUI-3/commits/364e25d)
  - | db store | [6414c4f](https://dd.tall.wiki/gitea/ccsens_fe/TALL-MUI-3/commits/6414c4f)

src/components/Plugin/Plugin.vue

@@ -81,10 +81,11 @@ export default {
     // 获取插件信息
     async getPlugin() {
       const { pluginId, styleType } = this;
-      const data = await this.$u.api.getOtherPlugin({
-        pluginId,
-        styleType,
-      });
+      const params = { pluginId, styleType };
+      this.$t.$q.getOtherPlugin(params, (err, data) => {
+        if (err) {
+          console.error('err: ', err);
+        } else {
           if (!data || !data.id) return;
           const reg = /data-root=["|']?(\w+)["|']?/gi;
           let uuid = '';
@@ -103,6 +104,8 @@ export default {
             const str = data.js.replace(new RegExp(uuid, 'g'), `p${this.pluginTaskId}`);
             this.handleDom(str);
           }
+        }
+      });
 
       // if (data.js) {
       //   if (reg.test(data.js)) {

src/pages/project/project.vue

@@ -193,30 +193,31 @@ export default {
 
     // 切换了 颗粒度 || 角色时候 获取初始定期任务
     getInitTasks() {
+      // 预加载 上下的定期任务
+      function fn(that) {
+        const detailId = that.tasks.findIndex(task => task.detailId);
+        console.log('detailId: ', detailId);
+        if (detailId !== -1) {
+          that.$nextTick(() => {
+            // 向上拿数据
+            const { tasks, timeGranularity } = that;
+            that.getTasks({ timeNode: +tasks[0].planStart, queryType: 0, queryNum: 6 });
+            // 向下拿数据
+            const nextQueryTime = +that.$t.time.add(+tasks[tasks.length - 1].planStart, 1, timeGranularity);
+            that.getTasks({ timeNode: nextQueryTime, queryType: 1, queryNum: 6 });
+          });
+        } else {
+          // 没有任务 上下显示时间刻度
+          // 向上加载
+          // that.setPrevTasks();
+          // // 向下加载
+          // that.setNextTasks();
+        }
+      }
       // 根据时间基准点和角色查找定期任务
       this.getTasks({ queryType: 0 });
       // 根据项目id获取角色列表
-      this.getTasks({ queryType: 1 });
-
-      // 预加载 上下的定期任务
-      // const detailId = this.tasks.findIndex(task => task.detailId);
-      // console.log('detailId: ', detailId);
-      // if (detailId !== -1) {
-      //   this.$nextTick(() => {
-      //     // 向上拿数据
-      //     const { tasks, timeGranularity } = this;
-      //     this.getTasks({ timeNode: +tasks[0].planStart, queryType: 0, queryNum: 6 });
-      //     // 向下拿数据
-      //     const nextQueryTime = +this.$t.time.add(+tasks[tasks.length - 1].planStart, 1, timeGranularity);
-      //     this.getTasks({ timeNode: nextQueryTime, queryType: 1, queryNum: 6 });
-      //   });
-      // } else {
-      //   // 没有任务 上下显示时间刻度
-      //   // 向上加载
-      //   this.setPrevTasks();
-      //   // 向下加载
-      //   this.setNextTasks();
-      // }
+      this.getTasks({ queryType: 1 }, fn);
     },
 
     // 设置 初始显示角色信息
@@ -239,9 +240,10 @@ export default {
      * @param {string} query.queryNum 查找颗粒度数量 默认3个
      * @param {string} query.queryType 0向上查找 1向下查找(默认) 下查包含自己，上查不包含
      */
-    getTasks(query) {
-      this.setShowSkeleton(true);
-      const { roleId, timeNode, timeUnit, projectId } = this;
+    getTasks(query, fn) {
+      const that = this;
+      that.setShowSkeleton(true);
+      const { roleId, timeNode, timeUnit, projectId } = that;
       const params = {
         roleId,
         timeNode: query.timeNode || timeNode,
@@ -250,18 +252,24 @@ export default {
         queryType: query.queryType,
         projectId,
       };
-      this.$t.$q.getRegularTask(params, (err, data) => {
+
+      that.$t.$q.getRegularTask(params, function (err, data) {
         if (err) {
-          this.setShowSkeleton(false);
+          that.setShowSkeleton(false);
           console.error('err: ', err);
         } else {
-          this.setShowSkeleton(false);
+          console.log('++++');
+          that.setShowSkeleton(false);
           // 0 -> 向上  1 -> 向下
           if (data && data.length) {
-            console.log('data: ', data);
-            this.replacePrevData(data, params.queryType);
+            console.log(1);
+            that.replacePrevData(data, params.queryType);
           } else {
-            params.queryType === 0 ? this.setPrevTasks() : this.setNextTasks();
+            params.queryType === 0 ? that.setPrevTasks() : that.setNextTasks();
+          }
+          if (that.tasks.length && fn) {
+            console.log(2);
+            fn(that);
           }
         }
       });

src/utils/cache.js

@@ -10,6 +10,66 @@ export const filter = {
     if (!data || !data.length) return [];
     return data.filter(item => start <= +item.endTime && end >= +item.startTime);
   },
+
+  /**
+   * 角色 过滤获取到的数据 根据开始截止时间
+   * @param {object} data 缓存拿到的数据
+   * @returns
+   */
+  roles(data) {
+    if (!data || !data.length) return [];
+    return data;
+  },
+
+  /**
+   * 定期任务 过滤获取到的数据 根据开始截止时间
+   * @param {object} data 缓存拿到的数据
+   * @param {number} timeNode 时间基准点 ms
+   * @param {number} queryNum 颗粒度数量
+   * @param {number} timeUnit 时间颗粒度
+   * @returns
+   */
+  planTask(data, timeNode, queryNum, timeUnit) {
+    if (!data || !data.length) return [];
+    // 计算颗粒度 对应的 dayjs add 的单位
+    const target = uni.$t.timeConfig.timeUnits.find(item => item.id === timeUnit);
+    // TODO: 缺少通过时间颗粒度筛选数据 任务没有返回时间颗粒度标签
+    const start = uni.$t.time.add(timeNode, -queryNum, target.granularity).valueOf();
+    const end = uni.$t.time.add(timeNode, +queryNum - 1, target.granularity).valueOf();
+    return data.filter(item => start <= +item.endTime && end >= +item.startTime);
+  },
+
+  /**
+   * 永久日常任务 过滤获取到的数据 根据开始截止时间
+   * @param {object} data 缓存拿到的数据
+   * @returns
+   */
+  fixedTasks(data) {
+    if (!data || !data.length) return [];
+    return data;
+  },
+
+  /**
+   * 日常任务 过滤获取到的数据 根据开始截止时间
+   * @param {object} data 缓存拿到的数据
+   * @param {number} timeNode 时间基准点 ms
+   * @returns
+   */
+  dailyTask(data, timeNode) {
+    if (!data || !data.length) return [];
+    // TODO: 缺少通过时间颗粒度筛选数据 任务没有返回时间颗粒度标签
+    return data.filter(item => timeNode <= +item.endTime && timeNode >= +item.startTime);
+  },
+
+  /**
+   * 插件 过滤获取到的数据 根据插件id
+   * @param {object} data 缓存拿到的数据
+   * @returns
+   */
+  plugin(data) {
+    if (!data || !data.id) return null;
+    return data;
+  },
 };
 
 export default {
@@ -54,6 +114,7 @@ export default {
           }
         });
       }
+      uni.$t.cache.checkCapacity();
       uni.$t.storage.setStorage('projects', locals);
     } catch (error) {
       console.error('error: ', error);
@@ -69,7 +130,7 @@ export default {
   async getShowRole(projectId) {
     try {
       const data = await uni.$t.storage.getStorage(`roles_${projectId}`);
-      return JSON.parse(data);
+      return filter.roles(JSON.parse(data));
     } catch (error) {
       console.error('error: ', error);
       return null;
@@ -111,6 +172,7 @@ export default {
           }
         });
       }
+      uni.$t.cache.checkCapacity();
       uni.$t.storage.setStorage(`roles_${projectId}`, locals);
     } catch (error) {
       console.error('error: ', error);
@@ -127,7 +189,7 @@ export default {
   async getStorageRegularTask(params) {
     try {
       const data = await uni.$t.storage.getStorage(`plan_task_${params.projectId}_${params.roleId}`);
-      return JSON.parse(data);
+      return filter.planTask(JSON.parse(data), params.timeNode, params.queryNum, params.timeUnit);
     } catch (error) {
       console.error('error: ', error);
       return [];
@@ -159,6 +221,7 @@ export default {
           }
         });
       }
+      uni.$t.cache.checkCapacity();
       uni.$t.storage.setStorage(`plan_task_${params.projectId}_${params.roleId}`, locals);
     } catch (error) {
       console.error('error: ', error);
@@ -174,8 +237,8 @@ export default {
    */
   async getStoragePermanent(params) {
     try {
-      const data = await uni.$t.storage.getStorage(`fixed_tasks_${params.projectId}`);
-      return JSON.parse(data);
+      const data = await uni.$t.storage.getStorage(`fixed_tasks_${params.projectId}_${params.roleId}`);
+      return filter.fixedTasks(JSON.parse(data));
     } catch (error) {
       console.error('error: ', error);
       return [];
@@ -189,7 +252,7 @@ export default {
   putStoragePermanent(params, data) {
     try {
       if (!data || !data.length) return; // 服务端没数据不做操作
-      let value = uni.$t.storage.getStorageSync(`fixed_tasks_${params.projectId}`);
+      let value = uni.$t.storage.getStorageSync(`fixed_tasks_${params.projectId}_${params.roleId}`);
       let locals = value ? JSON.parse(value) : [];
       if (!locals || !locals.length) {
         // 本地没数据
@@ -208,23 +271,23 @@ export default {
           }
         });
       }
-      uni.$t.storage.setStorage(`fixed_tasks_${params.projectId}`, locals);
+      uni.$t.cache.checkCapacity();
+      uni.$t.storage.setStorage(`fixed_tasks_${params.projectId}_${params.roleId}`, locals);
     } catch (error) {
       console.error('error: ', error);
-      uni.$t.storage.setStorage(`fixed_tasks_${params.projectId}`, []);
+      uni.$t.storage.setStorage(`fixed_tasks_${params.projectId}_${params.roleId}`, []);
     }
   },
 
   /**
    * 日常任务 获取
-   * @param {number} startTime
-   * @param {number} endTime
+   * @param {number} timeNode
    * @returns
    */
   async getDailyTask(params) {
     try {
-      const data = await uni.$t.storage.getStorage(`variable_tasks_${params.projectId}`);
-      return JSON.parse(data);
+      const data = await uni.$t.storage.getStorage(`variable_tasks_${params.projectId}_${params.roleId}`);
+      return filter.dailyTask(JSON.parse(data), params.timeNode);
     } catch (error) {
       console.error('error: ', error);
       return [];
@@ -238,29 +301,82 @@ export default {
   putDailyTask(params, data) {
     try {
       if (!data || !data.length) return; // 服务端没数据不做操作
-      let value = uni.$t.storage.getStorageSync(`variable_tasks_${params.projectId}`);
+      let value = uni.$t.storage.getStorageSync(`variable_tasks_${params.projectId}_${params.roleId}`);
       let locals = value ? JSON.parse(value) : [];
       if (!locals || !locals.length) {
         // 本地没数据
         locals = data || [];
       } else {
         // 本地有数据
-        data.forEach((item, index) => {
+        data.forEach(item => {
           let localData = locals.find(local => item.detailId === local.detailId);
           if (localData) {
             // 有相同数据  就用新的data里的数据
             localData = item;
           } else {
-            locals.splice(index, 1);
             // 没有就直接存本地
             locals.push(item);
           }
         });
       }
-      uni.$t.storage.setStorage(`variable_tasks_${params.projectId}`, locals);
+      uni.$t.cache.checkCapacity();
+      uni.$t.storage.setStorage(`variable_tasks_${params.projectId}_${params.roleId}`, locals);
     } catch (error) {
       console.error('error: ', error);
-      uni.$t.storage.setStorage(`variable_tasks_${params.projectId}`, []);
+      uni.$t.storage.setStorage(`variable_tasks_${params.projectId}_${params.roleId}`, []);
     }
   },
+
+  /**
+   * 插件信息 获取
+   * @param {string} pluginId
+   * @returns
+   */
+  async getPlugin(pluginId) {
+    try {
+      const data = await uni.$t.storage.getStorage(`plugin_${pluginId}`);
+      return filter.plugin(JSON.parse(data));
+    } catch (error) {
+      console.error('error: ', error);
+      return null;
+    }
+  },
+
+  /**
+   * 插件信息 存
+   * @param {string} pluginId
+   * @param {object} data
+   */
+  putPlugin(pluginId, data) {
+    try {
+      if (!data || !data.id) return; // 服务端没数据不做操作
+      let value = uni.$t.storage.getStorageSync(`plugin_${pluginId}`);
+      let locals = value ? JSON.parse(value) : null;
+      if (!locals || !locals.length) {
+        // 本地没数据
+        locals = data || null;
+      } else {
+        // 本地有数据
+        locals = data;
+      }
+      uni.$t.cache.checkCapacity();
+      uni.$t.storage.setStorage(`plugin_${pluginId}`, locals);
+    } catch (error) {
+      console.error('error: ', error);
+      uni.$t.storage.setStorage(`plugin_${pluginId}`, null);
+    }
+  },
+
+  // 检测local Storage容量
+  checkCapacity() {
+    // if (window.localStorage) {
+    //   console.log('浏览器不支持localStorage ');
+    //   const capacity = JSON.stringify(localStorage).length;
+    //   console.log('capacity: ', capacity);
+    //   let max = 1024 * 1024 * 5;
+    //   if (capacity >= max) {
+    //     uni.$t.storage.clearStorage();
+    //   }
+    // }
+  },
 };

src/utils/cacheAndRequest.js

@@ -80,7 +80,6 @@ export default {
     uni.$t.cache
       .getStorageRegularTask(params)
       .then(data => {
-        console.log('cache data: ', data);
         !remote && fn(null, data);
       })
       .catch(err => !remote && fn(err));
@@ -90,7 +89,6 @@ export default {
       uni.$u.api
         .getRegularTask(params)
         .then(data => {
-          console.log('api data: ', data);
           remote = true;
           fn(null, data);
           // 存api到cache里
@@ -122,7 +120,7 @@ export default {
           remote = true;
           fn(null, data);
           // 存api到cache里
-          uni.$t.cache.putStoragePermanent(data);
+          uni.$t.cache.putStoragePermanent(params, data);
         })
         .catch(err => fn(err));
     });
@@ -150,7 +148,35 @@ export default {
           remote = true;
           fn(null, data);
           // 存api到cache里
-          uni.$t.cache.putDailyTask(data);
+          uni.$t.cache.putDailyTask(params, data);
+        })
+        .catch(err => fn(err));
+    });
+  },
+
+  /**
+   * 获取插件信息
+   * @param {object} params 提交的参数
+   */
+  getOtherPlugin(params, fn) {
+    let remote = false;
+    // 有缓存 且 服务端数据未返回 就先返回缓存
+    uni.$t.cache
+      .getPlugin(params.pluginId)
+      .then(data => {
+        !remote && fn(null, data);
+      })
+      .catch(err => !remote && fn(err));
+
+    waitTokenRequest(() => {
+      // 拿到api数据后 再用api的数据
+      uni.$u.api
+        .getOtherPlugin(params)
+        .then(data => {
+          remote = true;
+          fn(null, data);
+          // 存api到cache里
+          uni.$t.cache.putPlugin(params.pluginId, data);
         })
         .catch(err => fn(err));
     });

src/utils/storage.js

@@ -39,6 +39,7 @@ export default {
    * @param {*} data
    */
   setStorage(key, data) {
+    uni.$t.storage.checkCapacity();
     return new Promise((resolve, reject) => {
       const value = typeof data === 'string' ? data : JSON.stringify(data);
       uni.setStorage({
@@ -97,4 +98,19 @@ export default {
   clearStorage() {
     uni.clearStorage();
   },
+
+  // 检测local Storage容量 超出容量清空数据缓存
+  checkCapacity() {
+    if (!window.localStorage) {
+      console.log('浏览器不支持localStorage ');
+      return;
+    }
+    const capacity = JSON.stringify(localStorage).length;
+    console.log('capacity: ', capacity);
+    let max = 1024 * 1024 * 5;
+    if (capacity >= max) {
+      console.log('清空');
+      uni.$t.storage.clearStorage();
+    }
+  },
 };