account/micro-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 初始化

Browse Source
This commit is contained in:
jiaojinfeng
2023-05-30 19:27:03 +08:00
commit 28db653900
4436 changed files with 500218 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
packages/icpx-crowncad/.env Normal file
View File

3
packages/icpx-crowncad/.env.development Normal file
View File

@ -0,0 +1,3 @@
VITE_CAD_URL = http://10.0.32.121:8099
VITE_CAD_CLIENTID = 9db5d924783f55ec
VITE_CAD_SECRET = 63c64f64c0887e2ea02c50c9

3
packages/icpx-crowncad/.env.production Normal file
View File

@ -0,0 +1,3 @@
VITE_CAD_URL = http://10.0.32.121:8099
VITE_CAD_CLIENTID = 9db5d924783f55ec
VITE_CAD_SECRET = 63c64f64c0887e2ea02c50c9

25
packages/icpx-crowncad/.gitignore vendored Normal file
View File

@ -0,0 +1,25 @@
# 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?
/.history/

3
packages/icpx-crowncad/.vscode/extensions.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
}

18
packages/icpx-crowncad/README.md Normal file
View File

@ -0,0 +1,18 @@
# Vue 3 + TypeScript + Vite
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
## Recommended IDE Setup
- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
## Type Support For `.vue` Imports in TS
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
1. Disable the built-in TypeScript Extension
1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.

13
packages/icpx-crowncad/index.html Normal file
View File

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CrownCAD</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

25
packages/icpx-crowncad/package.json Normal file
View File

@ -0,0 +1,25 @@
{
"name": "vite-project",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vue-tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"less": "^4.1.3",
"vue": "^3.2.45",
"vue-router": "^4.0.14",
"vuex": "~4.0.2",
"wujie-vue3": "^1.0.0-rc.24"
},
"devDependencies": {
"@types/node": "^18.11.18",
"@vitejs/plugin-vue": "^4.0.0",
"typescript": "^4.9.3",
"vite": "^4.0.0",
"vue-tsc": "^1.0.11"
}
}

1
packages/icpx-crowncad/public/vite.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
packages/icpx-crowncad/src/App.vue Normal file
View File

@ -0,0 +1,6 @@
<template>
<RouterView></RouterView>
</template>
<script setup lang="ts"></script>
<style scoped></style>

40
packages/icpx-crowncad/src/api/crownCAD/crownCAD.ts Normal file
View File

@ -0,0 +1,40 @@
import request from '@/utils/request';
/**
* iframe嵌入链接，在线打开文档
* @param params
* @returns 重定向的页面
*/
export function embedCAD(params = {}) {
return request.get<any>('/thirdparty/embed', {
params,
});
}
/**
* 注册第三方平台用户到CrownCAD
* @param params
* @returns 返回用户名
*/
export async function thirdpartyRegister(params = {}) {
return request('/thirdparty/register', {
method: 'POST',
data: {
...params,
},
});
}
/**
* 通过用户名获取到用户授权码-Token
* @param params
* @returns 返回用户名
*/
export async function thirdpartyToken(params = {}) {
return request('/thirdparty/token', {
method: 'POST',
data: {
...params,
},
});
}

1
packages/icpx-crowncad/src/assets/vue.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 496 B

23
packages/icpx-crowncad/src/main.ts Normal file
View File

@ -0,0 +1,23 @@
// import Vue from 'vue'
import { createApp } from 'vue';
import './style.css';
import App from './App.vue';
const app = createApp(App);
import router from './router/index.js';
import WujieVue from 'wujie-vue3';
console.log(app);
// app.directive('focus',{ //全局注册自定义指令
// // 将绑定的元素插入到DOM中
// mounted : function(el){
// // 聚焦元素
// el.focus()
// }
// })
// vue3全局注册组件的写法
// 在vue2中是将Vue.user(router)写到routers文件夹的index.js中，v3不是
app.use(router).use(WujieVue).mount('#app'); //使用，替换new Vue
// new Vue({ vue2中的写法
// router,
// render: h => h(App),
// }).$mount('#app')

24
packages/icpx-crowncad/src/router/index.ts Normal file
View File

@ -0,0 +1,24 @@
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router';
// import route from 'route';
// 路由配置信息
const routes = [
{ path: '/', redirect: './crownCAD' },
{
path: '/crownCAD',
name: 'crownCAD',
// packages\icpx-crowncad\src\views\crownCAD\index.vue
component: () => import('@/views/crownCAD/index.vue'),
},
];
// 创建路由
const router = createRouter({
history: createWebHashHistory(),
routes,
});
router.beforeEach((to, from, next) => {
next();
});
export default router;

4
packages/icpx-crowncad/src/style.css Normal file
View File

@ -0,0 +1,4 @@
* {
margin: 0;
padding: 0;
}

55
packages/icpx-crowncad/src/utils/commonMethonds.ts Normal file
View File

@ -0,0 +1,55 @@
import { thirdpartyRegister, thirdpartyToken } from '@/api/crownCAD/crownCAD';
// 授权码初始化
export const clientId = import.meta.env.VITE_CAD_CLIENTID;
export const clientSecret = import.meta.env.VITE_CAD_SECRET;
/**
* 注册第三方平台用户到CrownCAD
* /thirdparty/register
* @param userName 第三方平台用户名，应该从登录用户名获取，去与第三方数据对接，暂时先写死
* @param phoneNumber 第三方平台手机号
* @param clientID 应用授权 ID
* @param clientSecret 应用授权 Secret
*/
const userName = 'user1';
const registerFun = async () => {
try {
const { data } = await thirdpartyRegister({
userName,
phoneNumber: '18567897654',
clientID: clientId,
clientSecret: clientSecret,
});
if (data.data && data.data === '用户已绑定') {
return userName;
} else {
data;
}
} catch (e) {
return userName;
}
};
/**
* 获取用户授权码
* /thirdparty/token
* @param userName 注册完成后的 第三方平台用户名
* @param clientID 应用授权 ID
* @param clientSecret 应用授权 Secret
*/
export const getThirdToken = async () => {
try {
const tUserName = await registerFun();
const { data } = await thirdpartyToken({
userName: tUserName,
clientID: clientId,
clientSecret: clientSecret,
});
return data.data;
} catch (e) {
return false;
}
};

9
packages/icpx-crowncad/src/utils/local-storage.ts Normal file
View File

@ -0,0 +1,9 @@
import store from 'store';
import expirePlugin from 'store/plugins/expire';
// plugin usage:
store.addPlugin(expirePlugin);
export { store as localStorage };
export default store;

9
packages/icpx-crowncad/src/utils/request.ts Normal file
View File

@ -0,0 +1,9 @@
import axios from 'axios';
const request = axios.create({
// API 请求的默认前缀
baseURL: import.meta.env.VITE_CAD_URL,
timeout: 30 * 1000, // 请求超时时间
});
export default request;

22
packages/icpx-crowncad/src/utils/request2.ts Normal file
View File

@ -0,0 +1,22 @@
import type { AxiosRequestConfig, AxiosError } from 'axios';
import axios, { AxiosResponse } from 'axios';
// import { baseParams, getInfo, ICP_CONFIG } from './commMethods';
// 这里是用于设定请求后端时，所用的 Token KEY
// 可以根据自己的需要修改，常见的如 Access-Token，Authorization
// 需要注意的是，请尽量保证使用中横线`-` 来作为分隔符，
// 避免被 nginx 等负载均衡器丢弃了自定义的请求头
export const REQUEST_TOKEN_KEY = 'Authorization';
const request = axios.create({
// API 请求的默认前缀
baseURL: import.meta.env.VITE_CAD_URL,
timeout: 30 * 1000, // 请求超时时间
});
// token 获取用户授权码 接口返回的token /thirdparty/token
const token =
'eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJ1c2VyMSIsImNyZWF0ZWQiOjE2NzM5NDU5Mjk0MjAsImV4cCI6MTY3NDU1MDcyOX0.AiKJTzjQIHLybD_pGpImSgH8qJB_B5qtAeGJfuHBHF2rcXiVAWWhCoszXdXWEICLQhqg9fsvrDqbpj_NQjf0xw';
export default request;

64
packages/icpx-crowncad/src/views/components/cadPreview.vue Normal file
View File

@ -0,0 +1,64 @@
<template>
<div class="ifrme-wrapper" v-if="fetchUrl">
<wujie-vue :name="documentId" :url="fetchUrl"></wujie-vue>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({
name: 'crownCAD',
props: {
// documentId: 当前项目创建的文档ID。必传
documentId: { require: true, type: String, default: '63c663540d10c22256d76257' },
// accessToken: 权限校验token。必传
accessToken: {
require: true,
type: String,
default: '',
},
// write: write 为 true，则此链接具备当前文档的编辑权限，write 为 false，则此链接只具备只读权限。非必传
write: {
type: Boolean,
default: false,
},
// theme: 设置主题。非必传
theme: {
type: Number,
default: 1,
},
// token: token 与实测数据接口相关，如果使用实测数据接口，token 需要传入一个 UUID 字符串。（多人合作编辑时候才会用到此参数）。非必传
token: {
type: String,
default: '',
},
},
setup(props) {
const cadbaseUrl = ref(import.meta.env.VITE_CAD_URL);
// 获取接口重定向后的 url
const fetchUrl = ref('');
const link = `${cadbaseUrl.value}/thirdparty/embed?documentId=${props.documentId}&access_token=${props.accessToken}&write=${props.write}&theme=${props.theme}&token=${props.token}`;
const xhr = new XMLHttpRequest();
xhr.open('GET', link, true);
xhr.onload = function () {
fetchUrl.value = xhr.responseURL;
};
xhr.send(null);
return {
cadbaseUrl,
fetchUrl,
};
},
});
</script>
<style lang="less" scoped>
.ifrme-wrapper {
width: 99vw;
height: 99vh;
iframe {
width: 100%;
height: 100%;
}
}
</style>

36
packages/icpx-crowncad/src/views/crownCAD/index.vue Normal file
View File

@ -0,0 +1,36 @@
<template>
<div>
<cadPreview
:documentId="documentsId"
:accessToken="tokenTes"
:write="false"
v-if="tokenTes"
></cadPreview>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
import { getThirdToken } from '@/utils/commonMethonds';
import cadPreview from '@/views/components/cadPreview.vue';
export default defineComponent({
components: { cadPreview },
name: 'crownCAD',
setup() {
//TODO： documentsId 目前需要通过项目去创建文档，并生成对应的文档ID
// 或者通过调用新建文档接口
// 也可以直接通过调用 /thirdparty/inventory 进入项目，进行创建
const documentsId = ref('63dcce4e13f6f37d0f7c4ba4');
// accessToken 从 /thirdparty/token 接口返回值中取到
const tokenTes = ref();
getThirdToken().then((res: string) => {
tokenTes.value = res;
});
return {
tokenTes,
documentsId,
};
},
});
</script>
<style lang="less" scoped></style>

1
packages/icpx-crowncad/src/vite-env.d.ts vendored Normal file
View File

@ -0,0 +1 @@
/// <reference types="vite/client" />

18
packages/icpx-crowncad/tsconfig.json Normal file
View File

@ -0,0 +1,18 @@
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"module": "ESNext",
"moduleResolution": "Node",
"strict": true,
"jsx": "preserve",
"resolveJsonModule": true,
"isolatedModules": true,
"esModuleInterop": true,
"lib": ["ESNext", "DOM"],
"skipLibCheck": true,
"noEmit": true
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"references": [{ "path": "./tsconfig.node.json" }]
}

9
packages/icpx-crowncad/tsconfig.node.json Normal file
View File

@ -0,0 +1,9 @@
{
"compilerOptions": {
"composite": true,
"module": "ESNext",
"moduleResolution": "Node",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.ts"]
}

20
packages/icpx-crowncad/vite.config.ts Normal file
View File

@ -0,0 +1,20 @@
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
// 这里就是需要配置resolve里的别名
'@': path.resolve(__dirname, './src'), // path记得引入
},
},
server: {
host: true,
port: 4002,
// 开启跨域
cors: true,
},
});