🆕 新增热榜功能

views/components.html

@@ -192,6 +192,33 @@
 </button>
 {{end}}
 
+<!-- 热榜 -->
+{{define "hotTop"}}
+<button type="button"
+        class="{{ if eq .EnableHotTop true }}bg-green-600{{ else }}bg-gray-200{{ end }} relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-green-600 focus:ring-offset-2"
+        role="switch" aria-checked="false" onclick="changeUserHotTopStatus({{.Wxid}})">
+  <span
+    class="{{ if eq .EnableHotTop true }}translate-x-5{{ else }}translate-x-0{{ end }} pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out">
+    <span
+      class="{{ if eq .EnableHotTop true }}opacity-0 duration-100 ease-out{{ else }}opacity-100 duration-200 ease-in{{ end }} absolute inset-0 flex h-full w-full items-center justify-center transition-opacity"
+      aria-hidden="true">
+      <svg class="h-3 w-3 text-gray-400" fill="none" viewBox="0 0 12 12">
+        <path d="M4 8l2-2m0 0l2-2M6 6L4 4m2 2l2 2" stroke="currentColor" stroke-width="2" stroke-linecap="round"
+              stroke-linejoin="round"/>
+      </svg>
+    </span>
+    <span
+      class="{{ if eq .EnableHotTop true }}opacity-100 duration-200 ease-in{{ else }}opacity-0 duration-100 ease-out{{ end }} absolute inset-0 flex h-full w-full items-center justify-center transition-opacity"
+      aria-hidden="true">
+      <svg class="h-3 w-3 text-green-600" fill="currentColor" viewBox="0 0 12 12">
+        <path
+          d="M3.707 5.293a1 1 0 00-1.414 1.414l1.414-1.414zM5 8l-.707.707a1 1 0 001.414 0L5 8zm4.707-3.293a1 1 0 00-1.414-1.414l1.414 1.414zm-7.414 2l2 2 1.414-1.414-2-2-1.414 1.414zm3.414 2l4-4-1.414-1.414-4 4 1.414 1.414z"/>
+      </svg>
+    </span>
+  </span>
+</button>
+{{end}}
+
 
 <!-- 是否tag -->
 {{define "flagTag"}}

views/friend.html

@@ -103,6 +103,13 @@
                 </dd>
               </div>
 
+              <div class="flex justify-between gap-x-4 py-3">
+                <dt class="text-gray-500">热榜</dt>
+                <dd class="flex items-start gap-x-2">
+                  {{ template "hotTop" . }}
+                </dd>
+              </div>
+
               <div class="flex justify-between gap-x-4 py-3">
                 <dt class="text-gray-500">指令</dt>
                 <dd class="flex items-start gap-x-2">

views/group.html

@@ -117,6 +117,13 @@
                   {{ template "news" . }}
                 </dd>
               </div>
+              <!-- 热榜 -->
+              <div class="flex justify-between gap-x-4 py-3 items-center">
+                <dt class="text-gray-500">热榜</dt>
+                <dd class="flex items-start gap-x-2">
+                  {{ template "hotTop" . }}
+                </dd>
+              </div>
               <!-- 指令 -->
               <div class="flex justify-between gap-x-4 py-3 items-center">
                 <dt class="text-gray-500">指令</dt>

views/static/js/index.js

@@ -99,6 +99,25 @@ function changeUserNewsStatus(wxId) {
   })
 }
 
+// 修改用户热搜开启状态
+function changeUserHotTopStatus(wxId) {
+  axios({
+    method: 'put',
+    url: '/api/hot-top/status',
+    data: {
+      wxId: wxId
+    }
+  }).then(function (response) {
+    console.log(`返回结果: ${JSON.stringify(response)}`);
+    alert(`${response.data}`)
+  }).catch(function (error) {
+    console.log(`错误信息: ${error}`);
+    alert("修改失败")
+  }).finally(function () {
+    window.location.reload();
+  })
+}
+
 // 修改指令权限启用状态
 function changeCommandEnableStatus(wxId) {
   axios({