Merge branch 'master' of dd.tall.wiki:binbin0314/green.v0.3

src/components/SettledEnterprise/FastEd.vue

@@ -0,0 +1,172 @@
+<template>
+  <div class="fast-box">
+    <div class="bg-box" style="flex: 1">
+      <div :key="a" v-for="a in 4"></div>
+    </div>
+    <div class="con-box" id="bobaodiv">
+      <div :key="item.a" class="flex-1 flex-row" style="height: 25%" v-for="item in dataList">
+        <div class="flex-1">{{ item.a }}</div>
+        <div class="flex-1">{{ item.b }}</div>
+        <div class="flex-1">{{ item.c }}</div>
+      </div>
+      <div :key="index" class="flex-1 flex-row" style="height: 25%" v-for="(item, index) in dataList">
+        <div class="flex-1">{{ item.a }}</div>
+        <div class="flex-1">{{ item.b }}</div>
+        <div class="flex-1">{{ item.c }}</div>
+      </div>
+    </div>
+    <div class="mask-box1"></div>
+    <div class="mask-box2"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'FastEd',
+  data() {
+    return {
+      str: 'FAST ED结果',
+      height: '',
+      width: '',
+      liHeight: '',
+      dataList: [
+        {
+          a: '1.面部对侧',
+          b: '正常',
+          c: '0分',
+        },
+        {
+          a: '2.上肢',
+          b: '中度无力',
+          c: '1分',
+        },
+        {
+          a: '3.语言运动',
+          b: '正常',
+          c: '0分',
+        },
+        {
+          a: '4.语言感觉',
+          b: '异常',
+          c: '1分',
+        },
+        {
+          a: '5.眼球凝视',
+          b: '一测活动困难',
+          c: '1分',
+        },
+      ],
+      oMarquee: null, //播报的容器
+      BBLineH: null,
+      BBScrollAmount: 1,
+      BBLineCount: 5,
+      rollRestTime: 500,
+      rollTime: 10,
+    };
+  },
+  mounted() {
+    this.BBLineH = document.getElementsByClassName('fast-box')[0].offsetHeight * 0.25;
+    this.scrollBox();
+  },
+  methods: {
+    scrollBox() {
+      /*
+       * 启动播报滚动事件
+       */
+      const that = this;
+
+      window.onload = function() {
+        // BBAllTime = 0;
+        that.oMarquee = document.getElementById('bobaodiv'); //滚动对象
+        window.setTimeout(function() {
+          that.run();
+        }, that.rollRestTime);
+      };
+    },
+    /*
+     * 播报滚动事件主逻辑
+     */
+    run() {
+      const that = this;
+      if (that.BBScrollAmount == 0) {
+        //若单次滚动的距离为0，则开始下一次监听，不计数
+        window.setTimeout(function() {
+          that.run();
+        }, that.rollTime);
+        return;
+      }
+      if (that.oMarquee.scrollTop >= that.BBLineCount * that.BBLineH) {
+        //滚动完一次数据后，复位
+        that.oMarquee.scrollTop = 0;
+      }
+      that.oMarquee.scrollTop += that.BBScrollAmount;
+      if (that.oMarquee.scrollTop % that.BBLineH < 1 && that.oMarquee.scrollTop > 0) {
+        window.setTimeout(function() {
+          that.run();
+        }, that.rollRestTime);
+      } else {
+        window.setTimeout(function() {
+          that.run();
+        }, that.rollTime);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="stylus" scoped>
+.bg-box {
+  height: 100%;
+
+  div {
+    height: 25%;
+  }
+
+  div:nth-of-type(even) {
+    background: #023567;
+  }
+}
+
+.fast-box {
+  position: relative;
+}
+
+.con-box {
+  top: 0;
+  left: 0;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  font-weight: 600;
+  font-size: 14px;
+  color: #eee;
+
+  div {
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+.mask-box1 {
+  height: 25%;
+  width: 100%;
+  background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(4, 25, 49, 1)), to(rgba(4, 25, 49, 0)));
+  // rgba(4, 25, 49, 0);
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 100;
+}
+
+.mask-box2 {
+  height: 25%;
+  width: 100%;
+  background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(2, 53, 103, 0)), to(rgba(2, 53, 103, 1)));
+  // rgba(4, 25, 49, 0);
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  z-index: 100;
+}
+</style>

src/components/SettledEnterprise/SettledEnterprise.vue

@@ -33,6 +33,38 @@ export default {
       height: '',
       width: '',
       liHeight: '',
+      dataList1: [
+        {
+          a: '1.面部对侧',
+          b: '正常',
+          c: '0分',
+        },
+        {
+          a: '2.上肢',
+          b: '中度无力',
+          c: '1分',
+        },
+        {
+          a: '3.语言运动',
+          b: '正常',
+          c: '0分',
+        },
+        {
+          a: '4.语言感觉',
+          b: '异常',
+          c: '1分',
+        },
+        {
+          a: '5.眼球凝视',
+          b: '一测活动困难',
+          c: '1分',
+        },
+        {
+          a: '5.眼球凝视',
+          b: '一测活动困难',
+          c: '1分',
+        },
+      ],
       dataList: [
         {
           a: '1.面部对侧',
@@ -74,19 +106,19 @@ export default {
   },
   methods: {
     scrollBox() {
-      console.log('滚动');
       /*
        * 启动播报滚动事件
        */
       const that = this;
 
-      window.onload = function() {
-        // BBAllTime = 0;
-        that.oMarquee = document.getElementById('bobaodiv'); //滚动对象
-        window.setTimeout(function() {
-          that.run();
-        }, that.rollRestTime);
-      };
+      // window.onload = function() {
+      // console.log('滚动');
+      // BBAllTime = 0;
+      that.oMarquee = document.getElementById('bobaodiv'); //滚动对象
+      window.setTimeout(function() {
+        that.run();
+      }, that.rollRestTime);
+      // };
     },
     /*
      * 播报滚动事件主逻辑