Pārlūkot izejas kodu

添加animate效果

13127578837 1 gadu atpakaļ
vecāks
revīzija
902e91131d

+ 1 - 1
index.html

@@ -311,7 +311,7 @@
                     <div class="object" id="object_one"></div>
                 </div>
                 <div id="loader-wrapper">
-                    <div class="load_title">正在加载系统资源,请耐心等待</div>
+                    <div class="load_title"></div>
                 </div>
             </div>
         </div>

+ 1 - 0
package.json

@@ -23,6 +23,7 @@
         "@vueuse/core": "8.5.0",
         "@wangeditor/editor": "^5.1.15",
         "@wangeditor/editor-for-vue": "^5.1.12",
+        "animate.css": "^4.1.1",
         "axios": "^1.2.2",
         "clipboard": "^2.0.11",
         "dayjs": "^1.11.10",

+ 2 - 1
src/components/layout/index.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="layout">
-        <div class="layout-top">
+        <div class="layout-top animate__animated animate__fadeInUp">
             <div class="layout-top-left" :style="{marginLeft:props.data.logoLeft}">
                 <img src="@/assets/images/logo.png" />
                 <span>共进科技大厦</span>
@@ -59,6 +59,7 @@ function returnPage() {
             float: right;
             margin-right:1.6%;
             text-align: right;
+            cursor: pointer;
             img{
                 width:9%;
                 vertical-align: middle;

+ 2 - 0
src/main.js

@@ -13,6 +13,7 @@ import store from './store'
 import router from './router'
 import directive from './directive' // directive
 import lazyPlugin from 'vue3-lazy'
+import animated from 'animate.css'
 // import './mockjs/index'//mockjs
 
 
@@ -82,6 +83,7 @@ app.use(store)
 app.use(plugins)
 app.use(elementIcons)
 app.use(VueUeditorWrap)
+app.use(animated)
 app.use(lazyPlugin, {
     loading: '/loading.gif',
     error: '/error.png',

+ 42 - 82
src/utils/request.js

@@ -1,6 +1,5 @@
 import axios from 'axios'
 import { ElNotification, ElMessageBox, ElMessage, ElLoading } from 'element-plus'
-// import { getToken } from '@/utils/auth'
 import errorCode from '@/utils/errorCode'
 import { tansParams, blobValidate } from '@/utils/ruoyi'
 import cache from '@/plugins/cache'
@@ -21,49 +20,32 @@ const service = axios.create({
     })
     // request拦截器
 service.interceptors.request.use(config => {
-
-
-//   获取请求头参数
-  const {signature, timestamp, secret} = signatureGenerate(config)
-
-  config.headers['key'] = 'c65ba95718be44a88d69962b66094075'
-  config.headers['sign'] = signature
-  config.headers['timestamp'] = timestamp
-
- 
-    console.log('post请求参数')
-    console.log(config.data)
-
-
-      // 如果存在data,并且我们想替换body
-      if (config.data && config.method.toLowerCase() === 'post') {
+    //获取请求头参数
+    const {signature, timestamp, secret} = signatureGenerate(config)
+    config.headers['key'] = 'c65ba95718be44a88d69962b66094075' //富士接口key
+    config.headers['sign'] = signature //富士接口签名
+    config.headers['timestamp'] = timestamp
+    // console.log('post请求参数')
+    // console.log(config.data)
+    // 如果存在data,并且我们想替换body
+    if (config.data && config.method.toLowerCase() === 'post') {
         // 将数据转换为JSON字符串
         const data = JSON.stringify(config.data);
         // 对数据进行Base64编码
         const base64EncodedData = base64Encode(data);
         // 替换请求体
         config.data = base64EncodedData;
-      }
-
-      
-        function base64Encode(str) {
-            // 先将字符串转换为Latin1编码
-            var latin1Str = unescape(encodeURIComponent(str));
-            // 然后使用btoa进行Base64编码
-            return btoa(latin1Str);
-        }
-
-
-
-
-
+    }
+    function base64Encode(str) {
+        // 先将字符串转换为Latin1编码
+        var latin1Str = unescape(encodeURIComponent(str));
+        // 然后使用btoa进行Base64编码
+        return btoa(latin1Str);
+    }
     // 是否需要设置 token
     const isToken = (config.headers || {}).isToken === false
         // 是否需要防止数据重复提交
     const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
-    if (localStorage.getItem("token725") && !isToken) {
-        config.headers['Authorization'] = localStorage.getItem("token725") // 让每个请求携带自定义token 请根据实际情况自行修改
-    }
     // get请求映射params参数
     if (config.method === 'get' && config.params) {
         let url = config.url + '?' + tansParams(config.params);
@@ -97,17 +79,8 @@ service.interceptors.request.use(config => {
             cache.session.setJSON('sessionObj', requestObj)
         }
     }
-    if (config.url == "/YtIoT/iot/alarm/view/updateHj" ||
-        config.url == "/YtIoT/iot/alarm/view/updateEf" ||
-        config.url == "/YtIoT/iot/alarm/view/updateSj" ||
-        config.url == "/YtIoT/iot/alarm/view/updateRtu" ||
-        config.url == "/YtIoT/iot/alarm/view/updateAlarm" ||
-        config.url == "/YtIoT/iot/frontpage/getCurrentObjectListByCompanyId" ||
-        config.url == "/YtIoT/iot/frontpage/getCurrentStatus") { //消防互联网大屏
-        config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
-    } else {
-        config.headers['Content-Type'] = 'application/json;charset=utf-8'
-    }
+    config.headers['Content-Type'] = 'application/json;charset=utf-8'
+    
     return config
 }, error => {
     Promise.reject(error)
@@ -115,52 +88,39 @@ service.interceptors.request.use(config => {
 
 // 响应拦截器
 service.interceptors.response.use(res => {
-        if (res.data.chk) { //安博展撒点 c++   还
+        // 未设置状态码则默认成功状态
+        const code = res.data.status;
+        // 获取错误信息
+        const msg = errorCode[code] || res.data.msg || errorCode['default']
+            // 二进制数据则直接返回
+        if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
             return res.data
-        } else if (res.data.action == "updateHj" ||
-            res.data.action == "updateEf" ||
-            res.data.action == "updateSj" ||
-            res.data.action == "updateRtu" ||
-            res.data.action == "updateAlarm" ||
-            res.data.action == "getCurrentObjectListByCompanyId" ||
-            res.data.action == "getCurrentStatus"
-        ) { //告警处理
+        }
+        if (code == "SUCCESS" || res.data.msg == "操作成功") {
+            return res.headers['content-type'].indexOf("application/vnd.ms-excel") != -1 ? res : res.data
+        } else if (res.data.code == 0) { //系统监控=>定时任务
             return res.data
         } else {
-            // 未设置状态码则默认成功状态
-            const code = res.data.status;
-            // 获取错误信息
-            const msg = errorCode[code] || res.data.msg || errorCode['default']
-                // 二进制数据则直接返回
-            if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
-                return res.data
-            }
-            if (code == "SUCCESS" || res.data.msg == "操作成功") {
-                return res.headers['content-type'].indexOf("application/vnd.ms-excel") != -1 ? res : res.data
-            } else if (res.data.code == 0) { //系统监控=>定时任务
-                return res.data
+            if (res.data.code == "401") {
+                return Promise.reject('无效的会话,或者会话已过期,请重新登录。')
+            } else if (res.data.code === 500) {
+                ElMessage({
+                    message: msg,
+                    type: 'error'
+                })
+                return msg && Promise.reject(new Error(msg)) || ""
+            } else if (res.data.code !== 0) {
+                ElNotification.error({
+                    title: msg
+                })
+                return Promise.reject('error')
             } else {
-                if (res.data.code == "401") {
-                    return Promise.reject('无效的会话,或者会话已过期,请重新登录。')
-                } else if (res.data.code === 500) {
-                    ElMessage({
-                        message: msg,
-                        type: 'error'
-                    })
-                    return msg && Promise.reject(new Error(msg)) || ""
-                } else if (res.data.code !== 0) {
-                    ElNotification.error({
-                        title: msg
-                    })
-                    return Promise.reject('error')
-                } else {
 
-                }
             }
         }
     },
     error => {
-        let message = error.response.data.msg;
+        let message = error?.response?.data?.msg || "";
         if (message == "Network Error") {
             message = "后端接口连接异常";
         } else if (message.includes("timeout")) {

+ 1 - 7
src/utils/signatureUtil.js

@@ -1,14 +1,10 @@
 // signatureUtil.js
 import md5 from "js-md5";
 export function signatureGenerate({ data, url, headers }) {
-
   // 密钥
-  let secret = "3g7Xn1yl";
+  let secret = "3g7Xn1yl";//富士secret
   // 时间戳
   let timestamp = new Date().getTime();
-
-
-
   // post参数
   let dataStr = dataSerialize(dataSort(data));
   // console.log("签名部分,排序后的请求参数");
@@ -48,8 +44,6 @@ function dataSerialize(sortObj) {
 
     }
   }
-
-// console.log(strJoin)
   return strJoin;
 }
 

+ 3 - 3
src/views/fillIn.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container fillIn">
-    <div class="fillIn-contain">
+    <div class="fillIn-contain animate__animated animate__fadeInUp">
       <p style="color: red; margin-bottom: 2%; font-size: 1.5rem">
         * 访客基本信息由身份证读卡器自动获取,请确保信息准确无误
       </p>
@@ -228,7 +228,7 @@ function getData() {
         form.value.identityCardNo = response.data.Certificate.IDNumber;
       })
       .catch((error) => {});
-  }, 1000);
+  }, 3000);
 }
 
 /** 新增访客表单提交 */
@@ -313,7 +313,7 @@ function departChange(val) {
 }
 
 onMounted(() => {
-  //getData();
+  getData();
   getDepartData();
 });
 

+ 2 - 3
src/views/index.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="app-container home">
     <div class="home-contain">
-      <div class="home-contain-middle">
+      <div class="home-contain-middle animate__animated animate__zoomIn">
         <img src="@/assets/images/middle-bg.jpg">
       </div>
       <div class="home-contain-bottom">
-        <div class="home-contain-bottom-list">
+        <div class="home-contain-bottom-list animate__animated animate__slideInUp">
           <router-link to="/list">
             <img src="@/assets/images/yuyue.png">
             <span>访客预约</span>
@@ -37,7 +37,6 @@ import layout from "@/components/layout/index.vue";
       z-index: 1;
       margin:5.6% 17.1% 0;
       img{
-        // width:100%;
         max-height:100%;
       }
     }

+ 4 - 4
src/views/list.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="app-container home">
     <div class="home-contain">
-      <div class="home-contain-middle">
+      <div class="home-contain-middle animate__animated animate__zoomIn">
         <img src="@/assets/images/middle-bg.jpg">
       </div>
       <div class="home-contain-bottom">
-        <div class="home-contain-bottom-list" @click="officialAccountState =!officialAccountState">
+        <div class="home-contain-bottom-list animate__animated animate__fadeInLeft" @click="officialAccountState =!officialAccountState">
             <img src="@/assets/images/tianbao.png">
             <span>访客登记</span>
         </div>
-        <div class="home-contain-bottom-list">
+        <div class="home-contain-bottom-list animate__animated animate__fadeInRight">
           <router-link to="/validate">
             <img src="@/assets/images/heyan.png">
             <span>邀约码查验</span>
@@ -19,7 +19,7 @@
     </div>
   </div>
   <layout :data="{logoLeft:'17.2%',returnState:true}"/>
-  <officialAccount v-if="officialAccountState" @changeStage="changeStage"/>
+  <officialAccount v-if="officialAccountState" @changeStage="changeStage" class="animate__animated animate__fadeIn"/>
 </template>
 
 <script setup name="Index">