style: beautify u-parse

e-dialect · Mar 9, 2024 · 559c0d1 · 559c0d1
1 parent 61f13e8
commit 559c0d1
Show file tree

Hide file tree

Showing 9 changed files with 207 additions and 139 deletions.
diff --git a/src/utils/u-parse/components/IFramePlayer.vue b/src/utils/u-parse/components/IFramePlayer.vue
@@ -1,63 +1,71 @@
 <template>
   <view>
     <view v-if="visible">
-      <button type="warn">视频正在加载中……</button>
-      <web-view :src="src" style="position: fixed; top:7vh; right: 0vw; height:83vh">
-      </web-view>
+      <button type="warn">
+        视频正在加载中……
+      </button>
+      <web-view
+        :src="src"
+        style="position: fixed; top:7vh; right: 0vw; height:83vh"
+      />
       <button
-          style="position: fixed; bottom: 2vh; right: 0vw; z-index: 1024;width: 100vw"
-          type="primary"
-          @tap="visible=false"
+        style="position: fixed; bottom: 2vh; right: 0vw; z-index: 1024;width: 100vw"
+        type="primary"
+        @tap="visible=false"
       >
         返回
       </button>
     </view>
     <view v-else>
-      <button type="link" @tap="onTap">点击查看视频</button>
+      <button
+        type="link"
+        @tap="onTap"
+      >
+        点击查看视频
+      </button>
     </view>
   </view>
 </template>
 
 <script>
 export default {
-  name: "IFramePlayer",
+  name: 'IFramePlayer',
   props: {
     src: {
       type: String,
-      default: ""
-    }
+      default: '',
+    },
   },
   data() {
     return {
-      visible: false
-    }
+      visible: false,
+    };
   },
-  methods:{
-    onTap(){
+  methods: {
+    onTap() {
       // #ifdef MP
       uni.setClipboardData({
         data: this.src,
-        success: function () {
+        success() {
           uni.showToast({
             title: '已复制视频链接',
-          })
+          });
         },
-        fail: function () {
+        fail() {
           uni.showToast({
             title: '无法复制链接至剪切板，请手动复制',
-            icon: 'fail'
-          })
-          this.visible=true
-        }
+            icon: 'fail',
+          });
+          this.visible = true;
+        },
       });
       // #endif
       // #ifndef MP
       this.visible = true;
       // #endif
-
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style scoped>

diff --git a/src/utils/u-parse/components/wxParseAudio.vue b/src/utils/u-parse/components/wxParseAudio.vue
@@ -1,23 +1,25 @@
 <template>
   <!--增加audio标签支持-->
   <luch-audio
-      :id="node.attr.id"
-      :author="node.attr.author"
-      :class="node.classStr"
-      :loop="node.attr.loop"
-      :name="node.attr.name"
-      :poster="node.attr.poster"
-      :src="node.attr.src"
-      :style="node.styleStr"
-      controls></luch-audio>
+    :id="node.attr.id"
+    :author="node.attr.author"
+    :class="node.classStr"
+    :loop="node.attr.loop"
+    :name="node.attr.name"
+    :poster="node.attr.poster"
+    :src="node.attr.src"
+    :style="node.styleStr"
+    controls
+  />
 </template>
 
 <script>
-import LuchAudio from "@/uni_modules/luch-audio/components/luch-audio/luch-audio.vue";
+import LuchAudio from '@/uni_modules/luch-audio/components/luch-audio/luch-audio.vue';
+
 export default {
-  name: 'wxParseAudio',
-  components:{
-    LuchAudio
+  name: 'WxParseAudio',
+  components: {
+    LuchAudio,
   },
   props: {
     node: {

diff --git a/src/utils/u-parse/components/wxParseImg.vue b/src/utils/u-parse/components/wxParseImg.vue
@@ -1,30 +1,25 @@
 <template>
   <view>
-    <text v-if="errMsg">图片加载错误：{{ errMsg }}</text>
+    <text v-if="errMsg">
+      图片加载错误：{{ errMsg }}
+    </text>
     <image
-        v-else
-        :lazy-load="node.attr.lazyLoad"
-        :mode="node.attr.mode"
-        :src="node.attr.src"
-        :alt="node.attr.src"
-        :style="newStyleStr || node.styleStr"
-        @load="wxParseImgLoad"
-        @tap="wxParseImgTap(node.attr.src)"
-        @error="error"
+      v-else
+      :lazy-load="node.attr.lazyLoad"
+      :mode="node.attr.mode"
+      :src="node.attr.src"
+      :alt="node.attr.src"
+      :style="newStyleStr || node.styleStr"
+      @load="wxParseImgLoad"
+      @tap="wxParseImgTap(node.attr.src)"
+      @error="error"
     />
   </view>
 </template>
 
 <script>
 export default {
-  name: 'wxParseImg',
-  data() {
-    return {
-      newStyleStr: '',
-      preview: true,
-      errMsg: '',
-    };
-  },
+  name: 'WxParseImg',
   props: {
     node: {
       type: Object,
@@ -33,41 +28,48 @@ export default {
       },
     },
   },
+  data() {
+    return {
+      newStyleStr: '',
+      preview: true,
+      errMsg: '',
+    };
+  },
   methods: {
     error(e) {
-      this.errMsg = e.detail.errMsg
+      this.errMsg = e.detail.errMsg;
     },
     wxParseImgTap(src) {
       if (!this.preview) return;
       if (!src) return;
       let parent = this.$parent;
-      while (!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法
+      while (!parent.preview || typeof parent.preview !== 'function') { // TODO 遍历获取父节点执行方法
         parent = parent.$parent;
       }
       parent.preview(src);
     },
     // 图片视觉宽高计算函数区
     wxParseImgLoad(e) {
-      const {src} = e.currentTarget.dataset;
+      const { src } = e.currentTarget.dataset;
       if (!src) return;
-      const {width, height}           = e.mp.detail;
-      const recal                     = this.wxAutoImageCal(width, height);
-      const {imageheight, imageWidth} = recal;
-      const {padding, mode}           = this.node.attr;
-      const {styleStr}                = this.node;
-      const imageHeightStyle          = mode === 'widthFix' ? '' : `height: ${imageheight}px;`;
-      this.newStyleStr                = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`;
+      const { width, height } = e.mp.detail;
+      const recal = this.wxAutoImageCal(width, height);
+      const { imageheight, imageWidth } = recal;
+      const { padding, mode } = this.node.attr;
+      const { styleStr } = this.node;
+      const imageHeightStyle = mode === 'widthFix' ? '' : `height: ${imageheight}px;`;
+      this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`;
     },
     // 计算视觉优先的图片宽高
     wxAutoImageCal(originalWidth, originalHeight) {
       // 获取图片的原始长宽
-      const {padding}   = this.node.attr;
+      const { padding } = this.node.attr;
       const windowWidth = this.node.$screen.width - (2 * padding);
-      const results     = {};
+      const results = {};
 
       if (originalWidth < 60 || originalHeight < 60) {
-        const {src} = this.node.attr;
-        let parent  = this.$parent;
+        const { src } = this.node.attr;
+        let parent = this.$parent;
         while (!parent.preview || typeof parent.preview !== 'function') {
           parent = parent.$parent;
         }
@@ -78,11 +80,11 @@ export default {
       // 判断按照那种方式进行缩放
       if (originalWidth > windowWidth) {
         // 在图片width大于手机屏幕width时候
-        results.imageWidth  = windowWidth;
+        results.imageWidth = windowWidth;
         results.imageheight = windowWidth * (originalHeight / originalWidth);
       } else {
         // 否则展示原来的数据
-        results.imageWidth  = originalWidth;
+        results.imageWidth = originalWidth;
         results.imageheight = originalHeight;
       }