kz-ui-base 1.0.2 → 1.0.4

package/common/src/views/error/404.vue

@@ -1,248 +0,0 @@
-<template>
-  <div class="wscn-http404-container">
-    <div class="wscn-http404">
-      <div class="pic-404">
-        <img class="pic-404__parent" :src="errImages.errImages1" alt="404">
-        <img class="pic-404__child left" :src="errImages.errImages2" alt="404">
-        <img class="pic-404__child mid" :src="errImages.errImages3" alt="404">
-        <img class="pic-404__child right" :src="errImages.errImages4" alt="404">
-      </div>
-      <div class="bullshit">
-        <div class="bullshit__oops">
-          404错误!
-        </div>
-        <div class="bullshit__headline">
-          {{ message }}
-        </div>
-        <div class="bullshit__info">
-          对不起，您正在寻找的页面不存在。尝试检查URL的错误，然后按浏览器上的刷新按钮或尝试在我们的应用程序中找到其他内容。
-        </div>
-        <router-link to="/" class="bullshit__return-home">
-          返回首页
-        </router-link>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import errImages1 from '../../assets/404_images/404.png'
-import errImages2 from '../../assets/404_images/404_cloud.png'
-import errImages3 from '../../assets/404_images/404_cloud.png'
-import errImages4 from '../../assets/404_images/404_cloud.png'
-
-export default {
-  name: 'Page404',
-  data() {
-    return {
-      errImages: {
-        errImages1: errImages1,
-        errImages2: errImages2,
-        errImages3: errImages3,
-        errImages4: errImages4
-      }
-    }
-  },
-  computed: {
-    message() {
-
-      return '找不到网页！'
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.wscn-http404-container{
-  transform: translate(-50%,-50%);
-  position: absolute;
-  top: 40%;
-  left: 50%;
-}
-.wscn-http404 {
-  position: relative;
-  width: 1200px;
-  padding: 0 50px;
-  overflow: hidden;
-  .pic-404 {
-    position: relative;
-    float: left;
-    width: 600px;
-    overflow: hidden;
-    &__parent {
-      width: 100%;
-    }
-    &__child {
-      position: absolute;
-      &.left {
-        width: 80px;
-        top: 17px;
-        left: 220px;
-        opacity: 0;
-        animation-name: cloudLeft;
-        animation-duration: 2s;
-        animation-timing-function: linear;
-        animation-fill-mode: forwards;
-        animation-delay: 1s;
-      }
-      &.mid {
-        width: 46px;
-        top: 10px;
-        left: 420px;
-        opacity: 0;
-        animation-name: cloudMid;
-        animation-duration: 2s;
-        animation-timing-function: linear;
-        animation-fill-mode: forwards;
-        animation-delay: 1.2s;
-      }
-      &.right {
-        width: 62px;
-        top: 100px;
-        left: 500px;
-        opacity: 0;
-        animation-name: cloudRight;
-        animation-duration: 2s;
-        animation-timing-function: linear;
-        animation-fill-mode: forwards;
-        animation-delay: 1s;
-      }
-      @keyframes cloudLeft {
-        0% {
-          top: 17px;
-          left: 220px;
-          opacity: 0;
-        }
-        20% {
-          top: 33px;
-          left: 188px;
-          opacity: 1;
-        }
-        80% {
-          top: 81px;
-          left: 92px;
-          opacity: 1;
-        }
-        100% {
-          top: 97px;
-          left: 60px;
-          opacity: 0;
-        }
-      }
-      @keyframes cloudMid {
-        0% {
-          top: 10px;
-          left: 420px;
-          opacity: 0;
-        }
-        20% {
-          top: 40px;
-          left: 360px;
-          opacity: 1;
-        }
-        70% {
-          top: 130px;
-          left: 180px;
-          opacity: 1;
-        }
-        100% {
-          top: 160px;
-          left: 120px;
-          opacity: 0;
-        }
-      }
-      @keyframes cloudRight {
-        0% {
-          top: 100px;
-          left: 500px;
-          opacity: 0;
-        }
-        20% {
-          top: 120px;
-          left: 460px;
-          opacity: 1;
-        }
-        80% {
-          top: 180px;
-          left: 340px;
-          opacity: 1;
-        }
-        100% {
-          top: 200px;
-          left: 300px;
-          opacity: 0;
-        }
-      }
-    }
-  }
-  .bullshit {
-    position: relative;
-    float: left;
-    width: 300px;
-    padding: 30px 0;
-    overflow: hidden;
-    &__oops {
-      font-size: 32px;
-      font-weight: bold;
-      line-height: 40px;
-      color: #1482f0;
-      opacity: 0;
-      margin-bottom: 20px;
-      animation-name: slideUp;
-      animation-duration: 0.5s;
-      animation-fill-mode: forwards;
-    }
-    &__headline {
-      font-size: 20px;
-      line-height: 24px;
-      color: #222;
-      font-weight: bold;
-      opacity: 0;
-      margin-bottom: 10px;
-      animation-name: slideUp;
-      animation-duration: 0.5s;
-      animation-delay: 0.1s;
-      animation-fill-mode: forwards;
-    }
-    &__info {
-      font-size: 13px;
-      line-height: 21px;
-      color: grey;
-      opacity: 0;
-      margin-bottom: 30px;
-      animation-name: slideUp;
-      animation-duration: 0.5s;
-      animation-delay: 0.2s;
-      animation-fill-mode: forwards;
-    }
-    &__return-home {
-      display: block;
-      float: left;
-      width: 110px;
-      height: 36px;
-      background: #1482f0;
-      border-radius: 100px;
-      text-align: center;
-      color: #ffffff;
-      opacity: 0;
-      font-size: 14px;
-      line-height: 36px;
-      cursor: pointer;
-      animation-name: slideUp;
-      animation-duration: 0.5s;
-      animation-delay: 0.3s;
-      animation-fill-mode: forwards;
-    }
-    @keyframes slideUp {
-      0% {
-        transform: translateY(60px);
-        opacity: 0;
-      }
-      100% {
-        transform: translateY(0);
-        opacity: 1;
-      }
-    }
-  }
-}
-</style>

package/common/src/views/login.vue

@@ -1,350 +0,0 @@
-<template>
-  <div class="login">
-    <el-carousel
-      height="100%"
-      style="height: 100%; width: 100%; position: absolute"
-      indicator-position="none"
-      arrow="never"
-      :interval="3500"
-    >
-      <el-carousel-item
-        v-for="(image, index) in imgs"
-        :key="index"
-        style="height: 100%; width: 100%"
-      >
-        <div
-          :style="[
-            { background: 'url( ' + image + ') no-repeat' },
-            { backgroundSize: 'cover' },
-          ]"
-          style="height: 100%; width: 100%"
-        ></div>
-      </el-carousel-item>
-    </el-carousel>
-    <el-form
-      ref="loginForm"
-      :model="loginForm"
-      :rules="loginRules"
-      class="login-form"
-    >
-      <h3 class="title">
-        {{ loginForm.title ? loginForm.title : "数智檩云MOM系统" }}
-      </h3>
-      <el-form-item prop="enterpriseName" style="display: none">
-        <el-input
-          v-model="loginForm.enterpriseName"
-          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="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="密码"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="password"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="code" v-if="captchaOnOff">
-        <el-input
-          v-model="loginForm.code"
-          auto-complete="off"
-          placeholder="验证码"
-          style="width: 63%"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon
-            slot="prefix"
-            icon-class="validCode"
-            class="el-input__icon input-icon"
-          />
-        </el-input>
-        <div class="login-code">
-          <img :src="codeUrl" @click="getCode" class="login-code-img" />
-        </div>
-      </el-form-item>
-      <el-checkbox
-        v-model="loginForm.rememberMe"
-        style="margin: 0px 0px 25px 0px"
-        >记住密码</el-checkbox
-      >
-      <div style="float: right" v-if="register">
-        <router-link class="link-type" :to="'/register'">立即注册</router-link>
-      </div>
-      <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 class="el-login-footer">
-      <span>Copyright © 2021-2023 kezhitt.cn All Rights Reserved.</span>
-    </div>
-  </div>
-</template>
-
-<script>
-import { getCodeImg } from "../api/login";
-import Cookies from "~../../js-cookie";
-import { encrypt, decrypt } from "../utils/jsencrypt";
-import { getWebConfig } from "../utils/utils";
-
-export default {
-  name: "Login",
-  data() {
-    return {
-      codeUrl: "",
-      cookiePassword: "",
-      loginForm: {
-        enterpriseName: "",
-        userName: "",
-        password: "",
-        rememberMe: false,
-        code: "",
-        uuid: "",
-        title: "",
-      },
-      loginRules: {
-        enterpriseName: [
-          { required: true, trigger: "blur", message: "请输入您的企业账号" },
-        ],
-        userName: [
-          { required: true, trigger: "blur", message: "请输入您的员工账号" },
-        ],
-        password: [
-          { required: true, trigger: "blur", message: "请输入您的密码" },
-        ],
-        code: [{ required: true, trigger: "change", message: "请输入验证码" }],
-      },
-      loading: false,
-      // 验证码开关
-      captchaOnOff: true,
-      // 注册开关
-      register: false,
-      redirect: undefined,
-
-      imgs: [],
-    };
-  },
-  watch: {
-    $route: {
-      handler: function (route) {
-        this.redirect = route.query && route.query.redirect;
-      },
-      immediate: true,
-    },
-  },
-  created() {
-    localStorage.clear();
-    let enterpriseName = Cookies.get("enterpriseName");
-    var webConfig = getWebConfig();
-    if (webConfig) {
-      localStorage.setItem("configRes", JSON.stringify(webConfig));
-      if (!enterpriseName) {
-        if (webConfig.tenantName) {
-          this.loginForm.enterpriseName = webConfig.tenantName;
-        } else {
-          // this.loginForm.enterpriseName = "mom";
-        }
-      }
-      if (this.$route.query.tenantName) {
-        this.loginForm.enterpriseName = this.$route.query.tenantName;
-      }
-      if (webConfig.bgImages) {
-        this.imgs = webConfig.bgImages;
-      }
-      if (webConfig.tenantSystemName) {
-        this.loginForm.title = webConfig.tenantSystemName;
-      }
-    }
-    this.getCode();
-    this.getCookie();
-  },
-  methods: {
-    getCode() {
-      getCodeImg().then((res) => {
-        // res = res.data;
-        this.captchaOnOff =
-          res.captchaOnOff === undefined ? true : res.captchaOnOff;
-        if (this.captchaOnOff) {
-          this.codeUrl = "data:image/gif;base64," + res.img;
-          this.loginForm.uuid = res.uuid;
-        }
-      });
-    },
-    getCookie() {
-      let enterpriseName = Cookies.get("enterpriseName");
-      const userName = Cookies.get("userName");
-      const password = Cookies.get("password");
-      const rememberMe = Cookies.get("rememberMe");
-      this.loginForm = {
-        enterpriseName:
-          enterpriseName == undefined
-            ? this.loginForm.enterpriseName
-            : enterpriseName,
-        userName: userName === undefined ? this.loginForm.userName : userName,
-        password:
-          password === undefined ? this.loginForm.password : decrypt(password),
-        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
-      };
-    },
-    handleLogin() {
-      console.log(this.loginForm);
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          localStorage.setItem("systemId", 0);
-          this.loading = true;
-          if (this.loginForm.rememberMe) {
-            Cookies.set("enterpriseName", this.loginForm.enterpriseName, {
-              expires: 30,
-            });
-            Cookies.set("userName", this.loginForm.userName, {
-              expires: 30,
-            });
-            Cookies.set("password", encrypt(this.loginForm.password), {
-              expires: 30,
-            });
-            Cookies.set("rememberMe", this.loginForm.rememberMe, {
-              expires: 30,
-            });
-          } else {
-            // Cookies.remove("enterpriseName");
-            Cookies.remove("userName");
-            Cookies.remove("password");
-            Cookies.remove("rememberMe");
-          }
-          this.$store
-            .dispatch("Login", this.loginForm)
-            .then(() => {
-              this.$router
-                .push({
-                  path: this.redirect || "/",
-                  query: {
-                    tenantName: this.$route.query.tenantName,
-                  },
-                })
-                .catch(() => {});
-            })
-            .catch(() => {
-              this.loading = false;
-              if (this.captchaOnOff) {
-                this.getCode();
-              }
-            });
-        }
-      });
-    },
-  },
-};
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-.login {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  // background-image: url("~../assets/images/login-background.jpg");
-  background-color: #4682b4;
-  background-size: cover;
-}
-
-.title {
-  margin: 0 auto 30px auto;
-  text-align: center;
-  color: #707070;
-}
-
-.login-form {
-  z-index: 999;
-  border-radius: 6px;
-  background: #ffffff94;
-  width: 400px;
-  padding: 25px 25px 5px 25px;
-
-  .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;
-}
-
-.login-code {
-  width: 33%;
-  height: 38px;
-  float: right;
-
-  img {
-    cursor: pointer;
-    vertical-align: middle;
-  }
-}
-
-.el-login-footer {
-  z-index: 999;
-  height: 40px;
-  line-height: 40px;
-  position: fixed;
-  bottom: 0;
-  width: 100%;
-  text-align: center;
-  color: #fff;
-  font-family: Arial, serif;
-  font-size: 12px;
-  letter-spacing: 1px;
-}
-
-.login-code-img {
-  height: 38px;
-}
-</style>