优化页面展示

fir_client/src/components/FirFooter.vue

@@ -3,12 +3,12 @@
         <el-container class="navbar-wrapper">
             <el-main align="center">
 
-                <div style="width: 300px; margin: 0 auto; padding: 20px 0;">
+                <div style="width: 300px; margin: 0 auto; padding: 5px 0;">
                     <el-link :underline="false"> {{ footer.copyright }}</el-link>
 
                 </div>
 
-                <div style="width: 300px; margin: 0 auto; padding: 20px 0;">
+                <div style="width: 300px; margin: 0 auto; padding: 5px 0;">
                     <a style="display: inline-block; text-decoration: none; height: 20px; line-height: 20px;"
                        :href="footer.gongAnBeiAn.url"
                        target="_blank" rel="noopener">
@@ -22,7 +22,7 @@
                 </div>
 
                 <div>
-                    <div :underline="false" style="width: 200px; margin: 0 auto; padding: 10px 0;">
+                    <div :underline="false" style="width: 200px; margin: 0 auto; padding: 5px 0;">
                         <el-link :underline="false" :href="footer.ipcBeiAn.url" target="_blank"
                                  rel="nofollow noopener">{{ footer.ipcBeiAn.text }}
                         </el-link>

fir_client/src/components/FirIndex.vue

@@ -1,39 +1,145 @@
 <template>
-    <div>
+    <el-container>
-        <div style="margin: 10px 0 10px 0 ;position:absolute;right:20px;top:auto;">
+        <el-header class="header">
-            <!--            <el-button round icon="el-icon-star-off" @click="$router.push({name:'FirLogin'})"></el-button>-->
+            <el-row :gutter="12">
-            <el-button round icon="el-icon-apple" @click="$router.push({name:'FirApps'})"></el-button>
+                <el-col :span="12">
+                    <el-image class="logo img" :src="require('@/assets/logo.png')" alt="logo"/>
+                </el-col>
+                <el-col :span="12" :offset="12">
+                    <el-row :gutter="12" class="nav">
+                        <el-col :span="8">
+                            <el-link>工具</el-link>
+                        </el-col>
+                        <el-col :span="8">
+                            <el-link @click="$router.push({name:'FirApps'})">登陆</el-link>
+                        </el-col>
+                        <el-col :span="8">
+                            <el-link @click="$router.push({name:'FirRegist'})">注册</el-link>
+                        </el-col>
+                    </el-row>
+                </el-col>
+            </el-row>
 
-        </div>
+        </el-header>
-
+        <div>
-        <div class="firplane">
+            <div class="main">
-            <img src="../assets/plane.svg">
+                <div class="top">
-            <div style="margin-top: -195px;margin-left: 107px">
+                    <img :src="require('@/assets/bg.jpeg')" alt="topimg">
-                <img src="../assets/propeller.svg">
+                </div>
+                <div class="topplayer-top">
+                    <div class="word">FLY 应用 分发平台</div>
+                    <el-button @click="$router.push({name:'FirApps'})">开始分发 &gt;</el-button>
+                </div>
             </div>
         </div>
-    </div>
 
+        <el-footer>
+            <el-divider/>
+            <FirFooter></FirFooter>
+        </el-footer>
+    </el-container>
 </template>
 
 <script>
+    import FirFooter from "@/components/FirFooter";
+
     export default {
         name: "FirIndex",
-        data() {
+        components: {FirFooter},
-            return {}
-        },
-        created() {
-        }
     }
 </script>
 
 <style scoped>
+    * {
+        margin: 0;
+        padding: 0;
+    }
+
+    .header {
+        width: 100%;
+        height: 120px;
+    }
+
+    .header .img {
+        width: 300px;
+        height: 85px;
+        padding-left: 100px;
+        padding-top: 8px;
+    }
+
+    .header .logo {
+        float: left;
+    }
+
+    .header .nav {
+        float: right;
+        padding-right: 80px;
+
+    }
 
-    .firplane {
+    .header .nav .el-col {
+        margin-right: 20px;
+        float: left;
+        list-style: none;
+        width: 80px;
+        height: 60px;
+        line-height: 100px;
+        color: #7d7d7d;
+        font-size: 15px;
+        font-weight: bolder;
+    }
+
+    .header .nav .el-link:hover {
+        color: #47477d;
+        font-size: 16px;
+        cursor: pointer;
+        touch-action: manipulation;
+
+    }
+
+    .main .top {
+        margin-top: 60px;
+        width: 100%;
+        height: 700px;
+    }
+
+    .main .top img {
+        width: 100%;
+        height: 700px;
+    }
+
+    .main .topplayer-top {
+        width: 500px;
+        height: 300px;
         position: absolute;
-        left: 50%;
+        top: 400px;
-        top: 50%;
+        margin-top: -150px;
-        transform: translate(-50%, -50%);
+        z-index: 2;
+        right: 50%;
+        margin-right: -250px;
+    }
+
+    .main .topplayer-top .word {
+        padding-top: 100px;
+        color: #ffffff;
+        font-size: 45px;
+        font-weight: bolder;
+        text-align: center;
+        font-family: "微软雅黑";
+    }
+
+    .main .topplayer-top button {
+        width: 200px;
+        height: 60px;
+        margin-top: 50px;
+        color: #ffffff;
+        background: #f5704f;
+        font-family: 微软雅黑;
+        text-align: center;
+        font-weight: bolder;
+        font-size: 14px;
+        border-radius: 8px; /*圆角*/
+        margin-left: 150px;
     }
 
 </style>

fir_client/src/components/FirSuperSignBase.vue

@@ -77,7 +77,6 @@
           </span>
         </el-dialog>
 
-        <!--        <div style="position:relative;">-->
         <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick" tab-position="top">
             <el-tab-pane label="开发者账户" name="iosdeveloper">
                 <el-input
@@ -103,6 +102,7 @@
                 <el-table
                         :data="app_developer_lists"
                         border
+                        v-loading="loading"
                         stripe
                         style="width: 100%">
 
@@ -298,6 +298,7 @@
 
                 <el-table
                         :data="app_devices_lists"
+                        v-loading="loading"
                         border
                         stripe
                         style="width: 100%">
@@ -355,6 +356,7 @@
 
                 <el-table
                         :data="app_udid_lists"
+                        v-loading="loading"
                         border
                         stripe
                         style="width: 100%">
@@ -429,9 +431,6 @@
                 </el-pagination>
             </div>
         </el-tabs>
-        <!--            <el-button  class="goback" @click="$router.go(-1)">返回</el-button>-->
-        <!--        </div>-->
-
 
     </el-main>
 </template>
@@ -464,7 +463,9 @@
                 authcode: "",
                 authemail: "",
                 apple_auth_list: [],
-                apple_auth_type: 0
+                apple_auth_type: 0,
+                loadingfun: {},
+                loading: false
             }
         },
         methods: {
@@ -492,7 +493,7 @@
                 this.pagination.pagesize = val;
                 this.get_data_from_tabname(this.activeName, {
                     "size": this.pagination.pagesize,
-                    "page": this.pagination.currentPage
+                    "page": 1
                 })
             },
             handleCurrentChange(val) {
@@ -641,28 +642,33 @@
                     return '';
             },
             iosdevicesFun(methods, data) {
+                this.loading = true;
                 iosdevices(data => {
                     if (data.code === 1000) {
                         this.app_devices_lists = data.data;
                         this.pagination.total = data.count;
                     }
+                    this.loading = false;
                 }, {
                     "methods": methods, "data": data
                 })
             },
             iosdeveloperFun(params) {
-                const loading = this.$loading({
+                if (params.methods !== 'GET') {
-                    lock: true,
+                    this.loadingfun = this.$loading({
-                    text: '执行中,请耐心等待...',
+                        lock: true,
-                    spinner: 'el-icon-loading',
+                        text: '执行中,请耐心等待...',
-                    background: 'rgba(0, 0, 0, 0.7)'
+                        spinner: 'el-icon-loading',
-                });
+                        background: 'rgba(0, 0, 0, 0.7)'
+                    });
+                } else {
+                    this.loading = true
+                }
                 iosdeveloper(data => {
                     if (data.code === 1000) {
                         this.app_developer_lists = data.data;
                         this.pagination.total = data.count;
                         this.apple_auth_list = data.apple_auth_list;
-                        loading.close();
                         if (data.use_num) {
                             this.developer_used_info = data.use_num;
                             if (this.developer_used_info.all_usable_number !== 0) {
@@ -689,16 +695,24 @@
                     if (this.codeactiveVisible) {
                         this.codeactiveVisible = false;
                     }
-                    loading.close();
+                    if (params.methods !== 'GET') {
+                        this.loadingfun.close();
+                    } else {
+                        this.loading = false
+                    }
                 }, params)
             },
             iosdevicesudidFun(action, data) {
-                const loading = this.$loading({
+                if (action !== 'GET') {
-                    lock: true,
+                    this.loadingfun = this.$loading({
-                    text: '执行中,请耐心等待...',
+                        lock: true,
-                    spinner: 'el-icon-loading',
+                        text: '执行中,请耐心等待...',
-                    background: 'rgba(0, 0, 0, 0.7)'
+                        spinner: 'el-icon-loading',
-                });
+                        background: 'rgba(0, 0, 0, 0.7)'
+                    });
+                } else {
+                    this.loading = true
+                }
                 iosdevicesudid(data => {
                     if (data.code === 1000) {
                         if (action !== "DELETE") {
@@ -706,7 +720,11 @@
                             this.pagination.total = data.count;
                         }
                     }
-                    loading.close()
+                    if (action !== 'GET') {
+                        this.loadingfun.close()
+                    } else {
+                        this.loading = false
+                    }
                 }, {
                     "methods": action, "data": data
                 })

fir_client/src/components/FirUserStorage.vue

@@ -173,6 +173,7 @@
                 <el-table
                         :data="storage_info_lists"
                         border
+                        v-loading="loading"
                         stripe
                         style="width: 100%">
 
@@ -330,6 +331,7 @@
                     id: 2,
                     name: 'CDN模式： 请先配置好阿里云CDN，开启阿里云OSS私有Bucket回源，将使用鉴权A方式'
                 },],
+                loading: false,
             }
         }, methods: {
             getUserInfoFun() {
@@ -486,6 +488,7 @@
 
             },
             getstorageinfoFun() {
+                this.loading = true;
                 getStorageinfo(data => {
                     if (data.code === 1000) {
                         this.org_storage_id = this.use_storage_id = data.storage;
@@ -498,6 +501,7 @@
                     } else {
                         this.$message.error('存储获取失败,' + data);
                     }
+                    this.loading = false;
                 }, {"methods": 'GET'});
             },
             // eslint-disable-next-line no-unused-vars