Merge branch 'dev' of http://39.101.188.84:8000/suzhou-jichuang-lanhai/volunteer-pc into dev

package.json

@@ -56,6 +56,7 @@
     "screenfull": "5.0.2",
     "sortablejs": "1.10.2",
     "vue": "2.6.12",
+    "vue-3d-model": "^1.4.1",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
     "vue-meta": "2.4.0",

src/permission.js

@@ -1,56 +1,59 @@
-import router from './router'
-import store from './store'
-import { Message } from 'element-ui'
-import NProgress from 'nprogress'
-import 'nprogress/nprogress.css'
-import { getToken } from '@/utils/auth'
-import { isRelogin } from '@/utils/request'
+import router from "./router";
+import store from "./store";
+import { Message } from "element-ui";
+import NProgress from "nprogress";
+import "nprogress/nprogress.css";
+import { getToken } from "@/utils/auth";
+import { isRelogin } from "@/utils/request";
 
-NProgress.configure({ showSpinner: false })
+NProgress.configure({ showSpinner: false });
 
-const whiteList = ['/login', '/register']
+const whiteList = ["/login", "/register", "/3dmodel"];
 
 router.beforeEach((to, from, next) => {
-  NProgress.start()
+  NProgress.start();
   if (getToken()) {
-    to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
+    to.meta.title && store.dispatch("settings/setTitle", to.meta.title);
     /* has token*/
-    if (to.path === '/login') {
-      next({ path: '/' })
-      NProgress.done()
+    if (to.path === "/login") {
+      next({ path: "/" });
+      NProgress.done();
     } else {
       if (store.getters.roles.length === 0) {
-        isRelogin.show = true
+        isRelogin.show = true;
         // 判断当前用户是否已拉取完user_info信息
-        store.dispatch('GetInfo').then(() => {
-          isRelogin.show = false
-          store.dispatch('GenerateRoutes').then(accessRoutes => {
+        store
+          .dispatch("GetInfo")
+          .then(() => {
+            isRelogin.show = false;
+            store.dispatch("GenerateRoutes").then((accessRoutes) => {
               // 根据roles权限生成可访问的路由表
-            router.addRoutes(accessRoutes) // 动态添加可访问路由表
-            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
-          })
-        }).catch(err => {
-            store.dispatch('LogOut').then(() => {
-              Message.error(err)
-              next({ path: '/' })
-            })
+              router.addRoutes(accessRoutes); // 动态添加可访问路由表
+              next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
+            });
           })
+          .catch((err) => {
+            store.dispatch("LogOut").then(() => {
+              Message.error(err);
+              next({ path: "/" });
+            });
+          });
       } else {
-        next()
+        next();
       }
     }
   } else {
     // 没有token
     if (whiteList.indexOf(to.path) !== -1) {
       // 在免登录白名单，直接进入
-      next()
+      next();
     } else {
-      next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
-      NProgress.done()
+      next(`/login?redirect=${encodeURIComponent(to.fullPath)}`); // 否则全部重定向到登录页
+      NProgress.done();
     }
   }
-})
+});
 
 router.afterEach(() => {
-  NProgress.done()
-})
+  NProgress.done();
+});

src/router/index.js

@@ -41,6 +41,11 @@ export const constantRoutes = [
       },
     ],
   },
+  {
+    path: "/3dmodel",
+    component: () => import("@/views/3dmodel"),
+    hidden: true,
+  },
   {
     path: "/login",
     component: () => import("@/views/login"),

src/views/3dmodel.vue

@@ -0,0 +1,86 @@
+<!--
+ * @Author: 张涛
+ * @Date: 2023-10-31 17:28:25
+ * @LastEditors: 张涛
+ * @LastEditTime: 2023-11-01 10:50:27
+ * @FilePath: \volunteer-pc\src\views\3dmodel.vue
+-->
+<template>
+  <div class="page">
+    <!-- src="http://localhost/3dmodel/star.obj" -->
+    <!-- src="https://www.jichuanglanhai.com/demo/3dmodel/2.obj"  -->
+    <model-obj
+      ref="model"
+      src="https://www.jichuanglanhai.com/demo/3dmodel/star.obj"
+      :rotation="rotation"
+      :position="position"
+      :scale="scale"
+      :lights="lights"
+      @on-load="onLoad"
+      :controls-options="{}"
+    />
+  </div>
+</template>
+<script>
+import { ModelObj } from "vue-3d-model";
+
+export default {
+  components: {
+    ModelObj,
+  },
+  data() {
+    return {
+      rotation: {
+        x: 0,
+        y: 0,
+        z: 0,
+      },
+      position: {
+        x: 0,
+        y: 0,
+        z: 0,
+      },
+      scale: {
+        x: 0.5,
+        y: 0.5,
+        z: 0.5,
+      },
+      lights: [
+        {
+          type: "HemisphereLight",
+          position: { x: 0, y: 1, z: 0 },
+          skyColor: 0xffd700,
+          groundColor: 0xffd700,
+          intensity: 0.2,
+        },
+        {
+          type: "DirectionalLight",
+          position: { x: 1, y: 1, z: 1 },
+          color: 0xffffff,
+          intensity: 0.8,
+        },
+      ],
+    };
+  },
+  created() {},
+  methods: {
+    onLoad() {
+      this.rotate();
+    },
+    rotate() {
+      this.rotation.y += 0.01;
+
+      requestAnimationFrame(this.rotate);
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.page {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+</style>