guoxiaohuan 4 년 전
부모
커밋
458c1a1121
2개의 변경된 파일44개의 추가작업 그리고 20개의 파일을 삭제
  1. 27 17
      src/components/Rotation/src/rotation.vue
  2. 17 3
      src/views/equipment/eqDialog.vue

+ 27 - 17
src/components/Rotation/src/rotation.vue

@@ -5,7 +5,15 @@
 */
 <template>
     <div :class='[type==1?"rotationFull":(type==3?"rotationFullYlt":"rotation")]'>
-        <div v-if='rotationImg.length==1' class='rotationCon'>
+        <div v-if='rotationImg.length==1 && size=="width"' class='rotationConType'>
+            <!-- <img
+                src='https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1592807833&di=5adf17cda9f46c37696da5b1d0aec9dc&src=http://a3.att.hudong.com/14/75/01300000164186121366756803686.jpg'
+                alt
+            />-->
+            <img :src='rotationImg[0].url' alt ref='imgWidth' />
+            <!-- <img src='./3440.jpg' alt /> -->
+        </div>
+        <div v-else-if='rotationImg.length==1 && size=="height"' class='rotationCon'>
             <!-- <img
                 src='https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1592807833&di=5adf17cda9f46c37696da5b1d0aec9dc&src=http://a3.att.hudong.com/14/75/01300000164186121366756803686.jpg'
                 alt
@@ -23,7 +31,7 @@
 <script>
 export default {
     name: 'Rotation',
-    props: ['rotationImg', 'type'],
+    props: ['rotationImg', 'type', 'size'],
     data() {
         return {
             rotationImgs: [{ url: require('@/assets/images/login_back.png') }],
@@ -36,27 +44,12 @@ export default {
             if (this.type == 2) {
                 this.$emit('scan', val + 1)
             }
-        },
-        getImgInfo() {
-            let img = new Image()
-            img.src = this.myImg
-            const vm = this
-            img.onload = function() {
-                vm.$set(vm.imgInfo, 'width', img.width)
-                vm.$set(vm.imgInfo, 'height', img.height)
-                console.log(vm.imgInfo) // 打印图片信息
-            }
-            console.log(this.$refs.imgWidth)
         }
     },
     mounted() {
         if (this.type == 2) {
             this.changePic(1)
         }
-        if (this.rotation.length > 0) {
-            console.log(this.rotation.length)
-        }
-        this.getImgInfo()
     }
 }
 </script>
@@ -132,6 +125,23 @@ export default {
         // width: 100%;
         // min-height: 100%;
     }
+    .rotationConType {
+        height: 100%;
+        width: 100%;
+        overflow: auto;
+    }
+    /deep/ .el-carousel__item {
+        text-align: center;
+        background: #fff;
+    }
+    img {
+        width: 100%;
+        // height: 100%;
+        // object-fit: fill;
+        // min-width: 100%;
+        // width: 100%;
+        // min-height: 100%;
+    }
 }
 </style>
 <style lang="less">

+ 17 - 3
src/views/equipment/eqDialog.vue

@@ -19,7 +19,7 @@
             <div v-if='Object.keys(dialogInfo).length>0 && dialogInfo.children.length==0' style='margin:16px 0 0 24px;height:100%'>
                 <!-- 原理图 -->
                 <div v-if='dialogInfo.id.slice(2,4)=="YL"' style='width:100%;overflow:auto;height:100%;margin:0 auto'>
-                    <rotation type='3' v-if='rotationImg.length>0' :rotationImg='rotationImg'></rotation>
+                    <rotation type='3' v-if='rotationImg.length>0' :size='sizePic' :rotationImg='rotationImg'></rotation>
                 </div>
                 <!-- 土建装饰主要材料清单 -->
                 <tj-table v-else-if='dialogInfo.id.slice(0,4)=="TJQD"' :param='param'></tj-table>
@@ -112,7 +112,9 @@ export default {
             diff: '', //区分给水排水
             rotationImg: [],
             tabLabel: '',
-            tabCount: []
+            tabCount: [],
+            sizePic: '',
+            imgInfo: {}
         }
     },
     mounted() {},
@@ -208,7 +210,19 @@ export default {
             }
             queryPic({ getParams }).then(res => {
                 this.rotationImg = res.data || []
-                console.log(this.rotationImg)
+                this.rotationImg[0].url
+                let img = new Image()
+                img.src = this.rotationImg[0].url
+                const vm = this
+                img.onload = function() {
+                    vm.$set(vm.imgInfo, 'width', img.width)
+                    vm.$set(vm.imgInfo, 'height', img.height)
+                    if (vm.imgInfo.width > vm.imgInfo.height) {
+                        vm.sizePic = 'width'
+                    } else {
+                        vm.sizePic = 'height'
+                    }
+                }
             })
         },
         //原理图没图片不显示tab 因为供电和燃气系统没有tab所以分开判断