[+] 重置流量

Co-authored-by: 夏沫花火zzz <[email protected]>

src/components/MainNav.vue

@@ -1,7 +1,7 @@
 <template>
   <UserInfo />
   <n-space vertical>
-    <n-layout>
+    <n-layout style="height: 100vh;">
       <n-layout-header :inverted="inverted" bordered>
         <n-space justify="space-between">
           <n-gradient-text

src/views/Dashboard.vue

@@ -3,16 +3,8 @@
     <i class="twa twa-compass"></i>
     <n-text type="primary"> 仪表盘</n-text>
   </n-h1>
-  <n-modal
-    v-model:show="showads"
-    class="custom-card"
-    preset="card"
-    style="width: 600px"
-    title="通知"
-    size="huge"
-    :bordered="false"
-    :segmented="{ content: 'soft', footer: 'soft' }"
-  >
+  <n-modal v-model:show="showads" class="custom-card" preset="card" style="width: 600px" title="通知" size="huge"
+    :bordered="false" :segmented="{ content: 'soft', footer: 'soft' }">
     <n-p v-html="ads_content"></n-p>
   </n-modal>
   <template v-if="notice.contents">
@@ -42,9 +34,7 @@
     </n-grid-item>-->
     <n-grid-item span="0:3 600:1">
       <n-card title="个人信息" size="medium">
-        <a
-          >您好，尊敬的 <a id="username">{{ username }}</a></a
-        >
+        <a>您好，尊敬的 <a id="username">{{ username }}</a></a>
         <br />
         <a>您的邮箱为：{{ email }}</a>
         <br />
@@ -94,13 +84,14 @@
             <a>{{ outbound }}<br />{{ inbound }}</a>
           </n-statistic>
         </n-space>
+        <!-- API: https://api-v2.locyanfrp.cn/api/v2/users/reset/traffic -->
+        <!-- 需要传入Params: username -->
+        <a>流量太多, 用不完?</a><n-button @click="resetTraffic" style="margin-left: 20px;margin-top: 10px;">重置流量</n-button>
       </n-card>
       <br />
       <n-alert title="关于高级功能" type="info">
         若需要 Frp 的高级功能, 你可以配置隧道后前往此处下载纯净版 Frp ：
-        <a href="https://github.com/LoCyan-Team/LoCyanFrpPureApp/releases" target="_blank"
-          >点击前往</a
-        >，<br />
+        <a href="https://github.com/LoCyan-Team/LoCyanFrpPureApp/releases" target="_blank">点击前往</a>，<br />
         下载适合自己系统架构的软件，随后即可自行配置。<br />
         注意：萌新使用此方法导致不会用的后果自行承担！<br />
       </n-alert>
@@ -136,10 +127,7 @@
       <n-card title="使用方法">
         <n-space vertical>
           <n-steps vertical :current="8">
-            <n-step
-              title="创建隧道"
-              description="点击隧道操作中的创建隧道，填写自己隧道的相应信息"
-            />
+            <n-step title="创建隧道" description="点击隧道操作中的创建隧道，填写自己隧道的相应信息" />
             <n-step title="软件下载" description="点击软件下载,下载最新版本" />
             <n-step title="启动客户端" description="启动客户端，登录自己的账号" />
             <n-step title="安装Frpc" description="前往 设置->FRPC->安装Frpc" />
@@ -158,10 +146,12 @@
 <script setup>
 import { ref } from 'vue'
 import clipboard from '../utils/clipboard'
-import { get } from '../utils/request.js'
+import { get } from '../utils/request'
 import { AngleRight, Key } from '@vicons/fa'
-import store from '../utils/stores/store.js'
+import store from '../utils/stores/store'
 import { marked } from 'marked'
+import { useDialog, useMessage } from "naive-ui";
+import { StartLoadingBar } from '../utils/loadingbar'
 
 localStorage.setItem('ViewPage', 'personality')
 const username = store.getters.get_username
@@ -174,6 +164,8 @@ const ProxiesRef = ref(null)
 const DontShowFrptoken = ref(true)
 const showads = ref(false)
 const ads_content = ref('')
+const dialog = useDialog();
+const message = useMessage();
 
 const notice_res = get('https://api.locyanfrp.cn/App', [])
 notice_res.then((res) => {
@@ -266,6 +258,28 @@ function howtosayhi() {
   }
 }
 
+async function resetTraffic() {
+  dialog.warning({
+    title: '警告',
+    content: '确定要重置流量吗？这将将剩余流量设置为 10 GiB',
+    positiveText: '确定',
+    negativeText: '还是算了~',
+    onPositiveClick: async () => {
+      StartLoadingBar()
+      const data = {
+        "username": store.getters.get_username
+      };
+      const rs = await get("https://api-v2.locyanfrp.cn/api/v2/users/reset/traffic", data);
+      if (rs.status === 200) {
+        message.success("重置成功!");
+      } else {
+        message.success("重置失败, API 返回: " + rs.data.msg);
+      }
+      FinishLoadingBar()
+    }
+  })
+}
+
 setInterval(() => {
   Proxiesanimation.value = Number(store.getters.get_proxies_num)
   traffic.value = Number(localStorage.getItem('traffic')) / 1024 + 'GB'