新疆纤检项目总结

使用技术

vue2.0 + element + axios + vue-router + vuex + pdf.js

项目概要

新疆维吾尔自治区纤维质量监测中心的一个用来管理培训的项目
从用户的角度来说一共有两种：管理人员和用户（用户分为企业用户和个人用户）主要的功能是对用户进行培训开班，可以理解为一个报名系统。还有一些附带的功能。

• 培训管理系统
• 知识库
• 信用平台
• 统一登录平台

培训管理系统

普通管理系统 O(∩_∩)O哈哈~

• 系统管理
  • 菜单管理
  • 角色管理
  • 用户管理
  • 资源分配
• 首页
• 培训管理
• 班级管理
• 证书管理
• 订单管理
• 财务管理

通过角色分配不同的菜单，进入对应的角色页面

知识库

知识库分页用户查看页面和后台页面

• 后台

• 首页
• 标准管理
  • 全部标准
  • 录入标准
  • 分类
  • 回收站

• 查看页面
  主要功能

• 查看后台增加的标准
• 查看pdf这里有个查看pdf并且不让下载打印，使用到pdf.js，然后再插件里面通过js控制不让打印

  <script type="text/javascript">
        // function stop() {
        //   return false;
        // }
        // document.oncontextmenu = stop;
  
        const disabled = () => {
          // console.log('禁止脚本，运行成功');
          const config = {
            rightKey: false, // 是否开启右键菜单
            controller: false, // 是否开启控制台
            print: false, // 是否允许打印
            savePage: false, // 是否允许 ctrl + s 保存网页 乌发禁用菜单保存
          };
  
          function loadStyleString(cssText) {
            var style = document.createElement("style");
            style.type = "text/css";
            try {
              // firefox、safari、chrome和Opera
              style.appendChild(document.createTextNode(cssText));
            } catch (ex) {
              // IE早期的浏览器 ,需要使用style元素的stylesheet属性的cssText属性
              style.styleSheet.cssText = cssText;
            }
            document.getElementsByTagName("head")[0].appendChild(style);
          }
  
          // disabeld
          // 禁用部分功能
          // 右键禁用
          if (!config.rightKey) document.oncontextmenu = () => false;
          // 打印
          if (!config.print) {
            let cssIndex = Array(...document.styleSheets).findIndex(
              (item) => item.href == null
            );
            // 禁止打印 添加媒体查询 css 打印时隐藏所有内容
            loadStyleString(`
                  @media print {
                      body {
                          display: none;
                      }
                      html::after {
                          content: "禁止打印!";
                          position: absolute;
                          top: 0;
                          left: 0;
                          width: 100%;
                          height: 100%;
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-size: 80px;
                          letter-spacing: 15px;
                          color: brown;
                      }
                  }
              `);
          }
  
          // 禁用 ctrl + s 和 F12 控制台
          window.addEventListener(
            "keydown",
            function (e) {
              if (e.keyCode == 123 && !config.controller) {
                e.preventDefault();
                return false;
                // alert('禁止打开控制台')
              }
              //可以判断是不是mac，如果是mac,ctrl变为花键
              //event.preventDefault() 方法阻止元素发生默认的行为。
              if (
                e.keyCode == 83 &&
                (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey) &&
                !config.savePage
              ) {
                e.preventDefault();
                return false;
                // Process event...
                // alert('禁止保存网页')
              }
            },
            false
          );
  
          // 控制台
          if (!config.controller) {
            var threshold = 200;
            var widthThreshold =
              window.outerWidth - window.innerWidth > threshold;
            var heightThreshold =
              window.outerHeight - window.innerHeight > threshold;
            function exit() {
              loadStyleString(`
                          body {
                              display: none;
                          }
                          html::after {
                              content: "请关闭控台，并F5重新刷新页面!";
                              position: absolute;
                              top: 0;
                              left: 0;
                              width: 100%;
                              height: 100%;
                              display: flex;
                              align-items: center;
                              justify-content: center;
                              font-size: 50px;
                              letter-spacing: 15px;
                              color: brown;
                          }
                  `);
            }
            //
            (function () {
              var re = /x/;
              var i = 0;
              console.log(re);
              re.toString = function () {
                exit();
              };
            })();
            //
            if (widthThreshold || heightThreshold) {
              exit();
            }
          }
        };
  
        window.addEventListener("load", disabled);
      </script>

信用平台

主要就是增删改，上传一些企业用户的基础信息

项目感受

还是比较简单的项目，以后还是想挑战难一点的东西。不想再写业务逻辑了。。。。。。只接触到dpf.js禁止打印一个新东西

function set(){
  console.log(1);
  setTimeout(() => {
    console.log(2)
  },0)
  new Promise((reolve) => {
    console.log(3)
    reolve()
  }).then(() => {
    console.log(4);
  })
}