动装一区第一次提交
24
.gitignore
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
3
.vscode/extensions.json
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
|
||||
}
|
||||
10
README.md
Normal file
@ -0,0 +1,10 @@
|
||||
# Vue 3 + TypeScript + Vite
|
||||
# 安装three
|
||||
# npm install three
|
||||
# 动装一区
|
||||
# 内网地址 172.16.2.5:30714
|
||||
# 部署 npm run build
|
||||
# 运行 npm run dev
|
||||
|
||||
# 注意
|
||||
租户id获取的时候改为dzfc
|
||||
13
index.html
Normal file
@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/logo.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>动装一区</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
25
jsconfig.json
Normal file
@ -0,0 +1,25 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "preserve",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src/**/*.js", "src/**/*.vue", "src/main.js"],
|
||||
// "references": [{ "path": "./jsconfig.node.json" }]
|
||||
}
|
||||
2873
package-lock.json
generated
Normal file
26
package.json
Normal file
@ -0,0 +1,26 @@
|
||||
{
|
||||
"name": "my-threejs-vue3",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@types/three": "^0.155.0",
|
||||
"axios": "^1.6.2",
|
||||
"element-plus": "^2.4.1",
|
||||
"mqtt": "^5.3.0",
|
||||
"three": "^0.154.0",
|
||||
"vue": "^3.3.4",
|
||||
"vue-router": "^4.2.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^4.2.3",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.4.0",
|
||||
"vue-tsc": "^1.8.3"
|
||||
}
|
||||
}
|
||||
BIN
public/baojing.png
Normal file
|
After Width: | Height: | Size: 50 KiB |
BIN
public/bg.png
Normal file
|
After Width: | Height: | Size: 422 KiB |
BIN
public/dzyq.glb
Normal file
BIN
public/guanji.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
15
public/index.html
Normal file
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="./logo.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>重装分厂</title>
|
||||
<script type="module" crossorigin src="./assets/index-b2e254b4.js"></script>
|
||||
<link rel="stylesheet" href="./assets/index-c502a728.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
public/kongxian.png
Normal file
|
After Width: | Height: | Size: 45 KiB |
BIN
public/logo.ico
Normal file
|
After Width: | Height: | Size: 8.0 KiB |
BIN
public/logo.png
Normal file
|
After Width: | Height: | Size: 8.0 KiB |
BIN
public/yunxing.png
Normal file
|
After Width: | Height: | Size: 50 KiB |
6
src/App.vue
Normal file
@ -0,0 +1,6 @@
|
||||
<template>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
41
src/api/index.js
Normal file
@ -0,0 +1,41 @@
|
||||
import request from '../utils/request'
|
||||
// const baseUrl ="http://www.67934.cn:30102" //外网地址
|
||||
const baseUrl ="http://172.16.2.5:30714" //本地地址
|
||||
|
||||
|
||||
|
||||
// 登录接口
|
||||
export function login(headers) {
|
||||
return request({
|
||||
url:baseUrl+'/superlink/authapi/jwt/login',
|
||||
method: 'post',
|
||||
headers,
|
||||
data:{}
|
||||
})
|
||||
}
|
||||
// 租户id
|
||||
export function getTenants(headers) {
|
||||
return request({
|
||||
url:baseUrl+'/superlink/api/tenants/dzfc',
|
||||
method: 'get',
|
||||
headers,
|
||||
data:{}
|
||||
})
|
||||
}
|
||||
// 获取token get请求 路径拼接
|
||||
export function getToken(tenantId,headers) {
|
||||
return request({
|
||||
url: baseUrl+`/superlink/authapi/jwt/getToken?tenantId=${tenantId}`,
|
||||
method: 'post',
|
||||
headers:headers,
|
||||
})
|
||||
}
|
||||
// 设备信息
|
||||
export function getMsg(data,headers) {
|
||||
return request({
|
||||
url:baseUrl+'/superlink/api/devices/listDevice',
|
||||
method: 'post',
|
||||
data:data,
|
||||
headers,
|
||||
})
|
||||
}
|
||||
10
src/main.js
Normal file
@ -0,0 +1,10 @@
|
||||
import { createApp } from 'vue'
|
||||
import './style.css'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import elementPlus from 'element-plus'
|
||||
import 'element-plus/dist/index.css'
|
||||
const app = createApp(App)
|
||||
app.use(router)
|
||||
app.use(elementPlus)
|
||||
app.mount('#app')
|
||||
20
src/router/index.js
Normal file
@ -0,0 +1,20 @@
|
||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
redirect: '/home'
|
||||
},
|
||||
{
|
||||
path: "/home",
|
||||
component: () => import('../views/home.vue')
|
||||
},
|
||||
]
|
||||
})
|
||||
|
||||
export default router
|
||||
|
||||
|
||||
|
||||
82
src/style.css
Normal file
@ -0,0 +1,82 @@
|
||||
:root {
|
||||
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
||||
line-height: 1.5;
|
||||
font-weight: 400;
|
||||
|
||||
color-scheme: light dark;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background-color: #242424;
|
||||
|
||||
font-synthesis: none;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: 500;
|
||||
color: #646cff;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
a:hover {
|
||||
color: #535bf2;
|
||||
}
|
||||
p{
|
||||
margin: 0;
|
||||
padding:0;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding:0;
|
||||
text-decoration: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 3.2em;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
button {
|
||||
border-radius: 8px;
|
||||
border: 1px solid transparent;
|
||||
padding: 0.6em 1.2em;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
background-color: #1a1a1a;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.25s;
|
||||
}
|
||||
button:hover {
|
||||
border-color: #646cff;
|
||||
}
|
||||
button:focus,
|
||||
button:focus-visible {
|
||||
outline: 4px auto -webkit-focus-ring-color;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
#app {
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
:root {
|
||||
color: #2e4152;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
a:hover {
|
||||
color: #747bff;
|
||||
}
|
||||
button {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
54
src/utils/index.js
Normal file
@ -0,0 +1,54 @@
|
||||
/**
|
||||
* 鼠标单击高亮
|
||||
*/
|
||||
import * as THREE from 'three'
|
||||
import { FXAAShader } from 'three/examples/jsm/shaders/FXAAShader'
|
||||
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer'
|
||||
import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass'
|
||||
import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass'
|
||||
import { OutlinePass } from 'three/examples/jsm/postprocessing/OutlinePass'
|
||||
import { log } from 'three/examples/jsm/nodes/Nodes.js'
|
||||
|
||||
/* 选中模型的数组 颜色 */
|
||||
/**
|
||||
*
|
||||
* @param {mesh数组} selectedObjects
|
||||
* @param {高亮的颜色} color
|
||||
* @param {scene/camera/renderer} config
|
||||
*/
|
||||
let composer, renderPass, outlinePass, effectFXAA
|
||||
const addColor = ( color, config) => {
|
||||
// 创建一个EffectComposer(效果组合器)对象,然后在该对象上添加后期处理通道。
|
||||
composer = new EffectComposer(config.renderer)
|
||||
console.log("composer",composer);
|
||||
// 新建一个场景通道 为了覆盖到原理来的场景上
|
||||
renderPass = new RenderPass(config.scene, config.camera)
|
||||
composer.addPass(renderPass)
|
||||
|
||||
// 物体边缘发光通道
|
||||
outlinePass = new OutlinePass(new THREE.Vector2(window.innerWidth, window.innerHeight), config.scene, config.camera)
|
||||
|
||||
outlinePass.edgeStrength = 10.0 // 边框的亮度
|
||||
outlinePass.edgeGlow = 1 // 光晕[0,1]
|
||||
outlinePass.usePatternTexture = false // 是否使用父级的材质
|
||||
outlinePass.edgeThickness = 1.0 // 边框宽度
|
||||
outlinePass.downSampleRatio = 2 // 边框弯曲度
|
||||
outlinePass.pulsePeriod = 5 // 呼吸闪烁的速度
|
||||
outlinePass.visibleEdgeColor.set(parseInt(color)) // 呼吸显示的颜色
|
||||
outlinePass.hiddenEdgeColor = new THREE.Color(0, 0, 0) // 呼吸消失的颜色
|
||||
outlinePass.clear = true
|
||||
composer.addPass(outlinePass)
|
||||
|
||||
// 自定义的着色器通道 作为参数
|
||||
effectFXAA = new ShaderPass(FXAAShader)
|
||||
effectFXAA.uniforms.resolution.value.set(1 / window.innerWidth, 1 / window.innerHeight)
|
||||
effectFXAA.renderToScreen = true
|
||||
composer.addPass(effectFXAA)
|
||||
return {
|
||||
composer, // composer在render循环函数中调用
|
||||
outlinePass // 实例化一次后设置 outlinePass.selectedObjects = selectedObjects
|
||||
}
|
||||
}
|
||||
|
||||
export default addColor
|
||||
|
||||
40
src/utils/request.js
Normal file
@ -0,0 +1,40 @@
|
||||
import axios from 'axios';
|
||||
|
||||
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8';
|
||||
|
||||
|
||||
const request = axios.create({
|
||||
// axios中请求配置有baseURL选项,表示请求URL公共部分
|
||||
baseURL:'',
|
||||
// baseURL:'http://www.67934.cn:30102/superlink/api',
|
||||
// 超时
|
||||
timeout: 10000,
|
||||
});
|
||||
|
||||
// request拦截器
|
||||
request.interceptors.request.use(
|
||||
(config) => {
|
||||
// 在请求发送之前做些什么
|
||||
// 可以在请求头中添加token等信息
|
||||
return config;
|
||||
},
|
||||
(error) => {
|
||||
// 对请求错误做些什么
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
// response拦截器
|
||||
request.interceptors.response.use(
|
||||
(response) => {
|
||||
// 对响应数据做些什么
|
||||
return response.data;
|
||||
},
|
||||
(error) => {
|
||||
// 对响应错误做些什么
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
export default request;
|
||||
1125
src/views/home.vue
Normal file
11
vite.config.js
Normal file
@ -0,0 +1,11 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
base:'./',
|
||||
plugins: [vue()],
|
||||
server: {
|
||||
host: "0.0.0.0",
|
||||
}
|
||||
})
|
||||