k94314517
2024-10-16 17efddc6a667670dca682bf36b51a43e99615e6d
h5/pages/notice/notice.vue
@@ -1,146 +1,141 @@
<template>
   <div class="container">
      <video src="https://vdept3.bdstatic.com/mda-nj7gwfue9kdnbtsh/sc/cae_h264/1665488517815949255/mda-nj7gwfue9kdnbtsh.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1715141591-0-0-6dfdf4d4c3d94b60b9adeb53368a72f3&bcevod_channel=searchbox_feed&pd=1&cr=2&cd=0&pt=3&logid=0791905773&vid=13790089500387859718&klogid=0791905773&abtest="></video>
      <scroll-view scroll-y class="content">
         <div class="title">安泰物流厂外来人员安全告知</div>
         <div class="text">
            <div>{{ content }}</div>
         </div>
         <div class="empty"></div>
      </scroll-view>
      <div class="button" @click="toapply">确认了解</div>
   </div>
  <view class="container">
    <!-- <video
      src="https://vdept3.bdstatic.com/mda-nj7gwfue9kdnbtsh/sc/cae_h264/1665488517815949255/mda-nj7gwfue9kdnbtsh.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1715141591-0-0-6dfdf4d4c3d94b60b9adeb53368a72f3&bcevod_channel=searchbox_feed&pd=1&cr=2&cd=0&pt=3&logid=0791905773&vid=13790089500387859718&klogid=0791905773&abtest="
    ></video> -->
    <scroll-view scroll-y class="content">
      <view>
        <view v-html="content"></view>
      </view>
      <view class="empty"></view>
    </scroll-view>
    <view class="button" :class="{ disable: num > 0 }" @click="toapply">
      已知晓,下一步
      <text v-if="num > 0">({{ num }}秒)</text>
    </view>
  </view>
</template>
<script>
   export default {
      name: 'Index',
      data() {
         return {
            content: `
            1确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            确认了解确认了解确认了解确认了解确认了解确认了解
            `,
            answer: ''
         }
      },
      onLoad() {
         // this.getInfo()
      },
      methods: {
         getInfo() {
            // 入场须知详情
            this.$u.api.getSystemDictData({
               dictCode: 'SYSTEM',
               label: 'VISIT_NOTICE'
            }).then(res => {
               if (res.code === 200) {
                  this.content = res.data.code
               }
            })
            // 是否需要答题
            this.$u.api.getSystemDictData({
               dictCode: 'SYSTEM',
               label: 'PROBLEM_VISIT_REQUIRED'
            }).then(res => {
               if (res.code === 200) {
                  this.answer = res.data.code
               }
            })
         },
         toapply() {
            if (this.answer === '0') {
               uni.navigateTo({
                  url: '/pages/userinfo/userinfo'
               })
            } else {
               uni.navigateTo({
                  url: '/pages/answer/answer'
               })
            }
         }
      }
   }
let timer
import { getSystemDictData } from "@/api"
export default {
  name: 'Index',
  data() {
    return {
      content: ``,
      answer: '',
      num: 5
    }
  },
  onLoad() {
    this.getInfo()
    if (!this.$store.state.openId) {
      // this.initToken()
    }
  },
  methods: {
    initToken() {
      const appID = 'wxac2a80c2144c4ee0'
      // const AppSecret = '922c93596d134fedf5bd22a9354b3bfe'
      let uri = encodeURIComponent('http://xiaopiqiu2.natapp1.cc/static/redirect.html')
      let authURL =
        `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appID}&redirect_uri=${uri}&response_type=code&scope=snsapi_base&state=123#wechat_redirect`
      window.location.href = authURL
    },
    getInfo() {
      // 入园须知详情
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'VISIT_NOTICE'
      }).then(res => {
        if (res.code === 200) {
          this.content = res.data.code
        }
      })
      // 倒计时时间
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'NOTICE_CUTNTDOWN'
      }).then(res => {
        if (res.code === 200) {
          this.num = res.data.code
          timer = setInterval(() => {
            this.num--
            if (this.num === 0) {
              clearInterval(timer)
            }
          }, 1000)
        }
      })
      // 是否需要答题
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'PROBLEM_VISIT_REQUIRED'
      }).then(res => {
        if (res.code === 200) {
          this.answer = res.data.code
        }
      })
    },
    toapply() {
      if (this.num > 0) return
      if (this.answer === '0') {
        uni.navigateTo({
          url: '/pages/userinfo/userinfo'
        })
      } else {
        uni.navigateTo({
          url: '/pages/answer/answer'
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
   .container {
      width: 100%;
      height: 100vh;
      padding: 10rpx 30rpx 0;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      video{
         width: 690rpx;
         height: 388rpx;
         margin-bottom: 10rpx;
      }
      .content {
         height: calc( 100% - 400rpx );
         .title{
            color: #333333;
            font-weight: 500;
            margin-bottom: 16rpx;
         }
         .text{
            font-weight: 350;
         }
         .empty{
            height: 160rpx;
         }
      }
      .button {
         width: 690rpx;
         height: 88rpx;
         line-height: 88rpx;
         text-align: center;
         background: #4d99a8;
         border-radius: 44rpx;
         font-size: 32rpx;
         color: #FFFFFF;
         position: absolute;
         bottom: 42rpx;
         left: 30rpx;
      }
   }
.container {
  width: 100%;
  height: 100vh;
  padding: 10rpx 30rpx 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  video {
    width: 690rpx;
    height: 388rpx;
    margin-bottom: 10rpx;
  }
  .content {
    height: calc(100% - 170rpx);
    .title {
      color: #333333;
      font-weight: 600;
      margin-bottom: 16rpx;
    }
    .text {
      font-weight: 350;
    }
    .empty {
      height: 160rpx;
    }
  }
  .button {
    width: 690rpx;
    height: 88rpx;
    line-height: 88rpx;
    text-align: center;
    background: #4d99a8;
    border-radius: 44rpx;
    font-size: 32rpx;
    color: #ffffff;
    position: fixed;
    bottom: 30rpx;
    left: 30rpx;
  }
  .disable {
    background-color: #cccccc;
  }
}
</style>