change login, header, ...some pages

README.md

@@ -53,13 +53,11 @@ npm run dev
 - [x] 管理用户
 - [x] 管理商铺
 - [x] 食品管理
-- [ ] 权限验证
-- [ ] 管理员设置
+- [x] 权限验证
+- [x] 管理员设置
 - [ ] 图表📈
 - [ ] 上传文件
-- [ ] 系统设置
 - [ ] 富文本编辑器
-- [ ] Markdown编辑器
 
 
 # 项目截图

build/dev-server.js

@@ -76,7 +76,7 @@ devMiddleware.waitUntilValid(() => {
   console.log('> Listening at ' + uri + '\n')
   // when env is testing, don't need open it
   if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
-    // opn(uri)
+    opn(uri)
   }
   _resolve()
 })

src/api/getData.js

 import fetch from '@/config/fetch'
 
+/**
+ * 登陆
+ */
+
+const login = data => fetch('/admin/login', data, 'POST');
+
+/**
+ * 退出
+ */
+
+const signout = () => fetch('/admin/singout');
+
+/**
+ * 超级管理员列表
+ */
+
+const adminList = data => fetch('/admin/all', data);
+
+/**
+ * 超级管理员列表
+ */
+
+const adminCount = () => fetch('/admin/count');
 
 /**
  * 获取定位城市
@@ -153,5 +176,5 @@ const getUserInfo = user_id => fetch('/v1/user/' + user_id);
 const getAddressById = address_id => fetch('/v1/addresse/' + address_id);
 
 
-export { cityGuess, addShop, searchplace, getCategory, addCategory, addFood, foodCategory ,getResturants, getResturantDetail, getResturantsCount, updateResturant, deleteResturant, getFoods, getFoodsCount, getMenu, updateFood, getMenuById, deleteFood, getUserList, getUserCount, getOrderList, getOrderCount, getUserInfo, getAddressById}
+export {login, signout, adminList, adminCount, cityGuess, addShop, searchplace, getCategory, addCategory, addFood, foodCategory ,getResturants, getResturantDetail, getResturantsCount, updateResturant, deleteResturant, getFoods, getFoodsCount, getMenu, updateFood, getMenuById, deleteFood, getUserList, getUserCount, getOrderList, getOrderCount, getUserInfo, getAddressById}
 

src/components/headTop.vue

@@ -16,14 +16,31 @@
 </template>
 
 <script>
+	import {signout} from '@/api/getData'
     export default {
     	created(){
     		
     	},
 		methods: {
-			handleCommand(command) {
-				this.$message(command);
-			}
+			async handleCommand(command) {
+				if (command == 'home') {
+					this.$router.push('/manage');
+				}else if(command == 'singout'){
+					const res = await signout()
+					if (res.status == 1) {
+						this.$message({
+	                        type: 'success',
+	                        message: '退出成功'
+	                    });
+	                    this.$router.push('/');
+					}else{
+						this.$message({
+	                        type: 'error',
+	                        message: res.message
+	                    });
+					}
+				}
+			},
 		}
     }
 </script>

src/page/adminList.vue

 <template>
     <div class="fillcontain">
-        adminList
+        <head-top></head-top>
+        <div class="table_container">
+            <el-table
+		      :data="tableData"
+		      style="width: 100%">
+		      <el-table-column
+		        prop="user_name"
+		        label="姓名"
+		        width="180">
+		      </el-table-column>
+		      <el-table-column
+		        prop="create_time"
+		        label="注册日期"
+		        width="180">
+		      </el-table-column>
+		      <el-table-column
+		        prop="admin"
+		        label="权限">
+		      </el-table-column>
+		    </el-table>
+		    <div class="Pagination" style="text-align: right;margin-top: 10px;">
+                <el-pagination
+                  @size-change="handleSizeChange"
+                  @current-change="handleCurrentChange"
+                  :current-page="currentPage"
+                  :page-size="20"
+                  layout="total, prev, pager, next"
+                  :total="count">
+                </el-pagination>
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
+    import headTop from '../components/headTop'
+    import {adminList, adminCount} from '@/api/getData'
     export default {
-    	
+        data(){
+            return {
+                tableData: [],
+                currentRow: null,
+                offset: 0,
+                limit: 20,
+                count: 0,
+                currentPage: 1,
+            }
+        },
+    	components: {
+    		headTop,
+    	},
+        created(){
+            this.initData();
+        },
+        methods: {
+            async initData(){
+                try{
+                    const countData = await adminCount();
+                    if (countData.status == 1) {
+                        this.count = countData.count;
+                    }else{
+                        throw new Error('获取数据失败');
+                    }
+                    this.getAdmin();
+                }catch(err){
+                    console.log('获取数据失败', err);
+                }
+            },
+            handleSizeChange(val) {
+                console.log(`每页 ${val} 条`);
+            },
+            handleCurrentChange(val) {
+                this.currentPage = val;
+                this.offset = (val - 1)*this.limit;
+                this.getAdmin()
+            },
+            async getAdmin(){
+                try{
+                    const res = await adminList({offset: this.offset, limit: this.limit});
+                    if (res.status == 1) {
+                    	this.tableData = [];
+                    	res.data.forEach(item => {
+                    		const tableItem = {
+                    			create_time: item.create_time,
+						        user_name: item.user_name,
+						        admin: item.admin,
+                    		}
+                    		this.tableData.push(tableItem)
+                    	})
+                    }else{
+                    	throw new Error(res.message)
+                    }
+                }catch(err){
+                    console.log('获取数据失败', err);
+                }
+            }
+        },
     }
 </script>
 
 <style lang="less">
 	@import '../style/mixin';
+    .table_container{
+        padding: 20px;
+    }
 </style>
+
+

src/page/foodList.vue

@@ -319,12 +319,12 @@
                         });
                         this.tableData.splice(index, 1);
                     }else{
-                        throw new Error('删除食品失败')
+                        throw new Error(res.message)
                     }
                 }catch(err){
                     this.$message({
                         type: 'error',
-                        message: '删除食品失败'
+                        message: err.message
                     });
                     console.error('删除食品失败')
                 }
@@ -363,9 +363,8 @@
                     }else{
                         this.$message({
                             type: 'error',
-                            message: '更新食品信息失败'
+                            message: res.message
                         });
-                        throw new Error('更新餐馆信息失败')
                     }
                 }catch(err){
                     console.log('更新餐馆信息失败', err);

src/page/login.vue

@@ -16,12 +16,15 @@
 				    	<el-button type="primary" @click="submitForm('loginForm')" class="submit_btn">登陆</el-button>
 				  	</el-form-item>
 				</el-form>
+				<p class="tip">未登录过的新用户，自动注册成为普通管理员</p>
+				<p class="tip">已注册过的用户不能重新注册</p>
 	  		</section>
 	  	</transition>
   	</div>
 </template>
 
 <script>
+	import {login} from '@/api/getData'
 	export default {
 	    data(){
 			return {
@@ -44,10 +47,22 @@
 			this.showLogin = true;
 		},
 		methods: {
-			submitForm(formName) {
-				this.$refs[formName].validate((valid) => {
+			async submitForm(formName) {
+				this.$refs[formName].validate(async (valid) => {
 					if (valid) {
-						this.$router.push('manage')
+						const res = await login({user_name: this.loginForm.username, password: this.loginForm.password})
+						if (res.status == 1) {
+							this.$message({
+		                        type: 'success',
+		                        message: '登录成功'
+		                    });
+							this.$router.push('manage')
+						}else{
+							this.$message({
+		                        type: 'error',
+		                        message: res.message
+		                    });
+						}
 					} else {
 						this.$notify.error({
 							title: '错误',
@@ -89,6 +104,10 @@
 			font-size: 16px;
 		}
 	}
+	.tip{
+		font-size: 12px;
+		color: #666;
+	}
 	.form-fade-enter-active, .form-fade-leave-active {
 	  	transition: all 1s;
 	}

src/page/shopList.vue

@@ -239,12 +239,12 @@
                         });
                         this.tableData.splice(index, 1);
                     }else{
-                        throw new Error('删除店铺失败')
+                        throw new Error(res.message)
                     }
                 }catch(err){
                     this.$message({
                         type: 'error',
-                        message: '删除店铺失败'
+                        message: err.message
                     });
                     console.error('删除店铺失败')
                 }
@@ -303,9 +303,8 @@
                     }else{
                         this.$message({
                             type: 'error',
-                            message: '更新店铺信息失败'
+                            message: res.message
                         });
-                        throw new Error('更新餐馆信息失败')
                     }
                 }catch(err){
                     console.log('更新餐馆信息失败', err);