| | |
| | | import {ElMessage, ElMessageBox,} from "element-plus" |
| | | import request from "@/utils/request" |
| | | import {useRouter,useRoute} from "vue-router" |
| | | import {Ellipse, Leafer, Line, Path, Polygon} from "leafer-ui"; |
| | | import {Ellipse, Leafer, Line, Path, Polygon,Rect} from "leafer-ui"; |
| | | import {round} from "xe-utils"; |
| | | import DxfParser from "dxf-parser"; |
| | | import { saveAs } from 'file-saver'; |
| | | import DXFWriter from 'dxf-writer'; |
| | | import footSum from "@/hook/footSum"; |
| | | import deepClone from "@/utils/deepClone"; |
| | | |
| | | |
| | | const { t } = useI18n() |
| | |
| | | width.value=prop.rowIndex.width |
| | | height.value=prop.rowIndex.height |
| | | ongetproject(rowIndex.value) |
| | | |
| | | }) |
| | | |
| | | const emits = defineEmits(['getUploadPicture']) |
| | | |
| | | let fileName=ref(null) |
| | | let fileDate=ref(null) |
| | | let fileJson=ref({ |
| | | quadrilateral:null, |
| | | polygon:null |
| | | }) |
| | | let dxfData=ref(null) |
| | | let state=ref(false) |
| | | let states=ref(false) |
| | | let points=ref([]) |
| | | let pointsRound=ref([]) |
| | | let pointsRect=ref([]) |
| | | let pointsDrilling=ref([]) |
| | | let circle=ref({ |
| | | x:0, |
| | | y:0, |
| | | r:0 |
| | | }) |
| | | let rect=ref({ |
| | | x:0, |
| | | y:0, |
| | | w:0, |
| | | h:0 |
| | | }) |
| | | let drilling=ref({ |
| | | coordinates:0, |
| | | w:0, |
| | | h:0, |
| | | }) |
| | | 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 a1=ref(0);let a2=ref(0);let b1=ref(0);let b2=ref(0) |
| | | let c1=ref(0);let c2=ref(0);let d1=ref(0);let d2=ref(0) |
| | | let aValue=ref("0");let bValue=ref("0");let cValue=ref("0");let dValue=ref("0") |
| | | |
| | | let select1=ref("2");let select2=ref("2");let select3=ref("2");let select4=ref("2");let select5=ref("1") |
| | | let big=0 |
| | | let leafer; |
| | | let parsedDXFData = ref([]); |
| | |
| | | points.value=[0, heightAgv, 0, 0, widthAgv, 0, widthAgv,heightAgv] |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | fill: '#32cd79', |
| | | origin: [0, 0] |
| | | stroke: '#f00', |
| | | strokeWidth: 0, |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(polygon); |
| | | }, 30) |
| | | state.value=true |
| | | states.value=true |
| | | }else{ |
| | | const b64Data = row.fileData; |
| | | if(row.fileJson!=null){ |
| | | if(typeof row.fileJson === 'object' && row.fileJson !== null && !Array.isArray(row.fileJson)){ |
| | | fileJson.value=row.fileJson |
| | | }else{ |
| | | fileJson.value =JSON.parse(row.fileJson); |
| | | } |
| | | selectData(fileJson.value) |
| | | } |
| | | const byteCharacters = atob(b64Data); |
| | | const parser = new DxfParser(); |
| | | dxfData.value = parser.parseSync(byteCharacters) |
| | | state.value=false |
| | | |
| | | handleFileUpload() |
| | | xGrid.value.reloadData(pointsRect.value) |
| | | gridOptions.loading=false |
| | | } |
| | | |
| | | |
| | | } |
| | | |
| | | |
| | | const getproject = () => { |
| | | if (state.value){ |
| | | validate1() |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | | leafer = new Leafer({view: 'canvas'}) |
| | | points.value = [datas1.value + (parseInt(data5.value) / big), datas2.value - (parseInt(data6.value) / big), datas3.value + (parseInt(data1.value) / big), datas4.value + (parseInt(data2.value) / big), |
| | | datas5.value - (parseInt(data3.value) / big), datas6.value + (parseInt(data4.value) / big), datas7.value - (parseInt(data7.value) / big), datas8.value - (parseInt(data8.value) / big)] |
| | | fileJson.value.quadrilateral=[parseInt(data5.value),parseInt(data6.value),parseInt(data1.value),parseInt(data2.value), |
| | | parseInt(data3.value),parseInt(data4.value),parseInt(data7.value),parseInt(data8.value)] |
| | | fileJson.value.polygon=null |
| | | states.value=false |
| | | |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | fill: '#32cd79', |
| | | origin: [0, 0] |
| | | stroke: '#f00', |
| | | zIndex: 1 |
| | | }) |
| | | leafer.add(polygon) |
| | | load() |
| | | state.value=true |
| | | exportToDXF(1) |
| | | |
| | | } |
| | | |
| | | const add = () => { |
| | | if (state.value){ |
| | | const height = document.getElementById('height') |
| | | let x=parseInt(circle.value.x) |
| | | let y=parseInt(height.innerHTML)-parseInt(circle.value.y) |
| | | let r=parseInt(circle.value.r) |
| | | if(x>0 && y>0 && r>0){ |
| | | const ellipse = new Ellipse({ |
| | | x:x/ big, |
| | | y:(y-r*2)/ big, |
| | | width: r*2 / big, |
| | | height: r*2 / big, |
| | | stroke: '#f00', |
| | | zIndex: 3 |
| | | }) |
| | | leafer.add(ellipse); |
| | | //pointsRect.value.push({type:'round',x:x+r,y:y-r,r:r}) |
| | | pointsRect.value.push({id:pointsRect.value.length+1,type:'round',shap:"〇",x:x,y:y,width:r,x1:x,y1:parseInt(circle.value.y)}) |
| | | console.log(xGrid.value) |
| | | xGrid.value.loadData(deepClone(pointsRect.value)) |
| | | gridOptions.loading=false |
| | | circle.value.x=0 |
| | | circle.value.y=0 |
| | | circle.value.r=0 |
| | | exportToDXF(1) |
| | | }else{ |
| | | ElMessage.warning("请输入大于0的有效参数") |
| | | } |
| | | |
| | | } |
| | | } |
| | | |
| | | const addRect = () => { |
| | | if (state.value){ |
| | | const height = document.getElementById('height') |
| | | let x=parseInt(rect.value.x) |
| | | let ydesc=parseInt(height.innerHTML)-parseInt(rect.value.y) |
| | | let y=parseInt(rect.value.y) |
| | | let w=parseInt(rect.value.w) |
| | | let h=parseInt(rect.value.h) |
| | | if(x>0 && y>0 && w>0 && h>0){ |
| | | const rects = new Rect({ |
| | | x:x/big, |
| | | y:(ydesc-h)/big, |
| | | width:w/big, |
| | | height:h/big, |
| | | stroke: '#f00', |
| | | zIndex:2, |
| | | }) |
| | | |
| | | leafer.add(rects); |
| | | pointsRect.value.push({id:pointsRect.value.length+1,type:'rect',shap:"▢",x:x,y:y,width:w,height:h,x1:x,y1:y}) |
| | | xGrid.value.loadData(deepClone(pointsRect.value)) |
| | | gridOptions.loading=false |
| | | |
| | | rect.value.x=0 |
| | | rect.value.y=0 |
| | | rect.value.w=0 |
| | | rect.value.h=0 |
| | | exportToDXF(1) |
| | | }else{ |
| | | ElMessage.warning("请输入大于0的有效参数") |
| | | } |
| | | |
| | | } |
| | | } |
| | | |
| | | |
| | | const addDrilling = () => { |
| | | if (state.value){ |
| | | const width = parseInt(document.getElementById('width').innerHTML) |
| | | const height = parseInt(document.getElementById('height').innerHTML) |
| | | let coordinates=parseInt(drilling.value.coordinates) |
| | | let w=parseInt(drilling.value.w) |
| | | let h=parseInt(drilling.value.h) |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | | leafer=new Leafer({ view: 'canvas' }) |
| | | 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) |
| | | } |
| | | |
| | | } |
| | | if(coordinates>0 && w>0 && h>0){ |
| | | let potin=[] |
| | | let type=null |
| | | if(select5.value=='1'){ |
| | | type=4 |
| | | potin=[coordinates,0,coordinates,h,coordinates+w,h,coordinates+w,0] |
| | | }else if(select5.value=='2'){ |
| | | type=2 |
| | | potin=[coordinates+w,height,coordinates+w,height-h,coordinates,height-h,coordinates,height] |
| | | }else if(select5.value=='3'){ |
| | | type=1 |
| | | potin=[0,height-coordinates,w,height-coordinates,w,height-coordinates-h,0,height-coordinates-h] |
| | | } else if(select5.value=='4'){ |
| | | type=3 |
| | | potin=[width,height-coordinates-h,width-w,height-coordinates-h,width-w,height-coordinates,width,height-coordinates] |
| | | } |
| | | let arr1=[] |
| | | for (let i=0;i<potin.length;i++){ |
| | | let a=[] |
| | | if(i % 2 === 0){ |
| | | a.push(potin[i]) |
| | | a.push((potin[i+1])) |
| | | a.push(0) |
| | | arr1.push(a) |
| | | } |
| | | } |
| | | const distance = getDistancess(arr, arr1[0],type); |
| | | arr = [ |
| | | ...arr.slice(0, distance ), |
| | | ...arr1, |
| | | ...arr.slice(distance) |
| | | ]; |
| | | let aaa=[] |
| | | arr.forEach(item=>{ |
| | | aaa.push(item[0]/big) |
| | | aaa.push(item[1]/big) |
| | | }) |
| | | points.value=aaa |
| | | |
| | | |
| | | const polygon = new Polygon({ |
| | | points: aaa, |
| | | stroke: '#f00', |
| | | zIndex:2, |
| | | }) |
| | | leafer.add(polygon); |
| | | drilling.value.coordinates=0 |
| | | drilling.value.w=0 |
| | | drilling.value.h=0 |
| | | |
| | | load() |
| | | exportToDXF(1) |
| | | }else{ |
| | | ElMessage.warning("请输入大于0的有效参数") |
| | | } |
| | | |
| | | } |
| | | } |
| | | |
| | | function getDistance(p1, p2) { |
| | | const dx = p2[0] - p1[0]; |
| | | const dy = p1[1] - p2[1]; |
| | | return Math.sqrt(dx * dx + dy * dy); |
| | | } |
| | | |
| | | |
| | | function getDistancess(list,xy, fx) { |
| | | if (list == null || xy == null || xy.length != 3) { |
| | | return null; |
| | | } |
| | | let best = null; // 最优坐标 |
| | | let index = null; |
| | | switch (fx) { |
| | | case 1: // x轴递增:找x≥当前x的坐标中,x最小的;x相同则y最小的 |
| | | |
| | | for (let i=0;i<list.length;i++) { |
| | | let curr=list[i] |
| | | // 排除自身坐标 |
| | | if (curr[0] == xy[0] && curr[1] == xy[1]) { |
| | | continue; |
| | | } |
| | | // 筛选x≥目标x的坐标(只考虑递增方向的候选) |
| | | if (curr[0] < xy[0]) { |
| | | continue; |
| | | } |
| | | // 第一次找到候选,直接赋值 |
| | | if (best == null) { |
| | | best = xy; |
| | | continue; |
| | | } |
| | | if (curr[0] == best[0]) { |
| | | // x相同则比较y:y更小则更优 |
| | | if (curr[1] < best[1]) { |
| | | best = curr; |
| | | index=i |
| | | } |
| | | } |
| | | } |
| | | break; |
| | | |
| | | case 2: // x轴递减:找x≤当前x的坐标中,x最大的;x相同则y最大的 |
| | | for (let i=0;i<list.length;i++) { |
| | | let curr=list[i] |
| | | // 排除自身坐标 |
| | | if (curr[0] == xy[0] && curr[1] == xy[1]) { |
| | | continue; |
| | | } |
| | | // 筛选x≤目标x的坐标(只考虑递减方向的候选) |
| | | if (curr[0] > xy[0]) { |
| | | continue; |
| | | } |
| | | // 第一次找到候选,直接赋值 |
| | | if (best == null) { |
| | | best = xy; |
| | | continue; |
| | | } |
| | | if (curr[0] == best[0]) { |
| | | // x相同则比较y:y更小则更优 |
| | | if (curr[1] > best[1]) { |
| | | best = curr; |
| | | index=i |
| | | } |
| | | } |
| | | } |
| | | break; |
| | | |
| | | case 3: // y轴递增:找y≥当前y的坐标中,y最小的;y相同则x最小的 |
| | | for (let i=0;i<list.length;i++) { |
| | | let curr=list[i] |
| | | // 排除自身坐标 |
| | | if (curr[0] == xy[0] && curr[1] == xy[1]) { |
| | | continue; |
| | | } |
| | | // 筛选y≥目标y的坐标(只考虑递增方向的候选) |
| | | if (curr[1] < xy[1]) { |
| | | continue; |
| | | } |
| | | // 第一次找到候选,直接赋值 |
| | | if (best == null) { |
| | | best = xy; |
| | | continue; |
| | | } |
| | | if (curr[0] == best[0]) { |
| | | // x相同则比较y:y更小则更优 |
| | | if (curr[1] > best[1]) { |
| | | best = curr; |
| | | index=i |
| | | } |
| | | } |
| | | } |
| | | break; |
| | | |
| | | case 4: // y轴递减:找y≤当前y的坐标中,y最大的;y相同则x最大的 |
| | | for (let i=0;i<list.length;i++) { |
| | | let curr=list[i] |
| | | // 排除自身坐标 |
| | | if (curr[0] == xy[0] && curr[1] == xy[1]) { |
| | | continue; |
| | | } |
| | | // 筛选y≤目标y的坐标(只考虑递减方向的候选) |
| | | if (curr[1] > xy[1]) { |
| | | continue; |
| | | } |
| | | if (best == null) { |
| | | best = xy; |
| | | continue; |
| | | } |
| | | if (curr[1] == best[1]) { |
| | | // y相同则比较x:x更小则更优 |
| | | if (curr[0] > best[0]) { |
| | | best = curr; |
| | | index=i |
| | | } |
| | | } |
| | | } |
| | | break; |
| | | |
| | | default: // 无效方向 |
| | | return null; |
| | | } |
| | | |
| | | return index; |
| | | |
| | | |
| | | } |
| | | |
| | | const getproject2 = () => { |
| | | states.value=true |
| | | if (states.value){ |
| | | validate2() |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | | leafer=new Leafer({ view: 'canvas' }) |
| | | substringData() |
| | | points.value=[] |
| | | if(select3.value=="3"){ |
| | | points.value.push(datas1.value +parseInt(a1.value)/big,datas2.value,datas1.value +a1.value/big,datas2.value-parseInt(a2.value)/big,datas1.value,datas2.value-parseInt(a2.value)/big) |
| | | }else if(select3.value=="2"){ |
| | | points.value.push(datas1.value +parseInt(a1.value)/big,datas2.value,datas1.value,datas2.value-parseInt(a2.value)/big) |
| | | }else if(select3.value=="1"){ |
| | | points.value.push(datas1.value - (parseInt(data3.value) / big), datas2.value + (parseInt(data4.value) / big)) |
| | | } |
| | | |
| | | if(select1.value=="3"){ |
| | | points.value.push(datas3.value,datas4.value+parseInt(parseInt(b2.value))/big,datas3.value +parseInt(b1.value)/big,datas4.value+parseInt(b2.value)/big,datas3.value +parseInt(b1.value)/big,datas4.value) |
| | | }else if(select1.value=="2"){ |
| | | points.value.push(datas3.value,datas4.value+parseInt(parseInt(b2.value))/big,datas3.value +parseInt(b1.value)/big,datas4.value) |
| | | }else if(select1.value=="1"){ |
| | | points.value.push(datas3.value + (parseInt(data5.value) / big), datas4.value - (parseInt(data6.value) / big)) |
| | | } |
| | | |
| | | if(select2.value=="3"){ |
| | | points.value.push(datas5.value-parseInt(c1.value)/big,datas6.value,datas5.value -parseInt(c1.value)/big,datas6.value+parseInt(c2.value)/big,datas5.value,datas6.value +parseInt(c2.value)/big) |
| | | }else if(select2.value=="2"){ |
| | | points.value.push(datas5.value-parseInt(c1.value)/big,datas6.value,datas5.value,datas6.value +parseInt(c2.value)/big) |
| | | }else if(select2.value=="1"){ |
| | | points.value.push(datas5.value + (parseInt(data1.value) / big), datas6.value + (parseInt(data2.value) / big)) |
| | | } |
| | | |
| | | if(select4.value=="3"){ |
| | | points.value.push(datas7.value,datas8.value-parseInt(d2.value)/big,datas7.value -parseInt(d1.value)/big,datas8.value-parseInt(d2.value)/big,datas7.value -parseInt(d1.value)/big,datas8.value) |
| | | }else if(select4.value=="2"){ |
| | | points.value.push(datas7.value,datas8.value-parseInt(d2.value)/big,datas7.value -parseInt(d1.value)/big,datas8.value) |
| | | }else if(select4.value=="1"){ |
| | | points.value.push(datas7.value - (parseInt(data7.value) / big), datas8.value - (parseInt(data8.value) / big)) |
| | | } |
| | | |
| | | let state=0 |
| | | if(select1.value=="1"&&bValue.value!=="0"){ |
| | | state=parseInt(b1.value) |
| | | } |
| | | if(select2.value=="1"&&cValue.value!=="0"){ |
| | | state=parseInt(c1.value) |
| | | } |
| | | if(select3.value=="1"&&aValue.value!=="0"){ |
| | | state=parseInt(a1.value) |
| | | } |
| | | if(select4.value=="1"&&dValue.value!=="0"){ |
| | | state=parseInt(d1.value) |
| | | } |
| | | if((select1.value=="1"&&bValue.value!=="0")||(select2.value=="1"&&cValue.value!=="0")||(select3.value=="1"&&aValue.value!=="0")||(select4.value=="1"&&dValue.value!=="0")){ |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | stroke: '#f00', |
| | | zIndex:2, |
| | | cornerRadius: state/big |
| | | }) |
| | | leafer.add(polygon) |
| | | }else{ |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | stroke: '#f00', |
| | | zIndex:2, |
| | | }) |
| | | leafer.add(polygon) |
| | | } |
| | | |
| | | fileJson.value.polygon=[parseInt(a1.value),parseInt(a2.value),parseInt(b1.value),parseInt(b2.value), |
| | | parseInt(c1.value),parseInt(c2.value),parseInt(d1.value),parseInt(d2.value)] |
| | | |
| | | |
| | | load() |
| | | exportToDXF(1) |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | const exportToDXF = async (value) => { |
| | | 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++){ |
| | |
| | | |
| | | dxf.drawPolyline(arr,{ closed: true, layer: '0' }) |
| | | |
| | | |
| | | if (pointsRect.value.length > 0) { |
| | | |
| | | pointsRect.value.forEach(rect => { |
| | | if(rect.type=="round"){ |
| | | const x = rect.x+rect.width; |
| | | const y = maxY-minY-rect.y+rect.width; |
| | | const radius = rect.width; |
| | | if (dxf.drawCircle) { |
| | | dxf.drawCircle(x, y, radius, { layer: '0' }); |
| | | } |
| | | }else{ |
| | | let poist=[rect.x,rect.y, rect.x,(rect.y+rect.height),(rect.x+rect.width),(rect.y+rect.height),(rect.x+rect.width),rect.y] |
| | | |
| | | let arr=[] |
| | | for (let i=0;i<poist.length;i++){ |
| | | let a=[] |
| | | if(i % 2 === 0){ |
| | | a.push(poist[i]) |
| | | a.push((poist[i+1])) |
| | | 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); |
| | | }); |
| | | |
| | | |
| | | dxf.drawPolyline(arr,{ closed: true, layer: '0' }) |
| | | } |
| | | }); |
| | | } |
| | | const blob = new Blob([dxf.toDxfString()], {type: 'text/plain;charset=utf-8'}); |
| | | const base64 = await fileToBase64(blob); |
| | | if(value===1){ |
| | |
| | | const main = document.getElementById('mains') |
| | | const width = document.getElementById('width') |
| | | const height = document.getElementById('height') |
| | | validate() |
| | | //validate() |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | |
| | | const base64 = await fileToBase64(file); |
| | | const parser = new DxfParser(); |
| | | dxfData.value = parser.parseSync(text); |
| | | fileJson.value.quadrilateral=null |
| | | fileJson.value.polygon=null |
| | | handleFileUpload() |
| | | |
| | | fileName.value=file.name |
| | |
| | | } else { |
| | | big = (maxY - minY) / 250 |
| | | } |
| | | |
| | | let indexNumber=0 |
| | | Object.values(dxfData.value.entities).forEach(entity => { |
| | | switch (entity.type) { |
| | | case 'LINE': |
| | |
| | | points: [(entity.vertices[0].x - minX) / big, ((maxY - minY) - (entity.vertices[0].y- minY)) / big, |
| | | (entity.vertices[1].x - minX) / big, ((maxY - minY) - (entity.vertices[1].y - minY)) / big], |
| | | stroke: '#f00', |
| | | strokeWidth: 1 |
| | | strokeWidth: 1, |
| | | zIndex: 1 |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(line); |
| | | }, 30); |
| | | break; |
| | | case 'LWPOLYLINE': |
| | | let point = entity.vertices.map(v => [ |
| | | (v.x - minX) / big, |
| | | toBottomOrigin((v.y - minY) / big, (maxY - minY) / big), |
| | | ]).flat() |
| | | |
| | | if(indexNumber==0){ |
| | | main.style.width = (maxX - minX) / big + "px" |
| | | main.style.height = (maxY - minY) / big + "px" |
| | | main.style.backgroundColor = "#8d9095" |
| | | width.innerHTML = round(maxX - minX, 2) |
| | | height.innerHTML = round(maxY - minY, 2) |
| | | |
| | | let point = entity.vertices.map(v => [ |
| | | (v.x - minX) / big, |
| | | toBottomOrigin((v.y - minY) / big, (maxY - minY) / big), |
| | | ]).flat() |
| | | |
| | | |
| | | if(entity.vertices.length==4){ |
| | | if(fileJson.value!=null&&(fileJson.value.polygon!=null||fileJson.value.quadrilateral!=null)){ |
| | | points.value=point |
| | | isQuadrilateral(maxY,minY,maxX,minX,point) |
| | | } |
| | | if(type==1){ |
| | | const polygon = new Polygon({ |
| | | points: point, |
| | | stroke: '#f00' |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(polygon); |
| | | }, 30); |
| | | indexNumber=1 |
| | | }else{ |
| | | let point = entity.vertices.map(v => [ |
| | | (v.x - minX) / big, |
| | | (v.y - minY) / big, |
| | | ]).flat() |
| | | pointsRect.value.push({id:pointsRect.value.length+1,type:'rect',shap:"▢",x:entity.vertices[0].x,y:entity.vertices[0].y, |
| | | width:entity.vertices[2].x-entity.vertices[0].x, |
| | | height:entity.vertices[1].y-entity.vertices[0].y |
| | | ,x1:entity.vertices[0].x,y1:entity.vertices[0].y}) |
| | | } |
| | | |
| | | const polygon = new Polygon({ |
| | | points: point, |
| | | fill: "#32cd79" |
| | | stroke: '#f00', |
| | | zIndex: 1 |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(polygon); |
| | | }, 30); |
| | | } |
| | | |
| | | |
| | | |
| | | break; |
| | |
| | | CIRCLEX=0 |
| | | CIRCLEY=0 |
| | | } |
| | | |
| | | let x=entity.center.x-minX-entity.radius |
| | | let y=(maxY - minY)-(entity.center.y-minY-entity.radius) |
| | | pointsRect.value.push({id:pointsRect.value.length+1,type:'round',shap:"〇",x:x,y:y,width:entity.radius, |
| | | x1:x,y1:entity.center.y-minY-entity.radius}) |
| | | const ellipse = new Ellipse({ |
| | | x:CIRCLEX, |
| | | y:CIRCLEY, |
| | |
| | | height: entity.radius * 2 / big, |
| | | //fill: "#32cd79" |
| | | stroke: '#f00', |
| | | zIndex: 3 |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(ellipse); |
| | |
| | | const ellipse2 = new Ellipse({ |
| | | width: a * 2 / big, |
| | | height: c * 2 / big, |
| | | fill: "#32cd79", |
| | | stroke: '#f00', |
| | | }) |
| | | |
| | | setTimeout(() => { |
| | |
| | | break; |
| | | |
| | | } |
| | | |
| | | }) |
| | | } catch (error) { |
| | | console.error('解析DXF文件时出错:', error); |
| | | } |
| | | |
| | | }; |
| | | const selectData = (item) => { |
| | | if(item.quadrilateral!=null){ |
| | | state.value=true |
| | | data1.value=item.quadrilateral[2] |
| | | data2.value=item.quadrilateral[3] |
| | | data3.value=item.quadrilateral[4] |
| | | data4.value=item.quadrilateral[5] |
| | | data5.value=item.quadrilateral[0] |
| | | data6.value=item.quadrilateral[1] |
| | | data7.value=item.quadrilateral[6] |
| | | data8.value=item.quadrilateral[7] |
| | | } |
| | | if(item.polygon!=null){ |
| | | a1.value=item.polygon[0] |
| | | a2.value=item.polygon[1] |
| | | b1.value=item.polygon[2] |
| | | b2.value=item.polygon[3] |
| | | c1.value=item.polygon[4] |
| | | c2.value=item.polygon[5] |
| | | d1.value=item.polygon[6] |
| | | d2.value=item.polygon[7] |
| | | } |
| | | |
| | | } |
| | | |
| | | const validate = async () => { |
| | | data1.value=0 |
| | |
| | | big=0 |
| | | return true |
| | | } |
| | | |
| | | const validate1 = async () => { |
| | | a1.value=0 |
| | | a2.value=0 |
| | | b1.value=0 |
| | | b2.value=0 |
| | | c1.value=0 |
| | | c2.value=0 |
| | | d1.value=0 |
| | | d2.value=0 |
| | | aValue.value="0" |
| | | bValue.value="0" |
| | | cValue.value="0" |
| | | dValue.value="0" |
| | | } |
| | | const validate2 = async () => { |
| | | data1.value=0 |
| | | data2.value=0 |
| | | data3.value=0 |
| | | data4.value=0 |
| | | data5.value=0 |
| | | data6.value=0 |
| | | data7.value=0 |
| | | data8.value=0 |
| | | } |
| | | defineExpose({ |
| | | validate, |
| | | ongetproject |
| | |
| | | |
| | | const save = () => { |
| | | if(fileName.value!=null&&fileDate.value!=null){ |
| | | emits('getUploadPicture', fileName.value,fileDate.value) |
| | | fileJson.value.quadrilateral=[parseInt(data5.value),parseInt(data6.value),parseInt(data1.value),parseInt(data2.value), |
| | | parseInt(data3.value),parseInt(data4.value),parseInt(data7.value),parseInt(data8.value)] |
| | | if(fileJson.value.quadrilateral==null&&fileJson.value.polygon==null){ |
| | | fileJson.value=null |
| | | } |
| | | emits('getUploadPicture', fileName.value,fileDate.value,fileJson.value) |
| | | }else{ |
| | | ElMessage.warning("未参与修改") |
| | | } |
| | | |
| | | } |
| | | |
| | | const reset = () => { |
| | | |
| | | validate1() |
| | | validate2() |
| | | orderDetailWidth.value=rowIndex.value.width |
| | | orderDetailHeight.value=rowIndex.value.height |
| | | const main =document.getElementById('mains') |
| | | const width =document.getElementById('width') |
| | | const height =document.getElementById('height') |
| | | if(orderDetailWidth.value/400>orderDetailHeight.value/250){ |
| | | big=orderDetailWidth.value/400 |
| | | }else{ |
| | | big=orderDetailHeight.value/250 |
| | | } |
| | | let widthAgv=orderDetailWidth.value/big |
| | | let heightAgv=orderDetailHeight.value/big |
| | | main.style.width=widthAgv+"px" |
| | | main.style.height=heightAgv+"px" |
| | | main.style.backgroundColor = "#8d9095" |
| | | datas2.value=heightAgv |
| | | datas8.value=heightAgv |
| | | datas5.value=widthAgv |
| | | datas7.value=widthAgv |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | | leafer=new Leafer({ view: 'canvas' }) |
| | | points.value=[0, heightAgv, 0, 0, widthAgv, 0, widthAgv,heightAgv] |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | stroke: '#f00', |
| | | strokeWidth: 0, |
| | | }) |
| | | setTimeout(() => { |
| | | leafer.add(polygon); |
| | | }, 30) |
| | | state.value=true |
| | | states.value=true |
| | | |
| | | pointsRect.value=[] |
| | | xGrid.value.reloadData(deepClone(pointsRect.value)) |
| | | gridOptions.loading=false |
| | | |
| | | exportToDXF(1) |
| | | } |
| | | |
| | | const handleInputCircleX=(value)=> { |
| | | let val = value |
| | | .replace(/[^\d.]/g, 0) // 移除所有非数字和非小数点的字符 |
| | | .replace(/^\./g, '') // 移除开头的小数点 |
| | | .replace(/\.{2,}/g, '.') // 多个小数点只保留第一个 |
| | | .replace('.', '$#$') // 临时替换小数点 |
| | | .replace(/\./g, '') // 移除其他小数点 |
| | | .replace('$#$', '.') // 恢复小数点 |
| | | .replace(/^0+(\d)/, '$1'); // 移除开头多余的0(如"00123"变成"123") |
| | | // 如果输入为空则保持空字符串 |
| | | circle.value.x = val; |
| | | } |
| | | const handleInputCircleY=(value)=> { |
| | | let val = value |
| | | .replace(/[^\d.]/g, 0) // 移除所有非数字和非小数点的字符 |
| | | .replace(/^\./g, '') // 移除开头的小数点 |
| | | .replace(/\.{2,}/g, '.') // 多个小数点只保留第一个 |
| | | .replace('.', '$#$') // 临时替换小数点 |
| | | .replace(/\./g, '') // 移除其他小数点 |
| | | .replace('$#$', '.') // 恢复小数点 |
| | | .replace(/^0+(\d)/, '$1'); // 移除开头多余的0(如"00123"变成"123") |
| | | // 如果输入为空则保持空字符串 |
| | | circle.value.y = val; |
| | | } |
| | | const handleInputCircleR=(value)=> { |
| | | let val = value |
| | | .replace(/[^\d.]/g, 0) // 移除所有非数字和非小数点的字符 |
| | | .replace(/^\./g, '') // 移除开头的小数点 |
| | | .replace(/\.{2,}/g, '.') // 多个小数点只保留第一个 |
| | | .replace('.', '$#$') // 临时替换小数点 |
| | | .replace(/\./g, '') // 移除其他小数点 |
| | | .replace('$#$', '.') // 恢复小数点 |
| | | .replace(/^0+(\d)/, '$1'); // 移除开头多余的0(如"00123"变成"123") |
| | | // 如果输入为空则保持空字符串 |
| | | circle.value.r = val; |
| | | } |
| | | |
| | | const handleChange=(value)=> { |
| | | getproject2() |
| | | /*if(value=="1"){ |
| | | select1.value="1" |
| | | select2.value="1" |
| | | select3.value="1" |
| | | select4.value="1" |
| | | |
| | | }*/ |
| | | } |
| | | |
| | | const substringData = () =>{ |
| | | const indexA = aValue.value.indexOf("/"); |
| | | if(indexA==-1){ |
| | | a1.value=aValue.value |
| | | a2.value=aValue.value |
| | | }else{ |
| | | a1.value = aValue.value.substring(0, indexA); |
| | | a2.value = aValue.value.substring(indexA + 1); |
| | | } |
| | | const indexB = bValue.value.indexOf("/"); |
| | | if(indexB==-1){ |
| | | b1.value=bValue.value |
| | | b2.value=bValue.value |
| | | }else{ |
| | | b1.value = bValue.value.substring(0, indexB); |
| | | b2.value = bValue.value.substring(indexB + 1); |
| | | } |
| | | const indexC = cValue.value.indexOf("/"); |
| | | if(indexC==-1){ |
| | | c1.value=cValue.value |
| | | c2.value=cValue.value |
| | | }else{ |
| | | c1.value = cValue.value.substring(0, indexC); |
| | | c2.value = cValue.value.substring(indexC + 1); |
| | | } |
| | | const indexD = dValue.value.indexOf("/"); |
| | | if(indexD==-1){ |
| | | d1.value=dValue.value |
| | | d2.value=dValue.value |
| | | }else{ |
| | | d1.value = dValue.value.substring(0, indexD); |
| | | d2.value = dValue.value.substring(indexD + 1); |
| | | } |
| | | } |
| | | |
| | | const isQuadrilateral = (maxY,minY,maxX,minX,point) => { |
| | | state.value=true |
| | |
| | | datas6.value=0 |
| | | datas7.value=(maxX - minX) / big |
| | | datas8.value=(maxY - minY) / big |
| | | //points.value=[0, heightAgv, 0, 0, widthAgv, 0, widthAgv,heightAgv] |
| | | |
| | | let numbers = [point[0], point[2], point[4], point[6]]; // 示例数组 |
| | | let maxX1 = Math.max(...numbers); // 找到最大值 |
| | | let maxIndex = numbers.findIndex(num => num === maxX1); // 定位第一个匹配索引 |
| | | let remaining = [...numbers]; // 复制原数组避免突变 |
| | | remaining.splice(maxIndex, 1); // 仅移除第一个最大值实例 |
| | | let maxX2 = Math.max(...remaining); // 在剩余数组中找第二大值 |
| | | |
| | | let arr=[] |
| | | for (let i=0;i<point.length;i++){ |
| | | let a=[] |
| | | if(i % 2 === 0){ |
| | | a.push(point[i]) |
| | | a.push((point[i+1])) |
| | | arr.push(a) |
| | | } |
| | | |
| | | } |
| | | let x=[] |
| | | let y=[] |
| | | const gridOptions = reactive({ |
| | | border: "full",//表格加边框 |
| | | keepSource: true,//保持源数据 |
| | | align: 'center',//文字居中 |
| | | rowConfig: {isCurrent: true, isHover: true,height: 30},//鼠标移动或选择高亮 |
| | | id: 'UpdateAlienEditor', |
| | | |
| | | let upperRight=null //右上 |
| | | let lowerRight=null //右下 |
| | | let topLeft=null //左上 |
| | | let lowerLeft=null //左下 |
| | | |
| | | arr.forEach(item=>{ |
| | | if(item[0]==maxX1||item[0]==maxX2){ |
| | | x.push(item) |
| | | }else{ |
| | | y.push(item) |
| | | } |
| | | //表头参数 |
| | | columns:[ |
| | | {title: t('basicData.operate'), width: 60, slots: { default: 'button_slot' },fixed:"left"}, |
| | | {field: 'shap',width:60, title: t('order.shape')}, |
| | | {field: 'x1',width:60, title: t('X')}, |
| | | {field: 'y1',width:60, title: t('Y')}, |
| | | {field: 'width',width:60, title: t('')}, |
| | | {field: 'height',width:60, title: t('')}, |
| | | ] |
| | | }) |
| | | |
| | | if(x[0][1]>x[1][1]){ |
| | | lowerRight=x[0] |
| | | upperRight=x[1] |
| | | }else{ |
| | | upperRight=x[0] |
| | | lowerRight=x[1] |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | | case 'delete':{ |
| | | pointsRect.value=pointsRect.value.filter(item => item.id !== row.id); |
| | | xGrid.value.loadData(deepClone(pointsRect.value)) |
| | | gridOptions.loading=false |
| | | |
| | | if(leafer!==undefined){ |
| | | leafer.clear() |
| | | } |
| | | leafer=new Leafer({ view: 'canvas' }) |
| | | |
| | | const polygon = new Polygon({ |
| | | points: points.value, |
| | | stroke: '#f00', |
| | | zIndex: 1 |
| | | }) |
| | | leafer.add(polygon) |
| | | |
| | | load() |
| | | |
| | | exportToDXF(1) |
| | | |
| | | return |
| | | } |
| | | } |
| | | } |
| | | |
| | | if(y[0][1]>y[1][1]){ |
| | | lowerLeft=y[0] |
| | | topLeft=y[1] |
| | | }else { |
| | | topLeft=y[0] |
| | | lowerLeft=y[1] |
| | | } |
| | | const load= () =>{ |
| | | if (pointsRect.value.length > 0) { |
| | | |
| | | pointsRect.value.forEach(rect => { |
| | | if(rect.type=="round"){ |
| | | const height = document.getElementById('height') |
| | | let x=parseInt(rect.x) |
| | | let y=parseInt(rect.y) |
| | | let r=parseInt(rect.width) |
| | | const ellipse = new Ellipse({ |
| | | x:x/ big, |
| | | y:(y-r*2)/ big, |
| | | width: r*2 / big, |
| | | height: r*2 / big, |
| | | stroke: '#f00', |
| | | zIndex: 3 |
| | | }) |
| | | leafer.add(ellipse); |
| | | }else{ |
| | | const height = document.getElementById('height') |
| | | let x=parseInt(rect.x) |
| | | let ydesc=parseInt(height.innerHTML)-parseInt(rect.y) |
| | | let y=parseInt(rect.y) |
| | | let w=parseInt(rect.width) |
| | | let h=parseInt(rect.width) |
| | | const rects = new Rect({ |
| | | x:x/big, |
| | | y:(ydesc-h)/big, |
| | | width:w/big, |
| | | height:h/big, |
| | | stroke: '#f00', |
| | | zIndex:2, |
| | | }) |
| | | |
| | | if(lowerLeft[0]*big===0){ |
| | | data5.value=0 |
| | | }else{ |
| | | data5.value=round(lowerLeft[0]*big,0) |
| | | leafer.add(rects); |
| | | } |
| | | if(lowerLeft[1]*big===0){ |
| | | data6.value=0 |
| | | }else{ |
| | | data6.value=round(maxY-minY-lowerLeft[1]*big,0) |
| | | } |
| | | if(topLeft[0]*big===0){ |
| | | data1.value=0 |
| | | }else{ |
| | | data1.value=round(topLeft[0]*big,0) |
| | | } |
| | | if(topLeft[1]*big===0){ |
| | | data2.value=0 |
| | | }else{ |
| | | data2.value=round(topLeft[1]*big,0) |
| | | } |
| | | if(upperRight[0]*big===0){ |
| | | data3.value=0 |
| | | }else{ |
| | | data3.value=round(maxX-minX-upperRight[0]*big,0) |
| | | } |
| | | if(upperRight[1]*big===0){ |
| | | data4.value=0 |
| | | }else{ |
| | | data4.value=round(upperRight[1]*big,0) |
| | | } |
| | | if(lowerRight[0]*big===0){ |
| | | data7.value=0 |
| | | }else{ |
| | | data7.value=round(maxX-minX-lowerRight[0]*big,0) |
| | | } |
| | | if(lowerRight[1]*big===0){ |
| | | data8.value=0 |
| | | }else{ |
| | | data8.value=round(maxY-minY-lowerRight[1]*big,0) |
| | | }); |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | <template> |
| | | <div style="width: 404px;height: 254px;border: 2px solid #000;float: left; |
| | | position: relative;display: flex;justify-content: center;align-content: center;margin-left: 100px;margin-top: 25px;"> |
| | | position: relative;display: flex;justify-content: center;align-content: center;margin-left: 680px;margin-top: 25px;"> |
| | | <div id="mains" ref="parent" > |
| | | <canvas id="canvas" ></canvas> |
| | | </div> |
| | | </div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 37px;left: 300px;">{{orderDetailWidth}}</div> |
| | | <div id="height" style="width: 60px;position: absolute;top: 178px;left: 60px;">{{orderDetailHeight}}</div> |
| | | <div style="float: left;margin-top: 30px;margin-left: 150px"> |
| | | <div id="width" style="height: 20px;position: absolute;top: 37px;left: 880px;">{{orderDetailWidth}}</div> |
| | | <div id="height" style="width: 60px;position: absolute;top: 178px;left: 640px;">{{orderDetailHeight}}</div> |
| | | <div style="float: left;margin-top: 30px;margin-left: 730px"> |
| | | <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="data7" /> |
| | | <el-input class="contactNumber" @blur="getproject" type="text" v-model="data8" /><br> |
| | | </div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 342px;left: 145px;">{{$t('order.upper')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 364px;left: 145px;">{{$t('order.down')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 185px;">{{$t('order.horizontal')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 255px;">{{$t('order.vertical')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 320px;">{{$t('order.horizontal')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 385px;">{{$t('order.vertical')}}</div> |
| | | <div style="float: left;margin-top: 20px;margin-left: 80px;"> |
| | | <div id="width" style="height: 20px;position: absolute;top: 342px;left: 725px;">{{$t('order.upper')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 364px;left: 725px;">{{$t('order.down')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 767px;">{{$t('order.horizontal')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 825px;">{{$t('order.vertical')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 900px;">{{$t('order.horizontal')}}</div> |
| | | <div id="width" style="height: 20px;position: absolute;top: 322px;left: 965px;">{{$t('order.vertical')}}</div> |
| | | <div style="float: left;margin-top: 30px;margin-left: 690px;"> |
| | | <label for="file-upload" class="custom-file-upload"> |
| | | {{$t('order.selectFile')}} |
| | | </label> |
| | | <input id="file-upload" style="width: 180px;display: none;" type="file" @change="handleFile" accept=".dxf" /> |
| | | <el-button type="primary" style="margin-left: 20px" @click="exportToDXF(2)">{{$t('order.exportDXF')}}</el-button> |
| | | </div> |
| | | <div style="float: left;margin-top: 20px;margin-left: 80px;"> |
| | | <el-button type="primary" @click="reset()">{{$t('craft.reset')}}</el-button> |
| | | <el-button type="primary" @click="save()">{{$t('basicData.save')}}</el-button> |
| | | </div> |
| | | |
| | | <div style="position: absolute;margin-top: 373px;margin-left: 300px;"> |
| | | |
| | | <el-select v-model="select1" @change="handleChange" style="width: 100px;height: 40px;font-size: 8px"> |
| | | <el-option value="1" :label="$t('order.edgeAngleCurvature')"></el-option> |
| | | <el-option value="2" :label="$t('order.cuttingCorners')"></el-option> |
| | | <el-option value="3" :label="$t('order.fourCornerExcavation')"></el-option> |
| | | </el-select> |
| | | <el-select v-model="select2" @change="handleChange" style="width: 100px;height: 40px;font-size: 8px"> |
| | | <el-option value="1" :label="$t('order.edgeAngleCurvature')"></el-option> |
| | | <el-option value="2" :label="$t('order.cuttingCorners')"></el-option> |
| | | <el-option value="3" :label="$t('order.fourCornerExcavation')"></el-option> |
| | | </el-select><br> |
| | | <el-input class="contactNumber1" @blur="getproject2" type="text" v-model="bValue" /> |
| | | |
| | | <el-input class="contactNumber1" @blur="getproject2" type="text" v-model="cValue" /><br><br> |
| | | |
| | | <el-select v-model="select3" @change="handleChange" style="width: 100px;height: 40px;font-size: 8px"> |
| | | <el-option value="1" :label="$t('order.edgeAngleCurvature')"></el-option> |
| | | <el-option value="2" :label="$t('order.cuttingCorners')"></el-option> |
| | | <el-option value="3" :label="$t('order.fourCornerExcavation')"></el-option> |
| | | </el-select> |
| | | <el-select v-model="select4" @change="handleChange" style="width: 100px;height: 40px;font-size: 8px"> |
| | | <el-option value="1" :label="$t('order.edgeAngleCurvature')"></el-option> |
| | | <el-option value="2" :label="$t('order.cuttingCorners')"></el-option> |
| | | <el-option value="3" :label="$t('order.fourCornerExcavation')"></el-option> |
| | | </el-select><br> |
| | | |
| | | <el-input class="contactNumber1" @blur="getproject2" type="text" v-model="aValue" /> |
| | | |
| | | <el-input class="contactNumber1" @blur="getproject2" type="text" v-model="dValue" /> |
| | | </div> |
| | | |
| | | <div style="position: absolute;margin-left: 0px;border: black 1px solid;;width: 185px"> |
| | | <div style="font-size: 25px;width: 50px;height: 50px">〇</div> |
| | | <div style="position: absolute;margin-top: -35px;margin-left: 85px"> |
| | | <el-button type="primary" style="width: 60px;height: 30px" @click="add()">+</el-button> |
| | | </div> |
| | | <br> |
| | | <el-input class="contactNumber" @input="handleInputCircleX" type="text" v-model="circle.x" /> |
| | | <el-input class="contactNumber" @input="handleInputCircleY" type="text" v-model="circle.y" /> |
| | | <el-input class="contactNumber" @input="handleInputCircleR" type="text" v-model="circle.r" /><br><br> |
| | | |
| | | <div style="position: absolute;margin-top: -65px;margin-left: 25px;">X</div> |
| | | <div style="position: absolute;margin-top: -65px;margin-left: 85px;">Y</div> |
| | | <div style="position: absolute;margin-top: -65px;margin-left: 145px;">R</div> |
| | | </div> |
| | | |
| | | <div style="position: absolute;margin-left: 0px;margin-top: 150px;border: black 1px solid;;width: 185px"> |
| | | <div style="font-size: 25px;width: 50px;height: 50px">▢</div> |
| | | <div style="position: absolute;margin-top: -35px;margin-left: 85px"> |
| | | <el-button type="primary" style="width: 60px;height: 30px" @click="addRect()">+</el-button> |
| | | </div> |
| | | <br> |
| | | <el-input class="contactNumber" type="text" v-model="rect.x" /> |
| | | <el-input class="contactNumber" type="text" v-model="rect.y" /><br><br> |
| | | <el-input class="contactNumber" type="text" v-model="rect.w" /> |
| | | <el-input class="contactNumber" type="text" v-model="rect.h" /><br><br> |
| | | <div style="position: absolute;margin-top: -110px;margin-left: 55px;">X</div> |
| | | <div style="position: absolute;margin-top: -110px;margin-left: 115px;">Y</div> |
| | | <div style="position: absolute;margin-top: -63px;margin-left: 55px;">W</div> |
| | | <div style="position: absolute;margin-top: -63px;margin-left: 115px;">H</div> |
| | | </div> |
| | | |
| | | <div style="position: absolute;margin-top: 350px;margin-left: 0px;border: black 1px solid;;width: 185px;height: 170px"> |
| | | <div style="font-size: 25px;width: 50px;height: 50px">凹</div> |
| | | <div style="position: absolute;margin-top: -35px;margin-left: 85px"> |
| | | <el-button type="primary" style="width: 60px;height: 30px;margin-left: 10px;margin-top: -10px" @click="addDrilling()">+</el-button><br> |
| | | </div> |
| | | <el-select v-model="select5" style="width: 100px;height: 40px;font-size: 8px"> |
| | | <el-option value="1" :label="$t('order.upper')"></el-option> |
| | | <el-option value="2" :label="$t('order.down')"></el-option> |
| | | <el-option value="3" :label="$t('order.left')"></el-option> |
| | | <el-option value="4" :label="$t('order.right')"></el-option> |
| | | </el-select><br><br> |
| | | |
| | | <el-input class="contactNumber" type="text" v-model="drilling.coordinates" /> |
| | | <el-input class="contactNumber" type="text" v-model="drilling.w" /> |
| | | <el-input class="contactNumber" type="text" v-model="drilling.h" /> |
| | | <div style="position: absolute;margin-top: -42px;margin-left: 25px;">X</div> |
| | | <div style="position: absolute;margin-top: -42px;margin-left: 85px;">W</div> |
| | | <div style="position: absolute;margin-top: -42px;margin-left: 145px;">H</div> |
| | | |
| | | </div> |
| | | <div style="width: 400px;height:350px;position: absolute;margin-left: 220px;;text-align: center"> |
| | | <vxe-grid |
| | | height="100%" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | @mounted="handleGridMounted" |
| | | |
| | | > |
| | | <template #button_slot="{ row }"> |
| | | |
| | | <el-popconfirm @confirm="getTableRow(row,'delete')" :title="$t('searchOrder.deleteConfirm')"> |
| | | <template #reference> |
| | | <el-button :disabled="row.deliveryState===2" link type="primary" size="small">{{ $t('basicData.delete') }}</el-button> |
| | | </template> |
| | | </el-popconfirm> |
| | | </template> |
| | | </vxe-grid> |
| | | |
| | | </div> |
| | | |
| | | |
| | |
| | | box-shadow: none; |
| | | font-size: 15px; |
| | | } |
| | | .contactNumber1{ |
| | | width: 100px; |
| | | height:20px; |
| | | border: none; |
| | | box-shadow: none; |
| | | font-size: 15px; |
| | | } |
| | | .custom-file-upload { |
| | | border: 1px solid #ccc; |
| | | display: inline-block; |