From a9ffa322f0cf794a7da8182e1be4ca34f5ea19b6 Mon Sep 17 00:00:00 2001
From: chenlu <1320612696@qq.com>
Date: 星期五, 25 七月 2025 13:34:36 +0800
Subject: [PATCH] Merge branch 'master' of http://10.153.19.25:10105/r/ERP_override
---
north-glass-erp/northglass-erp/src/views/mm/basicData/canvas.vue | 695 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 692 insertions(+), 3 deletions(-)
diff --git a/north-glass-erp/northglass-erp/src/views/mm/basicData/canvas.vue b/north-glass-erp/northglass-erp/src/views/mm/basicData/canvas.vue
index ec0f121..9e895e8 100644
--- a/north-glass-erp/northglass-erp/src/views/mm/basicData/canvas.vue
+++ b/north-glass-erp/northglass-erp/src/views/mm/basicData/canvas.vue
@@ -1,7 +1,696 @@
+
+
+
+
+<script setup>
+import { Leafer, Polygon,Ellipse,Line,Path } from 'leafer-ui'
+import {nextTick, onMounted, onUnmounted, onUpdated, reactive, ref, watch} from "vue"
+import { saveAs } from 'file-saver';
+import DXFWriter from 'dxf-writer';
+import DxfParser from 'dxf-parser';
+import {round} from "xe-utils";
+import request from "@/utils/request";
+import {ElMessage} from "element-plus";
+
+let XMargin=ref(30)
+let YMargin=ref(30)
+let points=ref([])
+let data1=ref(0)
+let data2=ref(0)
+let data3=ref(0)
+let data4=ref(0)
+let data5=ref(0)
+let data6=ref(0)
+let data7=ref(0)
+let data8=ref(0)
+
+let datas1=ref(0)
+let datas2=ref(0)
+let datas3=ref(0)
+let datas4=ref(0)
+let datas5=ref(0)
+let datas6=ref(0)
+let datas7=ref(0)
+let datas8=ref(0)
+let big=0
+let leafer;
+
+onMounted(() => {
+ const main =document.getElementById('mains')
+ const width =document.getElementById('width')
+ const height =document.getElementById('height')
+ const iocn =document.getElementById('iocn')
+ width.innerHTML=1500
+ height.innerHTML=600
+ if(1500/400>600/300){
+ big=1500/400
+ }else{
+ big=600/300
+ }
+ let widthAgv=1500/big
+ let heightAgv=600/big
+ main.style.width=widthAgv+"px"
+ main.style.height=heightAgv+"px"
+ main.style.backgroundColor="white"
+ iocn.style.marginLeft=XMargin.value/big+"px"
+ iocn.style.marginTop=YMargin.value/big+"px"
+ datas2.value=heightAgv
+ datas8.value=heightAgv
+ datas5.value=widthAgv
+ datas7.value=widthAgv
+ leafer=new Leafer({ view: 'canvas' })
+
+ points.value=[0, heightAgv, 0, 0, widthAgv, 0, widthAgv,heightAgv]
+ const polygon = new Polygon({
+ points: points.value,
+ fill: '#32cd79',
+ origin: [0, 0],
+ scale:0.5
+ })
+ leafer.add(polygon)
+
+})
+const getproject = () => {
+ leafer=new Leafer({ view: 'canvas' })
+ points.value=[datas1.value+(parseInt(data1.value)/big), datas2.value-(parseInt(data2.value)/big), datas3.value+(parseInt(data3.value)/big), datas4.value+(parseInt(data4.value)/big),
+ datas5.value-(parseInt(data5.value)/big), datas6.value+(parseInt(data6.value)/big), datas7.value-(parseInt(data7.value)/big), datas8.value-(parseInt(data8.value)/big)]
+ const polygon = new Polygon({
+ points: points.value,
+ fill: '#32cd79',
+ origin: [0, 0]
+ })
+ leafer.add(polygon)
+
+}
+
+const exportToDXF = () => {
+ const dxf = new DXFWriter();
+ const polygonPoints = points.value.map((coord, index) => ({
+ x: index % 2 === 0 ? coord : undefined,
+ y: index % 2 !== 0 ? -coord : undefined
+ })).filter(point => point.x !== undefined && point.y !== undefined);
+
+ let arr=[]
+ for (let i=0;i<points.value.length;i++){
+ let a=[]
+ if(i % 2 === 0){
+ a.push(points.value[i]*big)
+ a.push((points.value[i+1]*big))
+ a.push(0)
+ arr.push(a)
+ }
+
+ }
+ let minX = Infinity, minY = Infinity;
+ let maxX = -Infinity, maxY = -Infinity;
+ arr.forEach(p => {
+ minX = Math.min(Math.abs(p[0]),minX );
+ minY = Math.min(Math.abs(p[1]),minY);
+ maxX = Math.max(Math.abs(p[0]),maxX );
+ maxY = Math.max(Math.abs(p[1]),maxY);
+ });
+
+ arr.forEach(p => {
+ p[1]=maxY-minY-p[1]
+ });
+
+
+ dxf.drawPolyline(arr,{ closed: true, layer: '0' })
+
+ const blob = new Blob([dxf.toDxfString()], { type: 'text/plain;charset=utf-8' });
+ saveAs(blob, 'map.dxf');
+}
+
+
+function toBottomOrigin(y, canvasHeight) {
+ return canvasHeight - y; // 灏嗗乏涓婅Y鍧愭爣杞崲涓哄乏涓嬭鍧愭爣绯�
+}
+
+function addPolygonAsLines(dxf, points, layer = '0') {
+ for (let i = 0; i < points.length; i++) {
+ const nextIdx = (i + 1) % points.length;
+ dxf.drawPolygon(
+ points[i].x, points[i].y,
+ points[nextIdx].x, points[nextIdx].y
+ );
+ }
+}
+
+const uploadToServer = (data, fileName) => {
+ request.post('/order/upload-dxf', {
+ fileName: fileName,
+ fileData: data
+ }, {
+ headers: {'Content-Type': 'application/json'}
+ });
+};
+
+const file = ref(null);
+const triggerFileSelect = () => {
+ request.post("/order/selectUploadDxf").then((res) => {
+ if (res.code === "200" ) {
+ console.log(res.data)
+ const b64Data = res.data.data.file_data;
+ const byteCharacters = atob(b64Data);
+ const parser = new DxfParser();
+ const dxfData = parser.parseSync(byteCharacters)
+ console.log(dxfData)
+ }
+ })
+};
+
+
+
+const fileToBase64 = (file) => {
+ return new Promise((resolve, reject) => {
+ const reader = new FileReader();
+ reader.onload = () => resolve(reader.result);
+ reader.onerror = reject;
+ reader.readAsDataURL(file);
+ });
+};
+
+const handleFileUpload = async (event) => {
+ const main = document.getElementById('mains')
+ const width = document.getElementById('width')
+ const height = document.getElementById('height')
+ leafer.removeAll()
+ leafer = new Leafer({view: 'canvas'});
+ const file = event.target.files[0];
+ try {
+ const base64 = await fileToBase64(file);
+ const pureBase64 = base64.replace(/^data:.+;base64,/, "");
+ uploadToServer(pureBase64, file.name)
+ } catch (error) {
+ console.error('杞崲澶辫触:', error);
+ }
+ if (file) {
+ const reader = new FileReader();
+ reader.onload = async (e) => {
+ const text = e.target.result;
+ try {
+ const parser = new DxfParser();
+ const dxfData = parser.parseSync(text);
+
+ let minX = Infinity, minY = Infinity;
+ let maxX = -Infinity, maxY = -Infinity;
+ dxfData.entities.forEach(entity => {
+ if (entity.type === 'LINE' || entity.type === 'LWPOLYLINE') {
+ entity.vertices.forEach(vertices => {
+ minX = Math.min(Math.abs(vertices.x), minX);
+ minY = Math.min(Math.abs(vertices.y), minY);
+ maxX = Math.max(Math.abs(vertices.x), maxX);
+ maxY = Math.max(Math.abs(vertices.y), maxY);
+ })
+ }
+ if (entity.type === 'ARC') {
+ const center = {x: entity.center.x, y: entity.center.y};
+ const radius = entity.radius;
+ const startAngle = entity.startAngle * (180 / Math.PI);
+ const endAngle = entity.endAngle * (180 / Math.PI);
+
+ const points = [];
+ const steps = 32;
+ for (let i = 0; i <= steps; i++) {
+ const angle = startAngle + (endAngle - startAngle) * (i / steps);
+ const x = center.x + radius * Math.cos(angle * Math.PI / 180);
+ const y = center.y + radius * Math.sin(angle * Math.PI / 180);
+ points.push({x, y});
+ }
+
+
+ points.forEach(p => {
+ minX = Math.min(minX, p.x);
+ minY = Math.min(minY, p.y);
+ maxX = Math.max(maxX, p.x);
+ maxY = Math.max(maxY, p.y);
+ });
+ }
+ });
+ if ((maxX - minX) / 400 > (maxY - minY) / 300) {
+ big = (maxX - minX) / 400
+ } else {
+ big = (maxY - minY) / 300
+ }
+
+ Object.values(dxfData.entities).forEach(entity => {
+ /*const bounds = drawEntity(entity);
+
+ if (bounds) {
+ minX = Math.min(minX, bounds.minX);
+ minY = Math.min(minY, bounds.minY);
+ maxX = Math.max(maxX, bounds.maxX);
+ maxY = Math.max(maxY, bounds.maxY);
+ }*/
+ switch (entity.type) {
+
+ case 'LINE':
+ /*main.style.width=(maxX-minX)+"px"
+ main.style.height=(maxY-minY)+"px"
+ width.innerHTML=round(maxX-minX,2)
+ height.innerHTML=round(maxY-minY,2)
+ const line = new Line({
+ points: [(Math.abs(entity.vertices[0].x)-minX)/big, toBottomOrigin((Math.abs(entity.vertices[0].y)-minY)/big,(maxY-minY)/big),
+ (Math.abs(entity.vertices[1].x)-minX)/big, toBottomOrigin((Math.abs(entity.vertices[1].y)-minY)/big,(maxY-minY)/big)],
+ stroke: '#f00',
+ strokeWidth: 2
+ })*/
+ main.style.width = (maxX - minX) / big + "px"
+ main.style.height = (maxY - minY) / big + "px"
+ width.innerHTML = round(maxX - minX, 2)
+ height.innerHTML = round(maxY - minY, 2)
+ const line = new Line({
+ points: [(Math.abs(entity.vertices[0].x) - minX) / big, ((maxY - minY) - (Math.abs(entity.vertices[0].y) - minY)) / big,
+ (Math.abs(entity.vertices[1].x) - minX) / big, ((maxY - minY) - (Math.abs(entity.vertices[1].y) - minY)) / big],
+ stroke: '#f00',
+ strokeWidth: 1
+ })
+ setTimeout(() => {
+ leafer.add(line);
+ }, 30);
+ break;
+ case 'LWPOLYLINE':
+
+ main.style.width = (maxX - minX) / big + "px"
+ main.style.height = (maxY - minY) / big + "px"
+ main.style.backgroundColor = "white"
+ width.innerHTML = round(maxX - minX, 2)
+ height.innerHTML = round(maxY - minY, 2)
+ let point = entity.vertices.map(v => [
+ (Math.abs(v.x) - minX) / big,
+ toBottomOrigin((Math.abs(v.y) - minY) / big, (maxY - minY) / big),
+ ]).flat()
+ const polygon = new Polygon({
+ points: point,
+ fill: '#32cd79',
+ })
+ setTimeout(() => {
+ leafer.add(polygon);
+ }, 30);
+
+ break;
+ case 'CIRCLE':
+ big = (entity.radius * 2) / 400
+ main.style.width = entity.radius * 2 / big + "px"
+ main.style.height = entity.radius * 2 / big + "px"
+ width.innerHTML = round(entity.radius * 2, 2)
+ height.innerHTML = round(entity.radius * 2, 2)
+ const ellipse = new Ellipse({
+ width: entity.radius * 2 / big,
+ height: entity.radius * 2 / big,
+ fill: "#32cd79"
+ })
+ setTimeout(() => {
+ leafer.add(ellipse);
+ }, 30);
+
+ break;
+ case 'ELLIPSE':
+ console.log(entity)
+
+ const {majorAxisEndPoint, axisRatio} = entity;
+
+ const dx = majorAxisEndPoint.x;
+ const dy = majorAxisEndPoint.y;
+ const a = Math.sqrt(dx ** 2 + dy ** 2);
+ const c = a * axisRatio;
+ const 胃 = Math.atan2(dy, dx);
+ const l = axisRatio * (180 / Math.PI);
+
+ if ((a * 2) / 400 > (c * 2) / 300) {
+ big = (a * 2) / 400
+ } else {
+ big = (c * 2) / 300
+ }
+
+ main.style.width = a * 2 / big + "px"
+ main.style.height = c * 2 / big + "px"
+ width.innerHTML = round(a * 2, 2)
+ height.innerHTML = round(c * 2, 2)
+ const ellipse2 = new Ellipse({
+ width: a * 2 / big,
+ height: c * 2 / big,
+ fill: "#32cd79",
+ })
+
+ setTimeout(() => {
+ leafer.add(ellipse2);
+ }, 30);
+
+ break;
+ case 'ARC':
+ const center = {x: entity.center.x, y: entity.center.y};
+ const radius = entity.radius;
+ const startAngle = entity.startAngle * (180 / Math.PI);
+ const endAngle = entity.endAngle * (180 / Math.PI);
+
+ if ((maxX - minX) / 400 > (maxY - minY) / 300) {
+ big = (maxX - minX) / 400
+ } else {
+ big = (maxY - minY) / 300
+ }
+
+
+ // 璁＄畻鍦嗗姬鐨勮捣鐐瑰拰缁堢偣
+ const startX = (center.x + radius * Math.cos(entity.startAngle) - minX);
+ const startY = (maxY - minY) - ((center.y + radius * Math.sin(entity.startAngle)) - minY);
+ const endX = (center.x + radius * Math.cos(entity.endAngle) - minX);
+ const endY = (maxY - minY) - ((center.y + radius * Math.sin(entity.endAngle)) - minY);
+
+ // 鍒涘缓鍦嗗姬璺緞
+ const path = new Path({
+ path: `M ${startX / big} ${startY / big} A ${radius / big} ${radius / big} 0 ${endAngle - startAngle > 180 ? 1 : 0} 0 ${endX / big} ${endY / big}`,
+ stroke: '#f00',
+ strokeWidth: 1,
+ });
+
+
+ setTimeout(() => {
+ leafer.add(path);
+ }, 30);
+
+
+ break;
+
+ }
+ })
+ // 鑷姩缂╂斁瑙嗗浘
+ /*if (minX !== Infinity) {
+ const width = maxX - minX;
+ const height = maxY - minY;
+ const centerX = (minX + maxX) / 2;
+ const centerY = (minY + maxY) / 2;
+
+ main.style.width=width/big+"px"
+ main.style.height=height/big+"px"
+
+ }*/
+
+ } catch (error) {
+ console.error('瑙ｆ瀽DXF鏂囦欢鏃跺嚭閿�:', error);
+ }
+ };
+ reader.readAsText(file);
+ }
+};
+
+function drawEntity(entity) {
+ switch (entity.type) {
+ case 'LWPOLYLINE':
+ return drawPolyline(entity);
+ case 'POLYLINE':
+ return drawPolyline(entity);
+ case 'LINE':
+ return drawLine(entity);
+ case 'CIRCLE':
+ return drawCircle(entity);
+ case 'ARC':
+ return drawArc(entity);
+ case 'SPLINE':
+ return drawSpline(entity);
+ default:
+ console.warn('Unsupported entity type:', entity.type);
+ return null;
+ }
+}
+
+let minX = Infinity, minY = Infinity;
+let maxX = -Infinity, maxY = -Infinity;
+// 缁樺埗澶氭绾�
+function drawPolyline(polyline) {
+ const points = polyline.vertices.map(v => {
+ return { x: Math.abs(v.x), y: Math.abs(v.y) }; // 缈昏浆Y鍧愭爣
+ });
+
+ // 澶勭悊闂悎澶氳竟褰�
+ if (polyline.flags && polyline.flags.includes('closed') && points.length > 0) {
+ points.push({...points[0]});
+ }
+
+ // 璁＄畻杈圭晫
+
+ points.forEach(p => {
+ minX = Math.min(p.x,minX);
+ minY = Math.min(p.y,minY);
+ maxX = Math.max(p.x,maxX);
+ maxY = Math.max(p.y,maxY);
+ });
+
+ let agvX=maxX-minX
+ let agvY=maxY-minY
+
+
+ // 鍒涘缓Leafer澶氳竟褰�
+ const polygon = new Polygon({
+ points: points.flatMap(p => [(p.x-minX)/big,(agvY-(p.y-minY))/big]),
+ fill: 'rgba(100, 150, 255, 0.3)',
+ stroke: '#32cd79',
+ strokeWidth: 2,
+ cornerRadius: 0,
+ draggable: true
+ });
+
+ // 淇濆瓨鍘熷DXF鏁版嵁
+ polygon.dxfData = {
+ type: polyline.type,
+ layer: polyline.layer || '0',
+ color: polyline.color || 7
+ };
+ setTimeout(() => {
+ leafer.add(polygon);
+ }, 30);
+
+
+ return { minX, minY, maxX, maxY };
+}
+
+// 缁樺埗鐩寸嚎
+function drawLine(line) {
+ const points = line.vertices.map(v => {
+ return { x: Math.abs(v.x), y: Math.abs(v.y) };
+ });
+
+ points.forEach(p => {
+ minX = Math.min(p.x,minX);
+ minY = Math.min(p.y,minY);
+ maxX = Math.max(p.x,maxX);
+ maxY = Math.max(p.y,maxY);
+ });
+
+ let agvX=maxX-minX
+ let agvY=maxY-minY
+
+ const lineObj = new Line({
+ points:[
+ (points[0].x-minX)/big,(agvY-(points[0].y-minY))/big,
+ (points[1].x-minX)/big,(agvY-(points[1].y-minY))/big
+ ],
+ stroke: '#32cd79',
+ strokeWidth: 2
+ });
+
+ setTimeout(() => {
+ leafer.add(lineObj);
+ }, 30);
+
+ return { minX, minY, maxX, maxY };
+}
+
+// 缁樺埗鍦�
+function drawCircle(circle) {
+ const center = { x: circle.center.x, y: circle.center.y };
+ const radius = circle.radius;
+
+ minX = center.x - radius;
+ minY = center.y - radius;
+ maxX = center.x + radius;
+ maxY = center.y + radius;
+
+ const circleObj = new Leafer.Ellipse({
+ x: center.x,
+ y: center.y,
+ radiusX: radius,
+ radiusY: radius,
+ fill: 'rgba(100, 150, 255, 0.3)',
+ stroke: '#32cd79',
+ strokeWidth: 2
+ });
+
+ circleObj.dxfData = {
+ type: 'CIRCLE',
+ layer: circle.layer || '0',
+ color: circle.color || 7
+ };
+
+ leafer.add(circleObj);
+
+ return { minX, minY, maxX, maxY };
+}
+
+// 缁樺埗鍦嗗姬
+function drawArc(arc) {
+ const center = { x: arc.center.x, y: arc.center.y };
+ const radius = arc.radius;
+ const startAngle = arc.startAngle*(180/Math.PI);
+ const endAngle = arc.endAngle*(180/Math.PI);
+
+ const points = [];
+ const steps = 32;
+ for (let i = 0; i <= steps; i++) {
+ const angle = startAngle + (endAngle - startAngle) * (i / steps);
+ const x = center.x + radius * Math.cos(angle * Math.PI / 180);
+ const y = center.y + radius * Math.sin(angle * Math.PI / 180);
+ points.push({ x, y });
+ }
+
+
+ points.forEach(p => {
+ minX = Math.min(minX, p.x);
+ minY = Math.min(minY, p.y);
+ maxX = Math.max(maxX, p.x);
+ maxY = Math.max(maxY, p.y);
+ });
+ let agvX=maxX-minX
+ let agvY=maxY-minY
+
+ // 璁＄畻鍦嗗姬鐨勮捣鐐瑰拰缁堢偣
+ const startX = (center.x-minX)/big + radius/big * Math.cos(arc.startAngle);
+ const startY = (agvY-(center.y-minY))/big + radius/big * Math.sin(arc.startAngle);
+ const endX = (center.x-minX)/big + radius/big * Math.cos(arc.endAngle);
+ const endY = (agvY-(center.y-minY))/big + radius/big * Math.sin(arc.endAngle);
+
+ // 鍒涘缓鍦嗗姬璺緞
+ const path = new Path({
+ path: `M ${endX} ${endY} A ${radius/big} ${radius/big} 0 ${endAngle - startAngle > 180 ? 1 : 0} 0 ${startX} ${startY}`,
+ stroke: '#32cd79',
+ strokeWidth: 2,
+ });
+
+
+ setTimeout(() => {
+ leafer.add(path);
+ }, 30);
+
+
+ return { minX, minY, maxX, maxY };
+}
+
+// 缁樺埗鏍锋潯鏇茬嚎锛堢畝鍖栧疄鐜帮級
+function drawSpline(spline) {
+ if (!spline.controlPoints || spline.controlPoints.length < 2) {
+ console.warn('Invalid SPLINE entity');
+ return null;
+ }
+
+ const points = spline.controlPoints.map(p => {
+ return { x: p.x, y: -p.y };
+ });
+
+ // 鍒涘缓鏍锋潯鏇茬嚎璺緞锛堜娇鐢ㄤ笁娆¤礉濉炲皵鏇茬嚎杩戜技锛�
+ let pathData = `M ${points[0].x} ${points[0].y}`;
+
+ if (points.length === 2) {
+ pathData += ` L ${points[1].x} ${points[1].y}`;
+ } else {
+ for (let i = 1; i < points.length; i++) {
+ const p0 = points[i-1];
+ const p1 = points[i];
+ const cp1x = p0.x + (p1.x - p0.x) / 3;
+ const cp1y = p0.y + (p1.y - p0.y) / 3;
+ const cp2x = p1.x - (p1.x - p0.x) / 3;
+ const cp2y = p1.y - (p1.y - p0.y) / 3;
+
+ pathData += ` C ${cp1x} ${cp1y}, ${cp2x} ${cp2y}, ${p1.x} ${p1.y}`;
+ }
+ }
+
+ const path = new Leafer.Path({
+ path: pathData,
+ stroke: '#32cd79',
+ strokeWidth: 2,
+ fill: 'none'
+ });
+
+ path.dxfData = {
+ type: 'SPLINE',
+ layer: spline.layer || '0',
+ color: spline.color || 7
+ };
+
+ leafer.add(path);
+
+ // 璁＄畻杈圭晫
+ points.forEach(p => {
+ minX = Math.min(minX, p.x);
+ minY = Math.min(minY, p.y);
+ maxX = Math.max(maxX, p.x);
+ maxY = Math.max(maxY, p.y);
+ });
+
+ return { minX, minY, maxX, maxY };
+}
+
+const handleInputX = (newValue) => {
+ const iocn =document.getElementById('iocn')
+ if(newValue+20*big<=1500){
+ iocn.style.marginLeft=newValue/big+"px"
+ }
+
+};
+const handleInputY = (newValue) => {
+ const iocn =document.getElementById('iocn')
+ iocn.style.marginTop=newValue/big+"px"
+};
+
+
+
+</script>
+
<template>
- <div>
- <input type="file" @change="onFileSelected" accept=".dxf" />
- <div ref="canvasContainer"></div>
+ <div style="width: 460px;height: 320px;justify-content: center;display: flex;">
+ <div>
+ <div id="width" style="height: 20px;"></div>
+ <div id="height" style="width: 60px;margin-left: -40px;"></div>
+ <div id="mains" style="margin-top: -20px" >
+ <div id="iocn" style="width: 20px;height: 20px;position: absolute;"></div>
+ <canvas id="canvas" ></canvas>
+ </div>
+ </div>
+
+
</div>
+
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data1" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data2" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data3" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data4" /><br>
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data5" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data6" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data7" />
+ <el-input class="contactNumber" @blur="getproject" type="text" v-model="data8" /><br>
+ <el-button type="primary" @click="exportToDXF">瀵煎嚭DXF</el-button>
+ <div>
+ <input type="file" @change="handleFileUpload" accept=".dxf" />
+ </div>
+ <el-input-number @input="handleInputX" v-model="XMargin"/>
+ <el-input-number @input="handleInputY" v-model="YMargin"/>
+
+ <button @click="triggerFileSelect">閫夋嫨鏂囦欢</button>
</template>
+<style>
+.contactNumber{
+ width: 60px;
+ height:20px;
+ border: none;
+ box-shadow: none;
+ font-size: 15px;
+}
+
+#mains {
+ position: relative;
+}
+input[type="file"] {
+ margin-top: 10px;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.8.0