update 行业资讯

src/utils/admin/tools.js

@@ -0,0 +1,31 @@
+const getCache = function(key) {
+    if (!key) {
+        console.error(`未找到需要获取的键`);
+        return;
+    }
+    const data = window.localStorage.getItem(key)
+    if (data) {
+        return JSON.parse(data);
+    }
+    return data;
+}
+
+const saveCache = function(key, val) {
+    if ( !key || !val ) {
+        console.error(`缺少指定的键或值`)
+        return;
+    }
+    window.localStorage.setItem(key, JSON.stringify(val));
+}
+
+const removeCache = function(key) {
+    if (!key) {
+        console.error(`未找到需要删除的键`);
+        return;
+    }
+    window.localStorage.removeItem(key)
+}
+
+export {
+    getCache, saveCache, removeCache
+}

src/views/management/HangYeZiXun/components/Pagination.vue

@@ -0,0 +1,58 @@
+<template>
+    <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="page"
+            :page-sizes="pageSizes"
+            :page-size="size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total">
+    </el-pagination>
+</template>
+
+<script>
+    import { paginationServiceData } from './paginationData';
+    export default {
+        name: 'Pagination',
+        props: {
+            pageSizes: {
+                type: Array,
+                default: () => [100, 200, 300, 400]
+            }
+        },
+        computed: {
+            page: {
+                get () {
+                    return paginationServiceData.page;
+                },
+                set(val) {
+                    paginationServiceData.size = val;
+                }
+            },
+            size: {
+                get () {
+                    return paginationServiceData.size;
+                },
+                set(val) {
+                    paginationServiceData.size = val;
+                }
+            },
+            total: {
+                get() {
+                    return paginationServiceData.total;
+                },
+                set(val) {
+                    this.paginationServiceData.total = val;
+                }
+            }
+        },
+        methods: {
+            handleSizeChange() {},
+            handleCurrentChange() {},
+        }
+    };
+</script>
+
+<style scoped>
+
+</style>

src/views/management/HangYeZiXun/components/Table.vue

@@ -0,0 +1,37 @@
+<template>
+    <el-table
+            :data="tableData"
+            border
+            style="width: 100%">
+        <el-table-column
+                prop="date"
+                label="日期"
+                width="180">
+        </el-table-column>
+        <el-table-column
+                prop="name"
+                label="姓名"
+                width="180">
+        </el-table-column>
+        <el-table-column
+                prop="address"
+                label="地址">
+        </el-table-column>
+    </el-table>
+</template>
+
+<script>
+    export default {
+        name: 'Table',
+
+        data() {
+            return {
+                tableData: []
+            }
+        }
+    };
+</script>
+
+<style scoped>
+
+</style>

src/views/management/HangYeZiXun/components/paginationData.js

@@ -0,0 +1,13 @@
+import Vue from 'vue';
+
+const pagination = {
+    page: 1,
+    size: 10,
+    total: 0
+}
+
+const paginationServiceData = Vue.observable(pagination);
+
+export {
+    paginationServiceData
+}

src/views/management/HangYeZiXun/components/table.js

@@ -0,0 +1,13 @@
+import Vue from 'vue';
+
+const tableData = {
+    page: 1,
+    size: 10,
+    total: 0
+}
+
+const tableServiceData = Vue.observable(tableData);
+
+export {
+    tableServiceData
+}

src/views/management/HangYeZiXun/index.vue

@@ -1,17 +1,22 @@
 <template>
     <div class="admin-hangyezixun">
-        行业资讯
+        <myPagination />
     </div>
 </template>
 
 <script>
+    import myPagination from './components/Pagination.vue';
+
     export default {
-        name: 'index',
+        name:       'index',
+        components: {
+            myPagination,
+        },
     };
 </script>
 
 <style lang="scss" scoped>
-.admin-hangyezixun {
+    .admin-hangyezixun {
 
-}
+    }
 </style>

src/views/management/Home/index.vue

@@ -23,9 +23,12 @@
 </template>
 
 <script>
-    import Asider from './components/Asider';
-    import Footer from './components/Footer';
-    import Header from './components/Header';
+    import Asider       from './components/Asider';
+    import Footer       from './components/Footer';
+    import Header       from './components/Header';
+    import { getCache } from '@/utils/admin/tools';
+
+    const USER_AUTH = `userAuth`;
 
     export default {
         name:       'Home',
@@ -40,7 +43,12 @@
             };
         },
         beforeRouteEnter(to, from, next) {
-            console.log(to , from);
+            const data = getCache(USER_AUTH);
+            // 未查询到用户权限 回归登录
+            if (!data) {
+                next({ name: 'Login' });
+                return;
+            }
             next();
         },
         methods:    {
@@ -76,6 +84,7 @@
             background-color: #E9EEF3;
             color: #333;
             padding: 30px 0 30px 30px;
+
             ::v-deep .el-scrollbar__wrap {
                 overflow-x: hidden;
             }

src/views/management/Login/components/Login.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="admin-login__loginForm">
         <el-form :model="loginForm" status-icon :rules="loginRules" ref="LoginForm" label-width="100px">
-            <el-form-item label="用户名:" prop="username">
+            <el-form-item label="账号:" prop="username">
                 <el-input type="text" v-model="loginForm.username"></el-input>
             </el-form-item>
             <el-form-item label="密码:" prop="password">
@@ -18,6 +18,8 @@
 
 <script>
     import { getAdminLogin } from "@/api/noToken.js";
+    import {getCache, saveCache} from "@/utils/admin/tools";
+    const USER_AUTH = `userAuth`;
     export default {
         name:    'Login',
         data() {
@@ -40,25 +42,30 @@
             handleLogin(formName) {
                 this.$refs[formName].validate((valid) => {
                     if (valid) {
-                        console.log('submit');
                         this.doLogin();
                     } else {
-                        console.log('err');
                         return false;
                     }
                 });
             },
+            /**
+             * 登录
+             * @returns {Promise<void>}
+             */
             async doLogin() {
+                // 参数获取
                 const opt = this.getOption();
 
                 try {
                     const res = await getAdminLogin(opt)
                     if (res.code === 0) {
-                        console.log(res.data);
-                        // this.goHomePage();
+                        // 缓存 登录状态
+                        this.saveCache(USER_AUTH, res.data)
+                        // 登录
+                        this.goHomePage();
                     }
                 } catch (e) {
-                    console.log(e);
+                    console.error(e);
                 }
 
             },
@@ -69,13 +76,17 @@
                 };
                 return opt;
             },
-            saveCaceh() {
-
+            saveCache(key, val) {
+                return saveCache(key, val);
             },
             goHomePage() {
                 this.$router.push({ name: 'hangyezixun' });
             },
         },
+        created() {
+           // const data = getCache(USER_AUTH);
+           // console.log('缓存 =》', data);
+        }
     };
 </script>