ylyx-cli 1.0.14 → 1.0.16

package/templates/vue-app/files/src/views/login.vue

@@ -1,243 +1,243 @@
-<template>
-  <div class="login" :style="'background-image:url(' + Background + ');'">
-    <el-form
-      ref="loginForm"
-      :model="loginForm"
-      :rules="loginRules"
-      label-position="left"
-      label-width="0px"
-      class="login-form">
-      <div class="text-center">
-        <!-- <img :src="logoUrl" width="55"> -->
-      </div>
-
-      <h3 class="title">安徽省医疗影像云监测平台</h3>
-      <el-form-item prop="username">
-        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
-          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          auto-complete="off"
-          placeholder="密码">
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="code">
-        <el-row :gutter="15">
-          <el-col :span="15">
-            <el-input
-              v-model="loginForm.code"
-              type="text"
-              auto-complete="off"
-              placeholder="请输入验证码"
-              @keyup.enter.native="handleLogin">
-              <i
-                slot="prefix"
-                class="el-icon-key"
-                style="line-height: 40px; font-szie: 16px; font-weight: 700; color: #c0c4cc"></i>
-            </el-input>
-          </el-col>
-          <el-col :span="9" style="height: 38px">
-            <el-image @click="getCodeImg" style="width: 100%; height: 38px" :src="base64Code">
-            </el-image>
-          </el-col>
-        </el-row>
-      </el-form-item>
-      <el-form-item style="width: 100%">
-        <el-button
-          :loading="loading"
-          size="medium"
-          type="primary"
-          style="width: 100%"
-          @click.native.prevent="handleLogin">
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-      </el-form-item>
-    </el-form>
-    <!--  底部  -->
-    <div v-if="$store.state.settings.showFooter" id="el-login-footer">
-      <p v-html="$store.state.settings.footerTxt" />
-      <p>
-        <span v-html="$store.state.settings.caseNumber" style="padding-right: 15px"></span>
-        <img :src="gongan" width="12" />
-        <span v-html="$store.state.settings.gonganNumber"></span>
-      </p>
-    </div>
-  </div>
-</template>
-
-<script>
-import { encrypt } from '@/utils/rsaEncrypt';
-import Cookies from 'js-cookie';
-import Background from '@/assets/images/background.jpg';
-import logoUrl from '@/assets/images/logo.png';
-// import dataGif from '@/assets/images/data.gif'
-import { getCodeImg } from '@/api/login';
-import { mapGetters } from 'vuex';
-export default {
-  name: 'Login',
-  data() {
-    return {
-      Background,
-      logoUrl,
-      // dataGif,
-      cookiePass: '',
-      loginForm: {
-        username: '',
-        password: '',
-        uuid: '',
-        code: '',
-      },
-      loginRules: {
-        username: [{ required: true, trigger: 'blur', message: '用户名不能为空' }],
-        password: [{ required: true, trigger: 'blur', message: '密码不能为空' }],
-        code: [{ required: true, trigger: 'blur', message: '验证码不能为空' }],
-      },
-      loading: false,
-      redirect: undefined,
-      base64Code: '',
-    };
-  },
-  watch: {
-    $route: {
-      handler: function (route) {
-        this.redirect = route.query && route.query.redirect;
-      },
-      immediate: true,
-    },
-  },
-  computed: {
-    ...mapGetters(['sidebarRouters', 'sidebar']),
-    routes() {
-      return this.$store.state.permission.routers;
-    },
-    user() {
-      return this.$store.state.user.user;
-    },
-  },
-  created() {
-    // 获取用户名密码等Cookie
-    this.getCookie();
-    // token 过期提示
-    this.point();
-    // 验证码
-    this.getCodeImg();
-  },
-  methods: {
-    getCodeImg() {
-      getCodeImg()
-        .then(res => {
-          this.base64Code = res.img;
-          this.loginForm.uuid = res.uuid;
-        })
-        .catch(res => {
-          console.log(res);
-        });
-    },
-    getCookie() {
-      const username = Cookies.get('username');
-      let password = Cookies.get('password');
-      // 保存cookie里面的加密后的密码
-      this.cookiePass = password === undefined ? '' : password;
-      password = password === undefined ? this.loginForm.password : password;
-      this.loginForm = {
-        username: username === undefined ? this.loginForm.username : username,
-        password: password,
-      };
-    },
-    handleLogin() {
-      this.$refs.loginForm.validate(valid => {
-        const user = {
-          username: this.loginForm.username,
-          password: this.loginForm.password,
-          uuid: this.loginForm.uuid,
-          code: this.loginForm.code,
-        };
-        if (user.password !== this.cookiePass) {
-          user.password = encrypt(user.password);
-        }
-        if (valid) {
-          this.loading = true;
-          this.$store
-            .dispatch('Login', user)
-            .then(() => {
-              this.loading = false;
-              sessionStorage.removeItem('key');
-              // this.$router.push({ path: this.redirect || '/' })
-              this.$router.push({
-                path:
-                  this.redirect || this.user.defaultHomePage !== undefined
-                    ? this.user.defaultHomePage
-                    : '/',
-              });
-            })
-            .catch(() => {
-              this.loading = false;
-              this.getCodeImg();
-              this.loginForm.code = '';
-            });
-          if (this.routes) console.log(this.routes, 'permission_routers');
-        } else {
-          return false;
-        }
-      });
-    },
-    point() {
-      const point = Cookies.get('point') !== undefined;
-      if (point) {
-        this.$notify({
-          title: '提示',
-          message: '当前登录状态已过期，请重新登录！',
-          type: 'warning',
-          duration: 5000,
-        });
-        Cookies.remove('point');
-      }
-    },
-  },
-};
-</script>
-
-<style rel="stylesheet/scss" lang="scss">
-.login {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  background-size: cover;
-}
-.title {
-  margin: 20px auto 30px auto;
-  text-align: center;
-  color: #fff;
-}
-
-.login-form {
-  border-radius: 6px;
-  background: rgba(255, 255, 255, 0.1);
-  width: 385px;
-  padding: 45px 35px 45px 35px;
-  box-shadow: 0px 0px 16px #ffffff47;
-  .el-input {
-    height: 38px;
-    input {
-      height: 38px;
-    }
-  }
-  .input-icon {
-    height: 39px;
-    width: 14px;
-    margin-left: 2px;
-  }
-}
-.login-tip {
-  font-size: 13px;
-  text-align: center;
-  color: #bfbfbf;
-}
-</style>
+<template>
+  <div class="login" :style="'background-image:url(' + Background + ');'">
+    <el-form
+      ref="loginForm"
+      :model="loginForm"
+      :rules="loginRules"
+      label-position="left"
+      label-width="0px"
+      class="login-form">
+      <div class="text-center">
+        <!-- <img :src="logoUrl" width="55"> -->
+      </div>
+
+      <h3 class="title">安徽省医疗影像云监测平台</h3>
+      <el-form-item prop="username">
+        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
+          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="loginForm.password"
+          type="password"
+          auto-complete="off"
+          placeholder="密码">
+          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="code">
+        <el-row :gutter="15">
+          <el-col :span="15">
+            <el-input
+              v-model="loginForm.code"
+              type="text"
+              auto-complete="off"
+              placeholder="请输入验证码"
+              @keyup.enter.native="handleLogin">
+              <i
+                slot="prefix"
+                class="el-icon-key"
+                style="line-height: 40px; font-szie: 16px; font-weight: 700; color: #c0c4cc"></i>
+            </el-input>
+          </el-col>
+          <el-col :span="9" style="height: 38px">
+            <el-image @click="getCodeImg" style="width: 100%; height: 38px" :src="base64Code">
+            </el-image>
+          </el-col>
+        </el-row>
+      </el-form-item>
+      <el-form-item style="width: 100%">
+        <el-button
+          :loading="loading"
+          size="medium"
+          type="primary"
+          style="width: 100%"
+          @click.native.prevent="handleLogin">
+          <span v-if="!loading">登 录</span>
+          <span v-else>登 录 中...</span>
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!--  底部  -->
+    <div v-if="$store.state.settings.showFooter" id="el-login-footer">
+      <p v-html="$store.state.settings.footerTxt" />
+      <p>
+        <span v-html="$store.state.settings.caseNumber" style="padding-right: 15px"></span>
+        <img :src="gongan" width="12" />
+        <span v-html="$store.state.settings.gonganNumber"></span>
+      </p>
+    </div>
+  </div>
+</template>
+
+<script>
+import { encrypt } from '@/utils/rsaEncrypt';
+import Cookies from 'js-cookie';
+import Background from '@/assets/images/background.jpg';
+import logoUrl from '@/assets/images/logo.png';
+// import dataGif from '@/assets/images/data.gif'
+import { getCodeImg } from '@/api/login';
+import { mapGetters } from 'vuex';
+export default {
+  name: 'Login',
+  data() {
+    return {
+      Background,
+      logoUrl,
+      // dataGif,
+      cookiePass: '',
+      loginForm: {
+        username: '',
+        password: '',
+        uuid: '',
+        code: '',
+      },
+      loginRules: {
+        username: [{ required: true, trigger: 'blur', message: '用户名不能为空' }],
+        password: [{ required: true, trigger: 'blur', message: '密码不能为空' }],
+        code: [{ required: true, trigger: 'blur', message: '验证码不能为空' }],
+      },
+      loading: false,
+      redirect: undefined,
+      base64Code: '',
+    };
+  },
+  watch: {
+    $route: {
+      handler: function (route) {
+        this.redirect = route.query && route.query.redirect;
+      },
+      immediate: true,
+    },
+  },
+  computed: {
+    ...mapGetters(['sidebarRouters', 'sidebar']),
+    routes() {
+      return this.$store.state.permission.routers;
+    },
+    user() {
+      return this.$store.state.user.user;
+    },
+  },
+  created() {
+    // 获取用户名密码等Cookie
+    this.getCookie();
+    // token 过期提示
+    this.point();
+    // 验证码
+    this.getCodeImg();
+  },
+  methods: {
+    getCodeImg() {
+      getCodeImg()
+        .then(res => {
+          this.base64Code = res.img;
+          this.loginForm.uuid = res.uuid;
+        })
+        .catch(res => {
+          console.log(res);
+        });
+    },
+    getCookie() {
+      const username = Cookies.get('username');
+      let password = Cookies.get('password');
+      // 保存cookie里面的加密后的密码
+      this.cookiePass = password === undefined ? '' : password;
+      password = password === undefined ? this.loginForm.password : password;
+      this.loginForm = {
+        username: username === undefined ? this.loginForm.username : username,
+        password: password,
+      };
+    },
+    handleLogin() {
+      this.$refs.loginForm.validate(valid => {
+        const user = {
+          username: this.loginForm.username,
+          password: this.loginForm.password,
+          uuid: this.loginForm.uuid,
+          code: this.loginForm.code,
+        };
+        if (user.password !== this.cookiePass) {
+          user.password = encrypt(user.password);
+        }
+        if (valid) {
+          this.loading = true;
+          this.$store
+            .dispatch('Login', user)
+            .then(() => {
+              this.loading = false;
+              sessionStorage.removeItem('key');
+              // this.$router.push({ path: this.redirect || '/' })
+              this.$router.push({
+                path:
+                  this.redirect || this.user.defaultHomePage !== undefined
+                    ? this.user.defaultHomePage
+                    : '/',
+              });
+            })
+            .catch(() => {
+              this.loading = false;
+              this.getCodeImg();
+              this.loginForm.code = '';
+            });
+          if (this.routes) console.log(this.routes, 'permission_routers');
+        } else {
+          return false;
+        }
+      });
+    },
+    point() {
+      const point = Cookies.get('point') !== undefined;
+      if (point) {
+        this.$notify({
+          title: '提示',
+          message: '当前登录状态已过期，请重新登录！',
+          type: 'warning',
+          duration: 5000,
+        });
+        Cookies.remove('point');
+      }
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss">
+.login {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  background-size: cover;
+}
+.title {
+  margin: 20px auto 30px auto;
+  text-align: center;
+  color: #fff;
+}
+
+.login-form {
+  border-radius: 6px;
+  background: rgba(255, 255, 255, 0.1);
+  width: 385px;
+  padding: 45px 35px 45px 35px;
+  box-shadow: 0px 0px 16px #ffffff47;
+  .el-input {
+    height: 38px;
+    input {
+      height: 38px;
+    }
+  }
+  .input-icon {
+    height: 39px;
+    width: 14px;
+    margin-left: 2px;
+  }
+}
+.login-tip {
+  font-size: 13px;
+  text-align: center;
+  color: #bfbfbf;
+}
+</style>