绿道一键通知

4 years ago · 9877553427
3 changed files with 149 additions and 3 deletions
--- a/aaa.html
+++ b/aaa.html
@ -0,0 +1,36 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
 <head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  <title>插件模板</title>
  <link rel="stylesheet" href="https://unpkg.com/tailwindcss@2.2.4/dist/tailwind.css">
  <!-- <link rel="stylesheet" type="text/css" href="style.css" /> -->
  <!-- <script type="text/javascript" src="plugin.js"></script> -->
 </head>
 <body>
    <script>
      var test1 = function (x, y, text)
      {
      // eleId 自己定义的变量名，任意取
      // document.createElement ('marquee'); 勿改变
          var eleId = document.createElement ('marquee');
          eleId.style.position = 'absolute';
          eleId.style.left = x + 'px';
          eleId.style.top = y + 'px';
          eleId.innerText = text;
          document.body.appendChild (eleId);
      }
      window.onload = function ()
      {
      var abc = "下周一三五停电，下周二四六停水。请各位业主相互转告";
          test1 (10, 10, abc);
      }
    </script>
 </body>
 <style>
 </style>
 </html>
--- a/index.html
+++ b/index.html
@ -21,7 +21,107 @@
    <div class="w-full p-4 bg-gray-100">
 <!--      日常任务面板-->
      <div class="content p-3 h-46 bg-white rounded-lg">
-        <div class="h-6 mb-2 bg-gray-100"></div>
+        <div class="h-auto mb-2 bg-gray-100">
          <view data-pid="1402180561518333952" data-uid="1298194698783170560" data-rid="xxx" data-tid="xxx" data-did="xxx">
            <!--绿道一键通知-->
            <div data-root="p1419895620596146176">
              <!-- main -->
              <div style="position: relative;" class="h-9 overflow-hidden">
                <div class="txt text-2xl">
                  <!-- 请<span style="color: #f00">XXX</span>到<span style="color: #f00">XX号窗口</span>交费 -->
                </div>
              </div>
              <!-- main end -->
            </div>
          </view>
          <script id="p1419895620596146176">
            const p1419895620596146176 = {
              name: 'pluginNotice',
              init() {
                var dom = document.querySelector("div[data-root=p1419895620596146176]");
                var domBox = dom.parentNode;
                console.log('初始化');
                // 获取父元素携带的参数
                var userId = domBox.getAttribute("data-uid");
                console.log('userId: ', userId);
                // 初始化的时候 获取token
                this.getTokenByUserId(userId,dom);
              },
              // 获取token
              getTokenByUserId(userId,dom){
                var that = this
                var token = '';
                fetch(`https://www.tall.wiki/gateway/tall/v1.0/users/userId?userId=${userId}`)
                .then(function(response) {
                  return response.json();
                })
                .then(function(res) {
                  const { success, code, data, msg } = res;
                  if (success && code === 200) {
                      token = data.token;
                      // 查询当前项目的最新消息
                      that.getFirstAidRecord(token,dom)
                    } else {
                      alert(msg || '获取失败')
                    }
                });
              },
              /**
               * 查询当前项目的最新消息
               */
              getFirstAidRecord(token,dom) {
                var that = this
                const params = JSON.stringify({
                  param: {}
                });
                fetch('/getDate', {
                  method: 'POST',
                  body: params,
                  headers: new Headers({
                    'Authorization': 'Bearer ' + token ,'Content-Type': 'application/json;charset=utf-8'
                  })
                }).then(function(response) {
                  return response.json();
                }).catch(function(error){
                  console.error('Error:', error)
                }).then(function(res){
                  const { success, code, data, msg } = res;
                  if (success && code === 200) {
                    console.log('data: ', data);
                    that.setDate(data,dom)
                  } else {
                    alert(msg || '查询失败')
                  }
                })
              },
              // 界面渲染
              setDate(res,dom) {
                var textLeft = 0
                var oTxt = dom.querySelector('.txt'); //获取标签
                var offsetWidth = oTxt.offsetWidth
                oTxt.innerHTML = res.text
                setInterval(function (){
                  //通过定时器重复动作
                    oTxt.style.position = 'absolute';
                    textLeft -= 10;
                    oTxt.style.left = textLeft + 'px';
                    if(-textLeft >= offsetWidth){
                      textLeft = offsetWidth
                    }
                },300)
              }
            }
            p1419895620596146176.init()
          </script>
        </div>
        <div class="h-6 mb-2 bg-gray-100"></div>
        <div class="h-6 mb-2 bg-gray-100"></div>
        <div class="h-6 mb-2 bg-gray-100"></div>
@ -74,10 +174,10 @@
            <!--            示例插件1-->
            <button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="alert('hello')">测试组建1</button>
            <!--            示例插件2 id=100-->
-            <button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button>
+            <button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p200.show()">测试组建2</button>
            <script>
-              const p100 = {
+              const p200 = {
                name: 'hello tall plugin',
                show() {
                  alert(this.name)
--- a/route.js
+++ b/route.js
@ -5,3 +5,13 @@ get('/blog').to.json({
    title: 'Hello world'
  }
 })
 // 查询当前项目的最新消息
 post('/getDate').to.json({
  code: 200,
  msg: 'ok',
  data: {
    text: '请<span style="color: #f00">XXX</span>到<span style="color: #f00">XX号窗口</span>交费'
  },
  success: true
 })