1 |
- {"remainingRequest":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/src/views/login/index.vue?vue&type=style&index=0&id=37dfd6fc&lang=scss&scoped=true","dependencies":[{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/src/views/login/index.vue","mtime":1708395041888},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/css-loader/dist/cjs.js","mtime":1708395146948},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":1708395147772},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/postcss-loader/src/index.js","mtime":1708395147225},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/sass-loader/dist/cjs.js","mtime":1708395146389},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/cache-loader/dist/cjs.js","mtime":1708395146433},{"path":"/Users/caoge/Desktop/地质现场/VehicleMonitor-WEB/node_modules/vue-loader/lib/index.js","mtime":1708395147382}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCg0KLnBhZ2Ugew0KICBwb3NpdGlvbjogcmVsYXRpdmU7DQogIC8vIGJhY2tncm91bmQtaW1hZ2U6IHVybCgnLi4vLi4vYXNzZXRzL2JnLnBuZycpOw0KICBiYWNrZ3JvdW5kOiB1cmwoJy4uLy4uL2Fzc2V0cy9jZXNoaWJlaWppbmcucG5nJyk7IA0KICBiYWNrZ3JvdW5kLXJlcGVhdDogbm8tcmVwZWF0Ow0KICBiYWNrZ3JvdW5kLXBvc2l0aW9uOiBjZW50ZXI7DQogIGJhY2tncm91bmQtYXR0YWNobWVudDogZml4ZWQ7DQogIGJhY2tncm91bmQtc2l6ZTogY292ZXI7DQogIC13ZWJraXQtYmFja2dyb3VuZC1zaXplOiBjb3ZlcjsNCiAgLW1vei1iYWNrZ3JvdW5kLXNpemU6IGNvdmVyOw0KICAtby1iYWNrZ3JvdW5kLXNpemU6IGNvdmVyOyAgIA0KICBiYWNrZ3JvdW5kLXBvc2l0aW9uOjBweCAtMXB4Ow0KICBtaW4td2lkdGg6IDcwMHB4Ow0KICBtaW4taGVpZ2h0OiA5NzBweDsNCiAgaGVpZ2h0OiAxMDB2aDsNCiAgdGV4dC1hbGlnbjogY2VudGVyOw0KDQogIC50aXRsZSB7DQogICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgIGxlZnQ6IDYwcHg7DQogICAgdG9wOiA0NnB4Ow0KICAgIGZvbnQtc2l6ZTogMzJweDsNCiAgICBjb2xvcjogI0ZGRkZGRjsNCiAgICBmb250LWZhbWlseTogUGluZ0ZhbmdTQy1NZWRpdW0sIFBpbmdGYW5nIFNDOw0KICAgIGZvbnQtd2VpZ2h0OiA1MDA7DQogICAgdGV4dC1zaGFkb3c6IDBweCAycHggNHB4IHJnYmEoMCwgMCwgMCwgMC41KTsNCiAgfQ0KDQogIC5pbWFnZV8yMiB7DQogICAgcG9zaXRpb246IHJlbGF0aXZlOw0KICAgIHRvcDogNTBweDsNCiAgICAvLyBkaXNwbGF5OiBibG9jazsNCiAgICAvLyBtYXJnaW46IDAgYXV0bzsNCiAgICAvLyBwYWRkaW5nLXRvcDogNTBweDsNCiAgfQ0KDQogIC5ib3hfOSB7DQogICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgIHJpZ2h0OiAxNjRweDsNCiAgICB0b3A6IDI0NXB4Ow0KICAgIHBhZGRpbmc6IDcycHggNTZweCA0MHB4Ow0KICAgIHdpZHRoOiA0NzJweDsNCiAgICBoZWlnaHQ6IDU3MnB4Ow0KICAgIHRleHQtYWxpZ246IGNlbnRlcjsNCiAgICBiYWNrZ3JvdW5kOiB1cmwoJy4uLy4uL2Fzc2V0cy/nmbvlvZXmoYYucG5nJykgbm8tcmVwZWF0IGNlbnRlciBjZW50ZXI7DQoNCiAgICAuY29kZUltZyB7DQogICAgICBpbWcgew0KICAgICAgICBkaXNwbGF5OiBibG9jazsNCiAgICAgICAgZmxvYXQ6IHJpZ2h0Ow0KICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7DQogICAgICAgIHRvcDogLTYwcHg7DQogICAgICAgIHJpZ2h0OiAzcHg7DQogICAgICB9DQogICAgfQ0KDQogICAgLnRleHRfMSB7DQogICAgICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAxKTsNCiAgICAgIGZvbnQtc2l6ZTogMzJweDsNCiAgICAgIGZvbnQtZmFtaWx5OiBQaW5nRmFuZ1NDLU1lZGl1bSwgUGluZ0ZhbmcgU0M7DQogICAgICBmb250LXdlaWdodDogNTAwOw0KICAgIH0NCg0KICAgIC50ZXh0LXdyYXBwZXJfMSB7DQogICAgICBwb3NpdGlvbjogcmVsYXRpdmU7DQogICAgICB0b3A6IDExMHB4Ow0KICAgICAgYm90dG9tOiAwOw0KICAgICAgd2lkdGg6IDEwMCU7DQogICAgICBoZWlnaHQ6IDQ4cHg7DQogICAgICBib3JkZXI6IDA7DQogICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjU0REQzOw0KICAgICAgY3Vyc29yOiBwb2ludGVyOw0KICAgICAgZm9udC1zaXplOiAyNHB4Ow0KICAgICAgZm9udC1mYW1pbHk6IFBpbmdGYW5nU0MtTWVkaXVtLCBQaW5nRmFuZyBTQzsNCiAgICAgIGZvbnQtd2VpZ2h0OiA1MDA7DQogICAgICBjb2xvcjogI0ZGRkZGRjsNCiAgICB9DQoNCiAgICAudGV4dC13cmFwcGVyXzE6aG92ZXIgew0KICAgICAgYmFja2dyb3VuZC1jb2xvcjogIzAxNTZGRDsNCiAgICB9DQoNCiAgICAudGV4dC13cmFwcGVyXzE6YWN0aXZlIHsNCiAgICAgIGJhY2tncm91bmQtY29sb3I6ICMxOTREQTQ7DQogICAgfQ0KDQogICAgOjp2LWRlZXAgLmVsLWljb24tbG9hZGluZyB7DQogICAgICBwb3NpdGlvbjogcmVsYXRpdmU7DQogICAgICB0b3A6IDBweDsNCiAgICB9DQogIH0NCn0NCg0KOjp2LWRlZXAgLmVsLWlucHV0X19pbm5lciB7DQogIGZvbnQtc2l6ZTogMThweDsNCiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQgIWltcG9ydGFudDsNCiAgYm9yZGVyLXJhZGl1czogMDsNCiAgYm9yZGVyLXRvcDogMDsNCiAgYm9yZGVyLWxlZnQ6IDA7DQogIGJvcmRlci1yaWdodDogMDsNCiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICM1MjhDRDcgIWltcG9ydGFudDsNCiAgY29sb3I6ICNmZmY7DQogIHBhZGRpbmctbGVmdDogNDBweDsNCiAgLy8gbWFyZ2luLWJvdHRvbTogMjBweDsNCn0NCg0KOjp2LWRlZXAgLmVsLWlucHV0X19pbm5lcjotd2Via2l0LWF1dG9maWxsIHsNCiAgLXdlYmtpdC10ZXh0LWZpbGwtY29sb3I6ICNmZmYgIWltcG9ydGFudDsNCiAgZm9udC1zaXplOiAxOHB4Ow0KICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDUwMDBzIGVhc2UtaW4tb3V0IDBzOw0KICBjYXJldC1jb2xvcjogI2ZmZiAhaW1wb3J0YW50Ow0KfQ0KDQo6OnYtZGVlcCAuZWwtZm9ybS1pdGVtX19lcnJvciB7DQogIC8vIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgLy8gdG9wOiAtMjBweDsNCiAgLy8gbGVmdDogLTEzMHB4Ow0KfQ=="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsLA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/views/login","sourcesContent":["\r\n<template>\r\n <div class=\"page\">\r\n <!-- <span class=\"title\">{{ projectName }}</span> -->\r\n <div class=\"box_9\">\r\n <span class=\"text_1\">用户登录</span>\r\n <div style=\"width: 100%;height: 40px;\"></div>\r\n <el-form ref=\"loginForm\" :model=\"loginForm\" :rules=\"loginRules\" auto-complete=\"on\" label-position=\"left\">\r\n <el-form-item prop=\"username\">\r\n <el-input tabindex=\"1\" ref=\"username\" v-model=\"loginForm.username\" placeholder=\"请输入用户名\" name=\"username\"\r\n type=\"text\" auto-complete=\"on\">\r\n <template #prefix>\r\n <img style=\"position: relative;top: 5px;\" src=\"../../assets/编组 4.png\">\r\n </template>\r\n </el-input>\r\n </el-form-item>\r\n <div style=\"width: 100%;height: 20px;\"></div>\r\n <el-form-item prop=\"password\">\r\n <el-input tabindex=\"2\" :key=\"passwordType\" ref=\"password\" v-model=\"loginForm.password\" :type=\"passwordType\"\r\n placeholder=\"请输入密码\" name=\"password\" auto-complete=\"on\" @keyup.enter.native=\"handleLogin\">\r\n <template #prefix>\r\n <img style=\"position: relative;top: 5px;\" src=\"../../assets/icon-lock.png\">\r\n </template></el-input>\r\n </el-form-item>\r\n <div style=\"width: 100%;height: 20px;\"></div>\r\n <el-form-item v-if=\"isShowCode\" prop=\"code\">\r\n <el-input v-model=\"loginForm.code\" class=\"checkCode\" placeholder=\"请输入校验码\">\r\n <template #prefix>\r\n <img style=\"position: relative;top: 5px;\" src=\"../../assets/编组 5.png\">\r\n </template></el-input>\r\n\r\n </el-form-item>\r\n <div class=\"codeImg\">\r\n <img :src=\"codeUrl\" @click=\"getCode\" width=\"100px\">\r\n </div>\r\n </el-form>\r\n <!-- <div style=\"position: relative;\">\r\n <div class=\"text-wrapper_1\" @click=\"handleLogin\">\r\n <span>登 录</span>\r\n </div>\r\n </div> -->\r\n <el-button class=\"text-wrapper_1\" :loading=\"loading\" @click.native.prevent=\"handleLogin\">\r\n <span>登 录</span>\r\n </el-button>\r\n </div>\r\n </div>\r\n</template>\r\n<script>\r\nexport default {\r\n data() {\r\n return {\r\n constants: {},\r\n };\r\n },\r\n methods: {},\r\n};\r\n</script>\r\n\r\n\r\n<script>\r\nimport { validUsername } from '@/utils/validate'\r\nimport { login, getCodeImg, getInfo, userRouters,projectName } from '@/api/user'\r\nimport { nextTick } from 'process'\r\nimport debounce from '@/utils/debounce'\r\nexport default {\r\n name: 'Login',\r\n data() {\r\n const validateUsername = (rule, value, callback) => {\r\n if (!validUsername(value)) {\r\n callback(new Error('Please enter the correct user name'))\r\n } else {\r\n callback()\r\n }\r\n }\r\n const validatePassword = (rule, value, callback) => {\r\n if (value.length < 6) {\r\n callback(new Error('The password can not be less than 6 digits'))\r\n } else {\r\n callback()\r\n }\r\n }\r\n return {\r\n isShowCode: false,\r\n codeUrl: '',\r\n loginForm: {\r\n username: \"\",\r\n password: \"\",\r\n code: '',\r\n uuid: ''\r\n },\r\n loginRules: {\r\n username: [{ required: true, trigger: 'blur', message: '请输入用户名!' }],\r\n password: [{ required: true, trigger: 'blur', message: '请输入密码!' }],\r\n code: [{ required: true, message: '请输入验证码!', trigger: 'blur' },]\r\n },\r\n loading: false,\r\n passwordType: 'password',\r\n redirect: undefined,\r\n projectName:'',\r\n }\r\n },\r\n watch: {\r\n $route: {\r\n handler: function (route) {\r\n this.redirect = route.query && route.query.redirect\r\n },\r\n immediate: true\r\n }\r\n },\r\n created() {\r\n this.getCodeImg() \r\n projectName().then(res => { \r\n this.projectName = res \r\n }) \r\n },\r\n methods: {\r\n showPwd() {\r\n if (this.passwordType === 'password') {\r\n this.passwordType = ''\r\n } else {\r\n this.passwordType = 'password'\r\n }\r\n this.$nextTick(() => {\r\n this.$refs.password.focus()\r\n })\r\n },\r\n getCode() {\r\n this.getCodeImg()\r\n },\r\n getCodeImg() {\r\n getCodeImg().then(res => {\r\n if (res.code == 200) { \r\n if (res.captchaEnabled) {\r\n this.isShowCode = true\r\n this.codeUrl = \"data:image/gif;base64,\" + res.img;\r\n this.loginForm.uuid = res.uuid\r\n } else {\r\n this.isShowCode = false\r\n } \r\n }\r\n })\r\n },\r\n handleLogin() {\r\n this.$refs.loginForm.validate(valid => {\r\n if (valid) { \r\n this.loading = true \r\n this.$store.dispatch('user/login', this.loginForm).then(res => { \r\n this.$router.push({ path: '/' })\r\n this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) \r\n this.loading = false \r\n }).catch(err => { \r\n this.loading = false\r\n }) \r\n } else {\r\n console.log('error submit!!')\r\n return false\r\n }\r\n })\r\n },\r\n // handleLogin:debounce(function(){\r\n // this.$refs.loginForm.validate(valid => {\r\n // if (valid) { \r\n // this.loading = true \r\n // this.$store.dispatch('user/login', this.loginForm).then(res => { \r\n // this.$router.push({ path: '/' })\r\n // this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) \r\n // }).catch(err => { \r\n // this.loading = false\r\n // }) \r\n // } else {\r\n // console.log('error submit!!')\r\n // return false\r\n // }\r\n // })\r\n // },2000)\r\n }\r\n}\r\n</script>\r\n\r\n\r\n\r\n<style lang=\"scss\" scoped>\r\n.page {\r\n position: relative;\r\n // background-image: url('../../assets/bg.png');\r\n background: url('../../assets/ceshibeijing.png'); \r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-attachment: fixed;\r\n background-size: cover;\r\n -webkit-background-size: cover;\r\n -moz-background-size: cover;\r\n -o-background-size: cover; \r\n background-position:0px -1px;\r\n min-width: 700px;\r\n min-height: 970px;\r\n height: 100vh;\r\n text-align: center;\r\n\r\n .title {\r\n position: absolute;\r\n left: 60px;\r\n top: 46px;\r\n font-size: 32px;\r\n color: #FFFFFF;\r\n font-family: PingFangSC-Medium, PingFang SC;\r\n font-weight: 500;\r\n text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);\r\n }\r\n\r\n .image_22 {\r\n position: relative;\r\n top: 50px;\r\n // display: block;\r\n // margin: 0 auto;\r\n // padding-top: 50px;\r\n }\r\n\r\n .box_9 {\r\n position: absolute;\r\n right: 164px;\r\n top: 245px;\r\n padding: 72px 56px 40px;\r\n width: 472px;\r\n height: 572px;\r\n text-align: center;\r\n background: url('../../assets/登录框.png') no-repeat center center;\r\n\r\n .codeImg {\r\n img {\r\n display: block;\r\n float: right;\r\n position: relative;\r\n top: -60px;\r\n right: 3px;\r\n }\r\n }\r\n\r\n .text_1 {\r\n color: rgba(255, 255, 255, 1);\r\n font-size: 32px;\r\n font-family: PingFangSC-Medium, PingFang SC;\r\n font-weight: 500;\r\n }\r\n\r\n .text-wrapper_1 {\r\n position: relative;\r\n top: 110px;\r\n bottom: 0;\r\n width: 100%;\r\n height: 48px;\r\n border: 0;\r\n background-color: #254DD3;\r\n cursor: pointer;\r\n font-size: 24px;\r\n font-family: PingFangSC-Medium, PingFang SC;\r\n font-weight: 500;\r\n color: #FFFFFF;\r\n }\r\n\r\n .text-wrapper_1:hover {\r\n background-color: #0156FD;\r\n }\r\n\r\n .text-wrapper_1:active {\r\n background-color: #194DA4;\r\n }\r\n\r\n ::v-deep .el-icon-loading {\r\n position: relative;\r\n top: 0px;\r\n }\r\n }\r\n}\r\n\r\n::v-deep .el-input__inner {\r\n font-size: 18px;\r\n background-color: transparent !important;\r\n border-radius: 0;\r\n border-top: 0;\r\n border-left: 0;\r\n border-right: 0;\r\n border-bottom: 1px solid #528CD7 !important;\r\n color: #fff;\r\n padding-left: 40px;\r\n // margin-bottom: 20px;\r\n}\r\n\r\n::v-deep .el-input__inner:-webkit-autofill {\r\n -webkit-text-fill-color: #fff !important;\r\n font-size: 18px;\r\n transition: background-color 5000s ease-in-out 0s;\r\n caret-color: #fff !important;\r\n}\r\n\r\n::v-deep .el-form-item__error {\r\n // position: relative;\r\n // top: -20px;\r\n // left: -130px;\r\n}</style>\r\n"]}]}
|