common.ts 26 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079
  1. import { reactive, ref } from 'vue';
  2. import { MessagePlugin } from 'tdesign-vue-next';
  3. import localforage from 'localforage';
  4. import dayjs from 'dayjs';
  5. import axios from 'axios';
  6. import router from '@/router/index';
  7. import { useUser } from '@/services/user';
  8. import { showNotification, Meta2dBackData, checkData } from '@/services/utils';
  9. import { noLoginTip, localStorageName } from '@/services/utils';
  10. import { upload, dataURLtoBlob } from '@/services/file';
  11. import { delImage, addCollection, updateCollection, getLe5leV } from '@/services/api';
  12. import { baseVer } from '@/services/upgrade';
  13. import { debounce } from './debouce';
  14. import { deepClone, isDomShapes } from '@meta2d/core';
  15. import { useSelection } from '@/services/selections';
  16. import { rootDomain } from './defaults';
  17. import { updateObject } from './object';
  18. const { select } = useSelection();
  19. const assets = reactive({
  20. home: `https://${rootDomain.slice(1)}`,
  21. account: `https://account${rootDomain}',`,
  22. '3d': `https://3d${rootDomain}`,
  23. '2d': `https://2d${rootDomain}`,
  24. helps: [
  25. {
  26. name: '产品介绍',
  27. url: `https://doc${rootDomain}/document/118756411`,
  28. },
  29. {
  30. name: '快速上手',
  31. url: `https://doc${rootDomain}/document/119363000`,
  32. },
  33. {
  34. name: '使用手册',
  35. url: `https://doc${rootDomain}/document/118764244`,
  36. },
  37. {
  38. name: '快捷键',
  39. url: `https://doc${rootDomain}/document/119620214`,
  40. divider: true,
  41. },
  42. {
  43. name: '企业服务与支持',
  44. url: `https://doc${rootDomain}/document/119296274`,
  45. divider: true,
  46. },
  47. {
  48. name: '关于我们',
  49. url: `https://${rootDomain.slice(1)}/about.html`,
  50. },
  51. ],
  52. });
  53. export const useAssets = () => {
  54. const getAssets = async () => {
  55. // 官网或安装包版本
  56. // if (import.meta.env.VITE_TRIAL != 1) {
  57. // return;
  58. // }
  59. // 企业版
  60. const ret = await axios.get('/api/assets');
  61. if (ret) {
  62. Object.assign(assets, ret);
  63. }
  64. };
  65. return {
  66. assets,
  67. getAssets,
  68. };
  69. };
  70. const meta2dData = reactive({
  71. name:'新建项目'
  72. });
  73. export const useMeta2dData = () => {
  74. const getMeta2dData = async () => {
  75. return meta2dData;
  76. };
  77. const setMeta2dData = async (data:any) => {
  78. for(const key in data){
  79. meta2d.store.data[key] = data[key];
  80. }
  81. updateObject(meta2dData, data);
  82. };
  83. return {
  84. meta2dData,
  85. getMeta2dData,
  86. setMeta2dData,
  87. };
  88. };
  89. const dot = ref(false);
  90. export const useDot = () => {
  91. const getDot = async () => {
  92. return dot;
  93. };
  94. const setDot = async (value = true) => {
  95. dot.value = value;
  96. if (value) {
  97. tree.patch = true;
  98. debounce(autoSave, 3000);
  99. }
  100. };
  101. return {
  102. dot,
  103. getDot,
  104. setDot,
  105. };
  106. };
  107. const { user } = useUser();
  108. export enum SaveType {
  109. Save,
  110. SaveAs,
  111. }
  112. let saveTimer: any = 0;
  113. let saveFlag: boolean = true;
  114. export const _save = async (
  115. type: SaveType = SaveType.Save,
  116. vType?: string,
  117. notice?: boolean
  118. ) => {
  119. if (!saveFlag) {
  120. return;
  121. }
  122. if (saveTimer) {
  123. clearTimeout(saveTimer);
  124. }
  125. saveFlag = false;
  126. saveTimer = setTimeout(() => {
  127. saveFlag = true;
  128. }, 2000);
  129. meta2d.stopAnimate();
  130. const data: Meta2dBackData = meta2d.data();
  131. if (!(user && user.id)) {
  132. MessagePlugin.warning(noLoginTip);
  133. localforage.setItem(localStorageName, JSON.stringify(data));
  134. return;
  135. }
  136. if (
  137. vType === 'v.component' &&
  138. meta2d.store.active &&
  139. meta2d.store.active.length === 1 &&
  140. meta2d.store.active[0].name === 'combine'
  141. ) {
  142. let comData: any = {
  143. center: data.center,
  144. folder: '',
  145. origin: data.origin,
  146. scale: data.scale,
  147. x: data.x,
  148. y: data.y,
  149. };
  150. let blob: Blob;
  151. try {
  152. blob = dataURLtoBlob(meta2d.activeToPng(10) + '');
  153. } catch (e) {
  154. MessagePlugin.error(
  155. '无法下载,宽度不合法,可能没有选中画笔/选中画笔大小超出浏览器最大限制'
  156. );
  157. return;
  158. }
  159. const file:any = await upload(blob, true);
  160. if (!file) {
  161. return;
  162. }
  163. // 缩略图
  164. comData.image = file.url;
  165. comData.component = true;
  166. const allPens = meta2d.canvas.getAllByPens(meta2d.store.active);
  167. comData.componentDatas = meta2d.toComponent(
  168. allPens,
  169. (meta2d.store.data as Meta2dBackData).showChild,
  170. false
  171. );
  172. comData.name =
  173. (meta2d.store.active[0] as any).description ||
  174. `meta2d.${new Date().toLocaleString()}`;
  175. let ret: any = await addCollection('v.component.', comData); // 新增
  176. if (ret.error) {
  177. return;
  178. }
  179. MessagePlugin.success('成功保存为组件!');
  180. return;
  181. }
  182. checkData(data);
  183. // if (!data._id && router.currentRoute.value.query.id) {
  184. // data._id = router.currentRoute.value.query.id as string;
  185. // }
  186. if (
  187. (globalThis as any).beforeSaveMeta2d &&
  188. !(await (globalThis as any).beforeSaveMeta2d(data))
  189. ) {
  190. return;
  191. }
  192. if (!data.tags.includes('系统模板') && !data.tags.includes('系统方案')) {
  193. if (vType === 'v.template') {
  194. if (data.tags && !data.tags.includes('模板')) {
  195. delete data._id;
  196. delete data.id;
  197. delete data.folder;
  198. }
  199. data.tags = ['模板'];
  200. } else if (!vType) {
  201. if (data.tags && !data.tags.includes('方案')) {
  202. delete data._id;
  203. delete data.id;
  204. delete data.folder;
  205. }
  206. data.tags = ['方案'];
  207. }
  208. }
  209. if (type === SaveType.SaveAs) {
  210. //另存为去掉teams信息
  211. delete data.teams;
  212. delete data.folder;
  213. delete data.id;
  214. }
  215. //如果不是自己创建的团队图纸,就不去修改缩略图(没有权限去删除缩略图)
  216. if (!(data.teams && data.owner?.id !== user.id)) {
  217. for (const pen of meta2d.store.data.pens) {
  218. if (['iframe'].includes(pen.name)) {
  219. //重新生成绘制图片
  220. pen.onRenderPenRaw?.(pen);
  221. }
  222. }
  223. // setTimeout(async () => {
  224. let blob: Blob;
  225. try {
  226. blob = dataURLtoBlob(meta2d.toPng(10) + '');
  227. } catch (e) {
  228. MessagePlugin.error(
  229. '无法下载,宽度不合法,画布可能没有画笔/画布大小超出浏览器最大限制'
  230. );
  231. return;
  232. }
  233. if (data._id && type === SaveType.Save) {
  234. if (data.image && !(await delImage(data.image))) {
  235. return;
  236. }
  237. }
  238. const file:any = await upload(blob, true);
  239. if (!file) {
  240. return;
  241. }
  242. // 缩略图
  243. data.image = file.url;
  244. (meta2d.store.data as Meta2dBackData).image = data.image;
  245. // }, 1000);
  246. }
  247. // setTimeout(async () => {
  248. if (data.component || vType === 'v.component') {
  249. data.component = true;
  250. // pens 存储原数据用于二次编辑 ; componentDatas 组合后的数据,用于复用
  251. data.componentDatas = meta2d.toComponent(
  252. undefined,
  253. (meta2d.store.data as Meta2dBackData).showChild,
  254. false //自定义组合节点生成默认锚点
  255. );
  256. } else {
  257. data.component = false; // 必要值
  258. }
  259. let collection = data.component ? 'v.component' : 'v';
  260. let ret: any;
  261. if (!data.name) {
  262. // 文件名称
  263. data.name = `meta2d.${new Date().toLocaleString()}`;
  264. (meta2d.store.data as Meta2dBackData).name = data.name;
  265. }
  266. !data.version && (data.version = baseVer);
  267. // TODO
  268. if (!data.folder) {
  269. data.folder = ''; // folder.name;
  270. }
  271. let _list: any = undefined;
  272. let _folderId: any = undefined;
  273. if (data.folder) {
  274. if (!folder._id) {
  275. let type = vType;
  276. if (!type) {
  277. type = 'v';
  278. }
  279. let folderRet: any = await axios.post('/api/data/folders/get', {
  280. query: {
  281. type,
  282. name: data.folder,
  283. },
  284. });
  285. if (!folderRet.error) {
  286. _list = folderRet.list;
  287. _folderId = folderRet._id;
  288. }
  289. } else {
  290. _list = folder.list;
  291. _folderId = folder._id;
  292. }
  293. }
  294. let _temType = '';
  295. if (type === SaveType.SaveAs) {
  296. // 另存为一定走 新增 ,由于后端 未控制 userId 等属性,清空一下
  297. for (const k of delAttrs) {
  298. delete (data as any)[k];
  299. }
  300. if (!data.tags || !data.tags.length) {
  301. data.tags = ['方案'];
  302. }
  303. ret = await addCollection(collection, data);
  304. } else {
  305. // if (data._id && data.teams && data.owner?.id !== user.id) {
  306. // // 团队图纸 不允许修改文件夹信息
  307. // delete data.folder;
  308. // ret = await updateCollection(collection, data);
  309. // } else
  310. if (data._id) {
  311. ret = await updateCollection(collection, data);
  312. _temType = 'update';
  313. } else {
  314. ret = await addCollection(collection, data); // 新增
  315. _temType = 'add';
  316. }
  317. }
  318. if (ret.error) {
  319. return;
  320. }
  321. if (_folderId) {
  322. if (_temType === 'add') {
  323. //文件夹
  324. _list.push({
  325. image: data.image,
  326. name: data.name,
  327. _id: ret._id,
  328. });
  329. } else if (_temType === 'update') {
  330. _list.forEach((i: any) => {
  331. if (i._id === data._id) {
  332. i.image = data.image;
  333. i.name = data.name;
  334. }
  335. });
  336. }
  337. await axios.post('/api/data/folders/update', {
  338. _id: _folderId,
  339. list: _list.map((el) => {
  340. return {
  341. name: el.name,
  342. id: el.id,
  343. _id: el._id,
  344. image: el.image,
  345. component: el.component,
  346. };
  347. }),
  348. });
  349. }
  350. // 保存图纸之后的钩子函数
  351. globalThis.afterSaveMeta2d && (await globalThis.afterSaveMeta2d(ret));
  352. if (
  353. !data._id ||
  354. data.owner?.id !== user.id ||
  355. router.currentRoute.value.query.version ||
  356. type === SaveType.SaveAs // 另存为肯定走新增,也会产生新的 id
  357. ) {
  358. data.id = ret.id;
  359. (meta2d.store.data as Meta2dBackData).id = data.id;
  360. router.replace({
  361. path: '/',
  362. query: {
  363. id: data.id,
  364. r: Date.now() + '',
  365. c: data.component ? 1 : undefined,
  366. },
  367. });
  368. }
  369. notice && MessagePlugin.success('保存成功!');
  370. meta2d.emit('business-save', vType);
  371. dot.value = false;
  372. localforage.removeItem(localStorageName);
  373. return true;
  374. // }, 2000);
  375. };
  376. export function queryURLParams(value?: string) {
  377. let url = value || window.location.href.split('?')[1];
  378. const urlSearchParams = new URLSearchParams(url);
  379. const params = Object.fromEntries(urlSearchParams.entries());
  380. return params;
  381. }
  382. // TODO 保存图纸
  383. export const save = async (
  384. type: SaveType = SaveType.Save,
  385. vType?: string,
  386. notice?: boolean,
  387. userFlag?:number
  388. ) => {
  389. if (!saveFlag) {
  390. return;
  391. }
  392. if (saveTimer) {
  393. clearTimeout(saveTimer);
  394. }
  395. saveFlag = false;
  396. saveTimer = setTimeout(() => {
  397. saveFlag = true;
  398. }, 2000);
  399. // 区分是模板还是方案
  400. meta2d.stopAnimate();
  401. if( vType === 'v.component'){
  402. // @ts-ignore
  403. meta2d.store.data.component = true
  404. }
  405. const data: Meta2dBackData = meta2d.data();
  406. if (!(user && user.id)) {
  407. MessagePlugin.warning(noLoginTip);
  408. localforage.setItem(localStorageName, JSON.stringify(data));
  409. return;
  410. }
  411. // 保存为组件
  412. if (
  413. vType === 'v.component' &&
  414. meta2d.store.active &&
  415. meta2d.store.active.length === 1 &&
  416. meta2d.store.active[0].name === 'combine'
  417. ) {
  418. let comData: any = {
  419. center: data.center,
  420. folder: '',
  421. origin: data.origin,
  422. scale: data.scale,
  423. x: data.x,
  424. y: data.y,
  425. };
  426. // comData.name =
  427. // (meta2d.store.active[0] as any).description ||
  428. // `meta2d.${new Date().toLocaleString()}`;
  429. comData.name = (meta2d.store.active[0] as any).description ||'新建项目';
  430. let blob: Blob;
  431. try {
  432. blob = dataURLtoBlob(meta2d.activeToPng(10) + '');
  433. } catch (e) {
  434. MessagePlugin.error(
  435. '无法下载,宽度不合法,可能没有选中画笔/选中画笔大小超出浏览器最大限制'
  436. );
  437. return;
  438. }
  439. //todo 传参数
  440. const file:any = await upload(blob, true, comData.name + '.' +dayjs().format('YYYYMMDDHHMMss'), `/大屏/组件/默认`,'new');
  441. if (!file) {
  442. return;
  443. }
  444. // // 缩略图
  445. comData.image = file.url;
  446. comData.fullname = file.fullname;
  447. comData.component = true;
  448. const allPens = meta2d.canvas.getAllByPens(meta2d.store.active);
  449. comData.componentDatas = meta2d.toComponent(
  450. allPens,
  451. (meta2d.store.data as Meta2dBackData).showChild,
  452. false
  453. );
  454. const body = {
  455. data:comData,
  456. image:comData.image,
  457. name:comData.name,
  458. folder: '',
  459. userFlag,
  460. case:comData.case
  461. }
  462. let ret: any = await addCollection('v.component', body); // 新增
  463. if (ret.error) {
  464. return;
  465. }
  466. MessagePlugin.success('成功保存为组件!');
  467. meta2d.emit('business-save', vType);
  468. return;
  469. }
  470. //删除老图片 新图片上传
  471. checkData(data);
  472. if (
  473. (globalThis as any).beforeSaveMeta2d &&
  474. !(await (globalThis as any).beforeSaveMeta2d(data))
  475. ) {
  476. return;
  477. }
  478. if (
  479. data.tags &&
  480. !data.tags.includes('系统模板') &&
  481. !data.tags.includes('系统方案')
  482. ) {
  483. if (vType === 'v-template') {
  484. if (!data.tags.includes('模板')) {
  485. delete data.id;
  486. delete data._id;
  487. delete data.folder;
  488. // data.image = data.image?.split('_').pop();// 避免保存为不同类型会增加不必要的唯一字符串
  489. }
  490. data.tags = ['模板'];
  491. } else if (!vType) {
  492. if (!data.tags.includes('方案')) {
  493. delete data.id;
  494. delete data._id;
  495. delete data.folder;
  496. // data.image = data.image?.split('_').pop();
  497. }
  498. data.tags = ['方案'];
  499. } else if(vType === 'v.component') {
  500. if (!data.tags.includes('组件')) {
  501. delete data.id;
  502. delete data._id;
  503. delete data.folder;
  504. // data.image = data.image?.split('_').pop();
  505. }
  506. data.tags = ['组件'];
  507. }
  508. }
  509. const thumbFolder =
  510. vType === 'v-template'
  511. ? '模板'
  512. : vType === 'v.component'
  513. ? '组件'
  514. : '方案';
  515. if (type === SaveType.SaveAs) {
  516. //另存为去掉teams信息
  517. delete data.teams;
  518. delete data.folder;
  519. delete data.id;
  520. }
  521. //如果不是自己创建的团队图纸,就不去修改缩略图(没有权限去删除缩略图)
  522. if (!data.name) {
  523. // 文件名称
  524. // data.name = `meta2d.${new Date().toLocaleString()}`;
  525. data.name = `新建项目`;
  526. (meta2d.store.data as Meta2dBackData).name = data.name;
  527. }
  528. if (!(data.teams && data.owner?.id !== user.id)) {
  529. for (const pen of meta2d.store.data.pens) {
  530. if (['iframe'].includes(pen.name)) {
  531. //重新生成绘制图片
  532. pen.onRenderPenRaw?.(pen);
  533. }
  534. }
  535. let blob: Blob;
  536. try {
  537. blob = dataURLtoBlob(meta2d.toPng(10) + '');
  538. } catch (e) {
  539. MessagePlugin.error(
  540. '无法下载,宽度不合法,画布可能没有画笔/画布大小超出浏览器最大限制'
  541. );
  542. return;
  543. }
  544. let conflict = 'new';
  545. if (data.id && type === SaveType.Save) {
  546. // conflict = undefined
  547. if (data.image && !(await delImage(data.image))) {
  548. return;
  549. }
  550. }
  551. const file:any = await upload(
  552. blob,
  553. true,
  554. // 更新是缩略图路径一般为/file/2023/1025/1/1/新建项目_dfa573a5
  555. // data.image?.split('/').pop()更新操作项目名不变
  556. data.name + '.' + dayjs().format('YYYYMMDDHHMMss'),
  557. `/大屏/${thumbFolder}/${data.folder || '默认'}`,
  558. conflict
  559. );
  560. if (!file) {
  561. return;
  562. }
  563. // 缩略图
  564. data.image = file.url;
  565. data.filename = file.filename;
  566. (meta2d.store.data as Meta2dBackData).image = data.image;
  567. (meta2d.store.data as Meta2dBackData).filename = data.filename;
  568. }
  569. if (data.component || vType === 'v.component') {
  570. data.component = true;
  571. // pens 存储原数据用于二次编辑 ; componentDatas 组合后的数据,用于复用
  572. data.componentDatas = meta2d.toComponent(
  573. undefined,
  574. (meta2d.store.data as Meta2dBackData).showChild,
  575. false //自定义组合节点生成默认锚点
  576. );
  577. } else {
  578. data.component = false; // 必要值
  579. }
  580. let collection = data.component ? 'v.component' : 'v';
  581. let ret: any;
  582. !data.version && (data.version = baseVer);
  583. // TODO
  584. if (!data.folder) {
  585. data.folder = ''; // folder.name;
  586. }
  587. let childIds = [];
  588. data.pens.forEach((pen)=>{
  589. if(pen.name === 'iframe'){
  590. if(pen.iframe.indexOf(`view${rootDomain}`) !== -1){
  591. let params = queryURLParams(pen.iframe.split('?')[1])
  592. childIds.push(params.id);
  593. }
  594. }
  595. });
  596. // data.childIds = childIds;
  597. const body = {
  598. data,
  599. image:data.image,
  600. name:data.name,
  601. folder:data.folder,
  602. // shared:true,
  603. userFlag,
  604. case:data.case,
  605. childIds
  606. }
  607. delete data.name;
  608. delete data.image;
  609. delete data.folder;
  610. delete data.case;
  611. if (!data.tags || !data.tags.length) {
  612. data.tags = [thumbFolder];
  613. }
  614. if (type === SaveType.SaveAs) {
  615. // 另存为一定走 新增 ,由于后端 未控制 userId 等属性,清空一下
  616. for (const k of delAttrs) {
  617. delete (data as any)[k];
  618. }
  619. if (!data.tags || !data.tags.length) {
  620. data.tags = ['方案'];
  621. }
  622. ret = await addCollection(collection, body);
  623. } else {
  624. // if (data._id && data.teams && data.owner?.id !== user.id) {
  625. // // 团队图纸 不允许修改文件夹信息
  626. // delete data.folder;
  627. // ret = await updateCollection(collection, data);
  628. // } else
  629. if (data.id || data._id) {
  630. ret = await updateCollection(collection, {id:data.id || data._id,...body});
  631. } else {
  632. ret = await addCollection(collection, body); // 新增
  633. }
  634. }
  635. if (ret.error) {
  636. return;
  637. }
  638. // 保存图纸之后的钩子函数
  639. globalThis.afterSaveMeta2d && (await globalThis.afterSaveMeta2d(ret));
  640. if (
  641. !data.id ||
  642. router.currentRoute.value.query.version ||
  643. type === SaveType.SaveAs // 另存为肯定走新增,也会产生新的 id
  644. ) {
  645. data.id = ret.id;
  646. (meta2d.store.data as Meta2dBackData).id = data.id;
  647. router.replace({
  648. path: '/',
  649. query: {
  650. id: data.id,
  651. r: Date.now() + '',
  652. c: vType === 'v.component' ? 1 : undefined,
  653. },
  654. });
  655. }
  656. notice && MessagePlugin.success('保存成功!');
  657. meta2d.emit('business-save', vType);
  658. dot.value = false;
  659. localforage.removeItem(localStorageName);
  660. return true;
  661. };
  662. export const chargeDialogShow = ref(false);
  663. export const autoSaveAS = async(id:string)=>{
  664. //先请求打开图纸
  665. const ret: any = await getLe5leV(id);
  666. if(!ret.data && ret.price>0){
  667. return;
  668. }
  669. sessionStorage.setItem('opening', '1');
  670. router.push({
  671. path: '/',
  672. query: {
  673. r: Date.now() + '',
  674. },
  675. });
  676. //去除图纸一些信息
  677. for (const k of delAttrs) {
  678. delete ret[k];
  679. delete ret.data[k];
  680. }
  681. chargeDialogShow.value = false;
  682. meta2d.open(ret.data);
  683. meta2d.fitView();
  684. //另存为付费用户图纸
  685. setTimeout(()=>{
  686. save(SaveType.SaveAs, '', undefined, 1);
  687. },500)
  688. }
  689. const pen = ref(false);
  690. export const drawPen = () => {
  691. meta2d.inactive();
  692. try {
  693. if (!meta2d.canvas.drawingLineName) {
  694. // 开了钢笔,需要关掉铅笔
  695. meta2d.canvas.pencil && drawingPencil();
  696. meta2d.drawLine(meta2d.store.options.drawingLineName);
  697. } else {
  698. meta2d.finishDrawLine();
  699. meta2d.drawLine();
  700. }
  701. //钢笔
  702. pen.value = !!meta2d.canvas.drawingLineName;
  703. } catch (e: any) {
  704. MessagePlugin.warning(e.message);
  705. }
  706. };
  707. const pencil = ref(false);
  708. const drawingPencil = () => {
  709. try {
  710. if (!meta2d.canvas.pencil) {
  711. // 开了铅笔需要关掉钢笔
  712. meta2d.canvas.drawingLineName && drawPen();
  713. meta2d.drawingPencil();
  714. } else {
  715. meta2d.stopPencil();
  716. }
  717. pencil.value = meta2d.canvas.pencil || false;
  718. } catch (e: any) {
  719. MessagePlugin.warning(e.message);
  720. }
  721. };
  722. export const magnifier = ref(false);
  723. export const showMagnifier = () => {
  724. if (!meta2d.canvas.magnifierCanvas.magnifier) {
  725. meta2d.showMagnifier();
  726. } else {
  727. meta2d.hideMagnifier();
  728. }
  729. magnifier.value = meta2d.canvas.magnifierCanvas.magnifier;
  730. };
  731. export const map = ref(false);
  732. export const showMap = () => {
  733. if (!meta2d.map?.isShow) {
  734. meta2d.showMap();
  735. } else {
  736. meta2d.hideMap();
  737. }
  738. map.value = meta2d.map?.isShow;
  739. };
  740. export const title = '系统可能不会保存您所做的更改,是否继续?';
  741. export const unLogin = '未登录,系统可能不会保存您的文件,是否继续?';
  742. export const unsave = '当前文件未保存,是否继续?(开通vip可享受自动保存服务)';
  743. export function autoSave(force = false) {
  744. if (!dot.value && (!force || router.currentRoute.value.query.id)) {
  745. return;
  746. }
  747. const data: any = meta2d.data();
  748. if (
  749. user &&
  750. user.id &&
  751. user.vip &&
  752. (data.id||data._id) &&
  753. !data.component &&
  754. data.owner &&
  755. data.owner.id === user.id
  756. ) {
  757. let _vType = '';
  758. if (data.tags.includes('模板')) {
  759. _vType = 'v-template';
  760. }
  761. save(SaveType.Save, _vType);
  762. } else {
  763. // data.updateAt = dayjs().format();
  764. localforage.setItem(localStorageName, JSON.stringify(data));
  765. }
  766. }
  767. // export const notificFn = async (fn: Function, params: any) => {
  768. // if (!(user && user.id)) {
  769. // if (await showNotification(unLogin)) {
  770. // fn(params);
  771. // }
  772. // } else {
  773. // if (dot.value) {
  774. // if (user.isVip) {
  775. // if (await save(SaveType.Save)) {
  776. // fn(params);
  777. // }
  778. // } else {
  779. // if (await showNotification(unsave)) {
  780. // fn(params);
  781. // }
  782. // }
  783. // } else {
  784. // fn(params);
  785. // }
  786. // }
  787. // };
  788. export const onScaleWindow = () => {
  789. // meta2d.fitView();
  790. meta2d.fitSizeView(true, 32);
  791. };
  792. export const onScaleFull = () => {
  793. meta2d.scale(1);
  794. // meta2d.centerView();
  795. const { x, y, origin, center } = meta2d.store.data;
  796. meta2d.translate(-x - origin.x, -y - origin.y);
  797. meta2d.translate(meta2d.store.options.x || 0, meta2d.store.options.y || 0);
  798. };
  799. export const blank = async (save = true) => {
  800. meta2d.canvas.drawingLineName && drawPen();
  801. meta2d.canvas.pencil && drawingPencil();
  802. meta2d.canvas.magnifierCanvas.magnifier && showMagnifier();
  803. meta2d.map?.isShow && showMap();
  804. save && autoSave(true);
  805. dot.value = false;
  806. meta2d.open({ pens: [] } as any);
  807. select();
  808. };
  809. export const newFile = () => {
  810. blank();
  811. router.push({
  812. path: '/',
  813. query: {
  814. r: Date.now() + '',
  815. },
  816. });
  817. // setTimeout(() => {
  818. // autoSave(true);
  819. // }, 300);
  820. meta2d.emit('business-assets',true);
  821. };
  822. export const inTreePanel = reactive({
  823. value: false,
  824. timer: undefined,
  825. });
  826. const tree = reactive({
  827. list: [],
  828. patch: true,
  829. });
  830. export const getPenTree = () => {
  831. tree.patch = false;
  832. const list = [];
  833. for (const item of meta2d.store.data.pens) {
  834. if (item.parentId) {
  835. continue;
  836. }
  837. const elem = calcElem(item);
  838. elem && list.push(elem);
  839. }
  840. tree.list = list.reverse();
  841. return tree.list;
  842. };
  843. export const getPenAnimations = (idOrTag?: string) => {
  844. const animations = [];
  845. let pens: any[] = meta2d.store.active || [];
  846. if (idOrTag) {
  847. pens = meta2d.find(idOrTag) || [];
  848. }
  849. for (const pen of pens) {
  850. if (pen.animations) {
  851. for (const a of pen.animations) {
  852. animations.push(a.name);
  853. }
  854. }
  855. }
  856. return Array.from(new Set(animations));
  857. };
  858. const calcElem = (node: any) => {
  859. if (!node) {
  860. return;
  861. }
  862. let tag = '中';
  863. if (
  864. isDomShapes.includes(node.name) ||
  865. node.name.endsWith('Dom') ||
  866. meta2d.store.options.domShapes.includes(node.name)
  867. ) {
  868. tag = 'dom';
  869. } else if (node.canvasLayer === 1) {
  870. tag = '模板';
  871. } else if (node.name === 'image') {
  872. if(node.canvasLayer === 2){
  873. tag = '下层';
  874. }else if(node.canvasLayer===3){
  875. tag = '中层';
  876. }else{
  877. tag = '上层';
  878. }
  879. } else {
  880. tag = '中层';
  881. }
  882. const elem: any = {
  883. label: (node as any).description || node.name,
  884. value: node.id,
  885. locked: node.locked,
  886. visible: node.visible,
  887. tag,
  888. };
  889. if (!node.children) {
  890. return elem;
  891. }
  892. elem.children = [];
  893. for (const id of node.children) {
  894. const child = calcElem(meta2d.store.pens[id]);
  895. child && elem.children.push(child);
  896. }
  897. return elem;
  898. };
  899. export const setChildrenVisible = (node: any, v: boolean) => {
  900. const children = node.getChildren();
  901. if (children && children.length > 0) {
  902. for (const child of children) {
  903. child.data.visible = v;
  904. setChildrenVisible(child, v);
  905. }
  906. }
  907. };
  908. export const fonts = [
  909. '新宋体',
  910. '微软雅黑',
  911. '黑体',
  912. '楷体',
  913. '斗鱼追光体',
  914. '庞门正道标题体',
  915. 'DS-DIGI-1',
  916. 'DS-DIGIB-2',
  917. 'DS-DIGII-3',
  918. 'DS-DIGIT-4',
  919. 'ALIBABA Regular',
  920. 'ALIBABA Bold',
  921. '-apple-system',
  922. 'BlinkMacSystemFont',
  923. 'PingFang SC',
  924. 'Hiragino Sans GB',
  925. 'Microsoft YaHei UI',
  926. 'Microsoft YaHei',
  927. 'fangsong',
  928. 'Source Han Sans CN',
  929. 'sans-serif',
  930. 'serif',
  931. 'Apple Color Emoji',
  932. 'Segoe UI Emoji',
  933. 'Segoe UI Symbol',
  934. ];
  935. export const delAttrs = [
  936. 'userId',
  937. 'shared',
  938. 'team',
  939. 'owner',
  940. 'username',
  941. 'editor',
  942. 'editorId',
  943. 'editorName',
  944. 'createdAt',
  945. 'tags',
  946. 'image',
  947. 'id',
  948. '_id',
  949. 'view',
  950. 'updatedAt',
  951. 'star',
  952. 'recommend',
  953. ];
  954. export const typeOptions = [
  955. {
  956. label: '字符串',
  957. value: 'string',
  958. },
  959. {
  960. label: '整数',
  961. value: 'integer',
  962. },
  963. {
  964. label: '浮点数',
  965. value: 'float',
  966. },
  967. {
  968. label: '布尔',
  969. value: 'bool',
  970. },
  971. {
  972. label: '对象',
  973. value: 'object',
  974. },
  975. {
  976. label: '数组',
  977. value: 'array',
  978. },
  979. ];
  980. let folder = reactive<any>({
  981. _id: '',
  982. });
  983. export const useFolder = () => {
  984. const getFolder = async () => {
  985. return folder;
  986. };
  987. const setFolder = async (value: any) => {
  988. folder = deepClone(value);
  989. };
  990. return {
  991. folder,
  992. getFolder,
  993. setFolder,
  994. };
  995. };
  996. export function changeType(value: string) {
  997. if (value === 'false') {
  998. return false;
  999. } else if (value === 'true') {
  1000. return true;
  1001. } else if (
  1002. value === '' ||
  1003. isNaN(Number(value)) ||
  1004. (typeof value === 'string' && value.endsWith('.'))
  1005. ) {
  1006. // 小数也进入这个
  1007. return value;
  1008. }
  1009. return Number(value);
  1010. }