2021-1-12 18:10:12 Fist CH

.gitignore

@@ -0,0 +1,22 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

README.md

@@ -0,0 +1,15 @@
+# fandian-easy
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+ES6
+fandian-easy - npm run serve
+```
+
+
+

_logs/2020-09-21T08_35_02_987Z-debug.log

@@ -0,0 +1,27 @@
+0 info it worked if it ends with ok
+1 verbose cli [
+1 verbose cli   'D:\\NODE1\\node.exe',
+1 verbose cli   'D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js',
+1 verbose cli   'run',
+1 verbose cli   'dev'
+1 verbose cli ]
+2 info using npm@6.14.4
+3 info using node@v12.17.0
+4 verbose stack Error: missing script: dev
+4 verbose stack     at run (D:\NODE1\node_modules\npm\lib\run-script.js:155:19)
+4 verbose stack     at D:\NODE1\node_modules\npm\lib\run-script.js:63:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:116:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:436:5
+4 verbose stack     at checkBinReferences_ (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:391:45)
+4 verbose stack     at final (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:434:3)
+4 verbose stack     at then (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:161:5)
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:281:12
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16
+4 verbose stack     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)
+5 verbose cwd G:\eggpachong\fandian-easy
+6 verbose Windows_NT 6.1.7601
+7 verbose argv "D:\\NODE1\\node.exe" "D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js" "run" "dev"
+8 verbose node v12.17.0
+9 verbose npm  v6.14.4
+10 error missing script: dev
+11 verbose exit [ 1, true ]

_logs/2020-09-30T01_59_07_059Z-debug.log

@@ -0,0 +1,33 @@
+0 info it worked if it ends with ok
+1 verbose cli [
+1 verbose cli   'D:\\NODE1\\node.exe',
+1 verbose cli   'D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js',
+1 verbose cli   'run',
+1 verbose cli   'sreve'
+1 verbose cli ]
+2 info using npm@6.14.4
+3 info using node@v12.17.0
+4 verbose stack Error: missing script: sreve
+4 verbose stack
+4 verbose stack Did you mean this?
+4 verbose stack     serve
+4 verbose stack     at run (D:\NODE1\node_modules\npm\lib\run-script.js:155:19)
+4 verbose stack     at D:\NODE1\node_modules\npm\lib\run-script.js:63:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:116:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:436:5
+4 verbose stack     at checkBinReferences_ (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:391:45)
+4 verbose stack     at final (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:434:3)
+4 verbose stack     at then (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:161:5)
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:281:12
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16
+4 verbose stack     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)
+5 verbose cwd G:\eggpachong\fandian-easy
+6 verbose Windows_NT 6.1.7601
+7 verbose argv "D:\\NODE1\\node.exe" "D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js" "run" "sreve"
+8 verbose node v12.17.0
+9 verbose npm  v6.14.4
+10 error missing script: sreve
+10 error
+10 error Did you mean this?
+10 error     serve
+11 verbose exit [ 1, true ]

_logs/2020-10-16T08_31_03_537Z-debug.log

@@ -0,0 +1,27 @@
+0 info it worked if it ends with ok
+1 verbose cli [
+1 verbose cli   'D:\\NODE1\\node.exe',
+1 verbose cli   'D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js',
+1 verbose cli   'run',
+1 verbose cli   'dev'
+1 verbose cli ]
+2 info using npm@6.14.4
+3 info using node@v12.17.0
+4 verbose stack Error: missing script: dev
+4 verbose stack     at run (D:\NODE1\node_modules\npm\lib\run-script.js:155:19)
+4 verbose stack     at D:\NODE1\node_modules\npm\lib\run-script.js:63:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:116:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:436:5
+4 verbose stack     at checkBinReferences_ (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:391:45)
+4 verbose stack     at final (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:434:3)
+4 verbose stack     at then (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:161:5)
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:382:12
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16
+4 verbose stack     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)
+5 verbose cwd G:\eggpachong\fandian-easy
+6 verbose Windows_NT 6.1.7601
+7 verbose argv "D:\\NODE1\\node.exe" "D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js" "run" "dev"
+8 verbose node v12.17.0
+9 verbose npm  v6.14.4
+10 error missing script: dev
+11 verbose exit [ 1, true ]

_logs/2020-10-22T01_00_42_850Z-debug.log

@@ -0,0 +1,33 @@
+0 info it worked if it ends with ok
+1 verbose cli [
+1 verbose cli   'D:\\NODE1\\node.exe',
+1 verbose cli   'D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js',
+1 verbose cli   'run',
+1 verbose cli   'serev'
+1 verbose cli ]
+2 info using npm@6.14.4
+3 info using node@v12.17.0
+4 verbose stack Error: missing script: serev
+4 verbose stack
+4 verbose stack Did you mean this?
+4 verbose stack     serve
+4 verbose stack     at run (D:\NODE1\node_modules\npm\lib\run-script.js:155:19)
+4 verbose stack     at D:\NODE1\node_modules\npm\lib\run-script.js:63:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:116:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:436:5
+4 verbose stack     at checkBinReferences_ (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:391:45)
+4 verbose stack     at final (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:434:3)
+4 verbose stack     at then (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:161:5)
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:281:12
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16
+4 verbose stack     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)
+5 verbose cwd G:\eggpachong\fandian-easy
+6 verbose Windows_NT 6.1.7601
+7 verbose argv "D:\\NODE1\\node.exe" "D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js" "run" "serev"
+8 verbose node v12.17.0
+9 verbose npm  v6.14.4
+10 error missing script: serev
+10 error
+10 error Did you mean this?
+10 error     serve
+11 verbose exit [ 1, true ]

_logs/2020-10-26T00_47_19_022Z-debug.log

@@ -0,0 +1,33 @@
+0 info it worked if it ends with ok
+1 verbose cli [
+1 verbose cli   'D:\\NODE1\\node.exe',
+1 verbose cli   'D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js',
+1 verbose cli   'run',
+1 verbose cli   'sreve'
+1 verbose cli ]
+2 info using npm@6.14.4
+3 info using node@v12.17.0
+4 verbose stack Error: missing script: sreve
+4 verbose stack
+4 verbose stack Did you mean this?
+4 verbose stack     serve
+4 verbose stack     at run (D:\NODE1\node_modules\npm\lib\run-script.js:155:19)
+4 verbose stack     at D:\NODE1\node_modules\npm\lib\run-script.js:63:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:116:5
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:436:5
+4 verbose stack     at checkBinReferences_ (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:391:45)
+4 verbose stack     at final (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:434:3)
+4 verbose stack     at then (D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:161:5)
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\read-package-json\read-json.js:382:12
+4 verbose stack     at D:\NODE1\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:115:16
+4 verbose stack     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)
+5 verbose cwd G:\eggpachong\fandian-easy
+6 verbose Windows_NT 6.1.7601
+7 verbose argv "D:\\NODE1\\node.exe" "D:\\NODE1\\node_modules\\npm\\bin\\npm-cli.js" "run" "sreve"
+8 verbose node v12.17.0
+9 verbose npm  v6.14.4
+10 error missing script: sreve
+10 error
+10 error Did you mean this?
+10 error     serve
+11 verbose exit [ 1, true ]

anonymous-cli-metrics.json

@@ -0,0 +1 @@
+{"metricId":"14fe0bd1-bc43-4a8d-95a0-0fdfafc7ab43","metrics":{"from":"2020-07-29T06:04:17.536Z","to":"2020-08-13T05:54:02.956Z","successfulInstalls":2,"failedInstalls":2}}

babel.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  presets: [
+    '@vue/app',
+["@babel/preset-env", { "modules": false }]
+],
+plugins: [
+  [
+    "component",
+    {
+      "libraryName": "element-ui",
+      "styleLibraryName": "theme-chalk"
+    }
+  ]
+]
+}

package.json

@@ -0,0 +1,36 @@
+{
+  "name": "restaurantVue",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build"
+  },
+  "dependencies": {
+    "axios": "^0.19.2",
+    "core-js": "^3.6.5",
+    "echarts": "^4.9.0",
+    "element-ui": "^2.13.2",
+    "js-cookie": "^2.2.1",
+    "js-md5": "^0.7.3",
+    "moment": "^2.29.1",
+    "vue": "^2.6.11",
+    "vue-baidu-map": "^0.21.22",
+    "vue-router": "^3.2.0",
+    "vue-validator": "^3.0.0-alpha.2",
+    "vuex": "^3.5.1"
+  },
+  "devDependencies": {
+    "@babel/preset-env": "^7.10.4",
+    "@vue/cli-plugin-babel": "~4.4.0",
+    "@vue/cli-plugin-router": "~4.4.0",
+    "@vue/cli-service": "~4.4.0",
+    "babel-plugin-component": "^1.1.1",
+    "vue-template-compiler": "^2.6.11"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead"
+  ]
+}

public/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

src/App.vue

@@ -0,0 +1,10 @@
+<template>
+  <div id="app">
+    <el-button>默认按钮</el-button>
+    <el-button type="primary">主要按钮</el-button>
+    <el-button type="success">成功按钮</el-button>
+    <el-button type="info">信息按钮</el-button>
+    <el-button type="warning">警告按钮</el-button>
+    <el-button type="danger">危险按钮</el-button>
+  </div>
+</template>

src/components/navigation/Navi.vue

@@ -0,0 +1,184 @@
+<template>
+    <div style="background-color: #EBEBEB;min-height:800px">
+        <div style="width:100%;background-color: #636363; overflow: hidden">
+            <span class="demonstration" style="float:right;padding-top:10px;margin-right:1%">
+                <el-dropdown trigger="click">
+                  <span class="el-dropdown-link" style="color:white">
+                    欢迎您，{{showUserName}}
+                      <i class="el-icon-caret-bottom el-icon--right"></i>
+                  </span>
+                  <el-dropdown-menu slot="dropdown">
+                      <el-dropdown-item @click.native="orderCenter">订单管理</el-dropdown-item>
+                      <el-dropdown-item @click.native="jumpAccount">修改密码</el-dropdown-item>
+                    <el-dropdown-item @click.native="jumpLogin">退出登录</el-dropdown-item>
+                  </el-dropdown-menu>
+                </el-dropdown>
+            </span>
+        </div>
+        <div style="margin-top:5px;background-color: #24E9FF">
+            <el-row :gutter="5">
+                <el-col :xs="4" :sm="4" :md="4" :lg="4">
+                  <div>
+
+                        <el-menu default-active="1"
+                                 class="el-menu-vertical-demo"
+                                 style="min-height:1248px"
+                                 background-color="#545c64"
+                                 text-color="#fff"
+                                 :router="true"
+                                 active-text-color="#ffd04b">
+
+                            <!--一级菜单-->
+                            <el-submenu
+                                    v-for="(outerValue,index) in navigationBar[0]"
+                                    :key="index"
+                                    :index="outerValue.address">
+                                <template slot="title" >
+                                    <i :class="outerValue.icon"></i>
+                                    <span>{{outerValue.label}}</span>
+                                </template>
+
+
+<!--                                二级菜单-->
+                                <el-menu-item
+                                        v-for="(innerValue,index1) in outerValue.children"
+                                        :key="'1'+index1"
+                                        :index="innerValue.address">
+                                    <span>{{innerValue.label}}</span>
+                                </el-menu-item>
+                            </el-submenu>
+
+                            <el-menu-item
+                                    v-for="(item,index2) in navigationBar[1]"
+                                    :key="'2'+index2"
+                                    :index="item.address">
+                                <i :class="item.icon"></i>
+                                <span>{{item.label}}</span>
+                            </el-menu-item>
+                        </el-menu>
+                    </div>
+                </el-col>
+                <el-col :xs="20" :sm="20" :md="20" :lg="20">
+                    <div style="margin-top:10px">
+                        <router-view></router-view>
+                    </div>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data(){
+            return {
+                navAggregationStr:[],
+                navigationBar:[],
+                us:'',
+                UserRoleName:'',
+            }
+        },
+        computed:{
+            showUserName(){
+                return Cookies.get('username');
+            }
+        },
+        created(){
+            const primaryArr=[];
+            axios.get('http://127.0.0.1:7001/user/userRolePopulateFind',
+                {
+                    headers:{
+                        // 'token':"Bearer " + Cookies.get('token')
+                        'token':Cookies.get('token')
+                    }
+                })
+                .then(res=>{
+                    res.data.forEach((item)=>{
+                        if(item.us==Cookies.get('username')){
+                            Cookies.set('RoleName',item.role.role_name,1)
+                            Cookies.set('RoleObjectId',item.role._id,1)
+                        }
+                    })
+                })
+                .then(()=>{
+                    axios.get('http://127.0.0.1:7001/role/RoleMenuAggregation')
+                        .then((res)=>{
+                            res.data.data.forEach(item=>{
+                                if(Cookies.get('RoleName')==item.role_name){
+                                    item.permission.forEach(item=>{
+                                        primaryArr.push(item);
+                                    })
+                                }
+                            })
+                            this.navigationBar=this.putTree(primaryArr);
+                            let data=[
+                                [],
+                                [],
+                            ]
+                            this.navigationBar.forEach((item)=>{
+                                if(item.children&&item.children.length>0)
+                                {
+                                    data[0].push(item);
+                                }
+                                else
+                                {
+                                    data[1].push(item);
+                                }
+                                this.navigationBar=data;
+                            });
+                        })
+                })
+                .catch(error=>{//token过期的处理
+                    if(error.response.data.code==-1){
+                        this.$message.info(error.response.data.massage);
+                            this.$router.replace('/');
+                    }
+                })
+        },
+
+        methods:{
+            orderCenter(){
+                this.$router.push('/shoppingCart/orderCenter');
+            },
+
+            jumpAccount(){
+                this.$router.push('/page2');
+            },
+            jumpLogin(){
+                Cookies.remove('aotuLoginCookie',0)//退出登录，只是改变了自动登录的status
+                this.$router.push('/');
+            },
+            putTree(arr,child='_id',father='fid',mostKey='0',childKey='children'){
+
+                let map = {};
+                // map是映射的意思，将一个数组映射成一个新数组。
+                // h[key]返回映射h中的自变量key映射到的value的值
+
+                let resultArr = [];
+                arr.forEach((item) => {
+                    item[childKey] = [];  //让所有的item中，每条数据增加一条children:{type:[]} 字段；children的作用是，放孩子路由
+                    map[item[child]] = item;
+                });
+
+                arr.forEach((item) => {
+                    if (item[father]){ //如果二级路由的Key存在
+                        if (item[father] == mostKey) {   //如果 二级路由的Key==0 (说明此条item是一级路由)
+                            resultArr.push(item);     //就添加到resultArr数组里;
+                        }
+                        else {//如果二级路由的Key != 0； 说明此条item是二级路由
+                            map[item[father]][childKey].push(item);//为什么可以push，因为item里的children字段，是一个[数组]格式
+                        }
+                    }
+                });
+                return resultArr;
+            },
+            jumpRouterBtn(data){
+                this.$router.push(data.address);
+            },
+            jumpRouterBtnOne(data){
+                this.$router.push(data.address);
+            },
+        },
+    }
+</script>

src/components/navigation/forgetPwd.vue

@@ -0,0 +1,179 @@
+<template>
+    <div class="forgetPwdBox">
+        <el-form  :model="ruleForm" class="forgetPwd" :rules="rules" ref="ruleForm"  style="width: 18%">
+            <h1>神州餐厅管理系统-重置密码</h1>
+            <br><br>
+<!--发送验证码-->
+            <el-button :disabled="disabledStatus" @click="sendEmailCode" style="text-align: left" >{{sendCodeBtnClick}}</el-button>
+<!--验证码-->
+            <el-form-item label="验证码：" prop="emailCode">
+                <el-input  v-model=ruleForm.emailCode
+                           placeholder="验证码"
+                           maxlength="5"
+                           show-word-limit></el-input>
+            </el-form-item>
+<!--新密码-->
+            <el-form-item label="新密码：" prop="newPwd">
+                <el-input  v-model="ruleForm.newPwd"
+                           placeholder="新密码"
+                           maxlength="24"
+                           show-word-limit
+                           show-password
+                           clearable></el-input>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="success" round @click="updatePwd('ruleForm')">修改</el-button>
+                <el-button type="primary" round @click="cancelBtnClick">取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+
+    //邮箱验证  正则匹配QQ邮箱   这块用不到了，因为将邮箱信息存储到了Cookie中
+    const checkEmail = (rule, value, cb) => {
+        const regEmail = /^([0-9_-]{5,12})+@([q]{2}|[Q]{2})+(\.com|\.COM)+/
+        if (regEmail.test(value)) {
+            return cb()
+        }
+        cb(new Error('请输入正确的邮箱'))
+    }
+
+    export default {
+        data(){
+            return{
+                disabledStatus:false,
+                sendCodeBtnClick:'点击发送验证码',
+                total:60,      //发送验证码的时间间隔
+                emailCode:'',
+                ruleForm:{
+                    emailAddress:'',
+                    emailCode:'',
+                    newPwd:'',
+                    newPwd1:''
+                },
+                rules:{
+                    emailCode:[
+                        {required: true, min:5, max:5, message: '5位有效数字', trigger: 'blur'}
+                    ],
+                    newPwd:[
+                        {required: true,min: 6, max: 24, message: '长度在 6-24 个字符', trigger: 'blur'}
+                    ],
+                }
+            }
+        },
+        created(){
+            //在这之前，要根据Cookie获取的username信息，来查询QQ邮箱的信息，之后把邮箱的Cookie设置上
+            axios.post('http://127.0.0.1:7001/user/findUserName',{
+                username:Cookies.get('username')
+            })
+                .then(((res)=>{
+                    Cookies.set('emailAddress',res.data.data[0].emailAddress,1)
+                }))
+        },
+        methods:{
+            //验证码倒计时
+            cuntDown(){
+
+                //如果我点击了，我就将这个【秒数 && 按钮状态】存入Cookie，再次刷新页面的时候，我调用这个秒数。实现1分钟只能点击一次的功能
+
+                this.sendCodeBtnClick=this.total+'s后重新发送' //解决点击后的第一秒不显示问题
+                let clock=window.setInterval(()=>{
+                    this.total--;
+                    this.sendCodeBtnClick=this.total+'s后重新发送'
+                    if(this.total<0){
+                        window.clearInterval(clock);
+                        this.total=60;
+                        this.sendCodeBtnClick='点击发送验证码';
+                        this.disabledStatus=false;
+                    }
+                },1000)
+
+            },
+
+//点击发送验证码
+            sendEmailCode(){
+                this.disabledStatus=true;//如果成功发送之后，邮箱的输入框变为禁用 => 变为：点击就禁用
+                this.cuntDown();//发送验证码,时间间隔
+                axios.post('http://127.0.0.1:7001/user/sendEmailCode',{
+                    userName:Cookies.get('username'),
+                    emailAddress:Cookies.get('emailAddress')
+                })
+                    .then((res)=>{
+                        console.log(res,'发送验证码的res');
+                        if(res.data.code==0){
+                            this.$message.success(res.data.msg+';一分钟有效期');
+                        }
+                        else if(res.data.code==-1){
+                            this.$message.error(res.data.msg)
+                        }
+                        else if(res.data.code==-2){
+                            this.$message.error(res.data.msg)
+                        }
+                    })
+                    .catch((err)=>{
+                        this.$message.error(err,'其他错误')
+                    })
+            },
+//验证验证码是否正确
+            updatePwd(formName){//成功修改完密码之后，清空数据库里的验证码（验证码只能使用一次）
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        axios.post('http://127.0.0.1:7001/user/verifyCodeUpdatePwd', {
+                            userName: Cookies.get('username'),
+                            emailCode: this.ruleForm.emailCode,
+                            ps: this.ruleForm.newPwd
+                        })
+                            .then((res) => {
+                                console.log(res, 'res');
+                                if (res.data.code == 0){
+                                    this.$message.success(res.data.msg);
+                                    Cookies.remove('username',0);//修改成功清空Cookies账号
+                                    Cookies.remove('passWord',0);//修改成功清空Cookies密码
+                                    Cookies.remove('emailAddress',0);//修改成功清空Cookies密码
+                                    this.$router.push('/')
+                                }
+                                else if (res.data.code == -1){
+                                    this.$message.error(res.data.msg)
+                                }
+                                else if (res.data.code == -2){
+                                    this.$message.error(res.data.msg)
+                                }
+                                else if (res.data.code == -3){
+                                    this.$message.error(res.data.msg)
+                                }
+                                else if (res.data.code == -4){
+                                    this.$message.error(res.data.msg)
+                                }
+                                else if (res.data.code == -5){
+                                    this.$message.error(res.data.msg)
+                                }
+                            })
+                    }
+                    else{
+                        this.$message.error('格式错误')
+                    }
+                })
+            },
+//取消
+            cancelBtnClick(){
+                Cookies.remove('username',0);
+                Cookies.remove('passWord',0);
+                Cookies.remove('emailAddress',0);
+                this.$router.go(-1);
+            },
+        }
+    }
+</script>
+
+<style>
+    .forgetPwd {
+        margin: 250px auto 0  ;
+    }
+    .forgetPwdBox{
+        text-align: center;
+    }
+</style>

src/components/navigation/login.vue

@@ -0,0 +1,159 @@
+<template>
+    <div class="loginBox">
+            <el-form  :model="ruleForm" class="login" ref="ruleForm" :rules="rules" style="width: 18%">
+                <h1>神州餐厅管理系统-NavLogin</h1>
+                <br><br>
+                <!--账号-->
+                <el-form-item label="账号" prop="us">
+                    <el-input v-model="ruleForm.us"
+                              placeholder="请输入账号名"
+                              maxlength="18"
+                              show-word-limit></el-input>
+                </el-form-item>
+                <!--密码-->
+                <el-form-item label="密码" prop="ps">
+                    <el-input  v-model="ruleForm.ps"
+                               placeholder="请输入密码"
+                               maxlength="24"
+                               show-word-limit
+                               show-password></el-input>
+                </el-form-item>
+                <!-- `checked` 为 true 或 false -->
+                <el-checkbox v-model="checked" style="float: left">记住密码</el-checkbox>
+                <el-checkbox v-model="aotuLoginStatus" >自动登录</el-checkbox>
+                <br><br>
+                <el-button @click="jumpVerifyAccount" style="float: left">忘记密码</el-button>
+                <br>
+                <br><br>
+                <el-form-item>
+                    <el-button type="success" round @click="submitForm('ruleForm')">登录</el-button>
+                    <el-button type="primary" round @click="regBtnClick">注册</el-button>
+                </el-form-item>
+            </el-form>
+    </div>
+
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data() {
+            return {
+                token:'',
+                checked:false,
+                aotuLoginStatus:false,
+                username:'',
+                passWorld:'',
+                ruleForm: {
+                    us: '',
+                    ps: '',
+                    todos:[]
+                },
+                rules: {
+                    us: [
+                        {required: true, message: '请输入账号', trigger: 'blur'},
+                        {min: 5, max: 18, message: '长度在 5-18 个字符', trigger: 'blur'}
+                    ],
+                    ps: [
+                        {min: 6, max: 24,required: true, message: '长度在 6-24 个字符', trigger: 'change'}
+                    ]
+                }
+            }
+        },
+        created() {
+            if( Cookies.get('username')){
+                this.ruleForm.us=Cookies.get('username');
+            }
+            if(Cookies.get('passWord')){//点击【记住密码】，则登录之前传密码，到显示的页面上
+                this.checked=true;
+                this.ruleForm.ps=Cookies.get('passWord');
+            }
+
+            //刚进入的时候，根据cookie是否有【账号、密码】 && 【if(自动登录==true)】来判断
+            if(Cookies.get('username') && Cookies.get('passWord') && Cookies.get('aotuLoginCookie')){
+                this.aotuLoginStatus=true;
+                this.$router.push('/foodRestaurant');
+            }
+        },
+        methods: {
+// 注册
+            regBtnClick(){
+                this.$router.push('/regist');
+            },
+//忘记密码
+            jumpVerifyAccount(){
+                this.$router.push('/yanzhengUS');
+            },
+//登录
+            submitForm(formName) {
+
+//登录-点击登录
+                this.$refs[formName].validate((valid) => {//登录判断操作
+                    if (valid) {
+                        axios.post('http://127.0.0.1:7001/user/login',{
+                            us:this.ruleForm.us,
+                            ps:this.ruleForm.ps
+                        },
+                            {
+                                headers:{
+                                    // 切记 token 不要直接发送，要在前面加上 Bearer 字符串和一个空格
+                                    'Authorization':`Bearer ${this.token}`
+                                }
+                            }
+                        )
+                            .then((res)=>{
+                                if(res.data.code==0){
+                                    this.$message.success(res.data.msg);
+
+                                    //登录-记住密码
+                                    if (this.checked == true) {//判断复选框是否被勾选 勾选则配置cookie.ps，有效期1天
+                                        Cookies.set('passWord',this.ruleForm.ps,1);
+                                    }
+                                    else{
+                                        Cookies.remove('passWord',0)
+                                    }
+                                    //登录-自动登录
+                                    if(this.aotuLoginStatus==true){//如果复选框被勾选，则直接进入到主页面
+                                        Cookies.set('aotuLoginCookie',this.aotuLoginStatus,1);//点击自动登录==true，就设置cookie
+                                    }
+                                    else {//不点击自动登录则删除cookie
+                                        Cookies.remove('aotuLoginCookie',0);
+                                    }
+                                    Cookies.set('username',this.ruleForm.us,1);
+                                    Cookies.set('token',res.data.token,1);
+                                    this.$router.push('/foodRestaurant');
+                                }
+                                else if(res.data.code==-1){
+                                    this.$message.error(res.data.msg);
+                                }
+                            })
+                    }
+                    else {
+                        //格式错误的话 不记录登录失败的信息
+                        this.$message.error('格式错误');
+                        return false;
+                    }
+                });
+            },
+            },
+    }
+</script>
+
+<style>
+    .loginBox {
+        text-align: center;
+    }
+    body {
+        background: pink url('../loginBGI/登录背景图片-3.png')
+        no-repeat
+        fixed;
+        background-size: cover;
+    }
+    .loginBox.label {
+        color: white;
+    }
+    .login {
+        margin: 250px auto 0  ;
+    }
+</style>

src/components/navigation/login1.vue

@@ -0,0 +1,13 @@
+<template>
+    <div>
+        <!-- 路由匹配到的组件将显示在这里 -->
+        <router-view></router-view>
+    </div>
+</template>
+
+
+
+
+
+
+

src/components/navigation/regist.vue

@@ -0,0 +1,163 @@
+<template>
+    <div class="registBox">
+        <el-form :model="ruleFormReg" class="regist"  ref="ruleFormReg" :rules="rules" label-width="80px" style="width: 20%">
+            <h1>神州餐厅管理系统-NavReg</h1>
+            <br><br>
+<!--账号-->
+            <el-form-item label="账号" prop="us">
+                <el-input v-model="ruleFormReg.us"
+                          placeholder="请输入账号名"
+                          maxlength="18"
+                          show-word-limit></el-input>
+            </el-form-item>
+<!--密码-->
+            <el-form-item label="密码" prop="ps">
+                <el-input  v-model="ruleFormReg.ps"
+                           placeholder="请输入密码"
+                           maxlength="24"
+                           show-word-limit
+                           show-password></el-input>
+            </el-form-item>
+<!--身份证-->
+            <el-form-item label="身份证" prop="idCard">
+                <el-input  v-model="ruleFormReg.idCard"
+                           placeholder="请输入您的身份证号"
+                           maxlength="18"
+                           show-word-limit></el-input>
+            </el-form-item>
+<!--邮箱-->
+            <el-form-item label="邮箱" prop="emailAddress">
+                <el-input v-model="ruleFormReg.emailAddress"
+                          placeholder="用于用户找回密码"
+                          show-word-limit></el-input>
+            </el-form-item>
+<!--年龄-->
+            <el-form-item label="年龄" prop="age">
+                <el-input v-model="ruleFormReg.age"
+                          placeholder="请输入年龄"
+                          style="width: 60%;float: left"></el-input>
+            </el-form-item>
+<!--性别-->
+            <el-form-item label="性别"
+                          prop="sex"
+                          style="text-align: left" >
+                <el-radio-group v-model="ruleFormReg.sex">
+                    <el-radio label="未选择" value="未选择"></el-radio>
+                    <el-radio label="男"    value="男"></el-radio>
+                    <el-radio label="女"    value="女"></el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="submitForm('ruleFormReg')" round>立即注册</el-button>
+                <el-button type="warning" @click="cancelBtnClick" round>取&nbsp&nbsp消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    //邮箱验证  正则匹配QQ邮箱
+    const checkEmail = (rule, value, cb) => {
+        const regEmail = /^([0-9_-]{5,12})+@([q]{2}|[Q]{2})+(\.com|\.COM)+/
+        if (regEmail.test(value)) {
+            return cb()
+        }
+        cb(new Error('请输入正确的邮箱'))
+    }
+
+    //手机号验证  以后估计会用到
+    const checkMobile = (rule, value, cb) => {
+        const regMobile = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
+        if (regMobile.test(value)) {
+            return cb()
+        }
+        cb(new Error('请输入正确的手机号'))
+    }
+
+    //-----------------------------------------------------------------
+
+    export default {
+        data(){
+            return {
+                ruleFormReg: {
+                    us:'',
+                    ps:'',
+                    idCard:'',
+                    age:null,
+                    sex:'',
+                    emailAddress:''
+                },
+                rules: {//触发方式，blur失去焦点，change数据改变;在<el-form-item>中添加prop属性，对应rules中的规则
+                    us: [
+                        {required: true, message: '请输入账号', trigger: 'blur'},
+                        {min: 6, max: 18, message: '长度在 6-18 个字符', trigger: 'blur'}
+                    ],
+                    ps: [
+                        {min: 6, max: 28,required: true, message: '长度在 6-24 个字符', trigger: 'blur'}
+                    ],
+                    idCard:[
+                        {min: 15, max: 18,required: true, message: '长度在 15/18 个字符', trigger: 'blur'}
+                    ],
+                    age: [
+                        {min: 0, max: 150,required: true, message: '范围：0-150', trigger: 'blur'}
+                    ],
+                    emailAddress: [
+                        {required:true,message:'请输入邮箱名',trigger:'blur'},
+                        {//通过validator 进行自定义校验规则
+                            validator:checkEmail,
+                            trigger: 'blur'}
+                    ],
+                }
+                }
+            },
+        methods:{
+            create(){
+                console.log(this.ruleFormReg.sex,'性别！！！！！！！')
+            },
+            submitForm(formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        axios.post('http://127.0.0.1:7001/user/reg', {
+                            us: this.ruleFormReg.us,
+                            ps: this.ruleFormReg.ps,
+                            idCard:this.ruleFormReg.idCard,
+                            age:this.ruleFormReg.age,
+                            sex:this.ruleFormReg.sex,
+                            emailAddress:this.ruleFormReg.emailAddress
+                        })
+                            .then((res) => {
+                                console.log(res, '注册的res');
+                                if (res.data.code==0){
+                                    this.$message.success(res.data.msg);
+                                    Cookies.remove('username',0);
+                                    Cookies.remove('passWord',0);
+                                    this.$router.push('/');
+                                }
+                                else if(res.data.code==-1){
+                                    this.$message.error(res.data.msg);
+                                }
+                            })
+                    }
+                    else {
+                        this.$message.error('格式错误，请重新输入！');
+                        return false;
+                    }
+                });
+            },
+            cancelBtnClick(){
+            this.$router.go(-1);
+                }
+        }
+    }
+</script>
+
+<style>
+    .regist {
+        margin: 250px auto 0  ;
+    }
+    .registBox {
+        text-align: center;
+    }
+</style>

src/components/navigation/verifyAccount.vue

@@ -0,0 +1,88 @@
+<template>
+    <div class="verifyAccountBox">
+        <el-form  :model="ruleForm" class="verifyAccount" ref="ruleForm"  style="width: 18%">
+            <h1>神州餐厅管理系统-验证账号</h1>
+            <br><br>
+            <!--账号-->
+            <el-form-item label="账号：" prop="us">
+                <el-input v-model="ruleForm.us"
+                          placeholder="请输入账号名"
+                          maxlength="18"
+                          show-word-limit></el-input>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="success" round @click="nextBtnClick('ruleForm')">下一步</el-button>
+                <el-button type="primary" round @click="cancelBtnClick">取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data(){
+            return{
+                ruleForm:{
+                    us:'',
+                    emailAddress:''
+                },
+                rules:{
+                    us:[
+                        {required: true, message: '请输入账号', trigger: 'blur'},
+                        {min: 5, max: 18, message: '长度在 5-18 个字符', trigger: 'blur'}
+                    ],
+                }
+            }
+        },
+        created() {
+            if (Cookies.get('username')) {
+                this.ruleForm.us = Cookies.get('username');
+            }
+        },
+        methods: {
+//下一步
+            nextBtnClick(){
+                //刚进来直接点忘记密码，就设置Cookie，取消清空Cookie
+                Cookies.set('username',this.ruleForm.us,1);
+
+                axios.post('http://127.0.0.1:7001/user/verifyAccount',{
+                    us:this.ruleForm.us
+                })
+                    .then((res)=>{
+                        console.log(res,'res!')
+                        if(res.data.code==0){
+                            this.$message.success(res.data.msg)
+                            this.$router.push('/forgetPwd');
+                        }
+                        else if(res.data.code==-1){
+                            this.$message.error(res.data.msg)
+                        }
+                        else if(res.data.code==-2){
+                            this.$message.error(res.data.msg)
+                        }
+                        else if(res.data.code==-3){
+                            this.$message.error(res.data.msg)
+                        }
+                    })
+            },
+//取消
+            cancelBtnClick(){
+                Cookies.remove('username',0);
+                Cookies.remove('passWord',0);
+                this.$router.go(-1);
+            },
+        }
+    }
+</script>
+
+<style>
+    .verifyAccount {
+        margin: 250px auto 0  ;
+    }
+    .verifyAccountBox {
+        text-align: center;
+    }
+</style>

src/main.js

@@ -0,0 +1,31 @@
+
+import Vue from 'vue'
+//import App from './App'
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+import Navi from './components/navigation/Navi.vue'
+import User from './components/navigation/login1';
+import router from './router/index'
+
+import BaiduMap from 'vue-baidu-map'
+Vue.use(BaiduMap, {
+    // ak 是在百度地图开发者平台申请的密钥
+    ak: 'YOUR_APP_KEY'
+})
+
+import echarts from 'echarts'  //引入echarts后，不能全局使用echarts
+Vue.prototype.$echarts = echarts //将echarts保存为全局变量。原则上$echarts可以为任意变量名。
+
+
+
+
+Vue.use(ElementUI);
+
+Vue.config.productionTip = false
+
+new Vue({
+  el: '#app',
+  router,
+  // render: N => N(Navi)
+     render: U => U(User)
+})

src/pageview/baiduMapSignInIntegral.vue

@@ -0,0 +1,7 @@
+<template>
+    <div>
+        <h1>
+            我是百度地图 积分签到页面
+        </h1>
+    </div>
+</template>

src/pageview/page1-1/foodAdd.vue

@@ -0,0 +1,193 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+<!--测试-->
+<!--Cascader 级联动选择器-->
+            <el-form-item label="食物类型" >
+                <el-cascader
+                        v-model="ceshi.value"
+                        :options="ceshi.options"
+                        clearable
+                        :show-all-levels="false"
+                        @change="handleChange"></el-cascader>
+            </el-form-item>
+<!--食物名字-->
+            <el-form-item label="食物名称" prop="name">
+                <el-input v-model="form.name" style="width: 15%"></el-input>
+            </el-form-item>
+<!--食物价格-->
+            <el-form-item label="食物价格" prop="price">
+                <el-input v-model="form.price" style="width: 5%"></el-input>
+            </el-form-item>
+<!--食物描述-->
+            <el-form-item label="食物描述">
+                <el-input type="textarea" v-model="form.desc" style="width: 50%"></el-input>
+            </el-form-item>
+<!--图片上传-->
+            <el-form-item label="上传图片">
+                <el-upload
+                        :headers="header"
+                        name="file"
+                        action="http://127.0.0.1:7001/uploadAli/image"
+                        accept="image/jpeg,image/gif,image/png"
+                        :before-upload="onBeforeUpload"
+                        :on-preview="handlePreview"
+                        :on-remove="handleRemove"
+                        :on-exceed="handleExceed"
+                        :on-success="handleSuccess"
+                        :limit="1"
+                        style="width: 20%"
+                        list-type="picture"
+                        :file-list="fileList">
+                    <el-button size="small" type="primary">点击上传</el-button>
+                </el-upload>
+            </el-form-item>
+<!--立即创建/取消-->
+            <el-form-item>
+                <el-button type="primary" @click="addFoodClick" round>添加食物</el-button>
+                <el-button type="warning" @click="cancelBtnClick" round>取&nbsp消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    export default {
+        data() {
+            return {
+                header:{
+                    'Access-Control-Allow-Origin':'*',
+                },
+
+                valueA:'',
+                fileList:[],
+                CascaderLastInfo:'',
+                form: {
+                    name: '',
+                    price: '',
+                    typename: '',
+                    desc:'',
+                    img:''
+                },
+                rules:{
+                    name:[
+                        {required:true,message:'请填写食物名称',trigger:'blur'}
+                    ],
+                    price:[
+                        {required:true,message:'请填写食物价格',trigger:'blur'}
+                    ]
+                },
+                ceshi:{
+                    options: [
+                        {
+                            value: '饭菜类',
+                            label: '饭菜类',
+                            children: [
+                                {value: '菜品', label: '菜品',
+                                    children:[
+                                        {value:'热菜',label:'热菜',
+                                        children:[
+                                            {value:'炖菜',label:'炖菜'},
+                                            {value:'炒菜',label:'炒菜'}
+                                        ]},
+                                        {value:'凉菜',label:'凉菜'},
+                                    ]},
+                                {value: '饭类', label: '饭类',children:[
+                                        {value:'炒饭',label:'炒饭'},
+                                        {value:'盖浇饭',label:'盖浇饭'},
+                                        {value:'拌饭',label:'拌饭'},
+                                        {value:'米饭',label:'米饭'}
+                                    ]},
+                                {value: '面类', label: '面类',children:[
+                                        {value:'炒面',label:'炒面'},
+                                        {value:'汤面',label:'汤面'},
+                                    ]},
+                                {value: '汤类', label: '汤类'},
+                            ]
+                        },
+                        //--
+                        {value:'酒水饮料', label:'酒水饮料',children:[
+                                {value:'碳酸饮料',label:'碳酸饮料'},
+                                {value:'果汁',label:'果汁'},
+                                {value:'奶茶',label:'奶茶'},
+                            ]},
+                        //--
+                        {
+                            value:'小吃类',
+                            label:'小吃类',
+                            children:[
+                                {value:'经典美味',label:'经典美味'},
+                                {value:'网红小吃',label:'网红小吃'},
+                            ]
+                        },
+                    ]//options的
+                },
+            }
+        },
+        methods: {
+            //测试
+            handleChange(value) {
+                if(value.length>0){
+                    console.log(value[value.length-1],'最后一个');
+                    this.CascaderLastInfo=value[value.length-1];
+                }
+                if(value.length==0){
+                    this.CascaderLastInfo='';
+                }
+            },
+            addFoodClick() {
+                //axios获取后端的api数据，传参，让用户绑定输入的值 赋值给传过去的参数，最后重定向
+                axios.post('http://127.0.0.1:7001/food/create',{
+                    name:this.form.name,
+                    price:this.form.price,
+                    typename:this.CascaderLastInfo,
+                    desc:this.form.desc,
+                    img:this.form.img
+                })
+                    .then((res)=>{
+                    this.$message.success('添加成功！');
+                    this.$router.go(-1);
+                    })
+                    .catch(err=>{
+                        console.log(err);
+                    })
+            },
+            cancelBtnClick(){
+                this.$router.go(-1);
+            },
+            handleRemove(file, fileList) {
+                console.log(file, fileList);
+            },
+            handlePreview(file) {
+                console.log(file);
+            },
+            handleExceed(files, fileList) {
+                this.$message.warning(`当前限制选择1个文件`);
+            },
+            handleSuccess(response, file, fileList){
+                console.log(file,'file');
+                this.form.img=file.response.data;
+            },
+            onBeforeUpload(file)
+            {
+                const isIMAGE = file.type === 'image/jpeg'||'image/gif'||'image/png';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isIMAGE) {
+                    this.$message.error('上传文件只能是图片格式!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传文件大小不能超过 2MB!');
+                }
+                return isIMAGE && isLt2M;
+            },
+        }
+    }
+</script>
+
+<style>
+    template {
+
+    }
+</style>

src/pageview/page1-1/orderCenter.vue

@@ -0,0 +1,80 @@
+<template>
+    <div>
+        <h1>订单中心</h1>
+        <span style="float: right!important;">共有数据：<strong>{{list.length}}</strong> 条</span>
+        <!--tabel表单-->
+        <div>
+            <el-table
+                    ref="multipleTable"
+                    stripe:true
+                    stripe border fit highlight-current-row
+                    :data="list"
+                    height="960"
+                    row-key="_id"
+                    :tree-props="{children: 'shopInfo'}"
+                    style="width: 100%">
+
+                <el-table-column prop="orderNumber" label="订单编号"  width="200" align="center"></el-table-column>
+                <el-table-column prop="orderUS" label="订单人姓名" width="200" align="center"></el-table-column>
+                <el-table-column prop="orderTime" label="购买时的时间" width="200" align="center"></el-table-column>
+                <el-table-column prop="orderPriceAll" label="订单总钱数" width="200" align="center"></el-table-column>
+                <el-table-column prop="orderPrice" label="商品单价"  width="160" align="center"></el-table-column>
+                <el-table-column prop="orderNum" label="商品数量" width="160" align="center"></el-table-column>
+                <el-table-column prop="orderPriceTotal" label="商品总钱数" width="160" align="center"></el-table-column>
+
+            </el-table>
+            <br>
+            <!--取消-->
+            <el-button type="warning" @click="cancelBtnClick" round><i class="el-icon-close"></i> 返回上一级</el-button>
+        </div>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data(){
+            return{
+                list:[],
+                multipleTable:[],
+                form:{
+                    orderPriceAll:'',
+                    orderName:'',
+                    orderUS:'',
+                    orderNum:null,
+                    orderPrice:null,
+                    orderPriceTotal:null,
+                    orderNumber:null,
+                    orderTime:'',
+                }
+            }
+        },
+        mounted() {
+            this.$message.info(Cookies.get('RoleName'));
+            this.tableData();
+        },
+        methods:{
+            tableData(){//登录的时候就将登录的角色存入Cookie,通过存入的角色来判断是否显示全部信息
+
+                if(Cookies.get('RoleObjectId')=='5f8e766ebca0471e0801adc2'){
+                    axios.post('http://127.0.0.1:7001/user/orderCenter/getInfoAll')
+                        .then((res)=>{
+                            this.list=res.data;
+                        })
+                }
+                else{
+                    axios.post('http://127.0.0.1:7001/user/orderCenter/getInfoByKw',{
+                        Kw:Cookies.get('username')
+                    })
+                        .then((res)=>{
+                            this.list=res.data;
+                        })
+                }
+            },
+            cancelBtnClick(){
+                this.$router.go(-1);
+            },
+        }
+    }
+</script>

src/pageview/page1-1/shoppingCart.vue

@@ -0,0 +1,292 @@
+<template>
+    <div>
+        <h1>购物车页面</h1>
+<!--共有多少条数据-->
+        <el-divider><i class="el-icon-shopping-cart-2"></i></el-divider>
+        <span v-show="allPriceNumStatus"><i class="el-icon-shopping-cart-full"></i>总件数:{{this.allNum}}件 &nbsp&nbsp&nbsp&nbsp
+            <i class="el-icon-money"></i>总钱数:{{(this.allPrice).toFixed(2)}}元</span>
+        <span style="float: right!important;">共有数据：<strong>{{totalNum}}</strong> 条</span>
+<!--tabel表单-->
+        <div>
+            <el-table
+                    ref="multipleTable"
+                    @selection-change="handleSelectionChange"
+                    stripe border fit highlight-current-row
+                    :data="list"
+                    :default-sort = "{prop: 'price', order: 'descending'}"
+                    height="400"
+                    style="width: 100%">
+                <el-table-column type="selection" v-model="multipleSelectionStatus" width="55"></el-table-column>
+                <el-table-column type="index" label="序号" align="left" width="60"></el-table-column>
+                <el-table-column prop="shoppingCartName" label="名字" width="180"></el-table-column>
+                <el-table-column label="数量" align="center" width="240">
+                    <template slot-scope="scope">
+                        <el-button @click="reduceFun(scope.row)" :disabled="scope.row.shoppingCatNum===1" size="mini">-</el-button>
+                        &nbsp<span >{{scope.row.shoppingCatNum}}</span>&nbsp
+                        <el-button @click="addCar(scope.row)" :disabled="scope.row.shoppingCatNum===99" size="mini">+</el-button>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="shoppingCartPrice" label="单价" width="100"></el-table-column>
+
+                <el-table-column prop="shoppingCartPriceTotal" label="总钱数" width="100"></el-table-column>
+<!--删除-->
+                <el-table-column label="操作">
+                    <template slot-scope="scope">
+                        <el-button
+                                size="small"
+                                type="danger"
+                                @click="handleDelete(scope.$index, scope.row)">
+                            <i class="el-icon-delete"></i>_删除</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <br>
+<!--购买商品-->
+            <el-button type="primary" @click="buyBtnClick" round><i class="el-icon-check" :loading="true"></i> 购买商品</el-button>
+<!--取消-->
+            <el-button type="warning" @click="cancelBtnClick"  round><i class="el-icon-close"></i> 取消</el-button>
+        </div>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data(){
+            return{
+                multipleSelectionStatus:false,
+                allPriceNumStatus:false,//页面展示的总钱数、总件数信息的【状态】
+                allPrice:0,
+                allNum:0,
+                multipleSelection: [],
+                list:[],
+                multipleTable:[],
+                totalNum:null,
+                form:{
+                    _id:'',
+                    userName:'',
+                    shoppingCartName:'',
+                    shoppingCatNum:null,
+                    shoppingCartPrice:null,
+                    shoppingCartPriceTotal:null
+                }
+            }
+        },
+        mounted() {
+            this.getInfoByKw();
+        },
+        created(){
+            this.allPriceNumStatus;
+        },
+        methods:{
+// 分页获取信息
+            getInfoByKw(){
+                axios.post('http://127.0.0.1:7001/shoppingCart/getInfoByKw',{
+                    Kw:Cookies.get('username')
+                })
+                    .then((res)=>{
+                        this.totalNum=res.data.msg.length;
+                        this.list=res.data.msg;
+                    })
+            },
+//单个删除
+            handleDelete(index, row) {
+                axios.post('http://127.0.0.1:7001/shoppingCart/remove',{_id:row._id})
+                    .then((res)=>{
+                        this.$message.success('删除成功!');
+                        this.getInfoByKw();
+                    })
+            },
+            handleChange(value) {
+                console.log(value);
+            },
+            cancelBtnClick(){
+                this.$router.go(-1);
+            },
+//购物车-数量增加
+            addCar(row){
+                row.shoppingCatNum++;
+                //如果我先选中了集合，在修改数量
+                if(this.multipleSelection.length==0){//集合中没数据
+                    axios.post('http://127.0.0.1:7001/shoppingCart/updateOne',{
+                        _id:row._id,
+                        shoppingCartName:row.shoppingCartName,
+                        shoppingCatNum:row.shoppingCatNum,
+                        shoppingCartPrice:row.shoppingCartPrice,
+
+                    })
+                        .then((res)=>{
+                            this.form.shoppingCartPriceTotal=res.data.shoppingCartPriceTotal;
+                            this.getInfoByKw();
+                        });
+                }
+                else{//集合中有数据，就直接修改 名字符合中的集合中Num值
+                            axios.post('http://127.0.0.1:7001/shoppingCart/updateOne',{
+                                _id:row._id,
+                                shoppingCartName:row.shoppingCartName,
+                                shoppingCatNum:row.shoppingCatNum,
+                                shoppingCartPrice:row.shoppingCartPrice,W
+                            })
+                                .then((res)=>{
+                                    for(let i=0;i<this.multipleSelection.length;i++){
+                                        if(this.multipleSelection[i]._id==row._id){
+                                            this.multipleSelection[i].shoppingCartPriceTotal=res.data.shoppingCartPriceTotal;
+                                        }
+                                    }
+                                    //将增加之后 修改完的每一条数据的总钱数 放到数组里
+                                    this.allPrice=0;
+                                    this.allNum=0;
+                                    this.multipleSelection.forEach((item)=>{
+                                    this.allPrice+=item.shoppingCartPriceTotal;
+                                    this.allNum+=item.shoppingCatNum;
+                                    })
+                                });
+                        }
+            },
+//购物车-数量减少
+            reduceFun(row){
+                row.shoppingCatNum--;
+                if(this.multipleSelection.length==0){
+                    axios.post('http://127.0.0.1:7001/shoppingCart/updateOne',{
+                        _id:row._id,
+                        shoppingCartName:row.shoppingCartName,
+                        shoppingCatNum:row.shoppingCatNum,
+                        shoppingCartPrice:row.shoppingCartPrice,
+
+                    })
+                        .then((res)=>{
+                            this.form.shoppingCartPriceTotal=res.data.shoppingCartPriceTotal;
+                            this.getInfoByKw();
+                        });
+                }
+                else{
+                    axios.post('http://127.0.0.1:7001/shoppingCart/updateOne',{
+                        _id:row._id,
+                        shoppingCartName:row.shoppingCartName,
+                        shoppingCatNum:row.shoppingCatNum,
+                        shoppingCartPrice:row.shoppingCartPrice,
+
+                    })
+                        .then((res)=>{
+                            for(let i=0;i<this.multipleSelection.length;i++){
+                                if(this.multipleSelection[i]._id==row._id){
+                                    this.multipleSelection[i].shoppingCartPriceTotal=res.data.shoppingCartPriceTotal;
+                                }
+                            }
+                            //将增加之后 修改完的每一条数据的总钱数 放到数组里
+                            this.allPrice=0;
+                            this.allNum=0;
+                            this.multipleSelection.forEach((item)=>{
+                            this.allPrice+=item.shoppingCartPriceTotal;
+                            this.allNum+=item.shoppingCatNum;
+                            })
+                        });
+                }
+            },
+//页面显示总钱数、总件数
+            handleSelectionChange(val) {
+                this.multipleSelection = val; //点击选中的时候，就已经将选中的信息放在集合中了
+
+                //如果不选中数据，则让页面显示的总钱数，总件数 不显示
+                if(this.multipleSelection.length==0){
+                    this.allPriceNumStatus=false;
+                }
+                else{
+                    this.allPriceNumStatus=true;
+                }
+                    this.allPrice=0;
+                    this.allNum=0;
+                    for(var i=0;i<this.multipleSelection.length;i++){
+                        this.allPrice+=Number(this.multipleSelection[i].shoppingCartPriceTotal);
+                        this.allNum+=this.multipleSelection[i].shoppingCatNum;
+                    }
+
+            },
+//将私有的购物车，购买完的商品信息传到商品订单页面，没购买的商品还在购物车显示
+            buyBtnClick() {
+
+                const orderNumber1=new Date().getTime();
+                const randomNum=parseInt((Math.random()*9+1)*100000);
+                const orderNumber=orderNumber1.toString()+randomNum.toString();
+
+                if (this.allPrice == 0 && this.allNum == 0) {//购物车为空，点击购买商品的提示信息
+                    this.$message.error('请您勾选要购买的商品，点击取消可以返回上级菜单');
+                }
+                else{
+                    if (confirm('确定要购买嘛？') == true) {
+                        axios.post('http://127.0.0.1:7001/shoppingCart/getInfoByKw', {
+                            Kw: Cookies.get('username')
+                        })
+                            .then((res) => {
+                                    for (let i = 0; i < this.multipleSelection.length; i++) {//将选中购买的商品的statusCode==1
+                                        axios.post('http://127.0.0.1:7001/shoppingCart/updateOne', {
+                                            _id: this.multipleSelection[i]._id,
+                                            shoppingCartName: this.multipleSelection[i].shoppingCartName,
+                                            shoppingCatNum: this.multipleSelection[i].shoppingCatNum,
+                                            shoppingCartPrice: this.multipleSelection[i].shoppingCartPrice,
+                                            statusCode: 1
+                                        })
+                                    }
+                                    })
+                            if(this.multipleSelection.length<2){
+                                    axios.post('http://127.0.0.1:7001/user/orderCenter/addOne', {//单条数据插入到订单中心
+                                        orderNumber: orderNumber,
+                                        orderUS: Cookies.get('username'),
+                                        orderName: this.multipleSelection[0].shoppingCartName,
+                                        orderNum: this.multipleSelection[0].shoppingCatNum,
+                                        orderPrice: this.multipleSelection[0].shoppingCartPrice,
+                                        orderPriceTotal: this.multipleSelection[0].shoppingCartPriceTotal,
+                                        orderPriceAll:this.allPrice,
+                                        orderNumAll:this.allNum
+                                    })
+                                        .then((res) => {
+                                            axios.post('http://127.0.0.1:7001/shoppingCart/removeCode')
+                                        })
+                                        .catch((err) => {
+                                            this.$message.error('失败！');
+                                        })
+                            }
+                            else{
+                                axios.post('http://127.0.0.1:7001/user/orderCenter/addOne',{//先单条插入[0]
+                                    orderNumber: orderNumber,
+                                    orderUS: Cookies.get('username'),
+                                    orderName: this.multipleSelection[0].shoppingCartName,
+                                    orderNum: this.multipleSelection[0].shoppingCatNum,
+                                    orderPrice: this.multipleSelection[0].shoppingCartPrice,
+                                    orderPriceTotal: this.multipleSelection[0].shoppingCartPriceTotal,
+                                    orderPriceAll:this.allPrice,
+                                    orderNumAll:this.allNum
+                                })
+                                    .then(async ()=>{
+                                        for(var Z=0;Z<this.multipleSelection.length-1;Z++) {
+                                            axios.post('http://127.0.0.1:7001/user/orderCenter/addMany', {//在增加[1~n]到子文档
+                                                orderNumber: orderNumber,
+                                                orderUS: Cookies.get('username'),
+                                                orderName: this.multipleSelection[Z + 1].shoppingCartName,
+                                                orderNum: this.multipleSelection[Z + 1].shoppingCatNum,
+                                                orderPrice: this.multipleSelection[Z + 1].shoppingCartPrice,
+                                                orderPriceTotal: this.multipleSelection[Z + 1].shoppingCartPriceTotal
+                                            })
+                                                .then((res) => {
+                                                    axios.post('http://127.0.0.1:7001/shoppingCart/removeCode')
+                                                })
+                                                .catch((err) => {
+                                                    this.$message.error('失败！');
+                                                })
+                                        }
+                                    })
+
+                            }
+                                    this.$message.success(`尊敬的用户，已将该信息提交到订单中心中，请注意查看`);
+                                    //定时任务
+                                    let that = this;
+                                    setTimeout(function () {
+                                        that.getInfoByKw();
+                                    }, 1000);
+                    }
+                }
+            }
+        }
+    }
+</script>

src/pageview/page1.vue

@@ -0,0 +1,539 @@
+<template>
+    <div>
+<!--标题-->
+        <h1 class="food">饭菜类</h1>
+        <el-divider><i class="el-icon-tableware"></i></el-divider>
+
+        <span style="float: right!important;" @click="foodShopClick">
+            <i class="el-icon-shopping-cart-full"></i> 购物车</span>
+        <div>
+<!--批量删除-->
+            <el-button type="danger"
+                       @click="handleSelectionChangeDel"
+            ><i class="el-icon-delete"></i> 批量删除</el-button>
+<!--增加食物-->
+            <el-button type="primary" @click="addFood"><i class="el-icon-burger"></i> 增加食物</el-button>
+            &nbsp
+<!--&lt;!&ndash; 分类查询 &ndash;&gt;-->
+<!--            <el-select v-model="form.typename" placeholder="请选择食物类型" clearable @change="changeType">-->
+<!--                <el-option label="热菜" value="热菜"></el-option>-->
+<!--                <el-option label="凉菜" value="凉菜"></el-option>-->
+<!--                <el-option label="汤类" value="汤类"></el-option>-->
+<!--                <el-option label="炒饭" value="炒饭"></el-option>-->
+<!--                <el-option label="盖饭" value="盖饭"></el-option>-->
+<!--                <el-option label="米饭" value="米饭"></el-option>-->
+<!--            </el-select>-->
+<!--多级联查-->
+            <!--Cascader 级联动选择器-->
+                <el-cascader
+                        v-model="ceshi.value"
+                        :options="ceshi.options"
+                        clearable
+                        :show-all-levels="false"
+                        @change="handleChange">
+                </el-cascader>
+            &nbsp
+<!--模糊查询-->
+            <el-input
+                    placeholder="关键字查询"
+                    v-model="input"
+                    maxlength="15"
+                    show-word-limit
+                    style="width: 15%"
+                    clearable>
+            </el-input>
+            &nbsp
+            <el-button type="primary"  icon="el-icon-search" size="small" @click="fuzzySearch" round>搜索</el-button>
+        </div>
+        <br>
+        &nbsp
+<!--数据条数-->
+        <span style="float: right!important;">共有数据：<strong>{{totalNum}}</strong> 条</span>
+<!--form表单-->
+        <div>
+            <el-table
+                    ref="multipleTable"
+                    stripe border fit highlight-current-row
+                    @selection-change="handleSelectionChange"
+                    :data="list"
+                    :default-sort = "{prop: 'price', order: 'descending'}"
+                    height="800"
+                    style="width: 100%">
+                <el-table-column type="selection" width="55" align="center"></el-table-column>
+                <el-table-column type="index"    label="序号" align="left" width="60"></el-table-column>
+                <el-table-column prop="name"     label="名字" width="120"></el-table-column>
+                <el-table-column prop="price"    label="单价" sortable width="100"></el-table-column>
+                <el-table-column prop="typename" label="食物分类" width="120"></el-table-column>
+                <el-table-column prop="desc"     label="食物描述" width="120"></el-table-column>
+                <el-table-column    label="食物图片" width="200">
+                    <template slot-scope="scope">
+                        <el-image  :src="scope.row.img" style="width: 100px;height: 100px"></el-image>
+                    </template>
+                </el-table-column>
+<!--添加到购物车-->
+                <el-table-column label="购物车" width="200">
+                    <template slot-scope="scope">
+                        <el-button
+                                type="primary"
+                                @click="addToShoppingCart(scope.$index, scope.row)">
+                            添加到购物车<i class="el-icon-shopping-cart-2"></i></el-button>
+                    </template>
+                </el-table-column>
+<!--编辑、删除-->
+                <el-table-column label="操作">
+                    <template slot-scope="scope">
+                        <el-button
+                                size="small"
+                                type="info"
+                                @click="handleEdit(scope.$index, scope.row)">
+                            <i class="el-icon-edit"></i>编辑</el-button>
+                        <el-button
+                                size="small"
+                                type="danger"
+                                @click="handleDelete(scope.$index, scope.row)">
+                            <i class="el-icon-delete"></i>_删除</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+        <div class="block">
+            <el-pagination
+                    @current-change="handleCurrentChange"
+                    :current-page="querData.page"
+                    @size-change="handleSizeChange"
+                    :page-sizes="[5,7,10,100]"
+                    small:true
+                    background
+                    :page-size="querData.pageSize"
+                    :page-count="allPage"
+                    :total="totalNum"
+                    layout="sizes,prev, pager, next,jumper">
+            </el-pagination>
+        </div>
+<!--底部说明-->
+        <footer>
+            <p>{{CopyRight}}</p>
+        </footer>
+<!--食物表编辑弹窗层-->
+        <el-dialog
+                title="更新菜单"
+                :visible.sync="dialogVisible"
+                width="75%">
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+<!--食物名字-->
+                <el-form-item label="食物名称" prop="name">
+                    <el-input v-model="form.name" style="width: 15%"></el-input>
+                </el-form-item>
+<!--食物价格-->
+                <el-form-item label="食物价格" prop="price">
+                    <el-input v-model="form.price" style="width: 15%"></el-input>
+                </el-form-item>
+<!--食物描述-->
+                <el-form-item label="食物描述">
+                    <el-input type="textarea" v-model="form.desc" style="width: 50%"></el-input>
+                </el-form-item>
+<!--&lt;!&ndash;食物类别&ndash;&gt;-->
+<!--                <el-form-item label="食物类型">-->
+<!--                    <el-select v-model="form.typename" placeholder="请选择食物类型">-->
+<!--                        <el-option label="热菜" value="热菜"></el-option>-->
+<!--                        <el-option label="凉菜" value="凉菜"></el-option>-->
+<!--                        <el-option label="汤类" value="汤类"></el-option>-->
+<!--                        <el-option label="炒饭" value="炒饭"></el-option>-->
+<!--                        <el-option label="盖饭" value="盖饭"></el-option>-->
+<!--                        <el-option label="米饭" value="米饭"></el-option>-->
+<!--                    </el-select>-->
+<!--                </el-form-item>-->
+<!--Cascader 级联动选择器-->
+                <el-form-item label="食物类型" >
+                    <el-cascader
+                            v-model="ceshi.value"
+                            :options="ceshi.options"
+                            clearable
+                            :show-all-levels="false"
+                            @change="handleChange"></el-cascader>
+                </el-form-item>
+<!--图片上传-->
+                <el-form-item label="上传图片">
+                    <el-upload
+                            action="http://127.0.0.1:7001/uploadAli/image"
+                            accept="image/jpeg,image/gif,image/png"
+                            :before-upload="onBeforeUpload"
+                            :on-preview="handlePreview"
+                            :on-remove="handleRemove"
+                            :on-exceed="handleExceed"
+                            :on-success="handleSuccess"
+                            :limit="1"
+                            style="width: 20%"
+                            list-type="picture"
+                            :file-list="fileList">
+                        <el-button size="small" type="primary">点击上传</el-button>
+                    </el-upload>
+                </el-form-item>
+<!--立即创建/取消-->
+                <el-form-item>
+                    <el-button type="primary" @click="updateFoodClick" round>更新食物</el-button>
+                </el-form-item>
+            </el-form>
+        </el-dialog>
+    </div>
+</template>
+
+<script type="text/ecmascript-6">
+    const axios = require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data() {
+            return {
+                status:false,
+                fileList:[],
+                dialogVisible: false,
+                _id:null,
+                list: [],
+                page:null,
+                allPage:null,
+                totalNum:null,
+                pageSize:null,
+                CascaderLastInfo:'',
+                querData:{
+                    page:1,
+                    pageSize:5,
+                },
+                CopyRight: '2020  Food  Vue  Demo!',
+                input: '',
+                checked: 'true',
+                multipleTable:[],
+                multipleSelection: [],
+                isdisable: false,
+
+                form: {
+                    _id:'',
+                    name:'',
+                    price:'',
+                    typename:'',
+                    desc:'',
+                    img:'',
+                },
+                rules:{
+                    name:[
+                        {required:true,message:'请填写食物名称',trigger:'blur'}
+                    ],
+                    price:[
+                        {required:true,message:'请填写食物价格',trigger:'blur'}
+                    ]
+                },
+                ceshi:{
+                    options: [
+                        {
+                            value: '饭菜类',
+                            label: '饭菜类',
+                            children: [
+                                {value: '菜品', label: '菜品',
+                                    children:[
+                                        {value:'热菜',label:'热菜',
+                                            children:[
+                                                {value:'炖菜',label:'炖菜'},
+                                                {value:'炒菜',label:'炒菜'}
+                                            ]},
+                                        {value:'凉菜',label:'凉菜'},
+                                    ]},
+                                {value: '饭类', label: '饭类',children:[
+                                        {value:'炒饭',label:'炒饭'},
+                                        {value:'盖浇饭',label:'盖浇饭'},
+                                        {value:'拌饭',label:'拌饭'},
+                                        {value:'米饭',label:'米饭'}
+                                    ]},
+                                {value: '面类', label: '面类',children:[
+                                        {value:'炒面',label:'炒面'},
+                                        {value:'汤面',label:'汤面'},
+                                    ]},
+                                {value: '汤类', label: '汤类'},
+                            ]
+                        },
+                        //--
+                        {value:'酒水饮料', label:'酒水饮料',children:[
+                                {value:'碳酸饮料',label:'碳酸饮料'},
+                                {value:'果汁',label:'果汁'},
+                                {value:'奶茶',label:'奶茶'},
+                            ]},
+                        //--
+                        {
+                            value:'小吃类',
+                            label:'小吃类',
+                            children:[
+                                {value:'经典美味',label:'经典美味'},
+                                {value:'网红小吃',label:'网红小吃'},
+                            ]
+                        },
+                    ]//options的
+                },
+            }
+        },
+        mounted() {
+            this.tabelData();
+        },
+        methods: {
+            //测试--------------------------
+            handleChange(value) {
+                if(value.length>0){
+                    console.log(value[value.length-1],'最后一个');
+                    this.CascaderLastInfo=value[value.length-1];
+                    console.log(this.CascaderLastInfo,'CascaderLastInfo的值')
+                    this.form.typename=this.CascaderLastInfo;
+                }
+                if(value.length==0){
+                    this.CascaderLastInfo='';
+                    console.log(this.CascaderLastInfo,'CascaderLastInfo的值')
+                    this.form.typename=this.CascaderLastInfo;
+                }
+            },
+//分页
+            tabelData() {
+                axios.post('http://127.0.0.1:7001/food/getInfoByPage')
+                    .then((res) => {
+                        this.list = res.data.list;
+                        this.allPage = res.data.allPage;
+                        this.totalNum = res.data.totalNum;
+                        this.pageSize = res.data.pageSize;
+                        this.page = res.data.page;
+                    })
+                    .catch((err) => {
+                        console.log(err);
+                    })
+            },
+//编辑
+            handleEdit(index, row) {
+                this.dialogVisible = true;
+                this.form = row;  //把这一行的值赋值给form
+                console.log(row,'row!!!')
+                this.ceshi.value=row.typename;
+            },
+//弹窗-更新食物
+            updateFoodClick() {
+                axios.post('http://127.0.0.1:7001/food/updateOne', {
+                    _id: this.form._id,
+                    name: this.form.name,
+                    price: this.form.price,
+                    typename: this.form.typename,
+                    desc: this.form.desc,
+                    img: this.form.img,
+                })
+                    .then((res) => {
+                        alert('更新信息成功!');
+                        this.$router.go(0);
+                    })
+            },
+//单个删除
+            handleDelete(index, row) {
+                if (confirm('确定要删除吗') == true) {
+                    axios.post('http://127.0.0.1:7001/food/delete', {_id: row._id})
+                        .then((res) => {
+                            this.$message.success('删除成功!')
+                            this.tabelData();
+                        })
+                }
+            },
+//val 为选中数据的集合
+            handleSelectionChange(val) {
+                this.multipleSelection = val;
+            },
+//批量删除
+            handleSelectionChangeDel() {
+                if (this.multipleSelection.length == 0) {
+                    this.$message.error('请至少选择一项');
+                } else {
+                    if (confirm('确定要删除吗') == true) {
+                        for (var i = 0; i < this.multipleSelection.length; i++) {
+                            const delIdArray = this.multipleSelection[i]._id;
+                            axios.post('http://127.0.0.1:7001/food/delete', {_id: delIdArray})
+                                .then((res) => {
+                                    this.tabelData();
+                                })
+                        }
+                        this.$message.success('删除成功！');
+                    }
+
+                }
+            },
+//分页改变当前页
+            handleCurrentChange(val) {
+                    this.querData.page = val;
+                axios.post('http://127.0.0.1:7001/food/getInfoByPage', this.querData)
+                    .then((res) => {
+                        this.list = res.data.list;
+                    })
+            },
+//分页改变每页数据条数
+            handleSizeChange(val) {
+                this.querData.pageSize = val;    //动态改变
+                this.querData.page = 1;
+                axios.post('http://127.0.0.1:7001/food/getInfoByPage', this.querData)
+                    .then((res) => {
+                        this.list = res.data.list;
+                    })
+            },
+//添加食物
+            addFood() {
+                this.$router.push('/foodRestaurant/food/addFood')
+            },
+//跳转到购物车
+            foodShopClick() {
+                this.$router.push('/food/shoppingCart');
+            },
+//模糊查询
+            fuzzySearch() {
+                //如果没选择type类型
+                if(this.form.typename.length==0 && this.input.length!=0){
+                    axios.post('http://127.0.0.1:7001/food/getInfoByKw', {Kw: this.input})
+                        .then((res) => {
+                            this.list = res.data.data;
+                            this.totalNum=res.data.data.length;
+                        })
+                }
+                //没关键字
+                else if(this.input.length==0 && this.form.typename.length!=0 ){
+                    axios.post('http://127.0.0.1:7001/food/getInfoByType',{
+                        typename:this.form.typename
+                    })
+                        .then((res)=>{
+                            this.list=res.data.data;
+                            this.totalNum=res.data.data.length;
+
+                        })
+                }
+                //如果都为空
+                else if(this.form.typename.length==0 && this.input.length==0 ){
+                    this.tabelData();
+                }
+                //都有
+                else{
+                    axios.post('http://127.0.0.1:7001/food/getInfoByTypeKw',{
+                        type:this.form.typename,
+                        Kw:this.input
+                    })
+                        .then((res)=>{
+                            const that=this;
+                            that.list=res.data.data;
+                            that.totalNum=res.data.data.length;
+                        })
+                }
+            },
+//添加到购物车
+            addToShoppingCart(index, row) {  //添加到购物车
+                row.foodNum++;
+
+                axios.post('http://127.0.0.1:7001/shoppingCart/getInfoByKw',{
+                    Kw: Cookies.get('username'),
+                })
+                    .then((res)=>{
+                        for(var i=0;i<res.data.msg.length;i++){
+                            if(res.data.msg[i].shoppingCartName==row.name){
+                                this.status=true;
+                            }
+                        }
+                        if(this.status!=true){//如果购物车表里 【不存在要添加的信息,则添加】
+
+                            axios.post('http://127.0.0.1:7001/shoppingCart/add', {
+                                _id: row._id,
+                                userName: Cookies.get('username'),
+                                shoppingCartName: row.name,  //商品名字
+                                shoppingCatNum:row.foodNum, //数量
+                                shoppingCartPrice: row.price,//单价
+                                shoppingCartPriceTotal: row.price //总价
+                            })
+                                .then(() => {
+                                    this.$message.success('添加购物车成功！');
+                                })
+                        }
+                        else{//如果存在则修改数量
+                            //修改数量之前需要做个判断，因为你不知道是修改购物车数组里面的哪条数据，
+                            // 只有【名字】符合点击添加的那条数据，才可以进行修改
+                            for(var j=0;j<res.data.msg.length;j++){
+                                //if(修改数量数据.name==row.name)，则进行修改操作
+                                if(res.data.msg[j].shoppingCartName==row.name){
+                                    axios.post('http://127.0.0.1:7001/shoppingCart/updateOne',{
+                                        _id:res.data.msg[j]._id,
+                                        userName:Cookies.get('username'),
+                                        shoppingCartName:row.name,
+                                        shoppingCatNum:res.data.msg[j].shoppingCatNum+1,
+                                        shoppingCartPrice:row.price
+                                    })
+                                        .then((res)=>{
+                                            this.$message.success('添加购物车成功！');
+                                        })
+                                }
+                            }
+                        }
+                        this.status=false; //每次执行完逻辑，重置状态；否则第二个添加不进去，就变成了覆盖
+                    })
+            },
+//图片上传-操作
+            handleRemove(file, fileList) {
+                console.log(file, fileList);
+            },
+            handlePreview(file) {
+                console.log(file);
+            },
+            handleExceed(files, fileList) {
+                this.$message.warning(`当前限制选择1个文件`);
+            },
+            handleSuccess(response, file, fileList){
+                console.log(file,'file');
+                console.log(fileList,'fileList');
+                this.form.img=file.response.data;
+            },
+            onBeforeUpload(file)
+            {
+                const isIMAGE = file.type === 'image/jpeg'||'image/gif'||'image/png';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isIMAGE) {
+                    this.$message.error('上传文件只能是图片格式!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传文件大小不能超过 2MB!');
+                }
+                return isIMAGE && isLt2M;
+            },
+//分类查询
+            changeType(){
+                axios.post('http://127.0.0.1:7001/food/getInfoByType',{
+                    typename:this.form.typename
+                })
+                    .then((res)=>{
+                        this.totalNum=res.data.getTypeListLength;
+                        this.list=res.data.data;
+                    })
+            }
+        }
+    }
+</script>
+
+<style>
+
+    h1 {
+        text-align: center;
+        color: #fbac1a;
+    }
+    .demonstration {
+        color: #d13005;
+        font-family: 楷体;
+    }
+    .block {
+        text-align: center;
+    }
+    footer {
+        background-color: #222222;
+        padding: 10px ;
+        color: skyblue;
+        text-align: center;
+    }
+    .el-dropdown-link {
+        cursor: pointer;
+        color: #409EFF;
+    }
+    .el-icon-arrow-down {
+        font-size: 12px;
+    }
+</style>
+
+

src/pageview/page2.vue

@@ -0,0 +1,98 @@
+<template>
+    <div>
+        <h1>我是page2，账号管理页面</h1>
+        <el-divider><i class="el-icon-s-custom"></i></el-divider>
+        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="80px" style="width: 20%">
+<!--原密码-->
+            <el-form-item label="原密码：" prop="ps">
+                <el-input v-model="ruleForm.ps"
+                          placeholder="请输入原密码"
+                          maxlength="24"
+                          show-word-limit
+                          show-password></el-input>
+            </el-form-item>
+<!--新密码-->
+            <el-form-item label="新密码：" prop="newPs">
+                <el-input v-model="ruleForm.newPs"
+                          placeholder="请输入要更改的密码"
+                          maxlength="24"
+                          show-word-limit
+                          show-password></el-input>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="info" @click="onSubmit('ruleForm')" round>更改信息</el-button>
+                <el-button type="primary" @click="cancelBtnClick" round>取&nbsp&nbsp消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    const axios = require('axios');
+    import Cookies from 'js-cookie';
+    export default {
+        data(){
+            return {
+                ruleForm: {
+                    us:'',
+                    ps:'',
+                    newPs:'',
+                },
+                rules: {//触发方式，blur失去焦点，change数据改变
+                    us: [
+                        {required: true, message: '请输入账号', trigger: 'blur'},
+                        {min: 5, max: 18, message: '长度在 5-18 个字符', trigger: 'blur'}
+                    ],
+                    ps: [
+                        {min: 6, max: 28,required: true, message: '长度在 6-24 个字符', trigger: 'blur'}
+                    ],
+                    newPs: [
+                        {min: 6, max: 28,required: true, message: '长度在 6-24 个字符', trigger: 'blur'}
+                    ]
+                }
+            }
+        },
+        methods:{
+            onSubmit(formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        axios.post('http://127.0.0.1:7001/user/updatePs', {
+                            us: Cookies.get('username'),
+                            ps: this.ruleForm.ps,
+                            newPs: this.ruleForm.newPs,
+                        })
+                            .then((res) => {
+                                console.log(res, 'XXXXXXXXXXXXXX');
+                                if(res.data.code==-1){
+                                    this.$message.error(res.data.msg);
+                                }
+                                else if(res.data.code==-2){
+                                    this.$message.error(res.data.msg);
+                                }
+                                else if(res.data.code==-3){
+                                    this.$message.error(res.data.msg);
+                                }
+                                else if(res.data.code==-4){
+                                    this.$message.error(res.data.msg);
+                                }
+                                else if(res.data.code==0){
+                                    Cookies.remove('username',0);//修改成功清空Cookies账号
+                                    Cookies.remove('passWord',0);//修改成功清空Cookies密码
+                                    this.$message.success(res.data.msg);
+                                    this.$router.push('/');
+                                }
+                            })
+                    }
+                    else {
+                        this.$message.error('格式错误，请重新输入！');
+                        return false;
+                    }
+                });
+            },
+            cancelBtnClick(){
+                this.$router.go(-1);
+            }
+        }
+
+    }
+</script>

src/pageview/page3.vue

@@ -0,0 +1,10 @@
+<template>
+    <div>
+        <h1>Tel：18243068707</h1>
+    </div>
+</template>
+<script type="text/ecmascript-6">
+</script>
+<style>
+
+</style>

src/pageview/page4.vue

@@ -0,0 +1,390 @@
+<template>
+    <div>
+        <h1 style="text-align: center">菜单管理</h1>
+        <el-divider><i class="el-icon-menu"></i></el-divider>
+        <!--模糊查询-->
+        <h5>菜单名称 、访问地址</h5>
+        <el-input
+                placeholder="关键字查询"
+                v-model="input"
+                maxlength="30"
+                show-word-limit
+                style="width: 15%"
+                clearable>
+        </el-input>
+        &nbsp
+        <el-button type="info"  icon="el-icon-search" size="small" @click="kwSearch" round>搜索</el-button>
+<!--增加菜单-->
+        <el-button type="primary" @click="addMenuBtn" round size="small"><i class="el-icon-circle-plus-outline"></i> 新增</el-button>
+<!--菜单管理-->
+        &nbsp
+        <br><br>
+        <el-table
+                ref="multipleTable"
+                stripe border fit highlight-current-row
+                @selection-change="handleSelectionChange"
+                :data="list"
+                height="961"
+                style="width: 100%">
+            <el-table-column type="index"    label="序号"    width="240" align="center"></el-table-column>
+            <el-table-column prop="label"    label="菜单名称" width="240" align="center"></el-table-column>
+            <el-table-column prop="address"  label="访问地址" width="240" align="center"></el-table-column>
+            <el-table-column prop="icon"     label="图标"     width="240" align="center"></el-table-column>
+            <el-table-column prop="fid"      label="父节点"   width="280" align="center"></el-table-column>
+            <!--编辑、删除-->
+            <el-table-column label="操作">
+                <template slot-scope="scope">
+                    <el-button
+                            size="small"
+                            type="info"
+                            @click="handleEdit(scope.$index, scope.row)">
+                        <i class="el-icon-edit"></i>编辑</el-button>
+                    <el-button
+                            size="small"
+                            type="danger"
+                            @click="handleDelete(scope.$index, scope.row)">
+                        <i class="el-icon-delete"></i>_删除</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+<!--菜单表-编辑弹窗层-->
+        <el-dialog
+                :show-close="false"
+                :close-on-press-escape="false"
+                title="更新菜单"
+                :visible.sync="dialogVisible"
+                width="75%">
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+<!--菜单名称-->
+                <el-form-item label="菜单名称" prop="label">
+                    <el-input v-model.lazy="form.label" style="width: 15%"></el-input>
+                </el-form-item>
+<!--访问地址-->
+                <el-form-item label="访问地址" prop="address">
+<!--                    <el-input v-model.lazy="form.address" style="width: 15%" :disabled="true"></el-input>-->
+                    <el-input v-model.lazy="form.address" style="width: 15%"></el-input>
+                </el-form-item>
+<!--图标-->
+                <el-form-item label="图标" prop="icon">
+                    <el-input type="text" v-model.lazy="form.icon" style="width: 20%"></el-input>
+                </el-form-item>
+<!--节点选择-->
+                <el-form-item label="节点选择" prop="fid">
+                    <el-select v-model="form.fid" placeholder="请选择">
+                        <el-option
+                                v-for="item in rewriteArr"
+                                :label="item.label"
+                                :value="item._id">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+<!--立即创建/取消-->
+                <el-form-item>
+                    <el-button type="primary" @click="updateFoodClick" round>更新信息</el-button>
+                    <el-button type="primary" @click="cancelUpdateFoodClickBtn" round>取消</el-button>
+                </el-form-item>
+            </el-form>
+        </el-dialog>
+
+<!--菜单信息-新增弹窗层-->
+        <el-dialog
+                title="新增菜单"
+                :visible.sync="dialogVisibleAdd"
+                width="50%">
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+<!--菜单名称-->
+                <el-form-item label="菜单名称" prop="label">
+                    <el-input v-model="form.label" style="width: 25%"></el-input>
+                </el-form-item>
+<!--访问地址-->
+                <el-form-item label="访问地址" >
+                    <el-input v-model="form.randomAddress" style="width: 25%" :disabled="false"></el-input>
+                </el-form-item>
+<!--图标-->
+                <el-form-item label="图标">
+                    <el-input type="text" v-model="form.icon" style="width: 40%"></el-input>
+                </el-form-item>
+<!--父节点测试-->
+                <el-form-item label="节点选择" prop="fid">
+                    <el-select v-model="form.fid" placeholder="请选择">
+                        <el-option
+                                v-for="item in rewriteArr"
+                                :label="item.label"
+                                :value="item._id">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+<!--立即创建/取消-->
+                <el-form-item>
+                    <el-button type="primary" @click="createMenuInfo" round>新增</el-button>
+                    <el-button type="warning" @click="cancelBtnClick" round>取消</el-button>
+                </el-form-item>
+            </el-form>
+        </el-dialog>
+<!--底部说明-->
+        <footer>
+            <p>{{CopyRight}}</p>
+        </footer>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    export  default {
+        data(){
+            return {
+                updateDialogStatus:false,
+                rewriteArr:[],
+                menuList:[],
+                menuFatherChildren:['父节点','子节点'],
+                dialogVisible: false,
+                dialogVisibleAdd: false,
+                list:[],
+                input: '',
+                CopyRight:'2020  Menu  Vue  Demo ! ',
+                form: {
+                    randomAddress:'',
+                    _id:'',
+                    label:'',
+                    icon:'',
+                    fid:'',
+                    address:'',
+                },
+                rules:{
+                    label:[
+                        {required:true,message:'请填菜单名称',trigger:'blur'}
+                    ],
+                    address:[
+                        {required:true,message:'请填写访问地址',trigger:'blur'}
+                    ],
+                    fid:[
+                        {required:true,message:'请选择节点',trigger:'blur'}
+                    ],
+                }
+            }
+        },
+        created() {
+            const arr=[];
+
+            this.getInfo();
+            axios.post('http://127.0.0.1:7001/menu/find')
+                .then((res)=>{
+                    this.menuList=this.putTree(res.data.data);
+                    this.menuList.push({label:'父节点',_id:0})
+
+                    //更改模式
+                    for (let i=0;i<this.menuList.length;i++){
+                        if(this.menuList[i].label!='父节点'){
+                            arr.push({label:'子节点-'+this.menuList[i].label,_id:this.menuList[i]._id})
+                        }
+                        else{
+                            arr.push({label:this.menuList[i].label,_id:String(this.menuList[i]._id)})
+                        }
+                    }
+                    this.rewriteArr=arr;
+                })
+        },
+        methods:{
+            //获取信息
+            getInfo(){
+                axios.post('http://127.0.0.1:7001/menu/find')
+                    .then((res)=>{
+                        this.list=res.data.data;
+                    })
+            },
+            //val 为选中数据的集合
+            handleSelectionChange(val) {
+                this.multipleSelection = val;
+            },
+            //单个删除
+            handleDelete(index, row) {
+                if (confirm('确定要删除吗') == true) {
+                    axios.post('http://127.0.0.1:7001/menu/remove', {_id: row._id})
+                        .then((res) => {
+                            this.$message.success('删除成功!')
+                            let that = this;
+                            setTimeout(function () {
+                                that.getInfo();
+                            }, 300);
+                        })
+                }
+            },
+            //编辑-弹窗信息
+            handleEdit(index, row) {
+                this.dialogVisible = true;
+                // this.form = row;  //把这一行的值赋值给form
+                this.form = {
+                    randomAddress:row.randomAddress,
+                    _id:row._id,
+                    label:row.label,
+                    icon:row.icon,
+                    fid:row.fid,
+                    address:row.address
+                };
+
+            },
+            //编辑-修改事件
+            updateFoodClick() {
+                axios.post('http://127.0.0.1:7001/menu/updateOne',
+                    {
+                    _id: this.form._id,
+                    label: this.form.label,
+                    address: this.form.address,
+                    icon: this.form.icon,
+                    fid:this.form.fid
+                })
+                    .then((res) => {
+                        if(res.data.code==0){
+                            this.$message.success(res.data.msg);
+
+                            this.dialogVisible = false;
+                            this.form.label='';
+                            this.form.icon='';
+                            this.form.address='';
+                            this.form.fid='';
+
+                            let that = this;
+                            setTimeout(function () {
+                                that.getInfo();
+                            }, 300);
+                        }
+                        else if(res.data.code==-1){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-2){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-3){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-4){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-5){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-6){
+                            this.$message.error(res.data.msg);
+                        }
+                    })
+                    .catch((err)=>{
+                        console.log(err,'err')
+                    })
+            },
+            cancelUpdateFoodClickBtn(){
+                this.dialogVisible=false;
+                this.getInfo();
+            },
+            addMenuBtn(){
+                this.form.label='',
+                this.form.icon='',
+                this.form.address='',
+                this.form.fid='',
+                this.dialogVisibleAdd =true;
+            },
+            //弹窗-增加菜单按钮
+            createMenuInfo(){
+                const randomAddress=parseInt((Math.random()*9+1)*100000);
+                const data=new Date().getTime()
+                const randomDataStr=`#${String(data)+String(randomAddress)}`;
+                this.form.randomAddress=randomDataStr;
+                console.log(this.form.randomAddress,'this.form.randomAddress')
+
+                axios.post('http://127.0.0.1:7001/menu/addOne',{
+                    label:this.form.label,
+                    address:this.form.randomAddress,
+                    icon:this.form.icon,
+                    fid:this.form.fid,
+                })
+                    .then((res)=>{
+                        console.log(res,'res.data');
+                        if(res.data.code==0){
+                            this.$message.success(res.data.msg);
+                            this.dialogVisibleAdd = false;
+                            this.form.label='';
+                            this.form.icon='';
+                            this.form.address='';
+                            this.form.fid='';
+                            let that = this;
+                            setTimeout(function () {
+                                that.getInfo();
+                            }, 300);
+                        }
+                        else if(res.data.code==-1){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-2){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-3){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-4){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-5){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-6){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-7){
+                            this.$message.error(res.data.msg);
+                        }
+                    })
+            },
+            //弹窗-取消按钮
+            cancelBtnClick(){
+                this.form.label='',
+                this.form.icon='',
+                this.form.address='',
+                this.form.fid='',
+                this.dialogVisibleAdd=false;
+            },
+            //关键字搜索
+            kwSearch(){
+                axios.post('http://127.0.0.1:7001/menu/kwSearch',{
+                    kw:this.input
+                })
+                    .then((res)=>{
+                        if(res.data.code==-2){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==-1){
+                            this.$message.error(res.data.msg);
+                        }
+                        else if(res.data.code==0){
+                            this.$message.success(res.data.msg);
+                            this.list=res.data.data;
+                        }
+                    })
+            },
+            putTree(arr,child='_id',father='fid',mostKey='0',childKey='children'){
+
+                let map = {};
+                // map是映射的意思，将一个数组映射成一个新数组。
+                // h[key]返回映射h中的自变量key映射到的value的值
+
+                let resultArr = [];
+                arr.forEach((item) => {
+                    item[childKey] = [];  //让所有的item中，每条数据增加一条children:{type:[]} 字段；children的作用是，放孩子路由
+                    map[item[child]] = item;
+                });
+                // console.log(map,'map')
+
+                arr.forEach((item) => {
+                    if (item[father]){ //如果二级路由的Key存在
+                        if (item[father] == mostKey) {   //如果 二级路由的Key==0 (说明此条item是一级路由)
+                            resultArr.push(item);     //就添加到resultArr数组里;
+                        }
+                        else {//如果二级路由的Key != 0； 说明此条item是二级路由
+                            map[item[father]][childKey].push(item);//为什么可以push，因为item里的children字段，是一个[数组]格式
+                        }
+                    }
+                });
+                return resultArr;
+            },
+        }
+    }
+</script>

src/pageview/page5.vue

@@ -0,0 +1,281 @@
+<template>
+    <div>
+        <h1>
+             我是角色管理页面
+        </h1>
+
+<!--增加菜单-->
+        <el-button type="primary" @click="addRoleBtn" round size="small"><i class="el-icon-circle-plus-outline"></i> 新增</el-button>
+        <br><br>
+<!--角色管理-->
+        <el-table
+                ref="multipleTable"
+                stripe border fit highlight-current-row
+                :data="list"
+                height="961"
+                style="width: 100%">
+            <el-table-column type="index"    label="序号"    width="240" align="center"></el-table-column>
+            <el-table-column prop="role_name"    label="角色名称" width="240" align="center"></el-table-column>
+            <el-table-column prop="role_status"  label="可用状态" width="240" align="center"></el-table-column>
+            <el-table-column prop="permission"
+                             label="权限"
+                             :formatter="formatter"
+                             width="280"
+                             align="center"></el-table-column>
+<!--单个删除-->
+            <el-table-column label="操作">
+                <template slot-scope="scope">
+                    <el-button
+                            size="small"
+                            type="info"
+                            @click="handleEdit(scope.$index, scope.row)">
+                        <i class="el-icon-edit"></i>编辑</el-button>
+                    <el-button
+                            size="small"
+                            type="danger"
+                            @click="handleDelete(scope.$index, scope.row)">
+                        <i class="el-icon-delete"></i>_删除</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+<!--菜单信息-新增/编辑弹窗层-->
+        <el-dialog
+                :title="form._id?'修改角色':'新增角色'"
+                :visible.sync="dialogVisibleAdd"
+                width="50%">
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+<!--菜单名称-->
+                <el-form-item label="角色名称" prop="label">
+                    <el-input v-model="form.role_name" style="width: 25%"></el-input>
+                </el-form-item>
+
+<!--角色权限管理-->
+                <el-form-item label="角色权限" >
+                    <el-checkbox-group v-model="checkListValue"
+                                       @change="handleCheckedCitiesChange">
+                        <el-checkbox
+                                v-for="item in checkList"
+                                :label="item._id">{{item.label}}</el-checkbox>
+                    </el-checkbox-group>
+                </el-form-item>
+<!--立即创建/取消-->
+                <el-form-item>
+                    <el-button type="primary" @click="form._id?updateRoleBtn():createRoleBtn()" round>{{form._id?'修改':'新增'}}</el-button>
+                    <el-button type="warning" @click="cancelBtnClick" round>取消</el-button>
+                </el-form-item>
+            </el-form>
+        </el-dialog>
+<!--底部说明-->
+        <footer>
+            <p>{{CopyRight}}</p>
+        </footer>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+
+
+
+    export default {
+        data(){
+            return{
+
+                ceshi1:[],
+                value:[],
+                checkList:[],
+                checkListValue:[],
+                rolePermissionList:[],
+                list:[],
+                CopyRight:'2020  Role  Vue  Demo ! ',
+                dialogVisibleAdd:false,
+                form: {
+                    _id:'',
+                    role_name:'',
+                    role_status:'',
+                    permission:[],
+                },
+                rules:{
+                    role_name:[
+                        {required:true,message:'请填菜单名称',trigger:'blur'}
+                    ],
+                }
+            }
+        },
+        created(){
+            this.getRoleInfo();
+            this.getMenuInfo();
+        },
+        methods:{
+            getRoleInfo(){
+                axios.get('http://127.0.0.1:7001/role/roleMenuFindPopulate')
+                    .then((res)=>{
+                        // console.log(res.data.data,'RoleInfo!!')
+                        this.list=res.data.data;
+                    })
+            },
+            getMenuInfo(){//获取菜单表的信息，作为角色表的权限
+                const MenuInfoArr=[];
+                axios.post('http://127.0.0.1:7001/menu/find')
+                    .then((res)=>{
+                        // console.log(res.data.data,'MenuInfo')
+                        res.data.data.forEach((item)=>{
+                            MenuInfoArr.push(item)
+                        })
+                        this.checkList=MenuInfoArr;
+                    })
+            },
+            formatter(row, column) {
+                const permissionArr=[];
+                row.permission.forEach((item)=>{
+                    permissionArr.push(`${item.label} `)
+                })
+                return permissionArr;
+            },
+            handleCheckedCitiesChange(value){
+                this.checkListValue=value;
+                // console.log(this.checkListValue,'点击选择的复选框集合！')
+            },
+            //单条删除
+            handleDelete(index,row) {
+                if (confirm('确定要删除吗') == true) {
+                    axios.post('http://127.0.0.1:7001/role/remove', {_id: row._id})
+                        .then((res) => {
+                            this.$message.success('删除成功!')
+                            const that=this;
+                            setTimeout(function () {
+                                that.getRoleInfo()
+                            },300)
+                        })
+                }
+            },
+            //新增角色-打开Dilog弹窗
+            addRoleBtn(){
+                this.form._id='',
+                this.form.role_name='',
+                this.value=[],
+                this.checkListValue=[],
+                this.dialogVisibleAdd =true;
+            },
+            //新增角色
+            createRoleBtn(){
+                //点击创建;
+                //细节分为：1.权限长度为1创建 2.长度大于1的时候创建，分别调用不同的接口
+                if(this.checkListValue.length==0 || this.form.role_name.length==0){
+                    if(this.form.role_name.length==0){
+                        this.$message.error('请填写要生成的角色名');
+                    }
+                    else if(this.value.length==0){
+                        this.$message.error('请至少选择一项');
+                    }
+                }
+                else if(this.checkListValue.length==1){
+                    console.log(this.checkListValue[0],'this.checkListValue!!!');
+                    axios.post('http://127.0.0.1:7001/role/roleAddOne',{
+                        role_name:this.form.role_name,
+                        permission:this.checkListValue[0]
+                    })
+                        .then((res)=>{
+                            if(res.data.code==0){
+                                this.$message.success(`角色-${this.form.role_name}-生成成功`);
+                                this.dialogVisibleAdd=false;
+                                this.getRoleInfo();
+                            }
+                            if(res.data.code==-1) this.$message.error(res.data.msg);
+                        })
+                }
+                else{//多条插入
+                    axios.post('http://127.0.0.1:7001/role/roleAddOne',{
+                        role_name:this.form.role_name,
+                        permission:this.checkListValue[0]
+                    })
+                        .then(async(res)=>{
+                            for(let i=0;i<this.checkListValue.length-1;i++){
+                                axios.post('http://127.0.0.1:7001/role/roleAddMany',{
+                                    role_name:this.form.role_name,
+                                    permission:this.checkListValue[i+1]
+                                })
+                            }
+                            if(res.data.code==0){
+                                this.$message.success(`多级权限-${this.form.role_name}-生成成功`);
+                                this.checkListValue=[];
+                                this.dialogVisibleAdd=false;
+                                const that = this;
+                                setTimeout(function () {
+                                    that.getRoleInfo();
+                                }, 300);
+                            }
+                            else if(res.data.code==-1) {
+                                this.$message.error(res.data.msg);
+                            }
+                        })
+                }
+            },
+            //dialog-编辑弹窗
+            handleEdit(index, row) {
+                console.log(row,'点击获取行信息！！');
+                this.dialogVisibleAdd = true;
+
+                const permissionArrList=[];
+                row.permission.forEach((item)=>{
+                    permissionArrList.push(item._id);
+                })
+                //将row的信息 赋值给form
+                this.form = {
+                    _id:row._id,
+                    role_name:row.role_name,
+                    role_status:row.role_status,
+                    permission:permissionArrList
+                };
+                this.checkListValue=permissionArrList;
+                console.log(this.form,'dialog-编辑按钮')
+            },
+            //编辑弹窗-修改按钮
+            updateRoleBtn(){
+               axios.post('http://127.0.0.1:7001/role/updateRoleName',
+                    {_id:this.form._id,
+                    role_name:this.form.role_name})
+                   .then(res=>{
+                       console.log(res,'res')
+                       if(res.data.code==0){//继续执行
+                           console.log('我要删除子文档了！')
+                           axios.post('http://127.0.0.1:7001/role/emptyChlidrenInfo',{
+                               _id:this.form._id,
+                           })
+                               .then(()=>{
+                                   //这个直接增加子文档，不走新增角色接口
+                                   for(let i=0;i<this.checkListValue.length;i++){
+                                       axios.post('http://127.0.0.1:7001/role/roleAddMany',{
+                                           role_name:this.form.role_name,
+                                           permission:this.checkListValue[i]
+                                       })
+                                   }
+                                   this.dialogVisibleAdd=false;
+                                   this.$message.success('修改成功') ;
+                                   //这块可以做个优化，
+                                   //如果修改的不是自己的，就setTimeout，是自己的就刷新，
+                                   //因为，如果修改自己的，在用setTimeout的话，导航栏新增的不刷新
+                                   //定时任务
+                                   let that = this;
+                                   setTimeout(function () {
+                                       that.getRoleInfo();
+                                   }, 300);
+                               })
+                       }
+                       else{//角色名重复
+                           this.$message.error(res.data.msg)
+                       }
+                   })
+            },
+            cancelBtnClick(){
+                this.form._id='',
+                this.form.role_name='',
+                this.form.role_status='',
+                this.value=[],
+                this.dialogVisibleAdd =false;
+            },
+        }
+    }
+</script>

src/pageview/page6.vue

@@ -0,0 +1,204 @@
+<template>
+    <div>
+        <h1>
+            我是权限管理页面
+        </h1>
+<!--角色管理-->
+        <el-table
+                ref="multipleTable"
+                stripe border fit highlight-current-row
+                :data="list"
+                height="961"
+                style="width: 100%">
+            <el-table-column type="index"    label="序号"    width="180" align="center"></el-table-column>
+            <el-table-column prop="us"       label="用户名称" width="180" align="center"></el-table-column>
+            <el-table-column prop="age"       label="用户年龄" width="180" align="center"></el-table-column>
+            <el-table-column prop="sex"      label="用户性别" width="180" align="center"></el-table-column>
+            <el-table-column prop="emailAddress"  label="用户邮箱" width="240" align="center"></el-table-column>
+            <el-table-column prop="role.role_name"     label="用户等级" width="200" align="center"></el-table-column>
+
+            <!--单个删除-->
+            <el-table-column label="操作">
+                <template slot-scope="scope">
+                    <el-button
+                            size="small"
+                            type="info"
+                            @click="handleEdit(scope.$index, scope.row)">
+                        <i class="el-icon-edit"></i>编辑</el-button>
+                    <el-button
+                            size="small"
+                            type="danger"
+                            @click="handleDelete(scope.$index, scope.row)">
+                        <i class="el-icon-delete"></i>_删除</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+<!--菜单信息-新增/编辑弹窗层-->
+        <el-dialog
+                title="修改权限"
+                :visible.sync="dialogVisible"
+                width="50%">
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+                <!--用户名称-->
+                <el-form-item label="用户名称" prop="label">
+                    <el-input v-model="form.us" style="width: 25%" :disabled="true" ></el-input>
+                </el-form-item>
+                <!--用户性别-->
+                <el-form-item label="用户性别" prop="label">
+                    <el-input v-model="form.sex" style="width: 25%" :disabled="true"></el-input>
+                </el-form-item>
+                <!--用户邮箱-->
+                <el-form-item label="用户邮箱" prop="label">
+                    <el-input v-model="form.emailAddress" style="width: 25%" :disabled="true"></el-input>
+                </el-form-item>
+                <!--用户等级-->
+                <el-form-item label="用户等级" prop="label">
+                    <el-select v-model="form.role" placeholder="请选择">
+                        <el-option
+                                v-for="item in userRoleList"
+                                :label="item.role_name"
+                                :value="item._id">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+
+                <!--立即创建/取消-->
+                <el-form-item>
+                    <el-button type="primary" @click="updateRoleName" round>修改</el-button>
+                    <el-button type="warning" @click="cancelBtnClick" round>取消</el-button>
+                </el-form-item>
+            </el-form>
+        </el-dialog>
+
+<!--底部说明-->
+        <footer>
+            <p>{{CopyRight}}</p>
+        </footer>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+
+    export default {
+        data(){
+            return{
+                list:[],
+                userRoleList:[],
+                CopyRight:'2020  Permission  Vue  Demo ! ',
+                dialogVisible:false,
+                form: {
+                    _id:'',
+                    us:'',
+                    age:'',
+                    sex:'',
+                    role:'',
+                    emailAddress:'',
+                },
+                rules:{
+                    dept:[
+                        {required:true,message:'请填写用户等级',trigger:'blur'}
+                    ],
+                }
+            }
+        },
+        created(){
+            this.getUserInfo();
+            this.getroleNameInfo();
+        },
+        methods:{
+            getUserInfo(){
+
+                axios.get('http://127.0.0.1:7001/user/userRolePopulateFind',
+                    {
+                        headers:{
+                            // 切记 token 不要直接发送，要在前面加上 Bearer 字符串和一个空格
+                            // 'Authorization':`Bearer ${Cookies.get('token')}`
+                            // 'Authorization':"Bearer " + Cookies.get('token')
+                            'token':Cookies.get('token')
+                        }
+                    })
+                    .then((res)=>{
+                        this.list=res.data;
+                    })
+                    .catch(error=>{//token过期的处理
+                        if(error.response.data.code==-1){
+                            this.$message.info(error.response.data.massage);
+                                this.$router.replace('/');
+                        }
+                    })
+            },
+            getroleNameInfo(){
+                axios.get('http://127.0.0.1:7001/role/findroleName')
+                    .then(res=>{
+                        res.data.forEach(item=>{
+                            this.userRoleList.push(item)
+                        })
+                    })
+            },
+            handleEdit(index, row) {
+                this.dialogVisible = true;
+                console.log(row,'row!!!!!')
+                if(row.role==null){
+                    this.form={
+                        _id:row._id,
+                        us:row.us,
+                        sex:row.sex,
+                        emailAddress:row.emailAddress,
+                    }
+                    this.$message.info('该用户的角色权限已被删除，请重新赋予其权限')
+                }
+                else{
+                    this.form={
+                        _id:row._id,
+                        us:row.us,
+                        sex:row.sex,
+                        role:row.role.role_name,
+                        emailAddress:row.emailAddress,
+                    }
+                }
+            },
+            updateRoleName(){
+                axios.post('http://127.0.0.1:7001/user/updateDept',{
+                    _id:this.form._id,
+                    role:this.form.role
+                })
+                    .then((res)=>{
+                        if(res.data.code==0){
+                            this.$message.success(res.data.msg);
+                            this.dialogVisible=false;
+                            // 定时任务
+                            let that = this;
+                            setTimeout(function () {
+                                that.getUserInfo();
+                            }, 300);
+                        }
+                        else if(res.data.code==-1)this.$message.error(res.data.msg)
+                    })
+            },
+            handleDelete(index, row){
+                if (confirm('确定要删除吗') == true) {
+                    axios.post('http://127.0.0.1:7001/user/removeUserInfo', {_id: row._id})
+                        .then((res) => {
+                            this.$message.success('删除成功!')
+                            // 定时任务
+                            let that = this;
+                            setTimeout(function () {
+                                that.getUserInfo();
+                            }, 300);
+                        })
+                }
+            },
+            cancelBtnClick(){
+                    this.form._id='',
+                    this.form.us='',
+                    this.form.sex='',
+                    this.form.role='',
+                    this.form.emailAddress='',
+                    this.dialogVisible =false;
+            },
+        }
+    }
+</script>

src/pageview/page7.vue

@@ -0,0 +1,421 @@
+<template>
+
+<div>
+
+<div>
+    <div class="block">
+        <span class="demonstration">筛选日区间：</span>
+        <el-date-picker
+                v-model="orderCenterValue"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                :default-time="['00:00:00', '23:59:59']"
+        >
+        </el-date-picker>
+        <el-button type="primary" @click="dateBtnClick"> &nbsp 查询</el-button>
+    </div>
+    <br>
+    <div id="main" :style="{width: '1500px', height: '550px'}"></div>
+</div>
+
+    <br>
+
+<div>
+    <div class="block">
+        <span class="demonstration">筛选日区间：</span>
+        <el-date-picker
+                v-model="loginDateValue"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                :default-time="['00:00:00', '23:59:59']"
+        >
+        </el-date-picker>
+        <el-button type="primary" @click="loginBtnClick">查询</el-button>
+    </div>
+    <br>
+    <div id="main44" :style="{width: '1500px', height: '500px'}"></div>
+</div>
+
+</div>
+
+</template>
+
+<script>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    import moment from 'moment'//导入文件
+
+    export default {
+        name: 'Echarts',
+        data(){
+            return{
+                msg: 'Welcome to Your Vue.js App',
+                loginInfoCollections:[],
+                orderDate:[],
+                orderAllPrice:[],
+                orderAvgPrice:[],
+                loginDateXX:[],
+                loginSuccessInfoYY:[],
+                loginErrorInfoYY:[],
+                xZhou:[],
+                yZhou:[],
+                avgPriceY:[],
+                loginX:[],
+                loginSuccessY:[],
+                loginErrorY:[],
+                orderCenterValue: '',
+                loginDateValue:''
+            };
+        },
+        created(){
+            this.getOrderCenterInfo();
+            this.getLoginInfo();
+        },
+        mounted(){
+            // 这个定时任务其实不想用来着，但是不用的话 数据无法正常显示
+            // 等ecahrs图标正确显示完，在问下阔生这个问题
+            // 定时任务
+            let that = this;
+            setTimeout(function () {
+                that.myEcharts();
+                that.myLoginEchars();
+            },300)
+
+        },
+        methods:{
+            //获取数据
+            getOrderCenterInfo(){
+                //先获取本月的开始时间戳，和结束时间戳，getDate-天数
+                let orderYear1=new Date().getFullYear();
+                let orderMonth1=(new Date().getMonth())+1;
+                let orderDate1=new Date().getDate();
+
+                axios.post('http://127.0.0.1:7001/user/orderCenter/groupFind')
+                    .then(res=>{
+                        let data1=[];
+                        let data2=[];
+                        for(let i=1;i<=orderDate1;i++){
+                                data1.push({
+                                date:`${orderYear1}-${orderMonth1}-${i}`,
+                                priceAll:Number(0),
+                                priceAvg:Number(0)})
+                        }
+                        res.data.forEach(item=>{
+                            data2.push({date:`${item._id.orderYear}-${item._id.orderMonth}-${item._id.orderDate}`,
+                                priceAll:Number((item.totalPriceAll).toFixed(0)),
+                                priceAvg:Number((item.totalPriceAll/item.totalNumAll).toFixed(0))})
+                        })
+                        //数据的处理
+                        data1.map((item,index)=>{
+                            data2.map(items=>{
+                                if(items.date===item.date){
+                                    data1[index]=items
+                                }
+                            })
+                        })
+                        //将数组拆分开，放到ecahrs里
+                        const dateArr=[];
+                        data1.forEach(item=>{
+                            dateArr.push(item.date)
+                            this.orderAllPrice.push(item.priceAll)
+                            this.orderAvgPrice.push(item.priceAvg)
+                        })
+                        //转化日期格式
+                        dateArr.forEach(item=>{
+                            this.orderDate.push(moment(item,'YY-MM-DD').format("MM-DD"))
+                        })
+                    })
+            },
+
+            getLoginInfo(){
+                let loginYear1=new Date().getFullYear();
+                let loginMonth1=(new Date().getMonth())+1;
+                let loginDate1=new Date().getDate();
+
+                axios.post('http://127.0.0.1:7001/login/groupFind')
+                    .then(res=>{
+                        const data5=[];
+                        const data6=[];
+                        for(let i=1;i<=loginDate1;i++){
+                                data5.push({
+                                date:`${loginYear1}-${loginMonth1}-${i}`,
+                                loginSuccessInfo:Number(0),
+                                loginErrorInfo:Number(0)})
+                        }
+                        res.data.forEach(item=>{
+                            data6.push({
+                                date: `${item._id.loginYear}-${item._id.loginMonth}-${item._id.loginDate}`,
+                                status:Number(item._id.loginInfo),
+                                count:Number(item.count),
+                            })
+                        })
+                        data5.map((item,index)=>{
+                            data6.map(items=>{
+                                if(item.date===items.date){
+                                    if(items.status===1){
+                                        data5[index].loginSuccessInfo=items.count;
+                                    }
+                                    else if(items.status===0){
+                                        data5[index].loginErrorInfo=items.count;
+                                    }
+                                }
+                            })
+                        })
+                        const loginDateX=[];
+                        data5.forEach(item=>{
+                            loginDateX.push(item.date);
+                            this.loginSuccessInfoYY.push(item.loginSuccessInfo);
+                            this.loginErrorInfoYY.push(item.loginErrorInfo);
+                        })
+                        loginDateX.forEach(item=>{
+                            this.loginDateXX.push(moment(item,'YY-MM-DD').format('MM-DD'));
+                        })
+                    })
+            },
+            myEcharts(){
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = this.$echarts.init(document.getElementById('main'));
+                // 指定图表的配置项和数据
+                let option = {
+                    tooltip: {},
+                    legend: {
+                        data:['总金额','平均金额']
+                    },
+                    xAxis:
+                        {
+                        name:'日期(day)',
+                        type : 'category',
+                        axisTick: {show:false},
+                        data: this.orderDate
+                     },
+                    yAxis: {
+                        name: '金额',
+                    },
+                    series: [
+                        {
+                            name:'总金额',
+                            type: 'bar',//图形类型
+                            data: this.orderAllPrice,
+                            color:'#CC0066'
+                        },
+                        {
+                            name:'平均金额',
+                            type: 'bar',//图形类型
+                            data: this.orderAvgPrice,
+                            color:'#009999'
+                        }
+                             ]
+                };
+                // 使用刚指定的配置项和数据显示图表。
+                myChart.setOption(option);
+            },
+            myLoginEchars(){
+                let myLoginEchars = this.$echarts.init(document.getElementById('main44'));
+                let option={
+                    title : {
+                        text: '登录状态统计',
+                        subtext: '成功/失败'
+                    },
+                    tooltip : {//提示工具
+                        trigger: 'axis'//方式
+                    },
+                    legend: {
+                        data:['成功','失败']
+                    },
+                    //工具栏。
+                    //内置有导出图片，数据视图，动态类型切换，数据区域缩放，重置五个工具。
+                    toolbox: {
+                        show : true,
+                        //各工具配置项。
+                        feature : {
+                            //'line'（切换为折线图）, 'bar'（切换为柱状图）,
+                            //'stack'（切换为堆叠模式）, 'tiled'（切换为平铺模式）
+                            magicType : {show: true, type: ['line', 'bar' , 'stack' ,'tiled']},
+
+                            //保存为图片。
+                            saveAsImage : {show: true}
+                        }
+                    },
+                    calculable : true,
+                    xAxis : [
+                        {
+                            name:'日期(day)',
+                            type : 'category',
+                            data : this.loginDateXX
+                        }
+                    ],
+                    yAxis : [
+                        {
+                            name: '次数',
+                            type : 'value'
+                        }
+                    ],
+                    series : [
+                        {
+                            name:'成功',
+                            type:'bar',
+                            data:this.loginSuccessInfoYY,
+                            color:'#CC0066'
+                        },
+                        {
+                            name:'失败',
+                            type:'bar',
+                            data:this.loginErrorInfoYY,
+                            color:'#009999'
+                        },
+                    ]
+                }
+                myLoginEchars.setOption(option);
+            },
+            dateBtnClick(){
+                const timesTempDay=1000 * 60 * 60 * 24;//一天的的时间戳
+                const startTime=this.orderCenterValue[0].getTime();//起始日期时间戳
+                const endTime = this.orderCenterValue[1].getTime();//结束日期时间戳
+                const timer=endTime - startTime;
+                const count=Math.ceil(timer / timesTempDay);//总计多少条
+
+                if(count<=32){
+                    axios.post('http://127.0.0.1:7001/user/orderCenter/groupFind',{
+                        startTime:startTime,
+                        endTime:endTime
+                    })
+                        .then(res=>{
+
+                            let getMounth = (new Date(startTime).getMonth()) + 1;
+                            let getDay = (new Date(startTime).getDate());
+
+                            let data3 = [];
+                            let data4 = [];
+
+                            for (let i = 0; i < count; i++) {
+                                const selectYear = (new Date(startTime + timesTempDay * i)).getFullYear();
+                                const selectMonth = ((new Date(startTime + timesTempDay * i)).getMonth()) + 1
+                                const selectDate = (new Date(startTime + timesTempDay * i)).getDate()
+                                data3.push({
+                                    date:`${selectYear}-${selectMonth}-${selectDate}`,
+                                    priceAll:0,
+                                    priceAvg:0});
+                            }
+                            res.data.forEach(item=>{
+                                data4.push({
+                                    date:`${item._id.orderYear}-${item._id.orderMonth}-${item._id.orderDate}`,
+                                    priceAll:Number((item.totalPriceAll).toFixed(0)),
+                                    priceAvg:Number((item.totalPriceAll/item.totalNumAll).toFixed(0))
+                                })
+                            })
+                            //数据的处理
+                            data3.map((item,index)=>{
+                                data4.map(items=>{
+                                    if(items.date===item.date){
+                                        data3[index]=items
+                                    }
+                                })
+                            })
+                            // //将数组拆分开，放到ecahrs里
+                            const dateArr=[];
+                            const selectAllPrice=[];
+                            const selectAvgPrice=[];
+                            const selectDate=[];
+                            data3.forEach(item=>{
+                                dateArr.push(item.date)
+                                selectAllPrice.push(item.priceAll)
+                                selectAvgPrice.push(item.priceAvg)
+                            })
+                            //转化日期格式
+                            dateArr.forEach(item=>{
+                                selectDate.push(moment(item,'YY-MM-DD').format("MM-DD"))
+                            })
+                            this.orderDate=selectDate;
+                            this.orderAllPrice=selectAllPrice;
+                            this.orderAvgPrice=selectAvgPrice;
+                            this.myEcharts();
+                        })
+                }
+                else{
+                    this.$message.info('请选择的日期小于31天')
+                }
+                },
+            loginBtnClick(){
+                const timesTempDay=1000 * 60 * 60 * 24;//一天的的时间戳
+                const startTime=this.loginDateValue[0].getTime();//起始日期时间戳
+                const endTime = this.loginDateValue[1].getTime();//结束日期时间戳
+                const timer=endTime - startTime;
+                const count=Math.ceil(timer / timesTempDay);//总计多少条
+
+                if(count<=32){
+                    axios.post('http://127.0.0.1:7001/login/groupFind',{
+                        startTime:startTime,
+                        endTime:endTime
+                    })
+                        .then(res=>{
+                            let getMounth=(new Date(startTime).getMonth())+1;//startTime获取的月份
+                            let getDay=(new Date(startTime).getDate());//endTime获取的Date日期
+                            const data7=[];
+                            const data8=[];
+
+                            for(let i=0;i<count;i++){
+                                const ceshiYear=(new Date(startTime+timesTempDay*i)).getFullYear()
+                                const ceshiMonth=( (new Date(startTime+timesTempDay*i)).getMonth() ) +1
+                                const ceshiDate=( new Date(startTime+timesTempDay*i) ).getDate()
+                                data7.push({
+                                    date:`${ceshiYear}-${ceshiMonth}-${ceshiDate}`,
+                                    selectLoginSuccessInfo:Number(0),
+                                    selectLoginErrorInfo:Number(0)
+                                });
+                            }
+                            res.data.forEach(item=>{
+                                data8.push({
+                                    date:`${item._id.loginYear}-${item._id.loginMonth}-${item._id.loginDate}`,
+                                    status:Number(item._id.loginInfo),
+                                    count:Number(item.count)
+                                })
+                            })
+                            //处理数据
+                            data7.map((item,index)=>{
+                                data8.map(items=>{
+                                    if(items.date===item.date){
+                                        if(items.status===1){
+                                            data7[index].selectLoginSuccessInfo=items.count;
+                                        }
+                                        else if(items.status===0){
+                                            data7[index].selectLoginErrorInfo=items.count;
+                                        }
+                                    }
+                                })
+                            });
+                            //处理X轴日期格式
+                            const loginDateX=[];
+                            const loginSuccessInfo=[];
+                            const loginErrorInfo=[];
+                            data7.forEach(item=>{
+                                loginDateX.push(item.date);
+                                loginSuccessInfo.push(item.selectLoginSuccessInfo);
+                                loginErrorInfo.push(item.selectLoginErrorInfo);
+                            })
+                            const loginDateResult=[];
+                            loginDateX.forEach(item=>{
+                                loginDateResult.push(moment(item,'YY-MM-DD').format(('MM-DD')));
+                            })
+                            //将处理好的数据进行显示
+                            this.loginDateXX=loginDateResult;
+                            this.loginSuccessInfoYY=loginSuccessInfo;
+                            this.loginErrorInfoYY=loginErrorInfo;
+                            this.myLoginEchars();
+                        })
+                }
+                else{
+                    this.$message.info('请选择的日期小于31天')
+                }
+            },
+        }
+    }
+
+</script>

src/pageview/page8-2.vue

@@ -0,0 +1,317 @@
+<template>
+    <div>
+        <div>
+            <div id="main22" :style="{width: '1000px', height: '550px'}"></div>
+        </div>
+    </div>
+</template>
+
+<script scoped>
+    const axios=require('axios');
+
+    export default {
+        name: 'Echarts',
+        props: {
+            //数据
+            data: {
+                type: Array,
+                default: () => {
+                    return [];
+                }
+            },
+        },
+        data() {
+            return {
+                menArr1:'',
+                womenArr1:'',
+            };
+        },
+        created(){
+        },
+        mounted(){
+            this.getUserInfo();
+            this.getAgeSexNumInfo();
+            let that = this;
+            setTimeout(function () {
+                that.myEcharts11();
+            },200)
+        },
+        methods:{
+            myEcharts11(){
+                var labelData = this.data.map(item=>item.label);
+
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = this.$echarts.init(document.getElementById('main22'));
+                // 指定图表的配置项和数据
+                let option = {
+                    height:"100%",
+                    xAxis: [
+                        {
+                            type: "value",
+                            show: false,
+                            min: -100,//这显示当前年龄段的总数
+                            max: 0,
+                            gridIndex: 0,
+                            axisTick: { show: false, inside: false },
+                            axisLabel: { show: false },
+                            axisLine: {
+                                // Y轴轴线样式
+                                show: false,
+                                lineStyle: {
+                                    color: "#000"
+                                }
+                            },
+                            splitLine: {
+                                show: false
+                            }
+                        },
+                        {
+                            type: "value",
+                            show: false,
+                            gridIndex: 1,
+                            min: 0,
+                            max: 100,
+                            axisTick: { show: false }, //是否显示刻度
+                            axisLine: {
+                                // Y轴轴线样式
+                                show: false, // 是否显示X轴
+                                lineStyle: {
+                                    color: "#000"
+                                }
+                            },
+                            axisLabel: {
+                                show: false //是否显示X轴内容
+                            },
+                            splitLine: {
+                                show: false
+                            }
+                        }
+                    ],
+                    yAxis: [
+                        {
+                            type: "category",
+                            show: false,
+                            gridIndex: 0,
+                            inverse: true,
+                            axisTick: { show: false },
+                            axisLabel: { show: false },
+                            axisLine: {
+                                // Y轴轴线样式
+                                show: false,
+                                lineStyle: {
+                                    color: "#000"
+                                }
+                            }
+                        },
+                        {
+                            type: "category",
+                            show: false,
+                            gridIndex: 1,
+                            inverse: true,
+                            // data:0, //几行？
+                            axisTick: { show: false },
+                            axisLabel: {},
+                            axisLine: {
+                                show: false //是否显示轴线
+                            }
+                        }
+                    ],
+                    grid: [
+                        {
+                            top: "-2%",
+                            bottom: "0%",
+                            width: "35%",
+                            left: "0%",
+                            gridIndex: 0
+                        },
+                        {
+                            top: "-2%",
+                            bottom: "0%",
+                            width: "35%",
+                            left: "60%",
+                            gridIndex: 1
+                        }
+                    ],
+                    series : [
+//----------------------------------------------------男
+                        {
+                            name: '男性年龄分布',
+                            type: 'bar',
+                            z: 100,
+                            barWidth:22,
+                            gridIndex: 0,
+                            itemStyle: {
+                                normal: {
+                                    color: new this.$echarts.graphic.LinearGradient(
+                                        0, 1, 1, 1,
+                                        [
+                                            {
+                                                offset: 0,
+                                                color: "#1661c6" // 0% 处的颜色
+                                            },
+                                            {
+                                                offset: 1,
+                                                color: "#1a9dff" // 100% 处的颜色
+                                            }
+                                        ],
+                                        false
+                                    ),
+                                    show: true,
+                                    barBorderRadius: 50,
+                                    label: {
+                                        show: true,
+                                        position: "insideLeft",
+                                        fontFamily: "AharoniBold",
+                                        color: "#fff",
+                                        fontSize: 22,
+                                        fontWeight: 800,
+                                        formatter: function(v) {
+                                           return v.data.count * -1;
+                                           // return 50;
+                                        }
+                                    }
+                                }
+                            },
+                            // data: [-10,-60,-70,-80,-90]
+                            data:this.menArr1
+                        },
+                        {
+                            name: "男性年龄分布外框",
+                            type: "bar",
+                            barWidth: 22,
+                            barGap: "-100%",
+                            z: 0,
+                            gridIndex: 0,
+                            itemStyle: {
+                                normal: {
+                                    show: true,
+                                    color: "rgba(225,225,225, 0.2)",
+                                    barBorderRadius: 50
+                                }
+                            },
+                            data: [-100,-100,-100,-100,-100]
+                        },
+//----------------------------------------------------女
+                        {
+                            name: "女性年龄分布",
+                            type: "bar",
+                            barWidth: 22,
+                            xAxisIndex: 1,
+                            yAxisIndex: 1,
+                            z: 100,
+                            itemStyle: {
+                                normal: {
+                                    show: true,
+                                    color: new this.$echarts.graphic.LinearGradient(
+                                        0, 1, 1, 1,
+                                        [
+                                            {
+                                                offset: 0,
+                                                color: "#e98000" // 0% 处的颜色
+                                            },
+                                            {
+                                                offset: 1,
+                                                color: "#fab011" // 100% 处的颜色
+                                            }
+                                        ],
+                                        false
+                                    ),
+                                    barBorderRadius: 50,
+                                    borderWidth: 0,
+                                    borderColor: "#fff",
+                                    label: {
+                                        fontFamily: "AharoniBold",
+                                        show: true,
+                                        color: "#fff",
+                                        fontSize: 22,
+                                        fontWeight: 800,
+                                        position: "insideRight",
+                                        formatter: function(v) {
+                                            return v.data.count;
+                                        }
+                                    }
+                                }
+                            },
+                            // data: [50,60,70,80,90]
+                            data: this.womenArr1
+                        },
+                        {
+                            name: "女性年龄分布外框",
+                            z: 0,
+                            type: "bar",
+                            barWidth: 22,
+                            xAxisIndex: 1,
+                            yAxisIndex: 1,
+                            barGap: "-100%",
+                            itemStyle: {
+                                normal: {
+                                    show: true,
+                                    color: "rgba(225,225,225, 0.2)",
+                                    barBorderRadius: 50,
+                                    borderWidth: 0,
+                                    borderColor: "#fff"
+                                }
+                            },
+                            data: [100,100,100,100,100]
+                        }
+                    ]
+                };
+                // 使用刚指定的配置项和数据显示图表。
+                myChart.setOption(option);
+            },
+            getUserInfo(){
+                axios.get('http://127.0.0.1:7001/user/ageGroupFind')
+                    .then(res=>{
+                        this.ageArr=res.data;
+                    })
+            },
+            getAgeSexNumInfo(){
+                const menArr=[];
+                const womenArr=[];
+                const menWomenArr=[];
+
+                axios.get('http://127.0.0.1:7001/user/getAgeSexNumInfo')
+                    .then(res=>{
+                        for(let i=0;i<res.data.length;i++){
+                            if(i*3<15){
+                                res.data[i*3]
+                                menWomenArr.push(res.data[i*3].value+res.data[i*3+1].value)
+                            }
+                        }
+                        //男用户数
+                        for(let i=0;i<res.data.length;i++){
+                            if(3*i<15){
+                                menArr.push(res.data[3*i].value);
+                            }
+                        }
+                        //女用户数
+                        for(let i=0;i<res.data.length;i++){
+                            if(3*i+1<15){
+                                womenArr.push(res.data[3*i+1].value);
+                            }
+                        }
+
+                        const menArr2=[];
+                        const womenArr2=[];
+                        for(let i=0;i<menWomenArr.length;i++){
+                            menArr2.push({
+                                count:menArr[i] * -1,
+                                value:((menArr[i]/menWomenArr[i])*100).toFixed(1) * -1
+                            })
+                        }
+                        for(let i=0;i<menWomenArr.length;i++){
+                            womenArr2.push({
+                                count:womenArr[i],
+                                value:((womenArr[i]/menWomenArr[i])*100).toFixed(1)
+                            })
+                        }
+                        console.log(menArr2,'menArr222')
+                        console.log(womenArr2,'menArr222')
+                        this.menArr1=menArr2;
+                        this.womenArr1=womenArr2;
+                    })
+            },
+        },
+    }
+
+</script>

src/pageview/page8.vue

@@ -0,0 +1,89 @@
+<template>
+    <div>
+        <div>
+            <div id="main1" :style="{width: '1500px', height: '550px'}"></div>
+        </div>
+    </div>
+</template>
+
+<script scoped>
+    const axios=require('axios');
+    import Cookies from 'js-cookie';
+    import moment from 'moment'//导入文件
+
+    export default {
+        name: 'Echarts',
+        data(){
+            return{
+                msg: 'Welcome to Your Vue.js App',
+                ageArr:[],
+                ageNum:[],
+                sex:[],
+                sexNum:[],
+                totalNum:'',
+            };
+        },
+        created(){
+            this.getUserInfo();
+        },
+        mounted(){
+            // 这个定时任务其实不想用来着，但是不用的话 数据无法正常显示
+            // 等ecahrs图标正确显示完，在问下阔生这个问题
+            // 定时任务
+            let that = this;
+            setTimeout(function () {
+                that.myEcharts1();
+            },200)
+
+        },
+        methods:{
+            myEcharts1(){
+                // 基于准备好的dom，初始化echarts实例
+                let myChart = this.$echarts.init(document.getElementById('main1'));
+                // 指定图表的配置项和数据
+                let option = {
+                    width: "75%",
+                    height:"75%",
+                    label: {
+                        backgroundColor: "rgba(33, 25, 96, 0.5)",
+                        borderColor: "#222b5e",
+                        borderWidth:1,
+                        borderRadius:0,
+                        padding:(0,1,8),
+                        fontSize:20,
+                        fontFamily: "AharoniBold",
+                        align:"center",
+                    },
+                    series : [
+                        {
+                            name: '用户年龄+性别分布',
+                            type: 'pie',
+                            radius: ['17%','75%'],//[number(内圈环) string(外半径为可视区尺寸)] Array
+                            center: ["51.3%", "45.5%"],
+                            roseType: 'area',//是否展示成南丁格尔图，通过半径区分数据大小。可选择两种模式：
+                            //'radius' 扇区圆心角展现数据的百分比，半径展现数据的大小。
+                            // 'area' 所有扇区圆心角相同，仅通过半径展现数据大小。
+                            data:this.ageArr,
+                            labelLine: {
+                                lineStyle: {//所有属性
+                                    color: "#2da2fd",
+                                    width: 2
+                                },
+                                length2: 30
+                            },
+                        },
+                    ]
+                };
+                // 使用刚指定的配置项和数据显示图表。
+                myChart.setOption(option);
+            },
+            getUserInfo(){
+                axios.get('http://127.0.0.1:7001/user/ageGroupFind')
+                    .then(res=>{
+                        this.ageArr=res.data;
+                    })
+            },
+        }
+    }
+
+</script>

src/pageview/page9.vue

@@ -0,0 +1,388 @@
+<template>
+    <div id="box">
+        <div class="title">用户年龄+性别统计分布</div>
+        <div class="container">
+            <div class="num1">{{this.allNum}}</div>
+            <div class="num2">{{this.menNum}}</div>
+            <div class="num3">{{this.womenNum}}</div>
+            <div class="title1">
+                <span>用户年龄、性别比例分布</span>
+            </div>
+            <div class="title2">用户年龄、性别统计</div>
+            <div class="com">
+            <com/>
+        </div>
+            <div class="com1">
+                <div class="man_pie">{{this.menProportion}}</div>
+                <div class="women_pie">{{this.womenProportion}}</div>
+                <div style="position:absolute;top:20%;right:15%">
+                    <span class="man_size">男 (</span>
+                    <span class="man_number">{{this.menNum}}</span>
+                    <span class="man_unit">人)</span>
+                </div>
+                <com1 style="width: 50%"></com1>
+                <div style="position:absolute;top:54%;right:15%">
+                    <span class="women_size">女 (</span>
+                    <span class="women_number">{{this.womenNum}}</span>
+                    <span class="women_unit">人)</span>
+                </div>
+            </div>
+
+            <div class="com2">
+                <com2></com2>
+                <span class="man">男</span>
+                <span class="women">女</span>
+                <span class="allnum">总数</span>
+                <span class="n1">{{this.age18}}</span>
+                <span class="n1 n2">{{this.age25}}</span>
+                <span class="n1 n3">{{this.age30}}</span>
+                <span class="n1 n4">{{this.age35}}</span>
+                <span class="n1 n5">{{this.age40}}</span>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    const axios=require('axios');
+
+    import com from "../pageview/page8";
+    import com1 from "../pageview/page8-1";
+    import com2 from "../pageview/page8-2";
+
+    export default {
+        components: {com,com1,com2},
+        name: "Home",
+        data() {
+            return {
+                menNum:'',
+                menProportion:'',
+                womenNum:'',
+                womenProportion:'',
+                allNum:'',
+                age18:'',
+                age25:'',
+                age30:'',
+                age35:'',
+                age40:'',
+            };
+        },
+        methods: {
+            ageGroupFind(){
+                axios.get('http://127.0.0.1:7001/user/ageGroupFind')
+                    .then(res=>{
+                        let string=''
+                        let s=''
+                        res.data.forEach(item=>{
+                           string = JSON.stringify(item.name).toString()
+                                .split(':')[0];
+                           s=string.substring(1,string.length-1);
+                           if(s=='18-25岁'){
+                               this.age18=item.value;
+                           }
+                            if(s=='25-30岁'){
+                                this.age25=item.value;
+                            }
+                            if(s=='30-35岁'){
+                                this.age30=item.value;
+                            }
+                            if(s=='35-40岁'){
+                                this.age35=item.value;
+                            }
+                            if(s=='大于40岁'){
+                                this.age40=item.value;
+                            }
+                        })
+                    })
+            }
+        },
+        created(){
+            this.ageGroupFind();
+            axios.get('http://127.0.0.1:7001/user/getAgeSexInfo')
+                .then(res=>{
+                    res.data.forEach(item=>{
+                        if(item.totalNum){
+                            this.allNum=item.totalNum;
+                        }
+                        if(item.sex=="男"){
+                            this.menNum=item.count;
+                            this.menProportion=item.proportion;
+                        }
+                        if(item.sex=="女"){
+                            this.womenNum=item.count;
+                            this.womenProportion=item.proportion;
+                        }
+                    })
+                })
+        },
+    };
+</script>
+
+<style scoped>
+    #box {
+        height: 80%;
+        width: 60%;
+        flex-wrap: wrap;
+        /*display: flex;*/
+    }
+
+    .title {
+        /*padding-top: 0.8%;*/
+        color: #fec400;
+        font-size: 1vw;
+        font-weight: 900;
+        padding-left: 28px;
+        line-height: 5vh;
+        background: url("../assets/br1/title_bj.png") no-repeat;
+        background-size: 100% 100%;
+        height: 5%;
+        width: 350px;
+    }
+
+    .container {
+        width: 83%;
+        height: 93%;
+        position: absolute; /*position:定位属性*/
+        /* absolute:对象脱离常规流，此时偏移属性参照的是离自身最近的定位祖先元素，如果没有定位的祖先元素，
+        则一直回溯到body元素。盒子的偏移位置不影响常规流中的任何元素，其margin不与其他任何margin折叠。*/
+        top: 7%;
+        background: url("../assets/br1/bj1-3-1.png") no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .num1 {
+        width: 29%;
+        height: 13.5%;
+        /* border: 1px solid red; */
+        position: absolute;
+        left: 1.5%;
+        top: 2.5%;
+        font-family: "AharoniBold";
+        font-size: 80px;
+        color: #fec400;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .num2 {
+        width: 29%;
+        height: 13.5%;
+        /* border: 1px solid red; */
+        position: absolute;
+        left: 35.5%;
+        top: 2.5%;
+        font-family: "AharoniBold";
+        font-size: 80px;
+        color: #fec400;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .num3 {
+        width: 29%;
+        height: 13.5%;
+        /* border: 1px solid red; */
+        position: absolute;
+        left: 69%;
+        top: 2.5%;
+        font-family: "AharoniBold";
+        font-size: 80px;
+        color: #fec400;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .title1 {
+        color: #fff;
+        position: absolute;
+        font-family: "SYHT";
+        font-size: 1vw;
+        top: 34.5%;
+        left: 15%;
+        font-weight: 600;
+        background: url("../assets/br1/tipbj.png") no-repeat;
+        background-size: 100% 100%;
+        /* border: 1px solid red; */
+        width: 17%;
+        height: 5%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        white-space: nowrap;
+    }
+
+    .title2 {
+        color: #fff;
+        position: absolute;
+        font-family: "SYHT";
+        font-size: 1vw;
+        top: 34.5%;
+        left: 63%;
+        font-weight: 600;
+        background: url("../assets/br1/tipbj.png") no-repeat;
+        background-size: 100% 100%;
+        width: 17%;
+        height: 5%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        white-space: nowrap;
+        /* border: 1px solid red; */
+    }
+
+    .com {
+        width: 43%;
+        height: 32%;
+        margin-left: -110px;
+        margin-top: -20px;
+        /*border: 1px solid red;*/
+        position: absolute;
+        top: 43%;
+        left: 0.5%;
+    }
+
+    .com1 {
+        width: 35%;
+        height: 20%;
+        left: 12%;
+        /* border: 1px solid red; */
+        position: absolute;
+        top: 73%;
+    }
+
+    .com2 {
+        margin-top: -7px;
+        width: 45%;
+        height: 47.5%;
+        left: 49%;
+        /* border: 1px solid red; */
+        position: absolute;
+        top: 44%;
+    }
+
+    .man {
+        color: #2691ff;
+        font-family: "SYHT";
+        font-size: 20px;
+        font-weight: 800;
+        position: absolute;
+        top: 0%;
+        left: 33%;
+    }
+
+    .women {
+        color: #fec400;
+        font-family: "SYHT";
+        font-size: 20px;
+        font-weight: 800;
+        position: absolute;
+        top: 0%;
+        left: 64%;
+    }
+
+    .n1 {
+        color: white;
+        font-family: "SYHT";
+        font-size: 18px;
+        font-weight: 800;
+        width: 15.5%;
+        height: 6%;
+        /* border: 1px solid red; */
+        position: absolute;
+        top: 7%;
+        left: 42%;
+        text-align: center;
+    }
+
+    .n2 {
+        top: 26.5%;
+    }
+
+    .n3 {
+        top: 45.7%;
+    }
+
+    .n4 {
+        top: 65.4%;
+    }
+
+    .n5 {
+        top: 85%;
+    }
+
+    .com1_women {
+        color: white;
+        /* font-family: "AharoniBold" */
+    }
+
+    .allnum {
+        color: #fff;
+        font-family: "SYHT";
+        font-size: 18px;
+        font-weight: 800;
+        position: absolute;
+        top: -1.2em;
+        left: 47%;
+    }
+
+    .man_pie {
+        position: absolute;
+        top: 18%;
+        left: -15%;
+        font-family: AharoniBold;
+        color: white;
+        font-size: 25px;
+    }
+
+    .women_pie {
+        position: absolute;
+        top: 52%;
+        left: -15%;
+        font-family: AharoniBold;
+        color: white;
+        font-size: 25px;
+    }
+
+    .man_size {
+        color: white;
+        font-size: 25px;
+        font-weight: 800;
+        font-family: SYHT;
+    }
+
+    .man_number {
+        font-family: AharoniBold;
+        color: white;
+        font-size: 25px;
+    }
+
+    .man_unit {
+        color: white;
+        font-size: 25px;
+        font-weight: 800
+    }
+
+    .women_size {
+        color: white;
+        font-size: 25px;
+        font-weight: 800
+    }
+
+    .women_number {
+        font-family: AharoniBold;
+        color: white;
+        font-size: 25px;
+    }
+
+    .women_unit {
+        color: white;
+        font-size: 25px;
+        font-weight: 800
+    }
+</style>

src/router/index.js

@@ -0,0 +1,134 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+
+//一级路由
+import Page1 from '@/pageview/page1'
+import Page2 from '@/pageview/page2'
+import Page3 from '@/pageview/page3'
+import Page4 from '@/pageview/page4'
+import Page5 from '@/pageview/page5'
+import Page6 from '@/pageview/page6'
+import Page7 from '@/pageview/page7'
+import Page8 from '@/pageview/page8'
+import Page81 from '@/pageview/page8-1'
+import Page82 from '@/pageview/page8-2'
+import Page9 from '@/pageview/page9'
+import BaiduMap from '../pageview/baiduMapSignInIntegral'
+
+//二级路由
+
+//其他
+//food表添加食物
+import addFood  from '@/pageview/page1-1/foodAdd';
+//购物车
+import gouwuche from '@/pageview/page1-1/shoppingCart';
+
+//登录
+import login from '../components/navigation/login';
+//注册
+import reg from '../components/navigation/regist';
+//忘记密码上一步，验证账号
+import yanzhengUS from '../components/navigation/verifyAccount';
+//忘记密码
+import forgetPwd from '../components/navigation/forgetPwd';
+//饭店主页面
+import foodRestaurant from   '../components/navigation/Navi';
+//订单中心
+import orderCenter from '../pageview/page1-1/orderCenter';
+
+
+Vue.use(Router)
+
+const router = new Router({
+  routes: [
+    {
+      path:'/',
+      component:login
+    },
+    {
+      path:'/regist',
+      component:reg
+    },
+    {
+      path:'/yanzhengUS',
+      component:yanzhengUS
+    },
+    {
+      path:'/forgetPwd',
+      component:forgetPwd
+    },
+
+    {
+      path:'/foodRestaurant',
+      component:foodRestaurant
+    },
+    {
+      path: '/foodRestaurant',
+      component: foodRestaurant,
+      children:[
+        {
+          path:'/foodRestaurant/food/addFood',
+          component:addFood
+        },
+        {
+          path: '/page1',
+          component: Page1
+        },
+        {
+          path: '/page2',
+          component: Page2
+        },
+        {
+          path: '/page3',
+          component: Page3
+        },
+        {
+          path: '/page4',
+          component: Page4
+        },
+        {
+          path: '/page5',
+          component: Page5
+        },
+        {
+          path: '/page6',
+          component: Page6
+        },
+        {
+          path: '/page7',
+          component: Page7
+        },
+        {
+          path: '/page8',
+          component: Page8
+        },
+        {
+          path: '/page81',
+          component: Page81
+        },
+        {
+          path: '/page82',
+          component: Page82
+        },
+        {
+          path: '/page9',
+          component: Page9
+        },
+        {
+          path: '/baiduMap',
+          component: BaiduMap
+        },
+        {
+          path:'/food/shoppingCart',
+          component:gouwuche
+        },
+        {
+          path:'/shoppingCart/orderCenter',
+          component:orderCenter
+        }
+      ]
+    },
+  ]
+})
+
+export default router;

src/views/Home.vue

@@ -0,0 +1,36 @@
+<template>
+
+</template>
+
+<script>
+    import {createNamespacedHelpers} from "vuex";
+    //车主年龄性别统计
+    const br0103 = createNamespacedHelpers('br0103');
+    export  default {
+        name:"Home",
+        data(){
+
+        },
+        methods:{
+            ...br0103.mapActions(
+                {getData8: "getSex2Age"}
+            ),
+        },
+        computed:{
+            ...br0103.mapGetters(
+                {
+                    data8: "data1",
+                    count8: "count",
+                },
+            ),
+        },
+        mounted() {
+            let that = this;
+            f (process.env.NODE_ENV === 'development') {
+                this.updateData( [
+                    'BR0103',
+            ])
+            }
+        }
+    }
+</script>