feat: image类型节点增加原图高宽度属性

src/components/customSettings/source/index.vue

@@ -3,6 +3,7 @@
     placement="top"
     trigger="hover"
     width="auto"
+    :disabled="!legalUrl"
     :content="url"
     >
     <img style="max-width: 200px;" v-if="url" :src="url" alt="" />
@@ -51,6 +52,9 @@ export default {
       } else {
         return '';
       }
+    },
+    legalUrl: function() {
+      return (this.swvalue + '').indexOf('//') > -1;
     }
   }
 };

src/store/modules/project.js

@@ -495,7 +495,9 @@ export const projectStore = {
 			});
 
 			if (_props.source) {
-				if (!_props.width || !_props.height) {
+				// imageWidth imageHeight
+				// 设置image类型节点的原图高宽度
+				if (!_props.imageWidth || !_props.imageHeight) {
 					let _url = _props.source; //_source.value;
 					if (_url.indexOf('asset://') === 0) {
 						let uuid = _url.split('//')[1];
@@ -505,8 +507,8 @@ export const projectStore = {
 					let _img = new Image();
 					_img.src = _url;
 					_img.onload = function () {
-						_props.width = _img.width;
-						_props.height = _img.height;
+						_props.imageWidth = _img.width;
+						_props.imageHeight = _img.height;
 						commit('modifyActiveView', {
 							properties: _props
 						});

src/utils/common.js

@@ -265,6 +265,11 @@ export const styles = {
 			});
 		}
 
+		if (component.type === 'image') {
+			cmpSelfProps.width = cmpSelfProps.width || cmpSelfProps.imageWidth;
+			cmpSelfProps.height = cmpSelfProps.height || cmpSelfProps.imageHeight;
+		}
+
 		// 获取拖拽组件的样式，只生成operatProps中的属性
 		if (onlyOpera) {
 			_.forIn(cmpSelfProps, (val, key) => {

src/utils/properties.js

@@ -194,6 +194,24 @@ export default {
       title: '来源',
       type: 'source',
       value: ''
+    },
+    imageWidth: {
+      title: '原图宽度',
+      type: 'input',
+      value: '',
+      desc: '原图片的宽度',
+      props: {
+        disabled: true
+      }
+    },
+    imageHeight: {
+      title: '原图高度',
+      type: 'input',
+      value: '',
+      desc: '原图片的高度',
+      props: {
+        disabled: true
+      }
     }
   },
   rect: {