diff --git a/README.md b/README.md index 63f2ffb..8c73cbf 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ ## Poster Design -迅排设计是一款漂亮易用且功能强大的开源创意图片编辑器,是对标稿定设计、创客贴、Canva 等商业产品的免费在线设计工具。 +一款漂亮易用且功能强大的开源创意图片编辑器,是对标稿定设计、创客贴、Canva 等商业产品的免费在线设计工具。 [![](https://xp.palxp.cn/images/2023-7-16-1689500112694.gif)](https://design.palxp.cn/) @@ -13,7 +13,7 @@ - 丝滑的页面操作体验,丰富的交互细节,基础功能完善 - 采用服务端生成图片,能确保多端出图统一性,支持各种 CSS 特性 - 简易 AI 抠图工具,上传图片一键去除背景 -- 技术栈:Vue3 、Vite2 、Vuex 、ElementPlus,开发体验畅快 +- 技术栈:Vue3 、Vite5 、Vuex 、ElementPlus,开发体验畅快 - 图片生成:Puppeteer、Express ### 支持功能 @@ -35,12 +35,14 @@ git clone https://github.com/palxiao/poster-design.git cd poster-design npm run prepared -npm run serve +npm run dev +cd screreenshot +npm run dev ``` ![](https://xp.palxp.cn/images/2023-7-16-1689498291322.png) -访问 http://127.0.0.1:5173/ 查看网页。点此查看[完整说明文档](https://xp.palxp.cn/#/articles/1689319644311)。 +访问 http://127.0.0.1:5173/ 查看网页。点此查看[更多说明文档](https://xp.palxp.cn/#/articles/1689319644311)。 ### 图片生成服务 @@ -50,10 +52,20 @@ npm run serve ### 服务端 -目前本项目演示 Demo 中的后端接口参考:[接口 API 文档](https://xp.palxp.cn/apidoc/index.html)。 +后端需要自己开发,目前本项目演示 Demo 中的后端接口参考:[接口 API 文档](https://xp.palxp.cn/apidoc/index.html)。 ## 其它 +我们尝试沉淀一个高质量内容社区,形成可持续学习的平台,同时解决开发者在项目中遇到的疑难和困惑,帮大家少走一些弯路。 + + + +也欢迎关注公众号:品味前端 + + + +----- + 本项目最早使用 Vue2 开发,现改用 Vue3 重构中。[一些迭代计划记录](https://xp.palxp.cn/#/articles/1689319986889?id=%e8%bf%ad%e4%bb%a3%e8%ae%a1%e5%88%92). 目前开源版仍在持续迭代中,还有很多的不足,可以将你遇到的问题在 Issues 中提出,或者提交 Pull Request 帮助完善。 @@ -67,13 +79,7 @@ npm run serve - [qr-code-styling](https://qr-code-styling.com/): 风格化二维码 - [rembg](https://github.com/danielgatis/rembg): 图片抠图,使用 u2net 预训练模型 -### 交流群 - -| 作者微信:备注加群 | 关注公众号 | -| --- | --- | -| | | - -开源不易,别忘了给本项目点个 **Star** ~ +开源不易,最后别忘了给本项目点个 **Star** ~ [![Star History Chart](https://api.star-history.com/svg?repos=palxiao/poster-design&type=Date)](https://star-history.com/#palxiao/poster-design&Date) diff --git a/src/components/modules/widgets/wGroup/wGroup.vue b/src/components/modules/widgets/wGroup/wGroup.vue index 2d8c30d..b09ce00 100644 --- a/src/components/modules/widgets/wGroup/wGroup.vue +++ b/src/components/modules/widgets/wGroup/wGroup.vue @@ -26,7 +26,7 @@ // 组合组件 const NAME = 'w-group' import { nextTick, onBeforeUnmount, onMounted, onUpdated, ref } from 'vue' -import { useStore } from 'vuex' +import { mapGetters, mapActions, useStore } from 'vuex' import { setTransformAttribute } from '@/common/methods/handleTransform' import { useSetupMapGetters } from '@/common/hooks/mapGetters'; @@ -55,26 +55,26 @@ const widget = ref(null) const ratio = ref(0) const temp = ref>({}) const compWidgetsRecord = ref>({}) -// const setting = { -// name: '组合', -// type: NAME, -// uuid: -1, -// width: 0, -// height: 0, -// left: 0, -// top: 0, -// transform: '', -// opacity: 1, -// parent: '-1', -// isContainer: true, -// record: { -// width: 0, -// height: 0, -// minWidth: 0, -// minHeight: 0, -// dir: 'none', -// }, -// } +const setting = { + name: '组合', + type: NAME, + uuid: -1, + width: 0, + height: 0, + left: 0, + top: 0, + transform: '', + opacity: 1, + parent: '-1', + isContainer: true, + record: { + width: 0, + height: 0, + minWidth: 0, + minHeight: 0, + dir: 'none', + }, +} const timer = ref(null) const { dActiveElement, dWidgets } = useSetupMapGetters(['dActiveElement', 'dWidgets']) @@ -235,9 +235,9 @@ function keySetValue(uuid: string, key: keyof TParamsData, value: number) { }, 10) } -// defineExpose({ -// setting -// }) +defineExpose({ + setting +}) diff --git a/src/components/modules/widgets/wText/wText.vue b/src/components/modules/widgets/wText/wText.vue index 5b58a0f..a5943aa 100644 --- a/src/components/modules/widgets/wText/wText.vue +++ b/src/components/modules/widgets/wText/wText.vue @@ -1,9 +1,9 @@