vue-vben-admin/apps/web-antd/src/views/spider/index.vue

<script lang="ts" setup>
import type { SpiderItem } from '@vben/common-ui';

import { ref } from 'vue';

import { SpiderListView, SpiderWorkView } from '@vben/common-ui';

import { sendWorkflow } from '#/api';

const spiderList = ref<SpiderItem[]>([
  {
    id: 'a2a55334-a111-45e6-942f-9f3f70af8826',
    name: '全国公共资源交易平台_数据爬取',
  },
  {
    id: 'c736edd0-925d-4877-9223-56aab7342311',
    name: '广州公共资源交易中心',
  },
]);
const spider = ref<SpiderItem>();

// const getFlowList = async () => {
//   const res = await getAppList({});
//   if (res) {
//     spiderList.value = res;
//     loading.value = false;
//   }
// };

function handleClick(item: SpiderItem) {
  spider.value = item;
}

// onMounted(() => {
//   getFlowList();
// });
</script>

<template>
  <div class="px-5">
    <div class="mt-5 flex flex-col lg:flex-row">
      <div class="mr-4 w-full lg:w-1/5">
        <SpiderListView
          :items="spiderList"
          title="数据爬取工具"
          @click="handleClick"
        />
      </div>
      <div class="w-full lg:w-4/5">
        <SpiderWorkView
          :item="spider"
          :run-spider="sendWorkflow"
          title="目标网址："
        />
      </div>
    </div>
  </div>
</template>