feat:完成了任务管理静态页面

src/layout/components/Sidebar/index.vue

@@ -64,9 +64,9 @@ const activeMenu = computed(() => {
 const isCollapse = computed(() => !sidebar.value.opened)
 
 onMounted(()=>{
-  // console.log(sidebar.value,'88888888888888');
-  // console.log(router.options.routes,'11111111111111111111111111111111111111111111');
-  // console.log(isCollapse,'6666666666666');
+  console.log(sidebar.value,'88888888888888');
+  console.log(router.options.routes,'11111111111111111111111111111111111111111111');
+  console.log(isCollapse,'6666666666666');
 })
 </script>
 

src/router/index.ts

@@ -221,6 +221,20 @@ export const constantRoutes: Array<RouteRecordRaw> = [
   } as unknown as RouteRecordRaw,
 
   {
+    path: "/os-taskManager",
+    redirect: "/os-status/list",
+    component: Layout,
+    children: [
+      {
+        path: "list",
+        name: "statusMonitor",
+        component: () => import("@/views/os-taskManager/index.vue"),
+        meta: { title: "任务管理", icon: "Key" }
+      },
+    ]
+  } as unknown as RouteRecordRaw,
+
+  {
     path: "/os-taskInformation",
     redirect: "/os-taskInformation/list",
     component: Layout,

src/views/os-taskManager/index.vue

+<template>
+    <div class="text-left p-10">
+        <el-form inline>
+            <el-form-item label="关键词搜索:">
+                <el-input v-model="searchInput" style="width: 220px" placeholder="Search" :prefix-icon="Search" />
+            </el-form-item>
+            <el-form-item>
+                <el-space>
+                    <el-button type="primary">查询</el-button>
+                    <el-button type="primary">创建任务</el-button>
+                    <el-button type="danger">批量删除</el-button>
+                </el-space>
+            </el-form-item>
+        </el-form>
+    </div>
+    <el-table :data="tableData" style="width: 100%" border>
+        <el-table-column type="selection" width="40" />
+        <el-table-column property="name" label="序号" width="55"/>
+        <el-table-column property="address" label="任务名称"  show-overflow-tooltip />
+        <el-table-column property="address" label="目标网址"  show-overflow-tooltip />
+        <el-table-column property="status" label="是否启用">
+            <template #default="scope">
+                <el-switch
+                    v-model="scope.row.status"
+                    :active-value="1"
+                    :inactive-value="2"
+                    active-color="#02538C"
+                    inactive-color="#B9B9B9"
+                    @change="changeSwitch(scope.row)"/>
+            </template>
+        </el-table-column>
+        <el-table-column property="address" label="执行频率"  show-overflow-tooltip />
+        <el-table-column property="address" label="执行次数" show-overflow-tooltip />
+        <el-table-column property="address" label="成功次数"  show-overflow-tooltip />
+        <el-table-column property="address" label="失败次数" width="200" show-overflow-tooltip />
+        <el-table-column property="address" label="异常记录" width="200" show-overflow-tooltip />
+        <el-table-column label="操作" width="220">
+            <template #default="scope">
+                <el-button size="small" plain type="primary" @click="handleDetails(scope.row)">
+                    编辑
+                </el-button>
+                <el-button size="small" plain type="success" @click="handleDetails(scope.row)">
+                    详情
+                </el-button>
+                <el-button size="small"  plain type="danger" @click="handleConfirm(scope.row)">
+                    删除
+                </el-button>
+            </template>
+        </el-table-column>
+    </el-table>
+    <div class="pagination w-full flex flex-row-reverse pr-4 m-t-4">
+        <Pagination :total="pageObj.total" v-model:page="pageObj.pageNo" v-model:limit="pageObj.pageSize"
+            @pagination="getData" />
+    </div>
+
+
+
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import Pagination from '@/components/pagination/index.vue'
+import { Search } from '@element-plus/icons-vue'
+
+const searchInput = ref('')
+
+const errorValue = ref('')
+const taskValue = ref('')
+const timeValue = ref('')
+const taskOptions = [
+    {
+        value: 'task1',
+        label: 'sk网',
+    },
+    {
+        value: 'task2',
+        label: 'nasa网',
+    },
+    {
+        value: 'task3',
+        label: '网',
+    },
+]
+const errorOptions = [
+    {
+        value: 'task1',
+        label: '网络中断',
+    },
+    {
+        value: 'task2',
+        label: '地址不存在',
+    },
+    {
+        value: 'task3',
+        label: '反爬虫',
+    },
+]
+const tableData = ref([
+    {
+        name: '1',
+        address: 'sk网',
+        address1: '成功',
+        address2: '100',
+        address3: '0',
+        address4: '无',
+        address5: '10s',
+        address6: '2023-05-13 10:00:00',
+        status:0
+    }
+])
+const pageObj = ref({
+    total: 10,
+    pageSize: 10,
+    pageNo: 1
+})
+const paginationSize = ref('default')
+const disabled = ref(false)
+const background = ref(false)
+const currentPage4 = ref(4)
+const pageSize4 = ref(10)
+
+const changeSwitch = (row: any) => {
+    console.log(row);
+}
+const handleSizeChange = (val: number) => {
+}
+const handleCurrentChange = (val: number) => {
+}
+const handleDetails = (row: any) => {
+    console.log(row);
+}
+
+const handleConfirm = (row: any) => {
+    console.log(row);
+}
+
+const getData = () => {
+    console.log('getData');
+}
+</script>
+
+<style scoped></style>