Display,cache localstorage

src/components/media/qcloud/Controls.vue

@@ -14,7 +14,7 @@
         },
         data () {
             return {
-                definition: 10,
+                definition: 20,
                 breakPoint: 0,
                 currentTime: 0,
                 cache: Cache(`qcloud.vod.${this.fileId}.currentTime`)
@@ -93,7 +93,7 @@
             }
         },
         watch: {
-            definition(v) {
+            definition (v) {
                 this.changeSrc(this.files.find(a => a.definition === v))
             }
         }

src/components/mobile/model/Display.vue

@@ -0,0 +1,40 @@
+<template>
+    <div>
+        <p style="text-align: center" v-if="loading">
+            <inline-loading></inline-loading>
+        </p>
+        <slot v-bind="{object, model}" v-if="object"></slot>
+    </div>
+</template>
+<script>
+    import {InlineLoading} from 'vux'
+    import Model from 'vue-django/src/components/model/Model'
+    export default{
+        props: {
+            id: Number,
+            appModel: String
+        },
+        data () {
+            return {
+                loading: true,
+                model: Model(this.appModel),
+                object: undefined
+            }
+        },
+        components: {InlineLoading},
+        created () {
+            this.init()
+        },
+        methods: {
+            init () {
+                this.model.id = this.id
+                this.model.loadData().then(data => {
+                    this.object = {...data}
+                }).finally(() => {
+                    this.loading = false
+                })
+            }
+        },
+        computed: {}
+    }
+</script>

src/components/mobile/model/List.vue

@@ -7,11 +7,11 @@
                 <slot name="icon" v-bind="scope"></slot>
             </template>
         </cells>
-        <load-more :tip="tip" :show-loading="loading"></load-more>
+        <load-more :tip="tip" :show-loading="loading" v-if="pageSize < count"></load-more>
     </div>
 </template>
 <script>
-    import {LoadMore} from 'vux'
+    import {LoadMore, InlineLoading} from 'vux'
     import Panel from './Panel.vue'
     import Cells from './Cells.vue'
     import {Register} from '../../../utils/app_model'
@@ -31,7 +31,7 @@
                 model: Register.get(this.appModel)
             }
         },
-        components: {Panel, Cells, LoadMore},
+        components: {Panel, Cells, LoadMore, InlineLoading},
         created () {
             this.load()
         },
@@ -42,7 +42,9 @@
                     qd.owner_type = this.owner.options.content_type_id
                     qd.owner_id = this.owner.id
                 }
+                this.loading = true
                 return this.model.query(qd).then(data => {
+                    this.loading = false
                     this.count = data.count
                     this.data = data.results
                 })
@@ -55,7 +57,7 @@
         },
         computed: {
             tip () {
-                return this.pageSize < this.count ? '加载中' : '暂无数据'
+                return this.pageSize < this.count ? '加载中' : '没有了'
             }
         },
         watch: {

src/utils/cache.js

@@ -4,7 +4,16 @@
 import {throttle} from 'lodash'
 export default function (key, interval) {
     function saveAtOnce (v) {
-        localStorage.setItem(key, v)
+        try {
+            localStorage.setItem(key, v)
+        } catch (e) {
+            if (e.name === 'QuotaExceededError') {
+                console.warn('超出本地存储限额！')
+                // 如果历史信息不重要了，可清空后再设置
+                localStorage.clear()
+                localStorage.setItem(key, v)
+            }
+        }
     }
 
     let save = throttle(saveAtOnce, interval || 1000)

src/utils/duration.js

@@ -2,23 +2,32 @@
  * Created by denishuang on 2020/2/8.
  */
 
-export default function () {
+export default function (key) {
+    let ms = localStorage.getItem(key)
+    ms = (ms && Math.floor(ms)) || 0
+    console.debug(key, localStorage.getItem(key))
     return {
         lastTime: undefined,
-        ms: 0,
+        ms: ms,
         run () {
             if (this.lastTime === undefined) {
                 this.lastTime = new Date()
             }
             let dt = new Date()
-            this.ms += dt - this.lastTime
+            this.setMs(this.ms + (dt - this.lastTime))
             this.lastTime = dt
         },
         pause () {
             this.lastTime = undefined
         },
         clear () {
-            this.ms = 0
+            this.setMs(0)
+        },
+        setMs (ms) {
+            this.ms = ms
+            if (key) {
+                localStorage.setItem(key, ms)
+            }
         },
         getSeconds () {
             return Math.floor(this.ms / 1000)

src/utils/filters.js

@@ -4,30 +4,29 @@
 import {formatRelative, subDays, distance_in_words_to_now} from 'date-fns'
 import zh_cn from 'date-fns/locale/zh_cn'
 
-function dateTime(t) {
-    if(typeof t === 'string' && !t.includes('+')){
+function dateTime (t) {
+    if (typeof t === 'string' && !t.includes('+')) {
         t = t.concat('+08:00')
     }
     return new Date(t)
 }
 
-export function date2now(d) {
-    "use strict";
+export function date2now (d) {
     return d
 }
 
-export function date(d) {
+export function date (d) {
     return distance_in_words_to_now(d, {locale: zh_cn})
 }
 
-function pluralize(time, label) {
+function pluralize (time, label) {
     if (time === 1) {
         return time + label
     }
     return time + label + 's'
 }
 
-export function timeAgo(time) {
+export function timeAgo (time) {
     const between = Date.now() / 1000 - Number(time)
     if (between < 3600) {
         return pluralize(~~(between / 60), ' minute')
@@ -38,7 +37,7 @@ export function timeAgo(time) {
     }
 }
 
-export function parseTime(time, cFormat) {
+export function parseTime (time, cFormat) {
     if (arguments.length === 0) {
         return null
     }
@@ -102,8 +101,8 @@ export function formatTime(time, option) {
     }
 }
 
-/* 数字 格式化*/
-export function nFormatter(num, digits) {
+/* 数字 格式化 */
+export function nFormatter (num, digits) {
     const si = [
         {value: 1E18, symbol: 'E'},
         {value: 1E15, symbol: 'P'},
@@ -120,17 +119,17 @@ export function nFormatter(num, digits) {
     return num.toString()
 }
 
-export function html2Text(val) {
+export function html2Text (val) {
     const div = document.createElement('div')
     div.innerHTML = val
     return div.textContent || div.innerText
 }
 
-export function toThousandslsFilter(num) {
+export function toThousandslsFilter (num) {
     return (+num || 0).toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ','))
 }
 
-export function percent(value) {
+export function percent (value) {
     let a = value && (value * 100).toFixed(2)
     return `${a}%`
 }
@@ -152,4 +151,4 @@ export default {
     toThousandslsFilter,
     percent,
     duration
-}
+}