Browse Source

vue环境配置

tbphp 3 years ago
parent
commit
87e7a50935

+ 12 - 0
.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.php]
+indent_size = 4

+ 1 - 1
application/route.php

@@ -18,6 +18,6 @@ return [
         ':name' => ['index/hello', ['method' => 'post']],
     ],
     '__rest__'    => [
-        'admin/user' => 'admin/user',
+        'api/user/[:page]/[:rows]' => 'admin/user',
     ],
 ];

+ 6 - 0
public/.htaccess

@@ -2,7 +2,13 @@
   Options +FollowSymlinks -Multiviews
   RewriteEngine On
 
+  RewriteCond %{REQUEST_FILENAME} !admin
   RewriteCond %{REQUEST_FILENAME} !-d
   RewriteCond %{REQUEST_FILENAME} !-f
   RewriteRule ^(.*)$ index.php/$1 [QSA,PT,L]
+
+  RewriteRule ^admin/index\.html$ - [L]
+  RewriteCond %{REQUEST_FILENAME} !-f
+  RewriteCond %{REQUEST_FILENAME} !-d
+  RewriteRule . /admin/index.html [L]
 </IfModule>

+ 1 - 1
public/admin/config/dev.env.js

@@ -3,5 +3,5 @@ var prodEnv = require('./prod.env')
 
 module.exports = merge(prodEnv, {
   NODE_ENV: '"development"',
-  API_URL: '"http://1to.cc/admin/"'
+  API_URL: '"http://1to.cc/api/"'
 })

+ 1 - 1
public/admin/config/prod.env.js

@@ -1,4 +1,4 @@
 module.exports = {
   NODE_ENV: '"production"',
-  API_URL: '"/admin/"'
+  API_URL: '"/api/"'
 }

+ 1 - 1
public/admin/src/components/Index.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <h1>Hello World!</h1>
-    <router-link to="/User">用户列表</router-link>
+    <router-link to="/User/1">用户列表</router-link>
   </div>
 </template>
 

+ 29 - 10
public/admin/src/components/User.vue

@@ -5,40 +5,59 @@
         {{i+1}}&nbsp;&nbsp;&nbsp;&nbsp;姓名:{{u.name}}&nbsp;&nbsp;&nbsp;&nbsp;电话:{{u.phone}}&nbsp;&nbsp;&nbsp;&nbsp;时间:{{u.create_time}}
       </li>
     </ul>
-    <a href="#" @click.prevent="page--">上一页</a>
+    <router-link v-if="$route.params.page != 1" :to="goPage('-')" replace>上一页</router-link>
+    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+    <input type="text" :value.lazy.number.trim="$route.params.page" v-model="a" @change="returnPage(value)">
+    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+    <router-link :to="goPage('+')" replace>下一页</router-link>
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-    <a href="#" @click.prevent="page++">下一页</a>
+    <input type="text" v-model.lazy.number.trim="rows">
   </div>
 </template>
 <script>
   export default {
     data () {
       return {
-        page: 0,
+        users: [],
         rows: 10,
-        users: []
+        a: 0
       }
     },
     created () {
-      this.page++;
+      this.getUsers();
     },
     watch: {
-      page () {
-        // if (this.page < 0) {
-        //   this.page = 0;
-        // }
+      $route () {
+        this.getUsers();
+      },
+      rows () {
         this.getUsers();
       }
     },
     methods: {
       getUsers () {
-        this.$http.get('user', {params: {page: this.page, rows: this.rows}}).then(res => {
+        this.$http.get('user/'+this.$route.params.page + '/' + this.rows).then(res => {
           this.users = res.data;
         });
+      },
+      goPage (el) {
+        var page = eval(this.$route.params.page + ' ' + el + '1');
+        return {
+          name: 'User',
+          params: {page: page}
+        };
+      },
+      returnPage (t) {
+        console.info(t)
+        // this.$router.push({
+        //   name: 'User',
+        //   params: {page:}
+        // })
       }
     }
   }
 </script>
 <style scoped>
 .user{width: 800px;margin: 0 auto;margin-top: 80px;}
+input{width: 40px;text-align: center;}
 </style>

+ 6 - 2
public/admin/src/router.js

@@ -8,7 +8,7 @@ function include (name) {
 function route (name) {
   return {
     name: name,
-    path: '/' + name,
+    path: name,
     component: include(name)
   }
 }
@@ -24,7 +24,11 @@ export default new Router({
       path: '/',
       component: include('Index')
     },
-    route('User'),
+    {
+      name: 'User',
+      path: '/User/:page',
+      component: include('User')
+    },
     {
       path: '*',
       redirect: '/'