绿道一键通知

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
+})