From 72c991b62bdec51abf0deace86209d92eea2769e Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Sun, 29 Jan 2023 00:13:08 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9C=80=E8=BF=91=E7=AD=BE=E5=88=B0=E8=AE=B0?=
 =?UTF-8?q?=E5=BD=95=E5=8A=A0=E8=BD=BD=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../js/pages/manage/setting/checkin.vue       | 45 +++++++++++--------
 resources/assets/sass/pages/page-setting.scss | 10 +++++
 2 files changed, 37 insertions(+), 18 deletions(-)

diff --git a/resources/assets/js/pages/manage/setting/checkin.vue b/resources/assets/js/pages/manage/setting/checkin.vue
index be7b21e10..ec72c6654 100644
--- a/resources/assets/js/pages/manage/setting/checkin.vue
+++ b/resources/assets/js/pages/manage/setting/checkin.vue
@@ -2,7 +2,10 @@
     <div class="setting-item submit">
         <Form ref="formData" label-width="auto" @submit.native.prevent>
             <Divider orientation="left" style="margin-top:0">{{$L('签到记录')}}</Divider>
-            <Timeline class="setting-checkin-lately">
+            <div v-if="latelyLoad > 0" class="setting-checkin-load">
+                <Loading/>
+            </div>
+            <Timeline v-else class="setting-checkin-lately">
                 <TimelineItem
                     v-for="(item, key) in latelyData"
                     :key="key"
@@ -18,23 +21,25 @@
             <Alert>
                 {{$L('设备连接上指定路由器（WiFi）后自动签到。')}}
             </Alert>
-            <Row class="setting-template">
-                <Col span="12">{{$L('设备MAC地址')}}</Col>
-                <Col span="12">{{$L('备注')}}</Col>
-            </Row>
-            <Row v-for="(item, key) in formData" :key="key" class="setting-template">
-                <Col span="12">
-                    <Input
-                        v-model="item.mac"
-                        :maxlength="20"
-                        :placeholder="$L('请输入设备MAC地址')"
-                        clearable
-                        @on-clear="delDatum(key)"/>
-                </Col>
-                <Col span="12">
-                    <Input v-model="item.remark" :maxlength="100" :placeholder="$L('备注')"/>
-                </Col>
-            </Row>
+            <div class="setting-checkin-row">
+                <Row class="setting-template">
+                    <Col span="12">{{$L('设备MAC地址')}}</Col>
+                    <Col span="12">{{$L('备注')}}</Col>
+                </Row>
+                <Row v-for="(item, key) in formData" :key="key" class="setting-template">
+                    <Col span="12">
+                        <Input
+                            v-model="item.mac"
+                            :maxlength="20"
+                            :placeholder="$L('请输入设备MAC地址')"
+                            clearable
+                            @on-clear="delDatum(key)"/>
+                    </Col>
+                    <Col span="12">
+                        <Input v-model="item.remark" :maxlength="100" :placeholder="$L('备注')"/>
+                    </Col>
+                </Row>
+            </div>
             <Button type="default" icon="md-add" @click="addDatum">{{$L('添加设备')}}</Button>
         </Form>
         <div class="setting-footer">
@@ -68,6 +73,7 @@ export default {
                 'remark': '',
             },
 
+            latelyLoad: 0,
             latelyData: [],
 
             calendarShow: false,
@@ -152,6 +158,7 @@ export default {
         },
 
         getLately() {
+            this.latelyLoad++
             this.$store.dispatch("call", {
                 url: 'users/checkin/list',
                 data: {
@@ -159,6 +166,8 @@ export default {
                 }
             }).then(({data}) => {
                 this.latelyFormat(data)
+            }).finally(_ => {
+                this.latelyLoad--
             })
         },
 
diff --git a/resources/assets/sass/pages/page-setting.scss b/resources/assets/sass/pages/page-setting.scss
index db9f4fb2c..32a65fd56 100755
--- a/resources/assets/sass/pages/page-setting.scss
+++ b/resources/assets/sass/pages/page-setting.scss
@@ -163,6 +163,13 @@
             line-height: 32px;
             margin-bottom: -10px;
         }
+        .setting-checkin-load {
+            margin-bottom: 12px;
+            .common-loading {
+                width: 20px;
+                height: 20px;
+            }
+        }
         .setting-checkin-lately {
             > li {
                 padding-bottom: 8px;
@@ -175,6 +182,9 @@
                 }
             }
         }
+        .setting-checkin-row {
+            overflow: auto;
+        }
         .setting-checkin-button {
             padding-bottom: 4px;
             cursor: pointer;