| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- <template>
- <div class="container" :style="{ background: 'url(' + backUrl + ')' }">
- <div style="flex: 1"></div>
- <div style="display: flex; flex-direction: column">
- <div style="flex: 1"></div>
- <div id="login-box">
- <h1 class="title">ADM登录</h1>
- <div class="form">
- <div class="item">
- <i class="el-icon-user"></i>
- <input type="text" placeholder="请输入手机号" v-model="userName" />
- </div>
- <div class="item">
- <i class="el-icon-lock"></i>
- <input
- type="password"
- placeholder="请输入密码"
- v-model="userPass"
- @keyup.stop="passTxtKeyUp($event)"
- v-loading.fullscreen.lock="fullscreenLoading"
- />
- </div>
- </div>
- <button @click="startLogin">Login</button>
- </div>
- <div style="flex: 1"></div>
- </div>
- <div style="flex: 1"></div>
- </div>
- </template>
- <script>
- import vueStore from "@/store";
- import { sessionStore } from "@/store/sessionStore";
- import { userController } from "@/controller/userController";
- import { logicConfig } from "@/logicConfig";
- import { Message } from "element-ui";
- export default {
- name: "login",
- props: [],
- data() {
- return {
- backUrl: require("@/assets/images/login_bg.png"),
- userName: "",
- userPass: "",
- fullscreenLoading: false,
- };
- },
- computed: {},
- methods: {
- //登录按钮事件
- startLogin: async function () {
- if (!this.userName) return Message.warning("请填写用户名");
- if (!this.userPass) return Message.warning("请填写密码");
- this.fullscreenLoading = true;
- try {
- let loginResult = await userController.login(
- this.userName,
- this.userPass
- );
- if (loginResult.result != logicConfig.resultObj.success) {
- this.fullscreenLoading = false;
- Message.error("登录失败,原因:" + loginResult.message);
- return;
- }
- var userToken = loginResult.data;
- if (!userToken) {
- this.fullscreenLoading = false;
- Message.error("登录失败,原因:缺失用户token");
- return;
- }
- sessionStore.userToken = userToken;
- this.$router.replace({ path: vueStore.state.fromPath });
- } catch (err) {
- this.fullscreenLoading = false;
- console.error("登录失败:", err);
- Message.error("登录失败");
- }
- },
- //密码框键盘起来事件
- passTxtKeyUp: function (event) {
- if (event.keyCode == 13) this.startLogin();
- },
- },
- created() {},
- mounted() {},
- components: {},
- };
- </script>
- <style scoped>
- .container {
- display: flex;
- flex-direction: row;
- width: 100%;
- height: 100%;
- background-repeat: no-repeat !important;
- background-size: 100% 100% !important;
- overflow: hidden;
- }
- #login-box {
- text-align: center;
- background: #00000080;
- padding: 20px 50px;
- width: 450px;
- }
- .title {
- color: #ffffff;
- font-size: 32px;
- }
- .form {
- margin-top: 50px;
- }
- .item {
- margin-top: 15px;
- }
- .form i {
- font-size: 18px;
- color: #fff;
- width: 16px;
- height: 16px;
- }
- .form input {
- width: 180px;
- font-size: 18px;
- border: 0;
- border-bottom: 2px solid #fff;
- padding: 5px 10px;
- background: #ffffff00;
- color: #fff;
- }
- #login-box button {
- margin-top: 15px;
- cursor: pointer;
- width: 180px;
- height: 30px;
- font-size: 20px;
- font-weight: 700;
- border: 0;
- background-image: linear-gradient(
- 90deg,
- #b8cbb8 0,
- #b8cbb8 0,
- #ddbaee 0,
- #e8a8ee 33%,
- #b8d9f8 66%,
- #59bcf5
- );
- border-radius: 15px;
- }
- @font-face {
- font-family: login_iconfont;
- src: url(data:font/woff2;base64,d09GMgABAAAAAAOYAAsAAAAAB6QAAANLAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDBgqCfIJyATYCJAMMCwgABCAFhGcHOBvQBhHVm6PIfiQYN41nZd3meYYVNZK+CR4+//zuzLzkA/aSyUo4/VagStdbpwECwNhuzTlC4aMmS7J25NE/5P+L6aXpQHix///e8f+V+LwWAMwxuBM+sDygD9qYi6ZQJ0/QW2R3BWKR+yAAS+LlksWl1c3YTg8smIUnDbNSQFIspifGBjAXdGgNxQJzBHpoXw2xCx3IzfIZsDP4vPhHYuYg0SnMhepHS4a59XPkt5symAx0q28YxivB9SWgAxQQvTKD6G22taOiWDSFZZVMI9l6NARy1KDJRMDTJHrrDw8kAoQes9AagHASl/BzxGFBwm83wVkXKgD0OGEErlOK850UytvSPtNezBfGDx+2vHsHW57dQhpuP7ey2fryrlDGOy8GjXdfbn1+G6xHDJcsrbdcqZBcrUu7zFKjq7BzP3xofflRfOzrbjG8r/HaNO9zdjEcPr/14lEhrD6a1DarrVbv7S1WosLjKhad5Tj6GO/eFVtaPvjwQbwzteTpAwMZC2y2P2FmS9Bpz6CoQM8zQVeCzngGRgV5nl7c7EpKy2q3sPqKwybHK46bHKIcg3UcyZgbSJ2ynjBeHYq6lL+iVFRWrltffcxm++cQlWUFyw8NRhou24y76KXVnki3yD1WCLOq5lXrq2s1Bwtzlx2yU+zcOwVWezJdI89Y0p/unNLWlTRJd0J6izYe29WaUezkWNycHteeRD8ApveqVUWB6aY6oPJ/2294IaV9n132f3MrDYDvPsu0wGO6qQHLB3MkgHk/SQ4QqWl+UFoVv7FQAIqqe41IwNIKggnT5ehHf4cTEovAXOBjkJjhBQpzAjGNEgk6rEgEPebkgCVRSgZb4WQOCqFZAKHWIhDYuwwSW26Awt5DTKN8BB2ufoEee+QfNl7tx9s6ZI6MStCC/kFhqHW2UgKiN/RDrbgs/ELuCxyENEryySu2yEN06N8+E3HgmBq4cIthXRN0TCUaiYJIl8exq7pJZKgZHTGkCGQB7QcUDNJyHlqy33eDvEFNYSD2irFegYmDVCQBYFdZCyq7kkl6b15GCAc4jBINcBEsqFZjBHTVtUrIEJHQI9LJxRbKQWXR/Irm4VYBlsxpVVIooTE/mSpd/Kj1YRiNAAA=)
- format("woff2"),
- url(data:font/woff;base64,d09GRgABAAAAAAUYAAsAAAAAB6QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAARAAAAGA81krnY21hcAAAAYgAAABYAAABhm1w0ZdnbHlmAAAB4AAAAU4AAAF8bAZJImhlYWQAAAMwAAAALwAAADYdWjgEaGhlYQAAA2AAAAAcAAAAJAeCA4RobXR4AAADfAAAAAwAAAAMDAAAAGxvY2EAAAOIAAAACAAAAAgAUgC+bWF4cAAAA5AAAAAeAAAAIAEQAFduYW1lAAADsAAAAUAAAAJnEKM8sHBvc3QAAATwAAAAJwAAADhGZw3ieJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGFhYJzAwMrAwNTJdIaBgaEfQjO+ZjBi5ACKMrAyM2AFAWmuKQwHnqW+EGdu+N/AEMN8h6EBKMyIoogJAHmXDTp4nO2QsQ2AMAwE7xNIgeizAgUDUdGxOsoWwXZgC146v/1OGgMzkI3dmEAnwnVYqsgzS+RTvCnmIt1Xq73D5ybZrpgn/6fCrzXq9k7JrzXwvtUBegDLDw8+eJwljl9LwmAUxs9536amJOyPjhENnJjIwnTba2yDUV0YNYdXswK7sW6s2y4LK3D0CbwKupe+Q5/Cj9PsnR4Oz+E85znwAwqwXtERNWEfGsAAkDltNMp4kElFVHS0a1aATOR2wwnQ0vmphkquXjMOudvj52qFrNzJ88St+4bh13G5memn4fd9Yw34pknpSNI0CZeSRiD2Jh7vmEfTFReeRpNLvH2P01jUNBHN7AN4ZYy/dEFPwYVLuAIQOk3mNNvY5Fy9Da2qVNUy5nN5lQNnuF07ICe2ZetEtbtbr9nFgOqEx0xsE0YXiHsfD/4ZCZOvJCTn3v17mSAWZVUuYiFOhuJuYZjEBSwqVbmEf9+kN366c4XjayZLLO6oSISdx5+j1ms/nEfRPLx4aZnLaS5PS3KJ92AWCUI0G2w34rIbB63RdOwJgntrA/wDxvhEqwAAeJxjYGRgYADie0xMAvH8Nl8ZuFkYQOCubBULgv6/n4WB2QHI5WBgAokCANdeB6IAeJxjYGRgYG7438DAwMIAAkCSkQEVMAMAPVUCEAQAAAAEAAAABAAAAAAAAAAAUgC+eJxjYGRgYGBm8AZiEGACYi4gZGD4D+YzAAAQMwFoAAB4nIWRPW7CQBCFn8GQBJQoSqQ0aVYpKBLJ/JRIqVCgp6AHs+ZHttdaL0jUOU2OkBPkCOloc4pIedhDA0W82tlv3r6ZHckA7rCHh/K75y7ZwyWzkiu4wKNwlfqTsE9+Fq6hiZ5wnfqrcAMveBNusmPGDp5/xayFd2EPt/gQruAGn8JV6l/CPvlbuIYH/AjXqf8KNzDxroWbaHnhwOqp03M126lVaNLIpO54jvViE0/tqTzRNl+ZVHWDzlEa6VTbY5t8u+g5F6nImkQNeavj2KjMmrUOXbB0Luu325HoQWgSDGChMYVjnENhhh3jCiEMUkRFdGf5mO4FNohZaf91T+i2yKkfcoUuAnTOXCO60sJ5Ok2OLV/rUXV0K27LmoQ0lFrNSWKy4g883K2phNQDLIuqDH20uaITf1DMkPwB2JNvV3icY2BigAAuBuyAmZGJkZmRhYE1Jz8525CtMj8vPaOUgQEAKT4EmwA=)
- format("woff"),
- url(data:font/ttf;base64,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)
- format("truetype");
- }
- </style>
|