番剧管理页完成

2026-04-15 02:50:42 +08:00 · 2022-07-24 21:08:30 +08:00
parent ce1e6c3752
commit 5eb5077c40
15 changed files with 370 additions and 24 deletions
--- a/components.d.ts
+++ b/components.d.ts
@@ -8,18 +8,29 @@ export {}
 declare module '@vue/runtime-core' {
  export interface GlobalComponents {
    ElAside: typeof import('element-plus/es')['ElAside']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
    ElCol: typeof import('element-plus/es')['ElCol']
+    ElCollapse: typeof import('element-plus/es')['ElCollapse']
+    ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
    ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
    ElContainer: typeof import('element-plus/es')['ElContainer']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
    ElHeader: typeof import('element-plus/es')['ElHeader']
    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElInput: typeof import('element-plus/es')['ElInput']
    ElMain: typeof import('element-plus/es')['ElMain']
    ElMenu: typeof import('element-plus/es')['ElMenu']
    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
    ElMenuItemGroup: typeof import('element-plus/es')['ElMenuItemGroup']
    ElRow: typeof import('element-plus/es')['ElRow']
+    ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
+    ElSpace: typeof import('element-plus/es')['ElSpace']
    ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
    RouterLink: typeof import('vue-router')['RouterLink']
    RouterView: typeof import('vue-router')['RouterView']
+    ShowResults: typeof import('./src/components/ShowResults.vue')['default']
  }
 }
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue + TS</title>
+    <title>Auto_Bangumi</title>
  </head>
  <body>
    <div id="app"></div>
--- a/package.json
+++ b/package.json
@@ -9,8 +9,10 @@
    "preview": "vite preview"
  },
  "dependencies": {
+    "axios": "^0.27.2",
    "element-plus": "^2.2.10",
    "modern-normalize": "^1.1.0",
+    "pinia": "^2.0.16",
    "vue": "^3.2.37",
    "vue-global-api": "^0.4.1",
    "vue-router": "4"
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -5,8 +5,10 @@ specifiers:
  '@vicons/carbon': ^0.12.0
  '@vicons/utils': ^0.1.4
  '@vitejs/plugin-vue': ^3.0.0
+  axios: ^0.27.2
  element-plus: ^2.2.10
  modern-normalize: ^1.1.0
+  pinia: ^2.0.16
  sass: ^1.54.0
  typescript: ^4.6.4
  unplugin-auto-import: ^0.10.0
@@ -18,8 +20,10 @@ specifiers:
  vue-tsc: ^0.38.4

 dependencies:
+  axios: 0.27.2
  element-plus: 2.2.10_vue@3.2.37
  modern-normalize: 1.1.0
+  pinia: 2.0.16_j6bzmzd4ujpabbp5objtwxyjp4
  vue: 3.2.37
  vue-global-api: 0.4.1_vue@3.2.37
  vue-router: 4.1.2_vue@3.2.37
@@ -334,6 +338,19 @@ packages:
    resolution: {integrity: sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==}
    dev: false

+  /asynckit/0.4.0:
+    resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
+    dev: false
+
+  /axios/0.27.2:
+    resolution: {integrity: sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==}
+    dependencies:
+      follow-redirects: 1.15.1
+      form-data: 4.0.0
+    transitivePeerDependencies:
+      - debug
+    dev: false
+
  /balanced-match/1.0.2:
    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
    dev: true
@@ -371,6 +388,13 @@ packages:
      fsevents: 2.3.2
    dev: true

+  /combined-stream/1.0.8:
+    resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      delayed-stream: 1.0.0
+    dev: false
+
  /css-render/0.13.9:
    resolution: {integrity: sha512-n3C4ZH59rveBrUlAD7n0Ze9/gUMKa4dlH1C9CWKpGcIHR/xRcIVXzBGy1iw8WWq2ySmn2/ZqOpySQNAK5Pb6sw==}
    dependencies:
@@ -402,6 +426,11 @@ packages:
      ms: 2.1.2
    dev: true

+  /delayed-stream/1.0.0:
+    resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
+    engines: {node: '>=0.4.0'}
+    dev: false
+
  /element-plus/2.2.10_vue@3.2.37:
    resolution: {integrity: sha512-hJ+LlbRN3POu4Idl1LXB+SHSWdi+wwmdsoDXdQT2ynGuwzZsMYiusOooYXyEsPlrizeLibdnNGNDx4TIjXQvUg==}
    peerDependencies:
@@ -675,6 +704,25 @@ packages:
      to-regex-range: 5.0.1
    dev: true

+  /follow-redirects/1.15.1:
+    resolution: {integrity: sha512-yLAMQs+k0b2m7cVxpS1VKJVvoz7SS9Td1zss3XRwXj+ZDH00RJgnuLx7E44wx02kQLrdM3aOOy+FpzS7+8OizA==}
+    engines: {node: '>=4.0'}
+    peerDependencies:
+      debug: '*'
+    peerDependenciesMeta:
+      debug:
+        optional: true
+    dev: false
+
+  /form-data/4.0.0:
+    resolution: {integrity: sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==}
+    engines: {node: '>= 6'}
+    dependencies:
+      asynckit: 0.4.0
+      combined-stream: 1.0.8
+      mime-types: 2.1.35
+    dev: false
+
  /fsevents/2.3.2:
    resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -793,6 +841,18 @@ packages:
      picomatch: 2.3.1
    dev: true

+  /mime-db/1.52.0:
+    resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
+    engines: {node: '>= 0.6'}
+    dev: false
+
+  /mime-types/2.1.35:
+    resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      mime-db: 1.52.0
+    dev: false
+
  /minimatch/5.1.0:
    resolution: {integrity: sha512-9TPBGGak4nHfGZsPBohm9AWg6NoT7QTCehS3BIJABslyZbzxfV78QM2Y6+i741OPZIafFAaiiEMh5OyIrJPgtg==}
    engines: {node: '>=10'}
@@ -846,6 +906,24 @@ packages:
    engines: {node: '>=8.6'}
    dev: true

+  /pinia/2.0.16_j6bzmzd4ujpabbp5objtwxyjp4:
+    resolution: {integrity: sha512-9/LMVO+/epny1NBfC77vnps4g3JRezxhhoF1xLUk8mZkUIxVnwfEAIRiAX8mYBTD/KCwZqnDMqXc8w3eU0FQGg==}
+    peerDependencies:
+      '@vue/composition-api': ^1.4.0
+      typescript: '>=4.4.4'
+      vue: ^2.6.14 || ^3.2.0
+    peerDependenciesMeta:
+      '@vue/composition-api':
+        optional: true
+      typescript:
+        optional: true
+    dependencies:
+      '@vue/devtools-api': 6.2.1
+      typescript: 4.7.4
+      vue: 3.2.37
+      vue-demi: 0.13.5_vue@3.2.37
+    dev: false
+
  /pkg-types/0.3.3:
    resolution: {integrity: sha512-6AJcCMnjUQPQv/Wk960w0TOmjhdjbeaQJoSKWRQv9N3rgkessCu6J0Ydsog/nw1MbpnxHuPzYbfOn2KmlZO1FA==}
    dependencies:
@@ -952,7 +1030,6 @@ packages:
    resolution: {integrity: sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==}
    engines: {node: '>=4.2.0'}
    hasBin: true
-    dev: true

  /unimport/0.6.2_vite@3.0.2:
    resolution: {integrity: sha512-dttI/EFWqIqc27Gdh6ptGZDBYPoPXVrj+cW1BVzccePSqSFONIL6yA1WmjG40yJlHX7HeFEZ7ZXF2/Yo+KoSHA==}
--- a/src/api/bangumi.ts
+++ b/src/api/bangumi.ts
@@ -0,0 +1,35 @@
+import axios from "axios";
+
+
+/**
+ * 添加番剧订阅
+ * @param type 'new' 添加新番， ’old‘ 添加旧番
+ * @param rss_link 
+ */
+const addBangumi = (type: string, rss_link: string) => {
+  if(type === 'new') {
+    return axios.post('/api/v1/subscribe', { rss_link });
+  } else if(type === 'old') {
+    return axios.post('/api/v1/collection', { rss_link });
+  } else {
+    console.error('type错误, type应为 new 或 old');
+    return false;
+  }
+}
+
+/**
+ *  获取AB存储的数据 
+ */
+const getABData = () => axios.get('/api/v1/data');
+
+/**
+ * 删除番剧规则
+ * @param {string} name 番名 (title_raw)
+ */
+const removeRule = (name: string) => axios.get(`/api/v1/removeRule/${name}`);
+
+export {
+  addBangumi,
+  getABData,
+  removeRule
+}
--- a/src/api/debug.ts
+++ b/src/api/debug.ts
@@ -0,0 +1,16 @@
+import axios from 'axios'
+
+/**
+ *  获取AB的日志 
+ */
+const getABLog = () => axios.get('/api/v1/log');
+
+/**
+ * 重置 AB 的数据，程序会在下一轮检索中重新添加 RSS 订阅信息。 
+ */
+const resetRule = () => axios.get('/api/v1/resetRule');
+
+export {
+  getABLog,
+  resetRule,
+}
--- a/src/components/ShowResults.vue
+++ b/src/components/ShowResults.vue
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+const props = defineProps<{
+  title: string,
+  results: object | null
+}>();
+
+const dialogVisible = ref(false);
+const handleClose = () => {
+  dialogVisible.value = false;
+}
+const open = () => {
+  dialogVisible.value = true;
+}
+
+defineExpose({
+  open
+})
+</script>
+
+<template>
+  <div class="dia-log">
+    <el-dialog
+      v-model="dialogVisible"
+      :title="title"
+      width="30%"
+      :before-close="handleClose"
+    >
+      <div>
+        <div class="results">
+          {{ results === null ? 'null' : results }}
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<style lang='scss' scope>
+.dia-log{
+  .results{
+    padding: 1em;
+    line-height: 1.5;
+    color: #fff;
+    background: #333;
+  }
+}
+</style>
--- a/src/pages/YBangumi.vue
+++ b/src/pages/YBangumi.vue
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-</script>
-
-<template>
-  <section class="bangumi">
-    <el-row>
-
-      <el-col>
-
-      </el-col>
-
-    </el-row>
-  </section>
-</template>
-
-<style lang='scss' scope>
-</style>
--- a/src/pages/YLayout.vue
+++ b/src/pages/YLayout.vue
@@ -13,13 +13,15 @@ import YMenu from './YMenu.vue';
        >
      </el-header>

-      <el-container>
+      <el-container style="overflow: hidden;">
        <el-aside width="200px">
          <YMenu />
        </el-aside>

        <el-main>
-          <RouterView />
+          <el-scrollbar>
+            <RouterView />
+          </el-scrollbar>
        </el-main>
      </el-container>
    </el-container>
--- a/src/pages/bangumi/components/AddBangumi.vue
+++ b/src/pages/bangumi/components/AddBangumi.vue
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import ShowResults from '@/components/ShowResults.vue';
+import { addBangumi } from '@/api/bangumi';
+
+const props = defineProps<{
+  type: string
+}>()
+
+const rssLink = ref();
+const loading = ref(false);
+const dialog = ref();
+const dialogData = ref(null);
+
+const add = async () => {
+  loading.value = true;
+  const res = await addBangumi(props.type, rssLink.value);
+  if (res){
+    loading.value = false;
+    dialogData.value = res.data;
+    dialog.value.open();
+  }
+}
+
+</script>
+
+<template>
+  <ShowResults
+    ref="dialog"
+    title="执行结果"
+    :results="dialogData"
+  />
+
+  <el-card shadow="hover">
+    <template #header>
+      <div class="card-header">
+        <span v-if="type === 'new'">订阅新番</span>
+        <span v-else-if="type === 'old'">订阅旧番</span>
+      </div>
+    </template>
+
+    <div class="card-con">
+      <el-input
+        v-model="rssLink"
+        placeholder="请输入番剧的rss链接"
+      >
+        <template #append>
+          <el-button
+            type="primary"
+            :loading="loading"
+            @click="add"
+          >订阅</el-button>
+        </template>
+      </el-input>
+    </div>
+
+  </el-card>
+</template>
--- a/src/pages/bangumi/components/BangumiData.vue
+++ b/src/pages/bangumi/components/BangumiData.vue
@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import ShowResults from '@/components/ShowResults.vue';
+import { getABData, removeRule } from '@/api/bangumi';
+
+const res = await getABData();
+const bangumiData = ref(res.data);
+console.log(res);
+
+const activeName = ref('1');
+const dialogData = ref(null);
+const dialog = ref();
+</script>
+
+<template>
+  <ShowResults
+    ref="dialog"
+    title="执行结果"
+    :results="dialogData"
+  />
+
+  <div class="bangumi-data">
+    <el-collapse
+      accordion
+      v-model="activeName"
+    >
+
+      <el-collapse-item
+        title="已订阅番剧"
+        name="1"
+      >
+        <span class="tips">注: 目前只能管理mikan源, 如通过api添加其他来源的新番将不过出现在此处</span>
+        <el-table
+          :data="bangumiData.bangumi_info"
+          stripe
+          border
+          style="width: 100%"
+          max-height="40vh"
+        >
+          <el-table-column
+            prop="official_title"
+            label="番名"
+            min-width="250"
+          />
+          <el-table-column
+            prop="season"
+            label="季度"
+            width="60"
+          />
+          <el-table-column
+            prop="dpi"
+            label="分辨率"
+          />
+          <el-table-column
+            prop="subtitle"
+            label="字幕"
+          />
+          <el-table-column
+            prop="group"
+            label="字幕组"
+          />
+        </el-table>
+      </el-collapse-item>
+
+    </el-collapse>
+  </div>
+</template>
+
+<style lang='scss' scope>
+.bangumi-data {
+  .tips {
+    line-height: 2;
+    color: #F56C6C;
+    display: inline-block;
+    margin-bottom: 10px;
+  }
+}
+</style>
--- a/src/pages/bangumi/index.vue
+++ b/src/pages/bangumi/index.vue
@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import BangumiData from './components/BangumiData.vue'
+import AddBangumi from './components/AddBangumi.vue'
+</script>
+
+<template>
+  <section class="bangumi">
+    <el-row>
+      <!-- S 番剧列表 -->
+      <el-col>
+        <BangumiData />
+      </el-col>
+      <!-- E 番剧列表 -->
+    </el-row>
+
+    <el-row :gutter="20">
+
+      <!-- S 添加新番 -->
+      <el-col :span="8">
+        <AddBangumi type="new" />
+      </el-col>
+      <!-- E 添加新番 -->
+
+      <!-- S 添加旧番 -->
+      <el-col :span="8">
+        <AddBangumi type="old" />
+      </el-col>
+      <!-- E 添加旧番 -->
+
+    </el-row>
+  </section>
+</template>
+
+<style lang='scss' scope>
+.el-row {
+  &:not(:last-child) {
+    margin-bottom: 20px;
+  }
+}
+</style>
--- a/src/pages/debug/index.vue
+++ b/src/pages/debug/index.vue
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,8 +1,8 @@
 import { createRouter, createWebHashHistory } from 'vue-router';

 const YLayout = () => import('../pages/YLayout.vue');
-const YBangumi = () => import('../pages/YBangumi.vue');
-const YDebug = () => import('../pages/YDebug.vue');
+const YBangumi = () => import('../pages/bangumi/index.vue');
+const YDebug = () => import('../pages/debug/index.vue');

 const routes = [
  {
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -25,7 +25,7 @@ export default defineConfig({
  server: {
    proxy: {
      '/api': {
-        target: 'http://192.168.0.2',
+        target: 'http://127.0.0.1:7892',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '/api')
      }