fl-web-component 2.0.14 → 2.0.16

package/dist/fl-web-component.css

@@ -1 +1 @@
-@charset "UTF-8";.fl-model-containor[data-v-3e15de76]{width:100%;height:100%;position:relative;cursor:pointer}[data-v-3e15de76] .tips-label{width:60px;color:#000;font:12px Helvetica;margin-top:-3em;padding:5px;text-align:center;vertical-align:middle;background-color:khaki}[data-v-3e15de76] .measure-label{max-width:100px;margin-top:-1em;border:10px;border-radius:5px;padding:3px 10px;cursor:pointer;color:#009bea;background-color:#f4f4f4;-webkit-box-shadow:0 1px 3px 1px rgba(0,0,0,.25);box-shadow:0 1px 3px 1px rgba(0,0,0,.25)}[data-v-3e15de76] .circle-tag{width:10px;height:10px;margin-top:5px;border-radius:50%;background-color:#ff5000}[data-v-3e15de76] .measure-label-font{word-break:break-all}[data-v-3e15de76] .mark-label-img{padding-top:5px;width:20px;height:20px}.loading-overlay[data-v-3e15de76]{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;-webkit-transition:opacity .3s ease,visibility .3s ease;transition:opacity .3s ease,visibility .3s ease}.loading-overlay--visible[data-v-3e15de76]{opacity:1;visibility:visible}.loading-content[data-v-3e15de76]{background:#fff;border-radius:12px;padding:30px;text-align:center;-webkit-box-shadow:0 8px 32px rgba(0,0,0,.3);box-shadow:0 8px 32px rgba(0,0,0,.3);min-width:300px;max-width:400px}.loading-spinner[data-v-3e15de76]{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #409eff;border-radius:50%;-webkit-animation:spin-3e15de76 1s linear infinite;animation:spin-3e15de76 1s linear infinite;margin:0 auto 20px}@-webkit-keyframes spin-3e15de76{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin-3e15de76{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading-text[data-v-3e15de76]{font-size:16px;font-weight:500;color:#333;margin-bottom:20px}.loading-this.progress-bar[data-v-3e15de76]{width:100%;height:8px;background-color:#f0f0f0;border-radius:4px;overflow:hidden;margin-bottom:15px}.loading-this.progress-fill[data-v-3e15de76]{height:100%;background:-webkit-gradient(linear,left top,right top,from(#409eff),to(#67c23a));background:linear-gradient(90deg,#409eff,#67c23a);border-radius:4px;-webkit-transition:width .3s ease;transition:width .3s ease}.loading-details[data-v-3e15de76]{font-size:12px;color:#666;line-height:1.5}.lil-this.gui{background:hsla(0,0%,100%,.95)!important;border:1px solid #e0e0e0!important;border-radius:8px!important;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.15)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important;backdrop-filter:blur(10px)!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.lil-this.gui .title{background:linear-gradient(135deg,#f8f9fa,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important;font-weight:600!important;padding:0 12px!important;border-radius:8px 8px 0 0!important}.lil-this.gui .controller{border-bottom:1px solid #f1f3f4!important;background:transparent!important}.lil-this.gui .controller:last-child{border-bottom:none!important}.lil-this.gui .controller .name{color:#495057!important;font-weight:500!important;font-size:12px!important}.lil-this.gui .controller .widget{background:#f8f9fa!important;border:1px solid #ced4da!important;border-radius:4px!important;color:#495057!important}.lil-this.gui .controller .widget:focus,.lil-this.gui .controller .widget:hover{border-color:#80bdff!important;-webkit-box-shadow:0 0 0 2px rgba(0,123,255,.25)!important;box-shadow:0 0 0 2px rgba(0,123,255,.25)!important}.lil-this.gui .controller .widget:focus{outline:none!important}.lil-this.gui .controller input[type=range]{background:#e9ecef!important;height:4px!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;border-radius:2px!important}.lil-this.gui .controller.number .fill{border-right:solid #008de9}.lil-this.gui .controller input[type=range]::-webkit-slider-thumb{background:#007bff!important;border:2px solid #fff!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.2)!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;-webkit-appearance:none!important;appearance:none!important;cursor:pointer!important}.lil-this.gui .controller input[type=range]::-moz-range-thumb{background:#007bff!important;border:2px solid #fff!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;cursor:pointer!important}.lil-this.gui .controller .option{background:#fff!important;color:#495057!important;border-bottom:1px solid #f1f3f4!important}.lil-this.gui .controller .option:hover{background:#f8f9fa!important}.lil-this.gui .controller .option:last-child{border-bottom:none!important}.lil-this.gui input:active{background:#e6eff4}.lil-this.gui .controller button{background:linear-gradient(135deg,#007bff,#0056b3)!important;color:#fff!important;border:none!important;border-radius:4px!important;font-weight:500!important;-webkit-transition:all .2s ease!important;transition:all .2s ease!important}.lil-this.gui .controller button:hover{background:linear-gradient(135deg,#0056b3,#004085)!important;-webkit-transform:translateY(-1px)!important;transform:translateY(-1px)!important;-webkit-box-shadow:0 4px 8px rgba(0,123,255,.3)!important;box-shadow:0 4px 8px rgba(0,123,255,.3)!important}.lil-this.gui .controller .color{border:2px solid #fff!important;border-radius:4px!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.1)!important;box-shadow:0 2px 4px rgba(0,0,0,.1)!important}.lil-this.gui .controller.number .slider,.lil-this.gui .controller.number .slider:hover{background-color:#e6eff4}.lil-this.gui input,.lil-this.gui input:hover,.lil-this.gui input[type=number]:focus,.lil-this.gui input[type=text]:focus{background:#e6eff4}.lil-this.gui .controller>.name{min-width:25px}.lil-this.gui .controller.number input{color:#2e3136}.lil-this.gui .controller.number .slider:active{background-color:#e6eff4}.lil-this.gui .folder>.title{background:linear-gradient(135deg,#f1f3f4,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important}.lil-this.gui .folder>.title:before{color:#6c757d!important}.lil-this.gui .folder.closed>.children{display:none!important}#konva-container[data-v-21bcf2d9]{z-index:3;width:100%;height:100%;cursor:pointer;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}.main_body[data-v-4b17bce0]{position:relative;width:100%;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.classification_title[data-v-4b17bce0]{margin:0 0 10px 0;color:#fff;font-size:14px;cursor:default}.toolbar[data-v-4b17bce0]{z-index:10;position:absolute;width:520px;padding:8px 16px;border-radius:6px;-webkit-box-shadow:0 2px 10px 0 rgba(6,29,44,.25);box-shadow:0 2px 10px 0 rgba(6,29,44,.25);background-color:#fff;top:10px;left:50%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform:translateX(-50%);transform:translateX(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.icon_toolbar[data-v-4b17bce0],.text_toolbar[data-v-4b17bce0]{float:left;width:32px;height:32px;padding:0!important;background-repeat:no-repeat;background-size:24px;background-position:50%}.icon_active[data-v-4b17bce0],.icon_toolbar[data-v-4b17bce0]:hover,.text_toolbar[data-v-4b17bce0]:hover{background-color:#eee}[data-v-4b17bce0].icon_color .el-color-picker__trigger{height:24px;margin-top:4px;width:24px!important}[data-v-4b17bce0].el-color-picker--medium,[data-v-4b17bce0].el-color-picker--medium .el-color-picker__trigger{width:24px!important;height:24px!important}.canvas_container[data-v-4b17bce0]{position:relative;width:100%;height:100%;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.canvas_container canvas[data-v-4b17bce0]{position:absolute;left:0}.canvas_container #ctx_front[data-v-4b17bce0]{z-index:5;background-color:transparent}.canvas_container #ctx_back[data-v-4b17bce0]{z-index:3}.canvas_container #ctx_base[data-v-4b17bce0]{z-index:1}#text[data-v-4b17bce0]{position:absolute;z-index:-1;resize:none;outline:none;border:1px dashed #9c9c9c;overflow:hidden;background:transparent;line-height:30px;display:none}#text[data-v-4b17bce0]:hover{border:1px dashed #53a8ff}#svg-component[data-v-2572c0e2],#svg-tigger[data-v-2572c0e2]{cursor:pointer;height:100%;width:100%;position:relative}#toolbar-show[data-v-2572c0e2]{z-index:20;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;background:#fff}
+@charset "UTF-8";.fl-model-containor[data-v-3e15de76]{width:100%;height:100%;position:relative;cursor:pointer}[data-v-3e15de76] .tips-label{width:60px;color:#000;font:12px Helvetica;margin-top:-3em;padding:5px;text-align:center;vertical-align:middle;background-color:khaki}[data-v-3e15de76] .measure-label{max-width:100px;margin-top:-1em;border:10px;border-radius:5px;padding:3px 10px;cursor:pointer;color:#009bea;background-color:#f4f4f4;-webkit-box-shadow:0 1px 3px 1px rgba(0,0,0,.25);box-shadow:0 1px 3px 1px rgba(0,0,0,.25)}[data-v-3e15de76] .circle-tag{width:10px;height:10px;margin-top:5px;border-radius:50%;background-color:#ff5000}[data-v-3e15de76] .measure-label-font{word-break:break-all}[data-v-3e15de76] .mark-label-img{padding-top:5px;width:20px;height:20px}.loading-overlay[data-v-3e15de76]{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;-webkit-transition:opacity .3s ease,visibility .3s ease;transition:opacity .3s ease,visibility .3s ease}.loading-overlay--visible[data-v-3e15de76]{opacity:1;visibility:visible}.loading-content[data-v-3e15de76]{background:#fff;border-radius:12px;padding:30px;text-align:center;-webkit-box-shadow:0 8px 32px rgba(0,0,0,.3);box-shadow:0 8px 32px rgba(0,0,0,.3);min-width:300px;max-width:400px}.loading-spinner[data-v-3e15de76]{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #409eff;border-radius:50%;-webkit-animation:spin-3e15de76 1s linear infinite;animation:spin-3e15de76 1s linear infinite;margin:0 auto 20px}@-webkit-keyframes spin-3e15de76{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin-3e15de76{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading-text[data-v-3e15de76]{font-size:16px;font-weight:500;color:#333;margin-bottom:20px}.loading-this.progress-bar[data-v-3e15de76]{width:100%;height:8px;background-color:#f0f0f0;border-radius:4px;overflow:hidden;margin-bottom:15px}.loading-this.progress-fill[data-v-3e15de76]{height:100%;background:-webkit-gradient(linear,left top,right top,from(#409eff),to(#67c23a));background:linear-gradient(90deg,#409eff,#67c23a);border-radius:4px;-webkit-transition:width .3s ease;transition:width .3s ease}.loading-details[data-v-3e15de76]{font-size:12px;color:#666;line-height:1.5}.lil-this.gui{background:hsla(0,0%,100%,.95)!important;border:1px solid #e0e0e0!important;border-radius:8px!important;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.15)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important;backdrop-filter:blur(10px)!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.lil-this.gui .title{background:linear-gradient(135deg,#f8f9fa,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important;font-weight:600!important;padding:0 12px!important;border-radius:8px 8px 0 0!important}.lil-this.gui .controller{border-bottom:1px solid #f1f3f4!important;background:transparent!important}.lil-this.gui .controller:last-child{border-bottom:none!important}.lil-this.gui .controller .name{color:#495057!important;font-weight:500!important;font-size:12px!important}.lil-this.gui .controller .widget{background:#f8f9fa!important;border:1px solid #ced4da!important;border-radius:4px!important;color:#495057!important}.lil-this.gui .controller .widget:focus,.lil-this.gui .controller .widget:hover{border-color:#80bdff!important;-webkit-box-shadow:0 0 0 2px rgba(0,123,255,.25)!important;box-shadow:0 0 0 2px rgba(0,123,255,.25)!important}.lil-this.gui .controller .widget:focus{outline:none!important}.lil-this.gui .controller input[type=range]{background:#e9ecef!important;height:4px!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;border-radius:2px!important}.lil-this.gui .controller.number .fill{border-right:solid #008de9}.lil-this.gui .controller input[type=range]::-webkit-slider-thumb{background:#007bff!important;border:2px solid #fff!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.2)!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;-webkit-appearance:none!important;appearance:none!important;cursor:pointer!important}.lil-this.gui .controller input[type=range]::-moz-range-thumb{background:#007bff!important;border:2px solid #fff!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;cursor:pointer!important}.lil-this.gui .controller .option{background:#fff!important;color:#495057!important;border-bottom:1px solid #f1f3f4!important}.lil-this.gui .controller .option:hover{background:#f8f9fa!important}.lil-this.gui .controller .option:last-child{border-bottom:none!important}.lil-this.gui input:active{background:#e6eff4}.lil-this.gui .controller button{background:linear-gradient(135deg,#007bff,#0056b3)!important;color:#fff!important;border:none!important;border-radius:4px!important;font-weight:500!important;-webkit-transition:all .2s ease!important;transition:all .2s ease!important}.lil-this.gui .controller button:hover{background:linear-gradient(135deg,#0056b3,#004085)!important;-webkit-transform:translateY(-1px)!important;transform:translateY(-1px)!important;-webkit-box-shadow:0 4px 8px rgba(0,123,255,.3)!important;box-shadow:0 4px 8px rgba(0,123,255,.3)!important}.lil-this.gui .controller .color{border:2px solid #fff!important;border-radius:4px!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.1)!important;box-shadow:0 2px 4px rgba(0,0,0,.1)!important}.lil-this.gui .controller.number .slider,.lil-this.gui .controller.number .slider:hover{background-color:#e6eff4}.lil-this.gui input,.lil-this.gui input:hover,.lil-this.gui input[type=number]:focus,.lil-this.gui input[type=text]:focus{background:#e6eff4}.lil-this.gui .controller>.name{min-width:25px}.lil-this.gui .controller.number input{color:#2e3136}.lil-this.gui .controller.number .slider:active{background-color:#e6eff4}.lil-this.gui .folder>.title{background:linear-gradient(135deg,#f1f3f4,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important}.lil-this.gui .folder>.title:before{color:#6c757d!important}.lil-this.gui .folder.closed>.children{display:none!important}#konva-container[data-v-b313ab6c]{z-index:3;width:100%;height:100%;cursor:pointer;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}.main_body[data-v-4b17bce0]{position:relative;width:100%;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.classification_title[data-v-4b17bce0]{margin:0 0 10px 0;color:#fff;font-size:14px;cursor:default}.toolbar[data-v-4b17bce0]{z-index:10;position:absolute;width:520px;padding:8px 16px;border-radius:6px;-webkit-box-shadow:0 2px 10px 0 rgba(6,29,44,.25);box-shadow:0 2px 10px 0 rgba(6,29,44,.25);background-color:#fff;top:10px;left:50%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform:translateX(-50%);transform:translateX(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.icon_toolbar[data-v-4b17bce0],.text_toolbar[data-v-4b17bce0]{float:left;width:32px;height:32px;padding:0!important;background-repeat:no-repeat;background-size:24px;background-position:50%}.icon_active[data-v-4b17bce0],.icon_toolbar[data-v-4b17bce0]:hover,.text_toolbar[data-v-4b17bce0]:hover{background-color:#eee}[data-v-4b17bce0].icon_color .el-color-picker__trigger{height:24px;margin-top:4px;width:24px!important}[data-v-4b17bce0].el-color-picker--medium,[data-v-4b17bce0].el-color-picker--medium .el-color-picker__trigger{width:24px!important;height:24px!important}.canvas_container[data-v-4b17bce0]{position:relative;width:100%;height:100%;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.canvas_container canvas[data-v-4b17bce0]{position:absolute;left:0}.canvas_container #ctx_front[data-v-4b17bce0]{z-index:5;background-color:transparent}.canvas_container #ctx_back[data-v-4b17bce0]{z-index:3}.canvas_container #ctx_base[data-v-4b17bce0]{z-index:1}#text[data-v-4b17bce0]{position:absolute;z-index:-1;resize:none;outline:none;border:1px dashed #9c9c9c;overflow:hidden;background:transparent;line-height:30px;display:none}#text[data-v-4b17bce0]:hover{border:1px dashed #53a8ff}#svg-component[data-v-2572c0e2],#svg-tigger[data-v-2572c0e2]{cursor:pointer;height:100%;width:100%;position:relative}#toolbar-show[data-v-2572c0e2]{z-index:20;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;background:#fff}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fl-web-component",
-  "version": "2.0.14",
+  "version": "2.0.16",
   "scripts": {
     "postinstall": "patch-package",
     "tip1": "仅调试本组件不涉及业务组件,请执行dev",

package/packages/components/com-flcanvas/index.vue

@@ -55,6 +55,8 @@ export default {
   data() {
     return {
       bounds: null,
+      bounds1:null,
+
     };
   },
   created() {
@@ -118,33 +120,61 @@ export default {
         };
         konvaStage.position(newPos);
       });
-      konvaStage.on('pointerdblclick', e => {
+      //双击鼠标滚轮
+      konvaStage.on("pointerdblclick", (e) => {
+        /*
         konvaStage.scale({
           x: 1,
           y: 1,
         });
-        let x = -parseFloat(this.bounds.minX);
-        let y = -parseFloat(this.bounds.minY);
+        let x=-parseFloat(this.bounds.minX);
+        let y =-parseFloat(this.bounds.minY);
 
         konvaStage.setX(x);
         konvaStage.setY(y); // 750
 
         //算一下舞台中点
-        let width = konvaStage.width();
-        let height = konvaStage.height();
-        let x1 = width / 2;
-        let y1 = height / 2;
+        let width=konvaStage.width();
+        let height=konvaStage.height()
+        let x1=width/2;
+        let y1=height/2;
 
         //算包围盒宽高
 
-        let boundsWidth = this.bounds.maxX - this.bounds.minX;
-        let boundsHeight = Math.abs(Math.abs(this.bounds.maxY) - Math.abs(this.bounds.minY));
+        let boundsWidth=this.bounds.maxX-this.bounds.minX;
+        let boundsHeight=Math.abs(Math.abs(this.bounds.maxY)-Math.abs(this.bounds.minY));
+
+        let x2=x+x1-(boundsWidth/2);
+        let y2=y+y1-(boundsHeight/2)
+
 
-        let x2 = x + x1 - boundsWidth / 2;
-        let y2 = y + y1 - boundsHeight / 2;
 
         konvaStage.setX(x2);
         konvaStage.setY(y2); // 750
+
+
+
+
+*/
+
+
+
+        const { scale, x, y } = this.calculateScaleAndPosition(
+                this.bounds,
+                konvaStage.width(),
+                konvaStage.height(),
+                0.05  // 5% 边距
+        );
+
+        console.log("test2:");
+        console.log(this.bounds)
+
+
+        konvaStage.position({ x: x, y: y });
+        konvaStage.scale({ x: scale, y: scale });
+
+        konvaStage.batchDraw();
+
       });
     });
 
@@ -153,6 +183,49 @@ export default {
   //销毁方法
 
   methods: {
+    calculateScaleAndPosition(contentBounds, stageWidth, stageHeight, padding = 0.1) {
+      // 1. 计算内容的实际宽高
+      const contentWidth = contentBounds.maxX - contentBounds.minX;
+      const contentHeight = contentBounds.maxY - contentBounds.minY;
+
+      // 2. 处理空内容或零宽高的边界情况
+      if (contentWidth <= 0 || contentHeight <= 0) {
+        return {
+          scale: 1,
+          x: stageWidth / 2,
+          y: stageHeight / 2
+        };
+      }
+
+      // 3. 计算可用区域（留出边距）
+      const availableWidth = stageWidth * (1 - padding * 2);
+      const availableHeight = stageHeight * (1 - padding * 2);
+
+      // 4. 计算缩放比例（取较小的那个，确保完全显示）
+      const scaleX = availableWidth / contentWidth;
+      const scaleY = availableHeight / contentHeight;
+      const scale = Math.min(scaleX, scaleY);
+
+      // 5. 计算缩放后的内容尺寸
+      const scaledWidth = contentWidth * scale;
+      const scaledHeight = contentHeight * scale;
+
+      // 6. 计算居中偏移量
+      // 内容中心点在缩放后的位置
+      const contentCenterX = (contentBounds.minX + contentBounds.maxX) / 2;
+      const contentCenterY = (contentBounds.minY + contentBounds.maxY) / 2;
+
+      // 画布中心点
+      const stageCenterX = stageWidth / 2;
+      const stageCenterY = stageHeight / 2;
+
+      // 偏移量 = 画布中心 - 内容中心 * 缩放
+      const x = stageCenterX - contentCenterX * scale;
+      const y = stageCenterY - contentCenterY * scale;
+
+      return { scale, x, y };
+    },
+
     updateBounds(v) {
       if (this.bounds === null) {
         this.bounds = { minX: v.x, maxX: v.x, minY: v.y, maxY: v.y };
@@ -169,6 +242,23 @@ export default {
         }
       }
     },
+    updateBounds1(v) {
+      if (this.bounds1 === null) {
+        this.bounds1 = { minX: v.x, maxX: v.x, minY: v.y, maxY: v.y }
+      } else {
+        if (v.x < this.bounds1.minX) {
+          this.bounds1.minX = v.x
+        } else if (v.x > this.bounds1.maxX) {
+          this.bounds1.maxX = v.x
+        }
+        if (v.y < this.bounds1.minY) {
+          this.bounds1.minY = v.y
+        } else if (v.y > this.bounds1.maxY) {
+          this.bounds1.maxY = v.y
+        }
+      }
+
+    },
     //思路是计算居中包围盒，然后排除脏数据。
     loadDxf(data) {
       let _this = this;
@@ -368,111 +458,172 @@ export default {
       //doc.text("Hello world!", 10, 10);
       //doc.save("a4.pdf");
     },
-    toPdfs(list) {
-      let _this = this;
+    toPdfs(list){
+
+      let _this=this;
       const pdf = new jsPDF('l', 'px', [konvaStage.width(), konvaStage.height()]);
       const exportPixelRatio = 2; // 可以 2/3/4 自己调
 
-      for (let i = 0; i < list.length; i++) {
-        let data = list[i];
+
+
+      for(let pageIdx  =0;pageIdx <list.length;pageIdx++){
+
+
+
+        let data=list[pageIdx];
         //先绘制图面
         konvaLayer.destroyChildren();
         const parser = new DxfParser();
         let dxf = parser.parse(data);
         let entities = formatEntity(dxf.entities);
         let layers = dxf.tables.layer.layers;
-        for (let key in entities) {
+
+        //先计算包围
+        for(let key in entities) {
           if (entities[key]) {
             let group = [];
-            let l = entities[key].length;
-            let layerConfig = recordLayerConfig[key];
-            let configParams =
-              layerConfig && Object.keys(layerConfig).length > 0 ? layerConfig : null;
+            let l = entities[key].length
+            let layerConfig = recordLayerConfig[key]
+            let configParams = layerConfig && Object.keys(layerConfig).length > 0 ? layerConfig : null
             for (let i = 0; i < l; i++) {
               let type = entities[key][i].type;
-              handleFn(
-                type,
-                dxf,
-                entities[key][i],
-                group,
-                key,
-                configParams,
-                konvaLayer,
-                recordLayerConfig
-              );
+              handleFn(type, dxf, entities[key][i], group, key, configParams, konvaLayer, recordLayerConfig)
             }
-            if (!konvaLayer) return;
+
             for (let i = 0; i < group.length; i++) {
+              let entity = group[i];
+              if (entity.type === 'line') {
+                let x1 = entity.x1;
+                let y1 = entity.y1;
+                let x2 = entity.x2;
+                let y2 = entity.y2;
+                let v1 = {};
+                v1.x = x1;
+                v1.y = y1;
+                let v2 = {};
+                v2.x = x2;
+                v2.y = y2;
+                _this.updateBounds1(v1);
+                _this.updateBounds1(v2);
+              }
+              if (entity.type === "polyline") {
+                let flag = false;
+                let points = entity.points;
+                let closed = entity.closed;
+
+                for (let j = 0; j < points.length; j++) {
+                  let index = j % 2;
+                  if (index === 0) {
+                    let x = points[j];
+                    let y = points[j + 1];
+                    let point = {};
+                    point.x = x;
+                    point.y = (y);
+                    _this.updateBounds1( point);
+                  }
+
+                }
+              }
+            }
+          }
+        }
+
+
+        console.log("bounds1");
+        console.log(_this.bounds1);
+
+        for (let key in entities) {
+
+
+
+          if (entities[key]) {
+            let group = [];
+            let l = entities[key].length
+            let layerConfig = recordLayerConfig[key]
+            let configParams = layerConfig && Object.keys(layerConfig).length > 0 ? layerConfig : null
+            for (let i = 0; i < l; i++) {
+              let type = entities[key][i].type;
+              handleFn(type, dxf, entities[key][i], group, key, configParams, konvaLayer, recordLayerConfig)
+            }
+            if (!konvaLayer) return
+            for(let i = 0; i < group.length;i++) {
               let entity = group[i];
               if (entity.type === 'text') {
+
                 if (konvaLayer) konvaLayer.add(entity.obj);
               }
             }
 
-            if (group[0].stroke == undefined) {
+
+            if( group[0].stroke==undefined){
               console.log(group);
-              group[0].stroke = '#000';
+              group[0].stroke='#000';
             }
-            let customShape = new Konva.Shape({
+
+
+
+
+
+            let  customShape = new Konva.Shape({
               x: 0,
               y: 0,
               strokeWidth: 0.2,
-              name: key.replace(/\s*/g, ''),
+              name: key.replace(/\s*/g, ""),
               entityId: key,
               stroke: group[0].stroke,
-              customColor: configParams ? configParams.color : '',
+              customColor: configParams ? configParams.color : "",
               //visible: configParams ? configParams.visible :true,
-              sceneFunc(context, shape) {
+              sceneFunc (context, shape) {
                 context.beginPath();
-                for (let i = 0; i < group.length; i++) {
+                for(let i = 0; i < group.length;i++){
                   let entity = group[i];
 
-                  if (entity.type === 'line') {
-                    context.strokeStyle = entity.stroke;
-                    let x1 = entity.x1;
-                    let y1 = entity.y1;
-                    let x2 = entity.x2;
-                    let y2 = entity.y2;
-                    if (x1 != undefined && y1 != undefined && x2 != undefined && y2 != undefined) {
+
+
+                  if(entity.type === 'line'){
+
+
+                    context.strokeStyle=entity.stroke;
+                    let x1=entity.x1;
+                    let y1=entity.y1;
+                    let x2=entity.x2;
+                    let y2=entity.y2;
+                    if(x1!=undefined&&y1!=undefined&&x2!=undefined&&y2!=undefined) {
                       context.moveTo(x1, -parseFloat(y1));
                       context.lineTo(x2, -parseFloat(y2));
                     }
-                    let v1 = {};
-                    v1.x = x1;
-                    v1.y = y1;
-                    let v2 = {};
-                    v2.x = x2;
-                    v2.y = y2;
-                    _this.updateBounds(v1);
-                    _this.updateBounds(v2);
+
+
+
                   }
-                  if (entity.type === 'polyline') {
-                    context.strokeStyle = entity.stroke;
+                  if(entity.type === "polyline"){
+                    context.strokeStyle=entity.stroke;
+
+                    let flag=false;
+
 
-                    let flag = false;
 
-                    let points = entity.points;
+                    let points=entity.points;
                     let closed = entity.closed;
 
-                    for (let j = 0; j < points.length; j++) {
+
+
+                    for(let j = 0; j < points.length; j++){
                       let index = j % 2;
-                      if (index === 0) {
+                      if(index === 0){
                         let x = points[j];
-                        let y = points[j + 1];
+                        let y = points[j+1];
 
-                        let point = {};
-                        point.x = x;
-                        point.y = y;
-                        _this.updateBounds(point);
 
-                        if (j === 0) {
+
+                        if(j === 0){
                           context.moveTo(x, y);
-                        } else {
-                          context.lineTo(x, y);
+                        }else{
+                          context.lineTo(x,y);
                         }
                       }
 
-                      if (closed) {
+                      if(closed) {
                         if (j === points.length - 1) {
                           context.lineTo(points[0], points[1]);
                         }
@@ -482,41 +633,81 @@ export default {
                 }
                 // context.closePath();
                 context.fillStrokeShape(shape);
-              },
+              }
             });
             if (konvaLayer) konvaLayer.add(customShape);
           }
         }
-        konvaStage.scale({
-          x: 2,
-          y: 2,
-        });
 
-        konvaStage.setX(0);
-        konvaStage.setY(750); // 750
+
+
+
+
+        const { scale, x, y } = this.calculateScaleAndPosition(
+                _this.bounds1,
+                konvaStage.width(),
+                konvaStage.height(),
+                0.05  // 5% 边距
+        );
+        console.log("test1:")
+        console.log(this.bounds1);
+
+        _this.bounds1=null;
+
+
+
+
+        konvaStage.position({ x: x, y: y });
+        konvaStage.scale({ x: scale, y: scale });
+
+        konvaStage.batchDraw();
         //添加成功移动视口位置
 
-        if (i == 0) {
+
+
+
+
+
+
+
+        if(pageIdx==0){
           pdf.addImage(
-            konvaStage.toDataURL({ pixelRatio: 2 }),
-            0,
-            0,
-            konvaStage.width(),
-            konvaStage.height()
+                  konvaStage.toDataURL({ pixelRatio: 2 }),
+                  0,
+                  0,
+                  konvaStage.width(),
+                  konvaStage.height()
           );
-        } else {
+
+        }else{
+
           pdf.addPage();
           pdf.addImage(
-            konvaStage.toDataURL({ pixelRatio: 2 }),
-            0,
-            0,
-            konvaStage.width(),
-            konvaStage.height()
+                  konvaStage.toDataURL({ pixelRatio: 2 }),
+                  0,
+                  0,
+                  konvaStage.width(),
+                  konvaStage.height()
           );
+
         }
+
+
+
+
+
+
+
+
       }
+      pdf.save("批量导出.pdf");
+
+
+
+
+
+
 
-      pdf.save('批量导出.pdf');
 
       // var imgData = canvas.toDataURL('image/png');
       //doc.text("Hello world!", 10, 10);