Browse Source

阶段性提交

soft5566 2 years ago
parent
commit
6529723a74
4 changed files with 383 additions and 370 deletions
  1. 43 43
      src/App.vue
  2. 1 0
      src/layout/components/Navbar.vue
  3. 324 322
      src/views/login/index.vue
  4. 15 5
      src/views/order/index.vue

+ 43 - 43
src/App.vue

@@ -28,53 +28,53 @@
 			window.addEventListener('beforeunload', () => {
 				sessionStorage.setItem('store', JSON.stringify(this.$store.state))
 			});
-			// 超时退出 start
-			this.lastTime = new Date();
+			// // 超时退出 start
+			// this.lastTime = new Date();
 
-			window.addEventListener('resize', () => {
-				if (timmer) {
-					clearTimeout(timmer);
-				}
-				timmer = setTimeout(() => {
-					if (this.$route.path != '/login') {
-						this.currentTime();
-					}
-				}, 1000)
-			})
+			// window.addEventListener('resize', () => {
+			// 	if (timmer) {
+			// 		clearTimeout(timmer);
+			// 	}
+			// 	timmer = setTimeout(() => {
+			// 		if (this.$route.path != '/login') {
+			// 			this.currentTime();
+			// 		}
+			// 	}, 1000)
+			// })
 
-			window.addEventListener('click', () => {
-				if (timmer) {
-					clearTimeout(timmer);
-				}
-				timmer = setTimeout(() => {
-					if (this.$route.path != '/login') {
-						this.currentTime();
-					}
-				}, 1000)
-			})
+			// window.addEventListener('click', () => {
+			// 	if (timmer) {
+			// 		clearTimeout(timmer);
+			// 	}
+			// 	timmer = setTimeout(() => {
+			// 		if (this.$route.path != '/login') {
+			// 			this.currentTime();
+			// 		}
+			// 	}, 1000)
+			// })
 
-			window.addEventListener('scroll', () => {
-				if (timmer) {
-					clearTimeout(timmer);
-				}
-				timmer = setTimeout(() => {
-					if (this.$route.path != '/login') {
-						this.currentTime();
-					}
-				}, 1000)
-			}, true)
+			// window.addEventListener('scroll', () => {
+			// 	if (timmer) {
+			// 		clearTimeout(timmer);
+			// 	}
+			// 	timmer = setTimeout(() => {
+			// 		if (this.$route.path != '/login') {
+			// 			this.currentTime();
+			// 		}
+			// 	}, 1000)
+			// }, true)
 
-			window.addEventListener('mousemove', () => {
-				if (timmer) {
-					clearTimeout(timmer);
-				}
-				timmer = setTimeout(() => {
-					if (this.$route.path != '/login') {
-						this.currentTime();
-					}
-				}, 1000)
-			}, true)
-			// 超时退出 end
+			// window.addEventListener('mousemove', () => {
+			// 	if (timmer) {
+			// 		clearTimeout(timmer);
+			// 	}
+			// 	timmer = setTimeout(() => {
+			// 		if (this.$route.path != '/login') {
+			// 			this.currentTime();
+			// 		}
+			// 	}, 1000)
+			// }, true)
+			// // 超时退出 end
 		},
 		methods: {
 			currentTime() { // 超时退出     

+ 1 - 0
src/layout/components/Navbar.vue

@@ -55,6 +55,7 @@
 			}
 		},
 		created() {
+			// this.role = localStorage.getItem('un')
 			// 获取日期-星期
 			setTimeout(() => {
 				this.getdataTime()

+ 324 - 322
src/views/login/index.vue

@@ -1,332 +1,334 @@
 <template>
-  <div class="login-container">
-    <div class="form-container">
-      <div id="login_form">
-        <div class="title-container">
-          <div id="logo"></div>
-          <div id="title">{{ title }}</div>
-        </div>
-        <div id="caption">登录</div>
-        <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
-
-          <el-form-item prop="username">
-            <span class="svg-container">
-              <svg-icon icon-class="login_home" />
-            </span>
-            <el-input ref="username" v-model="loginForm.username" placeholder="请输入账号" name="username" type="text" tabindex="1" auto-complete="off" />
-          </el-form-item>
-
-          <el-form-item prop="password">
-            <span class="svg-container">
-              <svg-icon icon-class="password" />
-            </span>
-            <el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType" placeholder="请输入密码" name="password" tabindex="2"
-              auto-complete="off" @keyup.enter.native="handleLogin" />
-            <span class="show-pwd" @click="showPwd">
-              <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
-            </span>
-          </el-form-item>
-          <el-button :loading="loading" type="primary" class="btn_submit" @click.native.prevent="handleLogin">
-            登录
-          </el-button>
-        </el-form>
-      </div>
-    </div>
-  </div>
+	<div class="login-container">
+		<div class="form-container">
+			<div id="login_form">
+				<div class="title-container">
+					<div id="logo"></div>
+					<div id="title">{{ title }}</div>
+				</div>
+				<div id="caption">登录</div>
+				<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
+
+					<el-form-item prop="username">
+						<span class="svg-container">
+							<svg-icon icon-class="login_home" />
+						</span>
+						<el-input ref="username" v-model="loginForm.username" placeholder="请输入账号" name="username" type="text" tabindex="1"
+							auto-complete="off" />
+					</el-form-item>
+
+					<el-form-item prop="password">
+						<span class="svg-container">
+							<svg-icon icon-class="password" />
+						</span>
+						<el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType" placeholder="请输入密码" name="password"
+							tabindex="2" auto-complete="off" @keyup.enter.native="handleLogin" />
+						<span class="show-pwd" @click="showPwd">
+							<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
+						</span>
+					</el-form-item>
+					<el-button :loading="loading" type="primary" class="btn_submit" @click.native.prevent="handleLogin">
+						登录
+					</el-button>
+				</el-form>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-  import {
-    login
-  } from '@/api/user'
-
-  export default {
-    name: 'Login',
-    data() {
-      const validateUsername = (rule, value, callback) => {
-        if (!value) {
-          callback(new Error('请输入账号'))
-        } else {
-          callback()
-        }
-      }
-      const validatePassword = (rule, value, callback) => {
-        if (value.length < 6) {
-          callback(new Error('请输入密码,不小于6位'))
-        } else {
-          callback()
-        }
-      }
-      return {
-        loginForm: {
-          admin_name: '',
-          password: ''
-        },
-        loginRules: {
-          username: [{
-            required: true,
-            trigger: 'blur',
-            validator: validateUsername
-          }],
-          password: [{
-            required: true,
-            trigger: 'blur',
-            validator: validatePassword
-          }]
-        },
-        loading: false,
-        passwordType: 'password',
-        redirect: undefined,
-        title: '智慧酒店管理平台'
-      }
-    },
-    watch: {
-      $route: {
-        handler: function(route) {
-          this.redirect = route.query && route.query.redirect
-        },
-        immediate: true
-      }
-    },
-    methods: {
-      showPwd() {
-        if (this.passwordType === 'password') {
-          this.passwordType = ''
-        } else {
-          this.passwordType = 'password'
-        }
-        this.$nextTick(() => {
-          this.$refs.password.focus()
-        })
-      },
-      /**
-       * 登录
-       */
-      handleLogin() {
-        this.$refs.loginForm.validate(valid => {
-          if (valid) {
-            this.loading = true
-            this.$store.dispatch('user/login', this.loginForm)
-              .then((res) => {
-                // console.log(res);
-                if (res.code == 200) {
-                  this.$router.push({
-                    path: this.redirect || '/'
-                  });
-                  this.$message.success(res.message);
-                } else {
-                  this.$message.error(res.message);
-                }
-                this.loading = false;
-              }).catch((err) => {
-                // console.log(err);
-                this.$message.error(err.message);
-                this.loading = false;
-              });
-          } else {
-            // this.$message.error('请输入账号或密码!');
-            return false;
-          }
-        })
-      }
-    }
-  }
+	import {
+		login
+	} from '@/api/user'
+
+	export default {
+		name: 'Login',
+		data() {
+			const validateUsername = (rule, value, callback) => {
+				if (!value) {
+					callback(new Error('请输入账号'))
+				} else {
+					callback()
+				}
+			}
+			const validatePassword = (rule, value, callback) => {
+				if (value.length < 6) {
+					callback(new Error('请输入密码,不小于6位'))
+				} else {
+					callback()
+				}
+			}
+			return {
+				loginForm: {
+					admin_name: '',
+					password: ''
+				},
+				loginRules: {
+					username: [{
+						required: true,
+						trigger: 'blur',
+						validator: validateUsername
+					}],
+					password: [{
+						required: true,
+						trigger: 'blur',
+						validator: validatePassword
+					}]
+				},
+				loading: false,
+				passwordType: 'password',
+				redirect: undefined,
+				title: '智慧酒店管理平台'
+			}
+		},
+		watch: {
+			$route: {
+				handler: function(route) {
+					this.redirect = route.query && route.query.redirect
+				},
+				immediate: true
+			}
+		},
+		methods: {
+			showPwd() {
+				if (this.passwordType === 'password') {
+					this.passwordType = ''
+				} else {
+					this.passwordType = 'password'
+				}
+				this.$nextTick(() => {
+					this.$refs.password.focus()
+				})
+			},
+			/**
+			 * 登录
+			 */
+			handleLogin() {
+				this.$refs.loginForm.validate(valid => {
+					if (valid) {
+						this.loading = true
+						this.$store.dispatch('user/login', this.loginForm)
+							.then((res) => {
+								// console.log(res);
+								if (res.code == 200) {
+									// localStorage.setItem('un', this.loginForm.username)
+									this.$router.push({
+										path: this.redirect || '/'
+									});
+									this.$message.success(res.message);
+								} else {
+									this.$message.error(res.message);
+								}
+								this.loading = false;
+							}).catch((err) => {
+								// console.log(err);
+								this.$message.error(err.message);
+								this.loading = false;
+							});
+					} else {
+						// this.$message.error('请输入账号或密码!');
+						return false;
+					}
+				})
+			}
+		}
+	}
 </script>
 
 <style lang="scss">
-  /* 修复input 背景不协调 和光标变色 */
-  /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
-
-  $bg: #283443;
-  $cursor: #fff;
-
-  /* reset element-ui css */
-  .login-container {
-    .el-input {
-      display: inline-block;
-      height: 74px;
-      width: 85%;
-
-      input {
-        background: transparent;
-        border: 0px;
-        -webkit-appearance: none;
-        border-radius: 0px;
-        padding: 12px 5px 12px 15px;
-        height: 74px;
-        font-size: 28px;
-
-        &:-webkit-autofill {
-          box-shadow: 0 0 0px 1000px $bg inset !important;
-          -webkit-text-fill-color: $cursor !important;
-        }
-      }
-    }
-
-    .el-form-item {
-      border: 2px solid rgba(238, 238, 238, 1);
-      padding: 0 0 0 30px;
-      border-radius: 37px;
-    }
-  }
+	/* 修复input 背景不协调 和光标变色 */
+	/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
+
+	$bg: #283443;
+	$cursor: #fff;
+
+	/* reset element-ui css */
+	.login-container {
+		.el-input {
+			display: inline-block;
+			height: 74px;
+			width: 85%;
+
+			input {
+				background: transparent;
+				border: 0px;
+				-webkit-appearance: none;
+				border-radius: 0px;
+				padding: 12px 5px 12px 15px;
+				height: 74px;
+				font-size: 28px;
+
+				&:-webkit-autofill {
+					box-shadow: 0 0 0px 1000px $bg inset !important;
+					-webkit-text-fill-color: $cursor !important;
+				}
+			}
+		}
+
+		.el-form-item {
+			border: 2px solid rgba(238, 238, 238, 1);
+			padding: 0 0 0 30px;
+			border-radius: 37px;
+		}
+	}
 </style>
 
 <style lang="scss" scoped>
-  $bg: #2d3a4b;
-  $dark_gray: #889aa4;
-  $light_gray: #eee;
-
-  html,
-  body,
-  .login-container {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    background: url(../../icons/images/login/login_bg.png) no-repeat;
-    background-size: 100% 100%;
-    width: 100vw;
-    height: 100vh;
-    margin-bottom: 0;
-
-    .form-container {
-      display: flex;
-      justify-content: flex-end;
-      align-items: center;
-      margin: 0 auto;
-      width: 1220px;
-      height: 650px;
-      background: url(../../icons/images/login/login_form_bg.png) no-repeat;
-      background-size: 100% 100%;
-
-      #login_form {
-        display: flex;
-        flex-direction: column;
-        justify-content: space-around;
-        align-items: center;
-        width: 640px;
-        height: 500px;
-
-
-        .title-container {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          width: 420px;
-
-          #logo {
-            width: 63px;
-            height: 63px;
-            background: url('../../icons/images/login/logo_login.png') 0 0 no-repeat;
-            background-size: 63px 63px;
-          }
-
-          #title {
-            font-size: 42px;
-            font-family: Microsoft YaHei-3970(82674968);
-            font-weight: bold;
-            color: #2B4CFE;
-          }
-        }
-
-        #caption {
-          display: flex;
-          justify-content: center;
-          font-size: 30px;
-          font-family: Adobe Heiti Std;
-          font-weight: bold;
-          color: #2B4CFE;
-          margin-top: 60px;
-        }
-
-        .login-form {
-          width: 500px;
-          max-width: 100%;
-          padding: 0 35px;
-          margin: 0 auto;
-          overflow: hidden;
-
-          .svg-container {
-            margin-top: -100px;
-            font-size: 22px;
-            color: $dark_gray;
-            display: inline-block;
-          }
-
-          .btn_submit {
-            width: 100%;
-            height: 74px;
-            background: #2B4CFE;
-            border-radius: 37px;
-            font-size: 22px;
-            margin-top: 10px;
-          }
-
-          .btn_link {
-            width: 100%;
-            margin-top: 10px;
-            font-size: 20px;
-            font-family: Microsoft YaHei-3970(82674968);
-            font-weight: 400;
-            color: #2B4CFE;
-          }
-        }
-      }
-    }
-  }
-
-  // .login-container {
-  // 	min-height: 100%;
-  // 	width: 100%;
-  // 	background-color: $bg;
-  // 	overflow: hidden;
-
-
-
-  // 	.tips {
-  // 		font-size: 14px;
-  // 		color: #fff;
-  // 		margin-bottom: 10px;
-
-  // 		span {
-  // 			&:first-of-type {
-  // 				margin-right: 16px;
-  // 			}
-  // 		}
-  // 	}
-
-
-
-  // .title-container {
-  // 	display: flex;
-  // 	justify-content: space-between;
-  // 	align-items: center;
-  // 	position: relative;
-
-  // 	.title {
-  // 		font-size: 42px;
-  // 		font-family: Microsoft YaHei-3970(82674968);
-  // 		font-weight: bold;
-  // 		color: #2B4CFE;
-  // 	}
-  // }
-
-  // 	.caption {
-  // 		display: flex;
-  // 		justify-content: center;
-  // 		font-size: 30px;
-  // 		font-family: Adobe Heiti Std;
-  // 		font-weight: bold;
-  // 		color: #2B4CFE;
-  // 	}
-
-  // 	.show-pwd {
-  // 		position: absolute;
-  // 		right: 10px;
-  // 		top: 7px;
-  // 		font-size: 16px;
-  // 		color: $dark_gray;
-  // 		cursor: pointer;
-  // 		user-select: none;
-  // 	}
-  // }
-</style>
+	$bg: #2d3a4b;
+	$dark_gray: #889aa4;
+	$light_gray: #eee;
+
+	html,
+	body,
+	.login-container {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		background: url(../../icons/images/login/login_bg.png) no-repeat;
+		background-size: 100% 100%;
+		width: 100vw;
+		height: 100vh;
+		margin-bottom: 0;
+
+		.form-container {
+			display: flex;
+			justify-content: flex-end;
+			align-items: center;
+			margin: 0 auto;
+			width: 1220px;
+			height: 650px;
+			background: url(../../icons/images/login/login_form_bg.png) no-repeat;
+			background-size: 100% 100%;
+
+			#login_form {
+				display: flex;
+				flex-direction: column;
+				justify-content: space-around;
+				align-items: center;
+				width: 640px;
+				height: 500px;
+
+
+				.title-container {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					width: 420px;
+
+					#logo {
+						width: 63px;
+						height: 63px;
+						background: url('../../icons/images/login/logo_login.png') 0 0 no-repeat;
+						background-size: 63px 63px;
+					}
+
+					#title {
+						font-size: 42px;
+						font-family: Microsoft YaHei-3970(82674968);
+						font-weight: bold;
+						color: #2B4CFE;
+					}
+				}
+
+				#caption {
+					display: flex;
+					justify-content: center;
+					font-size: 30px;
+					font-family: Adobe Heiti Std;
+					font-weight: bold;
+					color: #2B4CFE;
+					margin-top: 60px;
+				}
+
+				.login-form {
+					width: 500px;
+					max-width: 100%;
+					padding: 0 35px;
+					margin: 0 auto;
+					overflow: hidden;
+
+					.svg-container {
+						margin-top: -100px;
+						font-size: 22px;
+						color: $dark_gray;
+						display: inline-block;
+					}
+
+					.btn_submit {
+						width: 100%;
+						height: 74px;
+						background: #2B4CFE;
+						border-radius: 37px;
+						font-size: 22px;
+						margin-top: 10px;
+					}
+
+					.btn_link {
+						width: 100%;
+						margin-top: 10px;
+						font-size: 20px;
+						font-family: Microsoft YaHei-3970(82674968);
+						font-weight: 400;
+						color: #2B4CFE;
+					}
+				}
+			}
+		}
+	}
+
+	// .login-container {
+	// 	min-height: 100%;
+	// 	width: 100%;
+	// 	background-color: $bg;
+	// 	overflow: hidden;
+
+
+
+	// 	.tips {
+	// 		font-size: 14px;
+	// 		color: #fff;
+	// 		margin-bottom: 10px;
+
+	// 		span {
+	// 			&:first-of-type {
+	// 				margin-right: 16px;
+	// 			}
+	// 		}
+	// 	}
+
+
+
+	// .title-container {
+	// 	display: flex;
+	// 	justify-content: space-between;
+	// 	align-items: center;
+	// 	position: relative;
+
+	// 	.title {
+	// 		font-size: 42px;
+	// 		font-family: Microsoft YaHei-3970(82674968);
+	// 		font-weight: bold;
+	// 		color: #2B4CFE;
+	// 	}
+	// }
+
+	// 	.caption {
+	// 		display: flex;
+	// 		justify-content: center;
+	// 		font-size: 30px;
+	// 		font-family: Adobe Heiti Std;
+	// 		font-weight: bold;
+	// 		color: #2B4CFE;
+	// 	}
+
+	// 	.show-pwd {
+	// 		position: absolute;
+	// 		right: 10px;
+	// 		top: 7px;
+	// 		font-size: 16px;
+	// 		color: $dark_gray;
+	// 		cursor: pointer;
+	// 		user-select: none;
+	// 	}
+	// }
+</style>

+ 15 - 5
src/views/order/index.vue

@@ -48,7 +48,7 @@
 									<span>{{ scope.row.order_num }}</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="状态" align="center">
+							<el-table-column label="状态" align="center" width="100">
 								<template slot-scope="scope">
 									<span v-if="scope.row.status === '1'" class="txt-cell-red">待支付</span>
 									<span v-else-if="scope.row.status === '2'" class="txt-cell-green">已支付</span>
@@ -60,7 +60,7 @@
 									<span v-else class="txt-cell-red">未知</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="预订人" align="center">
+							<el-table-column label="预订人" align="center" width="100">
 								<template slot-scope="scope">
 									<span>{{ scope.row.user_name }}</span>
 								</template>
@@ -70,14 +70,24 @@
 									<span>{{ scope.row.phone }}</span>
 								</template>
 							</el-table-column>
+							<el-table-column label="入住时间" align="center" width="100">
+								<template slot-scope="scope">
+									<span>{{ scope.row.live_time }}</span>
+								</template>
+							</el-table-column>
+							<el-table-column label="离店时间" align="center" width="100">
+								<template slot-scope="scope">
+									<span>{{ scope.row.end_time }}</span>
+								</template>
+							</el-table-column>
 							<el-table-column label="预定房型" align="center">
 								<template slot-scope="scope">
 									<span>{{ scope.row.h_type }}</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="房费(元)" align="center">
+							<el-table-column label="房费(元)" align="center" width="100">
 								<template slot-scope="scope">
-									<span>{{ scope.row.price.toFixed(2) }}</span>
+									<span>{{ scope.row.pay_account.toFixed(2) }}</span>
 								</template>
 							</el-table-column>
 							<el-table-column label="支付时间" align="center">
@@ -85,7 +95,7 @@
 									<span>{{ scope.row.create_time }}</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="操作" align="center" width="300">
+							<el-table-column label="操作" align="center" width="220">
 								<template slot-scope="scope">
 									<el-button size="mini" round type="primary" @click="collate_handler(scope.$index, scope.row)">核销</el-button>
 									<el-button size="mini" round type="danger" @click="refund_handler(scope.$index, scope.row)">退款</el-button>